@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
package/style/themes/theme-sbanken/sbanken-theme-components.scss CHANGED
@@ -45,6 +45,7 @@ $fonts-path: '../../../../assets/fonts/dnb' !default;
45
45
  @import '../../../components/tooltip/style/themes/dnb-tooltip-theme-sbanken.scss';
46
46
  @import '../../../components/upload/style/themes/dnb-upload-theme-sbanken.scss';
47
47
  @import '../../../fragments/drawer-list/style/themes/dnb-drawer-list-theme-sbanken.scss';
48
+ @import '../../../fragments/text-counter/style/themes/dnb-text-counter-theme-sbanken.scss';
48
49
  @import '../../../components/autocomplete/style/themes/dnb-autocomplete-theme-ui.scss';
49
50
  @import '../../../components/badge/style/themes/dnb-badge-theme-ui.scss';
50
51
  @import '../../../components/card/style/themes/dnb-card-theme-ui.scss';
package/style/themes/theme-sbanken/sbanken-theme-extensions.css CHANGED
@@ -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;
@@ -724,6 +722,10 @@ fieldset.dnb-forms-field-block:not([class*=space__left]) {
724
722
  background-color: #1c1b4e;
725
723
  border-radius: 3rem;
726
724
  }
725
+ .dnb-forms-field-number__contents--has-controls .dnb-button.dnb-button--size-small {
726
+ --button-height--small: 2.5rem;
727
+ --button-width--small: 2.5rem;
728
+ }
727
729
  .dnb-forms-field-number__contents--has-controls .dnb-input {
728
730
  position: relative;
729
731
  }
@@ -778,6 +780,11 @@ html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-control
778
780
  background-color: var(--sb-color-gray-light);
779
781
  }
780
782
 
783
+ .dnb-forms-field-block__label-description {
784
+ color: var(--color-black-55);
785
+ font-size: var(--font-size-small);
786
+ }
787
+
781
788
  /*
782
789
  * PaymentCard theme
783
790
  *
package/style/themes/theme-sbanken/sbanken-theme-extensions.min.css CHANGED
@@ -1,3 +1,3 @@
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,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)}.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(--sb-color-purple-alternative);--number-control-button-border-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,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)}.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(--sb-color-purple-alternative);--number-control-button-border-color--hover:var(
2
2
  --sb-color-purple-alternative
3
- );--number-control-button-border-color--focus:var(--focus-ring-color);--number-control-button-border-width--focus:var(--focus-ring-width);--number-control-button-background-color--hover:#e0d0ff;--number-control-button-color--hover:var(--sb-color-purple-alternative);--number-control-button-background-color--active:#1c1b4e;--number-control-button-color--active:#e0d0ff;--number-control-button--error:var(--sb-color-red);--number-control-button--error-contrast:var(--sb-color-magenta-light-2)}.dnb-forms-field-number__contents--has-controls{background-color:#1c1b4e;border-radius:3rem}.dnb-forms-field-number__contents--has-controls .dnb-input{position:relative}.dnb-forms-field-number__contents--has-controls .dnb-input:after,.dnb-forms-field-number__contents--has-controls .dnb-input:before{border-left:.0625rem solid #e0d0ff;bottom:.25rem;content:"";position:absolute;top:.25rem;z-index:1}.dnb-forms-field-number__contents--has-controls .dnb-input:before{left:-1px}.dnb-forms-field-number__contents--has-controls .dnb-input:after{right:-1px}.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:not(:disabled):active~.dnb-input:before{z-index:-1}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:not(:disabled):active{z-index:1}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-input:after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-input:before{border-left:.0625rem solid var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled{--border-color:var(--sb-color-gray-dark);--border-width:0.0625rem;background-color:var(--sb-color-gray-light);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(--sb-color-gray-dark);--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__input{color:var(--sb-color-gray-dark)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-input:after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-input:before{border-left:.0625rem solid var(--sb-color-gray-dark)}.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(--sb-color-gray-light);color:var(--sb-color-gray-dark)}
3
+ );--number-control-button-border-color--focus:var(--focus-ring-color);--number-control-button-border-width--focus:var(--focus-ring-width);--number-control-button-background-color--hover:#e0d0ff;--number-control-button-color--hover:var(--sb-color-purple-alternative);--number-control-button-background-color--active:#1c1b4e;--number-control-button-color--active:#e0d0ff;--number-control-button--error:var(--sb-color-red);--number-control-button--error-contrast:var(--sb-color-magenta-light-2)}.dnb-forms-field-number__contents--has-controls{background-color:#1c1b4e;border-radius:3rem}.dnb-forms-field-number__contents--has-controls .dnb-button.dnb-button--size-small{--button-height--small:2.5rem;--button-width--small:2.5rem}.dnb-forms-field-number__contents--has-controls .dnb-input{position:relative}.dnb-forms-field-number__contents--has-controls .dnb-input:after,.dnb-forms-field-number__contents--has-controls .dnb-input:before{border-left:.0625rem solid #e0d0ff;bottom:.25rem;content:"";position:absolute;top:.25rem;z-index:1}.dnb-forms-field-number__contents--has-controls .dnb-input:before{left:-1px}.dnb-forms-field-number__contents--has-controls .dnb-input:after{right:-1px}.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:not(:disabled):active~.dnb-input:before{z-index:-1}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:not(:disabled):active{z-index:1}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-input:after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-input:before{border-left:.0625rem solid var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled{--border-color:var(--sb-color-gray-dark);--border-width:0.0625rem;background-color:var(--sb-color-gray-light);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(--sb-color-gray-dark);--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__input{color:var(--sb-color-gray-dark)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-input:after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-input:before{border-left:.0625rem solid var(--sb-color-gray-dark)}.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(--sb-color-gray-light);color:var(--sb-color-gray-dark)}.dnb-forms-field-block__label-description{color:var(--color-black-55);font-size:var(--font-size-small)}
package/style/themes/theme-sbanken/sbanken-theme-extensions.scss CHANGED
@@ -15,4 +15,5 @@ $THEME_FALLBACK: 'ui';
15
15
  */
16
16
 
17
17
  @import '../../../extensions/forms/Field/Number/style/themes/dnb-number-theme-sbanken.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';
package/style/themes/theme-sbanken/sbanken-theme-forms.css CHANGED
@@ -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;
@@ -476,6 +474,10 @@ fieldset.dnb-forms-field-block:not([class*=space__left]) {
476
474
  background-color: #1c1b4e;
477
475
  border-radius: 3rem;
478
476
  }
477
+ .dnb-forms-field-number__contents--has-controls .dnb-button.dnb-button--size-small {
478
+ --button-height--small: 2.5rem;
479
+ --button-width--small: 2.5rem;
480
+ }
479
481
  .dnb-forms-field-number__contents--has-controls .dnb-input {
480
482
  position: relative;
481
483
  }
@@ -528,4 +530,9 @@ html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-control
528
530
  .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-button--control-after[disabled] {
529
531
  color: var(--sb-color-gray-dark);
530
532
  background-color: var(--sb-color-gray-light);
533
+ }
534
+
535
+ .dnb-forms-field-block__label-description {
536
+ color: var(--color-black-55);
537
+ font-size: var(--font-size-small);
531
538
  }
package/style/themes/theme-sbanken/sbanken-theme-forms.min.css CHANGED
@@ -1,3 +1,3 @@
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,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)}.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(--sb-color-purple-alternative);--number-control-button-border-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,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)}.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(--sb-color-purple-alternative);--number-control-button-border-color--hover:var(
2
2
  --sb-color-purple-alternative
3
- );--number-control-button-border-color--focus:var(--focus-ring-color);--number-control-button-border-width--focus:var(--focus-ring-width);--number-control-button-background-color--hover:#e0d0ff;--number-control-button-color--hover:var(--sb-color-purple-alternative);--number-control-button-background-color--active:#1c1b4e;--number-control-button-color--active:#e0d0ff;--number-control-button--error:var(--sb-color-red);--number-control-button--error-contrast:var(--sb-color-magenta-light-2)}.dnb-forms-field-number__contents--has-controls{background-color:#1c1b4e;border-radius:3rem}.dnb-forms-field-number__contents--has-controls .dnb-input{position:relative}.dnb-forms-field-number__contents--has-controls .dnb-input:after,.dnb-forms-field-number__contents--has-controls .dnb-input:before{border-left:.0625rem solid #e0d0ff;bottom:.25rem;content:"";position:absolute;top:.25rem;z-index:1}.dnb-forms-field-number__contents--has-controls .dnb-input:before{left:-1px}.dnb-forms-field-number__contents--has-controls .dnb-input:after{right:-1px}.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:not(:disabled):active~.dnb-input:before{z-index:-1}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:not(:disabled):active{z-index:1}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-input:after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-input:before{border-left:.0625rem solid var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled{--border-color:var(--sb-color-gray-dark);--border-width:0.0625rem;background-color:var(--sb-color-gray-light);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(--sb-color-gray-dark);--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__input{color:var(--sb-color-gray-dark)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-input:after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-input:before{border-left:.0625rem solid var(--sb-color-gray-dark)}.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(--sb-color-gray-light);color:var(--sb-color-gray-dark)}
3
+ );--number-control-button-border-color--focus:var(--focus-ring-color);--number-control-button-border-width--focus:var(--focus-ring-width);--number-control-button-background-color--hover:#e0d0ff;--number-control-button-color--hover:var(--sb-color-purple-alternative);--number-control-button-background-color--active:#1c1b4e;--number-control-button-color--active:#e0d0ff;--number-control-button--error:var(--sb-color-red);--number-control-button--error-contrast:var(--sb-color-magenta-light-2)}.dnb-forms-field-number__contents--has-controls{background-color:#1c1b4e;border-radius:3rem}.dnb-forms-field-number__contents--has-controls .dnb-button.dnb-button--size-small{--button-height--small:2.5rem;--button-width--small:2.5rem}.dnb-forms-field-number__contents--has-controls .dnb-input{position:relative}.dnb-forms-field-number__contents--has-controls .dnb-input:after,.dnb-forms-field-number__contents--has-controls .dnb-input:before{border-left:.0625rem solid #e0d0ff;bottom:.25rem;content:"";position:absolute;top:.25rem;z-index:1}.dnb-forms-field-number__contents--has-controls .dnb-input:before{left:-1px}.dnb-forms-field-number__contents--has-controls .dnb-input:after{right:-1px}.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:not(:disabled):active~.dnb-input:before{z-index:-1}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:not(:disabled):active{z-index:1}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-input:after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-input:before{border-left:.0625rem solid var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled{--border-color:var(--sb-color-gray-dark);--border-width:0.0625rem;background-color:var(--sb-color-gray-light);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(--sb-color-gray-dark);--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__input{color:var(--sb-color-gray-dark)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-input:after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-input:before{border-left:.0625rem solid var(--sb-color-gray-dark)}.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(--sb-color-gray-light);color:var(--sb-color-gray-dark)}.dnb-forms-field-block__label-description{color:var(--color-black-55);font-size:var(--font-size-small)}
package/style/themes/theme-sbanken/sbanken-theme-forms.scss CHANGED
@@ -15,3 +15,4 @@ $THEME_FALLBACK: 'ui';
15
15
  */
16
16
 
17
17
  @import '../../../extensions/forms/Field/Number/style/themes/dnb-number-theme-sbanken.scss';
18
+ @import '../../../extensions/forms/FieldBlock/style/themes/dnb-field-block-theme-ui.scss';