@dnb/eufemia 10.7.0 → 10.8.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 (924) hide show
  1. package/CHANGELOG.md +36 -0
  2. package/cjs/components/accordion/Accordion.d.ts +1 -1
  3. package/cjs/components/accordion/AccordionHeader.d.ts +4 -4
  4. package/cjs/components/accordion/AccordionHeader.js +18 -5
  5. package/cjs/components/accordion/AccordionHeader.js.map +1 -1
  6. package/cjs/components/accordion/style/dnb-accordion.css +22 -17
  7. package/cjs/components/accordion/style/dnb-accordion.min.css +1 -1
  8. package/cjs/components/accordion/style/dnb-accordion.scss +40 -18
  9. package/cjs/components/accordion/style/themes/dnb-accordion-theme-sbanken.css +124 -0
  10. package/cjs/components/accordion/style/themes/dnb-accordion-theme-sbanken.min.css +1 -0
  11. package/cjs/components/accordion/style/themes/dnb-accordion-theme-sbanken.scss +125 -0
  12. package/cjs/components/anchor/Anchor.js +1 -1
  13. package/cjs/components/anchor/Anchor.js.map +1 -1
  14. package/cjs/components/anchor/style/anchor-mixins.scss +9 -3
  15. package/cjs/components/anchor/style/themes/dnb-anchor-theme-sbanken.scss +3 -1
  16. package/cjs/components/autocomplete/Autocomplete.js +4 -2
  17. package/cjs/components/autocomplete/Autocomplete.js.map +1 -1
  18. package/cjs/components/avatar/style/index.d.ts +1 -1
  19. package/cjs/components/avatar/style/themes/dnb-avatar-theme-sbanken.scss +2 -1
  20. package/cjs/components/breadcrumb/Breadcrumb.js +2 -2
  21. package/cjs/components/breadcrumb/Breadcrumb.js.map +1 -1
  22. package/cjs/components/breadcrumb/BreadcrumbItem.js +23 -1
  23. package/cjs/components/breadcrumb/BreadcrumbItem.js.map +1 -1
  24. package/cjs/components/breadcrumb/style/themes/dnb-breadcrumb-theme-sbanken.css +23 -0
  25. package/cjs/components/breadcrumb/style/themes/dnb-breadcrumb-theme-sbanken.min.css +1 -0
  26. package/cjs/components/breadcrumb/style/themes/dnb-breadcrumb-theme-sbanken.scss +33 -0
  27. package/cjs/components/button/style/themes/dnb-button-theme-ui.scss +3 -1
  28. package/cjs/components/checkbox/Checkbox.d.ts +4 -0
  29. package/cjs/components/checkbox/Checkbox.js +6 -4
  30. package/cjs/components/checkbox/Checkbox.js.map +1 -1
  31. package/cjs/components/checkbox/style/themes/dnb-checkbox-theme-ui.scss +3 -1
  32. package/cjs/components/date-picker/style/themes/dnb-date-picker-theme-ui.scss +6 -2
  33. package/cjs/components/drawer/Drawer.d.ts +1 -1
  34. package/cjs/components/drawer/Drawer.js +3 -1
  35. package/cjs/components/drawer/Drawer.js.map +1 -1
  36. package/cjs/components/form-status/FormStatus.d.ts +2 -0
  37. package/cjs/components/form-status/FormStatus.js +70 -53
  38. package/cjs/components/form-status/FormStatus.js.map +1 -1
  39. package/cjs/components/form-status/style/dnb-form-status.scss +4 -2
  40. package/cjs/components/form-status/style/themes/dnb-form-status-theme-sbanken.css +37 -0
  41. package/cjs/components/form-status/style/themes/dnb-form-status-theme-sbanken.min.css +1 -0
  42. package/cjs/components/form-status/style/themes/dnb-form-status-theme-sbanken.scss +35 -0
  43. package/cjs/components/global-status/GlobalStatus.d.ts +1 -1
  44. package/cjs/components/global-status/GlobalStatus.js +17 -7
  45. package/cjs/components/global-status/GlobalStatus.js.map +1 -1
  46. package/cjs/components/global-status/style/dnb-global-status.scss +2 -1
  47. package/cjs/components/global-status/style/themes/dnb-global-status-theme-sbanken.css +22 -0
  48. package/cjs/components/global-status/style/themes/dnb-global-status-theme-sbanken.min.css +1 -0
  49. package/cjs/components/global-status/style/themes/dnb-global-status-theme-sbanken.scss +28 -0
  50. package/cjs/components/global-status/style/themes/dnb-global-status-theme-ui.css +6 -3
  51. package/cjs/components/global-status/style/themes/dnb-global-status-theme-ui.min.css +1 -1
  52. package/cjs/components/global-status/style/themes/dnb-global-status-theme-ui.scss +13 -6
  53. package/cjs/components/heading/Heading.d.ts +8 -8
  54. package/cjs/components/heading/Heading.js +8 -16
  55. package/cjs/components/heading/Heading.js.map +1 -1
  56. package/cjs/components/heading/HeadingHelpers.d.ts +5 -1
  57. package/cjs/components/heading/HeadingHelpers.js +42 -1
  58. package/cjs/components/heading/HeadingHelpers.js.map +1 -1
  59. package/cjs/components/info-card/index.js.map +1 -1
  60. package/cjs/components/info-card/style.js.map +1 -1
  61. package/cjs/components/input/style/themes/dnb-input-theme-ui.css +1 -1
  62. package/cjs/components/input/style/themes/dnb-input-theme-ui.min.css +1 -1
  63. package/cjs/components/input/style/themes/dnb-input-theme-ui.scss +9 -3
  64. package/cjs/components/input-masked/InputMaskedUtils.js +1 -1
  65. package/cjs/components/input-masked/InputMaskedUtils.js.map +1 -1
  66. package/cjs/components/modal/Modal.js.map +1 -1
  67. package/cjs/components/modal/parts/ModalHeaderBar.js +0 -4
  68. package/cjs/components/modal/parts/ModalHeaderBar.js.map +1 -1
  69. package/cjs/components/pagination/Pagination.js.map +1 -1
  70. package/cjs/components/radio/Radio.d.ts +4 -0
  71. package/cjs/components/radio/Radio.js +6 -4
  72. package/cjs/components/radio/Radio.js.map +1 -1
  73. package/cjs/components/radio/style/themes/dnb-radio-theme-ui.scss +15 -5
  74. package/cjs/components/section/Section.d.ts +21 -1
  75. package/cjs/components/section/Section.js.map +1 -1
  76. package/cjs/components/section/style/dnb-section.css +1 -1
  77. package/cjs/components/section/style/dnb-section.scss +8 -3
  78. package/cjs/components/section/style/themes/dnb-section-theme-sbanken.scss +3 -4
  79. package/cjs/components/section/style/themes/dnb-section-theme-ui.css +9 -0
  80. package/cjs/components/section/style/themes/dnb-section-theme-ui.scss +28 -14
  81. package/cjs/components/skeleton/style/dnb-skeleton.scss +8 -5
  82. package/cjs/components/slider/style/dnb-slider.scss +4 -2
  83. package/cjs/components/space/SpacingUtils.js.map +1 -1
  84. package/cjs/components/step-indicator/StepIndicator.d.ts +89 -75
  85. package/cjs/components/step-indicator/StepIndicator.js +31 -26
  86. package/cjs/components/step-indicator/StepIndicator.js.map +1 -1
  87. package/cjs/components/step-indicator/StepIndicatorContext.d.ts +45 -15
  88. package/cjs/components/step-indicator/StepIndicatorContext.js +102 -121
  89. package/cjs/components/step-indicator/StepIndicatorContext.js.map +1 -1
  90. package/cjs/components/step-indicator/StepIndicatorItem.d.ts +59 -61
  91. package/cjs/components/step-indicator/StepIndicatorItem.js +183 -231
  92. package/cjs/components/step-indicator/StepIndicatorItem.js.map +1 -1
  93. package/cjs/components/step-indicator/StepIndicatorList.d.ts +6 -8
  94. package/cjs/components/step-indicator/StepIndicatorList.js +45 -50
  95. package/cjs/components/step-indicator/StepIndicatorList.js.map +1 -1
  96. package/cjs/components/step-indicator/StepIndicatorModal.d.ts +6 -14
  97. package/cjs/components/step-indicator/StepIndicatorModal.js +41 -53
  98. package/cjs/components/step-indicator/StepIndicatorModal.js.map +1 -1
  99. package/cjs/components/step-indicator/StepIndicatorProps.d.ts +2 -55
  100. package/cjs/components/step-indicator/StepIndicatorProps.js +4 -50
  101. package/cjs/components/step-indicator/StepIndicatorProps.js.map +1 -1
  102. package/cjs/components/step-indicator/StepIndicatorSidebar.d.ts +27 -21
  103. package/cjs/components/step-indicator/StepIndicatorSidebar.js +41 -51
  104. package/cjs/components/step-indicator/StepIndicatorSidebar.js.map +1 -1
  105. package/cjs/components/step-indicator/StepIndicatorTriggerButton.d.ts +16 -17
  106. package/cjs/components/step-indicator/StepIndicatorTriggerButton.js +65 -78
  107. package/cjs/components/step-indicator/StepIndicatorTriggerButton.js.map +1 -1
  108. package/cjs/components/switch/Switch.d.ts +4 -0
  109. package/cjs/components/switch/Switch.js +6 -4
  110. package/cjs/components/switch/Switch.js.map +1 -1
  111. package/cjs/components/switch/style/themes/dnb-switch-theme-ui.scss +3 -1
  112. package/cjs/components/table/TableContainer.js.map +1 -1
  113. package/cjs/components/table/style/table-accordion.scss +18 -6
  114. package/cjs/components/table/style/table-header-buttons.scss +3 -1
  115. package/cjs/components/table/style/table-tr.scss +6 -2
  116. package/cjs/components/table/style/themes/dnb-table-theme-ui.scss +3 -1
  117. package/cjs/components/timeline/TimelineItem.d.ts +3 -2
  118. package/cjs/components/timeline/TimelineItem.js +96 -62
  119. package/cjs/components/timeline/TimelineItem.js.map +1 -1
  120. package/cjs/components/timeline/style/themes/dnb-timeline-theme-ui.css +3 -2
  121. package/cjs/components/timeline/style/themes/dnb-timeline-theme-ui.min.css +3 -1
  122. package/cjs/components/timeline/style/themes/dnb-timeline-theme-ui.scss +3 -2
  123. package/cjs/components/toggle-button/style/themes/dnb-toggle-button-theme-ui.scss +3 -1
  124. package/cjs/elements/lib.d.ts +1 -1
  125. package/cjs/elements/typography/H.d.ts +5 -3
  126. package/cjs/elements/typography/H.js +7 -3
  127. package/cjs/elements/typography/H.js.map +1 -1
  128. package/cjs/elements/typography/H1.js +2 -2
  129. package/cjs/elements/typography/H1.js.map +1 -1
  130. package/cjs/elements/typography/H2.js +2 -2
  131. package/cjs/elements/typography/H2.js.map +1 -1
  132. package/cjs/elements/typography/H3.js +2 -2
  133. package/cjs/elements/typography/H3.js.map +1 -1
  134. package/cjs/elements/typography/H4.js +2 -2
  135. package/cjs/elements/typography/H4.js.map +1 -1
  136. package/cjs/elements/typography/H5.js +2 -2
  137. package/cjs/elements/typography/H5.js.map +1 -1
  138. package/cjs/elements/typography/H6.js +2 -2
  139. package/cjs/elements/typography/H6.js.map +1 -1
  140. package/cjs/elements/typography/style/dnb-typography.scss +3 -0
  141. package/cjs/elements/typography/style/themes/dnb-typography-theme-sbanken.scss +12 -2
  142. package/cjs/elements/typography/style/typography-mixins.scss +5 -0
  143. package/cjs/extensions/forms/DataContext/index.js.map +1 -1
  144. package/cjs/extensions/forms/Field/ArraySelection.d.ts +2 -1
  145. package/cjs/extensions/forms/Field/ArraySelection.js +52 -32
  146. package/cjs/extensions/forms/Field/ArraySelection.js.map +1 -1
  147. package/cjs/extensions/forms/Field/CountryCode.d.ts +10 -0
  148. package/cjs/extensions/forms/Field/CountryCode.js +78 -0
  149. package/cjs/extensions/forms/Field/CountryCode.js.map +1 -0
  150. package/cjs/extensions/forms/Field/Currency.d.ts +2 -2
  151. package/cjs/extensions/forms/Field/Currency.js +6 -38
  152. package/cjs/extensions/forms/Field/Currency.js.map +1 -1
  153. package/cjs/extensions/forms/Field/Date.d.ts +2 -2
  154. package/cjs/extensions/forms/Field/Date.js +10 -6
  155. package/cjs/extensions/forms/Field/Date.js.map +1 -1
  156. package/cjs/extensions/forms/Field/Number.d.ts +7 -3
  157. package/cjs/extensions/forms/Field/Number.js +45 -20
  158. package/cjs/extensions/forms/Field/Number.js.map +1 -1
  159. package/cjs/extensions/forms/Field/PhoneNumber.d.ts +7 -2
  160. package/cjs/extensions/forms/Field/PhoneNumber.js +42 -41
  161. package/cjs/extensions/forms/Field/PhoneNumber.js.map +1 -1
  162. package/cjs/extensions/forms/Field/PostalCodeAndCity.d.ts +1 -1
  163. package/cjs/extensions/forms/Field/PostalCodeAndCity.js.map +1 -1
  164. package/cjs/extensions/forms/Field/Selection.d.ts +6 -4
  165. package/cjs/extensions/forms/Field/Selection.js +87 -36
  166. package/cjs/extensions/forms/Field/Selection.js.map +1 -1
  167. package/cjs/extensions/forms/Field/String.d.ts +3 -3
  168. package/cjs/extensions/forms/Field/String.js +26 -12
  169. package/cjs/extensions/forms/Field/String.js.map +1 -1
  170. package/cjs/extensions/forms/Field/Toggle.js +11 -9
  171. package/cjs/extensions/forms/Field/Toggle.js.map +1 -1
  172. package/cjs/extensions/forms/Field/fields.scss +2 -2
  173. package/cjs/extensions/forms/Field/hooks/useField.d.ts +6 -8
  174. package/cjs/extensions/forms/Field/hooks/useField.js +34 -33
  175. package/cjs/extensions/forms/Field/hooks/useField.js.map +1 -1
  176. package/cjs/extensions/forms/Field/index.d.ts +2 -0
  177. package/cjs/extensions/forms/Field/index.js +3 -1
  178. package/cjs/extensions/forms/Field/index.js.map +1 -1
  179. package/cjs/extensions/forms/Field/style/dnb-array-selection.css +13 -0
  180. package/cjs/extensions/forms/Field/style/dnb-array-selection.min.css +1 -0
  181. package/cjs/extensions/forms/Field/style/dnb-array-selection.scss +15 -0
  182. package/cjs/extensions/forms/Field/style/dnb-country-code.css +12 -0
  183. package/cjs/extensions/forms/Field/style/dnb-country-code.min.css +1 -0
  184. package/cjs/extensions/forms/Field/style/dnb-country-code.scss +19 -0
  185. package/cjs/extensions/forms/Field/style/dnb-phone-number.css +3 -7
  186. package/cjs/extensions/forms/Field/style/dnb-phone-number.min.css +1 -1
  187. package/cjs/extensions/forms/Field/style/dnb-phone-number.scss +3 -8
  188. package/cjs/extensions/forms/Field/style/dnb-postal-code-and-city.css +5 -2
  189. package/cjs/extensions/forms/Field/style/dnb-postal-code-and-city.min.css +1 -1
  190. package/cjs/extensions/forms/Field/style/dnb-postal-code-and-city.scss +5 -1
  191. package/cjs/extensions/forms/Field/style/dnb-selection.css +5 -2
  192. package/cjs/extensions/forms/Field/style/dnb-selection.min.css +1 -1
  193. package/cjs/extensions/forms/Field/style/dnb-selection.scss +7 -1
  194. package/cjs/extensions/forms/Field/style/index.scss +2 -0
  195. package/cjs/extensions/forms/FieldBlock/FieldBlock.d.ts +3 -2
  196. package/cjs/extensions/forms/FieldBlock/FieldBlock.js +15 -10
  197. package/cjs/extensions/forms/FieldBlock/FieldBlock.js.map +1 -1
  198. package/cjs/extensions/forms/FieldBlock/index.js.map +1 -1
  199. package/cjs/extensions/forms/FieldBlock/style/dnb-field-block.css +31 -8
  200. package/cjs/extensions/forms/FieldBlock/style/dnb-field-block.min.css +1 -1
  201. package/cjs/extensions/forms/FieldBlock/style/dnb-field-block.scss +46 -13
  202. package/cjs/extensions/forms/FieldGroup/index.js.map +1 -1
  203. package/cjs/extensions/forms/Layout/Card.js +2 -2
  204. package/cjs/extensions/forms/Layout/Card.js.map +1 -1
  205. package/cjs/extensions/forms/Layout/FlexContainer.d.ts +1 -0
  206. package/cjs/extensions/forms/Layout/FlexContainer.js +3 -2
  207. package/cjs/extensions/forms/Layout/FlexContainer.js.map +1 -1
  208. package/cjs/extensions/forms/Layout/FlexItem.d.ts +1 -0
  209. package/cjs/extensions/forms/Layout/FlexItem.js +2 -1
  210. package/cjs/extensions/forms/Layout/FlexItem.js.map +1 -1
  211. package/cjs/extensions/forms/Layout/style/dnb-card.css +3 -3
  212. package/cjs/extensions/forms/Layout/style/dnb-card.min.css +1 -1
  213. package/cjs/extensions/forms/Layout/style/dnb-card.scss +6 -4
  214. package/cjs/extensions/forms/Layout/style/dnb-flex-container.css +9 -0
  215. package/cjs/extensions/forms/Layout/style/dnb-flex-container.min.css +1 -1
  216. package/cjs/extensions/forms/Layout/style/dnb-flex-container.scss +14 -0
  217. package/cjs/extensions/forms/Layout/style/dnb-flex-item.css +9 -0
  218. package/cjs/extensions/forms/Layout/style/dnb-flex-item.min.css +1 -1
  219. package/cjs/extensions/forms/Layout/style/dnb-flex-item.scss +14 -0
  220. package/cjs/extensions/forms/StepsLayout/StepsLayout.js +1 -1
  221. package/cjs/extensions/forms/StepsLayout/StepsLayout.js.map +1 -1
  222. package/cjs/extensions/forms/StepsLayout/style/dnb-steps-layout.css +11 -5
  223. package/cjs/extensions/forms/StepsLayout/style/dnb-steps-layout.min.css +1 -1
  224. package/cjs/extensions/forms/StepsLayout/style/dnb-steps-layout.scss +10 -3
  225. package/cjs/extensions/forms/ValueBlock/index.js.map +1 -1
  226. package/cjs/extensions/forms/field-types.d.ts +7 -1
  227. package/cjs/extensions/forms/field-types.js.map +1 -1
  228. package/cjs/extensions/forms/style/dnb-forms.css +105 -29
  229. package/cjs/extensions/forms/style/dnb-forms.min.css +1 -1
  230. package/cjs/extensions/forms/style/index.d.ts +1 -0
  231. package/cjs/extensions/forms/style/index.js +4 -0
  232. package/cjs/extensions/forms/style/index.js.map +1 -0
  233. package/cjs/extensions/forms/utils/TestElement/style/dnb-test-element.css +2 -2
  234. package/cjs/extensions/forms/utils/TestElement/style/dnb-test-element.min.css +1 -1
  235. package/cjs/extensions/forms/utils/TestElement/style/dnb-test-element.scss +2 -2
  236. package/cjs/extensions/forms/utils/useWasChanged.d.ts +5 -0
  237. package/cjs/extensions/forms/utils/useWasChanged.js +62 -0
  238. package/cjs/extensions/forms/utils/useWasChanged.js.map +1 -0
  239. package/cjs/extensions/forms/variables.scss +3 -0
  240. package/cjs/extensions/lib.d.ts +1 -0
  241. package/cjs/extensions/payment-card/PaymentCard.js.map +1 -1
  242. package/cjs/extensions/payment-card/utils/backgrounds/ung.js +1 -1
  243. package/cjs/extensions/payment-card/utils/backgrounds/ung.js.map +1 -1
  244. package/cjs/extensions/payment-card/utils/backgrounds/youth.js +1 -1
  245. package/cjs/extensions/payment-card/utils/backgrounds/youth.js.map +1 -1
  246. package/cjs/fragments/drawer-list/DrawerList.js +1 -1
  247. package/cjs/fragments/drawer-list/DrawerList.js.map +1 -1
  248. package/cjs/fragments/drawer-list/DrawerListPortal.js +2 -2
  249. package/cjs/fragments/drawer-list/DrawerListPortal.js.map +1 -1
  250. package/cjs/fragments/drawer-list/style/dnb-drawer-list.scss +3 -1
  251. package/cjs/shared/Context.d.ts +2 -0
  252. package/cjs/shared/Context.js.map +1 -1
  253. package/cjs/shared/Eufemia.d.ts +1 -1
  254. package/cjs/shared/Eufemia.js +2 -2
  255. package/cjs/shared/Eufemia.js.map +1 -1
  256. package/cjs/shared/helpers/withCamelCaseProps.js.map +1 -1
  257. package/cjs/shared/helpers/withSnakeCaseProps.js.map +1 -1
  258. package/cjs/shared/libs/Shortcuts.js.map +1 -1
  259. package/cjs/shared/locales/en-GB.d.ts +1 -0
  260. package/cjs/shared/locales/en-GB.js +1 -0
  261. package/cjs/shared/locales/en-GB.js.map +1 -1
  262. package/cjs/shared/locales/en-US.d.ts +1 -0
  263. package/cjs/shared/locales/index.d.ts +2 -0
  264. package/cjs/shared/locales/nb-NO.d.ts +1 -0
  265. package/cjs/shared/locales/nb-NO.js +1 -0
  266. package/cjs/shared/locales/nb-NO.js.map +1 -1
  267. package/cjs/style/core/reset.scss +13 -3
  268. package/cjs/style/core/utilities.scss +3 -1
  269. package/cjs/style/dnb-ui-components.css +23 -18
  270. package/cjs/style/dnb-ui-components.min.css +1 -1
  271. package/cjs/style/dnb-ui-elements.css +6 -0
  272. package/cjs/style/dnb-ui-elements.min.css +1 -1
  273. package/cjs/style/dnb-ui-extensions.css +105 -29
  274. package/cjs/style/dnb-ui-extensions.min.css +1 -1
  275. package/cjs/style/themes/theme-eiendom/eiendom-theme-basis.css +6 -0
  276. package/cjs/style/themes/theme-eiendom/eiendom-theme-basis.min.css +1 -1
  277. package/cjs/style/themes/theme-eiendom/eiendom-theme-components.css +42 -24
  278. package/cjs/style/themes/theme-eiendom/eiendom-theme-components.min.css +3 -1
  279. package/cjs/style/themes/theme-eiendom/eiendom-theme-extensions.css +105 -29
  280. package/cjs/style/themes/theme-eiendom/eiendom-theme-extensions.min.css +1 -1
  281. package/cjs/style/themes/theme-sbanken/customisations.scss +0 -8
  282. package/cjs/style/themes/theme-sbanken/properties.js +6 -6
  283. package/cjs/style/themes/theme-sbanken/properties.js.map +1 -1
  284. package/cjs/style/themes/theme-sbanken/properties.scss +6 -6
  285. package/cjs/style/themes/theme-sbanken/sbanken-theme-basis.css +27 -26
  286. package/cjs/style/themes/theme-sbanken/sbanken-theme-basis.min.css +1 -1
  287. package/cjs/style/themes/theme-sbanken/sbanken-theme-components.css +236 -245
  288. package/cjs/style/themes/theme-sbanken/sbanken-theme-components.min.css +4 -2
  289. package/cjs/style/themes/theme-sbanken/sbanken-theme-components.scss +4 -3
  290. package/cjs/style/themes/theme-sbanken/sbanken-theme-elements.css +21 -2
  291. package/cjs/style/themes/theme-sbanken/sbanken-theme-elements.min.css +1 -1
  292. package/cjs/style/themes/theme-sbanken/sbanken-theme-extensions.css +105 -29
  293. package/cjs/style/themes/theme-sbanken/sbanken-theme-extensions.min.css +1 -1
  294. package/cjs/style/themes/theme-ui/fonts.scss +8 -4
  295. package/cjs/style/themes/theme-ui/ui-theme-basis.css +6 -0
  296. package/cjs/style/themes/theme-ui/ui-theme-basis.min.css +1 -1
  297. package/cjs/style/themes/theme-ui/ui-theme-components.css +42 -24
  298. package/cjs/style/themes/theme-ui/ui-theme-components.min.css +4 -2
  299. package/cjs/style/themes/theme-ui/ui-theme-elements.css +6 -0
  300. package/cjs/style/themes/theme-ui/ui-theme-elements.min.css +1 -1
  301. package/cjs/style/themes/theme-ui/ui-theme-extensions.css +105 -29
  302. package/cjs/style/themes/theme-ui/ui-theme-extensions.min.css +1 -1
  303. package/cjs/style/themes/theme-ui/ui-theme-tags.css +3 -0
  304. package/cjs/style/themes/theme-ui/ui-theme-tags.min.css +1 -1
  305. package/cjs/style/themes/theme-ui/ui-theme-tags.scss +9 -4
  306. package/components/accordion/Accordion.d.ts +1 -1
  307. package/components/accordion/AccordionHeader.d.ts +4 -4
  308. package/components/accordion/AccordionHeader.js +18 -5
  309. package/components/accordion/AccordionHeader.js.map +1 -1
  310. package/components/accordion/style/dnb-accordion.css +22 -17
  311. package/components/accordion/style/dnb-accordion.min.css +1 -1
  312. package/components/accordion/style/dnb-accordion.scss +40 -18
  313. package/components/accordion/style/themes/dnb-accordion-theme-sbanken.css +124 -0
  314. package/components/accordion/style/themes/dnb-accordion-theme-sbanken.min.css +1 -0
  315. package/components/accordion/style/themes/dnb-accordion-theme-sbanken.scss +125 -0
  316. package/components/anchor/Anchor.js +1 -1
  317. package/components/anchor/Anchor.js.map +1 -1
  318. package/components/anchor/style/anchor-mixins.scss +9 -3
  319. package/components/anchor/style/themes/dnb-anchor-theme-sbanken.scss +3 -1
  320. package/components/autocomplete/Autocomplete.js +4 -2
  321. package/components/autocomplete/Autocomplete.js.map +1 -1
  322. package/components/avatar/style/index.d.ts +1 -1
  323. package/components/avatar/style/themes/dnb-avatar-theme-sbanken.scss +2 -1
  324. package/components/breadcrumb/Breadcrumb.js +2 -2
  325. package/components/breadcrumb/Breadcrumb.js.map +1 -1
  326. package/components/breadcrumb/BreadcrumbItem.js +23 -1
  327. package/components/breadcrumb/BreadcrumbItem.js.map +1 -1
  328. package/components/breadcrumb/style/themes/dnb-breadcrumb-theme-sbanken.css +23 -0
  329. package/components/breadcrumb/style/themes/dnb-breadcrumb-theme-sbanken.min.css +1 -0
  330. package/components/breadcrumb/style/themes/dnb-breadcrumb-theme-sbanken.scss +33 -0
  331. package/components/button/style/themes/dnb-button-theme-ui.scss +3 -1
  332. package/components/checkbox/Checkbox.d.ts +4 -0
  333. package/components/checkbox/Checkbox.js +6 -4
  334. package/components/checkbox/Checkbox.js.map +1 -1
  335. package/components/checkbox/style/themes/dnb-checkbox-theme-ui.scss +3 -1
  336. package/components/date-picker/style/themes/dnb-date-picker-theme-ui.scss +6 -2
  337. package/components/drawer/Drawer.d.ts +1 -1
  338. package/components/drawer/Drawer.js +3 -1
  339. package/components/drawer/Drawer.js.map +1 -1
  340. package/components/form-status/FormStatus.d.ts +2 -0
  341. package/components/form-status/FormStatus.js +70 -53
  342. package/components/form-status/FormStatus.js.map +1 -1
  343. package/components/form-status/style/dnb-form-status.scss +4 -2
  344. package/components/form-status/style/themes/dnb-form-status-theme-sbanken.css +37 -0
  345. package/components/form-status/style/themes/dnb-form-status-theme-sbanken.min.css +1 -0
  346. package/components/form-status/style/themes/dnb-form-status-theme-sbanken.scss +35 -0
  347. package/components/global-status/GlobalStatus.d.ts +1 -1
  348. package/components/global-status/GlobalStatus.js +18 -8
  349. package/components/global-status/GlobalStatus.js.map +1 -1
  350. package/components/global-status/style/dnb-global-status.scss +2 -1
  351. package/components/global-status/style/themes/dnb-global-status-theme-sbanken.css +22 -0
  352. package/components/global-status/style/themes/dnb-global-status-theme-sbanken.min.css +1 -0
  353. package/components/global-status/style/themes/dnb-global-status-theme-sbanken.scss +28 -0
  354. package/components/global-status/style/themes/dnb-global-status-theme-ui.css +6 -3
  355. package/components/global-status/style/themes/dnb-global-status-theme-ui.min.css +1 -1
  356. package/components/global-status/style/themes/dnb-global-status-theme-ui.scss +13 -6
  357. package/components/heading/Heading.d.ts +8 -8
  358. package/components/heading/Heading.js +9 -15
  359. package/components/heading/Heading.js.map +1 -1
  360. package/components/heading/HeadingHelpers.d.ts +5 -1
  361. package/components/heading/HeadingHelpers.js +39 -0
  362. package/components/heading/HeadingHelpers.js.map +1 -1
  363. package/components/info-card/index.js.map +1 -1
  364. package/components/info-card/style.js.map +1 -1
  365. package/components/input/style/themes/dnb-input-theme-ui.css +1 -1
  366. package/components/input/style/themes/dnb-input-theme-ui.min.css +1 -1
  367. package/components/input/style/themes/dnb-input-theme-ui.scss +9 -3
  368. package/components/input-masked/InputMaskedUtils.js +1 -1
  369. package/components/input-masked/InputMaskedUtils.js.map +1 -1
  370. package/components/modal/Modal.js.map +1 -1
  371. package/components/modal/parts/ModalHeaderBar.js +0 -4
  372. package/components/modal/parts/ModalHeaderBar.js.map +1 -1
  373. package/components/pagination/Pagination.js.map +1 -1
  374. package/components/radio/Radio.d.ts +4 -0
  375. package/components/radio/Radio.js +6 -4
  376. package/components/radio/Radio.js.map +1 -1
  377. package/components/radio/style/themes/dnb-radio-theme-ui.scss +15 -5
  378. package/components/section/Section.d.ts +21 -1
  379. package/components/section/Section.js.map +1 -1
  380. package/components/section/style/dnb-section.css +1 -1
  381. package/components/section/style/dnb-section.scss +8 -3
  382. package/components/section/style/themes/dnb-section-theme-sbanken.scss +3 -4
  383. package/components/section/style/themes/dnb-section-theme-ui.css +9 -0
  384. package/components/section/style/themes/dnb-section-theme-ui.scss +28 -14
  385. package/components/skeleton/style/dnb-skeleton.scss +8 -5
  386. package/components/slider/style/dnb-slider.scss +4 -2
  387. package/components/space/SpacingUtils.js.map +1 -1
  388. package/components/step-indicator/StepIndicator.d.ts +89 -75
  389. package/components/step-indicator/StepIndicator.js +29 -25
  390. package/components/step-indicator/StepIndicator.js.map +1 -1
  391. package/components/step-indicator/StepIndicatorContext.d.ts +45 -15
  392. package/components/step-indicator/StepIndicatorContext.js +98 -120
  393. package/components/step-indicator/StepIndicatorContext.js.map +1 -1
  394. package/components/step-indicator/StepIndicatorItem.d.ts +59 -61
  395. package/components/step-indicator/StepIndicatorItem.js +177 -227
  396. package/components/step-indicator/StepIndicatorItem.js.map +1 -1
  397. package/components/step-indicator/StepIndicatorList.d.ts +6 -8
  398. package/components/step-indicator/StepIndicatorList.js +43 -48
  399. package/components/step-indicator/StepIndicatorList.js.map +1 -1
  400. package/components/step-indicator/StepIndicatorModal.d.ts +6 -14
  401. package/components/step-indicator/StepIndicatorModal.js +38 -50
  402. package/components/step-indicator/StepIndicatorModal.js.map +1 -1
  403. package/components/step-indicator/StepIndicatorProps.d.ts +2 -55
  404. package/components/step-indicator/StepIndicatorProps.js +3 -45
  405. package/components/step-indicator/StepIndicatorProps.js.map +1 -1
  406. package/components/step-indicator/StepIndicatorSidebar.d.ts +27 -21
  407. package/components/step-indicator/StepIndicatorSidebar.js +39 -52
  408. package/components/step-indicator/StepIndicatorSidebar.js.map +1 -1
  409. package/components/step-indicator/StepIndicatorTriggerButton.d.ts +16 -17
  410. package/components/step-indicator/StepIndicatorTriggerButton.js +62 -78
  411. package/components/step-indicator/StepIndicatorTriggerButton.js.map +1 -1
  412. package/components/switch/Switch.d.ts +4 -0
  413. package/components/switch/Switch.js +6 -4
  414. package/components/switch/Switch.js.map +1 -1
  415. package/components/switch/style/themes/dnb-switch-theme-ui.scss +3 -1
  416. package/components/table/TableContainer.js.map +1 -1
  417. package/components/table/style/table-accordion.scss +18 -6
  418. package/components/table/style/table-header-buttons.scss +3 -1
  419. package/components/table/style/table-tr.scss +6 -2
  420. package/components/table/style/themes/dnb-table-theme-ui.scss +3 -1
  421. package/components/timeline/TimelineItem.d.ts +3 -2
  422. package/components/timeline/TimelineItem.js +95 -61
  423. package/components/timeline/TimelineItem.js.map +1 -1
  424. package/components/timeline/style/themes/dnb-timeline-theme-ui.css +3 -2
  425. package/components/timeline/style/themes/dnb-timeline-theme-ui.min.css +3 -1
  426. package/components/timeline/style/themes/dnb-timeline-theme-ui.scss +3 -2
  427. package/components/toggle-button/style/themes/dnb-toggle-button-theme-ui.scss +3 -1
  428. package/elements/lib.d.ts +1 -1
  429. package/elements/typography/H.d.ts +5 -3
  430. package/elements/typography/H.js +8 -4
  431. package/elements/typography/H.js.map +1 -1
  432. package/elements/typography/H1.js +2 -2
  433. package/elements/typography/H1.js.map +1 -1
  434. package/elements/typography/H2.js +2 -2
  435. package/elements/typography/H2.js.map +1 -1
  436. package/elements/typography/H3.js +2 -2
  437. package/elements/typography/H3.js.map +1 -1
  438. package/elements/typography/H4.js +2 -2
  439. package/elements/typography/H4.js.map +1 -1
  440. package/elements/typography/H5.js +2 -2
  441. package/elements/typography/H5.js.map +1 -1
  442. package/elements/typography/H6.js +2 -2
  443. package/elements/typography/H6.js.map +1 -1
  444. package/elements/typography/style/dnb-typography.scss +3 -0
  445. package/elements/typography/style/themes/dnb-typography-theme-sbanken.scss +12 -2
  446. package/elements/typography/style/typography-mixins.scss +5 -0
  447. package/es/components/accordion/Accordion.d.ts +1 -1
  448. package/es/components/accordion/AccordionHeader.d.ts +4 -4
  449. package/es/components/accordion/AccordionHeader.js +18 -5
  450. package/es/components/accordion/AccordionHeader.js.map +1 -1
  451. package/es/components/accordion/style/dnb-accordion.css +22 -17
  452. package/es/components/accordion/style/dnb-accordion.min.css +1 -1
  453. package/es/components/accordion/style/dnb-accordion.scss +40 -18
  454. package/es/components/accordion/style/themes/dnb-accordion-theme-sbanken.css +124 -0
  455. package/es/components/accordion/style/themes/dnb-accordion-theme-sbanken.min.css +1 -0
  456. package/es/components/accordion/style/themes/dnb-accordion-theme-sbanken.scss +125 -0
  457. package/es/components/anchor/Anchor.js +1 -1
  458. package/es/components/anchor/Anchor.js.map +1 -1
  459. package/es/components/anchor/style/anchor-mixins.scss +9 -3
  460. package/es/components/anchor/style/themes/dnb-anchor-theme-sbanken.scss +3 -1
  461. package/es/components/autocomplete/Autocomplete.js +4 -2
  462. package/es/components/autocomplete/Autocomplete.js.map +1 -1
  463. package/es/components/avatar/style/index.d.ts +1 -1
  464. package/es/components/avatar/style/themes/dnb-avatar-theme-sbanken.scss +2 -1
  465. package/es/components/breadcrumb/Breadcrumb.js +2 -2
  466. package/es/components/breadcrumb/Breadcrumb.js.map +1 -1
  467. package/es/components/breadcrumb/BreadcrumbItem.js +23 -1
  468. package/es/components/breadcrumb/BreadcrumbItem.js.map +1 -1
  469. package/es/components/breadcrumb/style/themes/dnb-breadcrumb-theme-sbanken.css +23 -0
  470. package/es/components/breadcrumb/style/themes/dnb-breadcrumb-theme-sbanken.min.css +1 -0
  471. package/es/components/breadcrumb/style/themes/dnb-breadcrumb-theme-sbanken.scss +33 -0
  472. package/es/components/button/style/themes/dnb-button-theme-ui.scss +3 -1
  473. package/es/components/checkbox/Checkbox.d.ts +4 -0
  474. package/es/components/checkbox/Checkbox.js +6 -4
  475. package/es/components/checkbox/Checkbox.js.map +1 -1
  476. package/es/components/checkbox/style/themes/dnb-checkbox-theme-ui.scss +3 -1
  477. package/es/components/date-picker/style/themes/dnb-date-picker-theme-ui.scss +6 -2
  478. package/es/components/drawer/Drawer.d.ts +1 -1
  479. package/es/components/drawer/Drawer.js +3 -1
  480. package/es/components/drawer/Drawer.js.map +1 -1
  481. package/es/components/form-status/FormStatus.d.ts +2 -0
  482. package/es/components/form-status/FormStatus.js +70 -53
  483. package/es/components/form-status/FormStatus.js.map +1 -1
  484. package/es/components/form-status/style/dnb-form-status.scss +4 -2
  485. package/es/components/form-status/style/themes/dnb-form-status-theme-sbanken.css +37 -0
  486. package/es/components/form-status/style/themes/dnb-form-status-theme-sbanken.min.css +1 -0
  487. package/es/components/form-status/style/themes/dnb-form-status-theme-sbanken.scss +35 -0
  488. package/es/components/global-status/GlobalStatus.d.ts +1 -1
  489. package/es/components/global-status/GlobalStatus.js +18 -8
  490. package/es/components/global-status/GlobalStatus.js.map +1 -1
  491. package/es/components/global-status/style/dnb-global-status.scss +2 -1
  492. package/es/components/global-status/style/themes/dnb-global-status-theme-sbanken.css +22 -0
  493. package/es/components/global-status/style/themes/dnb-global-status-theme-sbanken.min.css +1 -0
  494. package/es/components/global-status/style/themes/dnb-global-status-theme-sbanken.scss +28 -0
  495. package/es/components/global-status/style/themes/dnb-global-status-theme-ui.css +6 -3
  496. package/es/components/global-status/style/themes/dnb-global-status-theme-ui.min.css +1 -1
  497. package/es/components/global-status/style/themes/dnb-global-status-theme-ui.scss +13 -6
  498. package/es/components/heading/Heading.d.ts +8 -8
  499. package/es/components/heading/Heading.js +9 -15
  500. package/es/components/heading/Heading.js.map +1 -1
  501. package/es/components/heading/HeadingHelpers.d.ts +5 -1
  502. package/es/components/heading/HeadingHelpers.js +39 -0
  503. package/es/components/heading/HeadingHelpers.js.map +1 -1
  504. package/es/components/info-card/index.js.map +1 -1
  505. package/es/components/info-card/style.js.map +1 -1
  506. package/es/components/input/style/themes/dnb-input-theme-ui.css +1 -1
  507. package/es/components/input/style/themes/dnb-input-theme-ui.min.css +1 -1
  508. package/es/components/input/style/themes/dnb-input-theme-ui.scss +9 -3
  509. package/es/components/input-masked/InputMaskedUtils.js +1 -1
  510. package/es/components/input-masked/InputMaskedUtils.js.map +1 -1
  511. package/es/components/modal/Modal.js.map +1 -1
  512. package/es/components/modal/parts/ModalHeaderBar.js +0 -4
  513. package/es/components/modal/parts/ModalHeaderBar.js.map +1 -1
  514. package/es/components/pagination/Pagination.js.map +1 -1
  515. package/es/components/radio/Radio.d.ts +4 -0
  516. package/es/components/radio/Radio.js +6 -4
  517. package/es/components/radio/Radio.js.map +1 -1
  518. package/es/components/radio/style/themes/dnb-radio-theme-ui.scss +15 -5
  519. package/es/components/section/Section.d.ts +21 -1
  520. package/es/components/section/Section.js.map +1 -1
  521. package/es/components/section/style/dnb-section.css +1 -1
  522. package/es/components/section/style/dnb-section.scss +8 -3
  523. package/es/components/section/style/themes/dnb-section-theme-sbanken.scss +3 -4
  524. package/es/components/section/style/themes/dnb-section-theme-ui.css +9 -0
  525. package/es/components/section/style/themes/dnb-section-theme-ui.scss +28 -14
  526. package/es/components/skeleton/style/dnb-skeleton.scss +8 -5
  527. package/es/components/slider/style/dnb-slider.scss +4 -2
  528. package/es/components/space/SpacingUtils.js.map +1 -1
  529. package/es/components/step-indicator/StepIndicator.d.ts +89 -75
  530. package/es/components/step-indicator/StepIndicator.js +29 -25
  531. package/es/components/step-indicator/StepIndicator.js.map +1 -1
  532. package/es/components/step-indicator/StepIndicatorContext.d.ts +45 -15
  533. package/es/components/step-indicator/StepIndicatorContext.js +94 -114
  534. package/es/components/step-indicator/StepIndicatorContext.js.map +1 -1
  535. package/es/components/step-indicator/StepIndicatorItem.d.ts +59 -61
  536. package/es/components/step-indicator/StepIndicatorItem.js +173 -223
  537. package/es/components/step-indicator/StepIndicatorItem.js.map +1 -1
  538. package/es/components/step-indicator/StepIndicatorList.d.ts +6 -8
  539. package/es/components/step-indicator/StepIndicatorList.js +43 -48
  540. package/es/components/step-indicator/StepIndicatorList.js.map +1 -1
  541. package/es/components/step-indicator/StepIndicatorModal.d.ts +6 -14
  542. package/es/components/step-indicator/StepIndicatorModal.js +38 -48
  543. package/es/components/step-indicator/StepIndicatorModal.js.map +1 -1
  544. package/es/components/step-indicator/StepIndicatorProps.d.ts +2 -55
  545. package/es/components/step-indicator/StepIndicatorProps.js +3 -45
  546. package/es/components/step-indicator/StepIndicatorProps.js.map +1 -1
  547. package/es/components/step-indicator/StepIndicatorSidebar.d.ts +27 -21
  548. package/es/components/step-indicator/StepIndicatorSidebar.js +39 -52
  549. package/es/components/step-indicator/StepIndicatorSidebar.js.map +1 -1
  550. package/es/components/step-indicator/StepIndicatorTriggerButton.d.ts +16 -17
  551. package/es/components/step-indicator/StepIndicatorTriggerButton.js +62 -78
  552. package/es/components/step-indicator/StepIndicatorTriggerButton.js.map +1 -1
  553. package/es/components/switch/Switch.d.ts +4 -0
  554. package/es/components/switch/Switch.js +6 -4
  555. package/es/components/switch/Switch.js.map +1 -1
  556. package/es/components/switch/style/themes/dnb-switch-theme-ui.scss +3 -1
  557. package/es/components/table/TableContainer.js.map +1 -1
  558. package/es/components/table/style/table-accordion.scss +18 -6
  559. package/es/components/table/style/table-header-buttons.scss +3 -1
  560. package/es/components/table/style/table-tr.scss +6 -2
  561. package/es/components/table/style/themes/dnb-table-theme-ui.scss +3 -1
  562. package/es/components/timeline/TimelineItem.d.ts +3 -2
  563. package/es/components/timeline/TimelineItem.js +89 -58
  564. package/es/components/timeline/TimelineItem.js.map +1 -1
  565. package/es/components/timeline/style/themes/dnb-timeline-theme-ui.css +3 -2
  566. package/es/components/timeline/style/themes/dnb-timeline-theme-ui.min.css +3 -1
  567. package/es/components/timeline/style/themes/dnb-timeline-theme-ui.scss +3 -2
  568. package/es/components/toggle-button/style/themes/dnb-toggle-button-theme-ui.scss +3 -1
  569. package/es/elements/lib.d.ts +1 -1
  570. package/es/elements/typography/H.d.ts +5 -3
  571. package/es/elements/typography/H.js +8 -4
  572. package/es/elements/typography/H.js.map +1 -1
  573. package/es/elements/typography/H1.js +2 -2
  574. package/es/elements/typography/H1.js.map +1 -1
  575. package/es/elements/typography/H2.js +2 -2
  576. package/es/elements/typography/H2.js.map +1 -1
  577. package/es/elements/typography/H3.js +2 -2
  578. package/es/elements/typography/H3.js.map +1 -1
  579. package/es/elements/typography/H4.js +2 -2
  580. package/es/elements/typography/H4.js.map +1 -1
  581. package/es/elements/typography/H5.js +2 -2
  582. package/es/elements/typography/H5.js.map +1 -1
  583. package/es/elements/typography/H6.js +2 -2
  584. package/es/elements/typography/H6.js.map +1 -1
  585. package/es/elements/typography/style/dnb-typography.scss +3 -0
  586. package/es/elements/typography/style/themes/dnb-typography-theme-sbanken.scss +12 -2
  587. package/es/elements/typography/style/typography-mixins.scss +5 -0
  588. package/es/extensions/forms/DataContext/index.js.map +1 -1
  589. package/es/extensions/forms/Field/ArraySelection.d.ts +2 -1
  590. package/es/extensions/forms/Field/ArraySelection.js +49 -33
  591. package/es/extensions/forms/Field/ArraySelection.js.map +1 -1
  592. package/es/extensions/forms/Field/CountryCode.d.ts +10 -0
  593. package/es/extensions/forms/Field/CountryCode.js +67 -0
  594. package/es/extensions/forms/Field/CountryCode.js.map +1 -0
  595. package/es/extensions/forms/Field/Currency.d.ts +2 -2
  596. package/es/extensions/forms/Field/Currency.js +6 -37
  597. package/es/extensions/forms/Field/Currency.js.map +1 -1
  598. package/es/extensions/forms/Field/Date.d.ts +2 -2
  599. package/es/extensions/forms/Field/Date.js +11 -7
  600. package/es/extensions/forms/Field/Date.js.map +1 -1
  601. package/es/extensions/forms/Field/Number.d.ts +7 -3
  602. package/es/extensions/forms/Field/Number.js +44 -21
  603. package/es/extensions/forms/Field/Number.js.map +1 -1
  604. package/es/extensions/forms/Field/PhoneNumber.d.ts +7 -2
  605. package/es/extensions/forms/Field/PhoneNumber.js +43 -40
  606. package/es/extensions/forms/Field/PhoneNumber.js.map +1 -1
  607. package/es/extensions/forms/Field/PostalCodeAndCity.d.ts +1 -1
  608. package/es/extensions/forms/Field/PostalCodeAndCity.js.map +1 -1
  609. package/es/extensions/forms/Field/Selection.d.ts +6 -4
  610. package/es/extensions/forms/Field/Selection.js +85 -37
  611. package/es/extensions/forms/Field/Selection.js.map +1 -1
  612. package/es/extensions/forms/Field/String.d.ts +3 -3
  613. package/es/extensions/forms/Field/String.js +27 -13
  614. package/es/extensions/forms/Field/String.js.map +1 -1
  615. package/es/extensions/forms/Field/Toggle.js +11 -9
  616. package/es/extensions/forms/Field/Toggle.js.map +1 -1
  617. package/es/extensions/forms/Field/fields.scss +2 -2
  618. package/es/extensions/forms/Field/hooks/useField.d.ts +6 -8
  619. package/es/extensions/forms/Field/hooks/useField.js +34 -31
  620. package/es/extensions/forms/Field/hooks/useField.js.map +1 -1
  621. package/es/extensions/forms/Field/index.d.ts +2 -0
  622. package/es/extensions/forms/Field/index.js +3 -1
  623. package/es/extensions/forms/Field/index.js.map +1 -1
  624. package/es/extensions/forms/Field/style/dnb-array-selection.css +13 -0
  625. package/es/extensions/forms/Field/style/dnb-array-selection.min.css +1 -0
  626. package/es/extensions/forms/Field/style/dnb-array-selection.scss +15 -0
  627. package/es/extensions/forms/Field/style/dnb-country-code.css +12 -0
  628. package/es/extensions/forms/Field/style/dnb-country-code.min.css +1 -0
  629. package/es/extensions/forms/Field/style/dnb-country-code.scss +19 -0
  630. package/es/extensions/forms/Field/style/dnb-phone-number.css +3 -7
  631. package/es/extensions/forms/Field/style/dnb-phone-number.min.css +1 -1
  632. package/es/extensions/forms/Field/style/dnb-phone-number.scss +3 -8
  633. package/es/extensions/forms/Field/style/dnb-postal-code-and-city.css +5 -2
  634. package/es/extensions/forms/Field/style/dnb-postal-code-and-city.min.css +1 -1
  635. package/es/extensions/forms/Field/style/dnb-postal-code-and-city.scss +5 -1
  636. package/es/extensions/forms/Field/style/dnb-selection.css +5 -2
  637. package/es/extensions/forms/Field/style/dnb-selection.min.css +1 -1
  638. package/es/extensions/forms/Field/style/dnb-selection.scss +7 -1
  639. package/es/extensions/forms/Field/style/index.scss +2 -0
  640. package/es/extensions/forms/FieldBlock/FieldBlock.d.ts +3 -2
  641. package/es/extensions/forms/FieldBlock/FieldBlock.js +15 -10
  642. package/es/extensions/forms/FieldBlock/FieldBlock.js.map +1 -1
  643. package/es/extensions/forms/FieldBlock/index.js.map +1 -1
  644. package/es/extensions/forms/FieldBlock/style/dnb-field-block.css +31 -8
  645. package/es/extensions/forms/FieldBlock/style/dnb-field-block.min.css +1 -1
  646. package/es/extensions/forms/FieldBlock/style/dnb-field-block.scss +46 -13
  647. package/es/extensions/forms/FieldGroup/index.js.map +1 -1
  648. package/es/extensions/forms/Layout/Card.js +2 -2
  649. package/es/extensions/forms/Layout/Card.js.map +1 -1
  650. package/es/extensions/forms/Layout/FlexContainer.d.ts +1 -0
  651. package/es/extensions/forms/Layout/FlexContainer.js +3 -2
  652. package/es/extensions/forms/Layout/FlexContainer.js.map +1 -1
  653. package/es/extensions/forms/Layout/FlexItem.d.ts +1 -0
  654. package/es/extensions/forms/Layout/FlexItem.js +2 -1
  655. package/es/extensions/forms/Layout/FlexItem.js.map +1 -1
  656. package/es/extensions/forms/Layout/style/dnb-card.css +3 -3
  657. package/es/extensions/forms/Layout/style/dnb-card.min.css +1 -1
  658. package/es/extensions/forms/Layout/style/dnb-card.scss +6 -4
  659. package/es/extensions/forms/Layout/style/dnb-flex-container.css +9 -0
  660. package/es/extensions/forms/Layout/style/dnb-flex-container.min.css +1 -1
  661. package/es/extensions/forms/Layout/style/dnb-flex-container.scss +14 -0
  662. package/es/extensions/forms/Layout/style/dnb-flex-item.css +9 -0
  663. package/es/extensions/forms/Layout/style/dnb-flex-item.min.css +1 -1
  664. package/es/extensions/forms/Layout/style/dnb-flex-item.scss +14 -0
  665. package/es/extensions/forms/StepsLayout/StepsLayout.js +1 -1
  666. package/es/extensions/forms/StepsLayout/StepsLayout.js.map +1 -1
  667. package/es/extensions/forms/StepsLayout/style/dnb-steps-layout.css +11 -5
  668. package/es/extensions/forms/StepsLayout/style/dnb-steps-layout.min.css +1 -1
  669. package/es/extensions/forms/StepsLayout/style/dnb-steps-layout.scss +10 -3
  670. package/es/extensions/forms/ValueBlock/index.js.map +1 -1
  671. package/es/extensions/forms/field-types.d.ts +7 -1
  672. package/es/extensions/forms/field-types.js.map +1 -1
  673. package/es/extensions/forms/style/dnb-forms.css +105 -29
  674. package/es/extensions/forms/style/dnb-forms.min.css +1 -1
  675. package/es/extensions/forms/style/index.d.ts +1 -0
  676. package/es/extensions/forms/style/index.js +1 -0
  677. package/es/extensions/forms/style/index.js.map +1 -0
  678. package/es/extensions/forms/utils/TestElement/style/dnb-test-element.css +2 -2
  679. package/es/extensions/forms/utils/TestElement/style/dnb-test-element.min.css +1 -1
  680. package/es/extensions/forms/utils/TestElement/style/dnb-test-element.scss +2 -2
  681. package/es/extensions/forms/utils/useWasChanged.d.ts +5 -0
  682. package/es/extensions/forms/utils/useWasChanged.js +51 -0
  683. package/es/extensions/forms/utils/useWasChanged.js.map +1 -0
  684. package/es/extensions/forms/variables.scss +3 -0
  685. package/es/extensions/lib.d.ts +1 -0
  686. package/es/extensions/payment-card/PaymentCard.js.map +1 -1
  687. package/es/extensions/payment-card/utils/backgrounds/ung.js +1 -1
  688. package/es/extensions/payment-card/utils/backgrounds/ung.js.map +1 -1
  689. package/es/extensions/payment-card/utils/backgrounds/youth.js +1 -1
  690. package/es/extensions/payment-card/utils/backgrounds/youth.js.map +1 -1
  691. package/es/fragments/drawer-list/DrawerList.js +1 -1
  692. package/es/fragments/drawer-list/DrawerList.js.map +1 -1
  693. package/es/fragments/drawer-list/DrawerListPortal.js +2 -2
  694. package/es/fragments/drawer-list/DrawerListPortal.js.map +1 -1
  695. package/es/fragments/drawer-list/style/dnb-drawer-list.scss +3 -1
  696. package/es/shared/Context.d.ts +2 -0
  697. package/es/shared/Context.js.map +1 -1
  698. package/es/shared/Eufemia.d.ts +1 -1
  699. package/es/shared/Eufemia.js +2 -2
  700. package/es/shared/Eufemia.js.map +1 -1
  701. package/es/shared/helpers/withCamelCaseProps.js.map +1 -1
  702. package/es/shared/helpers/withSnakeCaseProps.js.map +1 -1
  703. package/es/shared/libs/Shortcuts.js.map +1 -1
  704. package/es/shared/locales/en-GB.d.ts +1 -0
  705. package/es/shared/locales/en-GB.js +1 -0
  706. package/es/shared/locales/en-GB.js.map +1 -1
  707. package/es/shared/locales/en-US.d.ts +1 -0
  708. package/es/shared/locales/index.d.ts +2 -0
  709. package/es/shared/locales/nb-NO.d.ts +1 -0
  710. package/es/shared/locales/nb-NO.js +1 -0
  711. package/es/shared/locales/nb-NO.js.map +1 -1
  712. package/es/style/core/reset.scss +13 -3
  713. package/es/style/core/utilities.scss +3 -1
  714. package/es/style/dnb-ui-components.css +23 -18
  715. package/es/style/dnb-ui-components.min.css +1 -1
  716. package/es/style/dnb-ui-elements.css +6 -0
  717. package/es/style/dnb-ui-elements.min.css +1 -1
  718. package/es/style/dnb-ui-extensions.css +105 -29
  719. package/es/style/dnb-ui-extensions.min.css +1 -1
  720. package/es/style/themes/theme-eiendom/eiendom-theme-basis.css +6 -0
  721. package/es/style/themes/theme-eiendom/eiendom-theme-basis.min.css +1 -1
  722. package/es/style/themes/theme-eiendom/eiendom-theme-components.css +42 -24
  723. package/es/style/themes/theme-eiendom/eiendom-theme-components.min.css +3 -1
  724. package/es/style/themes/theme-eiendom/eiendom-theme-extensions.css +105 -29
  725. package/es/style/themes/theme-eiendom/eiendom-theme-extensions.min.css +1 -1
  726. package/es/style/themes/theme-sbanken/customisations.scss +0 -8
  727. package/es/style/themes/theme-sbanken/properties.js +6 -6
  728. package/es/style/themes/theme-sbanken/properties.js.map +1 -1
  729. package/es/style/themes/theme-sbanken/properties.scss +6 -6
  730. package/es/style/themes/theme-sbanken/sbanken-theme-basis.css +27 -26
  731. package/es/style/themes/theme-sbanken/sbanken-theme-basis.min.css +1 -1
  732. package/es/style/themes/theme-sbanken/sbanken-theme-components.css +236 -245
  733. package/es/style/themes/theme-sbanken/sbanken-theme-components.min.css +4 -2
  734. package/es/style/themes/theme-sbanken/sbanken-theme-components.scss +4 -3
  735. package/es/style/themes/theme-sbanken/sbanken-theme-elements.css +21 -2
  736. package/es/style/themes/theme-sbanken/sbanken-theme-elements.min.css +1 -1
  737. package/es/style/themes/theme-sbanken/sbanken-theme-extensions.css +105 -29
  738. package/es/style/themes/theme-sbanken/sbanken-theme-extensions.min.css +1 -1
  739. package/es/style/themes/theme-ui/fonts.scss +8 -4
  740. package/es/style/themes/theme-ui/ui-theme-basis.css +6 -0
  741. package/es/style/themes/theme-ui/ui-theme-basis.min.css +1 -1
  742. package/es/style/themes/theme-ui/ui-theme-components.css +42 -24
  743. package/es/style/themes/theme-ui/ui-theme-components.min.css +4 -2
  744. package/es/style/themes/theme-ui/ui-theme-elements.css +6 -0
  745. package/es/style/themes/theme-ui/ui-theme-elements.min.css +1 -1
  746. package/es/style/themes/theme-ui/ui-theme-extensions.css +105 -29
  747. package/es/style/themes/theme-ui/ui-theme-extensions.min.css +1 -1
  748. package/es/style/themes/theme-ui/ui-theme-tags.css +3 -0
  749. package/es/style/themes/theme-ui/ui-theme-tags.min.css +1 -1
  750. package/es/style/themes/theme-ui/ui-theme-tags.scss +9 -4
  751. package/esm/dnb-ui-basis.min.mjs +1 -1
  752. package/esm/dnb-ui-components.min.mjs +1 -1
  753. package/esm/dnb-ui-elements.min.mjs +1 -1
  754. package/esm/dnb-ui-extensions.min.mjs +6 -6
  755. package/esm/dnb-ui-lib.min.mjs +1 -1
  756. package/extensions/forms/DataContext/index.js.map +1 -1
  757. package/extensions/forms/Field/ArraySelection.d.ts +2 -1
  758. package/extensions/forms/Field/ArraySelection.js +49 -33
  759. package/extensions/forms/Field/ArraySelection.js.map +1 -1
  760. package/extensions/forms/Field/CountryCode.d.ts +10 -0
  761. package/extensions/forms/Field/CountryCode.js +68 -0
  762. package/extensions/forms/Field/CountryCode.js.map +1 -0
  763. package/extensions/forms/Field/Currency.d.ts +2 -2
  764. package/extensions/forms/Field/Currency.js +6 -38
  765. package/extensions/forms/Field/Currency.js.map +1 -1
  766. package/extensions/forms/Field/Date.d.ts +2 -2
  767. package/extensions/forms/Field/Date.js +11 -7
  768. package/extensions/forms/Field/Date.js.map +1 -1
  769. package/extensions/forms/Field/Number.d.ts +7 -3
  770. package/extensions/forms/Field/Number.js +44 -21
  771. package/extensions/forms/Field/Number.js.map +1 -1
  772. package/extensions/forms/Field/PhoneNumber.d.ts +7 -2
  773. package/extensions/forms/Field/PhoneNumber.js +43 -42
  774. package/extensions/forms/Field/PhoneNumber.js.map +1 -1
  775. package/extensions/forms/Field/PostalCodeAndCity.d.ts +1 -1
  776. package/extensions/forms/Field/PostalCodeAndCity.js.map +1 -1
  777. package/extensions/forms/Field/Selection.d.ts +6 -4
  778. package/extensions/forms/Field/Selection.js +87 -38
  779. package/extensions/forms/Field/Selection.js.map +1 -1
  780. package/extensions/forms/Field/String.d.ts +3 -3
  781. package/extensions/forms/Field/String.js +27 -13
  782. package/extensions/forms/Field/String.js.map +1 -1
  783. package/extensions/forms/Field/Toggle.js +11 -9
  784. package/extensions/forms/Field/Toggle.js.map +1 -1
  785. package/extensions/forms/Field/fields.scss +2 -2
  786. package/extensions/forms/Field/hooks/useField.d.ts +6 -8
  787. package/extensions/forms/Field/hooks/useField.js +34 -33
  788. package/extensions/forms/Field/hooks/useField.js.map +1 -1
  789. package/extensions/forms/Field/index.d.ts +2 -0
  790. package/extensions/forms/Field/index.js +3 -1
  791. package/extensions/forms/Field/index.js.map +1 -1
  792. package/extensions/forms/Field/style/dnb-array-selection.css +13 -0
  793. package/extensions/forms/Field/style/dnb-array-selection.min.css +1 -0
  794. package/extensions/forms/Field/style/dnb-array-selection.scss +15 -0
  795. package/extensions/forms/Field/style/dnb-country-code.css +12 -0
  796. package/extensions/forms/Field/style/dnb-country-code.min.css +1 -0
  797. package/extensions/forms/Field/style/dnb-country-code.scss +19 -0
  798. package/extensions/forms/Field/style/dnb-phone-number.css +3 -7
  799. package/extensions/forms/Field/style/dnb-phone-number.min.css +1 -1
  800. package/extensions/forms/Field/style/dnb-phone-number.scss +3 -8
  801. package/extensions/forms/Field/style/dnb-postal-code-and-city.css +5 -2
  802. package/extensions/forms/Field/style/dnb-postal-code-and-city.min.css +1 -1
  803. package/extensions/forms/Field/style/dnb-postal-code-and-city.scss +5 -1
  804. package/extensions/forms/Field/style/dnb-selection.css +5 -2
  805. package/extensions/forms/Field/style/dnb-selection.min.css +1 -1
  806. package/extensions/forms/Field/style/dnb-selection.scss +7 -1
  807. package/extensions/forms/Field/style/index.scss +2 -0
  808. package/extensions/forms/FieldBlock/FieldBlock.d.ts +3 -2
  809. package/extensions/forms/FieldBlock/FieldBlock.js +15 -10
  810. package/extensions/forms/FieldBlock/FieldBlock.js.map +1 -1
  811. package/extensions/forms/FieldBlock/index.js.map +1 -1
  812. package/extensions/forms/FieldBlock/style/dnb-field-block.css +31 -8
  813. package/extensions/forms/FieldBlock/style/dnb-field-block.min.css +1 -1
  814. package/extensions/forms/FieldBlock/style/dnb-field-block.scss +46 -13
  815. package/extensions/forms/FieldGroup/index.js.map +1 -1
  816. package/extensions/forms/Layout/Card.js +2 -2
  817. package/extensions/forms/Layout/Card.js.map +1 -1
  818. package/extensions/forms/Layout/FlexContainer.d.ts +1 -0
  819. package/extensions/forms/Layout/FlexContainer.js +3 -2
  820. package/extensions/forms/Layout/FlexContainer.js.map +1 -1
  821. package/extensions/forms/Layout/FlexItem.d.ts +1 -0
  822. package/extensions/forms/Layout/FlexItem.js +2 -1
  823. package/extensions/forms/Layout/FlexItem.js.map +1 -1
  824. package/extensions/forms/Layout/style/dnb-card.css +3 -3
  825. package/extensions/forms/Layout/style/dnb-card.min.css +1 -1
  826. package/extensions/forms/Layout/style/dnb-card.scss +6 -4
  827. package/extensions/forms/Layout/style/dnb-flex-container.css +9 -0
  828. package/extensions/forms/Layout/style/dnb-flex-container.min.css +1 -1
  829. package/extensions/forms/Layout/style/dnb-flex-container.scss +14 -0
  830. package/extensions/forms/Layout/style/dnb-flex-item.css +9 -0
  831. package/extensions/forms/Layout/style/dnb-flex-item.min.css +1 -1
  832. package/extensions/forms/Layout/style/dnb-flex-item.scss +14 -0
  833. package/extensions/forms/StepsLayout/StepsLayout.js +1 -1
  834. package/extensions/forms/StepsLayout/StepsLayout.js.map +1 -1
  835. package/extensions/forms/StepsLayout/style/dnb-steps-layout.css +11 -5
  836. package/extensions/forms/StepsLayout/style/dnb-steps-layout.min.css +1 -1
  837. package/extensions/forms/StepsLayout/style/dnb-steps-layout.scss +10 -3
  838. package/extensions/forms/ValueBlock/index.js.map +1 -1
  839. package/extensions/forms/field-types.d.ts +7 -1
  840. package/extensions/forms/field-types.js.map +1 -1
  841. package/extensions/forms/style/dnb-forms.css +105 -29
  842. package/extensions/forms/style/dnb-forms.min.css +1 -1
  843. package/extensions/forms/style/index.d.ts +1 -0
  844. package/extensions/forms/style/index.js +1 -0
  845. package/extensions/forms/style/index.js.map +1 -0
  846. package/extensions/forms/utils/TestElement/style/dnb-test-element.css +2 -2
  847. package/extensions/forms/utils/TestElement/style/dnb-test-element.min.css +1 -1
  848. package/extensions/forms/utils/TestElement/style/dnb-test-element.scss +2 -2
  849. package/extensions/forms/utils/useWasChanged.d.ts +5 -0
  850. package/extensions/forms/utils/useWasChanged.js +56 -0
  851. package/extensions/forms/utils/useWasChanged.js.map +1 -0
  852. package/extensions/forms/variables.scss +3 -0
  853. package/extensions/lib.d.ts +1 -0
  854. package/extensions/payment-card/PaymentCard.js.map +1 -1
  855. package/extensions/payment-card/utils/backgrounds/ung.js +1 -1
  856. package/extensions/payment-card/utils/backgrounds/ung.js.map +1 -1
  857. package/extensions/payment-card/utils/backgrounds/youth.js +1 -1
  858. package/extensions/payment-card/utils/backgrounds/youth.js.map +1 -1
  859. package/fragments/drawer-list/DrawerList.js +1 -1
  860. package/fragments/drawer-list/DrawerList.js.map +1 -1
  861. package/fragments/drawer-list/DrawerListPortal.js +2 -2
  862. package/fragments/drawer-list/DrawerListPortal.js.map +1 -1
  863. package/fragments/drawer-list/style/dnb-drawer-list.scss +3 -1
  864. package/package.json +1 -1
  865. package/shared/Context.d.ts +2 -0
  866. package/shared/Context.js.map +1 -1
  867. package/shared/Eufemia.d.ts +1 -1
  868. package/shared/Eufemia.js +2 -2
  869. package/shared/Eufemia.js.map +1 -1
  870. package/shared/helpers/withCamelCaseProps.js.map +1 -1
  871. package/shared/helpers/withSnakeCaseProps.js.map +1 -1
  872. package/shared/libs/Shortcuts.js.map +1 -1
  873. package/shared/locales/en-GB.d.ts +1 -0
  874. package/shared/locales/en-GB.js +1 -0
  875. package/shared/locales/en-GB.js.map +1 -1
  876. package/shared/locales/en-US.d.ts +1 -0
  877. package/shared/locales/index.d.ts +2 -0
  878. package/shared/locales/nb-NO.d.ts +1 -0
  879. package/shared/locales/nb-NO.js +1 -0
  880. package/shared/locales/nb-NO.js.map +1 -1
  881. package/style/core/reset.scss +13 -3
  882. package/style/core/utilities.scss +3 -1
  883. package/style/dnb-ui-components.css +23 -18
  884. package/style/dnb-ui-components.min.css +1 -1
  885. package/style/dnb-ui-elements.css +6 -0
  886. package/style/dnb-ui-elements.min.css +1 -1
  887. package/style/dnb-ui-extensions.css +105 -29
  888. package/style/dnb-ui-extensions.min.css +1 -1
  889. package/style/themes/theme-eiendom/eiendom-theme-basis.css +6 -0
  890. package/style/themes/theme-eiendom/eiendom-theme-basis.min.css +1 -1
  891. package/style/themes/theme-eiendom/eiendom-theme-components.css +42 -24
  892. package/style/themes/theme-eiendom/eiendom-theme-components.min.css +3 -1
  893. package/style/themes/theme-eiendom/eiendom-theme-extensions.css +105 -29
  894. package/style/themes/theme-eiendom/eiendom-theme-extensions.min.css +1 -1
  895. package/style/themes/theme-sbanken/customisations.scss +0 -8
  896. package/style/themes/theme-sbanken/properties.js +6 -6
  897. package/style/themes/theme-sbanken/properties.js.map +1 -1
  898. package/style/themes/theme-sbanken/properties.scss +6 -6
  899. package/style/themes/theme-sbanken/sbanken-theme-basis.css +27 -26
  900. package/style/themes/theme-sbanken/sbanken-theme-basis.min.css +1 -1
  901. package/style/themes/theme-sbanken/sbanken-theme-components.css +236 -245
  902. package/style/themes/theme-sbanken/sbanken-theme-components.min.css +4 -2
  903. package/style/themes/theme-sbanken/sbanken-theme-components.scss +4 -3
  904. package/style/themes/theme-sbanken/sbanken-theme-elements.css +21 -2
  905. package/style/themes/theme-sbanken/sbanken-theme-elements.min.css +1 -1
  906. package/style/themes/theme-sbanken/sbanken-theme-extensions.css +105 -29
  907. package/style/themes/theme-sbanken/sbanken-theme-extensions.min.css +1 -1
  908. package/style/themes/theme-ui/fonts.scss +8 -4
  909. package/style/themes/theme-ui/ui-theme-basis.css +6 -0
  910. package/style/themes/theme-ui/ui-theme-basis.min.css +1 -1
  911. package/style/themes/theme-ui/ui-theme-components.css +42 -24
  912. package/style/themes/theme-ui/ui-theme-components.min.css +4 -2
  913. package/style/themes/theme-ui/ui-theme-elements.css +6 -0
  914. package/style/themes/theme-ui/ui-theme-elements.min.css +1 -1
  915. package/style/themes/theme-ui/ui-theme-extensions.css +105 -29
  916. package/style/themes/theme-ui/ui-theme-extensions.min.css +1 -1
  917. package/style/themes/theme-ui/ui-theme-tags.css +3 -0
  918. package/style/themes/theme-ui/ui-theme-tags.min.css +1 -1
  919. package/style/themes/theme-ui/ui-theme-tags.scss +9 -4
  920. package/umd/dnb-ui-basis.min.js +1 -1
  921. package/umd/dnb-ui-components.min.js +1 -1
  922. package/umd/dnb-ui-elements.min.js +1 -1
  923. package/umd/dnb-ui-extensions.min.js +6 -6
  924. package/umd/dnb-ui-lib.min.js +1 -1
@@ -20,7 +20,7 @@ export const defaultProps = {
20
20
  backToText: 'Back to...',
21
21
  isCollapsed: true,
22
22
  styleType: 'transparent',
23
- collapsedStyleType: 'pistachio',
23
+ collapsedStyleType: 'info',
24
24
  spacing: false
25
25
  };
26
26
  const Breadcrumb = localProps => {
@@ -99,7 +99,7 @@ const Breadcrumb = localProps => {
99
99
  isCollapsed: false,
100
100
  noAnimation: noAnimation
101
101
  })), currentVariant === 'collapse' && React.createElement(Section, {
102
- style_type: collapsedStyleType,
102
+ variant: collapsedStyleType,
103
103
  className: "dnb-breadcrumb__collapse"
104
104
  }, React.createElement(BreadcrumbMultiple, {
105
105
  data: data,
@@ -1 +1 @@
1
- {"version":3,"file":"Breadcrumb.js","names":["React","useEffect","useState","classnames","createSkeletonClass","createSpacingClasses","Section","Button","useMediaQuery","Context","BreadcrumbItem","convertJsxToString","isTrue","validateDOMAttributes","extendPropsWithContext","BreadcrumbMultiple","defaultProps","skeleton","navText","goBackText","homeText","backToText","isCollapsed","styleType","collapsedStyleType","spacing","Breadcrumb","localProps","_context$translation","context","useContext","allProps","translation","className","children","items","variant","onClick","overrideIsCollapsed","noAnimation","data","href","props","_objectWithoutProperties","_excluded","skeletonClasses","spacingClasses","setCollapse","isSmallScreen","matchOnSSR","when","max","currentVariant","innerSpacing","createElement","_extends","style_type","text","icon","icon_position","Item"],"sources":["../../../../src/components/breadcrumb/Breadcrumb.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react'\nimport classnames from 'classnames'\n\n// Components\nimport { createSkeletonClass } from '../skeleton/SkeletonHelper'\nimport { createSpacingClasses } from '../space/SpacingHelper'\nimport Section, {\n SectionSpacing,\n SectionStyleTypes,\n} from '../section/Section'\nimport Button from '../button/Button'\n\n// Shared\nimport { useMediaQuery } from '../../shared'\nimport Context from '../../shared/Context'\nimport type { SpacingProps } from '../../shared/types'\nimport type { SkeletonShow } from '../skeleton/Skeleton'\n\n// Internal\nimport BreadcrumbItem, { BreadcrumbItemProps } from './BreadcrumbItem'\nimport {\n convertJsxToString,\n isTrue,\n validateDOMAttributes,\n extendPropsWithContext,\n} from '../../shared/component-helper'\nimport { BreadcrumbMultiple } from './BreadcrumbMultiple'\n\nexport interface BreadcrumbProps {\n /**\n * Custom className on the component root\n * Default: null\n */\n className?: string\n\n /**\n * Skeleton should be applied when loading content\n * Default: null\n */\n skeleton?: SkeletonShow\n\n /**\n * Pass in a list of your pages as objects of breadcrumbitem to render them as breadcrumbitems.\n * Default: null\n */\n data?: Array<BreadcrumbItemProps>\n\n /**\n * The content of the component. Can be used instead of prop \"data\".\n * Default: null\n */\n children?:\n | React.ReactElement<BreadcrumbItemProps>\n | Array<React.ReactElement<BreadcrumbItemProps>>\n\n /**\n * The variant of the component.\n * Default: When children and data is not defined, it defaults to \"single\". If they are defined, the variant depends on the viewport.\n */\n variant?: 'single' | 'multiple' | 'collapse'\n\n /**\n * Handle the click event on 'single'/'collapse'\n * Default: null\n */\n onClick?: React.MouseEventHandler<HTMLButtonElement>\n\n /**\n * For variant 'single', use href (or onClick) to set href when clicking \"Back\"\n * Default: null\n */\n href?: string\n\n /**\n * Every <nav> on a page needs an unique aria-label text\n * Default: Page hierarchy\n */\n navText?: React.ReactNode\n\n /**\n * Add custom 'Back' text for variant 'single'\n * Default: 'Back' or defined by Context translation\n */\n goBackText?: React.ReactNode\n\n /**\n * Add custom 'Home' text\n * Default: 'Home' or defined by Context translation\n */\n homeText?: React.ReactNode\n\n /**\n * Add custom 'Back to...' text, for variant collapse\n * Default 'Back to...' or defined by Context translation\n */\n backToText?: React.ReactNode\n\n /**\n * If variant='collapse', you can override isCollapsed for the collapsed content by updating this value.\n * Default: null\n */\n isCollapsed?: boolean\n\n /**\n * Use one of the Section component style types (style_type)\n * Default: transparent\n */\n styleType?: SectionStyleTypes\n\n /**\n * Use one of the Section component style types (style_type)\n * Default: pistachio\n */\n collapsedStyleType?: SectionStyleTypes\n\n /**\n * Include spacing properties from the Section component in breadcrumb. If only `true` is given, the spacing will be `small`.\n * Default: false\n */\n spacing?: SectionSpacing\n\n /**\n * Will disable the height animation\n * Default: false\n */\n noAnimation?: boolean\n}\n\nexport const defaultProps = {\n skeleton: false,\n navText: 'Back',\n goBackText: 'Back',\n homeText: 'Home',\n backToText: 'Back to...',\n isCollapsed: true,\n styleType: 'transparent',\n collapsedStyleType: 'pistachio',\n spacing: false,\n}\n\nconst Breadcrumb = (localProps: BreadcrumbProps & SpacingProps) => {\n // Every component should have a context\n const context = React.useContext(Context)\n\n // Extract additional props from global context\n const allProps = extendPropsWithContext(\n localProps,\n defaultProps,\n context?.translation?.Breadcrumb,\n context?.Breadcrumb,\n { skeleton: context?.skeleton }\n )\n\n const {\n className,\n skeleton,\n children: items,\n variant,\n onClick,\n navText, // has a translation in context\n goBackText, // has a translation in context\n homeText, // eslint-disable-line\n backToText, // has a translation in context\n styleType,\n collapsedStyleType,\n isCollapsed: overrideIsCollapsed,\n spacing,\n noAnimation,\n data,\n href,\n ...props\n } = allProps\n const skeletonClasses = createSkeletonClass('font', skeleton, context)\n const spacingClasses = createSpacingClasses(props)\n\n const [isCollapsed, setCollapse] = useState(overrideIsCollapsed)\n const isSmallScreen = useMediaQuery({\n matchOnSSR: true,\n when: { max: 'medium' },\n })\n\n let currentVariant = variant\n if (!variant) {\n if (items || data) {\n currentVariant = isSmallScreen ? 'collapse' : 'multiple'\n } else {\n currentVariant = 'single'\n }\n }\n\n useEffect(() => {\n setCollapse(overrideIsCollapsed)\n }, [overrideIsCollapsed])\n\n validateDOMAttributes(allProps, props)\n\n const innerSpacing = isTrue(spacing) ? 'small' : spacing\n\n return (\n <nav\n aria-label={convertJsxToString(navText)}\n className={classnames(\n 'dnb-breadcrumb',\n skeletonClasses,\n spacingClasses,\n className\n )}\n {...props}\n >\n <Section\n className=\"dnb-breadcrumb__bar\"\n style_type={styleType || 'transparent'}\n spacing={innerSpacing}\n >\n {currentVariant === 'collapse' && (\n <Button\n text={backToText}\n variant=\"tertiary\"\n icon=\"chevron_left\"\n icon_position=\"left\"\n onClick={\n onClick ||\n (() => {\n setCollapse(!isCollapsed)\n })\n }\n aria-expanded={!isCollapsed}\n />\n )}\n\n {currentVariant === 'single' && (\n <Button\n text={goBackText}\n variant=\"tertiary\"\n icon=\"chevron_left\"\n icon_position=\"left\"\n onClick={onClick}\n href={href}\n />\n )}\n\n {currentVariant === 'multiple' && (\n <BreadcrumbMultiple\n data={data}\n items={items}\n isCollapsed={false}\n noAnimation={noAnimation}\n />\n )}\n </Section>\n\n {currentVariant === 'collapse' && (\n <Section\n style_type={collapsedStyleType}\n className=\"dnb-breadcrumb__collapse\"\n >\n <BreadcrumbMultiple\n data={data}\n items={items}\n isCollapsed={isCollapsed}\n noAnimation={noAnimation}\n />\n </Section>\n )}\n </nav>\n )\n}\n\nBreadcrumb.Item = BreadcrumbItem\n\nexport { BreadcrumbItem }\n\nexport default Breadcrumb\n"],"mappings":"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"}
1
+ {"version":3,"file":"Breadcrumb.js","names":["React","useEffect","useState","classnames","createSkeletonClass","createSpacingClasses","Section","Button","useMediaQuery","Context","BreadcrumbItem","convertJsxToString","isTrue","validateDOMAttributes","extendPropsWithContext","BreadcrumbMultiple","defaultProps","skeleton","navText","goBackText","homeText","backToText","isCollapsed","styleType","collapsedStyleType","spacing","Breadcrumb","localProps","_context$translation","context","useContext","allProps","translation","className","children","items","variant","onClick","overrideIsCollapsed","noAnimation","data","href","props","_objectWithoutProperties","_excluded","skeletonClasses","spacingClasses","setCollapse","isSmallScreen","matchOnSSR","when","max","currentVariant","innerSpacing","createElement","_extends","style_type","text","icon","icon_position","Item"],"sources":["../../../../src/components/breadcrumb/Breadcrumb.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react'\nimport classnames from 'classnames'\n\n// Components\nimport { createSkeletonClass } from '../skeleton/SkeletonHelper'\nimport { createSpacingClasses } from '../space/SpacingHelper'\nimport Section, {\n SectionSpacing,\n SectionStyleTypes,\n} from '../section/Section'\nimport Button from '../button/Button'\n\n// Shared\nimport { useMediaQuery } from '../../shared'\nimport Context from '../../shared/Context'\nimport type { SpacingProps } from '../../shared/types'\nimport type { SkeletonShow } from '../skeleton/Skeleton'\n\n// Internal\nimport BreadcrumbItem, { BreadcrumbItemProps } from './BreadcrumbItem'\nimport {\n convertJsxToString,\n isTrue,\n validateDOMAttributes,\n extendPropsWithContext,\n} from '../../shared/component-helper'\nimport { BreadcrumbMultiple } from './BreadcrumbMultiple'\n\nexport interface BreadcrumbProps {\n /**\n * Custom className on the component root\n * Default: null\n */\n className?: string\n\n /**\n * Skeleton should be applied when loading content\n * Default: null\n */\n skeleton?: SkeletonShow\n\n /**\n * Pass in a list of your pages as objects of breadcrumbitem to render them as breadcrumbitems.\n * Default: null\n */\n data?: Array<BreadcrumbItemProps>\n\n /**\n * The content of the component. Can be used instead of prop \"data\".\n * Default: null\n */\n children?:\n | React.ReactElement<BreadcrumbItemProps>\n | Array<React.ReactElement<BreadcrumbItemProps>>\n\n /**\n * The variant of the component.\n * Default: When children and data is not defined, it defaults to \"single\". If they are defined, the variant depends on the viewport.\n */\n variant?: 'single' | 'multiple' | 'collapse'\n\n /**\n * Handle the click event on 'single'/'collapse'\n * Default: null\n */\n onClick?: React.MouseEventHandler<HTMLButtonElement>\n\n /**\n * For variant 'single', use href (or onClick) to set href when clicking \"Back\"\n * Default: null\n */\n href?: string\n\n /**\n * Every <nav> on a page needs an unique aria-label text\n * Default: Page hierarchy\n */\n navText?: React.ReactNode\n\n /**\n * Add custom 'Back' text for variant 'single'\n * Default: 'Back' or defined by Context translation\n */\n goBackText?: React.ReactNode\n\n /**\n * Add custom 'Home' text\n * Default: 'Home' or defined by Context translation\n */\n homeText?: React.ReactNode\n\n /**\n * Add custom 'Back to...' text, for variant collapse\n * Default 'Back to...' or defined by Context translation\n */\n backToText?: React.ReactNode\n\n /**\n * If variant='collapse', you can override isCollapsed for the collapsed content by updating this value.\n * Default: null\n */\n isCollapsed?: boolean\n\n /**\n * Use one of the Section component style types (style_type)\n * Default: transparent\n */\n styleType?: SectionStyleTypes\n\n /**\n * Use one of the Section component style types (style_type)\n * Default: pistachio\n */\n collapsedStyleType?: SectionStyleTypes\n\n /**\n * Include spacing properties from the Section component in breadcrumb. If only `true` is given, the spacing will be `small`.\n * Default: false\n */\n spacing?: SectionSpacing\n\n /**\n * Will disable the height animation\n * Default: false\n */\n noAnimation?: boolean\n}\n\nexport const defaultProps = {\n skeleton: false,\n navText: 'Back',\n goBackText: 'Back',\n homeText: 'Home',\n backToText: 'Back to...',\n isCollapsed: true,\n styleType: 'transparent',\n collapsedStyleType: 'info',\n spacing: false,\n}\n\nconst Breadcrumb = (localProps: BreadcrumbProps & SpacingProps) => {\n // Every component should have a context\n const context = React.useContext(Context)\n\n // Extract additional props from global context\n const allProps = extendPropsWithContext(\n localProps,\n defaultProps,\n context?.translation?.Breadcrumb,\n context?.Breadcrumb,\n { skeleton: context?.skeleton }\n )\n\n const {\n className,\n skeleton,\n children: items,\n variant,\n onClick,\n navText, // has a translation in context\n goBackText, // has a translation in context\n homeText, // eslint-disable-line\n backToText, // has a translation in context\n styleType,\n collapsedStyleType,\n isCollapsed: overrideIsCollapsed,\n spacing,\n noAnimation,\n data,\n href,\n ...props\n } = allProps\n const skeletonClasses = createSkeletonClass('font', skeleton, context)\n const spacingClasses = createSpacingClasses(props)\n\n const [isCollapsed, setCollapse] = useState(overrideIsCollapsed)\n const isSmallScreen = useMediaQuery({\n matchOnSSR: true,\n when: { max: 'medium' },\n })\n\n let currentVariant = variant\n if (!variant) {\n if (items || data) {\n currentVariant = isSmallScreen ? 'collapse' : 'multiple'\n } else {\n currentVariant = 'single'\n }\n }\n\n useEffect(() => {\n setCollapse(overrideIsCollapsed)\n }, [overrideIsCollapsed])\n\n validateDOMAttributes(allProps, props)\n\n const innerSpacing = isTrue(spacing) ? 'small' : spacing\n\n return (\n <nav\n aria-label={convertJsxToString(navText)}\n className={classnames(\n 'dnb-breadcrumb',\n skeletonClasses,\n spacingClasses,\n className\n )}\n {...props}\n >\n <Section\n className=\"dnb-breadcrumb__bar\"\n style_type={styleType || 'transparent'}\n spacing={innerSpacing}\n >\n {currentVariant === 'collapse' && (\n <Button\n text={backToText}\n variant=\"tertiary\"\n icon=\"chevron_left\"\n icon_position=\"left\"\n onClick={\n onClick ||\n (() => {\n setCollapse(!isCollapsed)\n })\n }\n aria-expanded={!isCollapsed}\n />\n )}\n\n {currentVariant === 'single' && (\n <Button\n text={goBackText}\n variant=\"tertiary\"\n icon=\"chevron_left\"\n icon_position=\"left\"\n onClick={onClick}\n href={href}\n />\n )}\n\n {currentVariant === 'multiple' && (\n <BreadcrumbMultiple\n data={data}\n items={items}\n isCollapsed={false}\n noAnimation={noAnimation}\n />\n )}\n </Section>\n\n {currentVariant === 'collapse' && (\n <Section\n variant={collapsedStyleType}\n className=\"dnb-breadcrumb__collapse\"\n >\n <BreadcrumbMultiple\n data={data}\n items={items}\n isCollapsed={isCollapsed}\n noAnimation={noAnimation}\n />\n </Section>\n )}\n </nav>\n )\n}\n\nBreadcrumb.Item = BreadcrumbItem\n\nexport { BreadcrumbItem }\n\nexport default Breadcrumb\n"],"mappings":"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"}
@@ -6,6 +6,7 @@ import Button from '../button/Button';
6
6
  import IconPrimary from '../icon-primary/IconPrimary';
7
7
  import P from '../../elements/P';
8
8
  import homeIcon from '../../icons/home';
9
+ import { useTheme, useMediaQuery } from '../../shared';
9
10
  import Context from '../../shared/Context';
10
11
  import { extendPropsWithContext } from '../../shared/component-helper';
11
12
  const defaultProps = {
@@ -16,6 +17,17 @@ const defaultProps = {
16
17
  variant: null,
17
18
  skeleton: null
18
19
  };
20
+ const determineSbankenIcon = (variant, isSmallScreen) => {
21
+ switch (variant) {
22
+ case 'home':
23
+ return homeIcon;
24
+ case 'single':
25
+ case 'collapse':
26
+ return 'chevron_left';
27
+ default:
28
+ return isSmallScreen ? 'chevron_left' : 'chevron_right';
29
+ }
30
+ };
19
31
  const BreadcrumbItem = localProps => {
20
32
  const context = React.useContext(Context);
21
33
  const {
@@ -36,7 +48,17 @@ const BreadcrumbItem = localProps => {
36
48
  itemNr
37
49
  } = _extendPropsWithConte,
38
50
  props = _objectWithoutProperties(_extendPropsWithConte, _excluded);
39
- const currentIcon = icon || variant === 'home' && homeIcon || 'chevron_left';
51
+ const theme = useTheme();
52
+ const isSmallScreen = useMediaQuery({
53
+ matchOnSSR: true,
54
+ when: {
55
+ max: 'medium'
56
+ }
57
+ });
58
+ let currentIcon = icon || variant === 'home' && homeIcon || 'chevron_left';
59
+ if ((theme === null || theme === void 0 ? void 0 : theme.name) === 'sbanken') {
60
+ currentIcon = icon || determineSbankenIcon(variant, isSmallScreen);
61
+ }
40
62
  const currentText = text || variant === 'home' && homeText || '';
41
63
  const isInteractive = (href || onClick) && variant !== 'current';
42
64
  const style = {
@@ -1 +1 @@
1
- {"version":3,"file":"BreadcrumbItem.js","names":["React","Button","IconPrimary","P","homeIcon","Context","extendPropsWithContext","defaultProps","text","href","icon","onClick","variant","skeleton","BreadcrumbItem","localProps","context","useContext","translation","Breadcrumb","homeText","_extendPropsWithConte","itemNr","props","_objectWithoutProperties","_excluded","currentIcon","currentText","isInteractive","style","String","createElement","className","undefined","_extends","icon_position","on_click","left"],"sources":["../../../../src/components/breadcrumb/BreadcrumbItem.tsx"],"sourcesContent":["import React from 'react'\n\n// Components\nimport Button from '../button/Button'\nimport IconPrimary from '../icon-primary/IconPrimary'\nimport type { IconIcon } from '../icon/Icon'\n\n// Elements\nimport P from '../../elements/P'\n\n// Icons\nimport homeIcon from '../../icons/home'\n\n// Shared\nimport Context from '../../shared/Context'\nimport type { SkeletonShow } from '../skeleton/Skeleton'\nimport { extendPropsWithContext } from '../../shared/component-helper'\n\nexport interface BreadcrumbItemProps {\n /**\n * Text displaying the title of the item's corresponding page\n * Default: If variant='home', default is \"Home\". Otherwise it is required.\n */\n text?: React.ReactNode\n\n /**\n * Icon displaying on the left side\n * Default: HomeIcon / chevron_left\n */\n icon?: IconIcon\n\n /**\n * Href should be the link to the item's corresponding page.\n * Default: null\n */\n href?: string\n\n /**\n * Set a custom click event. In this case, you should not define the prop href.\n * Default: null\n */\n onClick?: React.MouseEventHandler<HTMLButtonElement>\n\n /**\n * The component variant. Variant 'current' should correspond to the current page and 'home' to the root page.\n * Default: null\n */\n variant?: 'home' | 'previous' | 'current'\n\n /**\n * Skeleton should be applied when loading content\n * Default: null\n */\n skeleton?: SkeletonShow\n\n /** Internal */\n itemNr?: number\n}\n\nconst defaultProps = {\n text: null,\n href: null,\n icon: null,\n onClick: null,\n variant: null,\n skeleton: null,\n}\n\nconst BreadcrumbItem = (localProps: BreadcrumbItemProps) => {\n // Every component should have a context\n const context = React.useContext(Context)\n const {\n translation: {\n Breadcrumb: { homeText },\n },\n } = context\n\n // Extract additional props from global context\n const {\n text,\n href,\n icon,\n onClick,\n variant,\n skeleton,\n itemNr,\n ...props\n } = extendPropsWithContext(\n localProps,\n defaultProps,\n context?.BreadcrumbItem\n )\n\n const currentIcon: IconIcon =\n icon || (variant === 'home' && homeIcon) || 'chevron_left'\n const currentText = text || (variant === 'home' && homeText) || ''\n const isInteractive = (href || onClick) && variant !== 'current'\n const style = { '--delay': String(itemNr) } as React.CSSProperties\n\n return (\n <li\n className=\"dnb-breadcrumb__item\"\n aria-current={variant === 'current' ? 'page' : undefined}\n style={style}\n >\n {isInteractive ? (\n <Button\n variant=\"tertiary\"\n href={href}\n icon={currentIcon}\n icon_position=\"left\"\n on_click={onClick}\n text={currentText}\n skeleton={skeleton}\n {...props}\n />\n ) : (\n <span className=\"dnb-breadcrumb__item__span\" {...props}>\n <IconPrimary\n icon={currentIcon}\n className=\"dnb-breadcrumb__item__span__icon\"\n />\n <P left=\"0\">{currentText}</P>\n </span>\n )}\n </li>\n )\n}\n\nexport default BreadcrumbItem\n"],"mappings":";;;AAAA,OAAOA,KAAK,MAAM,OAAO;AAGzB,OAAOC,MAAM,MAAM,kBAAkB;AACrC,OAAOC,WAAW,MAAM,6BAA6B;AAIrD,OAAOC,CAAC,MAAM,kBAAkB;AAGhC,OAAOC,QAAQ,MAAM,kBAAkB;AAGvC,OAAOC,OAAO,MAAM,sBAAsB;AAE1C,SAASC,sBAAsB,QAAQ,+BAA+B;AA2CtE,MAAMC,YAAY,GAAG;EACnBC,IAAI,EAAE,IAAI;EACVC,IAAI,EAAE,IAAI;EACVC,IAAI,EAAE,IAAI;EACVC,OAAO,EAAE,IAAI;EACbC,OAAO,EAAE,IAAI;EACbC,QAAQ,EAAE;AACZ,CAAC;AAED,MAAMC,cAAc,GAAIC,UAA+B,IAAK;EAE1D,MAAMC,OAAO,GAAGhB,KAAK,CAACiB,UAAU,CAACZ,OAAO,CAAC;EACzC,MAAM;IACJa,WAAW,EAAE;MACXC,UAAU,EAAE;QAAEC;MAAS;IACzB;EACF,CAAC,GAAGJ,OAAO;EAGX,MAAAK,qBAAA,GASIf,sBAAsB,CACxBS,UAAU,EACVR,YAAY,EACZS,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEF,cACX,CAAC;IAbK;MACJN,IAAI;MACJC,IAAI;MACJC,IAAI;MACJC,OAAO;MACPC,OAAO;MACPC,QAAQ;MACRS;IAEF,CAAC,GAAAD,qBAAA;IADIE,KAAK,GAAAC,wBAAA,CAAAH,qBAAA,EAAAI,SAAA;EAOV,MAAMC,WAAqB,GACzBhB,IAAI,IAAKE,OAAO,KAAK,MAAM,IAAIR,QAAS,IAAI,cAAc;EAC5D,MAAMuB,WAAW,GAAGnB,IAAI,IAAKI,OAAO,KAAK,MAAM,IAAIQ,QAAS,IAAI,EAAE;EAClE,MAAMQ,aAAa,GAAG,CAACnB,IAAI,IAAIE,OAAO,KAAKC,OAAO,KAAK,SAAS;EAChE,MAAMiB,KAAK,GAAG;IAAE,SAAS,EAAEC,MAAM,CAACR,MAAM;EAAE,CAAwB;EAElE,OACEtB,KAAA,CAAA+B,aAAA;IACEC,SAAS,EAAC,sBAAsB;IAChC,gBAAcpB,OAAO,KAAK,SAAS,GAAG,MAAM,GAAGqB,SAAU;IACzDJ,KAAK,EAAEA;EAAM,GAEZD,aAAa,GACZ5B,KAAA,CAAA+B,aAAA,CAAC9B,MAAM,EAAAiC,QAAA;IACLtB,OAAO,EAAC,UAAU;IAClBH,IAAI,EAAEA,IAAK;IACXC,IAAI,EAAEgB,WAAY;IAClBS,aAAa,EAAC,MAAM;IACpBC,QAAQ,EAAEzB,OAAQ;IAClBH,IAAI,EAAEmB,WAAY;IAClBd,QAAQ,EAAEA;EAAS,GACfU,KAAK,CACV,CAAC,GAEFvB,KAAA,CAAA+B,aAAA,SAAAG,QAAA;IAAMF,SAAS,EAAC;EAA4B,GAAKT,KAAK,GACpDvB,KAAA,CAAA+B,aAAA,CAAC7B,WAAW;IACVQ,IAAI,EAAEgB,WAAY;IAClBM,SAAS,EAAC;EAAkC,CAC7C,CAAC,EACFhC,KAAA,CAAA+B,aAAA,CAAC5B,CAAC;IAACkC,IAAI,EAAC;EAAG,GAAEV,WAAe,CACxB,CAEN,CAAC;AAET,CAAC;AAED,eAAeb,cAAc"}
1
+ {"version":3,"file":"BreadcrumbItem.js","names":["React","Button","IconPrimary","P","homeIcon","useTheme","useMediaQuery","Context","extendPropsWithContext","defaultProps","text","href","icon","onClick","variant","skeleton","determineSbankenIcon","isSmallScreen","BreadcrumbItem","localProps","context","useContext","translation","Breadcrumb","homeText","_extendPropsWithConte","itemNr","props","_objectWithoutProperties","_excluded","theme","matchOnSSR","when","max","currentIcon","name","currentText","isInteractive","style","String","createElement","className","undefined","_extends","icon_position","on_click","left"],"sources":["../../../../src/components/breadcrumb/BreadcrumbItem.tsx"],"sourcesContent":["import React from 'react'\n\n// Components\nimport Button from '../button/Button'\nimport IconPrimary from '../icon-primary/IconPrimary'\nimport type { IconIcon } from '../icon/Icon'\n\n// Elements\nimport P from '../../elements/P'\n\n// Icons\nimport homeIcon from '../../icons/home'\n\n// Shared\nimport { useTheme, useMediaQuery } from '../../shared'\nimport Context from '../../shared/Context'\nimport type { SkeletonShow } from '../skeleton/Skeleton'\nimport { extendPropsWithContext } from '../../shared/component-helper'\n\nexport interface BreadcrumbItemProps {\n /**\n * Text displaying the title of the item's corresponding page\n * Default: If variant='home', default is \"Home\". Otherwise it is required.\n */\n text?: React.ReactNode\n\n /**\n * Icon displaying on the left side\n * Default: HomeIcon / chevron_left\n */\n icon?: IconIcon\n\n /**\n * Href should be the link to the item's corresponding page.\n * Default: null\n */\n href?: string\n\n /**\n * Set a custom click event. In this case, you should not define the prop href.\n * Default: null\n */\n onClick?: React.MouseEventHandler<HTMLButtonElement>\n\n /**\n * The component variant. Variant 'current' should correspond to the current page and 'home' to the root page.\n * Default: null\n */\n variant?: 'home' | 'previous' | 'current'\n\n /**\n * Skeleton should be applied when loading content\n * Default: null\n */\n skeleton?: SkeletonShow\n\n /** Internal */\n itemNr?: number\n}\n\nconst defaultProps = {\n text: null,\n href: null,\n icon: null,\n onClick: null,\n variant: null,\n skeleton: null,\n}\n\nconst determineSbankenIcon: IconIcon = (\n variant: string,\n isSmallScreen: boolean\n) => {\n switch (variant) {\n case 'home':\n return homeIcon\n case 'single':\n case 'collapse':\n return 'chevron_left'\n default:\n return isSmallScreen ? 'chevron_left' : 'chevron_right'\n }\n}\n\nconst BreadcrumbItem = (localProps: BreadcrumbItemProps) => {\n // Every component should have a context\n const context = React.useContext(Context)\n const {\n translation: {\n Breadcrumb: { homeText },\n },\n } = context\n\n // Extract additional props from global context\n const {\n text,\n href,\n icon,\n onClick,\n variant,\n skeleton,\n itemNr,\n ...props\n } = extendPropsWithContext(\n localProps,\n defaultProps,\n context?.BreadcrumbItem\n )\n\n const theme = useTheme()\n const isSmallScreen = useMediaQuery({\n matchOnSSR: true,\n when: { max: 'medium' },\n })\n\n let currentIcon =\n icon || (variant === 'home' && homeIcon) || 'chevron_left'\n if (theme?.name === 'sbanken') {\n currentIcon = icon || determineSbankenIcon(variant, isSmallScreen)\n }\n const currentText = text || (variant === 'home' && homeText) || ''\n const isInteractive = (href || onClick) && variant !== 'current'\n const style = { '--delay': String(itemNr) } as React.CSSProperties\n\n return (\n <li\n className=\"dnb-breadcrumb__item\"\n aria-current={variant === 'current' ? 'page' : undefined}\n style={style}\n >\n {isInteractive ? (\n <Button\n variant=\"tertiary\"\n href={href}\n icon={currentIcon}\n icon_position=\"left\"\n on_click={onClick}\n text={currentText}\n skeleton={skeleton}\n {...props}\n />\n ) : (\n <span className=\"dnb-breadcrumb__item__span\" {...props}>\n <IconPrimary\n icon={currentIcon}\n className=\"dnb-breadcrumb__item__span__icon\"\n />\n <P left=\"0\">{currentText}</P>\n </span>\n )}\n </li>\n )\n}\n\nexport default BreadcrumbItem\n"],"mappings":"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"}
@@ -0,0 +1,23 @@
1
+ /*
2
+ * Sbanken Breadcrumb theme
3
+ *
4
+ */
5
+ /*
6
+ * Utilities
7
+ */
8
+ .dnb-breadcrumb .dnb-button__text {
9
+ font-weight: var(--font-weight-medium);
10
+ color: var(--sb-color-text);
11
+ }
12
+ .dnb-breadcrumb__item__span__icon {
13
+ color: var(--sb-color-violet);
14
+ }
15
+ .dnb-breadcrumb__item__span .dnb-p {
16
+ color: var(--sb-color-gray-dark-3);
17
+ }
18
+ .dnb-breadcrumb__item:not(:last-of-type) .dnb-button.dnb-button--has-text {
19
+ font-weight: var(--font-weight-medium);
20
+ }
21
+ .dnb-breadcrumb__item:not(:last-of-type) .dnb-button.dnb-button--has-text .dnb-button__text {
22
+ color: var(--sb-color-text);
23
+ }
@@ -0,0 +1 @@
1
+ .dnb-breadcrumb .dnb-button__text{color:var(--sb-color-text);font-weight:var(--font-weight-medium)}.dnb-breadcrumb__item__span__icon{color:var(--sb-color-violet)}.dnb-breadcrumb__item__span .dnb-p{color:var(--sb-color-gray-dark-3)}.dnb-breadcrumb__item:not(:last-of-type) .dnb-button.dnb-button--has-text{font-weight:var(--font-weight-medium)}.dnb-breadcrumb__item:not(:last-of-type) .dnb-button.dnb-button--has-text .dnb-button__text{color:var(--sb-color-text)}
@@ -0,0 +1,33 @@
1
+ /*
2
+ * Sbanken Breadcrumb theme
3
+ *
4
+ */
5
+
6
+ @import '../../../../style/core/utilities.scss';
7
+
8
+ .dnb-breadcrumb {
9
+ .dnb-button {
10
+ &__text {
11
+ font-weight: var(--font-weight-medium);
12
+ color: var(--sb-color-text);
13
+ }
14
+ }
15
+ &__item {
16
+ &__span {
17
+ &__icon {
18
+ color: var(--sb-color-violet);
19
+ }
20
+ .dnb-p {
21
+ color: var(--sb-color-gray-dark-3);
22
+ }
23
+ }
24
+ }
25
+ &__item:not(:last-of-type) {
26
+ .dnb-button.dnb-button--has-text {
27
+ font-weight: var(--font-weight-medium);
28
+ .dnb-button__text {
29
+ color: var(--sb-color-text);
30
+ }
31
+ }
32
+ }
33
+ }
@@ -77,7 +77,9 @@
77
77
  var(--color-mint-green-50)
78
78
  );
79
79
  }
80
- &--secondary:not(#{&}--has-text):not(#{&}--input-button)#{&}--size-large {
80
+ &--secondary:not(#{&}--has-text):not(
81
+ #{&}--input-button
82
+ )#{&}--size-large {
81
83
  // Make exception for icon button as it should be smaller than the original large button
82
84
  width: calc(var(--button-width--large) - 0.5rem);
83
85
  line-height: calc(var(--button-height--large) - 0.5rem);
@@ -82,6 +82,10 @@ export interface CheckboxProps
82
82
  */
83
83
  on_change?: (...args: any[]) => any;
84
84
  on_state_update?: (...args: any[]) => any;
85
+ /**
86
+ * By providing a React.ref we can get the internally used input element (DOM). E.g. `innerRef={myRef}` by using `React.createRef()` or `React.useRef()`.
87
+ */
88
+ innerRef?: React.Ref;
85
89
  }
86
90
  export default class Checkbox extends React.Component<CheckboxProps, any> {
87
91
  static defaultProps: object;
@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
3
3
  import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
4
4
  var _AlignmentHelper, _span;
5
- const _excluded = ["value", "status", "status_state", "status_props", "status_no_animation", "globalStatus", "suffix", "size", "label", "label_position", "label_sr_only", "title", "element", "disabled", "readOnly", "skeleton", "className", "class", "id", "checked", "children", "on_change", "on_state_update"],
5
+ const _excluded = ["value", "status", "status_state", "status_props", "status_no_animation", "globalStatus", "suffix", "size", "label", "label_position", "label_sr_only", "title", "element", "disabled", "readOnly", "skeleton", "className", "class", "id", "checked", "children", "on_change", "on_state_update", "innerRef"],
6
6
  _excluded2 = ["size"];
7
7
  function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
8
8
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -64,7 +64,7 @@ export default class Checkbox extends React.PureComponent {
64
64
  this._refInput.current.focus();
65
65
  }
66
66
  });
67
- this._refInput = React.createRef();
67
+ this._refInput = props.innerRef || React.createRef();
68
68
  this._id = props.id || makeUniqueId();
69
69
  this.state = {
70
70
  _listenForPropChanges: true
@@ -97,7 +97,8 @@ export default class Checkbox extends React.PureComponent {
97
97
  checked: _checked,
98
98
  children,
99
99
  on_change,
100
- on_state_update
100
+ on_state_update,
101
+ innerRef
101
102
  } = props,
102
103
  rest = _objectWithoutProperties(props, _excluded);
103
104
  const {
@@ -223,7 +224,8 @@ process.env.NODE_ENV !== "production" ? Checkbox.propTypes = _objectSpread(_obje
223
224
  attributes: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
224
225
  readOnly: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
225
226
  skeleton: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
226
- class: PropTypes.string
227
+ class: PropTypes.string,
228
+ innerRef: PropTypes.object
227
229
  }, spacingPropTypes), {}, {
228
230
  className: PropTypes.string,
229
231
  children: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),
@@ -1 +1 @@
1
- {"version":3,"file":"Checkbox.js","names":["React","PropTypes","classnames","keycode","isTrue","makeUniqueId","extendPropsWithContextInClassComponent","validateDOMAttributes","getStatusState","combineDescribedBy","dispatchCustomElementEvent","AlignmentHelper","spacingPropTypes","createSpacingClasses","skeletonDOMAttributes","createSkeletonClass","includeValidProps","Context","Suffix","FormLabel","FormStatus","Checkbox","PureComponent","getDerivedStateFromProps","props","state","_listenForPropChanges","checked","_checked","parseChecked","__checked","constructor","_defineProperty","event","onChangeHandler","readOnly","preventDefault","setState","_refInput","current","focus","createRef","_id","id","render","defaultProps","skeleton","context","getTranslation","FormRow","value","status","status_state","status_props","status_no_animation","globalStatus","suffix","size","label","label_position","label_sr_only","title","element","disabled","className","class","_className","children","on_change","on_state_update","rest","_objectWithoutProperties","_excluded","showStatus","mainParams","inputParams","_objectSpread","statusComp","createElement","_extends","show","text_id","width_selector","text","no_animation","Element","for_id","sr_only","_AlignmentHelper","name","type","onChange","onKeyDown","onKeyDownHandler","ref","_span","CheckIcon","attributes","test","String","process","env","NODE_ENV","propTypes","oneOfType","string","func","node","oneOf","bool","object","shape","message","_ref","_excluded2","vB","width","height","viewBox","fill","d","stroke","strokeWidth","strokeLinecap","strokeLinejoin"],"sources":["../../../../src/components/checkbox/Checkbox.js"],"sourcesContent":["/**\n * Web Checkbox Component\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport classnames from 'classnames'\nimport keycode from 'keycode'\nimport {\n isTrue,\n makeUniqueId,\n extendPropsWithContextInClassComponent,\n validateDOMAttributes,\n getStatusState,\n combineDescribedBy,\n dispatchCustomElementEvent,\n} from '../../shared/component-helper'\nimport AlignmentHelper from '../../shared/AlignmentHelper'\nimport {\n spacingPropTypes,\n createSpacingClasses,\n} from '../space/SpacingHelper'\nimport {\n skeletonDOMAttributes,\n createSkeletonClass,\n} from '../skeleton/SkeletonHelper'\nimport { includeValidProps } from '../form-row/FormRowHelpers'\n\nimport Context from '../../shared/Context'\nimport Suffix from '../../shared/helpers/Suffix'\nimport FormLabel from '../form-label/FormLabel'\nimport FormStatus from '../form-status/FormStatus'\n\n/**\n * The checkbox component is our enhancement of the classic checkbox button. It acts like a checkbox. Example: On/off, yes/no.\n */\nexport default class Checkbox extends React.PureComponent {\n static contextType = Context\n\n static propTypes = {\n label: PropTypes.oneOfType([\n PropTypes.string,\n PropTypes.func,\n PropTypes.node,\n ]),\n label_position: PropTypes.oneOf(['left', 'right']),\n label_sr_only: PropTypes.bool,\n title: PropTypes.string,\n element: PropTypes.node,\n checked: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n disabled: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n id: PropTypes.string,\n size: PropTypes.oneOf(['default', 'medium', 'large']),\n status: PropTypes.oneOfType([\n PropTypes.string,\n PropTypes.bool,\n PropTypes.func,\n PropTypes.node,\n ]),\n status_state: PropTypes.string,\n status_props: PropTypes.object,\n status_no_animation: PropTypes.oneOfType([\n PropTypes.string,\n PropTypes.bool,\n ]),\n globalStatus: PropTypes.shape({\n id: PropTypes.string,\n message: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n }),\n suffix: PropTypes.oneOfType([\n PropTypes.string,\n PropTypes.func,\n PropTypes.node,\n ]),\n value: PropTypes.string,\n attributes: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),\n readOnly: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n skeleton: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n class: PropTypes.string,\n\n ...spacingPropTypes,\n\n className: PropTypes.string,\n children: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),\n\n on_change: PropTypes.func,\n on_state_update: PropTypes.func,\n }\n\n static defaultProps = {\n label: null,\n label_position: null,\n label_sr_only: null,\n title: null,\n element: 'input',\n checked: null,\n disabled: null,\n id: null,\n size: null,\n status: null,\n status_state: 'error',\n status_props: null,\n status_no_animation: null,\n globalStatus: null,\n suffix: null,\n value: null,\n attributes: null,\n readOnly: false,\n skeleton: null,\n class: null,\n\n className: null,\n children: null,\n\n on_change: null,\n on_state_update: null,\n }\n\n static parseChecked = (state) => /true|on/.test(String(state))\n\n static getDerivedStateFromProps(props, state) {\n if (state._listenForPropChanges) {\n if (props.checked !== state._checked) {\n state.checked = Checkbox.parseChecked(props.checked)\n }\n }\n state._listenForPropChanges = true\n\n if (state.checked !== state.__checked) {\n dispatchCustomElementEvent({ props }, 'on_state_update', {\n checked: state.checked,\n })\n }\n\n state._checked = props.checked\n state.__checked = state.checked\n\n return state\n }\n\n constructor(props) {\n super(props)\n this._refInput = React.createRef()\n this._id = props.id || makeUniqueId() // cause we need an id anyway\n this.state = {\n _listenForPropChanges: true,\n }\n }\n\n onKeyDownHandler = (event) => {\n switch (keycode(event)) {\n case 'enter':\n this.onChangeHandler(event)\n break\n }\n }\n\n onChangeHandler = (event) => {\n if (isTrue(this.props.readOnly)) {\n return event.preventDefault()\n }\n const checked = !this.state.checked\n this.setState({ checked, _listenForPropChanges: false })\n dispatchCustomElementEvent(this, 'on_change', { checked, event })\n\n // help firefox and safari to have an correct state after a click\n if (this._refInput.current) {\n this._refInput.current.focus()\n }\n }\n\n render() {\n // use only the props from context, who are available here anyway\n const props = extendPropsWithContextInClassComponent(\n this.props,\n Checkbox.defaultProps,\n { skeleton: this.context && this.context.skeleton },\n this.context.getTranslation(this.props).Checkbox,\n includeValidProps(this.context.FormRow),\n this.context.Checkbox\n )\n\n const {\n value,\n status,\n status_state,\n status_props,\n status_no_animation,\n globalStatus,\n suffix,\n size,\n label,\n label_position,\n label_sr_only,\n title,\n element,\n disabled,\n readOnly,\n skeleton,\n className,\n class: _className,\n\n id: _id, // eslint-disable-line\n checked: _checked, // eslint-disable-line\n children, // eslint-disable-line\n on_change, // eslint-disable-line\n on_state_update, // eslint-disable-line\n\n ...rest\n } = props\n\n const { checked } = this.state\n\n const id = this._id\n const showStatus = getStatusState(status)\n\n const mainParams = {\n className: classnames(\n 'dnb-checkbox',\n status && `dnb-checkbox__status--${status_state}`,\n size && `dnb-checkbox--${size}`,\n label &&\n `dnb-checkbox--label-position-${label_position || 'right'}`,\n 'dnb-form-component',\n createSkeletonClass(null, skeleton),\n createSpacingClasses(props),\n className,\n _className\n ),\n }\n\n const inputParams = {\n disabled,\n checked,\n ...rest,\n }\n\n if (showStatus || suffix) {\n inputParams['aria-describedby'] = combineDescribedBy(\n inputParams,\n showStatus ? id + '-status' : null,\n suffix ? id + '-suffix' : null\n )\n }\n if (readOnly) {\n inputParams['aria-readonly'] = inputParams.readOnly = true\n }\n\n skeletonDOMAttributes(inputParams, skeleton, this.context)\n\n // also used for code markup simulation\n validateDOMAttributes(this.props, inputParams)\n\n const statusComp = (\n <FormStatus\n show={showStatus}\n id={id + '-form-status'}\n globalStatus={globalStatus}\n label={label}\n text_id={id + '-status'} // used for \"aria-describedby\"\n width_selector={id + ', ' + id + '-label'}\n text={status}\n state={status_state}\n no_animation={status_no_animation}\n skeleton={skeleton}\n {...status_props}\n />\n )\n\n const Element = element || 'input'\n\n return (\n <span {...mainParams}>\n <span className=\"dnb-checkbox__order\">\n {label && (\n <FormLabel\n id={id + '-label'}\n for_id={id}\n text={label}\n disabled={disabled}\n skeleton={skeleton}\n sr_only={label_sr_only}\n />\n )}\n\n <span className=\"dnb-checkbox__inner\">\n <AlignmentHelper />\n {label_position === 'left' && statusComp}\n\n <span className=\"dnb-checkbox__shell\">\n <Element\n id={id}\n name={id}\n type=\"checkbox\"\n title={title}\n className=\"dnb-checkbox__input\"\n value={checked ? value || '' : ''}\n disabled={isTrue(disabled)}\n {...inputParams}\n onChange={this.onChangeHandler}\n onKeyDown={this.onKeyDownHandler}\n ref={this._refInput}\n />\n\n <span\n className={classnames(\n 'dnb-checkbox__button',\n createSkeletonClass('shape', skeleton, this.context)\n )}\n aria-hidden\n >\n <span className=\"dnb-checkbox__focus\" />\n </span>\n\n <CheckIcon size={size} />\n </span>\n </span>\n\n {suffix && (\n <Suffix\n className=\"dnb-checkbox__suffix\"\n id={id + '-suffix'} // used for \"aria-describedby\"\n context={props}\n >\n {suffix}\n </Suffix>\n )}\n </span>\n\n {(label_position === 'right' || !label_position) && statusComp}\n </span>\n )\n }\n}\n\n// The new checkbox has too low contrast, as it is too thin on web\nexport const CheckIcon = ({ size, ...props }) => {\n let vB = 16\n if (size === 'large') {\n vB = 24\n }\n return (\n <svg\n width={vB}\n height={vB}\n viewBox={`0 0 ${vB} ${vB}`}\n fill=\"none\"\n className=\"dnb-checkbox__gfx\"\n aria-hidden\n {...props}\n >\n <path\n d={size === 'large' ? 'M1.5 15L7.5 21L22.5 3' : 'M1 10L5 14L15 2'}\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n )\n}\nCheckIcon.propTypes = {\n size: PropTypes.string,\n}\nCheckIcon.defaultProps = {\n size: 'default',\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"Checkbox.js","names":["React","PropTypes","classnames","keycode","isTrue","makeUniqueId","extendPropsWithContextInClassComponent","validateDOMAttributes","getStatusState","combineDescribedBy","dispatchCustomElementEvent","AlignmentHelper","spacingPropTypes","createSpacingClasses","skeletonDOMAttributes","createSkeletonClass","includeValidProps","Context","Suffix","FormLabel","FormStatus","Checkbox","PureComponent","getDerivedStateFromProps","props","state","_listenForPropChanges","checked","_checked","parseChecked","__checked","constructor","_defineProperty","event","onChangeHandler","readOnly","preventDefault","setState","_refInput","current","focus","innerRef","createRef","_id","id","render","defaultProps","skeleton","context","getTranslation","FormRow","value","status","status_state","status_props","status_no_animation","globalStatus","suffix","size","label","label_position","label_sr_only","title","element","disabled","className","class","_className","children","on_change","on_state_update","rest","_objectWithoutProperties","_excluded","showStatus","mainParams","inputParams","_objectSpread","statusComp","createElement","_extends","show","text_id","width_selector","text","no_animation","Element","for_id","sr_only","_AlignmentHelper","name","type","onChange","onKeyDown","onKeyDownHandler","ref","_span","CheckIcon","attributes","test","String","process","env","NODE_ENV","propTypes","oneOfType","string","func","node","oneOf","bool","object","shape","message","_ref","_excluded2","vB","width","height","viewBox","fill","d","stroke","strokeWidth","strokeLinecap","strokeLinejoin"],"sources":["../../../../src/components/checkbox/Checkbox.js"],"sourcesContent":["/**\n * Web Checkbox Component\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport classnames from 'classnames'\nimport keycode from 'keycode'\nimport {\n isTrue,\n makeUniqueId,\n extendPropsWithContextInClassComponent,\n validateDOMAttributes,\n getStatusState,\n combineDescribedBy,\n dispatchCustomElementEvent,\n} from '../../shared/component-helper'\nimport AlignmentHelper from '../../shared/AlignmentHelper'\nimport {\n spacingPropTypes,\n createSpacingClasses,\n} from '../space/SpacingHelper'\nimport {\n skeletonDOMAttributes,\n createSkeletonClass,\n} from '../skeleton/SkeletonHelper'\nimport { includeValidProps } from '../form-row/FormRowHelpers'\n\nimport Context from '../../shared/Context'\nimport Suffix from '../../shared/helpers/Suffix'\nimport FormLabel from '../form-label/FormLabel'\nimport FormStatus from '../form-status/FormStatus'\n\n/**\n * The checkbox component is our enhancement of the classic checkbox button. It acts like a checkbox. Example: On/off, yes/no.\n */\nexport default class Checkbox extends React.PureComponent {\n static contextType = Context\n\n static propTypes = {\n label: PropTypes.oneOfType([\n PropTypes.string,\n PropTypes.func,\n PropTypes.node,\n ]),\n label_position: PropTypes.oneOf(['left', 'right']),\n label_sr_only: PropTypes.bool,\n title: PropTypes.string,\n element: PropTypes.node,\n checked: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n disabled: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n id: PropTypes.string,\n size: PropTypes.oneOf(['default', 'medium', 'large']),\n status: PropTypes.oneOfType([\n PropTypes.string,\n PropTypes.bool,\n PropTypes.func,\n PropTypes.node,\n ]),\n status_state: PropTypes.string,\n status_props: PropTypes.object,\n status_no_animation: PropTypes.oneOfType([\n PropTypes.string,\n PropTypes.bool,\n ]),\n globalStatus: PropTypes.shape({\n id: PropTypes.string,\n message: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n }),\n suffix: PropTypes.oneOfType([\n PropTypes.string,\n PropTypes.func,\n PropTypes.node,\n ]),\n value: PropTypes.string,\n attributes: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),\n readOnly: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n skeleton: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n class: PropTypes.string,\n innerRef: PropTypes.object,\n\n ...spacingPropTypes,\n\n className: PropTypes.string,\n children: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),\n\n on_change: PropTypes.func,\n on_state_update: PropTypes.func,\n }\n\n static defaultProps = {\n label: null,\n label_position: null,\n label_sr_only: null,\n title: null,\n element: 'input',\n checked: null,\n disabled: null,\n id: null,\n size: null,\n status: null,\n status_state: 'error',\n status_props: null,\n status_no_animation: null,\n globalStatus: null,\n suffix: null,\n value: null,\n attributes: null,\n readOnly: false,\n skeleton: null,\n class: null,\n\n className: null,\n children: null,\n\n on_change: null,\n on_state_update: null,\n }\n\n static parseChecked = (state) => /true|on/.test(String(state))\n\n static getDerivedStateFromProps(props, state) {\n if (state._listenForPropChanges) {\n if (props.checked !== state._checked) {\n state.checked = Checkbox.parseChecked(props.checked)\n }\n }\n state._listenForPropChanges = true\n\n if (state.checked !== state.__checked) {\n dispatchCustomElementEvent({ props }, 'on_state_update', {\n checked: state.checked,\n })\n }\n\n state._checked = props.checked\n state.__checked = state.checked\n\n return state\n }\n\n constructor(props) {\n super(props)\n this._refInput = props.innerRef || React.createRef()\n\n this._id = props.id || makeUniqueId() // cause we need an id anyway\n this.state = {\n _listenForPropChanges: true,\n }\n }\n\n onKeyDownHandler = (event) => {\n switch (keycode(event)) {\n case 'enter':\n this.onChangeHandler(event)\n break\n }\n }\n\n onChangeHandler = (event) => {\n if (isTrue(this.props.readOnly)) {\n return event.preventDefault()\n }\n const checked = !this.state.checked\n this.setState({ checked, _listenForPropChanges: false })\n dispatchCustomElementEvent(this, 'on_change', { checked, event })\n\n // help firefox and safari to have an correct state after a click\n if (this._refInput.current) {\n this._refInput.current.focus()\n }\n }\n\n render() {\n // use only the props from context, who are available here anyway\n const props = extendPropsWithContextInClassComponent(\n this.props,\n Checkbox.defaultProps,\n { skeleton: this.context && this.context.skeleton },\n this.context.getTranslation(this.props).Checkbox,\n includeValidProps(this.context.FormRow),\n this.context.Checkbox\n )\n\n const {\n value,\n status,\n status_state,\n status_props,\n status_no_animation,\n globalStatus,\n suffix,\n size,\n label,\n label_position,\n label_sr_only,\n title,\n element,\n disabled,\n readOnly,\n skeleton,\n className,\n class: _className,\n\n id: _id, // eslint-disable-line\n checked: _checked, // eslint-disable-line\n children, // eslint-disable-line\n on_change, // eslint-disable-line\n on_state_update, // eslint-disable-line\n innerRef, // eslint-disable-line\n\n ...rest\n } = props\n\n const { checked } = this.state\n\n const id = this._id\n const showStatus = getStatusState(status)\n\n const mainParams = {\n className: classnames(\n 'dnb-checkbox',\n status && `dnb-checkbox__status--${status_state}`,\n size && `dnb-checkbox--${size}`,\n label &&\n `dnb-checkbox--label-position-${label_position || 'right'}`,\n 'dnb-form-component',\n createSkeletonClass(null, skeleton),\n createSpacingClasses(props),\n className,\n _className\n ),\n }\n\n const inputParams = {\n disabled,\n checked,\n ...rest,\n }\n\n if (showStatus || suffix) {\n inputParams['aria-describedby'] = combineDescribedBy(\n inputParams,\n showStatus ? id + '-status' : null,\n suffix ? id + '-suffix' : null\n )\n }\n if (readOnly) {\n inputParams['aria-readonly'] = inputParams.readOnly = true\n }\n\n skeletonDOMAttributes(inputParams, skeleton, this.context)\n\n // also used for code markup simulation\n validateDOMAttributes(this.props, inputParams)\n\n const statusComp = (\n <FormStatus\n show={showStatus}\n id={id + '-form-status'}\n globalStatus={globalStatus}\n label={label}\n text_id={id + '-status'} // used for \"aria-describedby\"\n width_selector={id + ', ' + id + '-label'}\n text={status}\n state={status_state}\n no_animation={status_no_animation}\n skeleton={skeleton}\n {...status_props}\n />\n )\n\n const Element = element || 'input'\n\n return (\n <span {...mainParams}>\n <span className=\"dnb-checkbox__order\">\n {label && (\n <FormLabel\n id={id + '-label'}\n for_id={id}\n text={label}\n disabled={disabled}\n skeleton={skeleton}\n sr_only={label_sr_only}\n />\n )}\n\n <span className=\"dnb-checkbox__inner\">\n <AlignmentHelper />\n {label_position === 'left' && statusComp}\n\n <span className=\"dnb-checkbox__shell\">\n <Element\n id={id}\n name={id}\n type=\"checkbox\"\n title={title}\n className=\"dnb-checkbox__input\"\n value={checked ? value || '' : ''}\n disabled={isTrue(disabled)}\n {...inputParams}\n onChange={this.onChangeHandler}\n onKeyDown={this.onKeyDownHandler}\n ref={this._refInput}\n />\n\n <span\n className={classnames(\n 'dnb-checkbox__button',\n createSkeletonClass('shape', skeleton, this.context)\n )}\n aria-hidden\n >\n <span className=\"dnb-checkbox__focus\" />\n </span>\n\n <CheckIcon size={size} />\n </span>\n </span>\n\n {suffix && (\n <Suffix\n className=\"dnb-checkbox__suffix\"\n id={id + '-suffix'} // used for \"aria-describedby\"\n context={props}\n >\n {suffix}\n </Suffix>\n )}\n </span>\n\n {(label_position === 'right' || !label_position) && statusComp}\n </span>\n )\n }\n}\n\n// The new checkbox has too low contrast, as it is too thin on web\nexport const CheckIcon = ({ size, ...props }) => {\n let vB = 16\n if (size === 'large') {\n vB = 24\n }\n return (\n <svg\n width={vB}\n height={vB}\n viewBox={`0 0 ${vB} ${vB}`}\n fill=\"none\"\n className=\"dnb-checkbox__gfx\"\n aria-hidden\n {...props}\n >\n <path\n d={size === 'large' ? 'M1.5 15L7.5 21L22.5 3' : 'M1 10L5 14L15 2'}\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n )\n}\nCheckIcon.propTypes = {\n size: PropTypes.string,\n}\nCheckIcon.defaultProps = {\n size: 'default',\n}\n"],"mappings":"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"}
@@ -7,7 +7,9 @@
7
7
 
8
8
  .dnb-checkbox {
9
9
  &__gfx {
10
- transition: opacity 200ms ease-out, transform 200ms ease-out;
10
+ transition:
11
+ opacity 200ms ease-out,
12
+ transform 200ms ease-out;
11
13
  }
12
14
 
13
15
  // When checkbox is ON
@@ -93,8 +93,12 @@
93
93
  background-color: transparent;
94
94
  }
95
95
 
96
- &--preview:not(#{&}--inactive):not(#{&}--start-date):not(#{&}--end-date),
97
- &--within-selection:not(#{&}--inactive):not(#{&}--start-date):not(#{&}--end-date) {
96
+ &--preview:not(#{&}--inactive):not(#{&}--start-date):not(
97
+ #{&}--end-date
98
+ ),
99
+ &--within-selection:not(#{&}--inactive):not(#{&}--start-date):not(
100
+ #{&}--end-date
101
+ ) {
98
102
  background-color: var(--color-mint-green-50);
99
103
  }
100
104
 
@@ -3,7 +3,7 @@ import DrawerHeader from './parts/DrawerHeader';
3
3
  import DrawerNavigation from './parts/DrawerNavigation';
4
4
  import { DrawerProps, DrawerContentProps } from './types';
5
5
  export type DrawerAllProps = DrawerProps & DrawerContentProps;
6
- declare function Drawer({ id, rootId, contentId, focusSelector, labelledBy, directDomReturn, hideCloseButton, disabled, title, dialogTitle, closeTitle, containerPlacement, spacing, noAnimation, noAnimationOnMobile, animationDuration, fullscreen, onOpen, onClose, onClosePrevent, openModal, closeModal, preventClose, preventOverlayClose, openState, openDelay, omitTriggerButton, trigger, triggerAttributes, overlayClass, contentClass, contentRef, scrollRef, top, bottom, left, right, space, ...props }: DrawerAllProps): JSX.Element;
6
+ declare function Drawer({ id, rootId, contentId, focusSelector, labelledBy, directDomReturn, hideCloseButton, disabled, title, dialogTitle, closeTitle, containerPlacement, spacing, noAnimation, noAnimationOnMobile, animationDuration, fullscreen, onOpen, onClose, onClosePrevent, openModal, closeModal, preventClose, preventOverlayClose, openState, openDelay, omitTriggerButton, trigger, triggerAttributes, closeButtonAttributes, overlayClass, contentClass, contentRef, scrollRef, top, bottom, left, right, space, ...props }: DrawerAllProps): JSX.Element;
7
7
  declare namespace Drawer {
8
8
  var Body: typeof DrawerBody;
9
9
  var Header: typeof DrawerHeader;
@@ -1,7 +1,7 @@
1
1
  import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
3
3
  import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
4
- const _excluded = ["id", "rootId", "contentId", "focusSelector", "labelledBy", "directDomReturn", "hideCloseButton", "disabled", "title", "dialogTitle", "closeTitle", "containerPlacement", "spacing", "noAnimation", "noAnimationOnMobile", "animationDuration", "fullscreen", "onOpen", "onClose", "onClosePrevent", "openModal", "closeModal", "preventClose", "preventOverlayClose", "openState", "openDelay", "omitTriggerButton", "trigger", "triggerAttributes", "overlayClass", "contentClass", "contentRef", "scrollRef", "top", "bottom", "left", "right", "space"];
4
+ const _excluded = ["id", "rootId", "contentId", "focusSelector", "labelledBy", "directDomReturn", "hideCloseButton", "disabled", "title", "dialogTitle", "closeTitle", "containerPlacement", "spacing", "noAnimation", "noAnimationOnMobile", "animationDuration", "fullscreen", "onOpen", "onClose", "onClosePrevent", "openModal", "closeModal", "preventClose", "preventOverlayClose", "openState", "openDelay", "omitTriggerButton", "trigger", "triggerAttributes", "closeButtonAttributes", "overlayClass", "contentClass", "contentRef", "scrollRef", "top", "bottom", "left", "right", "space"];
5
5
  function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
6
6
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
7
7
  import React, { useContext } from 'react';
@@ -44,6 +44,7 @@ function Drawer(_ref) {
44
44
  omitTriggerButton,
45
45
  trigger,
46
46
  triggerAttributes,
47
+ closeButtonAttributes,
47
48
  overlayClass,
48
49
  contentClass,
49
50
  contentRef,
@@ -86,6 +87,7 @@ function Drawer(_ref) {
86
87
  omitTriggerButton,
87
88
  trigger,
88
89
  triggerAttributes,
90
+ closeButtonAttributes,
89
91
  overlayClass,
90
92
  contentRef,
91
93
  scrollRef,
@@ -1 +1 @@
1
- {"version":3,"file":"Drawer.js","names":["React","useContext","Modal","DrawerContent","DrawerBody","DrawerHeader","DrawerNavigation","classnames","Context","removeUndefinedProps","Drawer","_ref","id","rootId","contentId","focusSelector","labelledBy","directDomReturn","hideCloseButton","disabled","title","dialogTitle","closeTitle","containerPlacement","spacing","noAnimation","noAnimationOnMobile","animationDuration","fullscreen","onOpen","onClose","onClosePrevent","openModal","closeModal","preventClose","preventOverlayClose","openState","openDelay","omitTriggerButton","trigger","triggerAttributes","overlayClass","contentClass","contentRef","scrollRef","top","bottom","left","right","space","props","_objectWithoutProperties","_excluded","context","modalProps","drawerProps","_objectSpread","createElement","_extends","Body","Header","Navigation"],"sources":["../../../../src/components/drawer/Drawer.tsx"],"sourcesContent":["/**\n * Web Drawer Component\n *\n */\nimport React, { useContext } from 'react'\nimport Modal from '../modal/Modal'\nimport DrawerContent from './DrawerContent'\nimport DrawerBody from './parts/DrawerBody'\nimport DrawerHeader from './parts/DrawerHeader'\nimport DrawerNavigation from './parts/DrawerNavigation'\nimport classnames from 'classnames'\nimport Context from '../../shared/Context'\nimport { DrawerProps, DrawerContentProps } from './types'\nimport { removeUndefinedProps } from '../../shared/component-helper'\n\nexport type DrawerAllProps = DrawerProps & DrawerContentProps\n\nfunction Drawer({\n id,\n rootId,\n contentId,\n focusSelector,\n labelledBy,\n directDomReturn,\n hideCloseButton,\n disabled,\n\n title,\n dialogTitle,\n closeTitle,\n containerPlacement = 'right',\n spacing = true,\n noAnimation,\n noAnimationOnMobile,\n animationDuration,\n fullscreen = 'auto',\n\n onOpen,\n onClose,\n onClosePrevent,\n openModal,\n closeModal,\n preventClose,\n preventOverlayClose,\n openState,\n openDelay,\n\n omitTriggerButton,\n trigger,\n triggerAttributes,\n overlayClass,\n contentClass,\n contentRef,\n scrollRef,\n\n top,\n bottom,\n left,\n right,\n space,\n\n ...props\n}: DrawerAllProps): JSX.Element {\n const context = useContext(Context)\n\n const modalProps = removeUndefinedProps({\n title,\n id,\n focusSelector,\n labelledBy,\n disabled,\n spacing,\n openDelay,\n contentId,\n dialogTitle,\n closeTitle,\n hideCloseButton,\n preventClose,\n preventOverlayClose,\n animationDuration,\n noAnimation,\n noAnimationOnMobile,\n fullscreen,\n containerPlacement,\n openState,\n directDomReturn,\n rootId,\n onOpen,\n onClose,\n onClosePrevent,\n openModal,\n closeModal,\n omitTriggerButton,\n trigger,\n triggerAttributes,\n overlayClass,\n contentRef,\n scrollRef,\n top,\n bottom,\n left,\n right,\n space,\n })\n\n const drawerProps = removeUndefinedProps({\n ...props,\n noAnimation,\n noAnimationOnMobile,\n fullscreen,\n spacing,\n containerPlacement,\n })\n\n return (\n <Modal\n {...context.Drawer}\n {...modalProps}\n contentClass={classnames('dnb-drawer__root', contentClass)}\n >\n <DrawerContent {...context.Drawer} {...drawerProps} />\n </Modal>\n )\n}\n\nDrawer.Body = DrawerBody\nDrawer.Header = DrawerHeader\nDrawer.Navigation = DrawerNavigation\n\nexport default Drawer\n"],"mappings":";;;;;;AAIA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,OAAOC,KAAK,MAAM,gBAAgB;AAClC,OAAOC,aAAa,MAAM,iBAAiB;AAC3C,OAAOC,UAAU,MAAM,oBAAoB;AAC3C,OAAOC,YAAY,MAAM,sBAAsB;AAC/C,OAAOC,gBAAgB,MAAM,0BAA0B;AACvD,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,OAAO,MAAM,sBAAsB;AAE1C,SAASC,oBAAoB,QAAQ,+BAA+B;AAIpE,SAASC,MAAMA,CAAAC,IAAA,EA6CiB;EAAA,IA7ChB;MACdC,EAAE;MACFC,MAAM;MACNC,SAAS;MACTC,aAAa;MACbC,UAAU;MACVC,eAAe;MACfC,eAAe;MACfC,QAAQ;MAERC,KAAK;MACLC,WAAW;MACXC,UAAU;MACVC,kBAAkB,GAAG,OAAO;MAC5BC,OAAO,GAAG,IAAI;MACdC,WAAW;MACXC,mBAAmB;MACnBC,iBAAiB;MACjBC,UAAU,GAAG,MAAM;MAEnBC,MAAM;MACNC,OAAO;MACPC,cAAc;MACdC,SAAS;MACTC,UAAU;MACVC,YAAY;MACZC,mBAAmB;MACnBC,SAAS;MACTC,SAAS;MAETC,iBAAiB;MACjBC,OAAO;MACPC,iBAAiB;MACjBC,YAAY;MACZC,YAAY;MACZC,UAAU;MACVC,SAAS;MAETC,GAAG;MACHC,MAAM;MACNC,IAAI;MACJC,KAAK;MACLC;IAGc,CAAC,GAAAtC,IAAA;IADZuC,KAAK,GAAAC,wBAAA,CAAAxC,IAAA,EAAAyC,SAAA;EAER,MAAMC,OAAO,GAAGpD,UAAU,CAACO,OAAO,CAAC;EAEnC,MAAM8C,UAAU,GAAG7C,oBAAoB,CAAC;IACtCW,KAAK;IACLR,EAAE;IACFG,aAAa;IACbC,UAAU;IACVG,QAAQ;IACRK,OAAO;IACPa,SAAS;IACTvB,SAAS;IACTO,WAAW;IACXC,UAAU;IACVJ,eAAe;IACfgB,YAAY;IACZC,mBAAmB;IACnBR,iBAAiB;IACjBF,WAAW;IACXC,mBAAmB;IACnBE,UAAU;IACVL,kBAAkB;IAClBa,SAAS;IACTnB,eAAe;IACfJ,MAAM;IACNgB,MAAM;IACNC,OAAO;IACPC,cAAc;IACdC,SAAS;IACTC,UAAU;IACVK,iBAAiB;IACjBC,OAAO;IACPC,iBAAiB;IACjBC,YAAY;IACZE,UAAU;IACVC,SAAS;IACTC,GAAG;IACHC,MAAM;IACNC,IAAI;IACJC,KAAK;IACLC;EACF,CAAC,CAAC;EAEF,MAAMM,WAAW,GAAG9C,oBAAoB,CAAA+C,aAAA,CAAAA,aAAA,KACnCN,KAAK;IACRzB,WAAW;IACXC,mBAAmB;IACnBE,UAAU;IACVJ,OAAO;IACPD;EAAkB,EACnB,CAAC;EAEF,OACEvB,KAAA,CAAAyD,aAAA,CAACvD,KAAK,EAAAwD,QAAA,KACAL,OAAO,CAAC3C,MAAM,EACd4C,UAAU;IACdZ,YAAY,EAAEnC,UAAU,CAAC,kBAAkB,EAAEmC,YAAY;EAAE,IAE3D1C,KAAA,CAAAyD,aAAA,CAACtD,aAAa,EAAAuD,QAAA,KAAKL,OAAO,CAAC3C,MAAM,EAAM6C,WAAW,CAAG,CAChD,CAAC;AAEZ;AAEA7C,MAAM,CAACiD,IAAI,GAAGvD,UAAU;AACxBM,MAAM,CAACkD,MAAM,GAAGvD,YAAY;AAC5BK,MAAM,CAACmD,UAAU,GAAGvD,gBAAgB;AAEpC,eAAeI,MAAM"}
1
+ {"version":3,"file":"Drawer.js","names":["React","useContext","Modal","DrawerContent","DrawerBody","DrawerHeader","DrawerNavigation","classnames","Context","removeUndefinedProps","Drawer","_ref","id","rootId","contentId","focusSelector","labelledBy","directDomReturn","hideCloseButton","disabled","title","dialogTitle","closeTitle","containerPlacement","spacing","noAnimation","noAnimationOnMobile","animationDuration","fullscreen","onOpen","onClose","onClosePrevent","openModal","closeModal","preventClose","preventOverlayClose","openState","openDelay","omitTriggerButton","trigger","triggerAttributes","closeButtonAttributes","overlayClass","contentClass","contentRef","scrollRef","top","bottom","left","right","space","props","_objectWithoutProperties","_excluded","context","modalProps","drawerProps","_objectSpread","createElement","_extends","Body","Header","Navigation"],"sources":["../../../../src/components/drawer/Drawer.tsx"],"sourcesContent":["/**\n * Web Drawer Component\n *\n */\nimport React, { useContext } from 'react'\nimport Modal from '../modal/Modal'\nimport DrawerContent from './DrawerContent'\nimport DrawerBody from './parts/DrawerBody'\nimport DrawerHeader from './parts/DrawerHeader'\nimport DrawerNavigation from './parts/DrawerNavigation'\nimport classnames from 'classnames'\nimport Context from '../../shared/Context'\nimport { DrawerProps, DrawerContentProps } from './types'\nimport { removeUndefinedProps } from '../../shared/component-helper'\n\nexport type DrawerAllProps = DrawerProps & DrawerContentProps\n\nfunction Drawer({\n id,\n rootId,\n contentId,\n focusSelector,\n labelledBy,\n directDomReturn,\n hideCloseButton,\n disabled,\n\n title,\n dialogTitle,\n closeTitle,\n containerPlacement = 'right',\n spacing = true,\n noAnimation,\n noAnimationOnMobile,\n animationDuration,\n fullscreen = 'auto',\n\n onOpen,\n onClose,\n onClosePrevent,\n openModal,\n closeModal,\n preventClose,\n preventOverlayClose,\n openState,\n openDelay,\n\n omitTriggerButton,\n trigger,\n triggerAttributes,\n closeButtonAttributes,\n overlayClass,\n contentClass,\n contentRef,\n scrollRef,\n\n top,\n bottom,\n left,\n right,\n space,\n\n ...props\n}: DrawerAllProps): JSX.Element {\n const context = useContext(Context)\n\n const modalProps = removeUndefinedProps({\n title,\n id,\n focusSelector,\n labelledBy,\n disabled,\n spacing,\n openDelay,\n contentId,\n dialogTitle,\n closeTitle,\n hideCloseButton,\n preventClose,\n preventOverlayClose,\n animationDuration,\n noAnimation,\n noAnimationOnMobile,\n fullscreen,\n containerPlacement,\n openState,\n directDomReturn,\n rootId,\n onOpen,\n onClose,\n onClosePrevent,\n openModal,\n closeModal,\n omitTriggerButton,\n trigger,\n triggerAttributes,\n closeButtonAttributes,\n overlayClass,\n contentRef,\n scrollRef,\n top,\n bottom,\n left,\n right,\n space,\n })\n\n const drawerProps = removeUndefinedProps({\n ...props,\n noAnimation,\n noAnimationOnMobile,\n fullscreen,\n spacing,\n containerPlacement,\n })\n\n return (\n <Modal\n {...context.Drawer}\n {...modalProps}\n contentClass={classnames('dnb-drawer__root', contentClass)}\n >\n <DrawerContent {...context.Drawer} {...drawerProps} />\n </Modal>\n )\n}\n\nDrawer.Body = DrawerBody\nDrawer.Header = DrawerHeader\nDrawer.Navigation = DrawerNavigation\n\nexport default Drawer\n"],"mappings":";;;;;;AAIA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,OAAOC,KAAK,MAAM,gBAAgB;AAClC,OAAOC,aAAa,MAAM,iBAAiB;AAC3C,OAAOC,UAAU,MAAM,oBAAoB;AAC3C,OAAOC,YAAY,MAAM,sBAAsB;AAC/C,OAAOC,gBAAgB,MAAM,0BAA0B;AACvD,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,OAAO,MAAM,sBAAsB;AAE1C,SAASC,oBAAoB,QAAQ,+BAA+B;AAIpE,SAASC,MAAMA,CAAAC,IAAA,EA8CiB;EAAA,IA9ChB;MACdC,EAAE;MACFC,MAAM;MACNC,SAAS;MACTC,aAAa;MACbC,UAAU;MACVC,eAAe;MACfC,eAAe;MACfC,QAAQ;MAERC,KAAK;MACLC,WAAW;MACXC,UAAU;MACVC,kBAAkB,GAAG,OAAO;MAC5BC,OAAO,GAAG,IAAI;MACdC,WAAW;MACXC,mBAAmB;MACnBC,iBAAiB;MACjBC,UAAU,GAAG,MAAM;MAEnBC,MAAM;MACNC,OAAO;MACPC,cAAc;MACdC,SAAS;MACTC,UAAU;MACVC,YAAY;MACZC,mBAAmB;MACnBC,SAAS;MACTC,SAAS;MAETC,iBAAiB;MACjBC,OAAO;MACPC,iBAAiB;MACjBC,qBAAqB;MACrBC,YAAY;MACZC,YAAY;MACZC,UAAU;MACVC,SAAS;MAETC,GAAG;MACHC,MAAM;MACNC,IAAI;MACJC,KAAK;MACLC;IAGc,CAAC,GAAAvC,IAAA;IADZwC,KAAK,GAAAC,wBAAA,CAAAzC,IAAA,EAAA0C,SAAA;EAER,MAAMC,OAAO,GAAGrD,UAAU,CAACO,OAAO,CAAC;EAEnC,MAAM+C,UAAU,GAAG9C,oBAAoB,CAAC;IACtCW,KAAK;IACLR,EAAE;IACFG,aAAa;IACbC,UAAU;IACVG,QAAQ;IACRK,OAAO;IACPa,SAAS;IACTvB,SAAS;IACTO,WAAW;IACXC,UAAU;IACVJ,eAAe;IACfgB,YAAY;IACZC,mBAAmB;IACnBR,iBAAiB;IACjBF,WAAW;IACXC,mBAAmB;IACnBE,UAAU;IACVL,kBAAkB;IAClBa,SAAS;IACTnB,eAAe;IACfJ,MAAM;IACNgB,MAAM;IACNC,OAAO;IACPC,cAAc;IACdC,SAAS;IACTC,UAAU;IACVK,iBAAiB;IACjBC,OAAO;IACPC,iBAAiB;IACjBC,qBAAqB;IACrBC,YAAY;IACZE,UAAU;IACVC,SAAS;IACTC,GAAG;IACHC,MAAM;IACNC,IAAI;IACJC,KAAK;IACLC;EACF,CAAC,CAAC;EAEF,MAAMM,WAAW,GAAG/C,oBAAoB,CAAAgD,aAAA,CAAAA,aAAA,KACnCN,KAAK;IACR1B,WAAW;IACXC,mBAAmB;IACnBE,UAAU;IACVJ,OAAO;IACPD;EAAkB,EACnB,CAAC;EAEF,OACEvB,KAAA,CAAA0D,aAAA,CAACxD,KAAK,EAAAyD,QAAA,KACAL,OAAO,CAAC5C,MAAM,EACd6C,UAAU;IACdZ,YAAY,EAAEpC,UAAU,CAAC,kBAAkB,EAAEoC,YAAY;EAAE,IAE3D3C,KAAA,CAAA0D,aAAA,CAACvD,aAAa,EAAAwD,QAAA,KAAKL,OAAO,CAAC5C,MAAM,EAAM8C,WAAW,CAAG,CAChD,CAAC;AAEZ;AAEA9C,MAAM,CAACkD,IAAI,GAAGxD,UAAU;AACxBM,MAAM,CAACmD,MAAM,GAAGxD,YAAY;AAC5BK,MAAM,CAACoD,UAAU,GAAGxD,gBAAgB;AAEpC,eAAeI,MAAM"}
@@ -14,6 +14,7 @@ export type FormStatusState =
14
14
  | 'error'
15
15
  | 'warn'
16
16
  | 'info'
17
+ | 'success'
17
18
  | 'marketing';
18
19
  export type FormStatusVariant = 'flat' | 'outlined';
19
20
  export type FormStatusSize = 'default' | 'large';
@@ -115,6 +116,7 @@ export interface InfoIconProps {
115
116
  * The `title` attribute in the status.
116
117
  */
117
118
  title?: string;
119
+ theme?: string;
118
120
  }
119
121
  export declare const InfoIcon: React.FC<InfoIconProps>;
120
122
  export interface MarketingIconProps {