@dnb/eufemia 10.71.1 → 10.72.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 (342) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/cjs/components/anchor/Anchor.js +1 -0
  3. package/cjs/components/anchor/Anchor.js.map +1 -1
  4. package/cjs/components/card/CardDocs.js +1 -1
  5. package/cjs/components/card/CardDocs.js.map +1 -1
  6. package/cjs/components/help-button/HelpButtonInline.js +1 -1
  7. package/cjs/components/help-button/HelpButtonInline.js.map +1 -1
  8. package/cjs/components/section/Section.d.ts +2 -1
  9. package/cjs/components/section/Section.js +2 -2
  10. package/cjs/components/section/Section.js.map +1 -1
  11. package/cjs/components/section/style/dnb-section.css +4 -0
  12. package/cjs/components/section/style/dnb-section.min.css +1 -1
  13. package/cjs/components/section/style/dnb-section.scss +5 -0
  14. package/cjs/components/step-indicator/StepIndicator.d.ts +23 -5
  15. package/cjs/components/step-indicator/StepIndicator.js +66 -21
  16. package/cjs/components/step-indicator/StepIndicator.js.map +1 -1
  17. package/cjs/components/step-indicator/StepIndicatorContext.d.ts +2 -14
  18. package/cjs/components/step-indicator/StepIndicatorContext.js +9 -56
  19. package/cjs/components/step-indicator/StepIndicatorContext.js.map +1 -1
  20. package/cjs/components/step-indicator/StepIndicatorDocs.d.ts +5 -0
  21. package/cjs/components/step-indicator/StepIndicatorDocs.js +145 -0
  22. package/cjs/components/step-indicator/StepIndicatorDocs.js.map +1 -0
  23. package/cjs/components/step-indicator/StepIndicatorItem.d.ts +10 -10
  24. package/cjs/components/step-indicator/StepIndicatorItem.js +89 -98
  25. package/cjs/components/step-indicator/StepIndicatorItem.js.map +1 -1
  26. package/cjs/components/step-indicator/StepIndicatorList.js +33 -36
  27. package/cjs/components/step-indicator/StepIndicatorList.js.map +1 -1
  28. package/cjs/components/step-indicator/StepIndicatorProps.js +2 -1
  29. package/cjs/components/step-indicator/StepIndicatorProps.js.map +1 -1
  30. package/cjs/components/step-indicator/StepIndicatorSidebar.d.ts +8 -8
  31. package/cjs/components/step-indicator/StepIndicatorSidebar.js +6 -63
  32. package/cjs/components/step-indicator/StepIndicatorSidebar.js.map +1 -1
  33. package/cjs/components/step-indicator/StepIndicatorTriggerButton.d.ts +1 -7
  34. package/cjs/components/step-indicator/StepIndicatorTriggerButton.js +70 -38
  35. package/cjs/components/step-indicator/StepIndicatorTriggerButton.js.map +1 -1
  36. package/cjs/components/step-indicator/style/dnb-step-indicator.css +99 -56
  37. package/cjs/components/step-indicator/style/dnb-step-indicator.min.css +1 -1
  38. package/cjs/components/step-indicator/style/dnb-step-indicator.scss +112 -67
  39. package/cjs/components/step-indicator/style/themes/dnb-step-indicator-theme-sbanken.css +5 -62
  40. package/cjs/components/step-indicator/style/themes/dnb-step-indicator-theme-sbanken.min.css +1 -1
  41. package/cjs/components/step-indicator/style/themes/dnb-step-indicator-theme-sbanken.scss +5 -89
  42. package/cjs/components/step-indicator/style/themes/dnb-step-indicator-theme-ui.css +1 -65
  43. package/cjs/components/step-indicator/style/themes/dnb-step-indicator-theme-ui.min.css +0 -1
  44. package/cjs/components/step-indicator/style/themes/dnb-step-indicator-theme-ui.scss +0 -91
  45. package/cjs/components/tooltip/TooltipContainer.js +23 -7
  46. package/cjs/components/tooltip/TooltipContainer.js.map +1 -1
  47. package/cjs/elements/Element.d.ts +16 -2
  48. package/cjs/elements/Element.js +1 -1
  49. package/cjs/elements/Element.js.map +1 -1
  50. package/cjs/elements/lib.d.ts +1 -1
  51. package/cjs/extensions/forms/Wizard/Container/DisplaySteps.d.ts +3 -3
  52. package/cjs/extensions/forms/Wizard/Container/DisplaySteps.js +14 -10
  53. package/cjs/extensions/forms/Wizard/Container/DisplaySteps.js.map +1 -1
  54. package/cjs/extensions/forms/Wizard/Container/WizardContainer.d.ts +12 -0
  55. package/cjs/extensions/forms/Wizard/Container/WizardContainer.js +24 -13
  56. package/cjs/extensions/forms/Wizard/Container/WizardContainer.js.map +1 -1
  57. package/cjs/extensions/forms/Wizard/Container/WizardContainerDocs.js +21 -11
  58. package/cjs/extensions/forms/Wizard/Container/WizardContainerDocs.js.map +1 -1
  59. package/cjs/extensions/forms/Wizard/style/dnb-wizard-layout.css +2 -14
  60. package/cjs/extensions/forms/Wizard/style/dnb-wizard-layout.min.css +1 -1
  61. package/cjs/extensions/forms/Wizard/style/dnb-wizard-layout.scss +3 -18
  62. package/cjs/extensions/forms/style/dnb-forms.css +2 -13
  63. package/cjs/extensions/forms/style/dnb-forms.min.css +1 -1
  64. package/cjs/shared/Eufemia.d.ts +1 -1
  65. package/cjs/shared/Eufemia.js +2 -2
  66. package/cjs/shared/Eufemia.js.map +1 -1
  67. package/cjs/shared/locales/en-GB.d.ts +0 -1
  68. package/cjs/shared/locales/en-GB.js +1 -2
  69. package/cjs/shared/locales/en-GB.js.map +1 -1
  70. package/cjs/shared/locales/en-US.d.ts +0 -1
  71. package/cjs/shared/locales/index.d.ts +0 -2
  72. package/cjs/shared/locales/nb-NO.d.ts +0 -1
  73. package/cjs/shared/locales/nb-NO.js +1 -2
  74. package/cjs/shared/locales/nb-NO.js.map +1 -1
  75. package/cjs/shared/locales/sv-SE.d.ts +0 -1
  76. package/cjs/shared/locales/sv-SE.js +0 -1
  77. package/cjs/shared/locales/sv-SE.js.map +1 -1
  78. package/cjs/style/core/scopes.scss +1 -1
  79. package/cjs/style/dnb-ui-basis.css +1 -1
  80. package/cjs/style/dnb-ui-basis.min.css +1 -1
  81. package/cjs/style/dnb-ui-body.css +1 -1
  82. package/cjs/style/dnb-ui-body.min.css +1 -1
  83. package/cjs/style/dnb-ui-components.css +101 -65
  84. package/cjs/style/dnb-ui-components.min.css +3 -3
  85. package/cjs/style/dnb-ui-core.css +1 -1
  86. package/cjs/style/dnb-ui-core.min.css +1 -1
  87. package/cjs/style/dnb-ui-extensions.css +2 -13
  88. package/cjs/style/dnb-ui-extensions.min.css +1 -1
  89. package/cjs/style/dnb-ui-forms.css +2 -13
  90. package/cjs/style/dnb-ui-forms.min.css +1 -1
  91. package/cjs/style/themes/theme-eiendom/eiendom-theme-components.css +102 -142
  92. package/cjs/style/themes/theme-eiendom/eiendom-theme-components.min.css +4 -4
  93. package/cjs/style/themes/theme-eiendom/eiendom-theme-extensions.css +2 -13
  94. package/cjs/style/themes/theme-eiendom/eiendom-theme-extensions.min.css +1 -1
  95. package/cjs/style/themes/theme-eiendom/eiendom-theme-forms.css +2 -13
  96. package/cjs/style/themes/theme-eiendom/eiendom-theme-forms.min.css +1 -1
  97. package/cjs/style/themes/theme-sbanken/sbanken-theme-components.css +107 -139
  98. package/cjs/style/themes/theme-sbanken/sbanken-theme-components.min.css +4 -4
  99. package/cjs/style/themes/theme-sbanken/sbanken-theme-extensions.css +2 -13
  100. package/cjs/style/themes/theme-sbanken/sbanken-theme-extensions.min.css +1 -1
  101. package/cjs/style/themes/theme-sbanken/sbanken-theme-forms.css +2 -13
  102. package/cjs/style/themes/theme-sbanken/sbanken-theme-forms.min.css +1 -1
  103. package/cjs/style/themes/theme-ui/ui-theme-components.css +102 -142
  104. package/cjs/style/themes/theme-ui/ui-theme-components.min.css +4 -4
  105. package/cjs/style/themes/theme-ui/ui-theme-extensions.css +2 -13
  106. package/cjs/style/themes/theme-ui/ui-theme-extensions.min.css +1 -1
  107. package/cjs/style/themes/theme-ui/ui-theme-forms.css +2 -13
  108. package/cjs/style/themes/theme-ui/ui-theme-forms.min.css +1 -1
  109. package/components/anchor/Anchor.js +1 -0
  110. package/components/anchor/Anchor.js.map +1 -1
  111. package/components/card/CardDocs.js +1 -1
  112. package/components/card/CardDocs.js.map +1 -1
  113. package/components/help-button/HelpButtonInline.js +1 -1
  114. package/components/help-button/HelpButtonInline.js.map +1 -1
  115. package/components/section/Section.d.ts +2 -1
  116. package/components/section/Section.js +2 -2
  117. package/components/section/Section.js.map +1 -1
  118. package/components/section/style/dnb-section.css +4 -0
  119. package/components/section/style/dnb-section.min.css +1 -1
  120. package/components/section/style/dnb-section.scss +5 -0
  121. package/components/step-indicator/StepIndicator.d.ts +23 -5
  122. package/components/step-indicator/StepIndicator.js +64 -21
  123. package/components/step-indicator/StepIndicator.js.map +1 -1
  124. package/components/step-indicator/StepIndicatorContext.d.ts +2 -14
  125. package/components/step-indicator/StepIndicatorContext.js +9 -53
  126. package/components/step-indicator/StepIndicatorContext.js.map +1 -1
  127. package/components/step-indicator/StepIndicatorDocs.d.ts +5 -0
  128. package/components/step-indicator/StepIndicatorDocs.js +139 -0
  129. package/components/step-indicator/StepIndicatorDocs.js.map +1 -0
  130. package/components/step-indicator/StepIndicatorItem.d.ts +10 -10
  131. package/components/step-indicator/StepIndicatorItem.js +90 -99
  132. package/components/step-indicator/StepIndicatorItem.js.map +1 -1
  133. package/components/step-indicator/StepIndicatorList.js +33 -35
  134. package/components/step-indicator/StepIndicatorList.js.map +1 -1
  135. package/components/step-indicator/StepIndicatorProps.js +2 -1
  136. package/components/step-indicator/StepIndicatorProps.js.map +1 -1
  137. package/components/step-indicator/StepIndicatorSidebar.d.ts +8 -8
  138. package/components/step-indicator/StepIndicatorSidebar.js +6 -59
  139. package/components/step-indicator/StepIndicatorSidebar.js.map +1 -1
  140. package/components/step-indicator/StepIndicatorTriggerButton.d.ts +1 -7
  141. package/components/step-indicator/StepIndicatorTriggerButton.js +71 -39
  142. package/components/step-indicator/StepIndicatorTriggerButton.js.map +1 -1
  143. package/components/step-indicator/style/dnb-step-indicator.css +99 -56
  144. package/components/step-indicator/style/dnb-step-indicator.min.css +1 -1
  145. package/components/step-indicator/style/dnb-step-indicator.scss +112 -67
  146. package/components/step-indicator/style/themes/dnb-step-indicator-theme-sbanken.css +5 -62
  147. package/components/step-indicator/style/themes/dnb-step-indicator-theme-sbanken.min.css +1 -1
  148. package/components/step-indicator/style/themes/dnb-step-indicator-theme-sbanken.scss +5 -89
  149. package/components/step-indicator/style/themes/dnb-step-indicator-theme-ui.css +1 -65
  150. package/components/step-indicator/style/themes/dnb-step-indicator-theme-ui.min.css +0 -1
  151. package/components/step-indicator/style/themes/dnb-step-indicator-theme-ui.scss +0 -91
  152. package/components/tooltip/TooltipContainer.js +23 -7
  153. package/components/tooltip/TooltipContainer.js.map +1 -1
  154. package/elements/Element.d.ts +16 -2
  155. package/elements/Element.js +1 -1
  156. package/elements/Element.js.map +1 -1
  157. package/elements/lib.d.ts +1 -1
  158. package/es/components/anchor/Anchor.js +1 -0
  159. package/es/components/anchor/Anchor.js.map +1 -1
  160. package/es/components/card/CardDocs.js +1 -1
  161. package/es/components/card/CardDocs.js.map +1 -1
  162. package/es/components/help-button/HelpButtonInline.js +1 -1
  163. package/es/components/help-button/HelpButtonInline.js.map +1 -1
  164. package/es/components/section/Section.d.ts +2 -1
  165. package/es/components/section/Section.js +2 -2
  166. package/es/components/section/Section.js.map +1 -1
  167. package/es/components/section/style/dnb-section.css +4 -0
  168. package/es/components/section/style/dnb-section.min.css +1 -1
  169. package/es/components/section/style/dnb-section.scss +5 -0
  170. package/es/components/step-indicator/StepIndicator.d.ts +23 -5
  171. package/es/components/step-indicator/StepIndicator.js +63 -21
  172. package/es/components/step-indicator/StepIndicator.js.map +1 -1
  173. package/es/components/step-indicator/StepIndicatorContext.d.ts +2 -14
  174. package/es/components/step-indicator/StepIndicatorContext.js +5 -49
  175. package/es/components/step-indicator/StepIndicatorContext.js.map +1 -1
  176. package/es/components/step-indicator/StepIndicatorDocs.d.ts +5 -0
  177. package/es/components/step-indicator/StepIndicatorDocs.js +139 -0
  178. package/es/components/step-indicator/StepIndicatorDocs.js.map +1 -0
  179. package/es/components/step-indicator/StepIndicatorItem.d.ts +10 -10
  180. package/es/components/step-indicator/StepIndicatorItem.js +82 -88
  181. package/es/components/step-indicator/StepIndicatorItem.js.map +1 -1
  182. package/es/components/step-indicator/StepIndicatorList.js +33 -35
  183. package/es/components/step-indicator/StepIndicatorList.js.map +1 -1
  184. package/es/components/step-indicator/StepIndicatorProps.js +2 -1
  185. package/es/components/step-indicator/StepIndicatorProps.js.map +1 -1
  186. package/es/components/step-indicator/StepIndicatorSidebar.d.ts +8 -8
  187. package/es/components/step-indicator/StepIndicatorSidebar.js +6 -58
  188. package/es/components/step-indicator/StepIndicatorSidebar.js.map +1 -1
  189. package/es/components/step-indicator/StepIndicatorTriggerButton.d.ts +1 -7
  190. package/es/components/step-indicator/StepIndicatorTriggerButton.js +71 -39
  191. package/es/components/step-indicator/StepIndicatorTriggerButton.js.map +1 -1
  192. package/es/components/step-indicator/style/dnb-step-indicator.css +99 -56
  193. package/es/components/step-indicator/style/dnb-step-indicator.min.css +1 -1
  194. package/es/components/step-indicator/style/dnb-step-indicator.scss +112 -67
  195. package/es/components/step-indicator/style/themes/dnb-step-indicator-theme-sbanken.css +5 -62
  196. package/es/components/step-indicator/style/themes/dnb-step-indicator-theme-sbanken.min.css +1 -1
  197. package/es/components/step-indicator/style/themes/dnb-step-indicator-theme-sbanken.scss +5 -89
  198. package/es/components/step-indicator/style/themes/dnb-step-indicator-theme-ui.css +1 -65
  199. package/es/components/step-indicator/style/themes/dnb-step-indicator-theme-ui.min.css +0 -1
  200. package/es/components/step-indicator/style/themes/dnb-step-indicator-theme-ui.scss +0 -91
  201. package/es/components/tooltip/TooltipContainer.js +23 -7
  202. package/es/components/tooltip/TooltipContainer.js.map +1 -1
  203. package/es/elements/Element.d.ts +16 -2
  204. package/es/elements/Element.js +1 -1
  205. package/es/elements/Element.js.map +1 -1
  206. package/es/elements/lib.d.ts +1 -1
  207. package/es/extensions/forms/Wizard/Container/DisplaySteps.d.ts +3 -3
  208. package/es/extensions/forms/Wizard/Container/DisplaySteps.js +14 -10
  209. package/es/extensions/forms/Wizard/Container/DisplaySteps.js.map +1 -1
  210. package/es/extensions/forms/Wizard/Container/WizardContainer.d.ts +12 -0
  211. package/es/extensions/forms/Wizard/Container/WizardContainer.js +24 -13
  212. package/es/extensions/forms/Wizard/Container/WizardContainer.js.map +1 -1
  213. package/es/extensions/forms/Wizard/Container/WizardContainerDocs.js +21 -11
  214. package/es/extensions/forms/Wizard/Container/WizardContainerDocs.js.map +1 -1
  215. package/es/extensions/forms/Wizard/style/dnb-wizard-layout.css +2 -14
  216. package/es/extensions/forms/Wizard/style/dnb-wizard-layout.min.css +1 -1
  217. package/es/extensions/forms/Wizard/style/dnb-wizard-layout.scss +3 -18
  218. package/es/extensions/forms/style/dnb-forms.css +2 -13
  219. package/es/extensions/forms/style/dnb-forms.min.css +1 -1
  220. package/es/shared/Eufemia.d.ts +1 -1
  221. package/es/shared/Eufemia.js +2 -2
  222. package/es/shared/Eufemia.js.map +1 -1
  223. package/es/shared/locales/en-GB.d.ts +0 -1
  224. package/es/shared/locales/en-GB.js +1 -2
  225. package/es/shared/locales/en-GB.js.map +1 -1
  226. package/es/shared/locales/en-US.d.ts +0 -1
  227. package/es/shared/locales/index.d.ts +0 -2
  228. package/es/shared/locales/nb-NO.d.ts +0 -1
  229. package/es/shared/locales/nb-NO.js +1 -2
  230. package/es/shared/locales/nb-NO.js.map +1 -1
  231. package/es/shared/locales/sv-SE.d.ts +0 -1
  232. package/es/shared/locales/sv-SE.js +0 -1
  233. package/es/shared/locales/sv-SE.js.map +1 -1
  234. package/es/style/core/scopes.scss +1 -1
  235. package/es/style/dnb-ui-basis.css +1 -1
  236. package/es/style/dnb-ui-basis.min.css +1 -1
  237. package/es/style/dnb-ui-body.css +1 -1
  238. package/es/style/dnb-ui-body.min.css +1 -1
  239. package/es/style/dnb-ui-components.css +101 -65
  240. package/es/style/dnb-ui-components.min.css +3 -3
  241. package/es/style/dnb-ui-core.css +1 -1
  242. package/es/style/dnb-ui-core.min.css +1 -1
  243. package/es/style/dnb-ui-extensions.css +2 -13
  244. package/es/style/dnb-ui-extensions.min.css +1 -1
  245. package/es/style/dnb-ui-forms.css +2 -13
  246. package/es/style/dnb-ui-forms.min.css +1 -1
  247. package/es/style/themes/theme-eiendom/eiendom-theme-components.css +102 -142
  248. package/es/style/themes/theme-eiendom/eiendom-theme-components.min.css +4 -4
  249. package/es/style/themes/theme-eiendom/eiendom-theme-extensions.css +2 -13
  250. package/es/style/themes/theme-eiendom/eiendom-theme-extensions.min.css +1 -1
  251. package/es/style/themes/theme-eiendom/eiendom-theme-forms.css +2 -13
  252. package/es/style/themes/theme-eiendom/eiendom-theme-forms.min.css +1 -1
  253. package/es/style/themes/theme-sbanken/sbanken-theme-components.css +107 -139
  254. package/es/style/themes/theme-sbanken/sbanken-theme-components.min.css +4 -4
  255. package/es/style/themes/theme-sbanken/sbanken-theme-extensions.css +2 -13
  256. package/es/style/themes/theme-sbanken/sbanken-theme-extensions.min.css +1 -1
  257. package/es/style/themes/theme-sbanken/sbanken-theme-forms.css +2 -13
  258. package/es/style/themes/theme-sbanken/sbanken-theme-forms.min.css +1 -1
  259. package/es/style/themes/theme-ui/ui-theme-components.css +102 -142
  260. package/es/style/themes/theme-ui/ui-theme-components.min.css +4 -4
  261. package/es/style/themes/theme-ui/ui-theme-extensions.css +2 -13
  262. package/es/style/themes/theme-ui/ui-theme-extensions.min.css +1 -1
  263. package/es/style/themes/theme-ui/ui-theme-forms.css +2 -13
  264. package/es/style/themes/theme-ui/ui-theme-forms.min.css +1 -1
  265. package/esm/dnb-ui-basis.min.mjs +1 -1
  266. package/esm/dnb-ui-components.min.mjs +1 -1
  267. package/esm/dnb-ui-elements.min.mjs +1 -1
  268. package/esm/dnb-ui-extensions.min.mjs +1 -1
  269. package/esm/dnb-ui-lib.min.mjs +1 -1
  270. package/extensions/forms/Wizard/Container/DisplaySteps.d.ts +3 -3
  271. package/extensions/forms/Wizard/Container/DisplaySteps.js +14 -10
  272. package/extensions/forms/Wizard/Container/DisplaySteps.js.map +1 -1
  273. package/extensions/forms/Wizard/Container/WizardContainer.d.ts +12 -0
  274. package/extensions/forms/Wizard/Container/WizardContainer.js +24 -13
  275. package/extensions/forms/Wizard/Container/WizardContainer.js.map +1 -1
  276. package/extensions/forms/Wizard/Container/WizardContainerDocs.js +21 -11
  277. package/extensions/forms/Wizard/Container/WizardContainerDocs.js.map +1 -1
  278. package/extensions/forms/Wizard/style/dnb-wizard-layout.css +2 -14
  279. package/extensions/forms/Wizard/style/dnb-wizard-layout.min.css +1 -1
  280. package/extensions/forms/Wizard/style/dnb-wizard-layout.scss +3 -18
  281. package/extensions/forms/style/dnb-forms.css +2 -13
  282. package/extensions/forms/style/dnb-forms.min.css +1 -1
  283. package/package.json +1 -1
  284. package/shared/Eufemia.d.ts +1 -1
  285. package/shared/Eufemia.js +2 -2
  286. package/shared/Eufemia.js.map +1 -1
  287. package/shared/locales/en-GB.d.ts +0 -1
  288. package/shared/locales/en-GB.js +1 -2
  289. package/shared/locales/en-GB.js.map +1 -1
  290. package/shared/locales/en-US.d.ts +0 -1
  291. package/shared/locales/index.d.ts +0 -2
  292. package/shared/locales/nb-NO.d.ts +0 -1
  293. package/shared/locales/nb-NO.js +1 -2
  294. package/shared/locales/nb-NO.js.map +1 -1
  295. package/shared/locales/sv-SE.d.ts +0 -1
  296. package/shared/locales/sv-SE.js +0 -1
  297. package/shared/locales/sv-SE.js.map +1 -1
  298. package/style/core/scopes.scss +1 -1
  299. package/style/dnb-ui-basis.css +1 -1
  300. package/style/dnb-ui-basis.min.css +1 -1
  301. package/style/dnb-ui-body.css +1 -1
  302. package/style/dnb-ui-body.min.css +1 -1
  303. package/style/dnb-ui-components.css +101 -65
  304. package/style/dnb-ui-components.min.css +3 -3
  305. package/style/dnb-ui-core.css +1 -1
  306. package/style/dnb-ui-core.min.css +1 -1
  307. package/style/dnb-ui-extensions.css +2 -13
  308. package/style/dnb-ui-extensions.min.css +1 -1
  309. package/style/dnb-ui-forms.css +2 -13
  310. package/style/dnb-ui-forms.min.css +1 -1
  311. package/style/themes/theme-eiendom/eiendom-theme-components.css +102 -142
  312. package/style/themes/theme-eiendom/eiendom-theme-components.min.css +4 -4
  313. package/style/themes/theme-eiendom/eiendom-theme-extensions.css +2 -13
  314. package/style/themes/theme-eiendom/eiendom-theme-extensions.min.css +1 -1
  315. package/style/themes/theme-eiendom/eiendom-theme-forms.css +2 -13
  316. package/style/themes/theme-eiendom/eiendom-theme-forms.min.css +1 -1
  317. package/style/themes/theme-sbanken/sbanken-theme-components.css +107 -139
  318. package/style/themes/theme-sbanken/sbanken-theme-components.min.css +4 -4
  319. package/style/themes/theme-sbanken/sbanken-theme-extensions.css +2 -13
  320. package/style/themes/theme-sbanken/sbanken-theme-extensions.min.css +1 -1
  321. package/style/themes/theme-sbanken/sbanken-theme-forms.css +2 -13
  322. package/style/themes/theme-sbanken/sbanken-theme-forms.min.css +1 -1
  323. package/style/themes/theme-ui/ui-theme-components.css +102 -142
  324. package/style/themes/theme-ui/ui-theme-components.min.css +4 -4
  325. package/style/themes/theme-ui/ui-theme-extensions.css +2 -13
  326. package/style/themes/theme-ui/ui-theme-extensions.min.css +1 -1
  327. package/style/themes/theme-ui/ui-theme-forms.css +2 -13
  328. package/style/themes/theme-ui/ui-theme-forms.min.css +1 -1
  329. package/umd/dnb-ui-basis.min.js +1 -1
  330. package/umd/dnb-ui-components.min.js +1 -1
  331. package/umd/dnb-ui-elements.min.js +1 -1
  332. package/umd/dnb-ui-extensions.min.js +1 -1
  333. package/umd/dnb-ui-lib.min.js +1 -1
  334. package/cjs/components/step-indicator/StepIndicatorModal.d.ts +0 -6
  335. package/cjs/components/step-indicator/StepIndicatorModal.js +0 -62
  336. package/cjs/components/step-indicator/StepIndicatorModal.js.map +0 -1
  337. package/components/step-indicator/StepIndicatorModal.d.ts +0 -6
  338. package/components/step-indicator/StepIndicatorModal.js +0 -54
  339. package/components/step-indicator/StepIndicatorModal.js.map +0 -1
  340. package/es/components/step-indicator/StepIndicatorModal.d.ts +0 -6
  341. package/es/components/step-indicator/StepIndicatorModal.js +0 -53
  342. package/es/components/step-indicator/StepIndicatorModal.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"TooltipContainer.js","names":["React","isTrue","getOffsetLeft","getOffsetTop","classnames","TooltipContainer","props","internalId","active","attributes","arrow","position","align","hideDelay","fixedPosition","noAnimation","skipPortal","useHover","children","targetElement","target","style","setStyle","useState","hover","setHover","isActive","wasActive","makeActive","renewStyles","forceRerender","getBodySize","elementRef","useRef","offset","debounceTimeout","resizeObserver","document","width","height","body","getBoundingClientRect","clearTimers","clearTimeout","current","useLayoutEffect","addPositionObserver","ResizeObserver","setTimeout","observe","e","removePositionObserver","_resizeObserver$curre","disconnect","offsetLeft","offsetTop","element","window","alignOffset","elementWidth","offsetWidth","elementHeight","offsetHeight","rect","targetBodySize","scrollY","undefined","pageYOffset","scrollX","pageXOffset","top","useMouseWhen","mousePos","left","widthBased","_objectSpread","topHorizontal","leftVertical","stylesFromPosition","right","bottom","stylesFromArrow","rightOffset","parseFloat","String","innerWidth","handleMouseEnter","handleMouseLeave","handlePropagation","stopPropagation","createElement","_extends","role","ref","onMouseEnter","onMouseLeave","onMouseMove","onMouseDown","onTouchStart","className","id"],"sources":["../../../../src/components/tooltip/TooltipContainer.tsx"],"sourcesContent":["/**\n * Web Tooltip Component\n *\n */\n\nimport React from 'react'\nimport { isTrue } from '../../shared/component-helper'\nimport { getOffsetLeft, getOffsetTop } from '../../shared/helpers'\nimport classnames from 'classnames'\nimport { TooltipProps } from './types'\n\ntype TooltipContainerProps = {\n targetElement: HTMLElement\n style?: React.CSSProperties\n useHover?: boolean\n internalId?: string\n attributes?: Record<string, unknown> & { style: React.CSSProperties }\n}\n\nexport default function TooltipContainer(\n props: TooltipProps & TooltipContainerProps\n) {\n const {\n internalId,\n active,\n attributes,\n arrow,\n position,\n align,\n hideDelay,\n fixedPosition,\n noAnimation,\n skipPortal,\n useHover,\n children,\n targetElement: target,\n } = props\n\n const [style, setStyle] = React.useState(null)\n const [hover, setHover] = React.useState(false)\n const isActive = isTrue(active) || hover\n const [wasActive, makeActive] = React.useState(false)\n const [renewStyles, forceRerender] = React.useState(getBodySize)\n\n const elementRef = React.useRef<HTMLSpanElement>(null)\n const offset = React.useRef(16)\n const debounceTimeout = React.useRef<NodeJS.Timeout>()\n const resizeObserver = React.useRef<ResizeObserver>(null)\n\n function getBodySize() {\n if (!isActive || typeof document === 'undefined') {\n return 0 // stop here\n }\n\n const { width, height } = document.body.getBoundingClientRect()\n\n return width + height\n }\n\n const clearTimers = () => {\n clearTimeout(debounceTimeout.current)\n }\n\n React.useLayoutEffect(() => {\n const addPositionObserver = () => {\n if (resizeObserver.current || typeof document === 'undefined') {\n return // stop here\n }\n\n try {\n resizeObserver.current = new ResizeObserver(() => {\n clearTimers()\n debounceTimeout.current = setTimeout(\n () => forceRerender(getBodySize()),\n 100\n )\n })\n\n resizeObserver.current.observe(document.body)\n } catch (e) {\n //\n }\n }\n const removePositionObserver = () => {\n clearTimers()\n resizeObserver.current?.disconnect()\n }\n\n if (isActive) {\n makeActive(true)\n addPositionObserver()\n } else {\n removePositionObserver()\n }\n\n return removePositionObserver\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isActive])\n\n const offsetLeft = React.useRef(0)\n const offsetTop = React.useRef(0)\n\n React.useLayoutEffect(() => {\n if (!isActive) {\n /**\n * This \"resets\" the position between elements,\n * when not active. Else it will always first show on the older position.\n */\n if (wasActive) {\n clearTimeout(debounceTimeout.current)\n debounceTimeout.current = setTimeout(\n () => setStyle(null),\n hideDelay\n )\n }\n return // stop here\n }\n\n const element = elementRef?.current\n\n if (\n typeof window === 'undefined' ||\n !element ||\n !target?.getBoundingClientRect\n ) {\n return // stop here\n }\n\n let alignOffset = 0\n\n const elementWidth = element.offsetWidth\n const elementHeight = element.offsetHeight\n const rect = target.getBoundingClientRect()\n const targetBodySize = {\n width: target.offsetWidth,\n height: target.offsetHeight,\n }\n\n // fix for svg\n if (!target.offsetHeight) {\n targetBodySize.width = rect.width\n targetBodySize.height = rect.height\n }\n\n if (skipPortal && (!offsetLeft.current || !offsetTop.current)) {\n offsetLeft.current = getOffsetLeft(element) - offset.current\n offsetTop.current = getOffsetTop(element) - offset.current\n }\n\n const scrollY =\n window.scrollY !== undefined ? window.scrollY : window.pageYOffset\n const scrollX =\n window.scrollX !== undefined ? window.scrollX : window.pageXOffset\n const top =\n (isTrue(fixedPosition) ? 0 : scrollY) + rect.top - offsetTop.current\n\n // Use Mouse position when target is too wide\n const useMouseWhen = targetBodySize.width > 400\n const mousePos =\n getOffsetLeft(target) +\n rect.left / 2 +\n (element ? element.offsetWidth : 0)\n const widthBased = scrollX + rect.left\n const left =\n (useMouseWhen && mousePos < targetBodySize.width\n ? mousePos\n : widthBased) - offsetLeft.current\n\n const style = { ...props.style }\n\n if (align === 'left') {\n alignOffset = -targetBodySize.width / 2\n } else if (align === 'right') {\n alignOffset = targetBodySize.width / 2\n }\n\n const topHorizontal =\n top + targetBodySize.height / 2 - elementHeight / 2\n const leftVertical =\n left - elementWidth / 2 + targetBodySize.width / 2 + alignOffset\n\n const stylesFromPosition = {\n left: () => {\n style.top = topHorizontal\n style.left = left - elementWidth - offset.current\n },\n right: () => {\n style.top = topHorizontal\n style.left = left + targetBodySize.width + offset.current\n },\n top: () => {\n style.left = leftVertical\n style.top = top - elementHeight - offset.current\n },\n bottom: () => {\n style.left = leftVertical\n style.top = top + targetBodySize.height + offset.current\n },\n }\n\n const stylesFromArrow = {\n left: () => {\n style.left =\n left + targetBodySize.width / 2 - offset.current + alignOffset\n },\n right: () => {\n style.left =\n left -\n elementWidth +\n targetBodySize.width / 2 +\n offset.current +\n alignOffset\n },\n top: () => {\n style.top = top + targetBodySize.height / 2 - offset.current\n },\n bottom: () => {\n style.top =\n top + targetBodySize.height / 2 - elementHeight + offset.current\n },\n }\n\n if (stylesFromPosition[position]) {\n stylesFromPosition[position]()\n }\n if (stylesFromArrow[arrow]) {\n stylesFromArrow[arrow]()\n }\n\n const rightOffset =\n parseFloat(String(style.left)) + elementWidth - window.innerWidth\n if (rightOffset > 0) {\n style.left = window.innerWidth - elementWidth\n }\n\n if (parseFloat(String(style.left)) < 0) {\n style.left = 0\n }\n if (parseFloat(String(style.top)) < 0) {\n style.top = 0\n }\n\n setStyle(style)\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [active, arrow, position, children, renewStyles])\n\n const handleMouseEnter = () => {\n if (isTrue(active) && useHover !== false) {\n setHover(true)\n }\n }\n\n const handleMouseLeave = () => {\n if (useHover !== false) {\n setHover(false)\n }\n }\n\n /**\n * By stopping propagation, we allow the user to select text when Tooltip is used in the Slider component\n */\n const handlePropagation = (e: React.SyntheticEvent) =>\n e.stopPropagation()\n\n return (\n <span\n role=\"tooltip\"\n aria-hidden={target ? true : undefined} // make sure SR does not find it in the DOM, because we use \"aria-describedby\" for that\n ref={elementRef}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n onMouseMove={handlePropagation}\n onMouseDown={handlePropagation}\n onTouchStart={handlePropagation}\n {...attributes}\n className={classnames(\n attributes?.className,\n isTrue(noAnimation) && 'dnb-tooltip--no-animation',\n isTrue(fixedPosition) && 'dnb-tooltip--fixed',\n isActive && 'dnb-tooltip--active',\n !isActive && wasActive && 'dnb-tooltip--hide'\n )}\n style={{ ...style, ...attributes.style }}\n >\n {arrow && (\n <span\n className={classnames(\n 'dnb-tooltip__arrow',\n `dnb-tooltip__arrow__arrow--${arrow}`,\n `dnb-tooltip__arrow__position--${position}`\n )}\n />\n )}\n\n <span id={internalId} className=\"dnb-tooltip__content\">\n {children}\n </span>\n </span>\n )\n}\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"TooltipContainer.js","names":["React","isTrue","getOffsetLeft","getOffsetTop","classnames","TooltipContainer","props","internalId","active","attributes","arrow","position","align","hideDelay","fixedPosition","noAnimation","skipPortal","useHover","children","targetElement","target","style","setStyle","useState","arrowStyle","setArrowStyle","hover","setHover","isActive","wasActive","makeActive","renewStyles","forceRerender","getBodySize","elementRef","useRef","offset","debounceTimeout","resizeObserver","document","width","height","body","getBoundingClientRect","clearTimers","clearTimeout","current","useLayoutEffect","addPositionObserver","ResizeObserver","setTimeout","observe","e","removePositionObserver","_resizeObserver$curre","disconnect","offsetLeft","offsetTop","_stylesFromPosition$p","_stylesFromArrow$arro","element","window","alignOffset","elementWidth","offsetWidth","elementHeight","offsetHeight","rect","targetBodySize","scrollY","undefined","pageYOffset","scrollX","pageXOffset","top","useMouseWhen","mousePos","left","widthBased","_objectSpread","topHorizontal","leftVertical","stylesFromPosition","right","bottom","stylesFromArrow","call","rightOffset","parseFloat","String","innerWidth","arrowWidth","arrowStyleBasisWidth","handleMouseEnter","handleMouseLeave","handlePropagation","stopPropagation","createElement","_extends","role","ref","onMouseEnter","onMouseLeave","onMouseMove","onMouseDown","onTouchStart","className","id"],"sources":["../../../../src/components/tooltip/TooltipContainer.tsx"],"sourcesContent":["/**\n * Web Tooltip Component\n *\n */\n\nimport React from 'react'\nimport { isTrue } from '../../shared/component-helper'\nimport { getOffsetLeft, getOffsetTop } from '../../shared/helpers'\nimport classnames from 'classnames'\nimport { TooltipProps } from './types'\n\ntype TooltipContainerProps = {\n targetElement: HTMLElement\n style?: React.CSSProperties\n useHover?: boolean\n internalId?: string\n attributes?: Record<string, unknown> & { style: React.CSSProperties }\n}\n\nexport default function TooltipContainer(\n props: TooltipProps & TooltipContainerProps\n) {\n const {\n internalId,\n active,\n attributes,\n arrow,\n position,\n align,\n hideDelay,\n fixedPosition,\n noAnimation,\n skipPortal,\n useHover,\n children,\n targetElement: target,\n } = props\n\n const [style, setStyle] = React.useState(null)\n const [arrowStyle, setArrowStyle] = React.useState(null)\n const [hover, setHover] = React.useState(false)\n const isActive = isTrue(active) || hover\n const [wasActive, makeActive] = React.useState(false)\n const [renewStyles, forceRerender] = React.useState(getBodySize)\n\n const elementRef = React.useRef<HTMLSpanElement>(null)\n const offset = React.useRef(16)\n const debounceTimeout = React.useRef<NodeJS.Timeout>()\n const resizeObserver = React.useRef<ResizeObserver>(null)\n\n function getBodySize() {\n if (!isActive || typeof document === 'undefined') {\n return 0 // stop here\n }\n\n const { width, height } = document.body.getBoundingClientRect()\n\n return width + height\n }\n\n const clearTimers = () => {\n clearTimeout(debounceTimeout.current)\n }\n\n React.useLayoutEffect(() => {\n const addPositionObserver = () => {\n if (resizeObserver.current || typeof document === 'undefined') {\n return // stop here\n }\n\n try {\n resizeObserver.current = new ResizeObserver(() => {\n clearTimers()\n debounceTimeout.current = setTimeout(\n () => forceRerender(getBodySize()),\n 100\n )\n })\n\n resizeObserver.current.observe(document.body)\n } catch (e) {\n //\n }\n }\n const removePositionObserver = () => {\n clearTimers()\n resizeObserver.current?.disconnect()\n }\n\n if (isActive) {\n makeActive(true)\n addPositionObserver()\n } else {\n removePositionObserver()\n }\n\n return removePositionObserver\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isActive])\n\n const offsetLeft = React.useRef(0)\n const offsetTop = React.useRef(0)\n\n React.useLayoutEffect(() => {\n if (!isActive) {\n /**\n * This \"resets\" the position between elements,\n * when not active. Else it will always first show on the older position.\n */\n if (wasActive) {\n clearTimeout(debounceTimeout.current)\n debounceTimeout.current = setTimeout(\n () => setStyle(null),\n hideDelay\n )\n }\n return // stop here\n }\n\n const element = elementRef?.current\n\n if (\n typeof window === 'undefined' ||\n !element ||\n !target?.getBoundingClientRect\n ) {\n return // stop here\n }\n\n let alignOffset = 0\n\n const elementWidth = element.offsetWidth\n const elementHeight = element.offsetHeight\n const rect = target.getBoundingClientRect()\n const targetBodySize = {\n width: target.offsetWidth,\n height: target.offsetHeight,\n }\n\n // fix for svg\n if (!target.offsetHeight) {\n targetBodySize.width = rect.width\n targetBodySize.height = rect.height\n }\n\n if (skipPortal && (!offsetLeft.current || !offsetTop.current)) {\n offsetLeft.current = getOffsetLeft(element) - offset.current\n offsetTop.current = getOffsetTop(element) - offset.current\n }\n\n const scrollY =\n window.scrollY !== undefined ? window.scrollY : window.pageYOffset\n const scrollX =\n window.scrollX !== undefined ? window.scrollX : window.pageXOffset\n const top =\n (isTrue(fixedPosition) ? 0 : scrollY) + rect.top - offsetTop.current\n\n // Use Mouse position when target is too wide\n const useMouseWhen = targetBodySize.width > 400\n const mousePos =\n getOffsetLeft(target) +\n rect.left / 2 +\n (element ? element.offsetWidth : 0)\n const widthBased = scrollX + rect.left\n const left =\n (useMouseWhen && mousePos < targetBodySize.width\n ? mousePos\n : widthBased) - offsetLeft.current\n\n const style = { ...props.style }\n const arrowStyle = { top: null, left: null }\n\n if (align === 'left') {\n alignOffset = -targetBodySize.width / 2\n } else if (align === 'right') {\n alignOffset = targetBodySize.width / 2\n }\n\n const topHorizontal =\n top + targetBodySize.height / 2 - elementHeight / 2\n const leftVertical =\n left - elementWidth / 2 + targetBodySize.width / 2 + alignOffset\n\n const stylesFromPosition = {\n left: () => {\n style.top = topHorizontal\n style.left = left - elementWidth - offset.current\n },\n right: () => {\n style.top = topHorizontal\n style.left = left + targetBodySize.width + offset.current\n },\n top: () => {\n style.left = leftVertical\n style.top = top - elementHeight - offset.current\n },\n bottom: () => {\n style.left = leftVertical\n style.top = top + targetBodySize.height + offset.current\n },\n }\n\n const stylesFromArrow = {\n left: () => {\n style.left =\n left + targetBodySize.width / 2 - offset.current + alignOffset\n },\n right: () => {\n style.left =\n left -\n elementWidth +\n targetBodySize.width / 2 +\n offset.current +\n alignOffset\n },\n top: () => {\n style.top = top + targetBodySize.height / 2 - offset.current\n },\n bottom: () => {\n style.top =\n top + targetBodySize.height / 2 - elementHeight + offset.current\n },\n }\n\n stylesFromPosition[position]?.()\n stylesFromArrow[arrow]?.()\n\n const rightOffset =\n parseFloat(String(style.left)) + elementWidth - window.innerWidth\n if (rightOffset > 0) {\n style.left = window.innerWidth - elementWidth\n }\n if (parseFloat(String(style.left)) < 0) {\n style.left = 0\n if (position === 'top' || position === 'bottom') {\n const arrowWidth = 16 // 1rem\n const arrowStyleBasisWidth = left - arrowWidth / 2\n if (align === 'left') {\n arrowStyle.left = arrowStyleBasisWidth\n } else if (align === 'right') {\n arrowStyle.left = arrowStyleBasisWidth + targetBodySize.width\n } else {\n arrowStyle.left = arrowStyleBasisWidth + targetBodySize.width / 2\n }\n }\n }\n if (parseFloat(String(style.top)) < 0) {\n style.top = 0\n arrowStyle.top = 0\n }\n\n setStyle(style)\n setArrowStyle(arrowStyle)\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [active, arrow, position, children, renewStyles])\n\n const handleMouseEnter = () => {\n if (isTrue(active) && useHover !== false) {\n setHover(true)\n }\n }\n\n const handleMouseLeave = () => {\n if (useHover !== false) {\n setHover(false)\n }\n }\n\n /**\n * By stopping propagation, we allow the user to select text when Tooltip is used in the Slider component\n */\n const handlePropagation = (e: React.SyntheticEvent) =>\n e.stopPropagation()\n\n return (\n <span\n role=\"tooltip\"\n aria-hidden={target ? true : undefined} // make sure SR does not find it in the DOM, because we use \"aria-describedby\" for that\n ref={elementRef}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n onMouseMove={handlePropagation}\n onMouseDown={handlePropagation}\n onTouchStart={handlePropagation}\n {...attributes}\n className={classnames(\n attributes?.className,\n isTrue(noAnimation) && 'dnb-tooltip--no-animation',\n isTrue(fixedPosition) && 'dnb-tooltip--fixed',\n isActive && 'dnb-tooltip--active',\n !isActive && wasActive && 'dnb-tooltip--hide'\n )}\n style={{ ...style, ...attributes.style }}\n >\n {arrow && (\n <span\n className={classnames(\n 'dnb-tooltip__arrow',\n `dnb-tooltip__arrow__arrow--${arrow}`,\n `dnb-tooltip__arrow__position--${position}`\n )}\n style={{ ...arrowStyle }}\n />\n )}\n\n <span id={internalId} className=\"dnb-tooltip__content\">\n {children}\n </span>\n </span>\n )\n}\n"],"mappings":"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","ignoreList":[]}
@@ -15,7 +15,14 @@ export type ElementInternalProps = {
15
15
  export type ElementProps = {
16
16
  skeleton?: SkeletonShow;
17
17
  skeletonMethod?: SkeletonMethods;
18
- internalClass?: string;
18
+ /**
19
+ * As a string: replaces the default tag class `dnb-{TAG_NAME}` with a different class. Empty string does the same as default `undefined`.
20
+ *
21
+ * As a boolean: set it to `false` to disable the default tag class. `true` does the same as default `undefined`.
22
+ *
23
+ * Default: `undefined`
24
+ */
25
+ internalClass?: string | boolean;
19
26
  innerRef?: React.RefObject<HTMLElement> | React.ForwardedRef<unknown>;
20
27
  children?: React.ReactNode;
21
28
  } & SpacingProps;
@@ -26,7 +33,14 @@ export declare const defaultProps: {
26
33
  declare const Element: React.ForwardRefExoticComponent<{
27
34
  skeleton?: SkeletonShow;
28
35
  skeletonMethod?: SkeletonMethods;
29
- internalClass?: string;
36
+ /**
37
+ * As a string: replaces the default tag class `dnb-{TAG_NAME}` with a different class. Empty string does the same as default `undefined`.
38
+ *
39
+ * As a boolean: set it to `false` to disable the default tag class. `true` does the same as default `undefined`.
40
+ *
41
+ * Default: `undefined`
42
+ */
43
+ internalClass?: string | boolean;
30
44
  innerRef?: React.RefObject<HTMLElement> | React.ForwardedRef<unknown>;
31
45
  children?: React.ReactNode;
32
46
  } & import("../shared/types").SpacingElementProps & {
@@ -33,7 +33,7 @@ function ElementInstance(localProps) {
33
33
  rest = _objectWithoutProperties(props, _excluded);
34
34
  const Tag = as;
35
35
  const attributes = rest;
36
- const tagClass = internalClass || (typeof Tag === 'string' ? `dnb-${Tag}` : '');
36
+ const tagClass = internalClass === false ? '' : (internalClass === true ? undefined : internalClass) || (typeof Tag === 'string' ? `dnb-${Tag}` : '');
37
37
  const internalClassName = classnames(className, createSkeletonClass(skeletonMethod, skeleton, context), createSpacingClasses(attributes, typeof Tag === 'string' ? `dnb-${Tag}` : null), !new RegExp(`${tagClass}(\\s|$)`).test(String(className)) && tagClass);
38
38
  validateDOMAttributes(null, attributes);
39
39
  skeletonDOMAttributes(attributes, skeleton, context);
@@ -1 +1 @@
1
- {"version":3,"file":"Element.js","names":["React","classnames","Context","validateDOMAttributes","extendPropsWithContext","createSpacingClasses","createSkeletonClass","skeletonDOMAttributes","defaultProps","skeletonMethod","Element","forwardRef","props","ref","createElement","ElementInstance","_extends","innerRef","localProps","context","useContext","skeleton","className","internalClass","as","rest","_objectWithoutProperties","_excluded","Tag","attributes","tagClass","internalClassName","RegExp","test","String"],"sources":["../../../src/elements/Element.tsx"],"sourcesContent":["/**\n * This is mainly a Wrapper, to build more easily HTML Elements\n *\n */\n\nimport React from 'react'\nimport classnames from 'classnames'\nimport Context from '../shared/Context'\nimport {\n validateDOMAttributes,\n extendPropsWithContext,\n} from '../shared/component-helper'\nimport { createSpacingClasses } from '../components/space/SpacingHelper'\nimport {\n createSkeletonClass,\n skeletonDOMAttributes,\n SkeletonMethods,\n} from '../components/skeleton/SkeletonHelper'\nimport type { SkeletonShow } from '../components/skeleton/Skeleton'\n\nimport type { DynamicElement, SpacingProps } from '../shared/types'\n\nexport type ElementInternalProps = {\n /**\n * Defines the Element Type, like \"div\"\n */\n as: DynamicElement<unknown>\n}\n\nexport type ElementProps = {\n skeleton?: SkeletonShow\n skeletonMethod?: SkeletonMethods\n internalClass?: string\n innerRef?: React.RefObject<HTMLElement> | React.ForwardedRef<unknown>\n children?: React.ReactNode\n} & SpacingProps\n\nexport type ElementAllProps = ElementProps &\n ElementInternalProps &\n Omit<React.HTMLProps<HTMLElement>, 'ref' | 'as'>\n\ntype Attributes = Record<string, unknown>\n\nexport const defaultProps = {\n skeletonMethod: 'font',\n}\n\nconst Element = React.forwardRef((props: ElementAllProps, ref) => {\n return <ElementInstance innerRef={ref} {...props} />\n})\n\nfunction ElementInstance(localProps: ElementAllProps) {\n const context = React.useContext(Context)\n const props = extendPropsWithContext(localProps, defaultProps, {\n skeleton: context?.skeleton,\n })\n\n const {\n className,\n internalClass,\n as,\n innerRef,\n skeleton,\n skeletonMethod,\n ...rest\n } = props\n\n const Tag = as\n const attributes = rest as Attributes\n\n const tagClass =\n internalClass || (typeof Tag === 'string' ? `dnb-${Tag}` : '')\n const internalClassName = classnames(\n !new RegExp(`${tagClass}(\\\\s|$)`).test(String(className)) && tagClass,\n className,\n createSkeletonClass(skeletonMethod, skeleton, context),\n createSpacingClasses(\n attributes,\n typeof Tag === 'string' ? `dnb-${Tag}` : null\n )\n )\n\n validateDOMAttributes(null, attributes)\n\n skeletonDOMAttributes(attributes, skeleton, context)\n\n if (typeof Tag !== 'function' && innerRef) {\n attributes.ref = innerRef\n }\n\n return <Tag className={internalClassName} {...attributes} />\n}\n\nexport default Element\n"],"mappings":";;;;;AAKA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,OAAO,MAAM,mBAAmB;AACvC,SACEC,qBAAqB,EACrBC,sBAAsB,QACjB,4BAA4B;AACnC,SAASC,oBAAoB,QAAQ,mCAAmC;AACxE,SACEC,mBAAmB,EACnBC,qBAAqB,QAEhB,uCAAuC;AA0B9C,OAAO,MAAMC,YAAY,GAAG;EAC1BC,cAAc,EAAE;AAClB,CAAC;AAED,MAAMC,OAAO,GAAGV,KAAK,CAACW,UAAU,CAAC,CAACC,KAAsB,EAAEC,GAAG,KAAK;EAChE,OAAOb,KAAA,CAAAc,aAAA,CAACC,eAAe,EAAAC,QAAA;IAACC,QAAQ,EAAEJ;EAAI,GAAKD,KAAK,CAAG,CAAC;AACtD,CAAC,CAAC;AAEF,SAASG,eAAeA,CAACG,UAA2B,EAAE;EACpD,MAAMC,OAAO,GAAGnB,KAAK,CAACoB,UAAU,CAAClB,OAAO,CAAC;EACzC,MAAMU,KAAK,GAAGR,sBAAsB,CAACc,UAAU,EAAEV,YAAY,EAAE;IAC7Da,QAAQ,EAAEF,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEE;EACrB,CAAC,CAAC;EAEF,MAAM;MACJC,SAAS;MACTC,aAAa;MACbC,EAAE;MACFP,QAAQ;MACRI,QAAQ;MACRZ;IAEF,CAAC,GAAGG,KAAK;IADJa,IAAI,GAAAC,wBAAA,CACLd,KAAK,EAAAe,SAAA;EAET,MAAMC,GAAG,GAAGJ,EAAE;EACd,MAAMK,UAAU,GAAGJ,IAAkB;EAErC,MAAMK,QAAQ,GACZP,aAAa,KAAK,OAAOK,GAAG,KAAK,QAAQ,GAAG,OAAOA,GAAG,EAAE,GAAG,EAAE,CAAC;EAChE,MAAMG,iBAAiB,GAAG9B,UAAU,CAElCqB,SAAS,EACThB,mBAAmB,CAACG,cAAc,EAAEY,QAAQ,EAAEF,OAAO,CAAC,EACtDd,oBAAoB,CAClBwB,UAAU,EACV,OAAOD,GAAG,KAAK,QAAQ,GAAG,OAAOA,GAAG,EAAE,GAAG,IAC3C,CAAC,EAND,CAAC,IAAII,MAAM,CAAC,GAAGF,QAAQ,SAAS,CAAC,CAACG,IAAI,CAACC,MAAM,CAACZ,SAAS,CAAC,CAAC,IAAIQ,QAO/D,CAAC;EAED3B,qBAAqB,CAAC,IAAI,EAAE0B,UAAU,CAAC;EAEvCtB,qBAAqB,CAACsB,UAAU,EAAER,QAAQ,EAAEF,OAAO,CAAC;EAEpD,IAAI,OAAOS,GAAG,KAAK,UAAU,IAAIX,QAAQ,EAAE;IACzCY,UAAU,CAAChB,GAAG,GAAGI,QAAQ;EAC3B;EAEA,OAAOjB,KAAA,CAAAc,aAAA,CAACc,GAAG,EAAAZ,QAAA;IAACM,SAAS,EAAES;EAAkB,GAAKF,UAAU,CAAG,CAAC;AAC9D;AAEA,eAAenB,OAAO","ignoreList":[]}
1
+ {"version":3,"file":"Element.js","names":["React","classnames","Context","validateDOMAttributes","extendPropsWithContext","createSpacingClasses","createSkeletonClass","skeletonDOMAttributes","defaultProps","skeletonMethod","Element","forwardRef","props","ref","createElement","ElementInstance","_extends","innerRef","localProps","context","useContext","skeleton","className","internalClass","as","rest","_objectWithoutProperties","_excluded","Tag","attributes","tagClass","undefined","internalClassName","RegExp","test","String"],"sources":["../../../src/elements/Element.tsx"],"sourcesContent":["/**\n * This is mainly a Wrapper, to build more easily HTML Elements\n *\n */\n\nimport React from 'react'\nimport classnames from 'classnames'\nimport Context from '../shared/Context'\nimport {\n validateDOMAttributes,\n extendPropsWithContext,\n} from '../shared/component-helper'\nimport { createSpacingClasses } from '../components/space/SpacingHelper'\nimport {\n createSkeletonClass,\n skeletonDOMAttributes,\n SkeletonMethods,\n} from '../components/skeleton/SkeletonHelper'\nimport type { SkeletonShow } from '../components/skeleton/Skeleton'\n\nimport type { DynamicElement, SpacingProps } from '../shared/types'\n\nexport type ElementInternalProps = {\n /**\n * Defines the Element Type, like \"div\"\n */\n as: DynamicElement<unknown>\n}\n\nexport type ElementProps = {\n skeleton?: SkeletonShow\n skeletonMethod?: SkeletonMethods\n /**\n * As a string: replaces the default tag class `dnb-{TAG_NAME}` with a different class. Empty string does the same as default `undefined`.\n *\n * As a boolean: set it to `false` to disable the default tag class. `true` does the same as default `undefined`.\n *\n * Default: `undefined`\n */\n internalClass?: string | boolean\n innerRef?: React.RefObject<HTMLElement> | React.ForwardedRef<unknown>\n children?: React.ReactNode\n} & SpacingProps\n\nexport type ElementAllProps = ElementProps &\n ElementInternalProps &\n Omit<React.HTMLProps<HTMLElement>, 'ref' | 'as'>\n\ntype Attributes = Record<string, unknown>\n\nexport const defaultProps = {\n skeletonMethod: 'font',\n}\n\nconst Element = React.forwardRef((props: ElementAllProps, ref) => {\n return <ElementInstance innerRef={ref} {...props} />\n})\n\nfunction ElementInstance(localProps: ElementAllProps) {\n const context = React.useContext(Context)\n const props = extendPropsWithContext(localProps, defaultProps, {\n skeleton: context?.skeleton,\n })\n\n const {\n className,\n internalClass,\n as,\n innerRef,\n skeleton,\n skeletonMethod,\n ...rest\n } = props\n\n const Tag = as\n const attributes = rest as Attributes\n\n const tagClass =\n internalClass === false\n ? ''\n : (internalClass === true ? undefined : internalClass) ||\n (typeof Tag === 'string' ? `dnb-${Tag}` : '')\n\n const internalClassName = classnames(\n !new RegExp(`${tagClass}(\\\\s|$)`).test(String(className)) && tagClass,\n className,\n createSkeletonClass(skeletonMethod, skeleton, context),\n createSpacingClasses(\n attributes,\n typeof Tag === 'string' ? `dnb-${Tag}` : null\n )\n )\n\n validateDOMAttributes(null, attributes)\n\n skeletonDOMAttributes(attributes, skeleton, context)\n\n if (typeof Tag !== 'function' && innerRef) {\n attributes.ref = innerRef\n }\n\n return <Tag className={internalClassName} {...attributes} />\n}\n\nexport default Element\n"],"mappings":";;;;;AAKA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,OAAO,MAAM,mBAAmB;AACvC,SACEC,qBAAqB,EACrBC,sBAAsB,QACjB,4BAA4B;AACnC,SAASC,oBAAoB,QAAQ,mCAAmC;AACxE,SACEC,mBAAmB,EACnBC,qBAAqB,QAEhB,uCAAuC;AAiC9C,OAAO,MAAMC,YAAY,GAAG;EAC1BC,cAAc,EAAE;AAClB,CAAC;AAED,MAAMC,OAAO,GAAGV,KAAK,CAACW,UAAU,CAAC,CAACC,KAAsB,EAAEC,GAAG,KAAK;EAChE,OAAOb,KAAA,CAAAc,aAAA,CAACC,eAAe,EAAAC,QAAA;IAACC,QAAQ,EAAEJ;EAAI,GAAKD,KAAK,CAAG,CAAC;AACtD,CAAC,CAAC;AAEF,SAASG,eAAeA,CAACG,UAA2B,EAAE;EACpD,MAAMC,OAAO,GAAGnB,KAAK,CAACoB,UAAU,CAAClB,OAAO,CAAC;EACzC,MAAMU,KAAK,GAAGR,sBAAsB,CAACc,UAAU,EAAEV,YAAY,EAAE;IAC7Da,QAAQ,EAAEF,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEE;EACrB,CAAC,CAAC;EAEF,MAAM;MACJC,SAAS;MACTC,aAAa;MACbC,EAAE;MACFP,QAAQ;MACRI,QAAQ;MACRZ;IAEF,CAAC,GAAGG,KAAK;IADJa,IAAI,GAAAC,wBAAA,CACLd,KAAK,EAAAe,SAAA;EAET,MAAMC,GAAG,GAAGJ,EAAE;EACd,MAAMK,UAAU,GAAGJ,IAAkB;EAErC,MAAMK,QAAQ,GACZP,aAAa,KAAK,KAAK,GACnB,EAAE,GACF,CAACA,aAAa,KAAK,IAAI,GAAGQ,SAAS,GAAGR,aAAa,MAClD,OAAOK,GAAG,KAAK,QAAQ,GAAG,OAAOA,GAAG,EAAE,GAAG,EAAE,CAAC;EAEnD,MAAMI,iBAAiB,GAAG/B,UAAU,CAElCqB,SAAS,EACThB,mBAAmB,CAACG,cAAc,EAAEY,QAAQ,EAAEF,OAAO,CAAC,EACtDd,oBAAoB,CAClBwB,UAAU,EACV,OAAOD,GAAG,KAAK,QAAQ,GAAG,OAAOA,GAAG,EAAE,GAAG,IAC3C,CAAC,EAND,CAAC,IAAIK,MAAM,CAAC,GAAGH,QAAQ,SAAS,CAAC,CAACI,IAAI,CAACC,MAAM,CAACb,SAAS,CAAC,CAAC,IAAIQ,QAO/D,CAAC;EAED3B,qBAAqB,CAAC,IAAI,EAAE0B,UAAU,CAAC;EAEvCtB,qBAAqB,CAACsB,UAAU,EAAER,QAAQ,EAAEF,OAAO,CAAC;EAEpD,IAAI,OAAOS,GAAG,KAAK,UAAU,IAAIX,QAAQ,EAAE;IACzCY,UAAU,CAAChB,GAAG,GAAGI,QAAQ;EAC3B;EAEA,OAAOjB,KAAA,CAAAc,aAAA,CAACc,GAAG,EAAAZ,QAAA;IAACM,SAAS,EAAEU;EAAkB,GAAKH,UAAU,CAAG,CAAC;AAC9D;AAEA,eAAenB,OAAO","ignoreList":[]}
package/elements/lib.d.ts CHANGED
@@ -79,7 +79,7 @@ export declare const getElements: () => {
79
79
  } & {
80
80
  skeleton?: boolean;
81
81
  skeletonMethod?: import("../components/skeleton/SkeletonHelper").SkeletonMethods;
82
- internalClass?: string;
82
+ internalClass?: string | boolean;
83
83
  innerRef?: import("react").ForwardedRef<unknown> | import("react").RefObject<HTMLElement>;
84
84
  children?: import("react").ReactNode;
85
85
  }): import("react/jsx-runtime").JSX.Element;
@@ -64,6 +64,7 @@ export function AnchorInstance(localProps) {
64
64
  return React.createElement(React.Fragment, null, React.createElement(E, _extends({
65
65
  as: as,
66
66
  id: id,
67
+ internalClass: as !== 'button',
67
68
  className: classnames(className, omitClass !== true && classnames('dnb-anchor', prefix && 'dnb-anchor--icon-left', suffix && 'dnb-anchor--icon-right', typeof children !== 'string' && 'dnb-anchor--was-node', noAnimation && 'dnb-anchor--no-animation', noHover && 'dnb-anchor--no-hover', noStyle && 'dnb-anchor--no-style', noUnderline && 'dnb-anchor--no-underline'))
68
69
  }, attributes, {
69
70
  innerRef: innerRef
@@ -1 +1 @@
1
- {"version":3,"file":"Anchor.js","names":["React","classnames","E","Context","makeUniqueId","extendPropsWithContext","getOffsetTop","warn","IconPrimary","Tooltip","launch","launchIcon","defaultProps","noAnimation","noStyle","noHover","noUnderline","AnchorInstance","localProps","context","useContext","allProps","skeleton","getTranslation","Anchor","inner_ref","innerRef","createRef","id","element","className","children","tooltip","icon","iconPosition","omitClass","targetBlankTitle","rest","_objectWithoutProperties","_excluded","attributes","internalId","as","href","to","_opensNewTab","opensNewTab","target","showLaunchIcon","includes","showTooltip","title","iconNode","getIcon","suffix","_IconPrimary","createElement","prefix","Fragment","_extends","showDelay","targetElement","forwardRef","props","ref","_supportsSpacingProps","scrollToHashHandler","event","_element$pathname","currentTarget","getAttribute","document","isSamePath","startsWith","window","location","pathname","replace","scrollToHash","hash","split","reverse","anchorElem","getElementById","HTMLElement","scrollPadding","parseFloat","getComputedStyle","documentElement","scrollPaddingTop","top","scroll","error","console","pickIcon","_icon$props","_icon$props2","_icon$props2$classNam","_icon$props3","cloneElement","key","test"],"sources":["../../../../src/components/anchor/Anchor.tsx"],"sourcesContent":["/**\n * HTML Element\n *\n */\n\nimport React from 'react'\nimport classnames from 'classnames'\nimport E, { ElementProps } from '../../elements/Element'\nimport Context from '../../shared/Context'\nimport {\n makeUniqueId,\n extendPropsWithContext,\n} from '../../shared/component-helper'\nimport { getOffsetTop, warn } from '../../shared/helpers'\nimport IconPrimary from '../icon-primary/IconPrimary'\nimport Tooltip from '../tooltip/Tooltip'\nimport { launch as launchIcon } from '../../icons'\nimport type { IconIcon } from '../icon/Icon'\nimport type { SkeletonShow } from '../skeleton/Skeleton'\nimport type { DynamicElement, SpacingProps } from '../../shared/types'\n\n// Local type for react-router-dom link with only the necessary props. Done this way to prevent react-router-dom dependency.\ntype ReactRouterLink = Omit<\n React.AnchorHTMLAttributes<HTMLAnchorElement>,\n 'href'\n> & {\n to: string | { pathname?: string; search?: string; has?: string }\n}\n\nexport type AnchorProps = {\n element?:\n | DynamicElement<HTMLAnchorElement | AnchorAllProps>\n | React.ForwardRefExoticComponent<\n ReactRouterLink & React.RefAttributes<HTMLAnchorElement>\n >\n href?: string\n to?: string\n targetBlankTitle?: string\n target?: string\n tooltip?: React.ReactNode\n icon?: IconIcon\n iconPosition?: 'left' | 'right'\n skeleton?: SkeletonShow\n omitClass?: boolean\n innerRef?: React.RefObject<HTMLAnchorElement>\n\n /** @deprecated use innerRef instead */\n inner_ref?: React.RefObject<HTMLAnchorElement>\n /**\n * Removes default animation.\n * Default: `false`\n */\n noAnimation?: boolean\n /**\n * Removes default styling.\n * Default: `false`\n */\n noStyle?: boolean\n /**\n * Removes default hover style.\n * Default: `false`\n */\n noHover?: boolean\n /**\n * Removes underline.\n * Default: `false`\n */\n noUnderline?: boolean\n}\n\nexport type AnchorAllProps = AnchorProps &\n Omit<React.HTMLProps<HTMLAnchorElement>, 'ref'> &\n SpacingProps\n\nconst defaultProps = {\n noAnimation: false,\n noStyle: false,\n noHover: false,\n noUnderline: false,\n}\n\nexport function AnchorInstance(localProps: AnchorAllProps) {\n const context = React.useContext(Context)\n const allProps = extendPropsWithContext(\n localProps,\n defaultProps,\n { skeleton: context?.skeleton },\n context?.getTranslation(localProps as AnchorAllProps).Anchor,\n context?.Anchor\n )\n\n // deprecated: inner_ref is still needed to support Button's usage of Anchor\n if (typeof allProps.inner_ref !== 'undefined') {\n allProps.innerRef = allProps.inner_ref\n delete allProps.inner_ref\n }\n\n if (!allProps.innerRef) {\n allProps.innerRef = React.createRef()\n }\n\n const {\n id,\n element,\n className,\n children,\n tooltip,\n icon,\n iconPosition = 'left',\n omitClass,\n innerRef,\n targetBlankTitle,\n noAnimation,\n noHover,\n noStyle,\n noUnderline,\n ...rest\n } = allProps\n\n const attributes = rest as ElementProps\n const internalId = id || 'id' + makeUniqueId()\n const as = element || 'a'\n\n const href = allProps.href || allProps.to\n const _opensNewTab = opensNewTab(allProps.target, href)\n const showLaunchIcon =\n _opensNewTab &&\n !className?.includes('dnb-anchor--no-icon') &&\n !className?.includes('dnb-anchor--no-launch-icon') &&\n !omitClass\n const showTooltip = (tooltip || _opensNewTab) && !allProps.title\n\n const iconNode = icon && getIcon(icon)\n\n const suffix =\n (iconPosition === 'right' && iconNode) ||\n (showLaunchIcon && (\n <IconPrimary className=\"dnb-anchor__launch-icon\" icon={launchIcon} />\n ))\n\n const prefix = iconPosition === 'left' && iconNode\n\n return (\n <>\n <E\n as={as}\n id={id}\n className={classnames(\n omitClass !== true &&\n classnames(\n 'dnb-anchor',\n prefix && 'dnb-anchor--icon-left',\n suffix && 'dnb-anchor--icon-right',\n typeof children !== 'string' && 'dnb-anchor--was-node',\n noAnimation && 'dnb-anchor--no-animation',\n noHover && 'dnb-anchor--no-hover',\n noStyle && 'dnb-anchor--no-style',\n noUnderline && 'dnb-anchor--no-underline'\n ),\n className\n )}\n {...attributes}\n innerRef={innerRef}\n >\n {prefix}\n {children}\n {suffix}\n </E>\n\n {showTooltip && (\n <Tooltip\n showDelay={100}\n id={internalId + '-tooltip'}\n targetElement={innerRef}\n tooltip={tooltip}\n >\n {allProps.title || targetBlankTitle}\n </Tooltip>\n )}\n </>\n )\n}\n\nconst Anchor = React.forwardRef(\n (props: AnchorAllProps, ref: React.RefObject<HTMLAnchorElement>) => {\n return <AnchorInstance innerRef={ref} {...props} />\n }\n)\n\n// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-ignore\nAnchor._supportsSpacingProps = true\n\nexport default Anchor\n\n/**\n * @deprecated – can be removed in v11\n */\nexport function scrollToHashHandler(\n event: React.MouseEvent<HTMLAnchorElement, MouseEvent>\n) {\n warn('\"scrollToHashHandler\" is deprecated.')\n\n const element = event.currentTarget as HTMLAnchorElement\n const href = element.getAttribute('href')\n\n if (typeof document === 'undefined' || !href.includes('#')) {\n return // stop here\n }\n\n /**\n * What happens here?\n * When `scroll-behavior: smooth;` in CSS is set,\n * Blink/Chromium wants the user to click two times in order to actually scroll to the anchor hash.\n * The first click, sets the hash, the second one, scrolls to it.\n * We want Chromium browsers to scroll to the element on the first click.\n */\n const isSamePath =\n href.startsWith('#') ||\n window.location.href.includes(element.pathname?.replace(/\\/$/, ''))\n\n // Only continue, when we are sure we are on the same page,\n // because, the same ID may exists occasionally on the current page.\n if (isSamePath) {\n return scrollToHash(href)\n }\n}\n\nexport function scrollToHash(hash: string) {\n if (typeof document === 'undefined' || !hash || !hash.includes('#')) {\n return // stop here\n }\n\n // Only continue, when we are sure we are on the same page,\n // because, the same ID may exists occasionally on the current page.\n const id = hash.split(/#/g).reverse()[0]\n const anchorElem = document.getElementById(id)\n\n if (anchorElem instanceof HTMLElement) {\n try {\n const scrollPadding = parseFloat(\n window.getComputedStyle(document.documentElement).scrollPaddingTop\n )\n const top = getOffsetTop(anchorElem) - scrollPadding || 0\n\n window.scroll({ top })\n\n return { element: anchorElem }\n } catch (error) {\n console.error(error)\n }\n }\n}\n\nfunction getIcon(icon) {\n return pickIcon(icon) || <IconPrimary icon={icon} />\n}\n\nexport function pickIcon(icon, className?: string) {\n return icon?.props?.icon || icon?.props?.className?.includes('dnb-icon')\n ? React.cloneElement(icon, {\n key: 'button-icon-clone',\n className: classnames(icon.props?.className, className),\n })\n : null\n}\n\nexport const opensNewTab = (target: string, href: string): boolean =>\n target === '_blank' && !/^(mailto|tel|sms)/.test(href)\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"Anchor.js","names":["React","classnames","E","Context","makeUniqueId","extendPropsWithContext","getOffsetTop","warn","IconPrimary","Tooltip","launch","launchIcon","defaultProps","noAnimation","noStyle","noHover","noUnderline","AnchorInstance","localProps","context","useContext","allProps","skeleton","getTranslation","Anchor","inner_ref","innerRef","createRef","id","element","className","children","tooltip","icon","iconPosition","omitClass","targetBlankTitle","rest","_objectWithoutProperties","_excluded","attributes","internalId","as","href","to","_opensNewTab","opensNewTab","target","showLaunchIcon","includes","showTooltip","title","iconNode","getIcon","suffix","_IconPrimary","createElement","prefix","Fragment","_extends","internalClass","showDelay","targetElement","forwardRef","props","ref","_supportsSpacingProps","scrollToHashHandler","event","_element$pathname","currentTarget","getAttribute","document","isSamePath","startsWith","window","location","pathname","replace","scrollToHash","hash","split","reverse","anchorElem","getElementById","HTMLElement","scrollPadding","parseFloat","getComputedStyle","documentElement","scrollPaddingTop","top","scroll","error","console","pickIcon","_icon$props","_icon$props2","_icon$props2$classNam","_icon$props3","cloneElement","key","test"],"sources":["../../../../src/components/anchor/Anchor.tsx"],"sourcesContent":["/**\n * HTML Element\n *\n */\n\nimport React from 'react'\nimport classnames from 'classnames'\nimport E, { ElementProps } from '../../elements/Element'\nimport Context from '../../shared/Context'\nimport {\n makeUniqueId,\n extendPropsWithContext,\n} from '../../shared/component-helper'\nimport { getOffsetTop, warn } from '../../shared/helpers'\nimport IconPrimary from '../icon-primary/IconPrimary'\nimport Tooltip from '../tooltip/Tooltip'\nimport { launch as launchIcon } from '../../icons'\nimport type { IconIcon } from '../icon/Icon'\nimport type { SkeletonShow } from '../skeleton/Skeleton'\nimport type { DynamicElement, SpacingProps } from '../../shared/types'\n\n// Local type for react-router-dom link with only the necessary props. Done this way to prevent react-router-dom dependency.\ntype ReactRouterLink = Omit<\n React.AnchorHTMLAttributes<HTMLAnchorElement>,\n 'href'\n> & {\n to: string | { pathname?: string; search?: string; has?: string }\n}\n\nexport type AnchorProps = {\n element?:\n | DynamicElement<HTMLAnchorElement | AnchorAllProps>\n | React.ForwardRefExoticComponent<\n ReactRouterLink & React.RefAttributes<HTMLAnchorElement>\n >\n href?: string\n to?: string\n targetBlankTitle?: string\n target?: string\n tooltip?: React.ReactNode\n icon?: IconIcon\n iconPosition?: 'left' | 'right'\n skeleton?: SkeletonShow\n omitClass?: boolean\n innerRef?: React.RefObject<HTMLAnchorElement>\n\n /** @deprecated use innerRef instead */\n inner_ref?: React.RefObject<HTMLAnchorElement>\n /**\n * Removes default animation.\n * Default: `false`\n */\n noAnimation?: boolean\n /**\n * Removes default styling.\n * Default: `false`\n */\n noStyle?: boolean\n /**\n * Removes default hover style.\n * Default: `false`\n */\n noHover?: boolean\n /**\n * Removes underline.\n * Default: `false`\n */\n noUnderline?: boolean\n}\n\nexport type AnchorAllProps = AnchorProps &\n Omit<React.HTMLProps<HTMLAnchorElement>, 'ref'> &\n SpacingProps\n\nconst defaultProps = {\n noAnimation: false,\n noStyle: false,\n noHover: false,\n noUnderline: false,\n}\n\nexport function AnchorInstance(localProps: AnchorAllProps) {\n const context = React.useContext(Context)\n const allProps = extendPropsWithContext(\n localProps,\n defaultProps,\n { skeleton: context?.skeleton },\n context?.getTranslation(localProps as AnchorAllProps).Anchor,\n context?.Anchor\n )\n\n // deprecated: inner_ref is still needed to support Button's usage of Anchor\n if (typeof allProps.inner_ref !== 'undefined') {\n allProps.innerRef = allProps.inner_ref\n delete allProps.inner_ref\n }\n\n if (!allProps.innerRef) {\n allProps.innerRef = React.createRef()\n }\n\n const {\n id,\n element,\n className,\n children,\n tooltip,\n icon,\n iconPosition = 'left',\n omitClass,\n innerRef,\n targetBlankTitle,\n noAnimation,\n noHover,\n noStyle,\n noUnderline,\n ...rest\n } = allProps\n\n const attributes = rest as ElementProps\n const internalId = id || 'id' + makeUniqueId()\n const as = element || 'a'\n\n const href = allProps.href || allProps.to\n const _opensNewTab = opensNewTab(allProps.target, href)\n const showLaunchIcon =\n _opensNewTab &&\n !className?.includes('dnb-anchor--no-icon') &&\n !className?.includes('dnb-anchor--no-launch-icon') &&\n !omitClass\n const showTooltip = (tooltip || _opensNewTab) && !allProps.title\n\n const iconNode = icon && getIcon(icon)\n\n const suffix =\n (iconPosition === 'right' && iconNode) ||\n (showLaunchIcon && (\n <IconPrimary className=\"dnb-anchor__launch-icon\" icon={launchIcon} />\n ))\n\n const prefix = iconPosition === 'left' && iconNode\n\n return (\n <>\n <E\n as={as}\n id={id}\n internalClass={as !== 'button'}\n className={classnames(\n omitClass !== true &&\n classnames(\n 'dnb-anchor',\n prefix && 'dnb-anchor--icon-left',\n suffix && 'dnb-anchor--icon-right',\n typeof children !== 'string' && 'dnb-anchor--was-node',\n noAnimation && 'dnb-anchor--no-animation',\n noHover && 'dnb-anchor--no-hover',\n noStyle && 'dnb-anchor--no-style',\n noUnderline && 'dnb-anchor--no-underline'\n ),\n className\n )}\n {...attributes}\n innerRef={innerRef}\n >\n {prefix}\n {children}\n {suffix}\n </E>\n\n {showTooltip && (\n <Tooltip\n showDelay={100}\n id={internalId + '-tooltip'}\n targetElement={innerRef}\n tooltip={tooltip}\n >\n {allProps.title || targetBlankTitle}\n </Tooltip>\n )}\n </>\n )\n}\n\nconst Anchor = React.forwardRef(\n (props: AnchorAllProps, ref: React.RefObject<HTMLAnchorElement>) => {\n return <AnchorInstance innerRef={ref} {...props} />\n }\n)\n\n// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-ignore\nAnchor._supportsSpacingProps = true\n\nexport default Anchor\n\n/**\n * @deprecated – can be removed in v11\n */\nexport function scrollToHashHandler(\n event: React.MouseEvent<HTMLAnchorElement, MouseEvent>\n) {\n warn('\"scrollToHashHandler\" is deprecated.')\n\n const element = event.currentTarget as HTMLAnchorElement\n const href = element.getAttribute('href')\n\n if (typeof document === 'undefined' || !href.includes('#')) {\n return // stop here\n }\n\n /**\n * What happens here?\n * When `scroll-behavior: smooth;` in CSS is set,\n * Blink/Chromium wants the user to click two times in order to actually scroll to the anchor hash.\n * The first click, sets the hash, the second one, scrolls to it.\n * We want Chromium browsers to scroll to the element on the first click.\n */\n const isSamePath =\n href.startsWith('#') ||\n window.location.href.includes(element.pathname?.replace(/\\/$/, ''))\n\n // Only continue, when we are sure we are on the same page,\n // because, the same ID may exists occasionally on the current page.\n if (isSamePath) {\n return scrollToHash(href)\n }\n}\n\nexport function scrollToHash(hash: string) {\n if (typeof document === 'undefined' || !hash || !hash.includes('#')) {\n return // stop here\n }\n\n // Only continue, when we are sure we are on the same page,\n // because, the same ID may exists occasionally on the current page.\n const id = hash.split(/#/g).reverse()[0]\n const anchorElem = document.getElementById(id)\n\n if (anchorElem instanceof HTMLElement) {\n try {\n const scrollPadding = parseFloat(\n window.getComputedStyle(document.documentElement).scrollPaddingTop\n )\n const top = getOffsetTop(anchorElem) - scrollPadding || 0\n\n window.scroll({ top })\n\n return { element: anchorElem }\n } catch (error) {\n console.error(error)\n }\n }\n}\n\nfunction getIcon(icon) {\n return pickIcon(icon) || <IconPrimary icon={icon} />\n}\n\nexport function pickIcon(icon, className?: string) {\n return icon?.props?.icon || icon?.props?.className?.includes('dnb-icon')\n ? React.cloneElement(icon, {\n key: 'button-icon-clone',\n className: classnames(icon.props?.className, className),\n })\n : null\n}\n\nexport const opensNewTab = (target: string, href: string): boolean =>\n target === '_blank' && !/^(mailto|tel|sms)/.test(href)\n"],"mappings":"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","ignoreList":[]}
@@ -1,6 +1,6 @@
1
1
  export const CardProperties = {
2
2
  outset: {
3
- doc: 'True to break out negatively on larger screens. Defaults to `false`.',
3
+ doc: 'Whether or not to break out (using negative margins) on larger screens. Defaults to `false`.',
4
4
  type: 'boolean',
5
5
  status: 'optional'
6
6
  },
@@ -1 +1 @@
1
- {"version":3,"file":"CardDocs.js","names":["CardProperties","outset","doc","type","status","stack","direction","alignSelf","title","responsive","filled","element","children"],"sources":["../../../../src/components/card/CardDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../shared/types'\n\nexport const CardProperties: PropertiesTableProps = {\n outset: {\n doc: 'True to break out negatively on larger screens. Defaults to `false`.',\n type: 'boolean',\n status: 'optional',\n },\n stack: {\n doc: 'True to stack the sub components with lines between. The `spacing` will default to `medium`.',\n type: 'boolean',\n status: 'optional',\n },\n direction: {\n doc: 'Defaults to `vertical`.',\n type: 'string',\n status: 'optional',\n },\n alignSelf: {\n doc: 'Defaults to `stretch`.',\n type: 'string',\n status: 'optional',\n },\n title: {\n doc: 'Define a title that appears on top of the Card.',\n type: 'React.Node',\n status: 'optional',\n },\n responsive: {\n doc: 'Define if the card should behave responsive. Defaults to `true`.',\n type: 'boolean',\n status: 'optional',\n },\n filled: {\n doc: 'Define if the Card should get the same background color as the outline border.',\n type: 'boolean',\n status: 'optional',\n },\n element: {\n doc: 'Define the type of element. Defaults to `section`.',\n type: 'React.Element',\n status: 'optional',\n },\n children: {\n doc: 'Contents.',\n type: 'React.Node',\n status: 'required',\n },\n '[Flex.Container](/uilib/layout/flex/container/properties)': {\n doc: 'Flex.Container properties.',\n type: 'Various',\n status: 'optional',\n },\n '[Flex.Item](/uilib/layout/flex/item/properties)': {\n doc: 'Flex.Item properties.',\n type: 'Various',\n status: 'optional',\n },\n '[Space](/uilib/layout/space/properties)': {\n doc: 'Spacing properties like `top` or `bottom` are supported.',\n type: ['string', 'object'],\n status: 'optional',\n },\n}\n"],"mappings":"AAEA,OAAO,MAAMA,cAAoC,GAAG;EAClDC,MAAM,EAAE;IACNC,GAAG,EAAE,sEAAsE;IAC3EC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDC,KAAK,EAAE;IACLH,GAAG,EAAE,8FAA8F;IACnGC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDE,SAAS,EAAE;IACTJ,GAAG,EAAE,yBAAyB;IAC9BC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDG,SAAS,EAAE;IACTL,GAAG,EAAE,wBAAwB;IAC7BC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDI,KAAK,EAAE;IACLN,GAAG,EAAE,iDAAiD;IACtDC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV,CAAC;EACDK,UAAU,EAAE;IACVP,GAAG,EAAE,kEAAkE;IACvEC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDM,MAAM,EAAE;IACNR,GAAG,EAAE,gFAAgF;IACrFC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDO,OAAO,EAAE;IACPT,GAAG,EAAE,oDAAoD;IACzDC,IAAI,EAAE,eAAe;IACrBC,MAAM,EAAE;EACV,CAAC;EACDQ,QAAQ,EAAE;IACRV,GAAG,EAAE,WAAW;IAChBC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV,CAAC;EACD,2DAA2D,EAAE;IAC3DF,GAAG,EAAE,4BAA4B;IACjCC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACD,iDAAiD,EAAE;IACjDF,GAAG,EAAE,uBAAuB;IAC5BC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACD,yCAAyC,EAAE;IACzCF,GAAG,EAAE,0DAA0D;IAC/DC,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;IAC1BC,MAAM,EAAE;EACV;AACF,CAAC","ignoreList":[]}
1
+ {"version":3,"file":"CardDocs.js","names":["CardProperties","outset","doc","type","status","stack","direction","alignSelf","title","responsive","filled","element","children"],"sources":["../../../../src/components/card/CardDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../shared/types'\n\nexport const CardProperties: PropertiesTableProps = {\n outset: {\n doc: 'Whether or not to break out (using negative margins) on larger screens. Defaults to `false`.',\n type: 'boolean',\n status: 'optional',\n },\n stack: {\n doc: 'True to stack the sub components with lines between. The `spacing` will default to `medium`.',\n type: 'boolean',\n status: 'optional',\n },\n direction: {\n doc: 'Defaults to `vertical`.',\n type: 'string',\n status: 'optional',\n },\n alignSelf: {\n doc: 'Defaults to `stretch`.',\n type: 'string',\n status: 'optional',\n },\n title: {\n doc: 'Define a title that appears on top of the Card.',\n type: 'React.Node',\n status: 'optional',\n },\n responsive: {\n doc: 'Define if the card should behave responsive. Defaults to `true`.',\n type: 'boolean',\n status: 'optional',\n },\n filled: {\n doc: 'Define if the Card should get the same background color as the outline border.',\n type: 'boolean',\n status: 'optional',\n },\n element: {\n doc: 'Define the type of element. Defaults to `section`.',\n type: 'React.Element',\n status: 'optional',\n },\n children: {\n doc: 'Contents.',\n type: 'React.Node',\n status: 'required',\n },\n '[Flex.Container](/uilib/layout/flex/container/properties)': {\n doc: 'Flex.Container properties.',\n type: 'Various',\n status: 'optional',\n },\n '[Flex.Item](/uilib/layout/flex/item/properties)': {\n doc: 'Flex.Item properties.',\n type: 'Various',\n status: 'optional',\n },\n '[Space](/uilib/layout/space/properties)': {\n doc: 'Spacing properties like `top` or `bottom` are supported.',\n type: ['string', 'object'],\n status: 'optional',\n },\n}\n"],"mappings":"AAEA,OAAO,MAAMA,cAAoC,GAAG;EAClDC,MAAM,EAAE;IACNC,GAAG,EAAE,8FAA8F;IACnGC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDC,KAAK,EAAE;IACLH,GAAG,EAAE,8FAA8F;IACnGC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDE,SAAS,EAAE;IACTJ,GAAG,EAAE,yBAAyB;IAC9BC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDG,SAAS,EAAE;IACTL,GAAG,EAAE,wBAAwB;IAC7BC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDI,KAAK,EAAE;IACLN,GAAG,EAAE,iDAAiD;IACtDC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV,CAAC;EACDK,UAAU,EAAE;IACVP,GAAG,EAAE,kEAAkE;IACvEC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDM,MAAM,EAAE;IACNR,GAAG,EAAE,gFAAgF;IACrFC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDO,OAAO,EAAE;IACPT,GAAG,EAAE,oDAAoD;IACzDC,IAAI,EAAE,eAAe;IACrBC,MAAM,EAAE;EACV,CAAC;EACDQ,QAAQ,EAAE;IACRV,GAAG,EAAE,WAAW;IAChBC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV,CAAC;EACD,2DAA2D,EAAE;IAC3DF,GAAG,EAAE,4BAA4B;IACjCC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACD,iDAAiD,EAAE;IACjDF,GAAG,EAAE,uBAAuB;IAC5BC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACD,yCAAyC,EAAE;IACzCF,GAAG,EAAE,0DAA0D;IAC/DC,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;IAC1BC,MAAM,EAAE;EACV;AACF,CAAC","ignoreList":[]}
@@ -102,7 +102,7 @@ export function HelpButtonInlineContent(props) {
102
102
  help: helpProp,
103
103
  breakout = true,
104
104
  outset = true,
105
- roundedCorner = true,
105
+ roundedCorner,
106
106
  focusWhenOpen: focusWhenOpenProp
107
107
  } = props,
108
108
  rest = _objectWithoutProperties(props, _excluded2);
@@ -1 +1 @@
1
- {"version":3,"file":"HelpButtonInline.js","names":["React","useCallback","useContext","useEffect","useRef","classnames","HelpButtonInstance","HeightAnimation","useSharedState","convertJsxToString","useId","Section","P","Flex","CardContext","Dialog","question","QuestionIcon","close","CloseIcon","HelpButtonInline","props","_help$open","contentId","size","help","focusWhenOpen","className","children","rest","_objectWithoutProperties","_excluded","controlId","data","update","isOpen","open","isUserIntent","wasOpenRef","undefined","buttonRef","toggleOpen","current","onClickHandler","event","preventDefault","onKeyDownHandler","currentTarget","target","key","trim","code","window","requestAnimationFrame","title","createElement","Fragment","_extends","bounding","icon","HelpButtonIcon","id","on_click","onKeyDown","innerRef","HelpButtonInlineContent","_ref","element","helpProp","breakout","outset","roundedCorner","focusWhenOpenProp","_excluded2","content","renderAs","breakoutProp","outsetProp","cardContext","breakoutFromLayout","Boolean","outsetFromLayout","_innerRef$current","focus","preventScroll","onClose","_buttonRef$current","omitTriggerButton","openState","focusParams","tabIndex","innerSpace","top","bottom","left","right","backgroundColor","Vertical","gap","weight","_Fragment","_supportsSpacingProps"],"sources":["../../../../src/components/help-button/HelpButtonInline.tsx"],"sourcesContent":["import React, {\n AriaAttributes,\n useCallback,\n useContext,\n useEffect,\n useRef,\n} from 'react'\nimport classnames from 'classnames'\nimport { HelpButtonProps } from './HelpButton'\nimport HelpButtonInstance from './HelpButtonInstance'\nimport HeightAnimation from '../HeightAnimation'\nimport { useSharedState } from '../../shared/helpers/useSharedState'\nimport { convertJsxToString } from '../../shared/component-helper'\nimport useId from '../../shared/helpers/useId'\nimport Section from '../Section'\nimport { P } from '../../elements'\nimport Flex from '../Flex'\nimport CardContext from '../card/CardContext'\nimport { SpacingProps } from '../space/types'\nimport Dialog from '../Dialog'\nimport { question as QuestionIcon, close as CloseIcon } from '../../icons'\n\nexport type HelpProps = {\n title?: React.ReactNode\n content?: React.ReactNode\n renderAs?: 'inline' | 'dialog'\n /** Only for the \"inline\" variant */\n open?: boolean\n /** Only for the \"inline\" variant */\n breakout?: boolean\n /** Only for the \"inline\" variant */\n outset?: boolean\n}\n\nexport type HelpButtonInlineProps = HelpButtonProps & {\n contentId?: string\n help?: HelpProps\n\n /**\n * If set to `true`, the content will get focus when the help content is opened.\n */\n focusWhenOpen?: boolean\n}\n\nexport type HelpButtonInlineSharedStateDataProps = {\n isOpen: boolean\n isUserIntent?: boolean\n buttonRef?: React.RefObject<HTMLButtonElement>\n focusWhenOpen?: boolean\n}\n\nexport default function HelpButtonInline(props: HelpButtonInlineProps) {\n const {\n contentId,\n size,\n help,\n focusWhenOpen,\n className,\n children,\n ...rest\n } = props\n const controlId = useId(contentId)\n\n const { data, update } =\n useSharedState<HelpButtonInlineSharedStateDataProps>(controlId, {\n isOpen: help?.open ?? false,\n })\n const { isOpen, isUserIntent } = data || {}\n const wasOpenRef = useRef(undefined)\n const buttonRef = useRef<HTMLButtonElement>(null)\n\n const toggleOpen = useCallback(() => {\n update({\n isOpen: !isOpen,\n isUserIntent: !isOpen,\n buttonRef,\n focusWhenOpen,\n })\n wasOpenRef.current = !isOpen\n }, [focusWhenOpen, isOpen, update])\n\n const onClickHandler = useCallback(\n ({ event }: { event: React.MouseEvent<HTMLButtonElement> }) => {\n event.preventDefault() // Because when used inside a FormLabel\n toggleOpen()\n },\n [toggleOpen]\n )\n\n const onKeyDownHandler = useCallback(\n (event: React.KeyboardEvent<HTMLButtonElement>) => {\n if (event.currentTarget === event.target) {\n switch (event.key.trim() || event.code) {\n case 'Escape':\n if (isOpen) {\n event.preventDefault()\n window.requestAnimationFrame(() => {\n toggleOpen()\n })\n }\n break\n }\n }\n },\n [isOpen, toggleOpen]\n )\n\n const title = convertJsxToString(help?.title)\n\n return (\n <>\n <HelpButtonInstance\n bounding\n size={size ?? 'small'}\n icon={HelpButtonIcon}\n title={!isOpen && !wasOpenRef.current ? title : undefined}\n {...rest}\n id={controlId}\n className={classnames(\n 'dnb-help-button__inline',\n isOpen && 'dnb-help-button__inline--open',\n isUserIntent && 'dnb-help-button__inline--user-intent',\n typeof wasOpenRef.current === 'boolean' &&\n 'dnb-help-button__inline--was-open',\n className\n )}\n aria-controls={`${controlId}-content`}\n aria-expanded={isOpen}\n aria-label={title}\n on_click={onClickHandler}\n onKeyDown={onKeyDownHandler}\n innerRef={buttonRef}\n />\n\n {!contentId && (\n <HelpButtonInlineContent\n contentId={controlId}\n help={help}\n focusWhenOpen={focusWhenOpen}\n >\n {children}\n </HelpButtonInlineContent>\n )}\n </>\n )\n}\n\nexport type HelpButtonInlineContentProps = SpacingProps & {\n contentId: string\n className?: string\n element?: React.ElementType\n children?: React.ReactNode\n help?: HelpProps\n breakout?: boolean\n outset?: boolean\n roundedCorner?: boolean\n focusWhenOpen?: boolean\n}\n\nexport function HelpButtonInlineContent(\n props: HelpButtonInlineContentProps\n) {\n const {\n contentId,\n className,\n element,\n children,\n help: helpProp,\n breakout = true,\n outset = true,\n roundedCorner = true,\n focusWhenOpen: focusWhenOpenProp,\n ...rest\n } = props\n const { data, update } =\n useSharedState<HelpButtonInlineSharedStateDataProps>(contentId)\n const {\n isOpen,\n focusWhenOpen = focusWhenOpenProp,\n isUserIntent,\n buttonRef,\n } = data || {}\n const {\n open,\n title,\n content,\n renderAs,\n breakout: breakoutProp = true,\n outset: outsetProp = true,\n } = helpProp || {}\n\n const innerRef = useRef<HTMLDivElement>(null)\n const cardContext = useContext(CardContext)\n const breakoutFromLayout =\n Boolean(cardContext) && breakout && breakoutProp\n const outsetFromLayout = outset && outsetProp\n\n useEffect(() => {\n if (isOpen && isUserIntent && focusWhenOpen) {\n window.requestAnimationFrame(() => {\n innerRef.current?.focus({ preventScroll: true })\n })\n }\n }, [focusWhenOpen, isOpen, isUserIntent])\n\n const onClose = useCallback(() => {\n update({ isOpen: false, isUserIntent: false })\n }, [update])\n\n const onKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLButtonElement>) => {\n if (event.currentTarget === event.target) {\n // Firefox returns a whitespace (\" \") on event.key when pressing space,\n // therefore using .trim() can help normalize this.\n // While userEvent.keyboard('{Space}') might return 'Unknown' on event.code,\n // making a direct comparison less reliable across all platforms.\n switch (event.key.trim() || event.code) {\n case 'Enter':\n case 'Space':\n case 'Escape':\n event.preventDefault()\n window.requestAnimationFrame(() => {\n onClose()\n buttonRef.current?.focus()\n })\n break\n }\n }\n },\n [buttonRef, onClose]\n )\n\n if (renderAs === 'dialog') {\n return (\n <Dialog\n title={title}\n omitTriggerButton\n openState={isOpen ?? open}\n onClose={onClose}\n >\n {content}\n {children}\n </Dialog>\n )\n }\n\n const focusParams = focusWhenOpen\n ? {\n 'aria-label': convertJsxToString(title),\n className: 'dnb-no-focus',\n tabIndex: -1,\n onKeyDown,\n }\n : ({\n 'aria-live': 'polite',\n 'aria-atomic': 'true',\n } as AriaAttributes)\n\n return (\n <HeightAnimation\n element={element}\n className={classnames('dnb-help-button__content', className)}\n open={isOpen ?? open ?? false}\n >\n <Section\n id={`${contentId}-content`}\n {...focusParams}\n innerRef={innerRef}\n outset={outsetFromLayout}\n breakout={breakoutFromLayout}\n roundedCorner={roundedCorner ?? !breakoutFromLayout}\n innerSpace={\n breakoutFromLayout\n ? { top: 'small', bottom: 'medium' }\n : {\n top: 'small',\n bottom: 'medium',\n left: 'medium',\n right: 'x-small',\n }\n }\n backgroundColor=\"lavender\"\n {...rest}\n >\n <Flex.Vertical gap=\"x-small\">\n {title && <P weight=\"medium\">{title}</P>}\n {content && <P>{content}</P>}\n </Flex.Vertical>\n {children}\n </Section>\n </HeightAnimation>\n )\n}\n\nfunction HelpButtonIcon() {\n return (\n <>\n <QuestionIcon />\n <CloseIcon />\n </>\n )\n}\n\nHelpButtonInline._supportsSpacingProps = true\nHelpButtonInlineContent._supportsSpacingProps = true\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"HelpButtonInline.js","names":["React","useCallback","useContext","useEffect","useRef","classnames","HelpButtonInstance","HeightAnimation","useSharedState","convertJsxToString","useId","Section","P","Flex","CardContext","Dialog","question","QuestionIcon","close","CloseIcon","HelpButtonInline","props","_help$open","contentId","size","help","focusWhenOpen","className","children","rest","_objectWithoutProperties","_excluded","controlId","data","update","isOpen","open","isUserIntent","wasOpenRef","undefined","buttonRef","toggleOpen","current","onClickHandler","event","preventDefault","onKeyDownHandler","currentTarget","target","key","trim","code","window","requestAnimationFrame","title","createElement","Fragment","_extends","bounding","icon","HelpButtonIcon","id","on_click","onKeyDown","innerRef","HelpButtonInlineContent","_ref","element","helpProp","breakout","outset","roundedCorner","focusWhenOpenProp","_excluded2","content","renderAs","breakoutProp","outsetProp","cardContext","breakoutFromLayout","Boolean","outsetFromLayout","_innerRef$current","focus","preventScroll","onClose","_buttonRef$current","omitTriggerButton","openState","focusParams","tabIndex","innerSpace","top","bottom","left","right","backgroundColor","Vertical","gap","weight","_Fragment","_supportsSpacingProps"],"sources":["../../../../src/components/help-button/HelpButtonInline.tsx"],"sourcesContent":["import React, {\n AriaAttributes,\n useCallback,\n useContext,\n useEffect,\n useRef,\n} from 'react'\nimport classnames from 'classnames'\nimport { HelpButtonProps } from './HelpButton'\nimport HelpButtonInstance from './HelpButtonInstance'\nimport HeightAnimation from '../HeightAnimation'\nimport { useSharedState } from '../../shared/helpers/useSharedState'\nimport { convertJsxToString } from '../../shared/component-helper'\nimport useId from '../../shared/helpers/useId'\nimport Section from '../Section'\nimport { P } from '../../elements'\nimport Flex from '../Flex'\nimport CardContext from '../card/CardContext'\nimport { SpacingProps } from '../space/types'\nimport Dialog from '../Dialog'\nimport { question as QuestionIcon, close as CloseIcon } from '../../icons'\n\nexport type HelpProps = {\n title?: React.ReactNode\n content?: React.ReactNode\n renderAs?: 'inline' | 'dialog'\n /** Only for the \"inline\" variant */\n open?: boolean\n /** Only for the \"inline\" variant */\n breakout?: boolean\n /** Only for the \"inline\" variant */\n outset?: boolean\n}\n\nexport type HelpButtonInlineProps = HelpButtonProps & {\n contentId?: string\n help?: HelpProps\n\n /**\n * If set to `true`, the content will get focus when the help content is opened.\n */\n focusWhenOpen?: boolean\n}\n\nexport type HelpButtonInlineSharedStateDataProps = {\n isOpen: boolean\n isUserIntent?: boolean\n buttonRef?: React.RefObject<HTMLButtonElement>\n focusWhenOpen?: boolean\n}\n\nexport default function HelpButtonInline(props: HelpButtonInlineProps) {\n const {\n contentId,\n size,\n help,\n focusWhenOpen,\n className,\n children,\n ...rest\n } = props\n const controlId = useId(contentId)\n\n const { data, update } =\n useSharedState<HelpButtonInlineSharedStateDataProps>(controlId, {\n isOpen: help?.open ?? false,\n })\n const { isOpen, isUserIntent } = data || {}\n const wasOpenRef = useRef(undefined)\n const buttonRef = useRef<HTMLButtonElement>(null)\n\n const toggleOpen = useCallback(() => {\n update({\n isOpen: !isOpen,\n isUserIntent: !isOpen,\n buttonRef,\n focusWhenOpen,\n })\n wasOpenRef.current = !isOpen\n }, [focusWhenOpen, isOpen, update])\n\n const onClickHandler = useCallback(\n ({ event }: { event: React.MouseEvent<HTMLButtonElement> }) => {\n event.preventDefault() // Because when used inside a FormLabel\n toggleOpen()\n },\n [toggleOpen]\n )\n\n const onKeyDownHandler = useCallback(\n (event: React.KeyboardEvent<HTMLButtonElement>) => {\n if (event.currentTarget === event.target) {\n switch (event.key.trim() || event.code) {\n case 'Escape':\n if (isOpen) {\n event.preventDefault()\n window.requestAnimationFrame(() => {\n toggleOpen()\n })\n }\n break\n }\n }\n },\n [isOpen, toggleOpen]\n )\n\n const title = convertJsxToString(help?.title)\n\n return (\n <>\n <HelpButtonInstance\n bounding\n size={size ?? 'small'}\n icon={HelpButtonIcon}\n title={!isOpen && !wasOpenRef.current ? title : undefined}\n {...rest}\n id={controlId}\n className={classnames(\n 'dnb-help-button__inline',\n isOpen && 'dnb-help-button__inline--open',\n isUserIntent && 'dnb-help-button__inline--user-intent',\n typeof wasOpenRef.current === 'boolean' &&\n 'dnb-help-button__inline--was-open',\n className\n )}\n aria-controls={`${controlId}-content`}\n aria-expanded={isOpen}\n aria-label={title}\n on_click={onClickHandler}\n onKeyDown={onKeyDownHandler}\n innerRef={buttonRef}\n />\n\n {!contentId && (\n <HelpButtonInlineContent\n contentId={controlId}\n help={help}\n focusWhenOpen={focusWhenOpen}\n >\n {children}\n </HelpButtonInlineContent>\n )}\n </>\n )\n}\n\nexport type HelpButtonInlineContentProps = SpacingProps & {\n contentId: string\n className?: string\n element?: React.ElementType\n children?: React.ReactNode\n help?: HelpProps\n breakout?: boolean\n outset?: boolean\n roundedCorner?: boolean\n focusWhenOpen?: boolean\n}\n\nexport function HelpButtonInlineContent(\n props: HelpButtonInlineContentProps\n) {\n const {\n contentId,\n className,\n element,\n children,\n help: helpProp,\n breakout = true,\n outset = true,\n roundedCorner,\n focusWhenOpen: focusWhenOpenProp,\n ...rest\n } = props\n const { data, update } =\n useSharedState<HelpButtonInlineSharedStateDataProps>(contentId)\n const {\n isOpen,\n focusWhenOpen = focusWhenOpenProp,\n isUserIntent,\n buttonRef,\n } = data || {}\n const {\n open,\n title,\n content,\n renderAs,\n breakout: breakoutProp = true,\n outset: outsetProp = true,\n } = helpProp || {}\n\n const innerRef = useRef<HTMLDivElement>(null)\n const cardContext = useContext(CardContext)\n const breakoutFromLayout =\n Boolean(cardContext) && breakout && breakoutProp\n const outsetFromLayout = outset && outsetProp\n\n useEffect(() => {\n if (isOpen && isUserIntent && focusWhenOpen) {\n window.requestAnimationFrame(() => {\n innerRef.current?.focus({ preventScroll: true })\n })\n }\n }, [focusWhenOpen, isOpen, isUserIntent])\n\n const onClose = useCallback(() => {\n update({ isOpen: false, isUserIntent: false })\n }, [update])\n\n const onKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLButtonElement>) => {\n if (event.currentTarget === event.target) {\n // Firefox returns a whitespace (\" \") on event.key when pressing space,\n // therefore using .trim() can help normalize this.\n // While userEvent.keyboard('{Space}') might return 'Unknown' on event.code,\n // making a direct comparison less reliable across all platforms.\n switch (event.key.trim() || event.code) {\n case 'Enter':\n case 'Space':\n case 'Escape':\n event.preventDefault()\n window.requestAnimationFrame(() => {\n onClose()\n buttonRef.current?.focus()\n })\n break\n }\n }\n },\n [buttonRef, onClose]\n )\n\n if (renderAs === 'dialog') {\n return (\n <Dialog\n title={title}\n omitTriggerButton\n openState={isOpen ?? open}\n onClose={onClose}\n >\n {content}\n {children}\n </Dialog>\n )\n }\n\n const focusParams = focusWhenOpen\n ? {\n 'aria-label': convertJsxToString(title),\n className: 'dnb-no-focus',\n tabIndex: -1,\n onKeyDown,\n }\n : ({\n 'aria-live': 'polite',\n 'aria-atomic': 'true',\n } as AriaAttributes)\n\n return (\n <HeightAnimation\n element={element}\n className={classnames('dnb-help-button__content', className)}\n open={isOpen ?? open ?? false}\n >\n <Section\n id={`${contentId}-content`}\n {...focusParams}\n innerRef={innerRef}\n outset={outsetFromLayout}\n breakout={breakoutFromLayout}\n roundedCorner={roundedCorner ?? !breakoutFromLayout}\n innerSpace={\n breakoutFromLayout\n ? { top: 'small', bottom: 'medium' }\n : {\n top: 'small',\n bottom: 'medium',\n left: 'medium',\n right: 'x-small',\n }\n }\n backgroundColor=\"lavender\"\n {...rest}\n >\n <Flex.Vertical gap=\"x-small\">\n {title && <P weight=\"medium\">{title}</P>}\n {content && <P>{content}</P>}\n </Flex.Vertical>\n {children}\n </Section>\n </HeightAnimation>\n )\n}\n\nfunction HelpButtonIcon() {\n return (\n <>\n <QuestionIcon />\n <CloseIcon />\n </>\n )\n}\n\nHelpButtonInline._supportsSpacingProps = true\nHelpButtonInlineContent._supportsSpacingProps = true\n"],"mappings":"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","ignoreList":[]}
@@ -31,6 +31,7 @@ export type TextColor = string;
31
31
  export type OutlineColor = string | boolean;
32
32
  export type BackgroundColor = string;
33
33
  export type DropShadow = boolean;
34
+ export type RoundedCorner = boolean | [boolean, boolean, boolean, boolean];
34
35
  export type SectionProps = {
35
36
  /**
36
37
  * Defines the semantic purpose and subsequently the style of the visual helper. Will take precedence over the style_type prop
@@ -48,7 +49,7 @@ export type SectionProps = {
48
49
  /**
49
50
  * Define if the section should have rounded corners. Defaults to `false`.
50
51
  */
51
- roundedCorner?: boolean | ResponsiveProp<boolean>;
52
+ roundedCorner?: RoundedCorner | ResponsiveProp<RoundedCorner>;
52
53
  /**
53
54
  * Define a custom border color. Use a Eufemia color.
54
55
  */
@@ -41,14 +41,14 @@ export function SectionParams(localProps) {
41
41
  const elementRef = innerRef || inner_ref || internalRef;
42
42
  return Object.freeze(_objectSpread(_objectSpread({}, attributes), {}, {
43
43
  className: classnames(`dnb-section dnb-section--${variant ? variant : style_type || 'default'}`, className, spacing && `dnb-section--spacing-${isTrue(spacing) ? 'large' : spacing}`),
44
- style: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, computeStyle(breakout, 'breakout', value => `var(--breakout--${value ? 'on' : 'off'})`)), computeStyle(outset, 'outset', value => value ? '1' : '0')), computeStyle(roundedCorner, 'rounded-corner', value => value && 'var(--rounded-corner--value)')), computeStyle(textColor, 'text-color', value => getColor(value))), computeStyle(backgroundColor, 'background-color', value => getColor(value))), computeStyle(dropShadow, 'drop-shadow', value => value && 'var(--shadow-default)')), computeStyle(outline, 'outline-color', value => String(value) === 'true' ? 'var(--outline-color--value)' : getColor(value))), attributes === null || attributes === void 0 ? void 0 : attributes.style),
44
+ style: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, computeStyle(breakout, 'breakout', value => `var(--breakout--${value ? 'on' : 'off'})`)), computeStyle(outset, 'outset', value => value ? '1' : '0')), computeStyle(roundedCorner, 'rounded-corner', value => typeof value === 'boolean' ? value && 'var(--rounded-corner--value)' : value.map(v => v ? 'var(--rounded-corner--value)' : '0').join(' '))), computeStyle(textColor, 'text-color', value => getColor(value))), computeStyle(backgroundColor, 'background-color', value => getColor(value))), computeStyle(dropShadow, 'drop-shadow', value => value && 'var(--shadow-default)')), computeStyle(outline, 'outline-color', value => typeof value === 'boolean' ? value && 'var(--outline-color--value)' : getColor(value))), attributes === null || attributes === void 0 ? void 0 : attributes.style),
45
45
  innerRef: elementRef,
46
46
  children
47
47
  }));
48
48
  }
49
49
  function computeStyle(property, name, valueCallback) {
50
50
  let media = property;
51
- if (media !== null && typeof media !== 'object') {
51
+ if (media !== null && (Array.isArray(media) || typeof media !== 'object')) {
52
52
  media = {
53
53
  small: property,
54
54
  medium: property,
@@ -1 +1 @@
1
- {"version":3,"file":"Section.js","names":["React","classnames","Context","isTrue","extendPropsWithContext","Space","getColor","defaultProps","element","Section","localProps","createElement","SectionParams","context","useContext","props","variant","breakout","outset","roundedCorner","textColor","backgroundColor","dropShadow","outline","innerRef","className","children","spacing","style_type","inner_ref","attributes","_objectWithoutProperties","_excluded","internalRef","useRef","elementRef","Object","freeze","_objectSpread","style","computeStyle","value","String","property","name","valueCallback","media","small","medium","large","result","size","_media","_media2","_name","_supportsSpacingProps"],"sources":["../../../../src/components/section/Section.tsx"],"sourcesContent":["/**\n * Web Section Component\n *\n */\n\nimport React from 'react'\nimport classnames from 'classnames'\nimport Context from '../../shared/Context'\nimport {\n isTrue,\n extendPropsWithContext,\n} from '../../shared/component-helper'\nimport type {\n DynamicElement,\n ResponsiveProp,\n SpacingProps,\n} from '../../shared/types'\nimport Space from '../space/Space'\nimport { getColor } from '../../shared/helpers'\n\nexport type SectionVariants = 'error' | 'info' | 'warning' | 'success'\n\nexport type SectionStyleTypes =\n | 'divider'\n | 'white'\n | 'transparent'\n\n /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n | 'lavender'\n /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n | 'pistachio'\n /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n | 'emerald-green'\n /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n | 'sea-green'\n /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n | 'fire-red'\n /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n | 'fire-red-8'\n /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n | 'sand-yellow'\n /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n | 'black-3'\n /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n | 'mint-green'\n /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n | 'mint-green-12'\n\nexport type SectionSpacing =\n | boolean\n | 'x-small'\n | 'small'\n | 'medium'\n | 'large'\n | 'x-large'\n | 'xx-large'\n\nexport type TextColor = string\nexport type OutlineColor = string | boolean\nexport type BackgroundColor = string\nexport type DropShadow = boolean\n\nexport type SectionProps = {\n /**\n * Defines the semantic purpose and subsequently the style of the visual helper. Will take precedence over the style_type prop\n */\n variant?: SectionVariants | string\n\n /**\n * Define if the background color should break-out to a fullscreen view. Defaults to `true`.\n */\n breakout?: boolean | ResponsiveProp<boolean>\n\n /**\n * Define if the Card should break out negatively on larger screens. You cannot use `breakout` and `outset` together.\n * Defaults to `false`\n */\n outset?: boolean | ResponsiveProp<boolean>\n\n /**\n * Define if the section should have rounded corners. Defaults to `false`.\n */\n roundedCorner?: boolean | ResponsiveProp<boolean>\n\n /**\n * Define a custom border color. Use a Eufemia color.\n */\n outline?: OutlineColor | ResponsiveProp<OutlineColor>\n\n /**\n * Define a custom text color to compliment the backgroundColor. Use a Eufemia color.\n */\n textColor?: TextColor | ResponsiveProp<TextColor>\n\n /**\n * Define a custom background color, instead of a variant. Use a Eufemia color.\n */\n backgroundColor?: BackgroundColor | ResponsiveProp<BackgroundColor>\n\n /**\n * Define a custom drop-shadow.\n */\n dropShadow?: DropShadow | ResponsiveProp<DropShadow>\n\n /**\n * Define what HTML element should be used. Defaults to `<section>`.\n */\n element?: DynamicElement\n\n /**\n * Define a React.Ref.\n */\n innerRef?: React.RefObject<HTMLElement>\n\n /**\n * @deprecated in v11 use \"innerSpace\" prop instead\n */\n spacing?: SectionSpacing | ResponsiveProp<SectionSpacing>\n /**\n * @deprecated in v11 use \"background\" prop instead\n */\n style_type?: SectionStyleTypes | string\n /**\n * @deprecated in v11 use \"innerRef\" prop instead\n */\n inner_ref?: React.RefObject<HTMLElement>\n}\n\nexport type SectionAllProps = SectionProps &\n SpacingProps &\n Omit<React.HTMLProps<HTMLElement>, 'ref'>\n\ntype SectionReturnParams = Record<string, unknown> & {\n className: string\n innerRef: React.RefObject<HTMLElement>\n children: React.ReactNode\n style: React.CSSProperties\n}\n\nconst defaultProps = {\n element: 'section',\n}\n\nexport default function Section(localProps: SectionAllProps) {\n return <Space {...SectionParams(localProps)} />\n}\n\nexport function SectionParams(\n localProps: SectionAllProps\n): SectionReturnParams {\n const context = React.useContext(Context)\n\n // use only the props from context, who are available here anyway\n const props = extendPropsWithContext(\n localProps,\n defaultProps,\n context.Section\n )\n\n const {\n variant,\n breakout = !props.outset,\n outset,\n roundedCorner,\n textColor,\n backgroundColor,\n dropShadow,\n outline,\n innerRef,\n\n className,\n children,\n\n spacing,\n style_type,\n inner_ref,\n\n ...attributes\n } = props\n\n const internalRef = React.useRef<HTMLElement>()\n const elementRef = innerRef || inner_ref || internalRef\n\n return Object.freeze({\n ...attributes,\n className: classnames(\n 'dnb-section',\n `dnb-section--${variant ? variant : style_type || 'default'}`,\n spacing &&\n `dnb-section--spacing-${isTrue(spacing) ? 'large' : spacing}`,\n className\n ),\n style: {\n ...computeStyle(\n breakout,\n 'breakout',\n (value) => `var(--breakout--${value ? 'on' : 'off'})`\n ),\n ...computeStyle(outset, 'outset', (value) => (value ? '1' : '0')),\n ...computeStyle(\n roundedCorner,\n 'rounded-corner',\n (value) => value && 'var(--rounded-corner--value)'\n ),\n ...computeStyle(textColor, 'text-color', (value) => getColor(value)),\n ...computeStyle(backgroundColor, 'background-color', (value) =>\n getColor(value)\n ),\n ...computeStyle(\n dropShadow,\n 'drop-shadow',\n (value) => value && 'var(--shadow-default)'\n ),\n ...computeStyle(outline, 'outline-color', (value) =>\n String(value) === 'true'\n ? 'var(--outline-color--value)'\n : getColor(value)\n ),\n ...attributes?.style,\n } as React.CSSProperties,\n innerRef: elementRef,\n children,\n })\n}\n\nfunction computeStyle(\n property: ResponsiveProp<unknown> | boolean | string,\n name: string,\n valueCallback: (value: string) => string | undefined\n) {\n let media = property as ResponsiveProp<unknown>\n\n if (media !== null && typeof media !== 'object') {\n media = {\n small: property,\n medium: property,\n large: property,\n } as ResponsiveProp<unknown>\n }\n\n const result = {}\n\n for (const size in media as ResponsiveProp<unknown>) {\n if (typeof media?.[size] !== 'undefined') {\n const value = valueCallback(media?.[size])\n if (typeof value === 'string') {\n result[`--${name}--${size}`] = value\n }\n }\n }\n\n return result\n}\n\nSection._name = 'Section'\nSection._supportsSpacingProps = true\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"Section.js","names":["React","classnames","Context","isTrue","extendPropsWithContext","Space","getColor","defaultProps","element","Section","localProps","createElement","SectionParams","context","useContext","props","variant","breakout","outset","roundedCorner","textColor","backgroundColor","dropShadow","outline","innerRef","className","children","spacing","style_type","inner_ref","attributes","_objectWithoutProperties","_excluded","internalRef","useRef","elementRef","Object","freeze","_objectSpread","style","computeStyle","value","map","v","join","property","name","valueCallback","media","Array","isArray","small","medium","large","result","size","_media","_media2","_name","_supportsSpacingProps"],"sources":["../../../../src/components/section/Section.tsx"],"sourcesContent":["/**\n * Web Section Component\n *\n */\n\nimport React from 'react'\nimport classnames from 'classnames'\nimport Context from '../../shared/Context'\nimport {\n isTrue,\n extendPropsWithContext,\n} from '../../shared/component-helper'\nimport type {\n DynamicElement,\n ResponsiveProp,\n SpacingProps,\n} from '../../shared/types'\nimport Space from '../space/Space'\nimport { getColor } from '../../shared/helpers'\n\nexport type SectionVariants = 'error' | 'info' | 'warning' | 'success'\n\nexport type SectionStyleTypes =\n | 'divider'\n | 'white'\n | 'transparent'\n\n /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n | 'lavender'\n /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n | 'pistachio'\n /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n | 'emerald-green'\n /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n | 'sea-green'\n /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n | 'fire-red'\n /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n | 'fire-red-8'\n /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n | 'sand-yellow'\n /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n | 'black-3'\n /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n | 'mint-green'\n /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n | 'mint-green-12'\n\nexport type SectionSpacing =\n | boolean\n | 'x-small'\n | 'small'\n | 'medium'\n | 'large'\n | 'x-large'\n | 'xx-large'\n\nexport type TextColor = string\nexport type OutlineColor = string | boolean\nexport type BackgroundColor = string\nexport type DropShadow = boolean\nexport type RoundedCorner = boolean | [boolean, boolean, boolean, boolean]\n\nexport type SectionProps = {\n /**\n * Defines the semantic purpose and subsequently the style of the visual helper. Will take precedence over the style_type prop\n */\n variant?: SectionVariants | string\n\n /**\n * Define if the background color should break-out to a fullscreen view. Defaults to `true`.\n */\n breakout?: boolean | ResponsiveProp<boolean>\n\n /**\n * Define if the Card should break out negatively on larger screens. You cannot use `breakout` and `outset` together.\n * Defaults to `false`\n */\n outset?: boolean | ResponsiveProp<boolean>\n\n /**\n * Define if the section should have rounded corners. Defaults to `false`.\n */\n roundedCorner?: RoundedCorner | ResponsiveProp<RoundedCorner>\n\n /**\n * Define a custom border color. Use a Eufemia color.\n */\n outline?: OutlineColor | ResponsiveProp<OutlineColor>\n\n /**\n * Define a custom text color to compliment the backgroundColor. Use a Eufemia color.\n */\n textColor?: TextColor | ResponsiveProp<TextColor>\n\n /**\n * Define a custom background color, instead of a variant. Use a Eufemia color.\n */\n backgroundColor?: BackgroundColor | ResponsiveProp<BackgroundColor>\n\n /**\n * Define a custom drop-shadow.\n */\n dropShadow?: DropShadow | ResponsiveProp<DropShadow>\n\n /**\n * Define what HTML element should be used. Defaults to `<section>`.\n */\n element?: DynamicElement\n\n /**\n * Define a React.Ref.\n */\n innerRef?: React.RefObject<HTMLElement>\n\n /**\n * @deprecated in v11 use \"innerSpace\" prop instead\n */\n spacing?: SectionSpacing | ResponsiveProp<SectionSpacing>\n /**\n * @deprecated in v11 use \"background\" prop instead\n */\n style_type?: SectionStyleTypes | string\n /**\n * @deprecated in v11 use \"innerRef\" prop instead\n */\n inner_ref?: React.RefObject<HTMLElement>\n}\n\nexport type SectionAllProps = SectionProps &\n SpacingProps &\n Omit<React.HTMLProps<HTMLElement>, 'ref'>\n\ntype SectionReturnParams = Record<string, unknown> & {\n className: string\n innerRef: React.RefObject<HTMLElement>\n children: React.ReactNode\n style: React.CSSProperties\n}\n\nconst defaultProps = {\n element: 'section',\n}\n\nexport default function Section(localProps: SectionAllProps) {\n return <Space {...SectionParams(localProps)} />\n}\n\nexport function SectionParams(\n localProps: SectionAllProps\n): SectionReturnParams {\n const context = React.useContext(Context)\n\n // use only the props from context, who are available here anyway\n const props = extendPropsWithContext(\n localProps,\n defaultProps,\n context.Section\n )\n\n const {\n variant,\n breakout = !props.outset,\n outset,\n roundedCorner,\n textColor,\n backgroundColor,\n dropShadow,\n outline,\n innerRef,\n\n className,\n children,\n\n spacing,\n style_type,\n inner_ref,\n\n ...attributes\n } = props\n\n const internalRef = React.useRef<HTMLElement>()\n const elementRef = innerRef || inner_ref || internalRef\n\n return Object.freeze({\n ...attributes,\n className: classnames(\n 'dnb-section',\n `dnb-section--${variant ? variant : style_type || 'default'}`,\n spacing &&\n `dnb-section--spacing-${isTrue(spacing) ? 'large' : spacing}`,\n className\n ),\n style: {\n ...computeStyle(\n breakout,\n 'breakout',\n (value) => `var(--breakout--${value ? 'on' : 'off'})`\n ),\n ...computeStyle(outset, 'outset', (value) => (value ? '1' : '0')),\n ...computeStyle(roundedCorner, 'rounded-corner', (value) =>\n typeof value === 'boolean'\n ? value && 'var(--rounded-corner--value)'\n : value\n .map((v) => (v ? 'var(--rounded-corner--value)' : '0'))\n .join(' ')\n ),\n ...computeStyle(textColor, 'text-color', (value) => getColor(value)),\n ...computeStyle(backgroundColor, 'background-color', (value) =>\n getColor(value)\n ),\n ...computeStyle(\n dropShadow,\n 'drop-shadow',\n (value) => value && 'var(--shadow-default)'\n ),\n ...computeStyle(outline, 'outline-color', (value) =>\n typeof value === 'boolean'\n ? value && 'var(--outline-color--value)'\n : getColor(value)\n ),\n ...attributes?.style,\n } as React.CSSProperties,\n innerRef: elementRef,\n children,\n })\n}\n\nfunction computeStyle<T extends boolean | string | boolean[]>(\n property: T | ResponsiveProp<T>,\n name: string,\n valueCallback: (value: T) => string | undefined\n) {\n let media = property as ResponsiveProp<T>\n\n if (\n media !== null &&\n (Array.isArray(media) || typeof media !== 'object')\n ) {\n media = {\n small: property,\n medium: property,\n large: property,\n } as ResponsiveProp<T>\n }\n\n const result = {}\n\n for (const size in media as ResponsiveProp<T>) {\n if (typeof media?.[size] !== 'undefined') {\n const value = valueCallback(media?.[size])\n if (typeof value === 'string') {\n result[`--${name}--${size}`] = value\n }\n }\n }\n\n return result\n}\n\nSection._name = 'Section'\nSection._supportsSpacingProps = true\n"],"mappings":"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","ignoreList":[]}
@@ -19,6 +19,9 @@
19
19
  --width: 100vw;
20
20
  --height: 100%;
21
21
  --color-transparent: transparent;
22
+ --rounded-corner--small: 0;
23
+ --rounded-corner--medium: 0;
24
+ --rounded-corner--large: 0;
22
25
  color: var(--text-color, black);
23
26
  border-radius: var(--rounded-corner, 0);
24
27
  }
@@ -50,6 +53,7 @@
50
53
  --box-shadow: 99vw 0 0 0 currentcolor, 198vw 0 0 0 currentcolor,
51
54
  297vw 0 0 0 currentcolor, 396vw 0 0 0 currentcolor;
52
55
  box-shadow: var(--box-shadow);
56
+ border-radius: var(--rounded-corner, 0);
53
57
  }
54
58
  .dnb-section:not([style*="--breakout"]) {
55
59
  --breakout: var(--breakout--on);
@@ -1,4 +1,4 @@
1
- .dnb-section{--breakout--on:visible;--breakout--off:hidden;--rounded-corner--value:0.5rem;--outline:0 0 0 var(--outline-width,1px) var(--outline-color,transparent);--outline-none:0 0 0 0 transparent;--top:0;--left:-100vw;--width:100vw;--height:100%;--color-transparent:transparent;border-radius:var(--rounded-corner,0);color:var(--text-color,#000);display:flow-root;position:relative}.dnb-section[style*="--background-color"]{background-color:var(--background-color,#fff)}.dnb-section:before{border-radius:var(--rounded-corner,0);bottom:0;box-shadow:var(--drop-shadow,var(--outline-none)),var(--outline,var(--outline-none));content:"";left:0;position:absolute;right:0;top:0;z-index:-1}.dnb-section:after{--box-shadow:99vw 0 0 0 currentcolor,198vw 0 0 0 currentcolor,297vw 0 0 0 currentcolor,396vw 0 0 0 currentcolor;background-color:currentcolor;box-shadow:var(--box-shadow);color:var(--background-color,currentcolor);content:"";height:var(--height);left:var(--left);position:absolute;top:var(--top);visibility:var(--breakout,hidden);width:var(--width);z-index:-15}.dnb-section:not([style*="--breakout"]){--breakout:var(--breakout--on)}.dnb-section[style*="--outset"].dnb-space[style]:not(.dnb-card){padding-left:calc(var(--padding-left)*(1 - var(--outset)));padding-right:calc(var(--padding-right)*(1 - var(--outset)))}.dnb-section[style*="--outset"]:before{background-color:inherit;margin-left:calc(var(--outset-left, var(--padding-left))*-1*var(--outset));margin-right:calc(var(--outset-right, var(--padding-right))*-1*var(--outset))}@media screen and (max-width:60em){.dnb-section{--breakout:var(--breakout--small,var(--breakout--fallback));--outset:var(--outset--small,var(--outset--fallback));--background-color--value:var(--background-color--small);--text-color--value:var(--text-color--small);--outline-color:var(--outline-color--small);--drop-shadow:var(--drop-shadow--small);--rounded-corner:var(
1
+ .dnb-section{--breakout--on:visible;--breakout--off:hidden;--rounded-corner--value:0.5rem;--outline:0 0 0 var(--outline-width,1px) var(--outline-color,transparent);--outline-none:0 0 0 0 transparent;--top:0;--left:-100vw;--width:100vw;--height:100%;--color-transparent:transparent;--rounded-corner--small:0;--rounded-corner--medium:0;--rounded-corner--large:0;border-radius:var(--rounded-corner,0);color:var(--text-color,#000);display:flow-root;position:relative}.dnb-section[style*="--background-color"]{background-color:var(--background-color,#fff)}.dnb-section:before{bottom:0;box-shadow:var(--drop-shadow,var(--outline-none)),var(--outline,var(--outline-none));left:0;right:0;top:0;z-index:-1}.dnb-section:after,.dnb-section:before{border-radius:var(--rounded-corner,0);content:"";position:absolute}.dnb-section:after{--box-shadow:99vw 0 0 0 currentcolor,198vw 0 0 0 currentcolor,297vw 0 0 0 currentcolor,396vw 0 0 0 currentcolor;background-color:currentcolor;box-shadow:var(--box-shadow);color:var(--background-color,currentcolor);height:var(--height);left:var(--left);top:var(--top);visibility:var(--breakout,hidden);width:var(--width);z-index:-15}.dnb-section:not([style*="--breakout"]){--breakout:var(--breakout--on)}.dnb-section[style*="--outset"].dnb-space[style]:not(.dnb-card){padding-left:calc(var(--padding-left)*(1 - var(--outset)));padding-right:calc(var(--padding-right)*(1 - var(--outset)))}.dnb-section[style*="--outset"]:before{background-color:inherit;margin-left:calc(var(--outset-left, var(--padding-left))*-1*var(--outset));margin-right:calc(var(--outset-right, var(--padding-right))*-1*var(--outset))}@media screen and (max-width:60em){.dnb-section{--breakout:var(--breakout--small,var(--breakout--fallback));--outset:var(--outset--small,var(--outset--fallback));--background-color--value:var(--background-color--small);--text-color--value:var(--text-color--small);--outline-color:var(--outline-color--small);--drop-shadow:var(--drop-shadow--small);--rounded-corner:var(
2
2
  --rounded-corner--small,var(--rounded-corner--fallback)
3
3
  )}}@media screen and (max-width:60em) and (min-width:40.00625em){.dnb-section{--breakout:var(--breakout--medium,var(--breakout--fallback));--outset:var(--outset--medium,var(--outset--fallback));--background-color--value:var(--background-color--medium);--text-color--value:var(--text-color--medium);--outline-color:var(--outline-color--medium);--drop-shadow:var(--drop-shadow--medium);--rounded-corner:var(
4
4
  --rounded-corner--medium,var(--rounded-corner--fallback)
@@ -23,6 +23,10 @@
23
23
  --width: 100vw;
24
24
  --height: 100%;
25
25
  --color-transparent: transparent;
26
+ // reset to prevent inheriting from parent
27
+ --rounded-corner--small: 0;
28
+ --rounded-corner--medium: 0;
29
+ --rounded-corner--large: 0;
26
30
 
27
31
  color: var(--text-color, black);
28
32
  border-radius: var(--rounded-corner, 0);
@@ -61,6 +65,7 @@
61
65
  // we use box-shadow to avoid a horizontal scrollbar
62
66
  // We lower the left position, so we get an overlap
63
67
  box-shadow: var(--box-shadow);
68
+ border-radius: var(--rounded-corner, 0);
64
69
  }
65
70
 
66
71
  &:not([style*='--breakout']) {