@dnb/eufemia 9.18.0 → 9.19.0

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 (499) hide show
  1. package/CHANGELOG.md +34 -0
  2. package/cjs/components/Avatar.d.ts +14 -0
  3. package/cjs/components/Avatar.js +52 -0
  4. package/cjs/components/InfoCard.d.ts +14 -0
  5. package/cjs/components/InfoCard.js +52 -0
  6. package/cjs/components/Timeline.d.ts +14 -0
  7. package/cjs/components/Timeline.js +52 -0
  8. package/cjs/components/autocomplete/Autocomplete.d.ts +2 -2
  9. package/cjs/components/avatar/Avatar.js +149 -0
  10. package/cjs/components/avatar/AvatarGroup.js +131 -0
  11. package/cjs/components/avatar/index.d.ts +8 -0
  12. package/cjs/components/avatar/index.js +52 -0
  13. package/cjs/components/avatar/style/_avatar.scss +145 -0
  14. package/cjs/components/avatar/style/dnb-avatar.css +218 -0
  15. package/cjs/components/avatar/style/dnb-avatar.min.css +1 -0
  16. package/cjs/components/avatar/style/dnb-avatar.scss +12 -0
  17. package/cjs/components/avatar/style/index.d.ts +6 -0
  18. package/cjs/components/avatar/style/index.js +3 -0
  19. package/cjs/components/avatar/style/themes/dnb-avatar-theme-ui.css +36 -0
  20. package/cjs/components/avatar/style/themes/dnb-avatar-theme-ui.min.css +1 -0
  21. package/cjs/components/avatar/style/themes/dnb-avatar-theme-ui.scss +29 -0
  22. package/cjs/components/avatar/style/themes/ui.js +3 -0
  23. package/cjs/components/avatar/style.js +3 -0
  24. package/cjs/components/breadcrumb/BreadcrumbItem.js +3 -3
  25. package/cjs/components/button/Button.d.ts +1 -1
  26. package/cjs/components/button/Button.js +1 -1
  27. package/cjs/components/button/style/themes/dnb-button-theme-ui.scss +3 -0
  28. package/cjs/components/date-picker/DatePicker.js +4 -2
  29. package/cjs/components/date-picker/DatePickerFooter.d.ts +1 -0
  30. package/cjs/components/date-picker/DatePickerFooter.js +10 -6
  31. package/cjs/components/dropdown/Dropdown.d.ts +4 -3
  32. package/cjs/components/form-label/FormLabel.d.ts +1 -1
  33. package/cjs/components/heading/Heading.d.ts +2 -2
  34. package/cjs/components/heading/HeadingProvider.d.ts +2 -2
  35. package/cjs/components/help-button/HelpButton.d.ts +1 -1
  36. package/cjs/components/help-button/HelpButtonInstance.d.ts +3 -2
  37. package/cjs/components/icon/Icon.d.ts +1 -1
  38. package/cjs/components/icon-primary/IconPrimary.d.ts +1 -1
  39. package/cjs/components/index.d.ts +6 -0
  40. package/cjs/components/index.js +24 -0
  41. package/cjs/components/info-card/InfoCard.js +180 -0
  42. package/cjs/components/info-card/index.d.ts +8 -0
  43. package/cjs/components/info-card/index.js +52 -0
  44. package/cjs/components/info-card/style/_info-card.scss +52 -0
  45. package/cjs/components/info-card/style/dnb-info-card.css +135 -0
  46. package/cjs/components/info-card/style/dnb-info-card.min.css +1 -0
  47. package/cjs/components/info-card/style/dnb-info-card.scss +12 -0
  48. package/cjs/components/info-card/style/index.d.ts +6 -0
  49. package/cjs/components/info-card/style/index.js +3 -0
  50. package/cjs/components/info-card/style.js +3 -0
  51. package/cjs/components/input/Input.d.ts +2 -1
  52. package/cjs/components/lib.js +27 -0
  53. package/cjs/components/number-format/NumberFormat.d.ts +2 -2
  54. package/cjs/components/pagination/Pagination.js +11 -1
  55. package/cjs/components/radio/Radio.d.ts +1 -1
  56. package/cjs/components/radio/RadioGroup.d.ts +1 -1
  57. package/cjs/components/slider/Slider.d.ts +1 -1
  58. package/cjs/components/step-indicator/StepIndicator.d.ts +3 -3
  59. package/cjs/components/step-indicator/StepIndicatorContext.d.ts +1 -1
  60. package/cjs/components/step-indicator/StepIndicatorItem.d.ts +1 -1
  61. package/cjs/components/step-indicator/StepIndicatorSidebar.d.ts +3 -3
  62. package/cjs/components/step-indicator/StepIndicatorTriggerButton.d.ts +1 -1
  63. package/cjs/components/switch/Switch.d.ts +1 -1
  64. package/cjs/components/tabs/Tabs.d.ts +4 -4
  65. package/cjs/components/tabs/TabsContentWrapper.d.ts +1 -1
  66. package/cjs/components/tabs/TabsCustomContent.d.ts +1 -1
  67. package/cjs/components/tag/Tag.js +85 -25
  68. package/cjs/components/tag/TagContext.js +14 -0
  69. package/cjs/components/tag/TagGroup.js +123 -0
  70. package/cjs/components/tag/style/_tag.scss +80 -16
  71. package/cjs/components/tag/style/dnb-tag.css +849 -33
  72. package/cjs/components/tag/style/dnb-tag.min.css +1 -1
  73. package/cjs/components/tag/style/dnb-tag.scss +3 -0
  74. package/cjs/components/tag/style/themes/_tag-mixins.scss +18 -0
  75. package/cjs/components/timeline/Timeline.js +129 -0
  76. package/cjs/components/timeline/TimelineItem.js +149 -0
  77. package/cjs/components/timeline/index.d.ts +8 -0
  78. package/cjs/components/timeline/index.js +52 -0
  79. package/cjs/components/timeline/style/_timeline.scss +42 -0
  80. package/cjs/components/timeline/style/dnb-timeline.css +307 -0
  81. package/cjs/components/timeline/style/dnb-timeline.min.css +1 -0
  82. package/cjs/components/timeline/style/dnb-timeline.scss +12 -0
  83. package/cjs/components/timeline/style/index.d.ts +6 -0
  84. package/cjs/components/timeline/style/index.js +3 -0
  85. package/cjs/components/timeline/style/themes/dnb-timeline-theme-ui.css +185 -0
  86. package/cjs/components/timeline/style/themes/dnb-timeline-theme-ui.min.css +1 -0
  87. package/cjs/components/timeline/style/themes/dnb-timeline-theme-ui.scss +105 -0
  88. package/cjs/components/timeline/style/themes/ui.js +3 -0
  89. package/cjs/components/timeline/style.js +3 -0
  90. package/cjs/components/toggle-button/ToggleButton.d.ts +2 -2
  91. package/cjs/components/toggle-button/ToggleButtonGroup.d.ts +1 -1
  92. package/cjs/elements/Img.d.ts +2 -2
  93. package/cjs/extensions/payment-card/PaymentCard.d.ts +1 -1
  94. package/cjs/extensions/payment-card/style/_payment-card.scss +0 -1
  95. package/cjs/extensions/payment-card/style/dnb-payment-card.css +0 -1
  96. package/cjs/extensions/payment-card/style/dnb-payment-card.min.css +1 -1
  97. package/cjs/fragments/drawer-list/DrawerListProvider.js +1 -0
  98. package/cjs/index.d.ts +6 -0
  99. package/cjs/index.js +24 -0
  100. package/cjs/shared/Context.js +10 -4
  101. package/cjs/shared/locales/en-GB.js +5 -0
  102. package/cjs/shared/locales/nb-NO.js +5 -0
  103. package/cjs/style/dnb-ui-components.css +710 -34
  104. package/cjs/style/dnb-ui-components.min.css +3 -3
  105. package/cjs/style/dnb-ui-components.scss +3 -0
  106. package/cjs/style/dnb-ui-elements.css +3 -0
  107. package/cjs/style/dnb-ui-elements.min.css +1 -1
  108. package/cjs/style/dnb-ui-extensions.css +0 -1
  109. package/cjs/style/dnb-ui-extensions.min.css +1 -1
  110. package/cjs/style/dnb-ui-tags.css +6 -0
  111. package/cjs/style/dnb-ui-tags.min.css +2 -2
  112. package/cjs/style/elements/code.scss +3 -0
  113. package/cjs/style/themes/theme-open-banking/dnb-theme-open-banking.css +226 -0
  114. package/cjs/style/themes/theme-open-banking/dnb-theme-open-banking.min.css +3 -3
  115. package/cjs/style/themes/theme-ui/dnb-theme-ui.css +226 -0
  116. package/cjs/style/themes/theme-ui/dnb-theme-ui.min.css +3 -3
  117. package/cjs/style/themes/theme-ui/dnb-theme-ui.scss +2 -0
  118. package/components/Avatar.d.ts +14 -0
  119. package/components/Avatar.js +3 -0
  120. package/components/InfoCard.d.ts +14 -0
  121. package/components/InfoCard.js +3 -0
  122. package/components/Timeline.d.ts +14 -0
  123. package/components/Timeline.js +3 -0
  124. package/components/autocomplete/Autocomplete.d.ts +2 -2
  125. package/components/avatar/Avatar.js +89 -0
  126. package/components/avatar/Avatar.tsx +163 -0
  127. package/components/avatar/AvatarGroup.js +94 -0
  128. package/components/avatar/AvatarGroup.tsx +167 -0
  129. package/components/avatar/index.d.ts +8 -0
  130. package/components/avatar/index.js +3 -0
  131. package/components/avatar/style/_avatar.scss +145 -0
  132. package/components/avatar/style/dnb-avatar.css +218 -0
  133. package/components/avatar/style/dnb-avatar.min.css +1 -0
  134. package/components/avatar/style/dnb-avatar.scss +12 -0
  135. package/components/avatar/style/index.d.ts +6 -0
  136. package/components/avatar/style/index.js +1 -0
  137. package/components/avatar/style/themes/dnb-avatar-theme-ui.css +36 -0
  138. package/components/avatar/style/themes/dnb-avatar-theme-ui.min.css +1 -0
  139. package/components/avatar/style/themes/dnb-avatar-theme-ui.scss +29 -0
  140. package/components/avatar/style/themes/ui.js +1 -0
  141. package/components/avatar/style.js +1 -0
  142. package/components/breadcrumb/BreadcrumbItem.js +3 -3
  143. package/components/breadcrumb/BreadcrumbItem.tsx +2 -2
  144. package/components/button/Button.js +1 -1
  145. package/components/button/style/themes/dnb-button-theme-ui.scss +3 -0
  146. package/components/date-picker/DatePicker.js +4 -2
  147. package/components/date-picker/DatePickerFooter.d.ts +1 -0
  148. package/components/date-picker/DatePickerFooter.js +10 -6
  149. package/components/dropdown/Dropdown.d.ts +4 -3
  150. package/components/form-label/FormLabel.d.ts +1 -1
  151. package/components/heading/Heading.d.ts +2 -2
  152. package/components/heading/HeadingProvider.d.ts +2 -2
  153. package/components/help-button/HelpButton.d.ts +1 -1
  154. package/components/help-button/HelpButtonInstance.d.ts +3 -2
  155. package/components/icon/Icon.d.ts +1 -1
  156. package/components/index.d.ts +6 -0
  157. package/components/index.js +4 -1
  158. package/components/info-card/InfoCard.js +140 -0
  159. package/components/info-card/InfoCard.tsx +249 -0
  160. package/components/info-card/index.d.ts +8 -0
  161. package/components/info-card/index.js +3 -0
  162. package/components/info-card/style/_info-card.scss +52 -0
  163. package/components/info-card/style/dnb-info-card.css +135 -0
  164. package/components/info-card/style/dnb-info-card.min.css +1 -0
  165. package/components/info-card/style/dnb-info-card.scss +12 -0
  166. package/components/info-card/style/index.d.ts +6 -0
  167. package/components/info-card/style/index.js +1 -0
  168. package/components/info-card/style.js +1 -0
  169. package/components/input/Input.d.ts +2 -1
  170. package/components/lib.js +7 -1
  171. package/components/number-format/NumberFormat.d.ts +2 -2
  172. package/components/pagination/Pagination.js +7 -0
  173. package/components/radio/Radio.d.ts +1 -1
  174. package/components/radio/RadioGroup.d.ts +1 -1
  175. package/components/slider/Slider.d.ts +1 -1
  176. package/components/step-indicator/StepIndicator.d.ts +3 -3
  177. package/components/step-indicator/StepIndicatorContext.d.ts +1 -1
  178. package/components/step-indicator/StepIndicatorItem.d.ts +1 -1
  179. package/components/step-indicator/StepIndicatorSidebar.d.ts +3 -3
  180. package/components/step-indicator/StepIndicatorTriggerButton.d.ts +1 -1
  181. package/components/switch/Switch.d.ts +1 -1
  182. package/components/tabs/Tabs.d.ts +4 -4
  183. package/components/tabs/TabsContentWrapper.d.ts +1 -1
  184. package/components/tabs/TabsCustomContent.d.ts +1 -1
  185. package/components/tag/Tag.js +84 -25
  186. package/components/tag/Tag.tsx +133 -34
  187. package/components/tag/TagContext.js +2 -0
  188. package/components/tag/TagContext.tsx +3 -0
  189. package/components/tag/TagGroup.js +60 -0
  190. package/components/tag/TagGroup.tsx +80 -0
  191. package/components/tag/style/_tag.scss +80 -16
  192. package/components/tag/style/dnb-tag.css +849 -33
  193. package/components/tag/style/dnb-tag.min.css +1 -1
  194. package/components/tag/style/dnb-tag.scss +3 -0
  195. package/components/tag/style/themes/_tag-mixins.scss +18 -0
  196. package/components/timeline/Timeline.js +57 -0
  197. package/components/timeline/Timeline.tsx +91 -0
  198. package/components/timeline/TimelineItem.js +112 -0
  199. package/components/timeline/TimelineItem.tsx +193 -0
  200. package/components/timeline/index.d.ts +8 -0
  201. package/components/timeline/index.js +3 -0
  202. package/components/timeline/style/_timeline.scss +42 -0
  203. package/components/timeline/style/dnb-timeline.css +307 -0
  204. package/components/timeline/style/dnb-timeline.min.css +1 -0
  205. package/components/timeline/style/dnb-timeline.scss +12 -0
  206. package/components/timeline/style/index.d.ts +6 -0
  207. package/components/timeline/style/index.js +1 -0
  208. package/components/timeline/style/themes/dnb-timeline-theme-ui.css +185 -0
  209. package/components/timeline/style/themes/dnb-timeline-theme-ui.min.css +1 -0
  210. package/components/timeline/style/themes/dnb-timeline-theme-ui.scss +105 -0
  211. package/components/timeline/style/themes/ui.js +1 -0
  212. package/components/timeline/style.js +1 -0
  213. package/components/toggle-button/ToggleButton.d.ts +2 -2
  214. package/components/toggle-button/ToggleButtonGroup.d.ts +1 -1
  215. package/elements/Img.d.ts +1 -1
  216. package/es/components/Avatar.d.ts +14 -0
  217. package/es/components/Avatar.js +3 -0
  218. package/es/components/InfoCard.d.ts +14 -0
  219. package/es/components/InfoCard.js +3 -0
  220. package/es/components/Timeline.d.ts +14 -0
  221. package/es/components/Timeline.js +3 -0
  222. package/es/components/autocomplete/Autocomplete.d.ts +2 -2
  223. package/es/components/avatar/Avatar.js +83 -0
  224. package/es/components/avatar/Avatar.tsx +163 -0
  225. package/es/components/avatar/AvatarGroup.js +89 -0
  226. package/es/components/avatar/AvatarGroup.tsx +167 -0
  227. package/es/components/avatar/index.d.ts +8 -0
  228. package/es/components/avatar/index.js +3 -0
  229. package/es/components/avatar/style/_avatar.scss +145 -0
  230. package/es/components/avatar/style/dnb-avatar.css +218 -0
  231. package/es/components/avatar/style/dnb-avatar.min.css +1 -0
  232. package/es/components/avatar/style/dnb-avatar.scss +12 -0
  233. package/es/components/avatar/style/index.d.ts +6 -0
  234. package/es/components/avatar/style/index.js +1 -0
  235. package/es/components/avatar/style/themes/dnb-avatar-theme-ui.css +36 -0
  236. package/es/components/avatar/style/themes/dnb-avatar-theme-ui.min.css +1 -0
  237. package/es/components/avatar/style/themes/dnb-avatar-theme-ui.scss +29 -0
  238. package/es/components/avatar/style/themes/ui.js +1 -0
  239. package/es/components/avatar/style.js +1 -0
  240. package/es/components/breadcrumb/BreadcrumbItem.js +3 -3
  241. package/es/components/breadcrumb/BreadcrumbItem.tsx +2 -2
  242. package/es/components/button/Button.d.ts +1 -1
  243. package/es/components/button/Button.js +1 -1
  244. package/es/components/button/style/themes/dnb-button-theme-ui.scss +3 -0
  245. package/es/components/date-picker/DatePicker.js +4 -2
  246. package/es/components/date-picker/DatePickerFooter.d.ts +1 -0
  247. package/es/components/date-picker/DatePickerFooter.js +9 -6
  248. package/es/components/dropdown/Dropdown.d.ts +4 -3
  249. package/es/components/form-label/FormLabel.d.ts +1 -1
  250. package/es/components/heading/Heading.d.ts +2 -2
  251. package/es/components/heading/HeadingProvider.d.ts +2 -2
  252. package/es/components/help-button/HelpButton.d.ts +1 -1
  253. package/es/components/help-button/HelpButtonInstance.d.ts +3 -2
  254. package/es/components/icon/Icon.d.ts +1 -1
  255. package/es/components/icon-primary/IconPrimary.d.ts +1 -1
  256. package/es/components/index.d.ts +6 -0
  257. package/es/components/index.js +4 -1
  258. package/es/components/info-card/InfoCard.js +135 -0
  259. package/es/components/info-card/InfoCard.tsx +249 -0
  260. package/es/components/info-card/index.d.ts +8 -0
  261. package/es/components/info-card/index.js +3 -0
  262. package/es/components/info-card/style/_info-card.scss +52 -0
  263. package/es/components/info-card/style/dnb-info-card.css +135 -0
  264. package/es/components/info-card/style/dnb-info-card.min.css +1 -0
  265. package/es/components/info-card/style/dnb-info-card.scss +12 -0
  266. package/es/components/info-card/style/index.d.ts +6 -0
  267. package/es/components/info-card/style/index.js +1 -0
  268. package/es/components/info-card/style.js +1 -0
  269. package/es/components/input/Input.d.ts +2 -1
  270. package/es/components/lib.js +7 -1
  271. package/es/components/number-format/NumberFormat.d.ts +2 -2
  272. package/es/components/pagination/Pagination.js +3 -0
  273. package/es/components/radio/Radio.d.ts +1 -1
  274. package/es/components/radio/RadioGroup.d.ts +1 -1
  275. package/es/components/slider/Slider.d.ts +1 -1
  276. package/es/components/step-indicator/StepIndicator.d.ts +3 -3
  277. package/es/components/step-indicator/StepIndicatorContext.d.ts +1 -1
  278. package/es/components/step-indicator/StepIndicatorItem.d.ts +1 -1
  279. package/es/components/step-indicator/StepIndicatorSidebar.d.ts +3 -3
  280. package/es/components/step-indicator/StepIndicatorTriggerButton.d.ts +1 -1
  281. package/es/components/switch/Switch.d.ts +1 -1
  282. package/es/components/tabs/Tabs.d.ts +4 -4
  283. package/es/components/tabs/TabsContentWrapper.d.ts +1 -1
  284. package/es/components/tabs/TabsCustomContent.d.ts +1 -1
  285. package/es/components/tag/Tag.js +83 -26
  286. package/es/components/tag/Tag.tsx +133 -34
  287. package/es/components/tag/TagContext.js +2 -0
  288. package/es/components/tag/TagContext.tsx +3 -0
  289. package/es/components/tag/TagGroup.js +53 -0
  290. package/es/components/tag/TagGroup.tsx +80 -0
  291. package/es/components/tag/style/_tag.scss +80 -16
  292. package/es/components/tag/style/dnb-tag.css +849 -33
  293. package/es/components/tag/style/dnb-tag.min.css +1 -1
  294. package/es/components/tag/style/dnb-tag.scss +3 -0
  295. package/es/components/tag/style/themes/_tag-mixins.scss +18 -0
  296. package/es/components/timeline/Timeline.js +48 -0
  297. package/es/components/timeline/Timeline.tsx +91 -0
  298. package/es/components/timeline/TimelineItem.js +111 -0
  299. package/es/components/timeline/TimelineItem.tsx +193 -0
  300. package/es/components/timeline/index.d.ts +8 -0
  301. package/es/components/timeline/index.js +3 -0
  302. package/es/components/timeline/style/_timeline.scss +42 -0
  303. package/es/components/timeline/style/dnb-timeline.css +307 -0
  304. package/es/components/timeline/style/dnb-timeline.min.css +1 -0
  305. package/es/components/timeline/style/dnb-timeline.scss +12 -0
  306. package/es/components/timeline/style/index.d.ts +6 -0
  307. package/es/components/timeline/style/index.js +1 -0
  308. package/es/components/timeline/style/themes/dnb-timeline-theme-ui.css +185 -0
  309. package/es/components/timeline/style/themes/dnb-timeline-theme-ui.min.css +1 -0
  310. package/es/components/timeline/style/themes/dnb-timeline-theme-ui.scss +105 -0
  311. package/es/components/timeline/style/themes/ui.js +1 -0
  312. package/es/components/timeline/style.js +1 -0
  313. package/es/components/toggle-button/ToggleButton.d.ts +2 -2
  314. package/es/components/toggle-button/ToggleButtonGroup.d.ts +1 -1
  315. package/es/elements/Img.d.ts +2 -2
  316. package/es/extensions/payment-card/PaymentCard.d.ts +1 -1
  317. package/es/extensions/payment-card/style/_payment-card.scss +0 -1
  318. package/es/extensions/payment-card/style/dnb-payment-card.css +0 -1
  319. package/es/extensions/payment-card/style/dnb-payment-card.min.css +1 -1
  320. package/es/fragments/drawer-list/DrawerListProvider.js +1 -0
  321. package/es/index.d.ts +6 -0
  322. package/es/index.js +4 -1
  323. package/es/shared/Context.js +10 -4
  324. package/es/shared/locales/en-GB.js +5 -0
  325. package/es/shared/locales/nb-NO.js +5 -0
  326. package/es/style/dnb-ui-components.css +710 -34
  327. package/es/style/dnb-ui-components.min.css +3 -3
  328. package/es/style/dnb-ui-components.scss +3 -0
  329. package/es/style/dnb-ui-elements.css +3 -0
  330. package/es/style/dnb-ui-elements.min.css +1 -1
  331. package/es/style/dnb-ui-extensions.css +0 -1
  332. package/es/style/dnb-ui-extensions.min.css +1 -1
  333. package/es/style/dnb-ui-tags.css +6 -0
  334. package/es/style/dnb-ui-tags.min.css +2 -2
  335. package/es/style/elements/code.scss +3 -0
  336. package/es/style/themes/theme-open-banking/dnb-theme-open-banking.css +226 -0
  337. package/es/style/themes/theme-open-banking/dnb-theme-open-banking.min.css +3 -3
  338. package/es/style/themes/theme-ui/dnb-theme-ui.css +226 -0
  339. package/es/style/themes/theme-ui/dnb-theme-ui.min.css +3 -3
  340. package/es/style/themes/theme-ui/dnb-theme-ui.scss +2 -0
  341. package/esm/components/Avatar.d.ts +14 -0
  342. package/esm/components/Avatar.js +3 -0
  343. package/esm/components/InfoCard.d.ts +14 -0
  344. package/esm/components/InfoCard.js +3 -0
  345. package/esm/components/Timeline.d.ts +14 -0
  346. package/esm/components/Timeline.js +3 -0
  347. package/esm/components/autocomplete/Autocomplete.d.ts +2 -2
  348. package/esm/components/avatar/Avatar.js +89 -0
  349. package/esm/components/avatar/Avatar.tsx +163 -0
  350. package/esm/components/avatar/AvatarGroup.js +94 -0
  351. package/esm/components/avatar/AvatarGroup.tsx +167 -0
  352. package/esm/components/avatar/index.d.ts +8 -0
  353. package/esm/components/avatar/index.js +3 -0
  354. package/esm/components/avatar/style/_avatar.scss +145 -0
  355. package/esm/components/avatar/style/dnb-avatar.css +218 -0
  356. package/esm/components/avatar/style/dnb-avatar.min.css +1 -0
  357. package/esm/components/avatar/style/dnb-avatar.scss +12 -0
  358. package/esm/components/avatar/style/index.d.ts +6 -0
  359. package/esm/components/avatar/style/index.js +1 -0
  360. package/esm/components/avatar/style/themes/dnb-avatar-theme-ui.css +36 -0
  361. package/esm/components/avatar/style/themes/dnb-avatar-theme-ui.min.css +1 -0
  362. package/esm/components/avatar/style/themes/dnb-avatar-theme-ui.scss +29 -0
  363. package/esm/components/avatar/style/themes/ui.js +1 -0
  364. package/esm/components/avatar/style.js +1 -0
  365. package/esm/components/breadcrumb/BreadcrumbItem.js +3 -3
  366. package/esm/components/breadcrumb/BreadcrumbItem.tsx +2 -2
  367. package/esm/components/button/Button.js +1 -1
  368. package/esm/components/button/style/themes/dnb-button-theme-ui.scss +3 -0
  369. package/esm/components/date-picker/DatePicker.js +4 -2
  370. package/esm/components/date-picker/DatePickerFooter.d.ts +1 -0
  371. package/esm/components/date-picker/DatePickerFooter.js +10 -6
  372. package/esm/components/dropdown/Dropdown.d.ts +4 -3
  373. package/esm/components/form-label/FormLabel.d.ts +1 -1
  374. package/esm/components/heading/Heading.d.ts +2 -2
  375. package/esm/components/heading/HeadingProvider.d.ts +2 -2
  376. package/esm/components/help-button/HelpButton.d.ts +1 -1
  377. package/esm/components/help-button/HelpButtonInstance.d.ts +3 -2
  378. package/esm/components/icon/Icon.d.ts +1 -1
  379. package/esm/components/index.d.ts +6 -0
  380. package/esm/components/index.js +4 -1
  381. package/esm/components/info-card/InfoCard.js +140 -0
  382. package/esm/components/info-card/InfoCard.tsx +249 -0
  383. package/esm/components/info-card/index.d.ts +8 -0
  384. package/esm/components/info-card/index.js +3 -0
  385. package/esm/components/info-card/style/_info-card.scss +52 -0
  386. package/esm/components/info-card/style/dnb-info-card.css +135 -0
  387. package/esm/components/info-card/style/dnb-info-card.min.css +1 -0
  388. package/esm/components/info-card/style/dnb-info-card.scss +12 -0
  389. package/esm/components/info-card/style/index.d.ts +6 -0
  390. package/esm/components/info-card/style/index.js +1 -0
  391. package/esm/components/info-card/style.js +1 -0
  392. package/esm/components/input/Input.d.ts +2 -1
  393. package/esm/components/lib.js +7 -1
  394. package/esm/components/number-format/NumberFormat.d.ts +2 -2
  395. package/esm/components/pagination/Pagination.js +7 -0
  396. package/esm/components/radio/Radio.d.ts +1 -1
  397. package/esm/components/radio/RadioGroup.d.ts +1 -1
  398. package/esm/components/slider/Slider.d.ts +1 -1
  399. package/esm/components/step-indicator/StepIndicator.d.ts +3 -3
  400. package/esm/components/step-indicator/StepIndicatorContext.d.ts +1 -1
  401. package/esm/components/step-indicator/StepIndicatorItem.d.ts +1 -1
  402. package/esm/components/step-indicator/StepIndicatorSidebar.d.ts +3 -3
  403. package/esm/components/step-indicator/StepIndicatorTriggerButton.d.ts +1 -1
  404. package/esm/components/switch/Switch.d.ts +1 -1
  405. package/esm/components/tabs/Tabs.d.ts +4 -4
  406. package/esm/components/tabs/TabsContentWrapper.d.ts +1 -1
  407. package/esm/components/tabs/TabsCustomContent.d.ts +1 -1
  408. package/esm/components/tag/Tag.js +84 -25
  409. package/esm/components/tag/Tag.tsx +133 -34
  410. package/esm/components/tag/TagContext.js +2 -0
  411. package/esm/components/tag/TagContext.tsx +3 -0
  412. package/esm/components/tag/TagGroup.js +60 -0
  413. package/esm/components/tag/TagGroup.tsx +80 -0
  414. package/esm/components/tag/style/_tag.scss +80 -16
  415. package/esm/components/tag/style/dnb-tag.css +849 -33
  416. package/esm/components/tag/style/dnb-tag.min.css +1 -1
  417. package/esm/components/tag/style/dnb-tag.scss +3 -0
  418. package/esm/components/tag/style/themes/_tag-mixins.scss +18 -0
  419. package/esm/components/timeline/Timeline.js +57 -0
  420. package/esm/components/timeline/Timeline.tsx +91 -0
  421. package/esm/components/timeline/TimelineItem.js +112 -0
  422. package/esm/components/timeline/TimelineItem.tsx +193 -0
  423. package/esm/components/timeline/index.d.ts +8 -0
  424. package/esm/components/timeline/index.js +3 -0
  425. package/esm/components/timeline/style/_timeline.scss +42 -0
  426. package/esm/components/timeline/style/dnb-timeline.css +307 -0
  427. package/esm/components/timeline/style/dnb-timeline.min.css +1 -0
  428. package/esm/components/timeline/style/dnb-timeline.scss +12 -0
  429. package/esm/components/timeline/style/index.d.ts +6 -0
  430. package/esm/components/timeline/style/index.js +1 -0
  431. package/esm/components/timeline/style/themes/dnb-timeline-theme-ui.css +185 -0
  432. package/esm/components/timeline/style/themes/dnb-timeline-theme-ui.min.css +1 -0
  433. package/esm/components/timeline/style/themes/dnb-timeline-theme-ui.scss +105 -0
  434. package/esm/components/timeline/style/themes/ui.js +1 -0
  435. package/esm/components/timeline/style.js +1 -0
  436. package/esm/components/toggle-button/ToggleButton.d.ts +2 -2
  437. package/esm/components/toggle-button/ToggleButtonGroup.d.ts +1 -1
  438. package/esm/dnb-ui-components.min.mjs +4 -4
  439. package/esm/dnb-ui-elements.min.mjs +1 -1
  440. package/esm/dnb-ui-extensions.min.mjs +3 -3
  441. package/esm/dnb-ui-lib.min.mjs +4 -4
  442. package/esm/dnb-ui-web-components.min.mjs +4 -4
  443. package/esm/elements/Img.d.ts +1 -1
  444. package/esm/extensions/payment-card/PaymentCard.d.ts +1 -1
  445. package/esm/extensions/payment-card/style/_payment-card.scss +0 -1
  446. package/esm/extensions/payment-card/style/dnb-payment-card.css +0 -1
  447. package/esm/extensions/payment-card/style/dnb-payment-card.min.css +1 -1
  448. package/esm/fragments/drawer-list/DrawerListProvider.js +1 -0
  449. package/esm/index.d.ts +6 -0
  450. package/esm/index.js +4 -1
  451. package/esm/shared/Context.js +10 -4
  452. package/esm/shared/locales/en-GB.js +5 -0
  453. package/esm/shared/locales/nb-NO.js +5 -0
  454. package/esm/style/dnb-ui-components.css +710 -34
  455. package/esm/style/dnb-ui-components.min.css +3 -3
  456. package/esm/style/dnb-ui-components.scss +3 -0
  457. package/esm/style/dnb-ui-elements.css +3 -0
  458. package/esm/style/dnb-ui-elements.min.css +1 -1
  459. package/esm/style/dnb-ui-extensions.css +0 -1
  460. package/esm/style/dnb-ui-extensions.min.css +1 -1
  461. package/esm/style/dnb-ui-tags.css +6 -0
  462. package/esm/style/dnb-ui-tags.min.css +2 -2
  463. package/esm/style/elements/code.scss +3 -0
  464. package/esm/style/themes/theme-open-banking/dnb-theme-open-banking.css +226 -0
  465. package/esm/style/themes/theme-open-banking/dnb-theme-open-banking.min.css +3 -3
  466. package/esm/style/themes/theme-ui/dnb-theme-ui.css +226 -0
  467. package/esm/style/themes/theme-ui/dnb-theme-ui.min.css +3 -3
  468. package/esm/style/themes/theme-ui/dnb-theme-ui.scss +2 -0
  469. package/extensions/payment-card/PaymentCard.d.ts +1 -1
  470. package/extensions/payment-card/style/_payment-card.scss +0 -1
  471. package/extensions/payment-card/style/dnb-payment-card.css +0 -1
  472. package/extensions/payment-card/style/dnb-payment-card.min.css +1 -1
  473. package/fragments/drawer-list/DrawerListProvider.js +1 -0
  474. package/index.d.ts +6 -0
  475. package/index.js +4 -1
  476. package/package.json +2 -3
  477. package/shared/Context.js +10 -4
  478. package/shared/locales/en-GB.js +5 -0
  479. package/shared/locales/nb-NO.js +5 -0
  480. package/style/dnb-ui-components.css +710 -34
  481. package/style/dnb-ui-components.min.css +3 -3
  482. package/style/dnb-ui-components.scss +3 -0
  483. package/style/dnb-ui-elements.css +3 -0
  484. package/style/dnb-ui-elements.min.css +1 -1
  485. package/style/dnb-ui-extensions.css +0 -1
  486. package/style/dnb-ui-extensions.min.css +1 -1
  487. package/style/dnb-ui-tags.css +6 -0
  488. package/style/dnb-ui-tags.min.css +2 -2
  489. package/style/elements/code.scss +3 -0
  490. package/style/themes/theme-open-banking/dnb-theme-open-banking.css +226 -0
  491. package/style/themes/theme-open-banking/dnb-theme-open-banking.min.css +3 -3
  492. package/style/themes/theme-ui/dnb-theme-ui.css +226 -0
  493. package/style/themes/theme-ui/dnb-theme-ui.min.css +3 -3
  494. package/style/themes/theme-ui/dnb-theme-ui.scss +2 -0
  495. package/umd/dnb-ui-components.min.js +5 -5
  496. package/umd/dnb-ui-elements.min.js +3 -3
  497. package/umd/dnb-ui-extensions.min.js +3 -3
  498. package/umd/dnb-ui-lib.min.js +5 -5
  499. package/umd/dnb-ui-web-components.min.js +5 -5
@@ -1 +1 @@
1
- .dnb-tag{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:rgba(0,0,0,0);-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;color:#333;color:var(--color-black-80,#333);font-family:DNB,sans-serif;font-family:var(--font-family-default);font-size:1rem;font-size:var(--font-size-small);font-style:normal;font-weight:400;font-weight:var(--font-weight-basis);line-height:1.5rem;line-height:var(--line-height-basis);margin:0;padding:0;-moz-tab-size:4;-o-tab-size:4;tab-size:4;word-break:break-word}.dnb-tag *,.dnb-tag :after,.dnb-tag :before{background-repeat:no-repeat;-webkit-box-sizing:border-box;box-sizing:border-box}.dnb-tag :after,.dnb-tag :before{text-decoration:inherit;vertical-align:inherit}:root{--tag-border-radius:2.5rem}.dnb-tag{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-webkit-box-pack:center;-ms-flex-pack:center;background-color:#ebebeb;background-color:var(--color-black-8);border-radius:2.5rem;border-radius:var(--tag-border-radius);display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-direction:row;flex-direction:row;font-size:.875rem;font-size:var(--font-size-x-small);justify-content:center;padding:.25rem .5rem;padding:var(--spacing-xx-small) var(--spacing-x-small)}.dnb-tag,.dnb-tag__icon{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.dnb-tag__icon{display:-webkit-box;display:-ms-flexbox;display:flex}.dnb-tag__text{color:#333;color:var(--color-black-80)}
1
+ .dnb-icon{color:inherit;display:inline-block;font-size:1rem;height:1em;line-height:1rem;vertical-align:middle;width:1em}.dnb-icon img,.dnb-icon svg{shape-rendering:geometricPrecision;height:inherit;vertical-align:top;width:inherit}.dnb-icon svg[width="100%"]{width:inherit}.dnb-icon svg[height="100%"]{height:inherit}.dnb-icon--inherit-color svg:not([fill]),.dnb-icon--inherit-color svg [fill]{fill:currentColor}.dnb-icon--inherit-color svg [stroke]{stroke:currentColor}.dnb-icon--small{font-size:.75rem}.dnb-icon--default{font-size:1rem}.dnb-icon--medium{font-size:1.5rem}.dnb-icon--large{font-size:2rem}.dnb-icon--x-large{font-size:2.5rem}.dnb-icon--xx-large{font-size:3rem}.dnb-icon--custom-size{height:auto;width:auto}.dnb-icon--auto{font-size:1em}.dnb-icon--auto>.dnb-icon--wrapper{-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;justify-content:center}h1 .dnb-icon,h2 .dnb-icon,h3 .dnb-icon,h4 .dnb-icon,h5 .dnb-icon,h6 .dnb-icon{vertical-align:middle}.dnb-icon.dnb-skeleton{color:#ebebeb!important;color:var(--skeleton-color)!important}.dnb-icon.dnb-skeleton:after,.dnb-icon.dnb-skeleton:before{content:none!important}@media screen and (-ms-high-contrast:none){.dnb-icon{-webkit-box-flex:0;-ms-flex:none;flex:none}}.dnb-form-status{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:rgba(0,0,0,0);-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;color:#333;color:var(--color-black-80,#333);font-family:DNB,sans-serif;font-family:var(--font-family-default);font-size:1rem;font-size:var(--font-size-small);font-style:normal;font-weight:400;font-weight:var(--font-weight-basis);line-height:1.5rem;line-height:var(--line-height-basis);margin:0;padding:0;-moz-tab-size:4;-o-tab-size:4;tab-size:4;word-break:break-word}.dnb-form-status *,.dnb-form-status :after,.dnb-form-status :before{background-repeat:no-repeat;-webkit-box-sizing:border-box;box-sizing:border-box}.dnb-form-status :after,.dnb-form-status :before{text-decoration:inherit;vertical-align:inherit}:root{--form-status-radius:0.25rem}.dnb-form-status{display:-webkit-box;display:-ms-flexbox;display:flex;opacity:1;-webkit-transition:height .4s cubic-bezier(.42,0,0,1),opacity .4s cubic-bezier(.42,0,0,1),margin .4s cubic-bezier(.42,0,0,1),padding .4s cubic-bezier(.42,0,0,1);transition:height .4s cubic-bezier(.42,0,0,1),opacity .4s cubic-bezier(.42,0,0,1),margin .4s cubic-bezier(.42,0,0,1),padding .4s cubic-bezier(.42,0,0,1)}.dnb-form-status--hidden{height:0;opacity:0;width:0;will-change:height,opacity,margin,padding}.dnb-form-status--is-animating{overflow:hidden;width:auto}.dnb-form-status--disappear,.dnb-form-status--hidden{margin:0!important;padding:0!important}.dnb-form-status__shell{-webkit-box-pack:start;-ms-flex-pack:start;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;border-radius:.25rem;border-radius:var(--form-status-radius);display:-webkit-box;display:-ms-flexbox;display:flex;justify-content:flex-start;min-width:inherit}.dnb-form-status__text{color:inherit;cursor:text;font-size:1rem;font-size:var(--font-size-small);line-height:1.25rem;line-height:var(--line-height-small);padding:.625rem 1rem;white-space:normal}button .dnb-form-status__text{cursor:inherit}.dnb-form-status__text .dnb-anchor{font-size:inherit}.dnb-icon+.dnb-form-status__text{padding-left:.5rem}.dnb-form-status__shell>.dnb-icon{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;justify-content:center;margin:.3333333em .3333333em .3333333em .6666666em}.dnb-form-status__size--large .dnb-form-status__text{padding-bottom:1.125rem;padding-top:1.125rem}.dnb-form-status__size--large .dnb-form-status__shell>.dnb-icon{margin-bottom:.6666666em;margin-top:.6666666em}.dnb-form-status--stretch{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.dnb-form-status--stretch .dnb-form-status__shell{width:100%}.dnb-form-status--stretch .dnb-form-status__text{max-width:47rem}.dnb-form-status[hidden]{display:none}.dnb-form-status--no-animation,html[data-visual-test] .dnb-form-status{-webkit-transition-duration:1ms!important;transition-duration:1ms!important}@media screen and (-ms-high-contrast:none){.dnb-form-status__shell>.dnb-icon{border-width:1px}}.dnb-button{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:rgba(0,0,0,0);-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;color:#333;color:var(--color-black-80,#333);font-family:DNB,sans-serif;font-family:var(--font-family-default);font-style:normal;font-weight:400;font-weight:var(--font-weight-basis);line-height:1.5rem;line-height:var(--line-height-basis);margin:0;-moz-tab-size:4;-o-tab-size:4;tab-size:4;word-break:break-word}.dnb-button *,.dnb-button :after,.dnb-button :before{background-repeat:no-repeat;-webkit-box-sizing:border-box;box-sizing:border-box}.dnb-button :after,.dnb-button :before{text-decoration:inherit;vertical-align:inherit}:root{--button-font-size:var(--font-size-basis);--button-font-size-small:var(--font-size-small);--button-width:2.5rem;--button-height:2.5rem;--button-width--small:1.5rem;--button-height--small:1.5rem;--button-width--medium:2rem;--button-height--medium:2rem;--button-width--large:3rem;--button-height--large:3rem;--button-icon-size:1rem;--button-border-width:0.0625rem;--button-border-width--hover:0.1875rem;--button-border-radius:calc(var(--button-height)/2);--button-border-radius--small:calc(var(--button-height--small)/2);--button-border-radius--medium:calc(var(--button-height--medium)/2);--button-border-radius--large:calc(var(--button-height--large)/2)}.dnb-button{-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;border:.0625rem solid transparent;border:var(--button-border-width) solid transparent;border-radius:1.25rem;border-radius:var(--button-border-radius);cursor:pointer;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;font-size:1rem;font-size:var(--font-size-small);height:auto;justify-content:center;padding:0;position:relative;text-decoration:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-select:none;white-space:nowrap;width:2.5rem;width:var(--button-width)}.dnb-button--wrap{word-wrap:break-word;white-space:normal}.dnb-button,.dnb-core-style .dnb-button{line-height:2.5rem;line-height:var(--button-height)}.dnb-button__text{color:inherit;font-size:1.125rem;font-size:var(--button-font-size);line-height:1.5rem;line-height:var(--line-height-basis);margin:.5rem 0;-webkit-transform:translateY(-.03125rem);transform:translateY(-.03125rem)}.dnb-button__text [data-os=linux]{-webkit-transform:translateY(-.035rem);transform:translateY(-.035rem)}.dnb-button__alignment{display:inline-block;width:0}.dnb-button__bounding{background-color:transparent;border-radius:1.25rem;border-radius:var(--button-border-radius);bottom:0;left:0;position:absolute;right:0;top:0;-webkit-transform:scale(1.1,1.4);transform:scale(1.1,1.4)}.dnb-button--has-text{padding-left:1.5rem;padding-right:1.5rem}.dnb-button--size-small{border-radius:.75rem;border-radius:var(--button-border-radius--small);font-size:1rem;font-size:var(--button-font-size-small);width:1.5rem;width:var(--button-width--small)}.dnb-button--size-small,.dnb-core-style .dnb-button--size-small{line-height:1.5rem;line-height:var(--button-height--small)}.dnb-button--size-small .dnb-button__text{margin:0}.dnb-button--has-text.dnb-button--size-small{padding-left:1rem;padding-right:1rem}.dnb-button--has-text.dnb-button--icon-position-left.dnb-button--size-small{padding-left:.5rem}.dnb-button--has-text.dnb-button--icon-position-right.dnb-button--size-small{padding-right:.5rem}.dnb-button--size-medium{border-radius:1rem;border-radius:var(--button-border-radius--medium);width:2rem;width:var(--button-width--medium)}.dnb-button--size-medium,.dnb-core-style .dnb-button--size-medium{line-height:2rem;line-height:var(--button-height--medium)}.dnb-button--size-medium .dnb-button__text{margin:0}.dnb-button--has-text.dnb-button--size-medium{padding-left:1rem;padding-right:1rem}.dnb-button--has-text.dnb-button--icon-position-left.dnb-button--size-medium{padding-left:.5rem}.dnb-button--has-text.dnb-button--icon-position-right.dnb-button--size-medium{padding-right:.5rem}.dnb-button--size-large{border-radius:1.5rem;border-radius:var(--button-border-radius--large);width:3rem;width:var(--button-width--large)}.dnb-button--size-large,.dnb-core-style .dnb-button--size-large{line-height:3rem;line-height:var(--button-height--large)}.dnb-button--has-text.dnb-button--size-large{padding-left:2rem;padding-right:2rem}.dnb-button--has-text.dnb-button--icon-position-left.dnb-button--size-large{padding-left:1rem}.dnb-button--has-text.dnb-button--icon-position-right.dnb-button--size-large{padding-right:1rem}.dnb-button--has-text{width:auto}.dnb-button--has-text .dnb-button__icon{margin:0 .5rem;margin:0 calc(var(--button-icon-size)/2)}.dnb-button--has-text.dnb-button--icon-position-left{padding-left:.5rem}.dnb-button--has-text.dnb-button--icon-position-right{padding-right:.5rem}.dnb-button--has-text.dnb-button--has-icon .dnb-button__icon{-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2}.dnb-button--has-text.dnb-button--has-icon .dnb-button__text{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}.dnb-button:not(.dnb-button--has-text) .dnb-button__icon{width:inherit}.dnb-button__icon.dnb-icon svg:not([width]):not([height]){height:1rem;height:var(--button-icon-size);width:1rem;width:var(--button-icon-size)}[href]>.dnb-button__icon.dnb-icon{line-height:1.125rem;line-height:var(--button-font-size)}.dnb-button--has-text.dnb-button--has-icon.dnb-button--icon-position-left .dnb-button__icon,.dnb-button--has-text.dnb-button--has-icon.dnb-button--icon-position-top .dnb-button__icon{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}.dnb-button--has-text.dnb-button--has-icon.dnb-button--icon-position-left .dnb-button__text,.dnb-button--has-text.dnb-button--has-icon.dnb-button--icon-position-left>*,.dnb-button--has-text.dnb-button--has-icon.dnb-button--icon-position-top .dnb-button__text,.dnb-button--has-text.dnb-button--has-icon.dnb-button--icon-position-top>*{-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2}.dnb-button--stretch{width:100%}.dnb-button--reset{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:none;border-radius:0;-webkit-box-shadow:none;box-shadow:none;color:inherit;font:inherit;height:auto;line-height:inherit;margin:0;overflow:visible;padding:0;text-align:inherit;width:auto}html:not([data-whatintent=touch]) .dnb-button--reset:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-button--reset:hover:not([disabled]){border:none;-webkit-box-shadow:none;box-shadow:none}.dnb-button--reset:not([disabled]):active,.dnb-button--reset:not([disabled]):focus{outline:none}html[data-whatinput=keyboard] .dnb-button--reset:not([disabled]):active,html[data-whatinput=keyboard] .dnb-button--reset:not([disabled]):focus{--border-color:var(--color-emerald-green);border-color:transparent;-webkit-box-shadow:0 0 0 .125rem var(--border-color);box-shadow:0 0 0 .125rem var(--border-color)}@media screen and (-ms-high-contrast:none){html[data-whatinput=keyboard] .dnb-button--reset:not([disabled]):active,html[data-whatinput=keyboard] .dnb-button--reset:not([disabled]):focus{-webkit-box-shadow:0 0 0 .125rem #14555a;box-shadow:0 0 0 .125rem #14555a;-webkit-box-shadow:0 0 0 .125rem var(--color-emerald-green);box-shadow:0 0 0 .125rem var(--color-emerald-green)}}html[data-whatinput=mouse] .dnb-button--reset:not([disabled]):active,html[data-whatinput=mouse] .dnb-button--reset:not([disabled]):focus{border:none;-webkit-box-shadow:none;box-shadow:none;color:inherit}.dnb-button[type=button],.dnb-button[type=reset],.dnb-button[type=submit]{appearance:none;-moz-appearance:none;-webkit-appearance:none}.dnb-button[disabled]{cursor:not-allowed}.dnb-form-row--vertical .dnb-form-row__content>.dnb-button{-ms-flex-item-align:start;align-self:flex-start}.dnb-form-row--horizontal .dnb-form-row__content .dnb-button__text{white-space:nowrap}.dnb-button+.dnb-form-status{margin-top:.5rem}@media screen and (-ms-high-contrast:none){.dnb-button{-webkit-box-flex:0;-ms-flex:none;flex:none}.dnb-button__icon,.dnb-button__text{-webkit-transform:translateY(-.0625rem);transform:translateY(-.0625rem)}}button.dnb-button::-moz-focus-inner{border:none}.dnb-tag{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:rgba(0,0,0,0);-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;color:#333;color:var(--color-black-80,#333);font-family:DNB,sans-serif;font-family:var(--font-family-default);font-size:1rem;font-size:var(--font-size-small);font-style:normal;font-weight:400;font-weight:var(--font-weight-basis);line-height:1.5rem;line-height:var(--line-height-basis);margin:0;padding:0;-moz-tab-size:4;-o-tab-size:4;tab-size:4;word-break:break-word}.dnb-tag *,.dnb-tag :after,.dnb-tag :before{background-repeat:no-repeat;-webkit-box-sizing:border-box;box-sizing:border-box}.dnb-tag :after,.dnb-tag :before{text-decoration:inherit;vertical-align:inherit}.dnb-tag.dnb-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#ebebeb;background-color:var(--color-black-8)}.dnb-tag.dnb-button.dnb-button--size-small{padding-left:.5rem;padding-right:.5rem}.dnb-tag.dnb-button.dnb-button--size-small.dnb-button--has-icon{padding-left:0}.dnb-tag.dnb-button .dnb-button__text{font-size:.875rem;font-size:var(--font-size-x-small);-webkit-transform:none;transform:none}.dnb-tag:not(.dnb-tag--interactive){cursor:unset;-webkit-user-select:unset;-moz-user-select:unset;-ms-user-select:unset;user-select:unset}.dnb-tag:not(.dnb-tag--interactive) .dnb-button__text{cursor:text}.dnb-tag--interactive.dnb-button{--border-color:var(--color-sea-green);border-color:transparent;-webkit-box-shadow:inset 0 0 0 .0625rem var(--border-color);box-shadow:inset 0 0 0 .0625rem var(--border-color);color:#007272;color:var(--color-sea-green)}@supports (-webkit-touch-callout:none){.dnb-tag--interactive.dnb-button{-webkit-box-shadow:0 0 0 .0625rem var(--border-color);box-shadow:0 0 0 .0625rem var(--border-color)}}@media not all and (min-resolution:0.001dpcm){@supports (-webkit-appearance:none) and (stroke-color:transparent) and (not (-webkit-overflow-scrolling:touch)){.dnb-tag--interactive.dnb-button{-webkit-box-shadow:0 0 0 .0625rem var(--border-color);box-shadow:0 0 0 .0625rem var(--border-color)}}}@media screen and (-ms-high-contrast:none){.dnb-tag--interactive.dnb-button{-webkit-box-shadow:inset 0 0 0 1px #007272;box-shadow:inset 0 0 0 1px #007272;-webkit-box-shadow:inset 0 0 0 1px var(--color-sea-green);box-shadow:inset 0 0 0 1px var(--color-sea-green)}}html:not([data-whatintent=touch]) .dnb-tag--interactive.dnb-button:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-tag--interactive.dnb-button:hover:not([disabled]){--border-color:var(--color-emerald-green);background-color:#ebebeb;background-color:var(--color-black-8);border-color:transparent;-webkit-box-shadow:0 0 0 .125rem var(--border-color);box-shadow:0 0 0 .125rem var(--border-color);color:#007272;color:var(--color-sea-green)}@media screen and (-ms-high-contrast:none){html:not([data-whatintent=touch]) .dnb-tag--interactive.dnb-button:hover:not([disabled]){-webkit-box-shadow:0 0 0 .125rem #14555a;box-shadow:0 0 0 .125rem #14555a;-webkit-box-shadow:0 0 0 .125rem var(--color-emerald-green);box-shadow:0 0 0 .125rem var(--color-emerald-green);opacity:1}}.dnb-tag--interactive.dnb-button:focus[disabled],html:not([data-whatintent=touch]) .dnb-tag--interactive.dnb-button:focus[disabled]{cursor:not-allowed}.dnb-tag--interactive.dnb-button:focus:not([disabled]),html:not([data-whatintent=touch]) .dnb-tag--interactive.dnb-button:focus:not([disabled]){outline:none}html[data-whatinput=keyboard] .dnb-tag--interactive.dnb-button:focus:not([disabled]),html[data-whatinput=keyboard] html:not([data-whatintent=touch]) .dnb-tag--interactive.dnb-button:focus:not([disabled]){--border-color:var(--color-emerald-green);background-color:#ebebeb;background-color:var(--color-black-8);border-color:transparent;-webkit-box-shadow:inset 0 0 0 .125rem var(--border-color);box-shadow:inset 0 0 0 .125rem var(--border-color);color:#007272;color:var(--color-sea-green)}@supports (-webkit-touch-callout:none){html[data-whatinput=keyboard] .dnb-tag--interactive.dnb-button:focus:not([disabled]),html[data-whatinput=keyboard] html:not([data-whatintent=touch]) .dnb-tag--interactive.dnb-button:focus:not([disabled]){-webkit-box-shadow:0 0 0 .125rem var(--border-color);box-shadow:0 0 0 .125rem var(--border-color)}}@media not all and (min-resolution:0.001dpcm){@supports (-webkit-appearance:none) and (stroke-color:transparent) and (not (-webkit-overflow-scrolling:touch)){html[data-whatinput=keyboard] .dnb-tag--interactive.dnb-button:focus:not([disabled]),html[data-whatinput=keyboard] html:not([data-whatintent=touch]) .dnb-tag--interactive.dnb-button:focus:not([disabled]){-webkit-box-shadow:0 0 0 .125rem var(--border-color);box-shadow:0 0 0 .125rem var(--border-color)}}}@media screen and (-ms-high-contrast:none){html[data-whatinput=keyboard] .dnb-tag--interactive.dnb-button:focus:not([disabled]),html[data-whatinput=keyboard] html:not([data-whatintent=touch]) .dnb-tag--interactive.dnb-button:focus:not([disabled]){-webkit-box-shadow:inset 0 0 0 .125rem #14555a;box-shadow:inset 0 0 0 .125rem #14555a;-webkit-box-shadow:inset 0 0 0 .125rem var(--color-emerald-green);box-shadow:inset 0 0 0 .125rem var(--color-emerald-green)}}.dnb-tag--interactive.dnb-button:active[disabled],html:not([data-whatintent=touch]) .dnb-tag--interactive.dnb-button:active[disabled]{cursor:not-allowed}.dnb-tag--interactive.dnb-button:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-tag--interactive.dnb-button:active:not([disabled]){--border-color:transparent;background-color:#d2f0e9;background-color:var(--color-mint-green-50);border-color:transparent;-webkit-box-shadow:0 0 0 .0625rem var(--border-color);box-shadow:0 0 0 .0625rem var(--border-color);color:#007272;color:var(--color-sea-green)}@media screen and (-ms-high-contrast:none){.dnb-tag--interactive.dnb-button:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-tag--interactive.dnb-button:active:not([disabled]){-webkit-box-shadow:0 0 0 .0625rem transparent;box-shadow:0 0 0 .0625rem transparent}}.dnb-tag--interactive.dnb-button[disabled]{--border-color:var(--color-sea-green-30);background-color:#fff;background-color:var(--color-white);border-color:transparent;-webkit-box-shadow:0 0 0 .0625rem var(--border-color);box-shadow:0 0 0 .0625rem var(--border-color);color:#b3dada;color:var(--color-sea-green-30)}@media screen and (-ms-high-contrast:none){.dnb-tag--interactive.dnb-button[disabled]{-webkit-box-shadow:0 0 0 .0625rem #b3dada;box-shadow:0 0 0 .0625rem #b3dada;-webkit-box-shadow:0 0 0 .0625rem var(--color-sea-green-30);box-shadow:0 0 0 .0625rem var(--color-sea-green-30)}}.dnb-tag--removable.dnb-button{background-color:#007272;background-color:var(--color-sea-green);color:#fff;color:var(--color-white)}.dnb-tag--removable.dnb-button svg .dnb-icon-close-circle-path{fill:#fff;fill:var(--color-white)}.dnb-tag--removable.dnb-button svg .dnb-icon-close-cross-path{stroke:#007272;stroke:var(--color-sea-green)}.dnb-tag--removable.dnb-button:focus[disabled],html:not([data-whatintent=touch]) .dnb-tag--removable.dnb-button:focus[disabled]{cursor:not-allowed}.dnb-tag--removable.dnb-button:focus:not([disabled]),html:not([data-whatintent=touch]) .dnb-tag--removable.dnb-button:focus:not([disabled]){outline:none}html[data-whatinput=keyboard] .dnb-tag--removable.dnb-button:focus:not([disabled]),html[data-whatinput=keyboard] html:not([data-whatintent=touch]) .dnb-tag--removable.dnb-button:focus:not([disabled]){--border-color:var(--color-emerald-green);background-color:#fff;background-color:var(--color-white);border-color:transparent;-webkit-box-shadow:inset 0 0 0 .125rem var(--border-color);box-shadow:inset 0 0 0 .125rem var(--border-color);color:#007272;color:var(--color-sea-green)}@supports (-webkit-touch-callout:none){html[data-whatinput=keyboard] .dnb-tag--removable.dnb-button:focus:not([disabled]),html[data-whatinput=keyboard] html:not([data-whatintent=touch]) .dnb-tag--removable.dnb-button:focus:not([disabled]){-webkit-box-shadow:0 0 0 .125rem var(--border-color);box-shadow:0 0 0 .125rem var(--border-color)}}@media not all and (min-resolution:0.001dpcm){@supports (-webkit-appearance:none) and (stroke-color:transparent) and (not (-webkit-overflow-scrolling:touch)){html[data-whatinput=keyboard] .dnb-tag--removable.dnb-button:focus:not([disabled]),html[data-whatinput=keyboard] html:not([data-whatintent=touch]) .dnb-tag--removable.dnb-button:focus:not([disabled]){-webkit-box-shadow:0 0 0 .125rem var(--border-color);box-shadow:0 0 0 .125rem var(--border-color)}}}@media screen and (-ms-high-contrast:none){html[data-whatinput=keyboard] .dnb-tag--removable.dnb-button:focus:not([disabled]),html[data-whatinput=keyboard] html:not([data-whatintent=touch]) .dnb-tag--removable.dnb-button:focus:not([disabled]){-webkit-box-shadow:inset 0 0 0 .125rem #14555a;box-shadow:inset 0 0 0 .125rem #14555a;-webkit-box-shadow:inset 0 0 0 .125rem var(--color-emerald-green);box-shadow:inset 0 0 0 .125rem var(--color-emerald-green)}}.dnb-tag--removable.dnb-button:focus:not([disabled]) svg .dnb-icon-close-circle-path,html:not([data-whatintent=touch]) .dnb-tag--removable.dnb-button:focus:not([disabled]) svg .dnb-icon-close-circle-path{fill:#007272;fill:var(--color-sea-green)}.dnb-tag--removable.dnb-button:focus:not([disabled]) svg .dnb-icon-close-cross-path,html:not([data-whatintent=touch]) .dnb-tag--removable.dnb-button:focus:not([disabled]) svg .dnb-icon-close-cross-path{stroke:#fff;stroke:var(--color-white)}html:not([data-whatintent=touch]) .dnb-tag--removable.dnb-button:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-tag--removable.dnb-button:hover:not([disabled]){--border-color:var(--color-emerald-green);background-color:#fff;background-color:var(--color-white);border-color:transparent;-webkit-box-shadow:0 0 0 .125rem var(--border-color);box-shadow:0 0 0 .125rem var(--border-color);color:#007272;color:var(--color-sea-green)}@media screen and (-ms-high-contrast:none){html:not([data-whatintent=touch]) .dnb-tag--removable.dnb-button:hover:not([disabled]){-webkit-box-shadow:0 0 0 .125rem #14555a;box-shadow:0 0 0 .125rem #14555a;-webkit-box-shadow:0 0 0 .125rem var(--color-emerald-green);box-shadow:0 0 0 .125rem var(--color-emerald-green);opacity:1}}html:not([data-whatintent=touch]) .dnb-tag--removable.dnb-button:hover:not([disabled]) svg .dnb-icon-close-circle-path{fill:#007272;fill:var(--color-sea-green)}html:not([data-whatintent=touch]) .dnb-tag--removable.dnb-button:hover:not([disabled]) svg .dnb-icon-close-cross-path{stroke:#fff;stroke:var(--color-white)}.dnb-tag--removable.dnb-button:active[disabled],html:not([data-whatintent=touch]) .dnb-tag--removable.dnb-button:active[disabled]{cursor:not-allowed}.dnb-tag--removable.dnb-button:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-tag--removable.dnb-button:active:not([disabled]){--border-color:transparent;background-color:#d2f0e9;background-color:var(--color-mint-green-50);border-color:transparent;-webkit-box-shadow:0 0 0 .0625rem var(--border-color);box-shadow:0 0 0 .0625rem var(--border-color);color:#007272;color:var(--color-sea-green)}@media screen and (-ms-high-contrast:none){.dnb-tag--removable.dnb-button:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-tag--removable.dnb-button:active:not([disabled]){-webkit-box-shadow:0 0 0 .0625rem transparent;box-shadow:0 0 0 .0625rem transparent}}.dnb-tag--removable.dnb-button:active:not([disabled]) svg .dnb-icon-close-circle-path,html:not([data-whatintent=touch]) .dnb-tag--removable.dnb-button:active:not([disabled]) svg .dnb-icon-close-circle-path{fill:#007272;fill:var(--color-sea-green)}.dnb-tag--removable.dnb-button:active:not([disabled]) svg .dnb-icon-close-cross-path,html:not([data-whatintent=touch]) .dnb-tag--removable.dnb-button:active:not([disabled]) svg .dnb-icon-close-cross-path{stroke:#fff;stroke:var(--color-white)}.dnb-tag--removable.dnb-button[disabled] svg .dnb-icon-close-circle-path{fill:#d2f0e9;fill:var(--color-mint-green-50)}.dnb-tag--removable.dnb-button[disabled] svg .dnb-icon-close-cross-path{stroke:#b3dada;stroke:var(--color-sea-green-30)}.dnb-tag--removable.dnb-button .dnb-button__text{padding-left:.5rem}.dnb-tag--removable.dnb-button--size-small.dnb-button--has-icon{padding-right:0}
@@ -5,6 +5,9 @@
5
5
 
6
6
  @import '../../../style/components/imports.scss';
7
7
 
8
+ // import dependencies
9
+ @import '../../button/style/dnb-button.scss';
10
+
8
11
  .dnb-tag {
9
12
  @include componentReset();
10
13
  }
@@ -0,0 +1,18 @@
1
+ /*
2
+ * Tag mixins
3
+ *
4
+ */
5
+
6
+ @mixin deleteIcon(
7
+ $fillColor: var(--color-sea-green),
8
+ $strokeColor: var(--color-white)
9
+ ) {
10
+ svg {
11
+ .dnb-icon-close-circle-path {
12
+ fill: $fillColor;
13
+ }
14
+ .dnb-icon-close-cross-path {
15
+ stroke: $strokeColor;
16
+ }
17
+ }
18
+ }
@@ -0,0 +1,129 @@
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
+ require("core-js/modules/es.object.keys.js");
6
+
7
+ require("core-js/modules/es.array.index-of.js");
8
+
9
+ require("core-js/modules/es.symbol.js");
10
+
11
+ require("core-js/modules/es.array.filter.js");
12
+
13
+ require("core-js/modules/es.object.to-string.js");
14
+
15
+ require("core-js/modules/es.object.get-own-property-descriptor.js");
16
+
17
+ require("core-js/modules/web.dom-collections.for-each.js");
18
+
19
+ require("core-js/modules/es.object.get-own-property-descriptors.js");
20
+
21
+ require("core-js/modules/es.object.assign.js");
22
+
23
+ require("core-js/modules/es.array.iterator.js");
24
+
25
+ require("core-js/modules/es.string.iterator.js");
26
+
27
+ require("core-js/modules/es.weak-map.js");
28
+
29
+ require("core-js/modules/web.dom-collections.iterator.js");
30
+
31
+ require("core-js/modules/es.symbol.description.js");
32
+
33
+ require("core-js/modules/es.symbol.iterator.js");
34
+
35
+ Object.defineProperty(exports, "__esModule", {
36
+ value: true
37
+ });
38
+ var _exportNames = {
39
+ defaultProps: true,
40
+ TimelineItem: true
41
+ };
42
+ Object.defineProperty(exports, "TimelineItem", {
43
+ enumerable: true,
44
+ get: function get() {
45
+ return _TimelineItem.default;
46
+ }
47
+ });
48
+ exports.defaultProps = exports.default = void 0;
49
+
50
+ require("core-js/modules/es.array.map.js");
51
+
52
+ require("core-js/modules/es.function.name.js");
53
+
54
+ var _react = _interopRequireDefault(require("react"));
55
+
56
+ var _classnames = _interopRequireDefault(require("classnames"));
57
+
58
+ var _SpacingHelper = require("../space/SpacingHelper");
59
+
60
+ var _Context = _interopRequireDefault(require("../../shared/Context"));
61
+
62
+ var _componentHelper = require("../../shared/component-helper");
63
+
64
+ var _TimelineItem = _interopRequireWildcard(require("./TimelineItem"));
65
+
66
+ Object.keys(_TimelineItem).forEach(function (key) {
67
+ if (key === "default" || key === "__esModule") return;
68
+ if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
69
+ if (key in exports && exports[key] === _TimelineItem[key]) return;
70
+ Object.defineProperty(exports, key, {
71
+ enumerable: true,
72
+ get: function get() {
73
+ return _TimelineItem[key];
74
+ }
75
+ });
76
+ });
77
+ var _excluded = ["className", "skeleton", "data", "children"];
78
+
79
+ 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); }
80
+
81
+ 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; }
82
+
83
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
84
+
85
+ function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
86
+
87
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
88
+
89
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
90
+
91
+ function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
92
+
93
+ function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
94
+
95
+ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
96
+
97
+ var defaultProps = {
98
+ className: null,
99
+ skeleton: false,
100
+ data: null,
101
+ children: null
102
+ };
103
+ exports.defaultProps = defaultProps;
104
+
105
+ function Timeline(localProps) {
106
+ var context = _react.default.useContext(_Context.default);
107
+
108
+ var _extendPropsWithConte = (0, _componentHelper.extendPropsWithContext)(_objectSpread(_objectSpread({}, defaultProps), localProps), defaultProps, context === null || context === void 0 ? void 0 : context.Timeline),
109
+ className = _extendPropsWithConte.className,
110
+ skeleton = _extendPropsWithConte.skeleton,
111
+ data = _extendPropsWithConte.data,
112
+ childrenItems = _extendPropsWithConte.children,
113
+ props = _objectWithoutProperties(_extendPropsWithConte, _excluded);
114
+
115
+ var spacingClasses = (0, _SpacingHelper.createSpacingClasses)(props);
116
+ return _react.default.createElement("div", _extends({
117
+ className: (0, _classnames.default)('dnb-timeline', spacingClasses, className),
118
+ "data-testid": "timeline"
119
+ }, props), data === null || data === void 0 ? void 0 : data.map(function (timelineItem) {
120
+ return _react.default.createElement(_TimelineItem.default, _extends({
121
+ key: timelineItem.name,
122
+ skeleton: skeleton
123
+ }, timelineItem));
124
+ }), childrenItems);
125
+ }
126
+
127
+ Timeline.Item = _TimelineItem.default;
128
+ var _default = Timeline;
129
+ exports.default = _default;
@@ -0,0 +1,149 @@
1
+ "use strict";
2
+
3
+ require("core-js/modules/es.object.keys.js");
4
+
5
+ require("core-js/modules/es.array.index-of.js");
6
+
7
+ require("core-js/modules/es.symbol.js");
8
+
9
+ require("core-js/modules/es.array.filter.js");
10
+
11
+ require("core-js/modules/es.object.to-string.js");
12
+
13
+ require("core-js/modules/es.object.get-own-property-descriptor.js");
14
+
15
+ require("core-js/modules/web.dom-collections.for-each.js");
16
+
17
+ require("core-js/modules/es.object.get-own-property-descriptors.js");
18
+
19
+ require("core-js/modules/es.object.assign.js");
20
+
21
+ Object.defineProperty(exports, "__esModule", {
22
+ value: true
23
+ });
24
+ exports.default = TimelineItem;
25
+
26
+ require("core-js/modules/es.function.name.js");
27
+
28
+ var _react = _interopRequireDefault(require("react"));
29
+
30
+ var _classnames = _interopRequireDefault(require("classnames"));
31
+
32
+ var _FormStatus2 = _interopRequireDefault(require("../form-status/FormStatus"));
33
+
34
+ var _IconPrimary = _interopRequireDefault(require("../icon-primary/IconPrimary"));
35
+
36
+ var _SkeletonHelper = require("../skeleton/SkeletonHelper");
37
+
38
+ var _check = _interopRequireDefault(require("../../icons/check"));
39
+
40
+ var _calendar = _interopRequireDefault(require("../../icons/calendar"));
41
+
42
+ var _pin = _interopRequireDefault(require("../../icons/pin"));
43
+
44
+ var _Context = _interopRequireDefault(require("../../shared/Context"));
45
+
46
+ var _componentHelper = require("../../shared/component-helper");
47
+
48
+ var _span;
49
+
50
+ var _excluded = ["icon", "iconAlt", "name", "date", "infoMessage", "state", "skeleton"];
51
+
52
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
53
+
54
+ function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
55
+
56
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
57
+
58
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
59
+
60
+ function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
61
+
62
+ function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
63
+
64
+ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
65
+
66
+ var defaultProps = {
67
+ icon: null,
68
+ iconAlt: null,
69
+ name: null,
70
+ date: null,
71
+ infoMessage: null,
72
+ state: null,
73
+ skeleton: false
74
+ };
75
+
76
+ function TimelineItem(localProps) {
77
+ var _span2, _span3, _span4, _FormStatus;
78
+
79
+ var context = _react.default.useContext(_Context.default);
80
+
81
+ var _context$translation$ = context.translation.TimelineItem,
82
+ alt_label_completed = _context$translation$.alt_label_completed,
83
+ alt_label_current = _context$translation$.alt_label_current,
84
+ alt_label_upcoming = _context$translation$.alt_label_upcoming;
85
+
86
+ var _extendPropsWithConte = (0, _componentHelper.extendPropsWithContext)(_objectSpread(_objectSpread({}, defaultProps), localProps), defaultProps, context === null || context === void 0 ? void 0 : context.TimelineItem),
87
+ icon = _extendPropsWithConte.icon,
88
+ iconAlt = _extendPropsWithConte.iconAlt,
89
+ name = _extendPropsWithConte.name,
90
+ date = _extendPropsWithConte.date,
91
+ infoMessage = _extendPropsWithConte.infoMessage,
92
+ state = _extendPropsWithConte.state,
93
+ skeleton = _extendPropsWithConte.skeleton,
94
+ props = _objectWithoutProperties(_extendPropsWithConte, _excluded);
95
+
96
+ var stateIsCompleted = state === 'completed';
97
+ var stateIsCurrent = state === 'current';
98
+ var stateIsUpcoming = state === 'upcoming';
99
+ var skeletonClasses = (0, _SkeletonHelper.createSkeletonClass)('font', skeleton, context);
100
+ var classes = (0, _classnames.default)("dnb-timeline__item dnb-timeline__item--".concat(state), skeletonClasses);
101
+
102
+ var TimelineItemIcon = function TimelineItemIcon() {
103
+ var currentIcon = icon || stateIsCompleted && _check.default || stateIsCurrent && _pin.default || stateIsUpcoming && _calendar.default;
104
+ var currentAltLabel = iconAlt || stateIsCompleted && alt_label_completed || stateIsCurrent && alt_label_current || stateIsUpcoming && alt_label_upcoming;
105
+ return _react.default.createElement("span", {
106
+ className: "dnb-timeline__item__label__icon",
107
+ "data-testid": "timeline-item-label-icon"
108
+ }, _span || (_span = _react.default.createElement("span", {
109
+ key: "icon-alignment"
110
+ }, "\u200C")), !skeleton && currentIcon && _react.default.createElement(_IconPrimary.default, {
111
+ icon: currentIcon,
112
+ alt: currentAltLabel,
113
+ size: stateIsCurrent ? undefined : 'small'
114
+ }));
115
+ };
116
+
117
+ var TimelineItemName = function TimelineItemName() {
118
+ return _span2 || (_span2 = _react.default.createElement("span", {
119
+ className: "dnb-timeline__item__label__name",
120
+ "data-testid": "timeline-item-label-name"
121
+ }, name));
122
+ };
123
+
124
+ var TimelineItemLabel = function TimelineItemLabel() {
125
+ return _span3 || (_span3 = _react.default.createElement("span", {
126
+ className: "dnb-timeline__item__label"
127
+ }, _react.default.createElement(TimelineItemIcon, null), _react.default.createElement(TimelineItemName, null)));
128
+ };
129
+
130
+ var TimelineItemContent = function TimelineItemContent() {
131
+ return _react.default.createElement("div", {
132
+ className: "dnb-timeline__item__content"
133
+ }, date && (_span4 || (_span4 = _react.default.createElement("span", {
134
+ className: "dnb-timeline__item__content__date",
135
+ "data-testid": "timeline-item-content-date"
136
+ }, date))), infoMessage && (_FormStatus || (_FormStatus = _react.default.createElement(_FormStatus2.default, {
137
+ text: infoMessage,
138
+ state: "info",
139
+ className: "dnb-timeline__item__content__info",
140
+ "data-testid": "timeline-item-content-info"
141
+ }))));
142
+ };
143
+
144
+ return _react.default.createElement("div", _extends({
145
+ className: classes,
146
+ "data-testid": "timeline-item",
147
+ "aria-current": stateIsCurrent ? 'step' : undefined
148
+ }, props), _react.default.createElement(TimelineItemLabel, null), _react.default.createElement(TimelineItemContent, null));
149
+ }
@@ -0,0 +1,8 @@
1
+ /**
2
+ * Component Entry
3
+ *
4
+ */
5
+
6
+ import Timeline from './Timeline'
7
+ export default Timeline
8
+ export * from './Timeline'
@@ -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
+ require("core-js/modules/es.array.iterator.js");
6
+
7
+ require("core-js/modules/es.object.to-string.js");
8
+
9
+ require("core-js/modules/es.string.iterator.js");
10
+
11
+ require("core-js/modules/es.weak-map.js");
12
+
13
+ require("core-js/modules/web.dom-collections.iterator.js");
14
+
15
+ require("core-js/modules/es.object.get-own-property-descriptor.js");
16
+
17
+ require("core-js/modules/web.dom-collections.for-each.js");
18
+
19
+ require("core-js/modules/es.object.keys.js");
20
+
21
+ require("core-js/modules/es.symbol.js");
22
+
23
+ require("core-js/modules/es.symbol.description.js");
24
+
25
+ require("core-js/modules/es.symbol.iterator.js");
26
+
27
+ Object.defineProperty(exports, "__esModule", {
28
+ value: true
29
+ });
30
+ var _exportNames = {};
31
+ exports.default = void 0;
32
+
33
+ var _Timeline = _interopRequireWildcard(require("./Timeline"));
34
+
35
+ Object.keys(_Timeline).forEach(function (key) {
36
+ if (key === "default" || key === "__esModule") return;
37
+ if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
38
+ if (key in exports && exports[key] === _Timeline[key]) return;
39
+ Object.defineProperty(exports, key, {
40
+ enumerable: true,
41
+ get: function get() {
42
+ return _Timeline[key];
43
+ }
44
+ });
45
+ });
46
+
47
+ 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); }
48
+
49
+ 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; }
50
+
51
+ var _default = _Timeline.default;
52
+ exports.default = _default;
@@ -0,0 +1,42 @@
1
+ /*
2
+ * Timeline component
3
+ *
4
+ */
5
+
6
+ @import './themes/dnb-timeline-theme-ui.scss';
7
+
8
+ .dnb-timeline {
9
+ display: flex;
10
+ flex-direction: column;
11
+ &__item {
12
+ &__label {
13
+ display: flex;
14
+ align-items: center;
15
+ text-align: left;
16
+ padding: 0;
17
+ &__icon {
18
+ display: flex;
19
+ flex-shrink: 0;
20
+ align-items: center;
21
+ height: auto;
22
+ justify-content: center;
23
+ padding: 0;
24
+ }
25
+ &__name {
26
+ cursor: text;
27
+ }
28
+ }
29
+ &__content {
30
+ padding-bottom: var(--spacing-small);
31
+ &__date {
32
+ cursor: text;
33
+ font-size: var(--font-size-x-small);
34
+ font-weight: var(--font-weight-basis);
35
+ color: var(--color-black-55);
36
+ }
37
+ &__info {
38
+ padding-top: var(--spacing-x-small);
39
+ }
40
+ }
41
+ }
42
+ }