@dnb/eufemia 10.17.0 → 10.19.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (828) hide show
  1. package/CHANGELOG.md +45 -0
  2. package/cjs/components/AriaLive.d.ts +12 -0
  3. package/cjs/components/AriaLive.js +24 -0
  4. package/cjs/components/AriaLive.js.map +1 -0
  5. package/cjs/components/aria-live/AriaLive.d.ts +6 -0
  6. package/cjs/components/aria-live/AriaLive.js +23 -0
  7. package/cjs/components/aria-live/AriaLive.js.map +1 -0
  8. package/cjs/components/aria-live/index.d.ts +7 -0
  9. package/cjs/components/aria-live/index.js +24 -0
  10. package/cjs/components/aria-live/index.js.map +1 -0
  11. package/cjs/components/aria-live/types.d.ts +44 -0
  12. package/cjs/components/aria-live/types.js +1 -0
  13. package/cjs/components/aria-live/types.js.map +1 -0
  14. package/cjs/components/aria-live/useAriaLive.d.ts +273 -0
  15. package/cjs/components/aria-live/useAriaLive.js +84 -0
  16. package/cjs/components/aria-live/useAriaLive.js.map +1 -0
  17. package/cjs/components/autocomplete/Autocomplete.d.ts +0 -1
  18. package/cjs/components/autocomplete/Autocomplete.js +24 -46
  19. package/cjs/components/autocomplete/Autocomplete.js.map +1 -1
  20. package/cjs/components/breadcrumb/Breadcrumb.js +13 -19
  21. package/cjs/components/breadcrumb/Breadcrumb.js.map +1 -1
  22. package/cjs/components/breadcrumb/BreadcrumbItem.js +11 -5
  23. package/cjs/components/breadcrumb/BreadcrumbItem.js.map +1 -1
  24. package/cjs/components/breadcrumb/BreadcrumbMultiple.js +1 -1
  25. package/cjs/components/breadcrumb/BreadcrumbMultiple.js.map +1 -1
  26. package/cjs/components/breadcrumb/style/dnb-breadcrumb.css +13 -3
  27. package/cjs/components/breadcrumb/style/dnb-breadcrumb.min.css +1 -1
  28. package/cjs/components/breadcrumb/style/dnb-breadcrumb.scss +15 -3
  29. package/cjs/components/date-picker/DatePicker.d.ts +3 -0
  30. package/cjs/components/date-picker/DatePickerProvider.js +6 -2
  31. package/cjs/components/date-picker/DatePickerProvider.js.map +1 -1
  32. package/cjs/components/flex/Container.d.ts +4 -2
  33. package/cjs/components/flex/Container.js +32 -9
  34. package/cjs/components/flex/Container.js.map +1 -1
  35. package/cjs/components/flex/style/dnb-flex.css +3 -3
  36. package/cjs/components/flex/style/dnb-flex.min.css +1 -1
  37. package/cjs/components/flex/style/flex-container.scss +3 -7
  38. package/cjs/components/flex/utils.d.ts +1 -1
  39. package/cjs/components/flex/utils.js +11 -1
  40. package/cjs/components/flex/utils.js.map +1 -1
  41. package/cjs/components/index.d.ts +2 -1
  42. package/cjs/components/index.js +7 -0
  43. package/cjs/components/index.js.map +1 -1
  44. package/cjs/components/input/Input.js +0 -3
  45. package/cjs/components/input/Input.js.map +1 -1
  46. package/cjs/components/input-masked/MultiInputMask.d.ts +10 -2
  47. package/cjs/components/input-masked/MultiInputMask.js +77 -39
  48. package/cjs/components/input-masked/MultiInputMask.js.map +1 -1
  49. package/cjs/components/input-masked/hooks/useMultiInputValues.d.ts +2 -2
  50. package/cjs/components/input-masked/hooks/useMultiInputValues.js.map +1 -1
  51. package/cjs/components/lib.d.ts +3 -1
  52. package/cjs/components/lib.js +8 -0
  53. package/cjs/components/lib.js.map +1 -1
  54. package/cjs/components/number-format/NumberFormat.js +1 -1
  55. package/cjs/components/number-format/NumberFormat.js.map +1 -1
  56. package/cjs/components/number-format/NumberUtils.d.ts +8 -2
  57. package/cjs/components/number-format/useNumberFormat.d.ts +1 -1
  58. package/cjs/components/section/Section.d.ts +6 -3
  59. package/cjs/components/section/Section.js.map +1 -1
  60. package/cjs/components/section/style/dnb-section.css +1 -0
  61. package/cjs/components/section/style/dnb-section.min.css +1 -1
  62. package/cjs/components/section/style/dnb-section.scss +1 -0
  63. package/cjs/components/space/SpacingUtils.js +5 -1
  64. package/cjs/components/space/SpacingUtils.js.map +1 -1
  65. package/cjs/components/table/TableAccordion.js +1 -1
  66. package/cjs/components/table/TableAccordion.js.map +1 -1
  67. package/cjs/components/textarea/Textarea.d.ts +5 -0
  68. package/cjs/components/textarea/Textarea.js +16 -3
  69. package/cjs/components/textarea/Textarea.js.map +1 -1
  70. package/cjs/components/textarea/style/dnb-textarea.css +10 -3
  71. package/cjs/components/textarea/style/dnb-textarea.min.css +1 -1
  72. package/cjs/components/textarea/style/dnb-textarea.scss +13 -3
  73. package/cjs/components/textarea/style/themes/dnb-textarea-theme-ui.css +15 -2
  74. package/cjs/components/textarea/style/themes/dnb-textarea-theme-ui.min.css +1 -1
  75. package/cjs/components/textarea/style/themes/dnb-textarea-theme-ui.scss +15 -2
  76. package/cjs/components/toggle-button/style/themes/dnb-toggle-button-theme-sbanken.css +8 -1
  77. package/cjs/components/toggle-button/style/themes/dnb-toggle-button-theme-sbanken.min.css +1 -1
  78. package/cjs/components/toggle-button/style/themes/dnb-toggle-button-theme-sbanken.scss +6 -1
  79. package/cjs/components/toggle-button/style/themes/dnb-toggle-button-theme-ui.css +4 -0
  80. package/cjs/components/toggle-button/style/themes/dnb-toggle-button-theme-ui.min.css +1 -1
  81. package/cjs/components/toggle-button/style/themes/dnb-toggle-button-theme-ui.scss +5 -0
  82. package/cjs/components/visually-hidden/VisuallyHidden.js +1 -1
  83. package/cjs/components/visually-hidden/VisuallyHidden.js.map +1 -1
  84. package/cjs/extensions/forms/DataContext/Provider/Provider.d.ts +8 -4
  85. package/cjs/extensions/forms/DataContext/Provider/Provider.js +32 -4
  86. package/cjs/extensions/forms/DataContext/Provider/Provider.js.map +1 -1
  87. package/cjs/extensions/forms/Field/ArraySelection/ArraySelection.js +14 -12
  88. package/cjs/extensions/forms/Field/ArraySelection/ArraySelection.js.map +1 -1
  89. package/cjs/extensions/forms/Field/ArraySelection/style/dnb-array-selection.css +12 -2
  90. package/cjs/extensions/forms/Field/ArraySelection/style/dnb-array-selection.min.css +1 -1
  91. package/cjs/extensions/forms/Field/ArraySelection/style/dnb-array-selection.scss +12 -2
  92. package/cjs/extensions/forms/Field/BankAccountNumber/BankAccountNumber.d.ts +2 -2
  93. package/cjs/extensions/forms/Field/BankAccountNumber/BankAccountNumber.js +2 -2
  94. package/cjs/extensions/forms/Field/BankAccountNumber/BankAccountNumber.js.map +1 -1
  95. package/cjs/extensions/forms/Field/Boolean/Boolean.d.ts +2 -2
  96. package/cjs/extensions/forms/Field/Boolean/Boolean.js.map +1 -1
  97. package/cjs/extensions/forms/Field/Currency/Currency.d.ts +2 -2
  98. package/cjs/extensions/forms/Field/Currency/Currency.js.map +1 -1
  99. package/cjs/extensions/forms/Field/Date/Date.js +4 -5
  100. package/cjs/extensions/forms/Field/Date/Date.js.map +1 -1
  101. package/cjs/extensions/forms/Field/Email/Email.d.ts +2 -2
  102. package/cjs/extensions/forms/Field/Email/Email.js +2 -2
  103. package/cjs/extensions/forms/Field/Email/Email.js.map +1 -1
  104. package/cjs/extensions/forms/Field/Expiry/Expiry.d.ts +1 -1
  105. package/cjs/extensions/forms/Field/Expiry/Expiry.js +32 -21
  106. package/cjs/extensions/forms/Field/Expiry/Expiry.js.map +1 -1
  107. package/cjs/extensions/forms/Field/NationalIdentityNumber/NationalIdentityNumber.d.ts +2 -2
  108. package/cjs/extensions/forms/Field/NationalIdentityNumber/NationalIdentityNumber.js +2 -2
  109. package/cjs/extensions/forms/Field/NationalIdentityNumber/NationalIdentityNumber.js.map +1 -1
  110. package/cjs/extensions/forms/Field/Number/Number.js +12 -15
  111. package/cjs/extensions/forms/Field/Number/Number.js.map +1 -1
  112. package/cjs/extensions/forms/Field/Number/style/dnb-number.css +0 -6
  113. package/cjs/extensions/forms/Field/Number/style/dnb-number.min.css +1 -1
  114. package/cjs/extensions/forms/Field/Number/style/dnb-number.scss +0 -1
  115. package/cjs/extensions/forms/Field/Number/style/themes/dnb-number-theme-sbanken.css +4 -0
  116. package/cjs/extensions/forms/Field/Number/style/themes/dnb-number-theme-sbanken.min.css +1 -1
  117. package/cjs/extensions/forms/Field/Number/style/themes/dnb-number-theme-sbanken.scss +7 -0
  118. package/cjs/extensions/forms/Field/Number/style/themes/dnb-number-theme-ui.css +4 -0
  119. package/cjs/extensions/forms/Field/Number/style/themes/dnb-number-theme-ui.min.css +1 -1
  120. package/cjs/extensions/forms/Field/Number/style/themes/dnb-number-theme-ui.scss +9 -0
  121. package/cjs/extensions/forms/Field/OrganizationNumber/OrganizationNumber.d.ts +2 -2
  122. package/cjs/extensions/forms/Field/OrganizationNumber/OrganizationNumber.js +2 -2
  123. package/cjs/extensions/forms/Field/OrganizationNumber/OrganizationNumber.js.map +1 -1
  124. package/cjs/extensions/forms/Field/PhoneNumber/PhoneNumber.d.ts +2 -2
  125. package/cjs/extensions/forms/Field/PhoneNumber/PhoneNumber.js +16 -10
  126. package/cjs/extensions/forms/Field/PhoneNumber/PhoneNumber.js.map +1 -1
  127. package/cjs/extensions/forms/Field/PostalCodeAndCity/PostalCodeAndCity.d.ts +2 -2
  128. package/cjs/extensions/forms/Field/PostalCodeAndCity/PostalCodeAndCity.js.map +1 -1
  129. package/cjs/extensions/forms/Field/SelectCountry/SelectCountry.js +6 -3
  130. package/cjs/extensions/forms/Field/SelectCountry/SelectCountry.js.map +1 -1
  131. package/cjs/extensions/forms/Field/Selection/Selection.d.ts +7 -1
  132. package/cjs/extensions/forms/Field/Selection/Selection.js +9 -9
  133. package/cjs/extensions/forms/Field/Selection/Selection.js.map +1 -1
  134. package/cjs/extensions/forms/Field/String/String.d.ts +3 -2
  135. package/cjs/extensions/forms/Field/String/String.js +11 -11
  136. package/cjs/extensions/forms/Field/String/String.js.map +1 -1
  137. package/cjs/extensions/forms/Field/Toggle/Toggle.js +14 -14
  138. package/cjs/extensions/forms/Field/Toggle/Toggle.js.map +1 -1
  139. package/cjs/extensions/forms/FieldBlock/FieldBlock.d.ts +2 -2
  140. package/cjs/extensions/forms/FieldBlock/FieldBlock.js +5 -8
  141. package/cjs/extensions/forms/FieldBlock/FieldBlock.js.map +1 -1
  142. package/cjs/extensions/forms/FieldBlock/style/dnb-field-block.css +0 -6
  143. package/cjs/extensions/forms/FieldBlock/style/dnb-field-block.min.css +1 -1
  144. package/cjs/extensions/forms/FieldBlock/style/dnb-field-block.scss +0 -7
  145. package/cjs/extensions/forms/FieldBlock/style/themes/dnb-field-block-sbanken.css +4 -0
  146. package/cjs/extensions/forms/FieldBlock/style/themes/dnb-field-block-sbanken.min.css +1 -0
  147. package/cjs/extensions/forms/FieldBlock/style/themes/dnb-field-block-sbanken.scss +6 -0
  148. package/cjs/extensions/forms/FieldBlock/style/themes/dnb-field-block-theme-ui.css +4 -0
  149. package/cjs/extensions/forms/FieldBlock/style/themes/dnb-field-block-theme-ui.min.css +1 -0
  150. package/cjs/extensions/forms/FieldBlock/style/themes/dnb-field-block-theme-ui.scss +6 -0
  151. package/cjs/extensions/forms/Form/Handler/Handler.js +1 -0
  152. package/cjs/extensions/forms/Form/Handler/Handler.js.map +1 -1
  153. package/cjs/extensions/forms/Form/Visibility/Visibility.js +0 -1
  154. package/cjs/extensions/forms/Form/Visibility/Visibility.js.map +1 -1
  155. package/cjs/extensions/forms/Form/hooks/useData.d.ts +10 -0
  156. package/cjs/extensions/forms/Form/hooks/useData.js +39 -0
  157. package/cjs/extensions/forms/Form/hooks/useData.js.map +1 -0
  158. package/cjs/extensions/forms/Form/index.d.ts +1 -0
  159. package/cjs/extensions/forms/Form/index.js +7 -0
  160. package/cjs/extensions/forms/Form/index.js.map +1 -1
  161. package/cjs/extensions/forms/Iterate/Array/Array.js +1 -3
  162. package/cjs/extensions/forms/Iterate/Array/Array.js.map +1 -1
  163. package/cjs/extensions/forms/Value/BankAccountNumber/BankAccountNumber.d.ts +2 -2
  164. package/cjs/extensions/forms/Value/BankAccountNumber/BankAccountNumber.js.map +1 -1
  165. package/cjs/extensions/forms/Value/Currency/Currency.d.ts +2 -2
  166. package/cjs/extensions/forms/Value/Currency/Currency.js.map +1 -1
  167. package/cjs/extensions/forms/Value/Date/Date.d.ts +2 -2
  168. package/cjs/extensions/forms/Value/Date/Date.js.map +1 -1
  169. package/cjs/extensions/forms/Value/Email/Email.d.ts +2 -2
  170. package/cjs/extensions/forms/Value/Email/Email.js.map +1 -1
  171. package/cjs/extensions/forms/Value/NationalIdentityNumber/NationalIdentityNumber.d.ts +2 -2
  172. package/cjs/extensions/forms/Value/NationalIdentityNumber/NationalIdentityNumber.js.map +1 -1
  173. package/cjs/extensions/forms/Value/PhoneNumber/PhoneNumber.d.ts +2 -2
  174. package/cjs/extensions/forms/Value/PhoneNumber/PhoneNumber.js.map +1 -1
  175. package/cjs/extensions/forms/hooks/useDataValue.d.ts +4 -0
  176. package/cjs/extensions/forms/hooks/useDataValue.js +14 -10
  177. package/cjs/extensions/forms/hooks/useDataValue.js.map +1 -1
  178. package/cjs/extensions/forms/style/dnb-forms.css +12 -14
  179. package/cjs/extensions/forms/style/dnb-forms.min.css +1 -1
  180. package/cjs/extensions/forms/types.d.ts +7 -9
  181. package/cjs/extensions/forms/types.js.map +1 -1
  182. package/cjs/fragments/TextCounter.d.ts +12 -0
  183. package/cjs/fragments/TextCounter.js +24 -0
  184. package/cjs/fragments/TextCounter.js.map +1 -0
  185. package/cjs/fragments/drawer-list/DrawerListHelpers.js +1 -0
  186. package/cjs/fragments/drawer-list/DrawerListHelpers.js.map +1 -1
  187. package/cjs/fragments/index.d.ts +2 -1
  188. package/cjs/fragments/index.js +7 -0
  189. package/cjs/fragments/index.js.map +1 -1
  190. package/cjs/fragments/lib.d.ts +3 -1
  191. package/cjs/fragments/lib.js +9 -1
  192. package/cjs/fragments/lib.js.map +1 -1
  193. package/cjs/fragments/text-counter/TextCounter.d.ts +8 -0
  194. package/cjs/fragments/text-counter/TextCounter.js +61 -0
  195. package/cjs/fragments/text-counter/TextCounter.js.map +1 -0
  196. package/cjs/fragments/text-counter/index.d.ts +5 -0
  197. package/cjs/fragments/text-counter/index.js +17 -0
  198. package/cjs/fragments/text-counter/index.js.map +1 -0
  199. package/cjs/fragments/text-counter/style/dnb-text-counter.scss +15 -0
  200. package/cjs/fragments/text-counter/style/index.d.ts +1 -0
  201. package/cjs/fragments/text-counter/style/index.js +4 -0
  202. package/cjs/fragments/text-counter/style/index.js.map +1 -0
  203. package/cjs/fragments/text-counter/style/themes/dnb-text-counter-theme-sbanken.scss +8 -0
  204. package/cjs/fragments/text-counter/style/themes/dnb-text-counter-theme-ui.scss +8 -0
  205. package/cjs/fragments/text-counter/style/themes/ui.d.ts +1 -0
  206. package/cjs/fragments/text-counter/style/themes/ui.js +4 -0
  207. package/cjs/fragments/text-counter/style/themes/ui.js.map +1 -0
  208. package/cjs/fragments/text-counter/style.d.ts +5 -0
  209. package/cjs/fragments/text-counter/style.js +4 -0
  210. package/cjs/fragments/text-counter/style.js.map +1 -0
  211. package/cjs/index.d.ts +2 -1
  212. package/cjs/index.js +7 -0
  213. package/cjs/index.js.map +1 -1
  214. package/cjs/shared/Eufemia.d.ts +1 -1
  215. package/cjs/shared/Eufemia.js +2 -2
  216. package/cjs/shared/Eufemia.js.map +1 -1
  217. package/cjs/shared/helpers/EventEmitter.d.ts +5 -0
  218. package/cjs/shared/helpers/EventEmitter.js.map +1 -1
  219. package/cjs/shared/helpers/useEventEmitter.d.ts +2 -0
  220. package/cjs/shared/helpers/useEventEmitter.js.map +1 -1
  221. package/cjs/shared/helpers/useSharedState.d.ts +17 -0
  222. package/cjs/shared/helpers/useSharedState.js +90 -0
  223. package/cjs/shared/helpers/useSharedState.js.map +1 -0
  224. package/cjs/shared/locales/en-GB.d.ts +6 -0
  225. package/cjs/shared/locales/en-GB.js +8 -2
  226. package/cjs/shared/locales/en-GB.js.map +1 -1
  227. package/cjs/shared/locales/en-US.d.ts +6 -0
  228. package/cjs/shared/locales/index.d.ts +12 -0
  229. package/cjs/shared/locales/nb-NO.d.ts +6 -0
  230. package/cjs/shared/locales/nb-NO.js +6 -0
  231. package/cjs/shared/locales/nb-NO.js.map +1 -1
  232. package/cjs/style/dnb-ui-components.css +49 -23
  233. package/cjs/style/dnb-ui-components.min.css +3 -3
  234. package/cjs/style/dnb-ui-extensions.css +12 -14
  235. package/cjs/style/dnb-ui-extensions.min.css +1 -1
  236. package/cjs/style/dnb-ui-forms.css +12 -14
  237. package/cjs/style/dnb-ui-forms.min.css +1 -1
  238. package/cjs/style/dnb-ui-fragments.css +10 -0
  239. package/cjs/style/dnb-ui-fragments.min.css +1 -1
  240. package/cjs/style/dnb-ui-fragments.scss +1 -0
  241. package/cjs/style/themes/theme-eiendom/eiendom-theme-components.css +96 -39
  242. package/cjs/style/themes/theme-eiendom/eiendom-theme-components.min.css +6 -6
  243. package/cjs/style/themes/theme-eiendom/eiendom-theme-components.scss +1 -0
  244. package/cjs/style/themes/theme-eiendom/eiendom-theme-extensions.css +21 -14
  245. package/cjs/style/themes/theme-eiendom/eiendom-theme-extensions.min.css +2 -2
  246. package/cjs/style/themes/theme-eiendom/eiendom-theme-extensions.scss +1 -0
  247. package/cjs/style/themes/theme-eiendom/eiendom-theme-forms.css +21 -14
  248. package/cjs/style/themes/theme-eiendom/eiendom-theme-forms.min.css +2 -2
  249. package/cjs/style/themes/theme-eiendom/eiendom-theme-forms.scss +1 -0
  250. package/cjs/style/themes/theme-sbanken/sbanken-theme-components.css +85 -38
  251. package/cjs/style/themes/theme-sbanken/sbanken-theme-components.min.css +6 -6
  252. package/cjs/style/themes/theme-sbanken/sbanken-theme-components.scss +1 -0
  253. package/cjs/style/themes/theme-sbanken/sbanken-theme-extensions.css +21 -14
  254. package/cjs/style/themes/theme-sbanken/sbanken-theme-extensions.min.css +2 -2
  255. package/cjs/style/themes/theme-sbanken/sbanken-theme-extensions.scss +1 -0
  256. package/cjs/style/themes/theme-sbanken/sbanken-theme-forms.css +21 -14
  257. package/cjs/style/themes/theme-sbanken/sbanken-theme-forms.min.css +2 -2
  258. package/cjs/style/themes/theme-sbanken/sbanken-theme-forms.scss +1 -0
  259. package/cjs/style/themes/theme-ui/ui-theme-components.css +96 -39
  260. package/cjs/style/themes/theme-ui/ui-theme-components.min.css +6 -6
  261. package/cjs/style/themes/theme-ui/ui-theme-components.scss +1 -0
  262. package/cjs/style/themes/theme-ui/ui-theme-extensions.css +21 -14
  263. package/cjs/style/themes/theme-ui/ui-theme-extensions.min.css +2 -2
  264. package/cjs/style/themes/theme-ui/ui-theme-extensions.scss +1 -0
  265. package/cjs/style/themes/theme-ui/ui-theme-forms.css +21 -14
  266. package/cjs/style/themes/theme-ui/ui-theme-forms.min.css +2 -2
  267. package/cjs/style/themes/theme-ui/ui-theme-forms.scss +1 -0
  268. package/components/AriaLive.d.ts +12 -0
  269. package/components/AriaLive.js +4 -0
  270. package/components/AriaLive.js.map +1 -0
  271. package/components/aria-live/AriaLive.d.ts +6 -0
  272. package/components/aria-live/AriaLive.js +15 -0
  273. package/components/aria-live/AriaLive.js.map +1 -0
  274. package/components/aria-live/index.d.ts +7 -0
  275. package/components/aria-live/index.js +4 -0
  276. package/components/aria-live/index.js.map +1 -0
  277. package/components/aria-live/types.d.ts +44 -0
  278. package/components/aria-live/types.js +1 -0
  279. package/components/aria-live/types.js.map +1 -0
  280. package/components/aria-live/useAriaLive.d.ts +273 -0
  281. package/components/aria-live/useAriaLive.js +75 -0
  282. package/components/aria-live/useAriaLive.js.map +1 -0
  283. package/components/autocomplete/Autocomplete.d.ts +0 -1
  284. package/components/autocomplete/Autocomplete.js +24 -46
  285. package/components/autocomplete/Autocomplete.js.map +1 -1
  286. package/components/breadcrumb/Breadcrumb.js +14 -20
  287. package/components/breadcrumb/Breadcrumb.js.map +1 -1
  288. package/components/breadcrumb/BreadcrumbItem.js +11 -5
  289. package/components/breadcrumb/BreadcrumbItem.js.map +1 -1
  290. package/components/breadcrumb/BreadcrumbMultiple.js +1 -1
  291. package/components/breadcrumb/BreadcrumbMultiple.js.map +1 -1
  292. package/components/breadcrumb/style/dnb-breadcrumb.css +13 -3
  293. package/components/breadcrumb/style/dnb-breadcrumb.min.css +1 -1
  294. package/components/breadcrumb/style/dnb-breadcrumb.scss +15 -3
  295. package/components/date-picker/DatePicker.d.ts +3 -0
  296. package/components/date-picker/DatePickerProvider.js +6 -2
  297. package/components/date-picker/DatePickerProvider.js.map +1 -1
  298. package/components/flex/Container.d.ts +4 -2
  299. package/components/flex/Container.js +30 -9
  300. package/components/flex/Container.js.map +1 -1
  301. package/components/flex/style/dnb-flex.css +3 -3
  302. package/components/flex/style/dnb-flex.min.css +1 -1
  303. package/components/flex/style/flex-container.scss +3 -7
  304. package/components/flex/utils.d.ts +1 -1
  305. package/components/flex/utils.js +11 -1
  306. package/components/flex/utils.js.map +1 -1
  307. package/components/index.d.ts +2 -1
  308. package/components/index.js +2 -1
  309. package/components/index.js.map +1 -1
  310. package/components/input/Input.js +0 -3
  311. package/components/input/Input.js.map +1 -1
  312. package/components/input-masked/MultiInputMask.d.ts +10 -2
  313. package/components/input-masked/MultiInputMask.js +75 -39
  314. package/components/input-masked/MultiInputMask.js.map +1 -1
  315. package/components/input-masked/hooks/useMultiInputValues.d.ts +2 -2
  316. package/components/input-masked/hooks/useMultiInputValues.js.map +1 -1
  317. package/components/lib.d.ts +3 -1
  318. package/components/lib.js +3 -1
  319. package/components/lib.js.map +1 -1
  320. package/components/number-format/NumberFormat.js +1 -1
  321. package/components/number-format/NumberFormat.js.map +1 -1
  322. package/components/number-format/NumberUtils.d.ts +8 -2
  323. package/components/number-format/useNumberFormat.d.ts +1 -1
  324. package/components/section/Section.d.ts +6 -3
  325. package/components/section/Section.js.map +1 -1
  326. package/components/section/style/dnb-section.css +1 -0
  327. package/components/section/style/dnb-section.min.css +1 -1
  328. package/components/section/style/dnb-section.scss +1 -0
  329. package/components/space/SpacingUtils.js +5 -1
  330. package/components/space/SpacingUtils.js.map +1 -1
  331. package/components/table/TableAccordion.js +1 -1
  332. package/components/table/TableAccordion.js.map +1 -1
  333. package/components/textarea/Textarea.d.ts +5 -0
  334. package/components/textarea/Textarea.js +16 -3
  335. package/components/textarea/Textarea.js.map +1 -1
  336. package/components/textarea/style/dnb-textarea.css +10 -3
  337. package/components/textarea/style/dnb-textarea.min.css +1 -1
  338. package/components/textarea/style/dnb-textarea.scss +13 -3
  339. package/components/textarea/style/themes/dnb-textarea-theme-ui.css +15 -2
  340. package/components/textarea/style/themes/dnb-textarea-theme-ui.min.css +1 -1
  341. package/components/textarea/style/themes/dnb-textarea-theme-ui.scss +15 -2
  342. package/components/toggle-button/style/themes/dnb-toggle-button-theme-sbanken.css +8 -1
  343. package/components/toggle-button/style/themes/dnb-toggle-button-theme-sbanken.min.css +1 -1
  344. package/components/toggle-button/style/themes/dnb-toggle-button-theme-sbanken.scss +6 -1
  345. package/components/toggle-button/style/themes/dnb-toggle-button-theme-ui.css +4 -0
  346. package/components/toggle-button/style/themes/dnb-toggle-button-theme-ui.min.css +1 -1
  347. package/components/toggle-button/style/themes/dnb-toggle-button-theme-ui.scss +5 -0
  348. package/components/visually-hidden/VisuallyHidden.js +1 -1
  349. package/components/visually-hidden/VisuallyHidden.js.map +1 -1
  350. package/es/components/AriaLive.d.ts +12 -0
  351. package/es/components/AriaLive.js +4 -0
  352. package/es/components/AriaLive.js.map +1 -0
  353. package/es/components/aria-live/AriaLive.d.ts +6 -0
  354. package/es/components/aria-live/AriaLive.js +15 -0
  355. package/es/components/aria-live/AriaLive.js.map +1 -0
  356. package/es/components/aria-live/index.d.ts +7 -0
  357. package/es/components/aria-live/index.js +4 -0
  358. package/es/components/aria-live/index.js.map +1 -0
  359. package/es/components/aria-live/types.d.ts +44 -0
  360. package/es/components/aria-live/types.js +1 -0
  361. package/es/components/aria-live/types.js.map +1 -0
  362. package/es/components/aria-live/useAriaLive.d.ts +273 -0
  363. package/es/components/aria-live/useAriaLive.js +75 -0
  364. package/es/components/aria-live/useAriaLive.js.map +1 -0
  365. package/es/components/autocomplete/Autocomplete.d.ts +0 -1
  366. package/es/components/autocomplete/Autocomplete.js +24 -46
  367. package/es/components/autocomplete/Autocomplete.js.map +1 -1
  368. package/es/components/breadcrumb/Breadcrumb.js +14 -20
  369. package/es/components/breadcrumb/Breadcrumb.js.map +1 -1
  370. package/es/components/breadcrumb/BreadcrumbItem.js +11 -5
  371. package/es/components/breadcrumb/BreadcrumbItem.js.map +1 -1
  372. package/es/components/breadcrumb/BreadcrumbMultiple.js +1 -1
  373. package/es/components/breadcrumb/BreadcrumbMultiple.js.map +1 -1
  374. package/es/components/breadcrumb/style/dnb-breadcrumb.css +13 -3
  375. package/es/components/breadcrumb/style/dnb-breadcrumb.min.css +1 -1
  376. package/es/components/breadcrumb/style/dnb-breadcrumb.scss +15 -3
  377. package/es/components/date-picker/DatePicker.d.ts +3 -0
  378. package/es/components/date-picker/DatePickerProvider.js +6 -2
  379. package/es/components/date-picker/DatePickerProvider.js.map +1 -1
  380. package/es/components/flex/Container.d.ts +4 -2
  381. package/es/components/flex/Container.js +30 -9
  382. package/es/components/flex/Container.js.map +1 -1
  383. package/es/components/flex/style/dnb-flex.css +3 -3
  384. package/es/components/flex/style/dnb-flex.min.css +1 -1
  385. package/es/components/flex/style/flex-container.scss +3 -7
  386. package/es/components/flex/utils.d.ts +1 -1
  387. package/es/components/flex/utils.js +11 -1
  388. package/es/components/flex/utils.js.map +1 -1
  389. package/es/components/index.d.ts +2 -1
  390. package/es/components/index.js +2 -1
  391. package/es/components/index.js.map +1 -1
  392. package/es/components/input/Input.js +0 -3
  393. package/es/components/input/Input.js.map +1 -1
  394. package/es/components/input-masked/MultiInputMask.d.ts +10 -2
  395. package/es/components/input-masked/MultiInputMask.js +73 -36
  396. package/es/components/input-masked/MultiInputMask.js.map +1 -1
  397. package/es/components/input-masked/hooks/useMultiInputValues.d.ts +2 -2
  398. package/es/components/input-masked/hooks/useMultiInputValues.js.map +1 -1
  399. package/es/components/lib.d.ts +3 -1
  400. package/es/components/lib.js +3 -1
  401. package/es/components/lib.js.map +1 -1
  402. package/es/components/number-format/NumberFormat.js +1 -1
  403. package/es/components/number-format/NumberFormat.js.map +1 -1
  404. package/es/components/number-format/NumberUtils.d.ts +8 -2
  405. package/es/components/number-format/useNumberFormat.d.ts +1 -1
  406. package/es/components/section/Section.d.ts +6 -3
  407. package/es/components/section/Section.js.map +1 -1
  408. package/es/components/section/style/dnb-section.css +1 -0
  409. package/es/components/section/style/dnb-section.min.css +1 -1
  410. package/es/components/section/style/dnb-section.scss +1 -0
  411. package/es/components/space/SpacingUtils.js +5 -1
  412. package/es/components/space/SpacingUtils.js.map +1 -1
  413. package/es/components/table/TableAccordion.js +1 -1
  414. package/es/components/table/TableAccordion.js.map +1 -1
  415. package/es/components/textarea/Textarea.d.ts +5 -0
  416. package/es/components/textarea/Textarea.js +16 -3
  417. package/es/components/textarea/Textarea.js.map +1 -1
  418. package/es/components/textarea/style/dnb-textarea.css +10 -3
  419. package/es/components/textarea/style/dnb-textarea.min.css +1 -1
  420. package/es/components/textarea/style/dnb-textarea.scss +13 -3
  421. package/es/components/textarea/style/themes/dnb-textarea-theme-ui.css +15 -2
  422. package/es/components/textarea/style/themes/dnb-textarea-theme-ui.min.css +1 -1
  423. package/es/components/textarea/style/themes/dnb-textarea-theme-ui.scss +15 -2
  424. package/es/components/toggle-button/style/themes/dnb-toggle-button-theme-sbanken.css +8 -1
  425. package/es/components/toggle-button/style/themes/dnb-toggle-button-theme-sbanken.min.css +1 -1
  426. package/es/components/toggle-button/style/themes/dnb-toggle-button-theme-sbanken.scss +6 -1
  427. package/es/components/toggle-button/style/themes/dnb-toggle-button-theme-ui.css +4 -0
  428. package/es/components/toggle-button/style/themes/dnb-toggle-button-theme-ui.min.css +1 -1
  429. package/es/components/toggle-button/style/themes/dnb-toggle-button-theme-ui.scss +5 -0
  430. package/es/components/visually-hidden/VisuallyHidden.js +1 -1
  431. package/es/components/visually-hidden/VisuallyHidden.js.map +1 -1
  432. package/es/extensions/forms/DataContext/Provider/Provider.d.ts +8 -4
  433. package/es/extensions/forms/DataContext/Provider/Provider.js +32 -4
  434. package/es/extensions/forms/DataContext/Provider/Provider.js.map +1 -1
  435. package/es/extensions/forms/Field/ArraySelection/ArraySelection.js +17 -15
  436. package/es/extensions/forms/Field/ArraySelection/ArraySelection.js.map +1 -1
  437. package/es/extensions/forms/Field/ArraySelection/style/dnb-array-selection.css +12 -2
  438. package/es/extensions/forms/Field/ArraySelection/style/dnb-array-selection.min.css +1 -1
  439. package/es/extensions/forms/Field/ArraySelection/style/dnb-array-selection.scss +12 -2
  440. package/es/extensions/forms/Field/BankAccountNumber/BankAccountNumber.d.ts +2 -2
  441. package/es/extensions/forms/Field/BankAccountNumber/BankAccountNumber.js +3 -3
  442. package/es/extensions/forms/Field/BankAccountNumber/BankAccountNumber.js.map +1 -1
  443. package/es/extensions/forms/Field/Boolean/Boolean.d.ts +2 -2
  444. package/es/extensions/forms/Field/Boolean/Boolean.js +2 -2
  445. package/es/extensions/forms/Field/Boolean/Boolean.js.map +1 -1
  446. package/es/extensions/forms/Field/Currency/Currency.d.ts +2 -2
  447. package/es/extensions/forms/Field/Currency/Currency.js +2 -2
  448. package/es/extensions/forms/Field/Currency/Currency.js.map +1 -1
  449. package/es/extensions/forms/Field/Date/Date.js +4 -5
  450. package/es/extensions/forms/Field/Date/Date.js.map +1 -1
  451. package/es/extensions/forms/Field/Email/Email.d.ts +2 -2
  452. package/es/extensions/forms/Field/Email/Email.js +3 -3
  453. package/es/extensions/forms/Field/Email/Email.js.map +1 -1
  454. package/es/extensions/forms/Field/Expiry/Expiry.d.ts +1 -1
  455. package/es/extensions/forms/Field/Expiry/Expiry.js +32 -22
  456. package/es/extensions/forms/Field/Expiry/Expiry.js.map +1 -1
  457. package/es/extensions/forms/Field/NationalIdentityNumber/NationalIdentityNumber.d.ts +2 -2
  458. package/es/extensions/forms/Field/NationalIdentityNumber/NationalIdentityNumber.js +3 -3
  459. package/es/extensions/forms/Field/NationalIdentityNumber/NationalIdentityNumber.js.map +1 -1
  460. package/es/extensions/forms/Field/Number/Number.js +12 -15
  461. package/es/extensions/forms/Field/Number/Number.js.map +1 -1
  462. package/es/extensions/forms/Field/Number/style/dnb-number.css +0 -6
  463. package/es/extensions/forms/Field/Number/style/dnb-number.min.css +1 -1
  464. package/es/extensions/forms/Field/Number/style/dnb-number.scss +0 -1
  465. package/es/extensions/forms/Field/Number/style/themes/dnb-number-theme-sbanken.css +4 -0
  466. package/es/extensions/forms/Field/Number/style/themes/dnb-number-theme-sbanken.min.css +1 -1
  467. package/es/extensions/forms/Field/Number/style/themes/dnb-number-theme-sbanken.scss +7 -0
  468. package/es/extensions/forms/Field/Number/style/themes/dnb-number-theme-ui.css +4 -0
  469. package/es/extensions/forms/Field/Number/style/themes/dnb-number-theme-ui.min.css +1 -1
  470. package/es/extensions/forms/Field/Number/style/themes/dnb-number-theme-ui.scss +9 -0
  471. package/es/extensions/forms/Field/OrganizationNumber/OrganizationNumber.d.ts +2 -2
  472. package/es/extensions/forms/Field/OrganizationNumber/OrganizationNumber.js +3 -3
  473. package/es/extensions/forms/Field/OrganizationNumber/OrganizationNumber.js.map +1 -1
  474. package/es/extensions/forms/Field/PhoneNumber/PhoneNumber.d.ts +2 -2
  475. package/es/extensions/forms/Field/PhoneNumber/PhoneNumber.js +18 -12
  476. package/es/extensions/forms/Field/PhoneNumber/PhoneNumber.js.map +1 -1
  477. package/es/extensions/forms/Field/PostalCodeAndCity/PostalCodeAndCity.d.ts +2 -2
  478. package/es/extensions/forms/Field/PostalCodeAndCity/PostalCodeAndCity.js +3 -3
  479. package/es/extensions/forms/Field/PostalCodeAndCity/PostalCodeAndCity.js.map +1 -1
  480. package/es/extensions/forms/Field/SelectCountry/SelectCountry.js +6 -3
  481. package/es/extensions/forms/Field/SelectCountry/SelectCountry.js.map +1 -1
  482. package/es/extensions/forms/Field/Selection/Selection.d.ts +7 -1
  483. package/es/extensions/forms/Field/Selection/Selection.js +12 -12
  484. package/es/extensions/forms/Field/Selection/Selection.js.map +1 -1
  485. package/es/extensions/forms/Field/String/String.d.ts +3 -2
  486. package/es/extensions/forms/Field/String/String.js +11 -11
  487. package/es/extensions/forms/Field/String/String.js.map +1 -1
  488. package/es/extensions/forms/Field/Toggle/Toggle.js +14 -14
  489. package/es/extensions/forms/Field/Toggle/Toggle.js.map +1 -1
  490. package/es/extensions/forms/FieldBlock/FieldBlock.d.ts +2 -2
  491. package/es/extensions/forms/FieldBlock/FieldBlock.js +5 -8
  492. package/es/extensions/forms/FieldBlock/FieldBlock.js.map +1 -1
  493. package/es/extensions/forms/FieldBlock/style/dnb-field-block.css +0 -6
  494. package/es/extensions/forms/FieldBlock/style/dnb-field-block.min.css +1 -1
  495. package/es/extensions/forms/FieldBlock/style/dnb-field-block.scss +0 -7
  496. package/es/extensions/forms/FieldBlock/style/themes/dnb-field-block-sbanken.css +4 -0
  497. package/es/extensions/forms/FieldBlock/style/themes/dnb-field-block-sbanken.min.css +1 -0
  498. package/es/extensions/forms/FieldBlock/style/themes/dnb-field-block-sbanken.scss +6 -0
  499. package/es/extensions/forms/FieldBlock/style/themes/dnb-field-block-theme-ui.css +4 -0
  500. package/es/extensions/forms/FieldBlock/style/themes/dnb-field-block-theme-ui.min.css +1 -0
  501. package/es/extensions/forms/FieldBlock/style/themes/dnb-field-block-theme-ui.scss +6 -0
  502. package/es/extensions/forms/Form/Handler/Handler.js +1 -0
  503. package/es/extensions/forms/Form/Handler/Handler.js.map +1 -1
  504. package/es/extensions/forms/Form/Visibility/Visibility.js +0 -1
  505. package/es/extensions/forms/Form/Visibility/Visibility.js.map +1 -1
  506. package/es/extensions/forms/Form/hooks/useData.d.ts +10 -0
  507. package/es/extensions/forms/Form/hooks/useData.js +32 -0
  508. package/es/extensions/forms/Form/hooks/useData.js.map +1 -0
  509. package/es/extensions/forms/Form/index.d.ts +1 -0
  510. package/es/extensions/forms/Form/index.js +1 -0
  511. package/es/extensions/forms/Form/index.js.map +1 -1
  512. package/es/extensions/forms/Iterate/Array/Array.js +1 -3
  513. package/es/extensions/forms/Iterate/Array/Array.js.map +1 -1
  514. package/es/extensions/forms/Value/BankAccountNumber/BankAccountNumber.d.ts +2 -2
  515. package/es/extensions/forms/Value/BankAccountNumber/BankAccountNumber.js +2 -2
  516. package/es/extensions/forms/Value/BankAccountNumber/BankAccountNumber.js.map +1 -1
  517. package/es/extensions/forms/Value/Currency/Currency.d.ts +2 -2
  518. package/es/extensions/forms/Value/Currency/Currency.js +2 -2
  519. package/es/extensions/forms/Value/Currency/Currency.js.map +1 -1
  520. package/es/extensions/forms/Value/Date/Date.d.ts +2 -2
  521. package/es/extensions/forms/Value/Date/Date.js +2 -2
  522. package/es/extensions/forms/Value/Date/Date.js.map +1 -1
  523. package/es/extensions/forms/Value/Email/Email.d.ts +2 -2
  524. package/es/extensions/forms/Value/Email/Email.js +2 -2
  525. package/es/extensions/forms/Value/Email/Email.js.map +1 -1
  526. package/es/extensions/forms/Value/NationalIdentityNumber/NationalIdentityNumber.d.ts +2 -2
  527. package/es/extensions/forms/Value/NationalIdentityNumber/NationalIdentityNumber.js +2 -2
  528. package/es/extensions/forms/Value/NationalIdentityNumber/NationalIdentityNumber.js.map +1 -1
  529. package/es/extensions/forms/Value/PhoneNumber/PhoneNumber.d.ts +2 -2
  530. package/es/extensions/forms/Value/PhoneNumber/PhoneNumber.js +2 -2
  531. package/es/extensions/forms/Value/PhoneNumber/PhoneNumber.js.map +1 -1
  532. package/es/extensions/forms/hooks/useDataValue.d.ts +4 -0
  533. package/es/extensions/forms/hooks/useDataValue.js +13 -9
  534. package/es/extensions/forms/hooks/useDataValue.js.map +1 -1
  535. package/es/extensions/forms/style/dnb-forms.css +12 -14
  536. package/es/extensions/forms/style/dnb-forms.min.css +1 -1
  537. package/es/extensions/forms/types.d.ts +7 -9
  538. package/es/extensions/forms/types.js.map +1 -1
  539. package/es/fragments/TextCounter.d.ts +12 -0
  540. package/es/fragments/TextCounter.js +4 -0
  541. package/es/fragments/TextCounter.js.map +1 -0
  542. package/es/fragments/drawer-list/DrawerListHelpers.js +1 -0
  543. package/es/fragments/drawer-list/DrawerListHelpers.js.map +1 -1
  544. package/es/fragments/index.d.ts +2 -1
  545. package/es/fragments/index.js +2 -1
  546. package/es/fragments/index.js.map +1 -1
  547. package/es/fragments/lib.d.ts +3 -1
  548. package/es/fragments/lib.js +4 -2
  549. package/es/fragments/lib.js.map +1 -1
  550. package/es/fragments/text-counter/TextCounter.d.ts +8 -0
  551. package/es/fragments/text-counter/TextCounter.js +52 -0
  552. package/es/fragments/text-counter/TextCounter.js.map +1 -0
  553. package/es/fragments/text-counter/index.d.ts +5 -0
  554. package/es/fragments/text-counter/index.js +1 -0
  555. package/es/fragments/text-counter/index.js.map +1 -0
  556. package/es/fragments/text-counter/style/dnb-text-counter.scss +15 -0
  557. package/es/fragments/text-counter/style/index.d.ts +1 -0
  558. package/es/fragments/text-counter/style/index.js +1 -0
  559. package/es/fragments/text-counter/style/index.js.map +1 -0
  560. package/es/fragments/text-counter/style/themes/dnb-text-counter-theme-sbanken.scss +8 -0
  561. package/es/fragments/text-counter/style/themes/dnb-text-counter-theme-ui.scss +8 -0
  562. package/es/fragments/text-counter/style/themes/ui.d.ts +1 -0
  563. package/es/fragments/text-counter/style/themes/ui.js +1 -0
  564. package/es/fragments/text-counter/style/themes/ui.js.map +1 -0
  565. package/es/fragments/text-counter/style.d.ts +5 -0
  566. package/es/fragments/text-counter/style.js +1 -0
  567. package/es/fragments/text-counter/style.js.map +1 -0
  568. package/es/index.d.ts +2 -1
  569. package/es/index.js +2 -1
  570. package/es/index.js.map +1 -1
  571. package/es/shared/Eufemia.d.ts +1 -1
  572. package/es/shared/Eufemia.js +2 -2
  573. package/es/shared/Eufemia.js.map +1 -1
  574. package/es/shared/helpers/EventEmitter.d.ts +5 -0
  575. package/es/shared/helpers/EventEmitter.js.map +1 -1
  576. package/es/shared/helpers/useEventEmitter.d.ts +2 -0
  577. package/es/shared/helpers/useEventEmitter.js.map +1 -1
  578. package/es/shared/helpers/useSharedState.d.ts +17 -0
  579. package/es/shared/helpers/useSharedState.js +80 -0
  580. package/es/shared/helpers/useSharedState.js.map +1 -0
  581. package/es/shared/locales/en-GB.d.ts +6 -0
  582. package/es/shared/locales/en-GB.js +8 -2
  583. package/es/shared/locales/en-GB.js.map +1 -1
  584. package/es/shared/locales/en-US.d.ts +6 -0
  585. package/es/shared/locales/index.d.ts +12 -0
  586. package/es/shared/locales/nb-NO.d.ts +6 -0
  587. package/es/shared/locales/nb-NO.js +6 -0
  588. package/es/shared/locales/nb-NO.js.map +1 -1
  589. package/es/style/dnb-ui-components.css +49 -23
  590. package/es/style/dnb-ui-components.min.css +3 -3
  591. package/es/style/dnb-ui-extensions.css +12 -14
  592. package/es/style/dnb-ui-extensions.min.css +1 -1
  593. package/es/style/dnb-ui-forms.css +12 -14
  594. package/es/style/dnb-ui-forms.min.css +1 -1
  595. package/es/style/dnb-ui-fragments.css +10 -0
  596. package/es/style/dnb-ui-fragments.min.css +1 -1
  597. package/es/style/dnb-ui-fragments.scss +1 -0
  598. package/es/style/themes/theme-eiendom/eiendom-theme-components.css +96 -39
  599. package/es/style/themes/theme-eiendom/eiendom-theme-components.min.css +6 -6
  600. package/es/style/themes/theme-eiendom/eiendom-theme-components.scss +1 -0
  601. package/es/style/themes/theme-eiendom/eiendom-theme-extensions.css +21 -14
  602. package/es/style/themes/theme-eiendom/eiendom-theme-extensions.min.css +2 -2
  603. package/es/style/themes/theme-eiendom/eiendom-theme-extensions.scss +1 -0
  604. package/es/style/themes/theme-eiendom/eiendom-theme-forms.css +21 -14
  605. package/es/style/themes/theme-eiendom/eiendom-theme-forms.min.css +2 -2
  606. package/es/style/themes/theme-eiendom/eiendom-theme-forms.scss +1 -0
  607. package/es/style/themes/theme-sbanken/sbanken-theme-components.css +85 -38
  608. package/es/style/themes/theme-sbanken/sbanken-theme-components.min.css +6 -6
  609. package/es/style/themes/theme-sbanken/sbanken-theme-components.scss +1 -0
  610. package/es/style/themes/theme-sbanken/sbanken-theme-extensions.css +21 -14
  611. package/es/style/themes/theme-sbanken/sbanken-theme-extensions.min.css +2 -2
  612. package/es/style/themes/theme-sbanken/sbanken-theme-extensions.scss +1 -0
  613. package/es/style/themes/theme-sbanken/sbanken-theme-forms.css +21 -14
  614. package/es/style/themes/theme-sbanken/sbanken-theme-forms.min.css +2 -2
  615. package/es/style/themes/theme-sbanken/sbanken-theme-forms.scss +1 -0
  616. package/es/style/themes/theme-ui/ui-theme-components.css +96 -39
  617. package/es/style/themes/theme-ui/ui-theme-components.min.css +6 -6
  618. package/es/style/themes/theme-ui/ui-theme-components.scss +1 -0
  619. package/es/style/themes/theme-ui/ui-theme-extensions.css +21 -14
  620. package/es/style/themes/theme-ui/ui-theme-extensions.min.css +2 -2
  621. package/es/style/themes/theme-ui/ui-theme-extensions.scss +1 -0
  622. package/es/style/themes/theme-ui/ui-theme-forms.css +21 -14
  623. package/es/style/themes/theme-ui/ui-theme-forms.min.css +2 -2
  624. package/es/style/themes/theme-ui/ui-theme-forms.scss +1 -0
  625. package/esm/dnb-ui-basis.min.mjs +1 -1
  626. package/esm/dnb-ui-components.min.mjs +1 -1
  627. package/esm/dnb-ui-elements.min.mjs +1 -1
  628. package/esm/dnb-ui-extensions.min.mjs +3 -3
  629. package/esm/dnb-ui-lib.min.mjs +1 -1
  630. package/extensions/forms/DataContext/Provider/Provider.d.ts +8 -4
  631. package/extensions/forms/DataContext/Provider/Provider.js +32 -4
  632. package/extensions/forms/DataContext/Provider/Provider.js.map +1 -1
  633. package/extensions/forms/Field/ArraySelection/ArraySelection.js +17 -15
  634. package/extensions/forms/Field/ArraySelection/ArraySelection.js.map +1 -1
  635. package/extensions/forms/Field/ArraySelection/style/dnb-array-selection.css +12 -2
  636. package/extensions/forms/Field/ArraySelection/style/dnb-array-selection.min.css +1 -1
  637. package/extensions/forms/Field/ArraySelection/style/dnb-array-selection.scss +12 -2
  638. package/extensions/forms/Field/BankAccountNumber/BankAccountNumber.d.ts +2 -2
  639. package/extensions/forms/Field/BankAccountNumber/BankAccountNumber.js +3 -3
  640. package/extensions/forms/Field/BankAccountNumber/BankAccountNumber.js.map +1 -1
  641. package/extensions/forms/Field/Boolean/Boolean.d.ts +2 -2
  642. package/extensions/forms/Field/Boolean/Boolean.js +2 -2
  643. package/extensions/forms/Field/Boolean/Boolean.js.map +1 -1
  644. package/extensions/forms/Field/Currency/Currency.d.ts +2 -2
  645. package/extensions/forms/Field/Currency/Currency.js +2 -2
  646. package/extensions/forms/Field/Currency/Currency.js.map +1 -1
  647. package/extensions/forms/Field/Date/Date.js +4 -5
  648. package/extensions/forms/Field/Date/Date.js.map +1 -1
  649. package/extensions/forms/Field/Email/Email.d.ts +2 -2
  650. package/extensions/forms/Field/Email/Email.js +3 -3
  651. package/extensions/forms/Field/Email/Email.js.map +1 -1
  652. package/extensions/forms/Field/Expiry/Expiry.d.ts +1 -1
  653. package/extensions/forms/Field/Expiry/Expiry.js +33 -22
  654. package/extensions/forms/Field/Expiry/Expiry.js.map +1 -1
  655. package/extensions/forms/Field/NationalIdentityNumber/NationalIdentityNumber.d.ts +2 -2
  656. package/extensions/forms/Field/NationalIdentityNumber/NationalIdentityNumber.js +3 -3
  657. package/extensions/forms/Field/NationalIdentityNumber/NationalIdentityNumber.js.map +1 -1
  658. package/extensions/forms/Field/Number/Number.js +12 -15
  659. package/extensions/forms/Field/Number/Number.js.map +1 -1
  660. package/extensions/forms/Field/Number/style/dnb-number.css +0 -6
  661. package/extensions/forms/Field/Number/style/dnb-number.min.css +1 -1
  662. package/extensions/forms/Field/Number/style/dnb-number.scss +0 -1
  663. package/extensions/forms/Field/Number/style/themes/dnb-number-theme-sbanken.css +4 -0
  664. package/extensions/forms/Field/Number/style/themes/dnb-number-theme-sbanken.min.css +1 -1
  665. package/extensions/forms/Field/Number/style/themes/dnb-number-theme-sbanken.scss +7 -0
  666. package/extensions/forms/Field/Number/style/themes/dnb-number-theme-ui.css +4 -0
  667. package/extensions/forms/Field/Number/style/themes/dnb-number-theme-ui.min.css +1 -1
  668. package/extensions/forms/Field/Number/style/themes/dnb-number-theme-ui.scss +9 -0
  669. package/extensions/forms/Field/OrganizationNumber/OrganizationNumber.d.ts +2 -2
  670. package/extensions/forms/Field/OrganizationNumber/OrganizationNumber.js +3 -3
  671. package/extensions/forms/Field/OrganizationNumber/OrganizationNumber.js.map +1 -1
  672. package/extensions/forms/Field/PhoneNumber/PhoneNumber.d.ts +2 -2
  673. package/extensions/forms/Field/PhoneNumber/PhoneNumber.js +18 -12
  674. package/extensions/forms/Field/PhoneNumber/PhoneNumber.js.map +1 -1
  675. package/extensions/forms/Field/PostalCodeAndCity/PostalCodeAndCity.d.ts +2 -2
  676. package/extensions/forms/Field/PostalCodeAndCity/PostalCodeAndCity.js +3 -3
  677. package/extensions/forms/Field/PostalCodeAndCity/PostalCodeAndCity.js.map +1 -1
  678. package/extensions/forms/Field/SelectCountry/SelectCountry.js +6 -3
  679. package/extensions/forms/Field/SelectCountry/SelectCountry.js.map +1 -1
  680. package/extensions/forms/Field/Selection/Selection.d.ts +7 -1
  681. package/extensions/forms/Field/Selection/Selection.js +12 -12
  682. package/extensions/forms/Field/Selection/Selection.js.map +1 -1
  683. package/extensions/forms/Field/String/String.d.ts +3 -2
  684. package/extensions/forms/Field/String/String.js +11 -11
  685. package/extensions/forms/Field/String/String.js.map +1 -1
  686. package/extensions/forms/Field/Toggle/Toggle.js +14 -14
  687. package/extensions/forms/Field/Toggle/Toggle.js.map +1 -1
  688. package/extensions/forms/FieldBlock/FieldBlock.d.ts +2 -2
  689. package/extensions/forms/FieldBlock/FieldBlock.js +5 -8
  690. package/extensions/forms/FieldBlock/FieldBlock.js.map +1 -1
  691. package/extensions/forms/FieldBlock/style/dnb-field-block.css +0 -6
  692. package/extensions/forms/FieldBlock/style/dnb-field-block.min.css +1 -1
  693. package/extensions/forms/FieldBlock/style/dnb-field-block.scss +0 -7
  694. package/extensions/forms/FieldBlock/style/themes/dnb-field-block-sbanken.css +4 -0
  695. package/extensions/forms/FieldBlock/style/themes/dnb-field-block-sbanken.min.css +1 -0
  696. package/extensions/forms/FieldBlock/style/themes/dnb-field-block-sbanken.scss +6 -0
  697. package/extensions/forms/FieldBlock/style/themes/dnb-field-block-theme-ui.css +4 -0
  698. package/extensions/forms/FieldBlock/style/themes/dnb-field-block-theme-ui.min.css +1 -0
  699. package/extensions/forms/FieldBlock/style/themes/dnb-field-block-theme-ui.scss +6 -0
  700. package/extensions/forms/Form/Handler/Handler.js +1 -0
  701. package/extensions/forms/Form/Handler/Handler.js.map +1 -1
  702. package/extensions/forms/Form/Visibility/Visibility.js +0 -1
  703. package/extensions/forms/Form/Visibility/Visibility.js.map +1 -1
  704. package/extensions/forms/Form/hooks/useData.d.ts +10 -0
  705. package/extensions/forms/Form/hooks/useData.js +33 -0
  706. package/extensions/forms/Form/hooks/useData.js.map +1 -0
  707. package/extensions/forms/Form/index.d.ts +1 -0
  708. package/extensions/forms/Form/index.js +1 -0
  709. package/extensions/forms/Form/index.js.map +1 -1
  710. package/extensions/forms/Iterate/Array/Array.js +1 -3
  711. package/extensions/forms/Iterate/Array/Array.js.map +1 -1
  712. package/extensions/forms/Value/BankAccountNumber/BankAccountNumber.d.ts +2 -2
  713. package/extensions/forms/Value/BankAccountNumber/BankAccountNumber.js +2 -2
  714. package/extensions/forms/Value/BankAccountNumber/BankAccountNumber.js.map +1 -1
  715. package/extensions/forms/Value/Currency/Currency.d.ts +2 -2
  716. package/extensions/forms/Value/Currency/Currency.js +2 -2
  717. package/extensions/forms/Value/Currency/Currency.js.map +1 -1
  718. package/extensions/forms/Value/Date/Date.d.ts +2 -2
  719. package/extensions/forms/Value/Date/Date.js +2 -2
  720. package/extensions/forms/Value/Date/Date.js.map +1 -1
  721. package/extensions/forms/Value/Email/Email.d.ts +2 -2
  722. package/extensions/forms/Value/Email/Email.js +2 -2
  723. package/extensions/forms/Value/Email/Email.js.map +1 -1
  724. package/extensions/forms/Value/NationalIdentityNumber/NationalIdentityNumber.d.ts +2 -2
  725. package/extensions/forms/Value/NationalIdentityNumber/NationalIdentityNumber.js +2 -2
  726. package/extensions/forms/Value/NationalIdentityNumber/NationalIdentityNumber.js.map +1 -1
  727. package/extensions/forms/Value/PhoneNumber/PhoneNumber.d.ts +2 -2
  728. package/extensions/forms/Value/PhoneNumber/PhoneNumber.js +2 -2
  729. package/extensions/forms/Value/PhoneNumber/PhoneNumber.js.map +1 -1
  730. package/extensions/forms/hooks/useDataValue.d.ts +4 -0
  731. package/extensions/forms/hooks/useDataValue.js +14 -10
  732. package/extensions/forms/hooks/useDataValue.js.map +1 -1
  733. package/extensions/forms/style/dnb-forms.css +12 -14
  734. package/extensions/forms/style/dnb-forms.min.css +1 -1
  735. package/extensions/forms/types.d.ts +7 -9
  736. package/extensions/forms/types.js.map +1 -1
  737. package/fragments/TextCounter.d.ts +12 -0
  738. package/fragments/TextCounter.js +4 -0
  739. package/fragments/TextCounter.js.map +1 -0
  740. package/fragments/drawer-list/DrawerListHelpers.js +1 -0
  741. package/fragments/drawer-list/DrawerListHelpers.js.map +1 -1
  742. package/fragments/index.d.ts +2 -1
  743. package/fragments/index.js +2 -1
  744. package/fragments/index.js.map +1 -1
  745. package/fragments/lib.d.ts +3 -1
  746. package/fragments/lib.js +4 -2
  747. package/fragments/lib.js.map +1 -1
  748. package/fragments/text-counter/TextCounter.d.ts +8 -0
  749. package/fragments/text-counter/TextCounter.js +52 -0
  750. package/fragments/text-counter/TextCounter.js.map +1 -0
  751. package/fragments/text-counter/index.d.ts +5 -0
  752. package/fragments/text-counter/index.js +1 -0
  753. package/fragments/text-counter/index.js.map +1 -0
  754. package/fragments/text-counter/style/dnb-text-counter.scss +15 -0
  755. package/fragments/text-counter/style/index.d.ts +1 -0
  756. package/fragments/text-counter/style/index.js +1 -0
  757. package/fragments/text-counter/style/index.js.map +1 -0
  758. package/fragments/text-counter/style/themes/dnb-text-counter-theme-sbanken.scss +8 -0
  759. package/fragments/text-counter/style/themes/dnb-text-counter-theme-ui.scss +8 -0
  760. package/fragments/text-counter/style/themes/ui.d.ts +1 -0
  761. package/fragments/text-counter/style/themes/ui.js +1 -0
  762. package/fragments/text-counter/style/themes/ui.js.map +1 -0
  763. package/fragments/text-counter/style.d.ts +5 -0
  764. package/fragments/text-counter/style.js +1 -0
  765. package/fragments/text-counter/style.js.map +1 -0
  766. package/index.d.ts +2 -1
  767. package/index.js +2 -1
  768. package/index.js.map +1 -1
  769. package/package.json +1 -1
  770. package/shared/Eufemia.d.ts +1 -1
  771. package/shared/Eufemia.js +2 -2
  772. package/shared/Eufemia.js.map +1 -1
  773. package/shared/helpers/EventEmitter.d.ts +5 -0
  774. package/shared/helpers/EventEmitter.js.map +1 -1
  775. package/shared/helpers/useEventEmitter.d.ts +2 -0
  776. package/shared/helpers/useEventEmitter.js.map +1 -1
  777. package/shared/helpers/useSharedState.d.ts +17 -0
  778. package/shared/helpers/useSharedState.js +82 -0
  779. package/shared/helpers/useSharedState.js.map +1 -0
  780. package/shared/locales/en-GB.d.ts +6 -0
  781. package/shared/locales/en-GB.js +8 -2
  782. package/shared/locales/en-GB.js.map +1 -1
  783. package/shared/locales/en-US.d.ts +6 -0
  784. package/shared/locales/index.d.ts +12 -0
  785. package/shared/locales/nb-NO.d.ts +6 -0
  786. package/shared/locales/nb-NO.js +6 -0
  787. package/shared/locales/nb-NO.js.map +1 -1
  788. package/style/dnb-ui-components.css +49 -23
  789. package/style/dnb-ui-components.min.css +3 -3
  790. package/style/dnb-ui-extensions.css +12 -14
  791. package/style/dnb-ui-extensions.min.css +1 -1
  792. package/style/dnb-ui-forms.css +12 -14
  793. package/style/dnb-ui-forms.min.css +1 -1
  794. package/style/dnb-ui-fragments.css +10 -0
  795. package/style/dnb-ui-fragments.min.css +1 -1
  796. package/style/dnb-ui-fragments.scss +1 -0
  797. package/style/themes/theme-eiendom/eiendom-theme-components.css +96 -39
  798. package/style/themes/theme-eiendom/eiendom-theme-components.min.css +6 -6
  799. package/style/themes/theme-eiendom/eiendom-theme-components.scss +1 -0
  800. package/style/themes/theme-eiendom/eiendom-theme-extensions.css +21 -14
  801. package/style/themes/theme-eiendom/eiendom-theme-extensions.min.css +2 -2
  802. package/style/themes/theme-eiendom/eiendom-theme-extensions.scss +1 -0
  803. package/style/themes/theme-eiendom/eiendom-theme-forms.css +21 -14
  804. package/style/themes/theme-eiendom/eiendom-theme-forms.min.css +2 -2
  805. package/style/themes/theme-eiendom/eiendom-theme-forms.scss +1 -0
  806. package/style/themes/theme-sbanken/sbanken-theme-components.css +85 -38
  807. package/style/themes/theme-sbanken/sbanken-theme-components.min.css +6 -6
  808. package/style/themes/theme-sbanken/sbanken-theme-components.scss +1 -0
  809. package/style/themes/theme-sbanken/sbanken-theme-extensions.css +21 -14
  810. package/style/themes/theme-sbanken/sbanken-theme-extensions.min.css +2 -2
  811. package/style/themes/theme-sbanken/sbanken-theme-extensions.scss +1 -0
  812. package/style/themes/theme-sbanken/sbanken-theme-forms.css +21 -14
  813. package/style/themes/theme-sbanken/sbanken-theme-forms.min.css +2 -2
  814. package/style/themes/theme-sbanken/sbanken-theme-forms.scss +1 -0
  815. package/style/themes/theme-ui/ui-theme-components.css +96 -39
  816. package/style/themes/theme-ui/ui-theme-components.min.css +6 -6
  817. package/style/themes/theme-ui/ui-theme-components.scss +1 -0
  818. package/style/themes/theme-ui/ui-theme-extensions.css +21 -14
  819. package/style/themes/theme-ui/ui-theme-extensions.min.css +2 -2
  820. package/style/themes/theme-ui/ui-theme-extensions.scss +1 -0
  821. package/style/themes/theme-ui/ui-theme-forms.css +21 -14
  822. package/style/themes/theme-ui/ui-theme-forms.min.css +2 -2
  823. package/style/themes/theme-ui/ui-theme-forms.scss +1 -0
  824. package/umd/dnb-ui-basis.min.js +1 -1
  825. package/umd/dnb-ui-components.min.js +1 -1
  826. package/umd/dnb-ui-elements.min.js +1 -1
  827. package/umd/dnb-ui-extensions.min.js +3 -3
  828. package/umd/dnb-ui-lib.min.js +1 -1
@@ -58,4 +58,5 @@ $fonts-path: '../../../../assets/fonts/dnb' !default;
58
58
  @import '../../../components/upload/style/themes/dnb-upload-theme-ui.scss';
59
59
  @import '../../../fragments/drawer-list/style/themes/dnb-drawer-list-theme-ui.scss';
60
60
  @import '../../../fragments/scroll-view/style/themes/dnb-scroll-view-theme-ui.scss';
61
+ @import '../../../fragments/text-counter/style/themes/dnb-text-counter-theme-ui.scss';
61
62
  @import './eiendom-theme-forms.scss';
@@ -18,16 +18,26 @@
18
18
  /*
19
19
  * Utilities
20
20
  */
21
- .dnb-forms-field-array-selection--options-layout-vertical .dnb-forms-field-array-selection__options {
21
+ /*
22
+ * Utilities
23
+ */
24
+ .dnb-forms-field-array-selection--layout-vertical .dnb-forms-field-array-selection__options {
22
25
  display: flex;
23
26
  flex-flow: column;
24
27
  row-gap: var(--spacing-x-small);
25
28
  }
26
- .dnb-forms-field-array-selection--options-layout-horizontal .dnb-forms-field-array-selection__options {
29
+ .dnb-forms-field-array-selection--layout-horizontal .dnb-forms-field-array-selection__options {
27
30
  display: flex;
28
31
  flex-flow: row wrap;
29
32
  -moz-column-gap: var(--spacing-small);
30
33
  column-gap: var(--spacing-small);
34
+ row-gap: var(--spacing-x-small);
35
+ }
36
+ @media screen and (min-width: 40em) {
37
+ .dnb-forms-field-array-selection .dnb-forms-field-block--layout-horizontal .dnb-form-label {
38
+ line-height: 2.5rem;
39
+ margin-bottom: 0;
40
+ }
31
41
  }
32
42
 
33
43
  .dnb-forms-field-expiry .dnb-multi-input-mask {
@@ -40,12 +50,6 @@
40
50
  /*
41
51
  * Utilities
42
52
  */
43
- :root {
44
- --forms-field-width--small: 5rem;
45
- --forms-field-width--medium: 11rem;
46
- --forms-field-width--large: 21rem;
47
- }
48
-
49
53
  .dnb-forms-field-number {
50
54
  --number-control-button-border-color: black;
51
55
  --number-control-button-border-color--hover: darkgrey;
@@ -335,12 +339,6 @@ fieldset.dnb-forms-field-block:not([class*=space__left]) {
335
339
  }
336
340
  .dnb-forms-field-block__label-description {
337
341
  margin-left: 0.3em;
338
- color: var(--color-black-55);
339
- font-size: var(--font-size-small);
340
- }
341
- .dnb-forms-field-block__label-secondary {
342
- color: var(--color-black-55);
343
- font-size: var(--font-size-small);
344
342
  }
345
343
  .dnb-forms-field-block__status {
346
344
  grid-area: status;
@@ -718,6 +716,15 @@ fieldset.dnb-forms-field-block:not([class*=space__left]) {
718
716
  --number-control-button--error: var(--color-fire-red);
719
717
  --number-control-button--error-contrast: var(--color-fire-red-8);
720
718
  }
719
+ .dnb-forms-field-number__contents--has-controls .dnb-button.dnb-button--size-small {
720
+ --button-height--small: 2rem;
721
+ --button-width--small: 2rem;
722
+ }
723
+
724
+ .dnb-forms-field-block__label-description {
725
+ color: var(--color-black-55);
726
+ font-size: var(--font-size-small);
727
+ }
721
728
 
722
729
  /*
723
730
  * PaymentCard theme
@@ -1,5 +1,5 @@
1
- .dnb-forms-field-array-selection--options-layout-vertical .dnb-forms-field-array-selection__options{display:flex;flex-flow:column;row-gap:var(--spacing-x-small)}.dnb-forms-field-array-selection--options-layout-horizontal .dnb-forms-field-array-selection__options{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row wrap}.dnb-forms-field-expiry .dnb-multi-input-mask{width:var(--forms-field-width--small)}.dnb-forms-field-expiry .dnb-multi-input-mask .dnb-input__shell{justify-content:center}.dnb-forms-field-number{--number-control-button-border-color:#000;--number-control-button-border-color--hover:#a9a9a9;--number-control-button-border-color--focus:#a9a9a9;--number-control-button-border-width--focus:0.125rem;--number-control-button-background-color--hover:grey;--number-control-button-color--hover:#000;--number-control-button-background-color--active:#000;--number-control-button-color--active:#d3d3d3;--number-control-button--error:red;--number-control-button--error-contrast:#fff;--number-control-button-width--small:2rem;--number-control-button-width--medium:2.5rem;--number-control-button-width--large:3rem;--forms-field-block--number-control-buttons-width--small:calc(var(--number-control-button-width--small)*2);--forms-field-block--number-control-buttons-width--medium:calc(var(--number-control-button-width--medium)*2);--forms-field-block--number-control-buttons-width--large:calc(var(--number-control-button-width--large)*2)}.dnb-forms-field-number__contents{align-items:center;display:flex}.dnb-forms-field-number__contents--has-controls{--border-color:var(--number-control-button-border-color);--border-width:0.0625rem;border-color:transparent;border-radius:.25rem;box-shadow:0 0 0 var(--border-width) var(--border-color)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls:hover:not([disabled]){--border-color:var(--number-control-button-border-color);--border-width:0.125rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}html[data-whatinput=keyboard] .dnb-forms-field-number__contents--has-controls:focus-within{--border-color:var(--number-control-button-border-color--focus);--border-width:var(--number-control-button-border-width--focus);border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-forms-field-number__contents--has-controls .dnb-input__shell{border-radius:0;box-shadow:none}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-input__shell:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-input__shell:hover:not([disabled]){box-shadow:none}.dnb-forms-field-number__contents--has-controls .dnb-input:not([data-input-state=disabled]):not(:active)[data-input-state=focus] .dnb-input__shell{box-shadow:none;outline:initial}html[data-whatinput=""] .dnb-forms-field-number__contents--has-controls .dnb-input:not([data-input-state=disabled]):not(:active)[data-input-state=focus] .dnb-input__shell{box-shadow:none}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:hover[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:hover:not([disabled]){background-color:var(--number-control-button-background-color--hover);color:var(--number-control-button-color--hover)}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active[disabled],.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active[disabled]{cursor:not-allowed}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active:not([disabled]),.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active:not([disabled]){background-color:var(--number-control-button-background-color--active);color:var(--number-control-button-color--active)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error{--border-color:var(--number-control-button--error);--border-width:0.125rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error:hover:not([disabled]){--border-color:var(--number-control-button--error);--border-width:0.125rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-input__status--error:not([data-input-state=disabled]):not(:hover):not(:active) .dnb-input__shell{box-shadow:none}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before{color:var(--number-control-button--error)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:hover[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:hover:not([disabled]){background-color:var(--number-control-button--error-contrast);color:var(--number-control-button--error)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:active[disabled],.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:active[disabled]{cursor:not-allowed}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:active:not([disabled]),.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:active:not([disabled]){background-color:var(--number-control-button--error);color:var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before[disabled]{color:var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled{--border-color:var(--color-black-55);--border-width:0.0625rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled:hover:not([disabled]){--border-color:var(--color-black-55);--border-width:0.0625rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-input[data-input-state=disabled] .dnb-input__shell{box-shadow:none}.dnb-input[data-input-state=disabled] .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled{--border-color:var(--color-black-55);--border-width:0.0625rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-button--control-before[disabled]{background-color:var(--color-black-3);color:var(--color-black-20)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small{width:calc(var(--forms-field-width--small) + var(--forms-field-block--number-control-buttons-width--small))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small .dnb-button--control-before{width:var(--number-control-button-width--small)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium{width:calc(var(--forms-field-width--medium) + var(--forms-field-block--number-control-buttons-width--medium))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium .dnb-button--control-before{width:var(--number-control-button-width--medium)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large{width:calc(var(--forms-field-width--large) + var(--forms-field-block--number-control-buttons-width--large))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large .dnb-button--control-before{width:var(--number-control-button-width--large)}.dnb-forms-field-phone-number__country-code,.dnb-forms-field-phone-number__country-code .dnb-autocomplete__shell{width:calc(var(--forms-field-width--medium) - 2rem)}.dnb-forms-field-phone-number__number{flex:1}.dnb-forms-field-phone-number .dnb-form-label{max-width:14ch}.dnb-forms-field-postal-code-and-city__fields{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row}.dnb-forms-field-postal-code-and-city__postal-code{flex:0 5rem}.dnb-forms-field-postal-code-and-city__city{flex:1}.dnb-forms-field-selection__variant--dropdown .dnb-forms-field-block--layout-horizontal .dnb-form-label{align-self:center}.dnb-forms-field-selection__options-layout--horizontal .dnb-forms-field-block--layout-horizontal .dnb-form-label,.dnb-forms-field-selection__variant--dropdown .dnb-forms-field-block--layout-horizontal .dnb-form-label{margin-bottom:0}.dnb-forms-field-selection__variant--button .dnb-forms-field-block--layout-horizontal .dnb-form-label{line-height:2.5rem}:root{--forms-field-width--small:5rem;--forms-field-width--medium:11rem;--forms-field-width--large:21rem}fieldset.dnb-forms-field-block{border:none;padding:0}fieldset.dnb-forms-field-block:not([class*=space__top]){margin-top:0}fieldset.dnb-forms-field-block:not([class*=space__right]){margin-right:0}fieldset.dnb-forms-field-block:not([class*=space__bottom]){margin-bottom:0}fieldset.dnb-forms-field-block:not([class*=space__left]){margin-left:0}.dnb-forms-field-block__grid{display:grid}@media screen and (max-width:40em){.dnb-forms-field-block__grid{flex-wrap:wrap}.dnb-forms-field-block__grid>.dnb-form-label{margin-bottom:.5rem;margin-top:.5rem}}.dnb-forms-field-block--layout-vertical{grid-template-areas:"label" "contents" "status";grid-template-columns:auto}.dnb-forms-field-block--layout-horizontal{grid-template-areas:"label contents" "status status";grid-template-columns:fit-content(100%) auto}.dnb-forms-field-block--width-stretch{flex-grow:1}@media screen and (min-width:30em){.dnb-forms-field-block--width-small{width:var(--forms-field-width--small)}.dnb-forms-field-block--width-medium{width:var(--forms-field-width--medium)}.dnb-forms-field-block--width-large{width:var(--forms-field-width--large)}}.dnb-forms-field-block__label{align-items:center;display:flex;flex-flow:row;grid-area:label;justify-content:space-between}.dnb-forms-field-block__label-description{margin-left:.3em}.dnb-forms-field-block__label-description,.dnb-forms-field-block__label-secondary{color:var(--color-black-55);font-size:var(--font-size-small)}.dnb-forms-field-block__status{grid-area:status}.dnb-forms-field-block__contents{grid-area:contents}.dnb-forms-field-block__contents--width-stretch{width:100%}@media screen and (min-width:30em){.dnb-forms-field-block__contents--width-small{width:var(--forms-field-width--small)}.dnb-forms-field-block__contents--width-medium{width:var(--forms-field-width--medium)}.dnb-forms-field-block__contents--width-large{width:var(--forms-field-width--large)}}.dnb-forms-button-row{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row}@media screen and (min-width:40em){.dnb-card+.dnb-forms-button-row:not([class*=space__left]){margin-left:var(--spacing-medium)}}.dnb-spacing .dnb-form-main-heading.dnb-h--large:not([class*=space__]){margin:0}@media screen and (min-width:40em){.dnb-form-main-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__left]){margin-left:var(--spacing-medium)}}.dnb-form-main-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__bottom]){margin-bottom:var(--spacing-small)}.dnb-spacing .dnb-form-sub-heading.dnb-h--medium:not([class*=space__]){margin:0}.dnb-form-sub-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__bottom]){margin-bottom:var(--spacing-small)}.dnb-forms-steps-layout{-moz-column-gap:var(--spacing-medium);column-gap:var(--spacing-medium);display:flex;flex-flow:row wrap}.dnb-forms-steps-layout__sidebar{flex:0}.dnb-forms-steps-layout__contents{flex:1 0 25rem}.dnb-forms-steps-layout__contents .dnb-card{--border-color:var(--color-pistachio)}@media screen and (max-width:60em){.dnb-forms-steps-layout{align-items:stretch;flex-direction:column;justify-content:stretch}.dnb-forms-steps-layout__contents{flex-basis:auto}}.dnb-forms-steps-layout .dnb-step-indicator__sidebar{margin-right:0}.dnb-forms-value-block{display:block;font-size:var(--font-size-basis)}.dnb-forms-value-block--inline{display:inline-block;font-size:inherit;margin-left:var(--spacing-xx-small);margin-right:var(--spacing-xx-small)}.dnb-forms-value-block__label{font-weight:var(--font-weight-medium)}.dnb-forms-value-block__placeholder{color:rgba(0,0,0,.5)}.dnb-forms-test-element{border:1px dashed grey;border-radius:.5rem;color:#909090;padding:.5rem 1rem}.dnb-payment-card{--color-dark-cyan:#003b47;--dnb-payment-bg-default:linear-gradient(187.2deg,#008484 6.31%,var(--color-sea-green) 82.66%);--dnb-payment-bg-pluss:linear-gradient(187.2deg,var(--color-dark-cyan) 6.31%,var(--color-ocean-green) 82.66%),var(--color-emerald-green);--dnb-payment-bg-white:linear-gradient(184.55deg,var(--color-black-background) 4.63%,var(--color-white) 92.04%);--dnb-payment-bg-gold:linear-gradient(184.55deg,#bfa970 4.63%,#d3bd83 84.57%);--dnb-payment-bg-saga:linear-gradient(187.2deg,#1c1c1c 6.31%,#000 82.66%);--dnb-payment-bg-private:linear-gradient(187.2deg,#1c1c1c 6.31%,#000 82.66%);--dnb-payment-bg-business-no-visa:linear-gradient(187.2deg,var(--color-dark-cyan) 6.31%,var(--color-ocean-green) 82.66%),var(--color-emerald-green);--dnb-payment-bg-business-with-visa:linear-gradient(187.2deg,var(--color-dark-cyan) 6.31%,var(--color-ocean-green) 82.66%),var(--color-emerald-green);margin:0}.dnb-payment-card__card{border-color:currentcolor;border-color:hsla(0,0%,100%,.1) transparent rgba(0,0,0,.2);border-radius:12px;border-style:solid;border-width:1px;box-shadow:var(--shadow-default);color:var(--color-white);height:216px;padding:16px;position:relative;transition:all 225ms cubic-bezier(0,0,.2,1) 0ms;width:343px}.dnb-payment-card__card--design-default{background:var(--dnb-payment-bg-default);color:var(--color-white)}.dnb-payment-card__card--design-pluss{background:var(--dnb-payment-bg-pluss);color:var(--color-white)}.dnb-payment-card__card--design-my-first,.dnb-payment-card__card--design-ung,.dnb-payment-card__card--design-youth{color:var(--color-black-80)}.dnb-payment-card__card--design-gold{background:var(--dnb-payment-bg-gold);color:var(--color-white)}.dnb-payment-card__card--design-saga{background:var(--dnb-payment-bg-saga);color:var(--color-white)}.dnb-payment-card__card--design-private{background:var(--dnb-payment-bg-private);color:var(--color-white)}.dnb-payment-card__card--design-black{background:var(--color-black);color:var(--color-white)}.dnb-payment-card__card--design-business-no-visa{background:var(--dnb-payment-bg-business-no-visa);color:var(--color-white)}.dnb-payment-card__card--design-business-with-visa{background:var(--dnb-payment-bg-business-with-visa);color:var(--color-white)}.dnb-payment-card__card:after{background:radial-gradient(52.39% 52.39% at 50% 50%,hsla(56,52%,94%,.122) 0,rgba(6,6,6,0) 100%);border-radius:inherit;content:"";height:100%;left:0;position:absolute;top:0;width:100%}.dnb-payment-card__card__content{display:flex;height:100%;position:relative;width:100%}.dnb-payment-card__card__wrapper{bottom:0;left:0;position:absolute}.dnb-spacing .dnb-payment-card__card .dnb-p{margin-bottom:0!important}.dnb-payment-card__card__holder{font-weight:var(--font-weight-medium);text-align:left;text-transform:uppercase}.dnb-payment-card__card__holder.dnb-p{font-size:.625rem}.dnb-payment-card__card__numbers{font-size:1.5rem!important;font-weight:var(--font-weight-medium)}.dnb-payment-card__card__credit-type{bottom:0;position:absolute;right:0}.dnb-payment-card__card__bank-logo{left:0;position:absolute;top:0}.dnb-payment-card__card__product-type{height:38px;left:70px;position:absolute;top:0}.dnb-payment-card__card__bank-axept{height:45px;position:absolute;right:0;top:0}.dnb-payment-card__blocking__overlay{align-items:center;background:linear-gradient(184.55deg,hsla(0,0%,80%,.5) 4.63%,hsla(0,0%,91%,.5) 84.83%);border-radius:inherit;bottom:0;display:flex;justify-content:center;left:0;position:absolute;right:0;top:0}.dnb-payment-card__blocking__overlay svg path{stroke:currentcolor}.dnb-payment-card__blocking__center{align-items:center;background:var(--color-black-80);border-radius:4px;color:var(--color-sand-yellow);display:flex;flex-direction:column;justify-content:center;padding:1rem}.dnb-payment-card__blocking svg{shape-rendering:geometricprecision}.dnb-payment-card.dnb-skeleton .dnb-payment-card__card__holder{opacity:1}.dnb-payment-card--compact .dnb-payment-card__card{border-radius:12px 12px 0 0;box-shadow:var(--shadow-default);height:32.8mm;padding:0}.dnb-payment-card--compact .dnb-payment-card__card__top{left:6mm;position:absolute;right:6mm;top:4mm}.dnb-payment-card--compact .dnb-payment-card__card__bottom{background-color:var(--color-white);bottom:0;height:14mm;left:0;position:absolute;right:0}.dnb-payment-card--compact .dnb-payment-card__card__wrapper{color:var(--color-black-80);padding:6px 22px}.dnb-payment-card--compact .dnb-payment-card__card__numbers{font-size:var(--font-size-basis)}.dnb-payment-card--compact .dnb-payment-card__card__credit-type{bottom:auto;right:4px;top:10px}.dnb-payment-card--compact .dnb-payment-card__blocking__center{align-items:center;background:rgba(0,0,0,.739);border-radius:inherit;display:flex;flex-direction:row;gap:var(--spacing-x-small);height:100%;justify-content:center;width:100%}.dnb-forms-field-number{--number-control-button-border-color:var(--color-sea-green);--number-control-button-border-color--hover:var(--color-emerald-green);--number-control-button-border-color--focus:var(--color-emerald-green);--number-control-button-background-color--hover:var(
1
+ .dnb-forms-field-array-selection--layout-vertical .dnb-forms-field-array-selection__options{display:flex;flex-flow:column;row-gap:var(--spacing-x-small)}.dnb-forms-field-array-selection--layout-horizontal .dnb-forms-field-array-selection__options{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row wrap;row-gap:var(--spacing-x-small)}@media screen and (min-width:40em){.dnb-forms-field-array-selection .dnb-forms-field-block--layout-horizontal .dnb-form-label{line-height:2.5rem;margin-bottom:0}}.dnb-forms-field-expiry .dnb-multi-input-mask{width:var(--forms-field-width--small)}.dnb-forms-field-expiry .dnb-multi-input-mask .dnb-input__shell{justify-content:center}.dnb-forms-field-number{--number-control-button-border-color:#000;--number-control-button-border-color--hover:#a9a9a9;--number-control-button-border-color--focus:#a9a9a9;--number-control-button-border-width--focus:0.125rem;--number-control-button-background-color--hover:grey;--number-control-button-color--hover:#000;--number-control-button-background-color--active:#000;--number-control-button-color--active:#d3d3d3;--number-control-button--error:red;--number-control-button--error-contrast:#fff;--number-control-button-width--small:2rem;--number-control-button-width--medium:2.5rem;--number-control-button-width--large:3rem;--forms-field-block--number-control-buttons-width--small:calc(var(--number-control-button-width--small)*2);--forms-field-block--number-control-buttons-width--medium:calc(var(--number-control-button-width--medium)*2);--forms-field-block--number-control-buttons-width--large:calc(var(--number-control-button-width--large)*2)}.dnb-forms-field-number__contents{align-items:center;display:flex}.dnb-forms-field-number__contents--has-controls{--border-color:var(--number-control-button-border-color);--border-width:0.0625rem;border-color:transparent;border-radius:.25rem;box-shadow:0 0 0 var(--border-width) var(--border-color)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls:hover:not([disabled]){--border-color:var(--number-control-button-border-color);--border-width:0.125rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}html[data-whatinput=keyboard] .dnb-forms-field-number__contents--has-controls:focus-within{--border-color:var(--number-control-button-border-color--focus);--border-width:var(--number-control-button-border-width--focus);border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-forms-field-number__contents--has-controls .dnb-input__shell{border-radius:0;box-shadow:none}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-input__shell:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-input__shell:hover:not([disabled]){box-shadow:none}.dnb-forms-field-number__contents--has-controls .dnb-input:not([data-input-state=disabled]):not(:active)[data-input-state=focus] .dnb-input__shell{box-shadow:none;outline:initial}html[data-whatinput=""] .dnb-forms-field-number__contents--has-controls .dnb-input:not([data-input-state=disabled]):not(:active)[data-input-state=focus] .dnb-input__shell{box-shadow:none}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:hover[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:hover:not([disabled]){background-color:var(--number-control-button-background-color--hover);color:var(--number-control-button-color--hover)}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active[disabled],.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active[disabled]{cursor:not-allowed}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active:not([disabled]),.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active:not([disabled]){background-color:var(--number-control-button-background-color--active);color:var(--number-control-button-color--active)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error{--border-color:var(--number-control-button--error);--border-width:0.125rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error:hover:not([disabled]){--border-color:var(--number-control-button--error);--border-width:0.125rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-input__status--error:not([data-input-state=disabled]):not(:hover):not(:active) .dnb-input__shell{box-shadow:none}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before{color:var(--number-control-button--error)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:hover[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:hover:not([disabled]){background-color:var(--number-control-button--error-contrast);color:var(--number-control-button--error)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:active[disabled],.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:active[disabled]{cursor:not-allowed}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:active:not([disabled]),.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:active:not([disabled]){background-color:var(--number-control-button--error);color:var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before[disabled]{color:var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled{--border-color:var(--color-black-55);--border-width:0.0625rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled:hover:not([disabled]){--border-color:var(--color-black-55);--border-width:0.0625rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-input[data-input-state=disabled] .dnb-input__shell{box-shadow:none}.dnb-input[data-input-state=disabled] .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled{--border-color:var(--color-black-55);--border-width:0.0625rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-button--control-before[disabled]{background-color:var(--color-black-3);color:var(--color-black-20)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small{width:calc(var(--forms-field-width--small) + var(--forms-field-block--number-control-buttons-width--small))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small .dnb-button--control-before{width:var(--number-control-button-width--small)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium{width:calc(var(--forms-field-width--medium) + var(--forms-field-block--number-control-buttons-width--medium))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium .dnb-button--control-before{width:var(--number-control-button-width--medium)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large{width:calc(var(--forms-field-width--large) + var(--forms-field-block--number-control-buttons-width--large))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large .dnb-button--control-before{width:var(--number-control-button-width--large)}.dnb-forms-field-phone-number__country-code,.dnb-forms-field-phone-number__country-code .dnb-autocomplete__shell{width:calc(var(--forms-field-width--medium) - 2rem)}.dnb-forms-field-phone-number__number{flex:1}.dnb-forms-field-phone-number .dnb-form-label{max-width:14ch}.dnb-forms-field-postal-code-and-city__fields{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row}.dnb-forms-field-postal-code-and-city__postal-code{flex:0 5rem}.dnb-forms-field-postal-code-and-city__city{flex:1}.dnb-forms-field-selection__variant--dropdown .dnb-forms-field-block--layout-horizontal .dnb-form-label{align-self:center}.dnb-forms-field-selection__options-layout--horizontal .dnb-forms-field-block--layout-horizontal .dnb-form-label,.dnb-forms-field-selection__variant--dropdown .dnb-forms-field-block--layout-horizontal .dnb-form-label{margin-bottom:0}.dnb-forms-field-selection__variant--button .dnb-forms-field-block--layout-horizontal .dnb-form-label{line-height:2.5rem}:root{--forms-field-width--small:5rem;--forms-field-width--medium:11rem;--forms-field-width--large:21rem}fieldset.dnb-forms-field-block{border:none;padding:0}fieldset.dnb-forms-field-block:not([class*=space__top]){margin-top:0}fieldset.dnb-forms-field-block:not([class*=space__right]){margin-right:0}fieldset.dnb-forms-field-block:not([class*=space__bottom]){margin-bottom:0}fieldset.dnb-forms-field-block:not([class*=space__left]){margin-left:0}.dnb-forms-field-block__grid{display:grid}@media screen and (max-width:40em){.dnb-forms-field-block__grid{flex-wrap:wrap}.dnb-forms-field-block__grid>.dnb-form-label{margin-bottom:.5rem;margin-top:.5rem}}.dnb-forms-field-block--layout-vertical{grid-template-areas:"label" "contents" "status";grid-template-columns:auto}.dnb-forms-field-block--layout-horizontal{grid-template-areas:"label contents" "status status";grid-template-columns:fit-content(100%) auto}.dnb-forms-field-block--width-stretch{flex-grow:1}@media screen and (min-width:30em){.dnb-forms-field-block--width-small{width:var(--forms-field-width--small)}.dnb-forms-field-block--width-medium{width:var(--forms-field-width--medium)}.dnb-forms-field-block--width-large{width:var(--forms-field-width--large)}}.dnb-forms-field-block__label{align-items:center;display:flex;flex-flow:row;grid-area:label;justify-content:space-between}.dnb-forms-field-block__label-description{margin-left:.3em}.dnb-forms-field-block__status{grid-area:status}.dnb-forms-field-block__contents{grid-area:contents}.dnb-forms-field-block__contents--width-stretch{width:100%}@media screen and (min-width:30em){.dnb-forms-field-block__contents--width-small{width:var(--forms-field-width--small)}.dnb-forms-field-block__contents--width-medium{width:var(--forms-field-width--medium)}.dnb-forms-field-block__contents--width-large{width:var(--forms-field-width--large)}}.dnb-forms-button-row{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row}@media screen and (min-width:40em){.dnb-card+.dnb-forms-button-row:not([class*=space__left]){margin-left:var(--spacing-medium)}}.dnb-spacing .dnb-form-main-heading.dnb-h--large:not([class*=space__]){margin:0}@media screen and (min-width:40em){.dnb-form-main-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__left]){margin-left:var(--spacing-medium)}}.dnb-form-main-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__bottom]){margin-bottom:var(--spacing-small)}.dnb-spacing .dnb-form-sub-heading.dnb-h--medium:not([class*=space__]){margin:0}.dnb-form-sub-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__bottom]){margin-bottom:var(--spacing-small)}.dnb-forms-steps-layout{-moz-column-gap:var(--spacing-medium);column-gap:var(--spacing-medium);display:flex;flex-flow:row wrap}.dnb-forms-steps-layout__sidebar{flex:0}.dnb-forms-steps-layout__contents{flex:1 0 25rem}.dnb-forms-steps-layout__contents .dnb-card{--border-color:var(--color-pistachio)}@media screen and (max-width:60em){.dnb-forms-steps-layout{align-items:stretch;flex-direction:column;justify-content:stretch}.dnb-forms-steps-layout__contents{flex-basis:auto}}.dnb-forms-steps-layout .dnb-step-indicator__sidebar{margin-right:0}.dnb-forms-value-block{display:block;font-size:var(--font-size-basis)}.dnb-forms-value-block--inline{display:inline-block;font-size:inherit;margin-left:var(--spacing-xx-small);margin-right:var(--spacing-xx-small)}.dnb-forms-value-block__label{font-weight:var(--font-weight-medium)}.dnb-forms-value-block__placeholder{color:rgba(0,0,0,.5)}.dnb-forms-test-element{border:1px dashed grey;border-radius:.5rem;color:#909090;padding:.5rem 1rem}.dnb-payment-card{--color-dark-cyan:#003b47;--dnb-payment-bg-default:linear-gradient(187.2deg,#008484 6.31%,var(--color-sea-green) 82.66%);--dnb-payment-bg-pluss:linear-gradient(187.2deg,var(--color-dark-cyan) 6.31%,var(--color-ocean-green) 82.66%),var(--color-emerald-green);--dnb-payment-bg-white:linear-gradient(184.55deg,var(--color-black-background) 4.63%,var(--color-white) 92.04%);--dnb-payment-bg-gold:linear-gradient(184.55deg,#bfa970 4.63%,#d3bd83 84.57%);--dnb-payment-bg-saga:linear-gradient(187.2deg,#1c1c1c 6.31%,#000 82.66%);--dnb-payment-bg-private:linear-gradient(187.2deg,#1c1c1c 6.31%,#000 82.66%);--dnb-payment-bg-business-no-visa:linear-gradient(187.2deg,var(--color-dark-cyan) 6.31%,var(--color-ocean-green) 82.66%),var(--color-emerald-green);--dnb-payment-bg-business-with-visa:linear-gradient(187.2deg,var(--color-dark-cyan) 6.31%,var(--color-ocean-green) 82.66%),var(--color-emerald-green);margin:0}.dnb-payment-card__card{border-color:currentcolor;border-color:hsla(0,0%,100%,.1) transparent rgba(0,0,0,.2);border-radius:12px;border-style:solid;border-width:1px;box-shadow:var(--shadow-default);color:var(--color-white);height:216px;padding:16px;position:relative;transition:all 225ms cubic-bezier(0,0,.2,1) 0ms;width:343px}.dnb-payment-card__card--design-default{background:var(--dnb-payment-bg-default);color:var(--color-white)}.dnb-payment-card__card--design-pluss{background:var(--dnb-payment-bg-pluss);color:var(--color-white)}.dnb-payment-card__card--design-my-first,.dnb-payment-card__card--design-ung,.dnb-payment-card__card--design-youth{color:var(--color-black-80)}.dnb-payment-card__card--design-gold{background:var(--dnb-payment-bg-gold);color:var(--color-white)}.dnb-payment-card__card--design-saga{background:var(--dnb-payment-bg-saga);color:var(--color-white)}.dnb-payment-card__card--design-private{background:var(--dnb-payment-bg-private);color:var(--color-white)}.dnb-payment-card__card--design-black{background:var(--color-black);color:var(--color-white)}.dnb-payment-card__card--design-business-no-visa{background:var(--dnb-payment-bg-business-no-visa);color:var(--color-white)}.dnb-payment-card__card--design-business-with-visa{background:var(--dnb-payment-bg-business-with-visa);color:var(--color-white)}.dnb-payment-card__card:after{background:radial-gradient(52.39% 52.39% at 50% 50%,hsla(56,52%,94%,.122) 0,rgba(6,6,6,0) 100%);border-radius:inherit;content:"";height:100%;left:0;position:absolute;top:0;width:100%}.dnb-payment-card__card__content{display:flex;height:100%;position:relative;width:100%}.dnb-payment-card__card__wrapper{bottom:0;left:0;position:absolute}.dnb-spacing .dnb-payment-card__card .dnb-p{margin-bottom:0!important}.dnb-payment-card__card__holder{font-weight:var(--font-weight-medium);text-align:left;text-transform:uppercase}.dnb-payment-card__card__holder.dnb-p{font-size:.625rem}.dnb-payment-card__card__numbers{font-size:1.5rem!important;font-weight:var(--font-weight-medium)}.dnb-payment-card__card__credit-type{bottom:0;position:absolute;right:0}.dnb-payment-card__card__bank-logo{left:0;position:absolute;top:0}.dnb-payment-card__card__product-type{height:38px;left:70px;position:absolute;top:0}.dnb-payment-card__card__bank-axept{height:45px;position:absolute;right:0;top:0}.dnb-payment-card__blocking__overlay{align-items:center;background:linear-gradient(184.55deg,hsla(0,0%,80%,.5) 4.63%,hsla(0,0%,91%,.5) 84.83%);border-radius:inherit;bottom:0;display:flex;justify-content:center;left:0;position:absolute;right:0;top:0}.dnb-payment-card__blocking__overlay svg path{stroke:currentcolor}.dnb-payment-card__blocking__center{align-items:center;background:var(--color-black-80);border-radius:4px;color:var(--color-sand-yellow);display:flex;flex-direction:column;justify-content:center;padding:1rem}.dnb-payment-card__blocking svg{shape-rendering:geometricprecision}.dnb-payment-card.dnb-skeleton .dnb-payment-card__card__holder{opacity:1}.dnb-payment-card--compact .dnb-payment-card__card{border-radius:12px 12px 0 0;box-shadow:var(--shadow-default);height:32.8mm;padding:0}.dnb-payment-card--compact .dnb-payment-card__card__top{left:6mm;position:absolute;right:6mm;top:4mm}.dnb-payment-card--compact .dnb-payment-card__card__bottom{background-color:var(--color-white);bottom:0;height:14mm;left:0;position:absolute;right:0}.dnb-payment-card--compact .dnb-payment-card__card__wrapper{color:var(--color-black-80);padding:6px 22px}.dnb-payment-card--compact .dnb-payment-card__card__numbers{font-size:var(--font-size-basis)}.dnb-payment-card--compact .dnb-payment-card__card__credit-type{bottom:auto;right:4px;top:10px}.dnb-payment-card--compact .dnb-payment-card__blocking__center{align-items:center;background:rgba(0,0,0,.739);border-radius:inherit;display:flex;flex-direction:row;gap:var(--spacing-x-small);height:100%;justify-content:center;width:100%}.dnb-forms-field-number{--number-control-button-border-color:var(--color-sea-green);--number-control-button-border-color--hover:var(--color-emerald-green);--number-control-button-border-color--focus:var(--color-emerald-green);--number-control-button-background-color--hover:var(
2
2
  --color-mint-green-12
3
3
  );--number-control-button-color--hover:var(--color-emerald-green);--number-control-button-background-color--active:var(
4
4
  --color-mint-green-50
5
- );--number-control-button-color--active:var(--color-sea-green);--number-control-button--error:var(--color-fire-red);--number-control-button--error-contrast:var(--color-fire-red-8)}
5
+ );--number-control-button-color--active:var(--color-sea-green);--number-control-button--error:var(--color-fire-red);--number-control-button--error-contrast:var(--color-fire-red-8)}.dnb-forms-field-number__contents--has-controls .dnb-button.dnb-button--size-small{--button-height--small:2rem;--button-width--small:2rem}.dnb-forms-field-block__label-description{color:var(--color-black-55);font-size:var(--font-size-small)}
@@ -15,4 +15,5 @@ $THEME_FALLBACK: 'ui';
15
15
  */
16
16
 
17
17
  @import '../../../extensions/forms/Field/Number/style/themes/dnb-number-theme-ui.scss';
18
+ @import '../../../extensions/forms/FieldBlock/style/themes/dnb-field-block-theme-ui.scss';
18
19
  @import '../../../extensions/payment-card/style/themes/dnb-payment-card-theme-ui.scss';
@@ -10,16 +10,26 @@
10
10
  /*
11
11
  * Utilities
12
12
  */
13
- .dnb-forms-field-array-selection--options-layout-vertical .dnb-forms-field-array-selection__options {
13
+ /*
14
+ * Utilities
15
+ */
16
+ .dnb-forms-field-array-selection--layout-vertical .dnb-forms-field-array-selection__options {
14
17
  display: flex;
15
18
  flex-flow: column;
16
19
  row-gap: var(--spacing-x-small);
17
20
  }
18
- .dnb-forms-field-array-selection--options-layout-horizontal .dnb-forms-field-array-selection__options {
21
+ .dnb-forms-field-array-selection--layout-horizontal .dnb-forms-field-array-selection__options {
19
22
  display: flex;
20
23
  flex-flow: row wrap;
21
24
  -moz-column-gap: var(--spacing-small);
22
25
  column-gap: var(--spacing-small);
26
+ row-gap: var(--spacing-x-small);
27
+ }
28
+ @media screen and (min-width: 40em) {
29
+ .dnb-forms-field-array-selection .dnb-forms-field-block--layout-horizontal .dnb-form-label {
30
+ line-height: 2.5rem;
31
+ margin-bottom: 0;
32
+ }
23
33
  }
24
34
 
25
35
  .dnb-forms-field-expiry .dnb-multi-input-mask {
@@ -32,12 +42,6 @@
32
42
  /*
33
43
  * Utilities
34
44
  */
35
- :root {
36
- --forms-field-width--small: 5rem;
37
- --forms-field-width--medium: 11rem;
38
- --forms-field-width--large: 21rem;
39
- }
40
-
41
45
  .dnb-forms-field-number {
42
46
  --number-control-button-border-color: black;
43
47
  --number-control-button-border-color--hover: darkgrey;
@@ -327,12 +331,6 @@ fieldset.dnb-forms-field-block:not([class*=space__left]) {
327
331
  }
328
332
  .dnb-forms-field-block__label-description {
329
333
  margin-left: 0.3em;
330
- color: var(--color-black-55);
331
- font-size: var(--font-size-small);
332
- }
333
- .dnb-forms-field-block__label-secondary {
334
- color: var(--color-black-55);
335
- font-size: var(--font-size-small);
336
334
  }
337
335
  .dnb-forms-field-block__status {
338
336
  grid-area: status;
@@ -469,4 +467,13 @@ fieldset.dnb-forms-field-block:not([class*=space__left]) {
469
467
  --number-control-button-color--active: var(--color-sea-green);
470
468
  --number-control-button--error: var(--color-fire-red);
471
469
  --number-control-button--error-contrast: var(--color-fire-red-8);
470
+ }
471
+ .dnb-forms-field-number__contents--has-controls .dnb-button.dnb-button--size-small {
472
+ --button-height--small: 2rem;
473
+ --button-width--small: 2rem;
474
+ }
475
+
476
+ .dnb-forms-field-block__label-description {
477
+ color: var(--color-black-55);
478
+ font-size: var(--font-size-small);
472
479
  }
@@ -1,5 +1,5 @@
1
- .dnb-forms-field-array-selection--options-layout-vertical .dnb-forms-field-array-selection__options{display:flex;flex-flow:column;row-gap:var(--spacing-x-small)}.dnb-forms-field-array-selection--options-layout-horizontal .dnb-forms-field-array-selection__options{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row wrap}.dnb-forms-field-expiry .dnb-multi-input-mask{width:var(--forms-field-width--small)}.dnb-forms-field-expiry .dnb-multi-input-mask .dnb-input__shell{justify-content:center}.dnb-forms-field-number{--number-control-button-border-color:#000;--number-control-button-border-color--hover:#a9a9a9;--number-control-button-border-color--focus:#a9a9a9;--number-control-button-border-width--focus:0.125rem;--number-control-button-background-color--hover:grey;--number-control-button-color--hover:#000;--number-control-button-background-color--active:#000;--number-control-button-color--active:#d3d3d3;--number-control-button--error:red;--number-control-button--error-contrast:#fff;--number-control-button-width--small:2rem;--number-control-button-width--medium:2.5rem;--number-control-button-width--large:3rem;--forms-field-block--number-control-buttons-width--small:calc(var(--number-control-button-width--small)*2);--forms-field-block--number-control-buttons-width--medium:calc(var(--number-control-button-width--medium)*2);--forms-field-block--number-control-buttons-width--large:calc(var(--number-control-button-width--large)*2)}.dnb-forms-field-number__contents{align-items:center;display:flex}.dnb-forms-field-number__contents--has-controls{--border-color:var(--number-control-button-border-color);--border-width:0.0625rem;border-color:transparent;border-radius:.25rem;box-shadow:0 0 0 var(--border-width) var(--border-color)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls:hover:not([disabled]){--border-color:var(--number-control-button-border-color);--border-width:0.125rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}html[data-whatinput=keyboard] .dnb-forms-field-number__contents--has-controls:focus-within{--border-color:var(--number-control-button-border-color--focus);--border-width:var(--number-control-button-border-width--focus);border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-forms-field-number__contents--has-controls .dnb-input__shell{border-radius:0;box-shadow:none}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-input__shell:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-input__shell:hover:not([disabled]){box-shadow:none}.dnb-forms-field-number__contents--has-controls .dnb-input:not([data-input-state=disabled]):not(:active)[data-input-state=focus] .dnb-input__shell{box-shadow:none;outline:initial}html[data-whatinput=""] .dnb-forms-field-number__contents--has-controls .dnb-input:not([data-input-state=disabled]):not(:active)[data-input-state=focus] .dnb-input__shell{box-shadow:none}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:hover[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:hover:not([disabled]){background-color:var(--number-control-button-background-color--hover);color:var(--number-control-button-color--hover)}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active[disabled],.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active[disabled]{cursor:not-allowed}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active:not([disabled]),.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active:not([disabled]){background-color:var(--number-control-button-background-color--active);color:var(--number-control-button-color--active)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error{--border-color:var(--number-control-button--error);--border-width:0.125rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error:hover:not([disabled]){--border-color:var(--number-control-button--error);--border-width:0.125rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-input__status--error:not([data-input-state=disabled]):not(:hover):not(:active) .dnb-input__shell{box-shadow:none}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before{color:var(--number-control-button--error)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:hover[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:hover:not([disabled]){background-color:var(--number-control-button--error-contrast);color:var(--number-control-button--error)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:active[disabled],.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:active[disabled]{cursor:not-allowed}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:active:not([disabled]),.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:active:not([disabled]){background-color:var(--number-control-button--error);color:var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before[disabled]{color:var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled{--border-color:var(--color-black-55);--border-width:0.0625rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled:hover:not([disabled]){--border-color:var(--color-black-55);--border-width:0.0625rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-input[data-input-state=disabled] .dnb-input__shell{box-shadow:none}.dnb-input[data-input-state=disabled] .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled{--border-color:var(--color-black-55);--border-width:0.0625rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-button--control-before[disabled]{background-color:var(--color-black-3);color:var(--color-black-20)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small{width:calc(var(--forms-field-width--small) + var(--forms-field-block--number-control-buttons-width--small))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small .dnb-button--control-before{width:var(--number-control-button-width--small)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium{width:calc(var(--forms-field-width--medium) + var(--forms-field-block--number-control-buttons-width--medium))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium .dnb-button--control-before{width:var(--number-control-button-width--medium)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large{width:calc(var(--forms-field-width--large) + var(--forms-field-block--number-control-buttons-width--large))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large .dnb-button--control-before{width:var(--number-control-button-width--large)}.dnb-forms-field-phone-number__country-code,.dnb-forms-field-phone-number__country-code .dnb-autocomplete__shell{width:calc(var(--forms-field-width--medium) - 2rem)}.dnb-forms-field-phone-number__number{flex:1}.dnb-forms-field-phone-number .dnb-form-label{max-width:14ch}.dnb-forms-field-postal-code-and-city__fields{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row}.dnb-forms-field-postal-code-and-city__postal-code{flex:0 5rem}.dnb-forms-field-postal-code-and-city__city{flex:1}.dnb-forms-field-selection__variant--dropdown .dnb-forms-field-block--layout-horizontal .dnb-form-label{align-self:center}.dnb-forms-field-selection__options-layout--horizontal .dnb-forms-field-block--layout-horizontal .dnb-form-label,.dnb-forms-field-selection__variant--dropdown .dnb-forms-field-block--layout-horizontal .dnb-form-label{margin-bottom:0}.dnb-forms-field-selection__variant--button .dnb-forms-field-block--layout-horizontal .dnb-form-label{line-height:2.5rem}:root{--forms-field-width--small:5rem;--forms-field-width--medium:11rem;--forms-field-width--large:21rem}fieldset.dnb-forms-field-block{border:none;padding:0}fieldset.dnb-forms-field-block:not([class*=space__top]){margin-top:0}fieldset.dnb-forms-field-block:not([class*=space__right]){margin-right:0}fieldset.dnb-forms-field-block:not([class*=space__bottom]){margin-bottom:0}fieldset.dnb-forms-field-block:not([class*=space__left]){margin-left:0}.dnb-forms-field-block__grid{display:grid}@media screen and (max-width:40em){.dnb-forms-field-block__grid{flex-wrap:wrap}.dnb-forms-field-block__grid>.dnb-form-label{margin-bottom:.5rem;margin-top:.5rem}}.dnb-forms-field-block--layout-vertical{grid-template-areas:"label" "contents" "status";grid-template-columns:auto}.dnb-forms-field-block--layout-horizontal{grid-template-areas:"label contents" "status status";grid-template-columns:fit-content(100%) auto}.dnb-forms-field-block--width-stretch{flex-grow:1}@media screen and (min-width:30em){.dnb-forms-field-block--width-small{width:var(--forms-field-width--small)}.dnb-forms-field-block--width-medium{width:var(--forms-field-width--medium)}.dnb-forms-field-block--width-large{width:var(--forms-field-width--large)}}.dnb-forms-field-block__label{align-items:center;display:flex;flex-flow:row;grid-area:label;justify-content:space-between}.dnb-forms-field-block__label-description{margin-left:.3em}.dnb-forms-field-block__label-description,.dnb-forms-field-block__label-secondary{color:var(--color-black-55);font-size:var(--font-size-small)}.dnb-forms-field-block__status{grid-area:status}.dnb-forms-field-block__contents{grid-area:contents}.dnb-forms-field-block__contents--width-stretch{width:100%}@media screen and (min-width:30em){.dnb-forms-field-block__contents--width-small{width:var(--forms-field-width--small)}.dnb-forms-field-block__contents--width-medium{width:var(--forms-field-width--medium)}.dnb-forms-field-block__contents--width-large{width:var(--forms-field-width--large)}}.dnb-forms-button-row{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row}@media screen and (min-width:40em){.dnb-card+.dnb-forms-button-row:not([class*=space__left]){margin-left:var(--spacing-medium)}}.dnb-spacing .dnb-form-main-heading.dnb-h--large:not([class*=space__]){margin:0}@media screen and (min-width:40em){.dnb-form-main-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__left]){margin-left:var(--spacing-medium)}}.dnb-form-main-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__bottom]){margin-bottom:var(--spacing-small)}.dnb-spacing .dnb-form-sub-heading.dnb-h--medium:not([class*=space__]){margin:0}.dnb-form-sub-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__bottom]){margin-bottom:var(--spacing-small)}.dnb-forms-steps-layout{-moz-column-gap:var(--spacing-medium);column-gap:var(--spacing-medium);display:flex;flex-flow:row wrap}.dnb-forms-steps-layout__sidebar{flex:0}.dnb-forms-steps-layout__contents{flex:1 0 25rem}.dnb-forms-steps-layout__contents .dnb-card{--border-color:var(--color-pistachio)}@media screen and (max-width:60em){.dnb-forms-steps-layout{align-items:stretch;flex-direction:column;justify-content:stretch}.dnb-forms-steps-layout__contents{flex-basis:auto}}.dnb-forms-steps-layout .dnb-step-indicator__sidebar{margin-right:0}.dnb-forms-value-block{display:block;font-size:var(--font-size-basis)}.dnb-forms-value-block--inline{display:inline-block;font-size:inherit;margin-left:var(--spacing-xx-small);margin-right:var(--spacing-xx-small)}.dnb-forms-value-block__label{font-weight:var(--font-weight-medium)}.dnb-forms-value-block__placeholder{color:rgba(0,0,0,.5)}.dnb-forms-test-element{border:1px dashed grey;border-radius:.5rem;color:#909090;padding:.5rem 1rem}.dnb-forms-field-number{--number-control-button-border-color:var(--color-sea-green);--number-control-button-border-color--hover:var(--color-emerald-green);--number-control-button-border-color--focus:var(--color-emerald-green);--number-control-button-background-color--hover:var(
1
+ .dnb-forms-field-array-selection--layout-vertical .dnb-forms-field-array-selection__options{display:flex;flex-flow:column;row-gap:var(--spacing-x-small)}.dnb-forms-field-array-selection--layout-horizontal .dnb-forms-field-array-selection__options{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row wrap;row-gap:var(--spacing-x-small)}@media screen and (min-width:40em){.dnb-forms-field-array-selection .dnb-forms-field-block--layout-horizontal .dnb-form-label{line-height:2.5rem;margin-bottom:0}}.dnb-forms-field-expiry .dnb-multi-input-mask{width:var(--forms-field-width--small)}.dnb-forms-field-expiry .dnb-multi-input-mask .dnb-input__shell{justify-content:center}.dnb-forms-field-number{--number-control-button-border-color:#000;--number-control-button-border-color--hover:#a9a9a9;--number-control-button-border-color--focus:#a9a9a9;--number-control-button-border-width--focus:0.125rem;--number-control-button-background-color--hover:grey;--number-control-button-color--hover:#000;--number-control-button-background-color--active:#000;--number-control-button-color--active:#d3d3d3;--number-control-button--error:red;--number-control-button--error-contrast:#fff;--number-control-button-width--small:2rem;--number-control-button-width--medium:2.5rem;--number-control-button-width--large:3rem;--forms-field-block--number-control-buttons-width--small:calc(var(--number-control-button-width--small)*2);--forms-field-block--number-control-buttons-width--medium:calc(var(--number-control-button-width--medium)*2);--forms-field-block--number-control-buttons-width--large:calc(var(--number-control-button-width--large)*2)}.dnb-forms-field-number__contents{align-items:center;display:flex}.dnb-forms-field-number__contents--has-controls{--border-color:var(--number-control-button-border-color);--border-width:0.0625rem;border-color:transparent;border-radius:.25rem;box-shadow:0 0 0 var(--border-width) var(--border-color)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls:hover:not([disabled]){--border-color:var(--number-control-button-border-color);--border-width:0.125rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}html[data-whatinput=keyboard] .dnb-forms-field-number__contents--has-controls:focus-within{--border-color:var(--number-control-button-border-color--focus);--border-width:var(--number-control-button-border-width--focus);border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-forms-field-number__contents--has-controls .dnb-input__shell{border-radius:0;box-shadow:none}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-input__shell:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-input__shell:hover:not([disabled]){box-shadow:none}.dnb-forms-field-number__contents--has-controls .dnb-input:not([data-input-state=disabled]):not(:active)[data-input-state=focus] .dnb-input__shell{box-shadow:none;outline:initial}html[data-whatinput=""] .dnb-forms-field-number__contents--has-controls .dnb-input:not([data-input-state=disabled]):not(:active)[data-input-state=focus] .dnb-input__shell{box-shadow:none}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:hover[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:hover:not([disabled]){background-color:var(--number-control-button-background-color--hover);color:var(--number-control-button-color--hover)}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active[disabled],.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active[disabled]{cursor:not-allowed}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active:not([disabled]),.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active:not([disabled]){background-color:var(--number-control-button-background-color--active);color:var(--number-control-button-color--active)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error{--border-color:var(--number-control-button--error);--border-width:0.125rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error:hover:not([disabled]){--border-color:var(--number-control-button--error);--border-width:0.125rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-input__status--error:not([data-input-state=disabled]):not(:hover):not(:active) .dnb-input__shell{box-shadow:none}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before{color:var(--number-control-button--error)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:hover[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:hover:not([disabled]){background-color:var(--number-control-button--error-contrast);color:var(--number-control-button--error)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:active[disabled],.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:active[disabled]{cursor:not-allowed}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:active:not([disabled]),.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:active:not([disabled]){background-color:var(--number-control-button--error);color:var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before[disabled]{color:var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled{--border-color:var(--color-black-55);--border-width:0.0625rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled:hover:not([disabled]){--border-color:var(--color-black-55);--border-width:0.0625rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-input[data-input-state=disabled] .dnb-input__shell{box-shadow:none}.dnb-input[data-input-state=disabled] .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled{--border-color:var(--color-black-55);--border-width:0.0625rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-button--control-before[disabled]{background-color:var(--color-black-3);color:var(--color-black-20)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small{width:calc(var(--forms-field-width--small) + var(--forms-field-block--number-control-buttons-width--small))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small .dnb-button--control-before{width:var(--number-control-button-width--small)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium{width:calc(var(--forms-field-width--medium) + var(--forms-field-block--number-control-buttons-width--medium))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium .dnb-button--control-before{width:var(--number-control-button-width--medium)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large{width:calc(var(--forms-field-width--large) + var(--forms-field-block--number-control-buttons-width--large))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large .dnb-button--control-before{width:var(--number-control-button-width--large)}.dnb-forms-field-phone-number__country-code,.dnb-forms-field-phone-number__country-code .dnb-autocomplete__shell{width:calc(var(--forms-field-width--medium) - 2rem)}.dnb-forms-field-phone-number__number{flex:1}.dnb-forms-field-phone-number .dnb-form-label{max-width:14ch}.dnb-forms-field-postal-code-and-city__fields{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row}.dnb-forms-field-postal-code-and-city__postal-code{flex:0 5rem}.dnb-forms-field-postal-code-and-city__city{flex:1}.dnb-forms-field-selection__variant--dropdown .dnb-forms-field-block--layout-horizontal .dnb-form-label{align-self:center}.dnb-forms-field-selection__options-layout--horizontal .dnb-forms-field-block--layout-horizontal .dnb-form-label,.dnb-forms-field-selection__variant--dropdown .dnb-forms-field-block--layout-horizontal .dnb-form-label{margin-bottom:0}.dnb-forms-field-selection__variant--button .dnb-forms-field-block--layout-horizontal .dnb-form-label{line-height:2.5rem}:root{--forms-field-width--small:5rem;--forms-field-width--medium:11rem;--forms-field-width--large:21rem}fieldset.dnb-forms-field-block{border:none;padding:0}fieldset.dnb-forms-field-block:not([class*=space__top]){margin-top:0}fieldset.dnb-forms-field-block:not([class*=space__right]){margin-right:0}fieldset.dnb-forms-field-block:not([class*=space__bottom]){margin-bottom:0}fieldset.dnb-forms-field-block:not([class*=space__left]){margin-left:0}.dnb-forms-field-block__grid{display:grid}@media screen and (max-width:40em){.dnb-forms-field-block__grid{flex-wrap:wrap}.dnb-forms-field-block__grid>.dnb-form-label{margin-bottom:.5rem;margin-top:.5rem}}.dnb-forms-field-block--layout-vertical{grid-template-areas:"label" "contents" "status";grid-template-columns:auto}.dnb-forms-field-block--layout-horizontal{grid-template-areas:"label contents" "status status";grid-template-columns:fit-content(100%) auto}.dnb-forms-field-block--width-stretch{flex-grow:1}@media screen and (min-width:30em){.dnb-forms-field-block--width-small{width:var(--forms-field-width--small)}.dnb-forms-field-block--width-medium{width:var(--forms-field-width--medium)}.dnb-forms-field-block--width-large{width:var(--forms-field-width--large)}}.dnb-forms-field-block__label{align-items:center;display:flex;flex-flow:row;grid-area:label;justify-content:space-between}.dnb-forms-field-block__label-description{margin-left:.3em}.dnb-forms-field-block__status{grid-area:status}.dnb-forms-field-block__contents{grid-area:contents}.dnb-forms-field-block__contents--width-stretch{width:100%}@media screen and (min-width:30em){.dnb-forms-field-block__contents--width-small{width:var(--forms-field-width--small)}.dnb-forms-field-block__contents--width-medium{width:var(--forms-field-width--medium)}.dnb-forms-field-block__contents--width-large{width:var(--forms-field-width--large)}}.dnb-forms-button-row{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row}@media screen and (min-width:40em){.dnb-card+.dnb-forms-button-row:not([class*=space__left]){margin-left:var(--spacing-medium)}}.dnb-spacing .dnb-form-main-heading.dnb-h--large:not([class*=space__]){margin:0}@media screen and (min-width:40em){.dnb-form-main-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__left]){margin-left:var(--spacing-medium)}}.dnb-form-main-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__bottom]){margin-bottom:var(--spacing-small)}.dnb-spacing .dnb-form-sub-heading.dnb-h--medium:not([class*=space__]){margin:0}.dnb-form-sub-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__bottom]){margin-bottom:var(--spacing-small)}.dnb-forms-steps-layout{-moz-column-gap:var(--spacing-medium);column-gap:var(--spacing-medium);display:flex;flex-flow:row wrap}.dnb-forms-steps-layout__sidebar{flex:0}.dnb-forms-steps-layout__contents{flex:1 0 25rem}.dnb-forms-steps-layout__contents .dnb-card{--border-color:var(--color-pistachio)}@media screen and (max-width:60em){.dnb-forms-steps-layout{align-items:stretch;flex-direction:column;justify-content:stretch}.dnb-forms-steps-layout__contents{flex-basis:auto}}.dnb-forms-steps-layout .dnb-step-indicator__sidebar{margin-right:0}.dnb-forms-value-block{display:block;font-size:var(--font-size-basis)}.dnb-forms-value-block--inline{display:inline-block;font-size:inherit;margin-left:var(--spacing-xx-small);margin-right:var(--spacing-xx-small)}.dnb-forms-value-block__label{font-weight:var(--font-weight-medium)}.dnb-forms-value-block__placeholder{color:rgba(0,0,0,.5)}.dnb-forms-test-element{border:1px dashed grey;border-radius:.5rem;color:#909090;padding:.5rem 1rem}.dnb-forms-field-number{--number-control-button-border-color:var(--color-sea-green);--number-control-button-border-color--hover:var(--color-emerald-green);--number-control-button-border-color--focus:var(--color-emerald-green);--number-control-button-background-color--hover:var(
2
2
  --color-mint-green-12
3
3
  );--number-control-button-color--hover:var(--color-emerald-green);--number-control-button-background-color--active:var(
4
4
  --color-mint-green-50
5
- );--number-control-button-color--active:var(--color-sea-green);--number-control-button--error:var(--color-fire-red);--number-control-button--error-contrast:var(--color-fire-red-8)}
5
+ );--number-control-button-color--active:var(--color-sea-green);--number-control-button--error:var(--color-fire-red);--number-control-button--error-contrast:var(--color-fire-red-8)}.dnb-forms-field-number__contents--has-controls .dnb-button.dnb-button--size-small{--button-height--small:2rem;--button-width--small:2rem}.dnb-forms-field-block__label-description{color:var(--color-black-55);font-size:var(--font-size-small)}
@@ -15,3 +15,4 @@ $THEME_FALLBACK: 'ui';
15
15
  */
16
16
 
17
17
  @import '../../../extensions/forms/Field/Number/style/themes/dnb-number-theme-ui.scss';
18
+ @import '../../../extensions/forms/FieldBlock/style/themes/dnb-field-block-theme-ui.scss';
@@ -451,6 +451,16 @@ html[data-whatinput=keyboard] .dnb-scroll-view[tabindex="0"]:focus {
451
451
  border-color: transparent;
452
452
  }
453
453
 
454
+ .dnb-text-counter .dnb-icon {
455
+ margin-right: 0;
456
+ font-size: 0;
457
+ transition: margin 200ms var(--easing-default), font-size 400ms var(--easing-default);
458
+ }
459
+ .dnb-text-counter--exceeded .dnb-icon {
460
+ margin-right: 0.5rem;
461
+ font-size: var(--font-size-basis--em);
462
+ }
463
+
454
464
  /**
455
465
  * ATTENTION: This file is auto generated by using "styleFactory".
456
466
  * Do not change the content!
@@ -459,16 +469,26 @@ html[data-whatinput=keyboard] .dnb-scroll-view[tabindex="0"]:focus {
459
469
  /*
460
470
  * Utilities
461
471
  */
462
- .dnb-forms-field-array-selection--options-layout-vertical .dnb-forms-field-array-selection__options {
472
+ /*
473
+ * Utilities
474
+ */
475
+ .dnb-forms-field-array-selection--layout-vertical .dnb-forms-field-array-selection__options {
463
476
  display: flex;
464
477
  flex-flow: column;
465
478
  row-gap: var(--spacing-x-small);
466
479
  }
467
- .dnb-forms-field-array-selection--options-layout-horizontal .dnb-forms-field-array-selection__options {
480
+ .dnb-forms-field-array-selection--layout-horizontal .dnb-forms-field-array-selection__options {
468
481
  display: flex;
469
482
  flex-flow: row wrap;
470
483
  -moz-column-gap: var(--spacing-small);
471
484
  column-gap: var(--spacing-small);
485
+ row-gap: var(--spacing-x-small);
486
+ }
487
+ @media screen and (min-width: 40em) {
488
+ .dnb-forms-field-array-selection .dnb-forms-field-block--layout-horizontal .dnb-form-label {
489
+ line-height: 2.5rem;
490
+ margin-bottom: 0;
491
+ }
472
492
  }
473
493
 
474
494
  .dnb-forms-field-expiry .dnb-multi-input-mask {
@@ -481,12 +501,6 @@ html[data-whatinput=keyboard] .dnb-scroll-view[tabindex="0"]:focus {
481
501
  /*
482
502
  * Utilities
483
503
  */
484
- :root {
485
- --forms-field-width--small: 5rem;
486
- --forms-field-width--medium: 11rem;
487
- --forms-field-width--large: 21rem;
488
- }
489
-
490
504
  .dnb-forms-field-number {
491
505
  --number-control-button-border-color: black;
492
506
  --number-control-button-border-color--hover: darkgrey;
@@ -776,12 +790,6 @@ fieldset.dnb-forms-field-block:not([class*=space__left]) {
776
790
  }
777
791
  .dnb-forms-field-block__label-description {
778
792
  margin-left: 0.3em;
779
- color: var(--color-black-55);
780
- font-size: var(--font-size-small);
781
- }
782
- .dnb-forms-field-block__label-secondary {
783
- color: var(--color-black-55);
784
- font-size: var(--font-size-small);
785
793
  }
786
794
  .dnb-forms-field-block__status {
787
795
  grid-area: status;
@@ -1818,18 +1826,28 @@ label + .dnb-autocomplete[class*=__form-status] .dnb-autocomplete__shell {
1818
1826
  .dnb-breadcrumb__item__span__icon {
1819
1827
  margin-right: 0.5rem;
1820
1828
  }
1821
- .dnb-breadcrumb__animation {
1829
+ .dnb-breadcrumb__multiple {
1822
1830
  display: flex;
1823
1831
  flex-direction: column;
1824
1832
  transition: height 400ms var(--easing-default);
1825
1833
  }
1826
- .dnb-breadcrumb__animation .dnb-breadcrumb__item {
1834
+ .dnb-breadcrumb__multiple .dnb-breadcrumb__item {
1827
1835
  transition: transform 400ms var(--easing-default) calc(var(--delay) * 50ms);
1828
1836
  transform: translateX(-1rem);
1829
1837
  }
1830
- .dnb-breadcrumb__animation.dnb-height-animation--parallax .dnb-breadcrumb__item {
1838
+ .dnb-breadcrumb__multiple.dnb-height-animation--parallax .dnb-breadcrumb__item {
1831
1839
  transform: translateX(0);
1832
1840
  }
1841
+ @media screen and (max-width: 60em) {
1842
+ .dnb-breadcrumb__bar .dnb-breadcrumb__multiple {
1843
+ display: none;
1844
+ }
1845
+ }
1846
+ @media screen and (min-width: 60em) {
1847
+ .dnb-breadcrumb--variant-multiple .dnb-breadcrumb__toggle {
1848
+ display: none;
1849
+ }
1850
+ }
1833
1851
  .dnb-breadcrumb__collapse {
1834
1852
  display: flex;
1835
1853
  flex-direction: column;
@@ -3824,13 +3842,13 @@ label + .dnb-dropdown[class*=__form-status] .dnb-dropdown__shell {
3824
3842
  .dnb-flex-container--wrap {
3825
3843
  flex-wrap: wrap;
3826
3844
  }
3827
- .dnb-flex-container--row-gap-small, .dnb-flex-container--has-size.dnb-flex-container--spacing-small, .dnb-flex-container--wrap.dnb-flex-container--direction-horizontal {
3845
+ .dnb-flex-container--row-gap-small {
3828
3846
  --gap: var(--spacing-small);
3829
3847
  }
3830
- .dnb-flex-container--row-gap-medium, .dnb-flex-container--has-size.dnb-flex-container--spacing-medium {
3848
+ .dnb-flex-container--row-gap-medium {
3831
3849
  --gap: var(--spacing-medium);
3832
3850
  }
3833
- .dnb-flex-container--row-gap-large, .dnb-flex-container--has-size.dnb-flex-container--spacing-large {
3851
+ .dnb-flex-container--row-gap-large {
3834
3852
  --gap: var(--spacing-large);
3835
3853
  }
3836
3854
  .dnb-flex-container__hr.dnb-hr {
@@ -5923,6 +5941,7 @@ html[data-whatinput=keyboard] .dnb-radio__input:not([disabled]):not(:checked):no
5923
5941
  --left: -100vw;
5924
5942
  --width: 100vw;
5925
5943
  --height: 100%;
5944
+ --color-transparent: transparent;
5926
5945
  color: var(--text-color, black);
5927
5946
  border-radius: var(--rounded-corner, 0);
5928
5947
  }
@@ -8597,7 +8616,7 @@ html:not([data-whatintent=touch]) .dnb-tag--removable.dnb-button:hover:not([disa
8597
8616
  .dnb-textarea__inner {
8598
8617
  display: inline-flex;
8599
8618
  flex-direction: column;
8600
- margin: var(--textarea-padding-width);
8619
+ margin: 0 var(--textarea-padding-width);
8601
8620
  }
8602
8621
  .dnb-textarea__shell {
8603
8622
  display: inline-flex;
@@ -8612,15 +8631,22 @@ html:not([data-whatintent=touch]) .dnb-tag--removable.dnb-button:hover:not([disa
8612
8631
  bottom: -0.5rem;
8613
8632
  right: -0.5rem;
8614
8633
  background-color: var(--color-white);
8615
- box-shadow: 0 0 0 0.0625rem var(--color-sea-green);
8634
+ --border-color: var(--textarea-border-color);
8635
+ --border-width: var(--textarea-border-width);
8636
+ box-shadow: inset 0 0 0 var(--border-width) var(--border-color);
8637
+ border-color: transparent;
8616
8638
  border-radius: 0.25rem;
8617
8639
  }
8618
8640
  .dnb-textarea__row {
8619
8641
  display: inline-flex;
8642
+ margin: var(--textarea-padding-width) 0;
8620
8643
  }
8621
8644
  .dnb-textarea__suffix.dnb-suffix {
8622
8645
  padding-left: 1rem;
8623
8646
  }
8647
+ .dnb-textarea .dnb-text-counter {
8648
+ margin-left: -0.5rem;
8649
+ }
8624
8650
  .dnb-textarea__textarea {
8625
8651
  position: relative;
8626
8652
  z-index: 2;
@@ -8711,7 +8737,7 @@ html:not([data-visual-test]) .dnb-textarea__textarea {
8711
8737
  }
8712
8738
  .dnb-textarea__inner > .dnb-form-status {
8713
8739
  order: 2;
8714
- margin: 1rem 0 0 calc(0px - var(--textarea-padding-width));
8740
+ margin: 0.5rem 0 0 calc(0px - var(--textarea-padding-width));
8715
8741
  }
8716
8742
  .dnb-textarea:not(.dnb-textarea--vertical) .dnb-form-label {
8717
8743
  margin-top: 0.5rem;
@@ -10998,7 +11024,6 @@ html:not([data-whatintent=touch]) .dnb-toggle-button__button:hover:not([disabled
10998
11024
  --border-width: 0.09375rem;
10999
11025
  box-shadow: inset 0 0 0 var(--border-width) var(--border-color);
11000
11026
  border-color: transparent;
11001
- background-color: var(--sb-color-gray-light);
11002
11027
  color: var(--sb-color-gray-dark);
11003
11028
  }
11004
11029
  html[data-whatinput=keyboard] .dnb-toggle-button__button:not([disabled]):not(:active):not(:hover):focus .dnb-radio__button {
@@ -11017,6 +11042,14 @@ html[data-whatinput=keyboard] .dnb-toggle-button__button:not([disabled]):not(:ac
11017
11042
  html[data-whatinput=keyboard] .dnb-toggle-button__button:not([disabled]):not(:active):not(:hover):focus .dnb-checkbox__gfx {
11018
11043
  color: var(--focus-ring-color);
11019
11044
  }
11045
+ .dnb-toggle-button--checked .dnb-toggle-button__button[disabled] {
11046
+ --border-color: var(--sb-color-gray-light);
11047
+ --border-width: 0.09375rem;
11048
+ box-shadow: inset 0 0 0 var(--border-width) var(--border-color);
11049
+ border-color: transparent;
11050
+ background-color: var(--sb-color-gray-light);
11051
+ color: var(--sb-color-gray-dark);
11052
+ }
11020
11053
  .dnb-toggle-button--checked .dnb-toggle-button__button:not([disabled]):not(:active) {
11021
11054
  background-color: var(--sb-color-violet);
11022
11055
  color: var(--sb-color-white);
@@ -11220,6 +11253,13 @@ html:not([data-whatintent=touch]) .dnb-drawer-list__option:hover:not([disabled])
11220
11253
  border-top-color: var(--sb-color-gray-dark-2);
11221
11254
  }
11222
11255
 
11256
+ .dnb-text-counter.dnb-p {
11257
+ color: var(--sb-color-gray-dark);
11258
+ }
11259
+ .dnb-text-counter--exceeded.dnb-p {
11260
+ color: var(--sb-color-red);
11261
+ }
11262
+
11223
11263
  /*
11224
11264
  * Autocomplete theme
11225
11265
  *
@@ -11675,16 +11715,26 @@ html[data-whatinput=keyboard] .dnb-step-indicator-wrapper .dnb-step-indicator__i
11675
11715
  /*
11676
11716
  * Utilities
11677
11717
  */
11678
- .dnb-forms-field-array-selection--options-layout-vertical .dnb-forms-field-array-selection__options {
11718
+ /*
11719
+ * Utilities
11720
+ */
11721
+ .dnb-forms-field-array-selection--layout-vertical .dnb-forms-field-array-selection__options {
11679
11722
  display: flex;
11680
11723
  flex-flow: column;
11681
11724
  row-gap: var(--spacing-x-small);
11682
11725
  }
11683
- .dnb-forms-field-array-selection--options-layout-horizontal .dnb-forms-field-array-selection__options {
11726
+ .dnb-forms-field-array-selection--layout-horizontal .dnb-forms-field-array-selection__options {
11684
11727
  display: flex;
11685
11728
  flex-flow: row wrap;
11686
11729
  -moz-column-gap: var(--spacing-small);
11687
11730
  column-gap: var(--spacing-small);
11731
+ row-gap: var(--spacing-x-small);
11732
+ }
11733
+ @media screen and (min-width: 40em) {
11734
+ .dnb-forms-field-array-selection .dnb-forms-field-block--layout-horizontal .dnb-form-label {
11735
+ line-height: 2.5rem;
11736
+ margin-bottom: 0;
11737
+ }
11688
11738
  }
11689
11739
 
11690
11740
  .dnb-forms-field-expiry .dnb-multi-input-mask {
@@ -11697,12 +11747,6 @@ html[data-whatinput=keyboard] .dnb-step-indicator-wrapper .dnb-step-indicator__i
11697
11747
  /*
11698
11748
  * Utilities
11699
11749
  */
11700
- :root {
11701
- --forms-field-width--small: 5rem;
11702
- --forms-field-width--medium: 11rem;
11703
- --forms-field-width--large: 21rem;
11704
- }
11705
-
11706
11750
  .dnb-forms-field-number {
11707
11751
  --number-control-button-border-color: black;
11708
11752
  --number-control-button-border-color--hover: darkgrey;
@@ -11992,12 +12036,6 @@ fieldset.dnb-forms-field-block:not([class*=space__left]) {
11992
12036
  }
11993
12037
  .dnb-forms-field-block__label-description {
11994
12038
  margin-left: 0.3em;
11995
- color: var(--color-black-55);
11996
- font-size: var(--font-size-small);
11997
- }
11998
- .dnb-forms-field-block__label-secondary {
11999
- color: var(--color-black-55);
12000
- font-size: var(--font-size-small);
12001
12039
  }
12002
12040
  .dnb-forms-field-block__status {
12003
12041
  grid-area: status;
@@ -12141,6 +12179,10 @@ fieldset.dnb-forms-field-block:not([class*=space__left]) {
12141
12179
  background-color: #1c1b4e;
12142
12180
  border-radius: 3rem;
12143
12181
  }
12182
+ .dnb-forms-field-number__contents--has-controls .dnb-button.dnb-button--size-small {
12183
+ --button-height--small: 2.5rem;
12184
+ --button-width--small: 2.5rem;
12185
+ }
12144
12186
  .dnb-forms-field-number__contents--has-controls .dnb-input {
12145
12187
  position: relative;
12146
12188
  }
@@ -12193,4 +12235,9 @@ html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-control
12193
12235
  .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-button--control-after[disabled] {
12194
12236
  color: var(--sb-color-gray-dark);
12195
12237
  background-color: var(--sb-color-gray-light);
12238
+ }
12239
+
12240
+ .dnb-forms-field-block__label-description {
12241
+ color: var(--color-black-55);
12242
+ font-size: var(--font-size-small);
12196
12243
  }