@laerdal/life-react-components 1.2.2-dev.9 → 1.3.1-dev.2

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 (434) hide show
  1. package/dist/esm/Accordion/AccordionItem.js +70 -0
  2. package/dist/esm/Accordion/AccordionItem.js.map +1 -0
  3. package/dist/esm/Accordion/AccordionMenu.js +61 -0
  4. package/dist/esm/Accordion/AccordionMenu.js.map +1 -0
  5. package/dist/esm/Accordion/__tests__/AccordionMenu.test.js +53 -0
  6. package/dist/esm/Accordion/__tests__/AccordionMenu.test.js.map +1 -0
  7. package/dist/esm/Accordion/index.js +4 -0
  8. package/dist/esm/Accordion/index.js.map +1 -0
  9. package/dist/esm/Accordion/styles.js +75 -0
  10. package/dist/esm/Accordion/styles.js.map +1 -0
  11. package/dist/esm/Banners/Banner.js +0 -1
  12. package/dist/esm/Banners/Banner.js.map +1 -1
  13. package/dist/esm/Breadcrumb/Breadcrumb.js.map +1 -1
  14. package/dist/esm/Button/BackButton.js +4 -4
  15. package/dist/esm/Button/BackButton.js.map +1 -1
  16. package/dist/esm/Button/Button.js +8 -53
  17. package/dist/esm/Button/Button.js.map +1 -1
  18. package/dist/esm/Button/Iconbutton.js +5 -2
  19. package/dist/esm/Button/Iconbutton.js.map +1 -1
  20. package/dist/esm/Button/__tests__/BackButton.test.js +4 -3
  21. package/dist/esm/Button/__tests__/BackButton.test.js.map +1 -1
  22. package/dist/esm/Chips/ActionChip.js +3 -2
  23. package/dist/esm/Chips/ActionChip.js.map +1 -1
  24. package/dist/esm/Chips/ChipInput.js +2 -1
  25. package/dist/esm/Chips/ChipInput.js.map +1 -1
  26. package/dist/esm/Chips/FilterChip.js +3 -2
  27. package/dist/esm/Chips/FilterChip.js.map +1 -1
  28. package/dist/esm/Chips/InputChip.js +3 -2
  29. package/dist/esm/Chips/InputChip.js.map +1 -1
  30. package/dist/esm/Dropdown/BasicDropdown.js +19 -12
  31. package/dist/esm/Dropdown/BasicDropdown.js.map +1 -1
  32. package/dist/esm/Dropdown/ChipDropdownInput.js +3 -2
  33. package/dist/esm/Dropdown/ChipDropdownInput.js.map +1 -1
  34. package/dist/esm/Dropdown/CommonStyling.js +71 -71
  35. package/dist/esm/Dropdown/CommonStyling.js.map +1 -1
  36. package/dist/esm/Dropdown/DropdownContent.js +13 -1
  37. package/dist/esm/Dropdown/DropdownContent.js.map +1 -1
  38. package/dist/esm/Dropdown/DropdownFilter.js +3 -4
  39. package/dist/esm/Dropdown/DropdownFilter.js.map +1 -1
  40. package/dist/esm/GlobalNavigationBar/Avatar.js +2 -2
  41. package/dist/esm/GlobalNavigationBar/Avatar.js.map +1 -1
  42. package/dist/esm/GlobalNavigationBar/ExtendedMainMenu.js +4 -2
  43. package/dist/esm/GlobalNavigationBar/ExtendedMainMenu.js.map +1 -1
  44. package/dist/esm/GlobalNavigationBar/GlobalNavigationBar.js +6 -2
  45. package/dist/esm/GlobalNavigationBar/GlobalNavigationBar.js.map +1 -1
  46. package/dist/esm/GlobalNavigationBar/Logo.js +10 -10
  47. package/dist/esm/GlobalNavigationBar/Logo.js.map +1 -1
  48. package/dist/esm/GlobalNavigationBar/UserMenu/MobileUserMenu.js +2 -1
  49. package/dist/esm/GlobalNavigationBar/UserMenu/MobileUserMenu.js.map +1 -1
  50. package/dist/esm/GlobalNavigationBar/UserMenu/UserMenu.js +2 -1
  51. package/dist/esm/GlobalNavigationBar/UserMenu/UserMenu.js.map +1 -1
  52. package/dist/esm/GlobalNavigationBar/mobile/CommonStyles.js +8 -1
  53. package/dist/esm/GlobalNavigationBar/mobile/CommonStyles.js.map +1 -1
  54. package/dist/esm/HyperLink/HyperLink.js +20 -17
  55. package/dist/esm/HyperLink/HyperLink.js.map +1 -1
  56. package/dist/esm/InputFields/Checkbox.js +27 -16
  57. package/dist/esm/InputFields/Checkbox.js.map +1 -1
  58. package/dist/esm/InputFields/DatepickerField.js +6 -0
  59. package/dist/esm/InputFields/DatepickerField.js.map +1 -1
  60. package/dist/esm/InputFields/Label.js +1 -2
  61. package/dist/esm/InputFields/Label.js.map +1 -1
  62. package/dist/esm/InputFields/PasswordField.js +1 -2
  63. package/dist/esm/InputFields/PasswordField.js.map +1 -1
  64. package/dist/esm/InputFields/QuickSearch.js +2 -2
  65. package/dist/esm/InputFields/QuickSearch.js.map +1 -1
  66. package/dist/esm/InputFields/RadioButton.js +21 -14
  67. package/dist/esm/InputFields/RadioButton.js.map +1 -1
  68. package/dist/esm/InputFields/ResponsiveComponentWrapper.js +2 -2
  69. package/dist/esm/InputFields/ResponsiveComponentWrapper.js.map +1 -1
  70. package/dist/esm/InputFields/SearchBar.js +13 -14
  71. package/dist/esm/InputFields/SearchBar.js.map +1 -1
  72. package/dist/esm/InputFields/TextField.js +0 -1
  73. package/dist/esm/InputFields/TextField.js.map +1 -1
  74. package/dist/esm/InputFields/Textarea.js +1 -2
  75. package/dist/esm/InputFields/Textarea.js.map +1 -1
  76. package/dist/esm/InputFields/__tests__/QuickSearch.test.js +2 -1
  77. package/dist/esm/InputFields/__tests__/QuickSearch.test.js.map +1 -1
  78. package/dist/esm/InputFields/components/SearchBarInput.js +0 -1
  79. package/dist/esm/InputFields/components/SearchBarInput.js.map +1 -1
  80. package/dist/esm/List/ListRow.js +4 -1
  81. package/dist/esm/List/ListRow.js.map +1 -1
  82. package/dist/esm/LoadingIndicator/LoadingIndicator.js +4 -4
  83. package/dist/esm/LoadingIndicator/LoadingIndicator.js.map +1 -1
  84. package/dist/esm/Modals/ModalContainer.js +8 -1
  85. package/dist/esm/Modals/ModalContainer.js.map +1 -1
  86. package/dist/esm/Modals/ModalDialog.js +76 -26
  87. package/dist/esm/Modals/ModalDialog.js.map +1 -1
  88. package/dist/esm/Modals/ModalStyles.js +38 -21
  89. package/dist/esm/Modals/ModalStyles.js.map +1 -1
  90. package/dist/esm/Modals/ModalTypes.js +2 -0
  91. package/dist/esm/Modals/ModalTypes.js.map +1 -0
  92. package/dist/esm/NavItem/NavItem.js +4 -0
  93. package/dist/esm/NavItem/NavItem.js.map +1 -1
  94. package/dist/esm/NotificationDot/NotificationDot.js +9 -9
  95. package/dist/esm/NotificationDot/NotificationDot.js.map +1 -1
  96. package/dist/esm/NotificationDot/__tests__/NotificationDot.test.js +3 -2
  97. package/dist/esm/NotificationDot/__tests__/NotificationDot.test.js.map +1 -1
  98. package/dist/esm/Paginator/Paginator.js +60 -48
  99. package/dist/esm/Paginator/Paginator.js.map +1 -1
  100. package/dist/esm/Paginator/__tests__/Paginator.test.js +4 -4
  101. package/dist/esm/Paginator/__tests__/Paginator.test.js.map +1 -1
  102. package/dist/esm/Switcher/MobileSwitcherMenu.js +2 -1
  103. package/dist/esm/Switcher/MobileSwitcherMenu.js.map +1 -1
  104. package/dist/esm/Switcher/SwitcherMenuItem.js +5 -0
  105. package/dist/esm/Switcher/SwitcherMenuItem.js.map +1 -1
  106. package/dist/esm/Table/Table.js +1 -1
  107. package/dist/esm/Table/Table.js.map +1 -1
  108. package/dist/esm/Tabs/HorizontalTabs.js +15 -9
  109. package/dist/esm/Tabs/HorizontalTabs.js.map +1 -1
  110. package/dist/esm/Tabs/TabLink.js +17 -6
  111. package/dist/esm/Tabs/TabLink.js.map +1 -1
  112. package/dist/esm/Tabs/Tabs.js +14 -14
  113. package/dist/esm/Tabs/Tabs.js.map +1 -1
  114. package/dist/esm/Tabs/VerticalTabs.js +2 -2
  115. package/dist/esm/Tabs/VerticalTabs.js.map +1 -1
  116. package/dist/esm/Toasters/ToastContext.js +2 -1
  117. package/dist/esm/Toasters/ToastContext.js.map +1 -1
  118. package/dist/esm/Tooltips/TooltipStyles.js +6 -5
  119. package/dist/esm/Tooltips/TooltipStyles.js.map +1 -1
  120. package/dist/esm/Tooltips/TooltipTypes.js.map +1 -1
  121. package/dist/esm/Tooltips/TooltipWrapper.js +4 -1
  122. package/dist/esm/Tooltips/TooltipWrapper.js.map +1 -1
  123. package/dist/esm/icons/index.js +1 -1
  124. package/dist/esm/icons/index.js.map +1 -1
  125. package/dist/esm/index.js +1 -0
  126. package/dist/esm/index.js.map +1 -1
  127. package/dist/esm/styles/typography.js +34 -14
  128. package/dist/esm/styles/typography.js.map +1 -1
  129. package/dist/esm/styles/z-indexes.js +14 -0
  130. package/dist/esm/styles/z-indexes.js.map +1 -0
  131. package/dist/esm/types.js +1 -0
  132. package/dist/esm/types.js.map +1 -1
  133. package/dist/js/Accordion/AccordionItem.d.ts +9 -0
  134. package/dist/js/Accordion/AccordionItem.js +101 -0
  135. package/dist/js/Accordion/AccordionItem.js.map +1 -0
  136. package/dist/js/Accordion/AccordionMenu.d.ts +17 -0
  137. package/dist/js/Accordion/AccordionMenu.js +111 -0
  138. package/dist/js/Accordion/AccordionMenu.js.map +1 -0
  139. package/dist/js/Accordion/__tests__/AccordionMenu.test.js +101 -0
  140. package/dist/js/Accordion/__tests__/AccordionMenu.test.js.map +1 -0
  141. package/dist/js/Accordion/index.d.ts +3 -0
  142. package/dist/js/Accordion/index.js +30 -0
  143. package/dist/js/Accordion/index.js.map +1 -0
  144. package/dist/js/Accordion/styles.d.ts +11 -0
  145. package/dist/js/Accordion/styles.js +52 -0
  146. package/dist/js/Accordion/styles.js.map +1 -0
  147. package/dist/js/Banners/Banner.d.ts +2 -1
  148. package/dist/js/Banners/Banner.js +0 -1
  149. package/dist/js/Banners/Banner.js.map +1 -1
  150. package/dist/js/Breadcrumb/Breadcrumb.js.map +1 -1
  151. package/dist/js/Button/BackButton.d.ts +2 -1
  152. package/dist/js/Button/BackButton.js +5 -4
  153. package/dist/js/Button/BackButton.js.map +1 -1
  154. package/dist/js/Button/Button.js +6 -12
  155. package/dist/js/Button/Button.js.map +1 -1
  156. package/dist/js/Button/Iconbutton.d.ts +1 -1
  157. package/dist/js/Button/Iconbutton.js +16 -9
  158. package/dist/js/Button/Iconbutton.js.map +1 -1
  159. package/dist/js/Button/__tests__/BackButton.test.js +5 -3
  160. package/dist/js/Button/__tests__/BackButton.test.js.map +1 -1
  161. package/dist/js/Chips/ActionChip.js +4 -2
  162. package/dist/js/Chips/ActionChip.js.map +1 -1
  163. package/dist/js/Chips/ChipInput.js +3 -1
  164. package/dist/js/Chips/ChipInput.js.map +1 -1
  165. package/dist/js/Chips/ChipTypes.d.ts +3 -3
  166. package/dist/js/Chips/FilterChip.js +4 -2
  167. package/dist/js/Chips/FilterChip.js.map +1 -1
  168. package/dist/js/Chips/InputChip.js +4 -2
  169. package/dist/js/Chips/InputChip.js.map +1 -1
  170. package/dist/js/Dropdown/BasicDropdown.d.ts +6 -2
  171. package/dist/js/Dropdown/BasicDropdown.js +19 -12
  172. package/dist/js/Dropdown/BasicDropdown.js.map +1 -1
  173. package/dist/js/Dropdown/ChipDropdownInput.d.ts +0 -3
  174. package/dist/js/Dropdown/ChipDropdownInput.js +4 -2
  175. package/dist/js/Dropdown/ChipDropdownInput.js.map +1 -1
  176. package/dist/js/Dropdown/CommonStyling.d.ts +2 -0
  177. package/dist/js/Dropdown/CommonStyling.js +8 -4
  178. package/dist/js/Dropdown/CommonStyling.js.map +1 -1
  179. package/dist/js/Dropdown/DropdownContent.js +5 -3
  180. package/dist/js/Dropdown/DropdownContent.js.map +1 -1
  181. package/dist/js/Dropdown/DropdownFilter.d.ts +2 -1
  182. package/dist/js/Dropdown/DropdownFilter.js +3 -4
  183. package/dist/js/Dropdown/DropdownFilter.js.map +1 -1
  184. package/dist/js/GlobalNavigationBar/Avatar.js +2 -2
  185. package/dist/js/GlobalNavigationBar/Avatar.js.map +1 -1
  186. package/dist/js/GlobalNavigationBar/ExtendedMainMenu.js +6 -2
  187. package/dist/js/GlobalNavigationBar/ExtendedMainMenu.js.map +1 -1
  188. package/dist/js/GlobalNavigationBar/GlobalNavigationBar.js +5 -3
  189. package/dist/js/GlobalNavigationBar/GlobalNavigationBar.js.map +1 -1
  190. package/dist/js/GlobalNavigationBar/Logo.js +9 -9
  191. package/dist/js/GlobalNavigationBar/Logo.js.map +1 -1
  192. package/dist/js/GlobalNavigationBar/UserMenu/MobileUserMenu.js +3 -1
  193. package/dist/js/GlobalNavigationBar/UserMenu/MobileUserMenu.js.map +1 -1
  194. package/dist/js/GlobalNavigationBar/UserMenu/UserMenu.js +3 -1
  195. package/dist/js/GlobalNavigationBar/UserMenu/UserMenu.js.map +1 -1
  196. package/dist/js/GlobalNavigationBar/mobile/CommonStyles.js +4 -2
  197. package/dist/js/GlobalNavigationBar/mobile/CommonStyles.js.map +1 -1
  198. package/dist/js/HyperLink/HyperLink.d.ts +2 -2
  199. package/dist/js/HyperLink/HyperLink.js +19 -15
  200. package/dist/js/HyperLink/HyperLink.js.map +1 -1
  201. package/dist/js/InputFields/Checkbox.js +9 -5
  202. package/dist/js/InputFields/Checkbox.js.map +1 -1
  203. package/dist/js/InputFields/DatepickerField.js +3 -1
  204. package/dist/js/InputFields/DatepickerField.js.map +1 -1
  205. package/dist/js/InputFields/Label.d.ts +2 -1
  206. package/dist/js/InputFields/Label.js +0 -1
  207. package/dist/js/InputFields/Label.js.map +1 -1
  208. package/dist/js/InputFields/PasswordField.d.ts +2 -1
  209. package/dist/js/InputFields/PasswordField.js +1 -2
  210. package/dist/js/InputFields/PasswordField.js.map +1 -1
  211. package/dist/js/InputFields/QuickSearch.d.ts +2 -1
  212. package/dist/js/InputFields/QuickSearch.js +3 -2
  213. package/dist/js/InputFields/QuickSearch.js.map +1 -1
  214. package/dist/js/InputFields/RadioButton.js +3 -3
  215. package/dist/js/InputFields/RadioButton.js.map +1 -1
  216. package/dist/js/InputFields/ResponsiveComponentWrapper.d.ts +2 -1
  217. package/dist/js/InputFields/ResponsiveComponentWrapper.js +3 -2
  218. package/dist/js/InputFields/ResponsiveComponentWrapper.js.map +1 -1
  219. package/dist/js/InputFields/SearchBar.d.ts +2 -1
  220. package/dist/js/InputFields/SearchBar.js +15 -16
  221. package/dist/js/InputFields/SearchBar.js.map +1 -1
  222. package/dist/js/InputFields/TextField.d.ts +2 -1
  223. package/dist/js/InputFields/TextField.js +0 -1
  224. package/dist/js/InputFields/TextField.js.map +1 -1
  225. package/dist/js/InputFields/Textarea.d.ts +2 -1
  226. package/dist/js/InputFields/Textarea.js +0 -1
  227. package/dist/js/InputFields/Textarea.js.map +1 -1
  228. package/dist/js/InputFields/__tests__/QuickSearch.test.js +3 -1
  229. package/dist/js/InputFields/__tests__/QuickSearch.test.js.map +1 -1
  230. package/dist/js/InputFields/components/SearchBarInput.d.ts +2 -1
  231. package/dist/js/InputFields/components/SearchBarInput.js +0 -1
  232. package/dist/js/InputFields/components/SearchBarInput.js.map +1 -1
  233. package/dist/js/List/ListRow.js +3 -1
  234. package/dist/js/List/ListRow.js.map +1 -1
  235. package/dist/js/LoadingIndicator/LoadingIndicator.d.ts +2 -1
  236. package/dist/js/LoadingIndicator/LoadingIndicator.js +5 -4
  237. package/dist/js/LoadingIndicator/LoadingIndicator.js.map +1 -1
  238. package/dist/js/Modals/ModalContainer.js +3 -1
  239. package/dist/js/Modals/ModalContainer.js.map +1 -1
  240. package/dist/js/Modals/ModalDialog.d.ts +2 -6
  241. package/dist/js/Modals/ModalDialog.js +77 -46
  242. package/dist/js/Modals/ModalDialog.js.map +1 -1
  243. package/dist/js/Modals/ModalStyles.d.ts +6 -0
  244. package/dist/js/Modals/ModalStyles.js +34 -14
  245. package/dist/js/Modals/ModalStyles.js.map +1 -1
  246. package/dist/js/Modals/ModalTypes.d.ts +18 -0
  247. package/dist/js/Modals/ModalTypes.js +6 -0
  248. package/dist/js/Modals/ModalTypes.js.map +1 -0
  249. package/dist/js/NavItem/NavItem.js +3 -1
  250. package/dist/js/NavItem/NavItem.js.map +1 -1
  251. package/dist/js/NotificationDot/NotificationDot.d.ts +2 -1
  252. package/dist/js/NotificationDot/NotificationDot.js +10 -9
  253. package/dist/js/NotificationDot/NotificationDot.js.map +1 -1
  254. package/dist/js/NotificationDot/__tests__/NotificationDot.test.js +4 -2
  255. package/dist/js/NotificationDot/__tests__/NotificationDot.test.js.map +1 -1
  256. package/dist/js/Paginator/Paginator.js +39 -38
  257. package/dist/js/Paginator/Paginator.js.map +1 -1
  258. package/dist/js/Paginator/__tests__/Paginator.test.js +6 -6
  259. package/dist/js/Paginator/__tests__/Paginator.test.js.map +1 -1
  260. package/dist/js/Switcher/MobileSwitcherMenu.js +3 -1
  261. package/dist/js/Switcher/MobileSwitcherMenu.js.map +1 -1
  262. package/dist/js/Switcher/SwitcherMenuItem.js +3 -1
  263. package/dist/js/Switcher/SwitcherMenuItem.js.map +1 -1
  264. package/dist/js/Table/Table.js +1 -1
  265. package/dist/js/Table/Table.js.map +1 -1
  266. package/dist/js/Tabs/HorizontalTabs.d.ts +2 -2
  267. package/dist/js/Tabs/HorizontalTabs.js +6 -3
  268. package/dist/js/Tabs/HorizontalTabs.js.map +1 -1
  269. package/dist/js/Tabs/TabLink.d.ts +2 -1
  270. package/dist/js/Tabs/TabLink.js +7 -4
  271. package/dist/js/Tabs/TabLink.js.map +1 -1
  272. package/dist/js/Tabs/Tabs.d.ts +2 -1
  273. package/dist/js/Tabs/Tabs.js +15 -14
  274. package/dist/js/Tabs/Tabs.js.map +1 -1
  275. package/dist/js/Tabs/VerticalTabs.d.ts +2 -1
  276. package/dist/js/Tabs/VerticalTabs.js +3 -2
  277. package/dist/js/Tabs/VerticalTabs.js.map +1 -1
  278. package/dist/js/Toasters/ToastContext.js +3 -1
  279. package/dist/js/Toasters/ToastContext.js.map +1 -1
  280. package/dist/js/Tooltips/TooltipStyles.d.ts +4 -2
  281. package/dist/js/Tooltips/TooltipStyles.js +12 -4
  282. package/dist/js/Tooltips/TooltipStyles.js.map +1 -1
  283. package/dist/js/Tooltips/TooltipTypes.d.ts +1 -0
  284. package/dist/js/Tooltips/TooltipTypes.js.map +1 -1
  285. package/dist/js/Tooltips/TooltipWrapper.d.ts +1 -1
  286. package/dist/js/Tooltips/TooltipWrapper.js +5 -1
  287. package/dist/js/Tooltips/TooltipWrapper.js.map +1 -1
  288. package/dist/js/icons/index.js +1 -1
  289. package/dist/js/icons/index.js.map +1 -1
  290. package/dist/js/index.d.ts +1 -0
  291. package/dist/js/index.js +13 -0
  292. package/dist/js/index.js.map +1 -1
  293. package/dist/js/styles/typography.d.ts +3 -1
  294. package/dist/js/styles/typography.js +35 -14
  295. package/dist/js/styles/typography.js.map +1 -1
  296. package/dist/js/styles/z-indexes.d.ts +13 -0
  297. package/dist/js/styles/z-indexes.js +21 -0
  298. package/dist/js/styles/z-indexes.js.map +1 -0
  299. package/dist/js/types.d.ts +1 -0
  300. package/dist/js/types.js +1 -0
  301. package/dist/js/types.js.map +1 -1
  302. package/dist/umd/Accordion/AccordionItem.js +98 -0
  303. package/dist/umd/Accordion/AccordionItem.js.map +1 -0
  304. package/dist/umd/Accordion/AccordionMenu.js +138 -0
  305. package/dist/umd/Accordion/AccordionMenu.js.map +1 -0
  306. package/dist/umd/Accordion/__tests__/AccordionMenu.test.js +74 -0
  307. package/dist/umd/Accordion/__tests__/AccordionMenu.test.js.map +1 -0
  308. package/dist/umd/Accordion/index.js +44 -0
  309. package/dist/umd/Accordion/index.js.map +1 -0
  310. package/dist/umd/Accordion/styles.js +101 -0
  311. package/dist/umd/Accordion/styles.js.map +1 -0
  312. package/dist/umd/Banners/Banner.js +0 -1
  313. package/dist/umd/Banners/Banner.js.map +1 -1
  314. package/dist/umd/Breadcrumb/Breadcrumb.js.map +1 -1
  315. package/dist/umd/Button/BackButton.js +7 -8
  316. package/dist/umd/Button/BackButton.js.map +1 -1
  317. package/dist/umd/Button/Button.js +8 -53
  318. package/dist/umd/Button/Button.js.map +1 -1
  319. package/dist/umd/Button/Iconbutton.js +16 -59
  320. package/dist/umd/Button/Iconbutton.js.map +1 -1
  321. package/dist/umd/Button/__tests__/BackButton.test.js +7 -7
  322. package/dist/umd/Button/__tests__/BackButton.test.js.map +1 -1
  323. package/dist/umd/Chips/ActionChip.js +6 -6
  324. package/dist/umd/Chips/ActionChip.js.map +1 -1
  325. package/dist/umd/Chips/ChipInput.js +5 -5
  326. package/dist/umd/Chips/ChipInput.js.map +1 -1
  327. package/dist/umd/Chips/FilterChip.js +6 -6
  328. package/dist/umd/Chips/FilterChip.js.map +1 -1
  329. package/dist/umd/Chips/InputChip.js +6 -6
  330. package/dist/umd/Chips/InputChip.js.map +1 -1
  331. package/dist/umd/Dropdown/BasicDropdown.js +19 -12
  332. package/dist/umd/Dropdown/BasicDropdown.js.map +1 -1
  333. package/dist/umd/Dropdown/ChipDropdownInput.js +6 -6
  334. package/dist/umd/Dropdown/ChipDropdownInput.js.map +1 -1
  335. package/dist/umd/Dropdown/CommonStyling.js +74 -75
  336. package/dist/umd/Dropdown/CommonStyling.js.map +1 -1
  337. package/dist/umd/Dropdown/DropdownContent.js +16 -5
  338. package/dist/umd/Dropdown/DropdownContent.js.map +1 -1
  339. package/dist/umd/Dropdown/DropdownFilter.js +3 -4
  340. package/dist/umd/Dropdown/DropdownFilter.js.map +1 -1
  341. package/dist/umd/GlobalNavigationBar/Avatar.js +2 -2
  342. package/dist/umd/GlobalNavigationBar/Avatar.js.map +1 -1
  343. package/dist/umd/GlobalNavigationBar/ExtendedMainMenu.js +6 -6
  344. package/dist/umd/GlobalNavigationBar/ExtendedMainMenu.js.map +1 -1
  345. package/dist/umd/GlobalNavigationBar/GlobalNavigationBar.js +9 -6
  346. package/dist/umd/GlobalNavigationBar/GlobalNavigationBar.js.map +1 -1
  347. package/dist/umd/GlobalNavigationBar/Logo.js +10 -10
  348. package/dist/umd/GlobalNavigationBar/Logo.js.map +1 -1
  349. package/dist/umd/GlobalNavigationBar/UserMenu/MobileUserMenu.js +5 -5
  350. package/dist/umd/GlobalNavigationBar/UserMenu/MobileUserMenu.js.map +1 -1
  351. package/dist/umd/GlobalNavigationBar/UserMenu/UserMenu.js +5 -5
  352. package/dist/umd/GlobalNavigationBar/UserMenu/UserMenu.js.map +1 -1
  353. package/dist/umd/GlobalNavigationBar/mobile/CommonStyles.js +11 -5
  354. package/dist/umd/GlobalNavigationBar/mobile/CommonStyles.js.map +1 -1
  355. package/dist/umd/HyperLink/HyperLink.js +68 -17
  356. package/dist/umd/HyperLink/HyperLink.js.map +1 -1
  357. package/dist/umd/InputFields/Checkbox.js +27 -16
  358. package/dist/umd/InputFields/Checkbox.js.map +1 -1
  359. package/dist/umd/InputFields/DatepickerField.js +9 -4
  360. package/dist/umd/InputFields/DatepickerField.js.map +1 -1
  361. package/dist/umd/InputFields/Label.js +0 -1
  362. package/dist/umd/InputFields/Label.js.map +1 -1
  363. package/dist/umd/InputFields/PasswordField.js +1 -2
  364. package/dist/umd/InputFields/PasswordField.js.map +1 -1
  365. package/dist/umd/InputFields/QuickSearch.js +5 -6
  366. package/dist/umd/InputFields/QuickSearch.js.map +1 -1
  367. package/dist/umd/InputFields/RadioButton.js +21 -14
  368. package/dist/umd/InputFields/RadioButton.js.map +1 -1
  369. package/dist/umd/InputFields/ResponsiveComponentWrapper.js +5 -6
  370. package/dist/umd/InputFields/ResponsiveComponentWrapper.js.map +1 -1
  371. package/dist/umd/InputFields/SearchBar.js +13 -14
  372. package/dist/umd/InputFields/SearchBar.js.map +1 -1
  373. package/dist/umd/InputFields/TextField.js +0 -1
  374. package/dist/umd/InputFields/TextField.js.map +1 -1
  375. package/dist/umd/InputFields/Textarea.js +0 -1
  376. package/dist/umd/InputFields/Textarea.js.map +1 -1
  377. package/dist/umd/InputFields/__tests__/QuickSearch.test.js +5 -5
  378. package/dist/umd/InputFields/__tests__/QuickSearch.test.js.map +1 -1
  379. package/dist/umd/InputFields/components/SearchBarInput.js +0 -1
  380. package/dist/umd/InputFields/components/SearchBarInput.js.map +1 -1
  381. package/dist/umd/List/ListRow.js +7 -5
  382. package/dist/umd/List/ListRow.js.map +1 -1
  383. package/dist/umd/LoadingIndicator/LoadingIndicator.js +7 -8
  384. package/dist/umd/LoadingIndicator/LoadingIndicator.js.map +1 -1
  385. package/dist/umd/Modals/ModalContainer.js +11 -5
  386. package/dist/umd/Modals/ModalContainer.js.map +1 -1
  387. package/dist/umd/Modals/ModalDialog.js +77 -29
  388. package/dist/umd/Modals/ModalDialog.js.map +1 -1
  389. package/dist/umd/Modals/ModalStyles.js +39 -22
  390. package/dist/umd/Modals/ModalStyles.js.map +1 -1
  391. package/dist/umd/Modals/ModalTypes.js +20 -0
  392. package/dist/umd/Modals/ModalTypes.js.map +1 -0
  393. package/dist/umd/NavItem/NavItem.js +7 -4
  394. package/dist/umd/NavItem/NavItem.js.map +1 -1
  395. package/dist/umd/NotificationDot/NotificationDot.js +12 -13
  396. package/dist/umd/NotificationDot/NotificationDot.js.map +1 -1
  397. package/dist/umd/NotificationDot/__tests__/NotificationDot.test.js +6 -6
  398. package/dist/umd/NotificationDot/__tests__/NotificationDot.test.js.map +1 -1
  399. package/dist/umd/Paginator/Paginator.js +60 -51
  400. package/dist/umd/Paginator/Paginator.js.map +1 -1
  401. package/dist/umd/Paginator/__tests__/Paginator.test.js +4 -4
  402. package/dist/umd/Paginator/__tests__/Paginator.test.js.map +1 -1
  403. package/dist/umd/Switcher/MobileSwitcherMenu.js +5 -5
  404. package/dist/umd/Switcher/MobileSwitcherMenu.js.map +1 -1
  405. package/dist/umd/Switcher/SwitcherMenuItem.js +8 -4
  406. package/dist/umd/Switcher/SwitcherMenuItem.js.map +1 -1
  407. package/dist/umd/Table/Table.js +1 -1
  408. package/dist/umd/Table/Table.js.map +1 -1
  409. package/dist/umd/Tabs/HorizontalTabs.js +16 -12
  410. package/dist/umd/Tabs/HorizontalTabs.js.map +1 -1
  411. package/dist/umd/Tabs/TabLink.js +19 -10
  412. package/dist/umd/Tabs/TabLink.js.map +1 -1
  413. package/dist/umd/Tabs/Tabs.js +17 -18
  414. package/dist/umd/Tabs/Tabs.js.map +1 -1
  415. package/dist/umd/Tabs/VerticalTabs.js +5 -6
  416. package/dist/umd/Tabs/VerticalTabs.js.map +1 -1
  417. package/dist/umd/Toasters/ToastContext.js +5 -5
  418. package/dist/umd/Toasters/ToastContext.js.map +1 -1
  419. package/dist/umd/Tooltips/TooltipStyles.js +11 -9
  420. package/dist/umd/Tooltips/TooltipStyles.js.map +1 -1
  421. package/dist/umd/Tooltips/TooltipTypes.js.map +1 -1
  422. package/dist/umd/Tooltips/TooltipWrapper.js +4 -1
  423. package/dist/umd/Tooltips/TooltipWrapper.js.map +1 -1
  424. package/dist/umd/icons/index.js +1 -1
  425. package/dist/umd/icons/index.js.map +1 -1
  426. package/dist/umd/index.js +13 -4
  427. package/dist/umd/index.js.map +1 -1
  428. package/dist/umd/styles/typography.js +37 -18
  429. package/dist/umd/styles/typography.js.map +1 -1
  430. package/dist/umd/styles/z-indexes.js +33 -0
  431. package/dist/umd/styles/z-indexes.js.map +1 -0
  432. package/dist/umd/types.js +1 -0
  433. package/dist/umd/types.js.map +1 -1
  434. package/package.json +1 -1
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/types.ts"],"names":["Size","ToastColor","ToastActionType","ToastPosition","ToastEntryDirection"],"mappings":"AAOA,WAAYA,IAAZ;;WAAYA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;GAAAA,I,KAAAA,I;;AA8BZ,WAAYC,UAAZ;;WAAYA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;GAAAA,U,KAAAA,U;;AASZ,WAAYC,eAAZ;;WAAYA,e;AAAAA,EAAAA,e,CAAAA,e;AAAAA,EAAAA,e,CAAAA,e;GAAAA,e,KAAAA,e;;AAKZ,WAAYC,aAAZ;;WAAYA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;GAAAA,a,KAAAA,a;;AASZ,WAAYC,mBAAZ;;WAAYA,mB;AAAAA,EAAAA,mB,CAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;GAAAA,mB,KAAAA,mB","sourcesContent":["export interface Product {\n id: string;\n name: string;\n type: string;\n image: string;\n}\n\nexport enum Size {\n XSmall = 'xsmall',\n Small = 'small',\n Medium = 'medium',\n Large = 'large'\n}\n\nexport interface NavOption {\n label: string;\n to: string;\n disabled?: boolean;\n exact?: boolean;\n onClick?: () => void;\n}\n\nexport interface NavButton {\n label: string;\n action: any;\n disabled?: boolean;\n}\n\nexport interface ActionOptions {\n search?: () => void;\n apps?: () => void;\n language?: () => void;\n notification?: () => void;\n settings?: () => void;\n user?: () => void;\n}\n\nexport enum ToastColor {\n BLACK,\n WHITE,\n BLUE,\n GREEN,\n ORANGE,\n RED,\n}\n\nexport enum ToastActionType{\n PRIMARY,\n SECONDARY\n}\n\nexport enum ToastPosition {\n TOPLEFT,\n TOPMIDDLE,\n TOPRIGHT,\n BOTTOMLEFT,\n BOTTOMMIDDLE,\n BOTTOMRIGHT,\n}\n\nexport enum ToastEntryDirection{\n TOP,\n BOTTOM,\n LEFT,\n RIGHT\n}\n\nexport interface SwitcherNavItem {\n label: string;\n url: string;\n disabled?: boolean;\n Icon?: any;\n as?: any;\n testId?: string;\n}\n\nexport interface UserMenuItem {\n label: string;\n to: string;\n icon: any;\n isExternal?: boolean;\n onClick?: () => void;\n}\n\nexport interface ListRowDropdownOption {\n key?: string;\n label: string;\n action: any;\n}\n\nexport interface NavLink {\n label: string;\n to: string;\n target?: string;\n}\n\nexport interface NavSection {\n header: string;\n links: NavLink[];\n}\n\nexport interface NavOptions {\n sections: NavSection[];\n}\n"],"file":"types.js"}
1
+ {"version":3,"sources":["../../src/types.ts"],"names":["Size","ToastColor","ToastActionType","ToastPosition","ToastEntryDirection"],"mappings":"AAOA,WAAYA,IAAZ;;WAAYA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;GAAAA,I,KAAAA,I;;AA+BZ,WAAYC,UAAZ;;WAAYA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;GAAAA,U,KAAAA,U;;AASZ,WAAYC,eAAZ;;WAAYA,e;AAAAA,EAAAA,e,CAAAA,e;AAAAA,EAAAA,e,CAAAA,e;GAAAA,e,KAAAA,e;;AAKZ,WAAYC,aAAZ;;WAAYA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;GAAAA,a,KAAAA,a;;AASZ,WAAYC,mBAAZ;;WAAYA,mB;AAAAA,EAAAA,mB,CAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;GAAAA,mB,KAAAA,mB","sourcesContent":["export interface Product {\n id: string;\n name: string;\n type: string;\n image: string;\n}\n\nexport enum Size {\n XXSmall = 'xxsmall',\n XSmall = 'xsmall',\n Small = 'small',\n Medium = 'medium',\n Large = 'large'\n}\n\nexport interface NavOption {\n label: string;\n to: string;\n disabled?: boolean;\n exact?: boolean;\n onClick?: () => void;\n}\n\nexport interface NavButton {\n label: string;\n action: any;\n disabled?: boolean;\n}\n\nexport interface ActionOptions {\n search?: () => void;\n apps?: () => void;\n language?: () => void;\n notification?: () => void;\n settings?: () => void;\n user?: () => void;\n}\n\nexport enum ToastColor {\n BLACK,\n WHITE,\n BLUE,\n GREEN,\n ORANGE,\n RED,\n}\n\nexport enum ToastActionType{\n PRIMARY,\n SECONDARY\n}\n\nexport enum ToastPosition {\n TOPLEFT,\n TOPMIDDLE,\n TOPRIGHT,\n BOTTOMLEFT,\n BOTTOMMIDDLE,\n BOTTOMRIGHT,\n}\n\nexport enum ToastEntryDirection{\n TOP,\n BOTTOM,\n LEFT,\n RIGHT\n}\n\nexport interface SwitcherNavItem {\n label: string;\n url: string;\n disabled?: boolean;\n Icon?: any;\n as?: any;\n testId?: string;\n}\n\nexport interface UserMenuItem {\n label: string;\n to: string;\n icon: any;\n isExternal?: boolean;\n onClick?: () => void;\n}\n\nexport interface ListRowDropdownOption {\n key?: string;\n label: string;\n action: any;\n}\n\nexport interface NavLink {\n label: string;\n to: string;\n target?: string;\n}\n\nexport interface NavSection {\n header: string;\n links: NavLink[];\n}\n\nexport interface NavOptions {\n sections: NavSection[];\n}\n"],"file":"types.js"}
@@ -0,0 +1,9 @@
1
+ import React from 'react';
2
+ import { AccordionItemProps } from './AccordionMenu';
3
+ interface AccordionItemPropsInner extends AccordionItemProps {
4
+ onSelect: (id: string) => void;
5
+ isActive: boolean;
6
+ isLast: boolean;
7
+ }
8
+ declare const AccordionItem: React.FunctionComponent<AccordionItemPropsInner>;
9
+ export default AccordionItem;
@@ -0,0 +1,101 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+
8
+ var _propTypes = _interopRequireDefault(require("prop-types"));
9
+
10
+ var _react = _interopRequireDefault(require("react"));
11
+
12
+ var _ = require("..");
13
+
14
+ var _icons = require("../icons");
15
+
16
+ var _styles = require("./styles");
17
+
18
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
19
+
20
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
21
+
22
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
23
+
24
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
25
+
26
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
27
+
28
+ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
29
+
30
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
31
+
32
+ var AccordionItem = function AccordionItem(props) {
33
+ var id = props.id,
34
+ onSelect = props.onSelect,
35
+ isActive = props.isActive,
36
+ title = props.title,
37
+ icon = props.icon,
38
+ disabled = props.disabled,
39
+ isLast = props.isLast;
40
+
41
+ var supressFocusRef = _react.default.useRef(null);
42
+
43
+ var _React$useState = _react.default.useState(false),
44
+ _React$useState2 = _slicedToArray(_React$useState, 2),
45
+ tabbedHere = _React$useState2[0],
46
+ setTabbedHere = _React$useState2[1];
47
+
48
+ _react.default.useEffect(function () {
49
+ !!disabled && setTabbedHere(false);
50
+ }, [disabled]);
51
+
52
+ return /*#__PURE__*/_react.default.createElement(_styles.AccordionItemContainer, {
53
+ id: id,
54
+ displaySeparator: !isActive && !isLast
55
+ }, /*#__PURE__*/_react.default.createElement(_styles.ItemHeaderContainer, {
56
+ tabIndex: !disabled ? 0 : -1,
57
+ onClick: function onClick() {
58
+ if (!disabled) {
59
+ onSelect(id);
60
+ }
61
+ },
62
+ onKeyDown: function onKeyDown(e) {
63
+ if (e.key == 'Enter') onSelect(id);
64
+ },
65
+ onBlur: function onBlur() {
66
+ setTabbedHere(false);
67
+ supressFocusRef.current = false;
68
+ },
69
+ onFocus: function onFocus() {
70
+ if (!disabled) {
71
+ if (!supressFocusRef.current) setTabbedHere(true);else supressFocusRef.current = false;
72
+ }
73
+ },
74
+ onMouseDown: function onMouseDown() {
75
+ if (!disabled && !tabbedHere) supressFocusRef.current = true;
76
+ },
77
+ tabbedHere: tabbedHere,
78
+ isActive: isActive,
79
+ isDisabled: disabled !== null && disabled !== void 0 ? disabled : false
80
+ }, icon && /*#__PURE__*/_react.default.cloneElement(icon, {
81
+ size: '24px'
82
+ }), /*#__PURE__*/_react.default.createElement(_.ComponentM, {
83
+ className: "headerLabel",
84
+ color: isActive ? _.COLORS.neutral_800 : disabled ? _.COLORS.neutral_300 : _.COLORS.neutral_600
85
+ }, title), isActive ? /*#__PURE__*/_react.default.createElement(_icons.SystemIcons.ChevronUp, {
86
+ color: _.COLORS.neutral_800,
87
+ size: "20px"
88
+ }) : /*#__PURE__*/_react.default.createElement(_icons.SystemIcons.ChevronDown, {
89
+ color: _.COLORS.neutral_600,
90
+ size: "20px"
91
+ })), isActive && /*#__PURE__*/_react.default.createElement(_styles.ItemBodyContainer, null, /*#__PURE__*/_react.default.createElement(_.ComponentS, null, props.children)));
92
+ };
93
+
94
+ AccordionItem.propTypes = {
95
+ onSelect: _propTypes.default.func.isRequired,
96
+ isActive: _propTypes.default.bool.isRequired,
97
+ isLast: _propTypes.default.bool.isRequired
98
+ };
99
+ var _default = AccordionItem;
100
+ exports.default = _default;
101
+ //# sourceMappingURL=AccordionItem.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/Accordion/AccordionItem.tsx"],"names":["AccordionItem","props","id","onSelect","isActive","title","icon","disabled","isLast","supressFocusRef","React","useRef","useState","tabbedHere","setTabbedHere","useEffect","e","key","current","cloneElement","size","COLORS","neutral_800","neutral_300","neutral_600","children"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { COLORS, ComponentM, ComponentS } from '..';\nimport { SystemIcons } from '../icons';\nimport { AccordionItemProps } from './AccordionMenu';\nimport { AccordionItemContainer, HeaderIconContainer, ItemBodyContainer, ItemHeaderContainer } from './styles';\n\ninterface AccordionItemPropsInner extends AccordionItemProps {\n onSelect: (id: string) => void;\n isActive: boolean;\n isLast: boolean;\n}\n\nconst AccordionItem: React.FunctionComponent<AccordionItemPropsInner> = (props: AccordionItemPropsInner) => {\n const { id, onSelect, isActive, title, icon, disabled, isLast } = props;\n\n const supressFocusRef = React.useRef<any>(null);\n const [tabbedHere, setTabbedHere] = React.useState<boolean>(false);\n\n React.useEffect(() => {\n !!disabled && setTabbedHere(false);\n }, [disabled]);\n\n return (\n <AccordionItemContainer id={id} displaySeparator={!isActive && !isLast}>\n <ItemHeaderContainer\n tabIndex={!disabled ? 0 : -1}\n onClick={() => {\n if (!disabled) {\n onSelect(id);\n }\n }}\n onKeyDown={(e: any) => {\n if(e.key == 'Enter')\n onSelect(id);\n }}\n onBlur={() => {\n setTabbedHere(false);\n supressFocusRef.current = false;\n }}\n onFocus={() => {\n if(!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onMouseDown={() => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n tabbedHere={tabbedHere}\n isActive={isActive}\n isDisabled={disabled ?? false}>\n {icon && React.cloneElement(icon as React.ReactElement, { size: '24px' })}\n <ComponentM className=\"headerLabel\" color={isActive ? COLORS.neutral_800 : disabled ? COLORS.neutral_300 : COLORS.neutral_600}>{title}</ComponentM>\n {isActive ? <SystemIcons.ChevronUp color={COLORS.neutral_800} size=\"20px\" /> : <SystemIcons.ChevronDown color={COLORS.neutral_600} size=\"20px\" />}\n </ItemHeaderContainer>\n {isActive && (\n <ItemBodyContainer>\n <ComponentS>{props.children}</ComponentS>\n </ItemBodyContainer>\n )}\n </AccordionItemContainer>\n );\n};\n\nexport default AccordionItem;\n"],"file":"AccordionItem.js"}
@@ -0,0 +1,17 @@
1
+ import * as React from 'react';
2
+ export interface AccordionProps {
3
+ items: AccordionItemProps[];
4
+ selectedItems?: string[];
5
+ setSelectedItems?: (a: string[]) => void;
6
+ onSelect?: (id: string) => void;
7
+ multipleActive?: boolean;
8
+ }
9
+ export interface AccordionItemProps {
10
+ id: string;
11
+ disabled?: boolean;
12
+ title: string;
13
+ icon?: React.ReactNode;
14
+ children: React.ReactNode;
15
+ }
16
+ declare const AccordionMenu: React.FunctionComponent<AccordionProps>;
17
+ export default AccordionMenu;
@@ -0,0 +1,111 @@
1
+ "use strict";
2
+
3
+ function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
4
+
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.default = void 0;
9
+
10
+ var _propTypes = _interopRequireDefault(require("prop-types"));
11
+
12
+ var React = _interopRequireWildcard(require("react"));
13
+
14
+ var _AccordionItem = _interopRequireDefault(require("./AccordionItem"));
15
+
16
+ var _styles = require("./styles");
17
+
18
+ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
19
+
20
+ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
21
+
22
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
23
+
24
+ function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
25
+
26
+ function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
27
+
28
+ function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
29
+
30
+ function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
31
+
32
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
33
+
34
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
35
+
36
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
37
+
38
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
39
+
40
+ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
41
+
42
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
43
+
44
+ var AccordionMenu = function AccordionMenu(_ref) {
45
+ var items = _ref.items,
46
+ selectedItems = _ref.selectedItems,
47
+ setSelectedItems = _ref.setSelectedItems,
48
+ onSelect = _ref.onSelect,
49
+ multipleActive = _ref.multipleActive;
50
+
51
+ var _React$useState = React.useState([]),
52
+ _React$useState2 = _slicedToArray(_React$useState, 2),
53
+ builtinSelectedItems = _React$useState2[0],
54
+ builtinSetSelectedItems = _React$useState2[1];
55
+
56
+ var getCollection = function getCollection() {
57
+ return selectedItems ? selectedItems : builtinSelectedItems;
58
+ };
59
+
60
+ var getUpdateFunction = function getUpdateFunction() {
61
+ return setSelectedItems ? setSelectedItems : builtinSetSelectedItems;
62
+ };
63
+
64
+ var onSelected = function onSelected(id) {
65
+ var collection = getCollection();
66
+ var updateFunc = getUpdateFunction();
67
+ var isActive = !!collection.find(function (x) {
68
+ return x == id;
69
+ });
70
+
71
+ if (multipleActive) {
72
+ if (isActive) updateFunc(collection.filter(function (x) {
73
+ return x != id;
74
+ }));else updateFunc([].concat(_toConsumableArray(collection), [id]));
75
+ } else updateFunc(isActive ? [] : [id]);
76
+
77
+ onSelect && onSelect(id);
78
+ };
79
+
80
+ return /*#__PURE__*/React.createElement(_styles.AccordionMenuWrapper, null, items.map(function (item) {
81
+ return /*#__PURE__*/React.createElement(_AccordionItem.default, {
82
+ key: item.id,
83
+ disabled: item.disabled,
84
+ id: item.id,
85
+ title: item.title,
86
+ icon: item.icon,
87
+ isActive: !!getCollection().find(function (x) {
88
+ return x == item.id;
89
+ }),
90
+ isLast: items.indexOf(item) === items.length - 1,
91
+ onSelect: onSelected
92
+ }, item.children);
93
+ }));
94
+ };
95
+
96
+ AccordionMenu.propTypes = {
97
+ items: _propTypes.default.arrayOf(_propTypes.default.shape({
98
+ id: _propTypes.default.string.isRequired,
99
+ disabled: _propTypes.default.bool,
100
+ title: _propTypes.default.string.isRequired,
101
+ icon: _propTypes.default.node,
102
+ children: _propTypes.default.node.isRequired
103
+ })).isRequired,
104
+ selectedItems: _propTypes.default.arrayOf(_propTypes.default.string),
105
+ setSelectedItems: _propTypes.default.func,
106
+ onSelect: _propTypes.default.func,
107
+ multipleActive: _propTypes.default.bool
108
+ };
109
+ var _default = AccordionMenu;
110
+ exports.default = _default;
111
+ //# sourceMappingURL=AccordionMenu.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/Accordion/AccordionMenu.tsx"],"names":["AccordionMenu","items","selectedItems","setSelectedItems","onSelect","multipleActive","React","useState","builtinSelectedItems","builtinSetSelectedItems","getCollection","getUpdateFunction","onSelected","id","collection","updateFunc","isActive","find","x","filter","map","item","disabled","title","icon","indexOf","length","children"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,IAAMA,aAAsD,GAAG,SAAzDA,aAAyD,OAA0F;AAAA,MAAvFC,KAAuF,QAAvFA,KAAuF;AAAA,MAAhFC,aAAgF,QAAhFA,aAAgF;AAAA,MAAjEC,gBAAiE,QAAjEA,gBAAiE;AAAA,MAA/CC,QAA+C,QAA/CA,QAA+C;AAAA,MAArCC,cAAqC,QAArCA,cAAqC;;AAEvJ,wBAAwDC,KAAK,CAACC,QAAN,CAAyB,EAAzB,CAAxD;AAAA;AAAA,MAAOC,oBAAP;AAAA,MAA6BC,uBAA7B;;AAEA,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,GAAM;AAC1B,WAAOR,aAAa,GAAGA,aAAH,GAAmBM,oBAAvC;AACD,GAFD;;AAIA,MAAMG,iBAAiB,GAAG,SAApBA,iBAAoB,GAAM;AAC9B,WAAOR,gBAAgB,GAAGA,gBAAH,GAAsBM,uBAA7C;AACD,GAFD;;AAIA,MAAMG,UAAU,GAAG,SAAbA,UAAa,CAACC,EAAD,EAAgB;AACjC,QAAMC,UAAU,GAAGJ,aAAa,EAAhC;AACA,QAAMK,UAAU,GAAGJ,iBAAiB,EAApC;AAEA,QAAMK,QAAQ,GAAG,CAAC,CAACF,UAAU,CAACG,IAAX,CAAgB,UAAAC,CAAC;AAAA,aAAIA,CAAC,IAAIL,EAAT;AAAA,KAAjB,CAAnB;;AACA,QAAGR,cAAH,EAAmB;AACjB,UAAGW,QAAH,EACED,UAAU,CAACD,UAAU,CAACK,MAAX,CAAkB,UAAAD,CAAC;AAAA,eAAIA,CAAC,IAAIL,EAAT;AAAA,OAAnB,CAAD,CAAV,CADF,KAIEE,UAAU,8BAAKD,UAAL,IAAiBD,EAAjB,GAAV;AACH,KAND,MAQEE,UAAU,CAACC,QAAQ,GAAG,EAAH,GAAQ,CAACH,EAAD,CAAjB,CAAV;;AAEFT,IAAAA,QAAQ,IAAIA,QAAQ,CAACS,EAAD,CAApB;AACD,GAhBD;;AAkBA,sBACE,oBAAC,4BAAD,QACGZ,KAAK,CAACmB,GAAN,CAAU,UAACC,IAAD;AAAA,wBACT,oBAAC,sBAAD;AACE,MAAA,GAAG,EAAEA,IAAI,CAACR,EADZ;AAEE,MAAA,QAAQ,EAAEQ,IAAI,CAACC,QAFjB;AAGE,MAAA,EAAE,EAAED,IAAI,CAACR,EAHX;AAIE,MAAA,KAAK,EAAEQ,IAAI,CAACE,KAJd;AAKE,MAAA,IAAI,EAAEF,IAAI,CAACG,IALb;AAME,MAAA,QAAQ,EAAE,CAAC,CAACd,aAAa,GAAGO,IAAhB,CAAqB,UAAAC,CAAC;AAAA,eAAIA,CAAC,IAAIG,IAAI,CAACR,EAAd;AAAA,OAAtB,CANd;AAOE,MAAA,MAAM,EAAEZ,KAAK,CAACwB,OAAN,CAAcJ,IAAd,MAAwBpB,KAAK,CAACyB,MAAN,GAAe,CAPjD;AAQE,MAAA,QAAQ,EAAEd;AARZ,OASGS,IAAI,CAACM,QATR,CADS;AAAA,GAAV,CADH,CADF;AAiBD,CA/CD;;;AAfE1B,EAAAA,K;AAQAY,IAAAA,E;AACAS,IAAAA,Q;AACAC,IAAAA,K;AACAC,IAAAA,I;AACAG,IAAAA,Q;;AAXAzB,EAAAA,a;AACAC,EAAAA,gB;AACAC,EAAAA,Q;AACAC,EAAAA,c;;eA4DaL,a","sourcesContent":["import * as React from 'react';\nimport AccordionItem from './AccordionItem';\nimport { AccordionMenuWrapper } from './styles';\n\nexport interface AccordionProps {\n items: AccordionItemProps[];\n selectedItems?: string[];\n setSelectedItems?: (a: string[]) => void;\n onSelect?: (id: string) => void;\n multipleActive?: boolean;\n}\n\nexport interface AccordionItemProps {\n id: string;\n disabled?: boolean;\n title: string;\n icon?: React.ReactNode;\n children: React.ReactNode;\n}\n\nconst AccordionMenu: React.FunctionComponent<AccordionProps> = ({ items, selectedItems, setSelectedItems, onSelect, multipleActive }: AccordionProps) => {\n\n const [builtinSelectedItems, builtinSetSelectedItems] = React.useState<string[]>([]);\n\n const getCollection = () => {\n return selectedItems ? selectedItems : builtinSelectedItems;\n };\n\n const getUpdateFunction = () => {\n return setSelectedItems ? setSelectedItems : builtinSetSelectedItems;\n }\n\n const onSelected = (id: string) => {\n const collection = getCollection();\n const updateFunc = getUpdateFunction();\n\n const isActive = !!collection.find(x => x == id);\n if(multipleActive) {\n if(isActive)\n updateFunc(collection.filter(x => x != id));\n \n else \n updateFunc([...collection, id]);\n }\n else\n updateFunc(isActive ? [] : [id]);\n\n onSelect && onSelect(id);\n };\n\n return (\n <AccordionMenuWrapper>\n {items.map((item) => (\n <AccordionItem\n key={item.id}\n disabled={item.disabled}\n id={item.id}\n title={item.title}\n icon={item.icon}\n isActive={!!getCollection().find(x => x == item.id)}\n isLast={items.indexOf(item) === items.length - 1}\n onSelect={onSelected}>\n {item.children}\n </AccordionItem>\n ))}\n </AccordionMenuWrapper>\n );\n};\n\nexport default AccordionMenu;\n"],"file":"AccordionMenu.js"}
@@ -0,0 +1,101 @@
1
+ "use strict";
2
+
3
+ var _react = _interopRequireDefault(require("react"));
4
+
5
+ var _react2 = require("@testing-library/react");
6
+
7
+ require("jest-styled-components");
8
+
9
+ var _styles = require("../../styles");
10
+
11
+ var _AccordionMenu = _interopRequireDefault(require("../AccordionMenu"));
12
+
13
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
14
+
15
+ function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
16
+
17
+ function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
18
+
19
+ var accordionItems = [{
20
+ id: 'test1_id',
21
+ title: 'Item label with text 1',
22
+ children: /*#__PURE__*/_react.default.createElement("div", null, "content test1")
23
+ }, {
24
+ id: 'test2_id',
25
+ title: 'Item label with text 2',
26
+ children: /*#__PURE__*/_react.default.createElement("div", null, "content test2")
27
+ }];
28
+ describe('<AccordionMenu />', function () {
29
+ it('Check correct text placed on labels', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
30
+ var _render, queryByText;
31
+
32
+ return regeneratorRuntime.wrap(function _callee$(_context) {
33
+ while (1) {
34
+ switch (_context.prev = _context.next) {
35
+ case 0:
36
+ _render = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_AccordionMenu.default, {
37
+ items: accordionItems,
38
+ onSelect: function onSelect() {}
39
+ })), queryByText = _render.queryByText;
40
+ expect(queryByText('Item label with text 1')).toBeDefined();
41
+ expect(queryByText('Item label with text 2')).toBeDefined();
42
+ expect(queryByText('content test1')).toBeNull();
43
+
44
+ case 4:
45
+ case "end":
46
+ return _context.stop();
47
+ }
48
+ }
49
+ }, _callee);
50
+ })));
51
+ it('Check item label element color and label', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
52
+ var _render2, container, headerItem;
53
+
54
+ return regeneratorRuntime.wrap(function _callee2$(_context2) {
55
+ while (1) {
56
+ switch (_context2.prev = _context2.next) {
57
+ case 0:
58
+ _render2 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_AccordionMenu.default, {
59
+ items: accordionItems,
60
+ onSelect: function onSelect() {}
61
+ })), container = _render2.container;
62
+ headerItem = container.querySelector('#test2_id');
63
+ expect(headerItem).toBeDefined();
64
+ expect(headerItem === null || headerItem === void 0 ? void 0 : headerItem.children[0]).toHaveStyleRule('background', _styles.COLORS.neutral_20);
65
+ expect(headerItem === null || headerItem === void 0 ? void 0 : headerItem.textContent).toContain('Item label with text 2');
66
+
67
+ case 5:
68
+ case "end":
69
+ return _context2.stop();
70
+ }
71
+ }
72
+ }, _callee2);
73
+ })));
74
+ it('Check expanded item text', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3() {
75
+ var _headerItem$children$;
76
+
77
+ var _render3, container, headerItem;
78
+
79
+ return regeneratorRuntime.wrap(function _callee3$(_context3) {
80
+ while (1) {
81
+ switch (_context3.prev = _context3.next) {
82
+ case 0:
83
+ _render3 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_AccordionMenu.default, {
84
+ items: accordionItems,
85
+ onSelect: function onSelect() {},
86
+ selectedItems: ['test1_id']
87
+ })), container = _render3.container;
88
+ headerItem = container.querySelector('#test1_id'); //check item expanded
89
+
90
+ expect(headerItem === null || headerItem === void 0 ? void 0 : headerItem.children[1]).toBeDefined();
91
+ expect(headerItem === null || headerItem === void 0 ? void 0 : (_headerItem$children$ = headerItem.children[1]) === null || _headerItem$children$ === void 0 ? void 0 : _headerItem$children$.textContent).toContain('content test1');
92
+
93
+ case 4:
94
+ case "end":
95
+ return _context3.stop();
96
+ }
97
+ }
98
+ }, _callee3);
99
+ })));
100
+ });
101
+ //# sourceMappingURL=AccordionMenu.test.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../../src/Accordion/__tests__/AccordionMenu.test.tsx"],"names":["accordionItems","id","title","children","describe","it","queryByText","expect","toBeDefined","toBeNull","container","headerItem","querySelector","toHaveStyleRule","COLORS","neutral_20","textContent","toContain"],"mappings":";;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;;;AAEA,IAAMA,cAAc,GAAG,CACrB;AACEC,EAAAA,EAAE,EAAE,UADN;AAEEC,EAAAA,KAAK,EAAE,wBAFT;AAGEC,EAAAA,QAAQ,eAAE;AAHZ,CADqB,EAMrB;AACEF,EAAAA,EAAE,EAAE,UADN;AAEEC,EAAAA,KAAK,EAAE,wBAFT;AAGEC,EAAAA,QAAQ,eAAE;AAHZ,CANqB,CAAvB;AAaAC,QAAQ,CAAC,mBAAD,EAAsB,YAAM;AAClCC,EAAAA,EAAE,CAAC,qCAAD,uEAAwC;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA,sBAChB,kCAAO,6BAAC,sBAAD;AAAe,cAAA,KAAK,EAAEL,cAAtB;AAAsC,cAAA,QAAQ,EAAE,oBAAM,CAAE;AAAxD,cAAP,CADgB,EAChCM,WADgC,WAChCA,WADgC;AAExCC,YAAAA,MAAM,CAACD,WAAW,CAAC,wBAAD,CAAZ,CAAN,CAA8CE,WAA9C;AACAD,YAAAA,MAAM,CAACD,WAAW,CAAC,wBAAD,CAAZ,CAAN,CAA8CE,WAA9C;AACAD,YAAAA,MAAM,CAACD,WAAW,CAAC,eAAD,CAAZ,CAAN,CAAqCG,QAArC;;AAJwC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAAxC,GAAF;AAOAJ,EAAAA,EAAE,CAAC,0CAAD,uEAA6C;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA,uBACvB,kCAAO,6BAAC,sBAAD;AAAe,cAAA,KAAK,EAAEL,cAAtB;AAAsC,cAAA,QAAQ,EAAE,oBAAM,CAAE;AAAxD,cAAP,CADuB,EACrCU,SADqC,YACrCA,SADqC;AAEvCC,YAAAA,UAFuC,GAE1BD,SAAS,CAACE,aAAV,CAAwB,WAAxB,CAF0B;AAG7CL,YAAAA,MAAM,CAACI,UAAD,CAAN,CAAmBH,WAAnB;AACAD,YAAAA,MAAM,CAACI,UAAD,aAACA,UAAD,uBAACA,UAAU,CAAER,QAAZ,CAAqB,CAArB,CAAD,CAAN,CAAgCU,eAAhC,CAAgD,YAAhD,EAA8DC,eAAOC,UAArE;AACAR,YAAAA,MAAM,CAACI,UAAD,aAACA,UAAD,uBAACA,UAAU,CAAEK,WAAb,CAAN,CAAgCC,SAAhC,CAA0C,wBAA1C;;AAL6C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAA7C,GAAF;AAQAZ,EAAAA,EAAE,CAAC,0BAAD,uEAA6B;AAAA;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA,uBACP,kCAAO,6BAAC,sBAAD;AAAe,cAAA,KAAK,EAAEL,cAAtB;AAAsC,cAAA,QAAQ,EAAE,oBAAM,CAAE,CAAxD;AAA0D,cAAA,aAAa,EAAE,CAAC,UAAD;AAAzE,cAAP,CADO,EACrBU,SADqB,YACrBA,SADqB;AAEvBC,YAAAA,UAFuB,GAEVD,SAAS,CAACE,aAAV,CAAwB,WAAxB,CAFU,EAG7B;;AACAL,YAAAA,MAAM,CAACI,UAAD,aAACA,UAAD,uBAACA,UAAU,CAAER,QAAZ,CAAqB,CAArB,CAAD,CAAN,CAAgCK,WAAhC;AACAD,YAAAA,MAAM,CAACI,UAAD,aAACA,UAAD,gDAACA,UAAU,CAAER,QAAZ,CAAqB,CAArB,CAAD,0DAAC,sBAAyBa,WAA1B,CAAN,CAA6CC,SAA7C,CAAuD,eAAvD;;AAL6B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAA7B,GAAF;AAOD,CAvBO,CAAR","sourcesContent":["import React from 'react';\nimport { render } from '@testing-library/react';\nimport 'jest-styled-components';\nimport { COLORS } from '../../styles';\nimport AccordionMenu from '../AccordionMenu';\n\nconst accordionItems = [\n {\n id: 'test1_id',\n title: 'Item label with text 1',\n children: <div>content test1</div>,\n },\n {\n id: 'test2_id',\n title: 'Item label with text 2',\n children: <div>content test2</div>,\n },\n];\n\ndescribe('<AccordionMenu />', () => {\n it('Check correct text placed on labels', async () => {\n const { queryByText } = render(<AccordionMenu items={accordionItems} onSelect={() => {}}></AccordionMenu>);\n expect(queryByText('Item label with text 1')).toBeDefined();\n expect(queryByText('Item label with text 2')).toBeDefined();\n expect(queryByText('content test1')).toBeNull();\n });\n\n it('Check item label element color and label', async () => {\n const { container } = render(<AccordionMenu items={accordionItems} onSelect={() => {}}></AccordionMenu>);\n const headerItem = container.querySelector('#test2_id');\n expect(headerItem).toBeDefined();\n expect(headerItem?.children[0]).toHaveStyleRule('background', COLORS.neutral_20);\n expect(headerItem?.textContent).toContain('Item label with text 2');\n });\n\n it('Check expanded item text', async () => {\n const { container } = render(<AccordionMenu items={accordionItems} onSelect={() => {}} selectedItems={['test1_id']}></AccordionMenu>);\n const headerItem = container.querySelector('#test1_id');\n //check item expanded\n expect(headerItem?.children[1]).toBeDefined();\n expect(headerItem?.children[1]?.textContent).toContain('content test1');\n });\n});\n"],"file":"AccordionMenu.test.js"}
@@ -0,0 +1,3 @@
1
+ export { default as AccordionMenu } from './AccordionMenu';
2
+ export { default as AccordionMenuItem } from './AccordionMenu';
3
+ export { AccordionMenuWrapper } from './styles';
@@ -0,0 +1,30 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ Object.defineProperty(exports, "AccordionMenu", {
7
+ enumerable: true,
8
+ get: function get() {
9
+ return _AccordionMenu.default;
10
+ }
11
+ });
12
+ Object.defineProperty(exports, "AccordionMenuItem", {
13
+ enumerable: true,
14
+ get: function get() {
15
+ return _AccordionMenu.default;
16
+ }
17
+ });
18
+ Object.defineProperty(exports, "AccordionMenuWrapper", {
19
+ enumerable: true,
20
+ get: function get() {
21
+ return _styles.AccordionMenuWrapper;
22
+ }
23
+ });
24
+
25
+ var _AccordionMenu = _interopRequireDefault(require("./AccordionMenu"));
26
+
27
+ var _styles = require("./styles");
28
+
29
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
30
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/Accordion/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AAEA","sourcesContent":["export { default as AccordionMenu } from './AccordionMenu';\nexport { default as AccordionMenuItem } from './AccordionMenu';\nexport { AccordionMenuWrapper } from './styles';\n"],"file":"index.js"}
@@ -0,0 +1,11 @@
1
+ export declare const AccordionMenuWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
2
+ export declare const AccordionItemContainer: import("styled-components").StyledComponent<"div", any, {
3
+ displaySeparator: boolean;
4
+ }, never>;
5
+ export declare const ItemHeaderContainer: import("styled-components").StyledComponent<"div", any, {
6
+ isDisabled: boolean;
7
+ isActive: boolean;
8
+ tabbedHere: boolean;
9
+ }, never>;
10
+ export declare const HeaderIconContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
11
+ export declare const ItemBodyContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
@@ -0,0 +1,52 @@
1
+ "use strict";
2
+
3
+ function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
4
+
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.ItemBodyContainer = exports.HeaderIconContainer = exports.ItemHeaderContainer = exports.AccordionItemContainer = exports.AccordionMenuWrapper = void 0;
9
+
10
+ var _styledComponents = _interopRequireWildcard(require("styled-components"));
11
+
12
+ var _styles = require("../styles");
13
+
14
+ var _zIndexes = require("../styles/z-indexes");
15
+
16
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
17
+
18
+ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
19
+
20
+ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
21
+
22
+ function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
23
+
24
+ var AccordionMenuWrapper = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n min-width: 320px;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n"])));
25
+
26
+ exports.AccordionMenuWrapper = AccordionMenuWrapper;
27
+
28
+ var AccordionItemContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n width: 100%;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n border-bottom: ", ";\n"])), function (props) {
29
+ return props.displaySeparator ? "1px solid ".concat(_styles.COLORS.neutral_100) : '';
30
+ });
31
+
32
+ exports.AccordionItemContainer = AccordionItemContainer;
33
+ var disabledState = (0, _styledComponents.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n background: ", "!important;\n color: ", ";\n pointer-events: none;\n svg {\n color: ", "!important;\n }\n"])), _styles.COLORS.white, _styles.COLORS.neutral_300, _styles.COLORS.neutral_300);
34
+
35
+ var ItemHeaderContainer = _styledComponents.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n position: relative;\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 12px 16px 11px 16px;\n cursor: pointer;\n background: ", ";\n cursor: ", ";\n svg:last-child {\n margin-left: auto;\n }\n outline: none;\n ", "\n\n ", "\n :hover {\n background: ", ";\n }\n\n :hover .headerLabel {\n color: ", ";\n }\n\n :active .headerLabel {\n color: ", ";\n }\n\n :hover svg {\n color: ", ";\n }\n\n :active svg {\n color: ", ";\n }\n\n :active {\n background: ", ";\n }\n"])), _styles.COLORS.neutral_20, function (props) {
36
+ return props.isDisabled ? 'not-allowed' : 'pointer';
37
+ }, function (props) {
38
+ return props.tabbedHere ? (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n z-index: ", ";\n box-shadow: 0px 4px 12px ", ", 0px 0px 8px ", ";"])), _zIndexes.Z_INDEXES.focus, _styles.COLORS.primary_500, _styles.COLORS.primary_500) : '';
39
+ }, function (props) {
40
+ return props.isDisabled ? disabledState : '';
41
+ }, _styles.COLORS.primary_20, _styles.COLORS.primary_700, _styles.COLORS.primary_800, _styles.COLORS.primary_700, _styles.COLORS.primary_800, _styles.COLORS.primary_100);
42
+
43
+ exports.ItemHeaderContainer = ItemHeaderContainer;
44
+
45
+ var HeaderIconContainer = _styledComponents.default.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n margin-left: auto;\n"])));
46
+
47
+ exports.HeaderIconContainer = HeaderIconContainer;
48
+
49
+ var ItemBodyContainer = _styledComponents.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n padding: 0px 16px;\n margin: 12px 0;\n background: ", ";\n"])), _styles.COLORS.white);
50
+
51
+ exports.ItemBodyContainer = ItemBodyContainer;
52
+ //# sourceMappingURL=styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/Accordion/styles.ts"],"names":["AccordionMenuWrapper","styled","div","AccordionItemContainer","props","displaySeparator","COLORS","neutral_100","disabledState","css","white","neutral_300","ItemHeaderContainer","neutral_20","isDisabled","tabbedHere","Z_INDEXES","focus","primary_500","primary_20","primary_700","primary_800","primary_100","HeaderIconContainer","ItemBodyContainer"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;;;;;;;;;AAEO,IAAMA,oBAAoB,GAAGC,0BAAOC,GAAV,oKAA1B;;;;AAOA,IAAMC,sBAAsB,GAAGF,0BAAOC,GAAV,0LAKhB,UAACE,KAAD;AAAA,SAAYA,KAAK,CAACC,gBAAN,uBAAsCC,eAAOC,WAA7C,IAA6D,EAAzE;AAAA,CALgB,CAA5B;;;AAQP,IAAMC,aAAa,OAAGC,qBAAH,6LACHH,eAAOI,KADJ,EAERJ,eAAOK,WAFC,EAKNL,eAAOK,WALD,CAAnB;;AASO,IAAMC,mBAAmB,GAAGX,0BAAOC,GAAV,mlBAOhBI,eAAOO,UAPS,EAQpB,UAACT,KAAD;AAAA,SAAYA,KAAK,CAACU,UAAN,GAAmB,aAAnB,GAAmC,SAA/C;AAAA,CARoB,EAa5B,UAAAV,KAAK;AAAA,SAAIA,KAAK,CAACW,UAAN,OAAmBN,qBAAnB,mJACEO,oBAAUC,KADZ,EAEkBX,eAAOY,WAFzB,EAEqDZ,eAAOY,WAF5D,IAE6E,EAFjF;AAAA,CAbuB,EAiB5B,UAACd,KAAD;AAAA,SAAYA,KAAK,CAACU,UAAN,GAAmBN,aAAnB,GAAmC,EAA/C;AAAA,CAjB4B,EAmBdF,eAAOa,UAnBO,EAuBnBb,eAAOc,WAvBY,EA2BnBd,eAAOe,WA3BY,EA+BnBf,eAAOc,WA/BY,EAmCnBd,eAAOe,WAnCY,EAuCdf,eAAOgB,WAvCO,CAAzB;;;;AA2CA,IAAMC,mBAAmB,GAAGtB,0BAAOC,GAAV,+FAAzB;;;;AAIA,IAAMsB,iBAAiB,GAAGvB,0BAAOC,GAAV,wIAGdI,eAAOI,KAHO,CAAvB","sourcesContent":["import styled, { css } from 'styled-components';\nimport { COLORS } from '../styles';\nimport { Z_INDEXES } from '../styles/z-indexes';\n\nexport const AccordionMenuWrapper = styled.div`\n min-width: 320px;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n`;\n\nexport const AccordionItemContainer = styled.div<{ displaySeparator: boolean; }>`\n width: 100%;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n border-bottom: ${(props) => (props.displaySeparator ? `1px solid ${COLORS.neutral_100}` : '')};\n`;\n\nconst disabledState = css`\n background: ${COLORS.white}!important;\n color: ${COLORS.neutral_300};\n pointer-events: none;\n svg {\n color: ${COLORS.neutral_300}!important;\n }\n`;\n\nexport const ItemHeaderContainer = styled.div<{ isDisabled: boolean, isActive: boolean, tabbedHere: boolean }>`\n position: relative;\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 12px 16px 11px 16px;\n cursor: pointer;\n background: ${COLORS.neutral_20};\n cursor: ${(props) => (props.isDisabled ? 'not-allowed' : 'pointer')};\n svg:last-child {\n margin-left: auto;\n }\n outline: none;\n ${props => props.tabbedHere ? css`\n z-index: ${Z_INDEXES.focus};\n box-shadow: 0px 4px 12px ${COLORS.primary_500}, 0px 0px 8px ${COLORS.primary_500};` : ''}\n\n ${(props) => (props.isDisabled ? disabledState : '')}\n :hover {\n background: ${COLORS.primary_20};\n }\n\n :hover .headerLabel {\n color: ${COLORS.primary_700};\n }\n\n :active .headerLabel {\n color: ${COLORS.primary_800};\n }\n\n :hover svg {\n color: ${COLORS.primary_700};\n }\n\n :active svg {\n color: ${COLORS.primary_800};\n }\n\n :active {\n background: ${COLORS.primary_100};\n }\n`;\n\nexport const HeaderIconContainer = styled.div`\n margin-left: auto;\n`;\n\nexport const ItemBodyContainer = styled.div`\n padding: 0px 16px;\n margin: 12px 0;\n background: ${COLORS.white};\n`;\n"],"file":"styles.js"}
@@ -1,6 +1,7 @@
1
1
  import * as React from 'react';
2
+ import { Size } from '../types';
2
3
  declare type BannerProps = {
3
- size?: 'small' | 'medium' | 'large';
4
+ size?: Size.Small | Size.Medium | Size.Large;
4
5
  type?: string;
5
6
  link?: string;
6
7
  linkText?: string;
@@ -247,7 +247,6 @@ var Banner = function Banner(_ref) {
247
247
  };
248
248
 
249
249
  Banner.propTypes = {
250
- size: _propTypes.default.oneOf(['small', 'medium', 'large']),
251
250
  type: _propTypes.default.string,
252
251
  link: _propTypes.default.string,
253
252
  linkText: _propTypes.default.string,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/Banners/Banner.tsx"],"names":["BannerContainer","styled","div","props","type","COLORS","correct_100","black","bottom","BREAKPOINTS","MEDIUM","LARGE","link","BannerCenter","ComponentTextStyle","Regular","color","ButtonWrapper","ButtonContainer","BannerContentWrapper","Banner","size","children","testId","linkText","onClose","icon","noIcon","React","useState","window","innerWidth","width","setWidth","useEffect","handleResize","addEventListener","formatTypeToLowerCase","toLowerCase","warning_100","warning_700","warning_20","Math","floor","random","white","warning_500","critical_100","critical_700","critical_20","critical_500","correct_700","correct_20","correct_500","primary_100","primary_700","primary_20","primary_500","hover"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport {BREAKPOINTS, COLORS, ComponentTextStyle} from '../styles';\nimport {Close, Help, TechnicalWarning, ThumbsUp, Tip} from '../icons/systemicons/SystemIcons';\nimport {IconButton} from '../Button';\nimport {getButtonStyle} from './styles';\nimport {ComponentMStyling, ComponentResponsive} from '../styles/typography';\nimport {HyperLink} from '../HyperLink';\n\n/**\n * Styles for <Banner />\n */\nconst BannerContainer = styled.div<BannerProps>`\n background: ${(props: BannerProps) => (props.type ? props.type : COLORS.correct_100)};\n min-height: 48px;\n display: flex;\n color: ${COLORS.black};\n margin-top: ${(props: BannerProps) => (props.bottom ? 'auto' : '0')};\n\n button:last-child {\n line-height: 0;\n margin: 0 0 0 8px;\n ${BREAKPOINTS.MEDIUM} {\n margin: 0 0 0 16px;\n }\n ${BREAKPOINTS.LARGE} {\n margin: 0 0 0 32px;\n }\n &.small {\n margin: 0 0 0 8px;\n }\n &.medium {\n margin: 0 0 0 16px;\n }\n &.large {\n margin: 0 0 0 32px;\n }\n }\n\n a {\n color: ${(props: BannerProps) => props.link} !important;\n }\n`;\n\nconst BannerCenter = styled.div`\n ${(props) => ComponentMStyling(ComponentTextStyle.Regular, props.color)}\n \n display: flex;\n width: 100%;\n margin: 0 0 0 16px;\n ${BREAKPOINTS.MEDIUM} {\n margin: 0 16px 0 32px;\n }\n ${BREAKPOINTS.LARGE} {\n margin: 0 40px 0 56px;\n }\n &.small {\n margin: 0 0 0 16px;\n }\n &.medium {\n margin: 0 16px 0 32px;\n }\n &.large {\n margin: 0 40px 0 56px;\n }\n\n > svg {\n flex-shrink: 0;\n margin: 12px 0;\n }\n`;\n\nconst ButtonWrapper = styled.div`\n margin: 0 0 0 auto;\n`;\n\nconst ButtonContainer = styled.div<{ type?: string }>`\n display: contents;\n ${(props) => (props.type ? getButtonStyle(props.type) : null)};\n`;\n\nconst BannerContentWrapper = styled.div`\n display: flex;\n align-items: center;\n margin: 12px 0;\n &:not(:first-child) {\n margin-left: 8px;\n }\n`;\n\ntype BannerProps = {\n size?: 'small' | 'medium' | 'large';\n type?: string;\n link?: string;\n linkText?: string;\n hover?: string;\n bottom?: boolean;\n testId?: string;\n icon?: React.ReactNode;\n onClose?: () => void;\n noIcon?: boolean;\n};\n\nconst Banner: React.FunctionComponent<BannerProps> = ({ size, type, children, bottom, testId, linkText, link, onClose, icon, noIcon }) => {\n const [width, setWidth] = React.useState<number>(window.innerWidth);\n React.useEffect(() => {\n function handleResize() {\n setWidth(window.innerWidth);\n }\n window.addEventListener('resize', handleResize);\n });\n\n const formatTypeToLowerCase = type?.toLowerCase();\n switch (formatTypeToLowerCase) {\n case 'warning':\n return (\n <BannerContainer data-testid={testId} type={COLORS.warning_100} link={COLORS.warning_700} hover={COLORS.warning_20} bottom={bottom}>\n <BannerCenter color={COLORS.warning_700} className={size}>\n {icon ? icon : noIcon ? null : <Help color={COLORS.warning_700} size=\"24px\" />}\n <BannerContentWrapper>\n <ComponentResponsive size={size} width={width} color={COLORS.warning_700}>\n {children}&nbsp;&nbsp;\n {link && linkText && (\n <HyperLink id={`${Math.floor(Math.random() * 999999999999)}_BannerLink`} href={link} variant=\"default\">\n {linkText}\n </HyperLink>\n )}\n </ComponentResponsive>\n </BannerContentWrapper>\n {onClose && (\n <ButtonWrapper>\n <ButtonContainer type={formatTypeToLowerCase}>\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground tabbedHereBackgroundColor={COLORS.white} action={() => onClose()}>\n <Close color={COLORS.warning_500} size=\"24px\" />\n </IconButton>\n </ButtonContainer>\n </ButtonWrapper>\n )}\n </BannerCenter>\n </BannerContainer>\n );\n case 'critical':\n return (\n <BannerContainer data-testid={testId} type={COLORS.critical_100} link={COLORS.critical_700} hover={COLORS.critical_20} bottom={bottom} className={size}>\n <BannerCenter color={COLORS.critical_700} className={size}>\n {icon ? icon : noIcon ? null : <TechnicalWarning color={COLORS.critical_700} size=\"24px\" />}\n <BannerContentWrapper>\n <ComponentResponsive size={size} width={width} color={COLORS.critical_700}>\n {children}&nbsp;&nbsp;\n {link && linkText && (\n <HyperLink id={`${Math.floor(Math.random() * 999999999999)}_BannerLink`} href={link} variant=\"default\">\n {linkText}\n </HyperLink>\n )}\n </ComponentResponsive>\n </BannerContentWrapper>\n {onClose && (\n <ButtonWrapper>\n <ButtonContainer type={formatTypeToLowerCase}>\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground tabbedHereBackgroundColor={COLORS.white} action={() => onClose()}>\n <Close color={COLORS.critical_500} size=\"24px\" />\n </IconButton>\n </ButtonContainer>\n </ButtonWrapper>\n )}\n </BannerCenter>\n </BannerContainer>\n );\n case 'positive':\n return (\n <BannerContainer data-testid={testId} type={COLORS.correct_100} link={COLORS.correct_700} hover={COLORS.correct_20} bottom={bottom} className={size}>\n <BannerCenter color={COLORS.correct_700} className={size}>\n {icon ? icon : noIcon ? null : <ThumbsUp color={COLORS.correct_700} size=\"24px\" />}\n <BannerContentWrapper>\n <ComponentResponsive size={size} width={width} color={COLORS.correct_700}>\n {children}&nbsp;&nbsp;\n {link && linkText && (\n <HyperLink id={`${Math.floor(Math.random() * 999999999999)}_BannerLink`} href={link} variant=\"default\">\n {linkText}\n </HyperLink>\n )}\n </ComponentResponsive>\n </BannerContentWrapper>\n {onClose && (\n <ButtonWrapper>\n <ButtonContainer type={formatTypeToLowerCase}>\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground tabbedHereBackgroundColor={COLORS.white} action={() => onClose()}>\n <Close color={COLORS.correct_500} size=\"24px\" />\n </IconButton>\n </ButtonContainer>\n </ButtonWrapper>\n )}\n </BannerCenter>\n </BannerContainer>\n );\n default:\n return (\n <BannerContainer data-testid={testId} type={COLORS.primary_100} link={COLORS.primary_700} hover={COLORS.primary_20} bottom={bottom} className={size}>\n <BannerCenter color={COLORS.primary_700} className={size}>\n {icon ? icon : noIcon ? null : <Tip color={COLORS.primary_700} size=\"24px\" />}\n <BannerContentWrapper>\n <ComponentResponsive size={size} width={width} color={COLORS.primary_700}>\n {children}&nbsp;&nbsp;\n {link && linkText && (\n <HyperLink id={`${Math.floor(Math.random() * 999999999999)}_BannerLink`} href={link} variant=\"default\">\n {linkText}\n </HyperLink>\n )}\n </ComponentResponsive>\n </BannerContentWrapper>\n {onClose && (\n <ButtonWrapper>\n <ButtonContainer type=\"neutral\">\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground tabbedHereBackgroundColor={COLORS.white} action={() => onClose()}>\n <Close color={COLORS.primary_500} size=\"24px\" />\n </IconButton>\n </ButtonContainer>\n </ButtonWrapper>\n )}\n </BannerCenter>\n </BannerContainer>\n );\n }\n};\n\nexport default Banner;\n"],"file":"Banner.js"}
1
+ {"version":3,"sources":["../../../src/Banners/Banner.tsx"],"names":["BannerContainer","styled","div","props","type","COLORS","correct_100","black","bottom","BREAKPOINTS","MEDIUM","LARGE","link","BannerCenter","ComponentTextStyle","Regular","color","ButtonWrapper","ButtonContainer","BannerContentWrapper","Banner","size","children","testId","linkText","onClose","icon","noIcon","React","useState","window","innerWidth","width","setWidth","useEffect","handleResize","addEventListener","formatTypeToLowerCase","toLowerCase","warning_100","warning_700","warning_20","Math","floor","random","white","warning_500","critical_100","critical_700","critical_20","critical_500","correct_700","correct_20","correct_500","primary_100","primary_700","primary_20","primary_500","hover"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AAEA;;AACA;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AACA;AACA,IAAMA,eAAe,GAAGC,0BAAOC,GAAV,8gBACL,UAACC,KAAD;AAAA,SAAyBA,KAAK,CAACC,IAAN,GAAaD,KAAK,CAACC,IAAnB,GAA0BC,eAAOC,WAA1D;AAAA,CADK,EAIVD,eAAOE,KAJG,EAKL,UAACJ,KAAD;AAAA,SAAyBA,KAAK,CAACK,MAAN,GAAe,MAAf,GAAwB,GAAjD;AAAA,CALK,EAUfC,oBAAYC,MAVG,EAafD,oBAAYE,KAbG,EA4BR,UAACR,KAAD;AAAA,SAAwBA,KAAK,CAACS,IAA9B;AAAA,CA5BQ,CAArB;;AAgCA,IAAMC,YAAY,GAAGZ,0BAAOC,GAAV,yaACd,UAACC,KAAD;AAAA,SAAW,mCAAkBW,2BAAmBC,OAArC,EAA8CZ,KAAK,CAACa,KAApD,CAAX;AAAA,CADc,EAMdP,oBAAYC,MANE,EASdD,oBAAYE,KATE,CAAlB;;AA4BA,IAAMM,aAAa,GAAGhB,0BAAOC,GAAV,gGAAnB;;AAIA,IAAMgB,eAAe,GAAGjB,0BAAOC,GAAV,yGAEjB,UAACC,KAAD;AAAA,SAAYA,KAAK,CAACC,IAAN,GAAa,6BAAeD,KAAK,CAACC,IAArB,CAAb,GAA0C,IAAtD;AAAA,CAFiB,CAArB;;AAKA,IAAMe,oBAAoB,GAAGlB,0BAAOC,GAAV,2LAA1B;;AAsBA,IAAMkB,MAA4C,GAAG,SAA/CA,MAA+C,OAAqF;AAAA,MAAlFC,IAAkF,QAAlFA,IAAkF;AAAA,MAA5EjB,IAA4E,QAA5EA,IAA4E;AAAA,MAAtEkB,QAAsE,QAAtEA,QAAsE;AAAA,MAA5Dd,MAA4D,QAA5DA,MAA4D;AAAA,MAApDe,MAAoD,QAApDA,MAAoD;AAAA,MAA5CC,QAA4C,QAA5CA,QAA4C;AAAA,MAAlCZ,IAAkC,QAAlCA,IAAkC;AAAA,MAA5Ba,OAA4B,QAA5BA,OAA4B;AAAA,MAAnBC,IAAmB,QAAnBA,IAAmB;AAAA,MAAbC,MAAa,QAAbA,MAAa;;AACxI,wBAA0BC,KAAK,CAACC,QAAN,CAAuBC,MAAM,CAACC,UAA9B,CAA1B;AAAA;AAAA,MAAOC,KAAP;AAAA,MAAcC,QAAd;;AACAL,EAAAA,KAAK,CAACM,SAAN,CAAgB,YAAM;AACpB,aAASC,YAAT,GAAwB;AACtBF,MAAAA,QAAQ,CAACH,MAAM,CAACC,UAAR,CAAR;AACD;;AACDD,IAAAA,MAAM,CAACM,gBAAP,CAAwB,QAAxB,EAAkCD,YAAlC;AACD,GALD;AAOA,MAAME,qBAAqB,GAAGjC,IAAH,aAAGA,IAAH,uBAAGA,IAAI,CAAEkC,WAAN,EAA9B;;AACA,UAAQD,qBAAR;AACE,SAAK,SAAL;AACE,0BACE,oBAAC,eAAD;AAAiB,uBAAad,MAA9B;AAAsC,QAAA,IAAI,EAAElB,eAAOkC,WAAnD;AAAgE,QAAA,IAAI,EAAElC,eAAOmC,WAA7E;AAA0F,QAAA,KAAK,EAAEnC,eAAOoC,UAAxG;AAAoH,QAAA,MAAM,EAAEjC;AAA5H,sBACE,oBAAC,YAAD;AAAc,QAAA,KAAK,EAAEH,eAAOmC,WAA5B;AAAyC,QAAA,SAAS,EAAEnB;AAApD,SACGK,IAAI,GAAGA,IAAH,GAAUC,MAAM,GAAG,IAAH,gBAAU,oBAAC,iBAAD;AAAM,QAAA,KAAK,EAAEtB,eAAOmC,WAApB;AAAiC,QAAA,IAAI,EAAC;AAAtC,QADjC,eAEE,oBAAC,oBAAD,qBACE,oBAAC,+BAAD;AAAqB,QAAA,IAAI,EAAEnB,IAA3B;AAAiC,QAAA,KAAK,EAAEW,KAAxC;AAA+C,QAAA,KAAK,EAAE3B,eAAOmC;AAA7D,SACGlB,QADH,cAEGV,IAAI,IAAIY,QAAR,iBACC,oBAAC,oBAAD;AAAW,QAAA,EAAE,YAAKkB,IAAI,CAACC,KAAL,CAAWD,IAAI,CAACE,MAAL,KAAgB,YAA3B,CAAL,gBAAb;AAAyE,QAAA,IAAI,EAAEhC,IAA/E;AAAqF,QAAA,OAAO,EAAC;AAA7F,SACGY,QADH,CAHJ,CADF,CAFF,EAYGC,OAAO,iBACN,oBAAC,aAAD,qBACE,oBAAC,eAAD;AAAiB,QAAA,IAAI,EAAEY;AAAvB,sBACE,oBAAC,kBAAD;AAAY,QAAA,OAAO,EAAC,WAApB;AAAgC,QAAA,KAAK,EAAC,UAAtC;AAAiD,QAAA,wBAAwB,MAAzE;AAA0E,QAAA,yBAAyB,EAAEhC,eAAOwC,KAA5G;AAAmH,QAAA,MAAM,EAAE;AAAA,iBAAMpB,OAAO,EAAb;AAAA;AAA3H,sBACE,oBAAC,kBAAD;AAAO,QAAA,KAAK,EAAEpB,eAAOyC,WAArB;AAAkC,QAAA,IAAI,EAAC;AAAvC,QADF,CADF,CADF,CAbJ,CADF,CADF;;AA0BF,SAAK,UAAL;AACE,0BACE,oBAAC,eAAD;AAAiB,uBAAavB,MAA9B;AAAsC,QAAA,IAAI,EAAElB,eAAO0C,YAAnD;AAAiE,QAAA,IAAI,EAAE1C,eAAO2C,YAA9E;AAA4F,QAAA,KAAK,EAAE3C,eAAO4C,WAA1G;AAAuH,QAAA,MAAM,EAAEzC,MAA/H;AAAuI,QAAA,SAAS,EAAEa;AAAlJ,sBACE,oBAAC,YAAD;AAAc,QAAA,KAAK,EAAEhB,eAAO2C,YAA5B;AAA0C,QAAA,SAAS,EAAE3B;AAArD,SACGK,IAAI,GAAGA,IAAH,GAAUC,MAAM,GAAG,IAAH,gBAAU,oBAAC,6BAAD;AAAkB,QAAA,KAAK,EAAEtB,eAAO2C,YAAhC;AAA8C,QAAA,IAAI,EAAC;AAAnD,QADjC,eAEE,oBAAC,oBAAD,qBACE,oBAAC,+BAAD;AAAqB,QAAA,IAAI,EAAE3B,IAA3B;AAAiC,QAAA,KAAK,EAAEW,KAAxC;AAA+C,QAAA,KAAK,EAAE3B,eAAO2C;AAA7D,SACG1B,QADH,cAEGV,IAAI,IAAIY,QAAR,iBACC,oBAAC,oBAAD;AAAW,QAAA,EAAE,YAAKkB,IAAI,CAACC,KAAL,CAAWD,IAAI,CAACE,MAAL,KAAgB,YAA3B,CAAL,gBAAb;AAAyE,QAAA,IAAI,EAAEhC,IAA/E;AAAqF,QAAA,OAAO,EAAC;AAA7F,SACGY,QADH,CAHJ,CADF,CAFF,EAYGC,OAAO,iBACN,oBAAC,aAAD,qBACE,oBAAC,eAAD;AAAiB,QAAA,IAAI,EAAEY;AAAvB,sBACE,oBAAC,kBAAD;AAAY,QAAA,OAAO,EAAC,WAApB;AAAgC,QAAA,KAAK,EAAC,UAAtC;AAAiD,QAAA,wBAAwB,MAAzE;AAA0E,QAAA,yBAAyB,EAAEhC,eAAOwC,KAA5G;AAAmH,QAAA,MAAM,EAAE;AAAA,iBAAMpB,OAAO,EAAb;AAAA;AAA3H,sBACE,oBAAC,kBAAD;AAAO,QAAA,KAAK,EAAEpB,eAAO6C,YAArB;AAAmC,QAAA,IAAI,EAAC;AAAxC,QADF,CADF,CADF,CAbJ,CADF,CADF;;AA0BF,SAAK,UAAL;AACE,0BACE,oBAAC,eAAD;AAAiB,uBAAa3B,MAA9B;AAAsC,QAAA,IAAI,EAAElB,eAAOC,WAAnD;AAAgE,QAAA,IAAI,EAAED,eAAO8C,WAA7E;AAA0F,QAAA,KAAK,EAAE9C,eAAO+C,UAAxG;AAAoH,QAAA,MAAM,EAAE5C,MAA5H;AAAoI,QAAA,SAAS,EAAEa;AAA/I,sBACE,oBAAC,YAAD;AAAc,QAAA,KAAK,EAAEhB,eAAO8C,WAA5B;AAAyC,QAAA,SAAS,EAAE9B;AAApD,SACGK,IAAI,GAAGA,IAAH,GAAUC,MAAM,GAAG,IAAH,gBAAU,oBAAC,qBAAD;AAAU,QAAA,KAAK,EAAEtB,eAAO8C,WAAxB;AAAqC,QAAA,IAAI,EAAC;AAA1C,QADjC,eAEE,oBAAC,oBAAD,qBACE,oBAAC,+BAAD;AAAqB,QAAA,IAAI,EAAE9B,IAA3B;AAAiC,QAAA,KAAK,EAAEW,KAAxC;AAA+C,QAAA,KAAK,EAAE3B,eAAO8C;AAA7D,SACG7B,QADH,cAEGV,IAAI,IAAIY,QAAR,iBACC,oBAAC,oBAAD;AAAW,QAAA,EAAE,YAAKkB,IAAI,CAACC,KAAL,CAAWD,IAAI,CAACE,MAAL,KAAgB,YAA3B,CAAL,gBAAb;AAAyE,QAAA,IAAI,EAAEhC,IAA/E;AAAqF,QAAA,OAAO,EAAC;AAA7F,SACGY,QADH,CAHJ,CADF,CAFF,EAYGC,OAAO,iBACN,oBAAC,aAAD,qBACE,oBAAC,eAAD;AAAiB,QAAA,IAAI,EAAEY;AAAvB,sBACE,oBAAC,kBAAD;AAAY,QAAA,OAAO,EAAC,WAApB;AAAgC,QAAA,KAAK,EAAC,UAAtC;AAAiD,QAAA,wBAAwB,MAAzE;AAA0E,QAAA,yBAAyB,EAAEhC,eAAOwC,KAA5G;AAAmH,QAAA,MAAM,EAAE;AAAA,iBAAMpB,OAAO,EAAb;AAAA;AAA3H,sBACE,oBAAC,kBAAD;AAAO,QAAA,KAAK,EAAEpB,eAAOgD,WAArB;AAAkC,QAAA,IAAI,EAAC;AAAvC,QADF,CADF,CADF,CAbJ,CADF,CADF;;AA0BF;AACE,0BACE,oBAAC,eAAD;AAAiB,uBAAa9B,MAA9B;AAAsC,QAAA,IAAI,EAAElB,eAAOiD,WAAnD;AAAgE,QAAA,IAAI,EAAEjD,eAAOkD,WAA7E;AAA0F,QAAA,KAAK,EAAElD,eAAOmD,UAAxG;AAAoH,QAAA,MAAM,EAAEhD,MAA5H;AAAoI,QAAA,SAAS,EAAEa;AAA/I,sBACE,oBAAC,YAAD;AAAc,QAAA,KAAK,EAAEhB,eAAOkD,WAA5B;AAAyC,QAAA,SAAS,EAAElC;AAApD,SACGK,IAAI,GAAGA,IAAH,GAAUC,MAAM,GAAG,IAAH,gBAAU,oBAAC,gBAAD;AAAK,QAAA,KAAK,EAAEtB,eAAOkD,WAAnB;AAAgC,QAAA,IAAI,EAAC;AAArC,QADjC,eAEE,oBAAC,oBAAD,qBACE,oBAAC,+BAAD;AAAqB,QAAA,IAAI,EAAElC,IAA3B;AAAiC,QAAA,KAAK,EAAEW,KAAxC;AAA+C,QAAA,KAAK,EAAE3B,eAAOkD;AAA7D,SACGjC,QADH,cAEGV,IAAI,IAAIY,QAAR,iBACC,oBAAC,oBAAD;AAAW,QAAA,EAAE,YAAKkB,IAAI,CAACC,KAAL,CAAWD,IAAI,CAACE,MAAL,KAAgB,YAA3B,CAAL,gBAAb;AAAyE,QAAA,IAAI,EAAEhC,IAA/E;AAAqF,QAAA,OAAO,EAAC;AAA7F,SACGY,QADH,CAHJ,CADF,CAFF,EAYGC,OAAO,iBACN,oBAAC,aAAD,qBACE,oBAAC,eAAD;AAAiB,QAAA,IAAI,EAAC;AAAtB,sBACE,oBAAC,kBAAD;AAAY,QAAA,OAAO,EAAC,WAApB;AAAgC,QAAA,KAAK,EAAC,UAAtC;AAAiD,QAAA,wBAAwB,MAAzE;AAA0E,QAAA,yBAAyB,EAAEpB,eAAOwC,KAA5G;AAAmH,QAAA,MAAM,EAAE;AAAA,iBAAMpB,OAAO,EAAb;AAAA;AAA3H,sBACE,oBAAC,kBAAD;AAAO,QAAA,KAAK,EAAEpB,eAAOoD,WAArB;AAAkC,QAAA,IAAI,EAAC;AAAvC,QADF,CADF,CADF,CAbJ,CADF,CADF;AAnFJ;AA8GD,CAxHD;;;AAXErD,EAAAA,I;AACAQ,EAAAA,I;AACAY,EAAAA,Q;AACAkC,EAAAA,K;AACAlD,EAAAA,M;AACAe,EAAAA,M;AACAG,EAAAA,I;AACAD,EAAAA,O;AACAE,EAAAA,M;;eA6HaP,M","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport {BREAKPOINTS, COLORS, ComponentTextStyle} from '../styles';\nimport {Close, Help, TechnicalWarning, ThumbsUp, Tip} from '../icons/systemicons/SystemIcons';\nimport {IconButton} from '../Button';\nimport {getButtonStyle} from './styles';\nimport {Size} from '../types';\nimport {ComponentMStyling, ComponentResponsive} from '../styles/typography';\nimport {HyperLink} from '../HyperLink';\n\n/**\n * Styles for <Banner />\n */\nconst BannerContainer = styled.div<BannerProps>`\n background: ${(props: BannerProps) => (props.type ? props.type : COLORS.correct_100)};\n min-height: 48px;\n display: flex;\n color: ${COLORS.black};\n margin-top: ${(props: BannerProps) => (props.bottom ? 'auto' : '0')};\n\n button:last-child {\n line-height: 0;\n margin: 0 0 0 8px;\n ${BREAKPOINTS.MEDIUM} {\n margin: 0 0 0 16px;\n }\n ${BREAKPOINTS.LARGE} {\n margin: 0 0 0 32px;\n }\n &.small {\n margin: 0 0 0 8px;\n }\n &.medium {\n margin: 0 0 0 16px;\n }\n &.large {\n margin: 0 0 0 32px;\n }\n }\n\n a {\n color: ${(props: BannerProps) => props.link} !important;\n }\n`;\n\nconst BannerCenter = styled.div`\n ${(props) => ComponentMStyling(ComponentTextStyle.Regular, props.color)}\n \n display: flex;\n width: 100%;\n margin: 0 0 0 16px;\n ${BREAKPOINTS.MEDIUM} {\n margin: 0 16px 0 32px;\n }\n ${BREAKPOINTS.LARGE} {\n margin: 0 40px 0 56px;\n }\n &.small {\n margin: 0 0 0 16px;\n }\n &.medium {\n margin: 0 16px 0 32px;\n }\n &.large {\n margin: 0 40px 0 56px;\n }\n\n > svg {\n flex-shrink: 0;\n margin: 12px 0;\n }\n`;\n\nconst ButtonWrapper = styled.div`\n margin: 0 0 0 auto;\n`;\n\nconst ButtonContainer = styled.div<{ type?: string }>`\n display: contents;\n ${(props) => (props.type ? getButtonStyle(props.type) : null)};\n`;\n\nconst BannerContentWrapper = styled.div`\n display: flex;\n align-items: center;\n margin: 12px 0;\n &:not(:first-child) {\n margin-left: 8px;\n }\n`;\n\ntype BannerProps = {\n size?: Size.Small | Size.Medium | Size.Large;\n type?: string;\n link?: string;\n linkText?: string;\n hover?: string;\n bottom?: boolean;\n testId?: string;\n icon?: React.ReactNode;\n onClose?: () => void;\n noIcon?: boolean;\n};\n\nconst Banner: React.FunctionComponent<BannerProps> = ({ size, type, children, bottom, testId, linkText, link, onClose, icon, noIcon }) => {\n const [width, setWidth] = React.useState<number>(window.innerWidth);\n React.useEffect(() => {\n function handleResize() {\n setWidth(window.innerWidth);\n }\n window.addEventListener('resize', handleResize);\n });\n\n const formatTypeToLowerCase = type?.toLowerCase();\n switch (formatTypeToLowerCase) {\n case 'warning':\n return (\n <BannerContainer data-testid={testId} type={COLORS.warning_100} link={COLORS.warning_700} hover={COLORS.warning_20} bottom={bottom}>\n <BannerCenter color={COLORS.warning_700} className={size}>\n {icon ? icon : noIcon ? null : <Help color={COLORS.warning_700} size=\"24px\" />}\n <BannerContentWrapper>\n <ComponentResponsive size={size} width={width} color={COLORS.warning_700}>\n {children}&nbsp;&nbsp;\n {link && linkText && (\n <HyperLink id={`${Math.floor(Math.random() * 999999999999)}_BannerLink`} href={link} variant=\"default\">\n {linkText}\n </HyperLink>\n )}\n </ComponentResponsive>\n </BannerContentWrapper>\n {onClose && (\n <ButtonWrapper>\n <ButtonContainer type={formatTypeToLowerCase}>\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground tabbedHereBackgroundColor={COLORS.white} action={() => onClose()}>\n <Close color={COLORS.warning_500} size=\"24px\" />\n </IconButton>\n </ButtonContainer>\n </ButtonWrapper>\n )}\n </BannerCenter>\n </BannerContainer>\n );\n case 'critical':\n return (\n <BannerContainer data-testid={testId} type={COLORS.critical_100} link={COLORS.critical_700} hover={COLORS.critical_20} bottom={bottom} className={size}>\n <BannerCenter color={COLORS.critical_700} className={size}>\n {icon ? icon : noIcon ? null : <TechnicalWarning color={COLORS.critical_700} size=\"24px\" />}\n <BannerContentWrapper>\n <ComponentResponsive size={size} width={width} color={COLORS.critical_700}>\n {children}&nbsp;&nbsp;\n {link && linkText && (\n <HyperLink id={`${Math.floor(Math.random() * 999999999999)}_BannerLink`} href={link} variant=\"default\">\n {linkText}\n </HyperLink>\n )}\n </ComponentResponsive>\n </BannerContentWrapper>\n {onClose && (\n <ButtonWrapper>\n <ButtonContainer type={formatTypeToLowerCase}>\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground tabbedHereBackgroundColor={COLORS.white} action={() => onClose()}>\n <Close color={COLORS.critical_500} size=\"24px\" />\n </IconButton>\n </ButtonContainer>\n </ButtonWrapper>\n )}\n </BannerCenter>\n </BannerContainer>\n );\n case 'positive':\n return (\n <BannerContainer data-testid={testId} type={COLORS.correct_100} link={COLORS.correct_700} hover={COLORS.correct_20} bottom={bottom} className={size}>\n <BannerCenter color={COLORS.correct_700} className={size}>\n {icon ? icon : noIcon ? null : <ThumbsUp color={COLORS.correct_700} size=\"24px\" />}\n <BannerContentWrapper>\n <ComponentResponsive size={size} width={width} color={COLORS.correct_700}>\n {children}&nbsp;&nbsp;\n {link && linkText && (\n <HyperLink id={`${Math.floor(Math.random() * 999999999999)}_BannerLink`} href={link} variant=\"default\">\n {linkText}\n </HyperLink>\n )}\n </ComponentResponsive>\n </BannerContentWrapper>\n {onClose && (\n <ButtonWrapper>\n <ButtonContainer type={formatTypeToLowerCase}>\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground tabbedHereBackgroundColor={COLORS.white} action={() => onClose()}>\n <Close color={COLORS.correct_500} size=\"24px\" />\n </IconButton>\n </ButtonContainer>\n </ButtonWrapper>\n )}\n </BannerCenter>\n </BannerContainer>\n );\n default:\n return (\n <BannerContainer data-testid={testId} type={COLORS.primary_100} link={COLORS.primary_700} hover={COLORS.primary_20} bottom={bottom} className={size}>\n <BannerCenter color={COLORS.primary_700} className={size}>\n {icon ? icon : noIcon ? null : <Tip color={COLORS.primary_700} size=\"24px\" />}\n <BannerContentWrapper>\n <ComponentResponsive size={size} width={width} color={COLORS.primary_700}>\n {children}&nbsp;&nbsp;\n {link && linkText && (\n <HyperLink id={`${Math.floor(Math.random() * 999999999999)}_BannerLink`} href={link} variant=\"default\">\n {linkText}\n </HyperLink>\n )}\n </ComponentResponsive>\n </BannerContentWrapper>\n {onClose && (\n <ButtonWrapper>\n <ButtonContainer type=\"neutral\">\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground tabbedHereBackgroundColor={COLORS.white} action={() => onClose()}>\n <Close color={COLORS.primary_500} size=\"24px\" />\n </IconButton>\n </ButtonContainer>\n </ButtonWrapper>\n )}\n </BannerCenter>\n </BannerContainer>\n );\n }\n};\n\nexport default Banner;\n"],"file":"Banner.js"}