npm - @dnb/eufemia - Versions diffs - 10.49.0 → 10.51.0 - Mend

@dnb/eufemia 10.49.0 → 10.51.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 (1240) hide show

package/cjs/components/space/style/dnb-space.min.css CHANGED Viewed

	@@ -1 +1 @@
1	- .dnb-core-style .dnb-space__top--zero{margin-top:0}.dnb-core-style .dnb-space__top--xx-small{margin-top:var(--spacing-xx-small)}.dnb-core-style .dnb-space__top--x-small{margin-top:var(--spacing-x-small)}.dnb-core-style .dnb-space__top--small{margin-top:var(--spacing-small)}.dnb-core-style .dnb-space__top--medium{margin-top:var(--spacing-medium)}.dnb-core-style .dnb-space__top--large{margin-top:var(--spacing-large)}.dnb-core-style .dnb-space__top--large.dnb-core-style .dnb-space__top--x-small{margin-top:calc(var(--spacing-large) + var(--spacing-x-small))}.dnb-core-style .dnb-space__top--x-large{margin-top:var(--spacing-x-large)}.dnb-core-style .dnb-space__top--xx-large{margin-top:var(--spacing-xx-large)}.dnb-core-style .dnb-space__top--xx-large.dnb-core-style .dnb-space__top--x-small{margin-top:calc(var(--spacing-large) + var(--spacing-large))}.dnb-core-style .dnb-space__top--xx-large.dnb-core-style .dnb-space__top--small{margin-top:calc(var(--spacing-x-large) + var(--spacing-medium))}.dnb-core-style .dnb-space__top--xx-large.dnb-core-style .dnb-space__top--medium{margin-top:calc(var(--spacing-x-large) + var(--spacing-large))}.dnb-core-style .dnb-space__top--xx-large.dnb-core-style .dnb-space__top--large{margin-top:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-x-small))}.dnb-core-style .dnb-space__top--xx-large.dnb-core-style .dnb-space__top--large.dnb-core-style .dnb-space__top--x-small{margin-top:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-small))}.dnb-core-style .dnb-space__top--xx-large.dnb-core-style .dnb-space__top--x-large{margin-top:calc(var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__top--xx-large-x2{margin-top:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-large))}.dnb-core-style .dnb-space__top--xx-large-x2.dnb-core-style .dnb-space__top--x-small{margin-top:calc(var(--spacing-xx-large) + var(--spacing-large) + var(--spacing-large))}.dnb-core-style .dnb-space__top--xx-large-x2.dnb-core-style .dnb-space__top--small{margin-top:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-core-style .dnb-space__top--xx-large-x2.dnb-core-style .dnb-space__top--medium{margin-top:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-core-style .dnb-space__top--xx-large-x2.dnb-core-style .dnb-space__top--large{margin-top:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__top--xx-large-x2.dnb-core-style .dnb-space__top--large.dnb-core-style .dnb-space__top--x-small{margin-top:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__top--xx-large-x2.dnb-core-style .dnb-space__top--x-large{margin-top:calc(var(--spacing-xx-large) + var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__right--zero{margin-right:0}.dnb-core-style .dnb-space__right--xx-small{margin-right:var(--spacing-xx-small)}.dnb-core-style .dnb-space__right--x-small{margin-right:var(--spacing-x-small)}.dnb-core-style .dnb-space__right--small{margin-right:var(--spacing-small)}.dnb-core-style .dnb-space__right--medium{margin-right:var(--spacing-medium)}.dnb-core-style .dnb-space__right--large{margin-right:var(--spacing-large)}.dnb-core-style .dnb-space__right--large.dnb-core-style .dnb-space__right--x-small{margin-right:calc(var(--spacing-large) + var(--spacing-x-small))}.dnb-core-style .dnb-space__right--x-large{margin-right:var(--spacing-x-large)}.dnb-core-style .dnb-space__right--xx-large{margin-right:var(--spacing-xx-large)}.dnb-core-style .dnb-space__right--xx-large.dnb-core-style .dnb-space__right--x-small{margin-right:calc(var(--spacing-large) + var(--spacing-large))}.dnb-core-style .dnb-space__right--xx-large.dnb-core-style .dnb-space__right--small{margin-right:calc(var(--spacing-x-large) + var(--spacing-medium))}.dnb-core-style .dnb-space__right--xx-large.dnb-core-style .dnb-space__right--medium{margin-right:calc(var(--spacing-x-large) + var(--spacing-large))}.dnb-core-style .dnb-space__right--xx-large.dnb-core-style .dnb-space__right--large{margin-right:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-x-small))}.dnb-core-style .dnb-space__right--xx-large.dnb-core-style .dnb-space__right--large.dnb-core-style .dnb-space__right--x-small{margin-right:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-small))}.dnb-core-style .dnb-space__right--xx-large.dnb-core-style .dnb-space__right--x-large{margin-right:calc(var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__right--xx-large-x2{margin-right:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-large))}.dnb-core-style .dnb-space__right--xx-large-x2.dnb-core-style .dnb-space__right--x-small{margin-right:calc(var(--spacing-xx-large) + var(--spacing-large) + var(--spacing-large))}.dnb-core-style .dnb-space__right--xx-large-x2.dnb-core-style .dnb-space__right--small{margin-right:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-core-style .dnb-space__right--xx-large-x2.dnb-core-style .dnb-space__right--medium{margin-right:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-core-style .dnb-space__right--xx-large-x2.dnb-core-style .dnb-space__right--large{margin-right:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__right--xx-large-x2.dnb-core-style .dnb-space__right--large.dnb-core-style .dnb-space__right--x-small{margin-right:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__right--xx-large-x2.dnb-core-style .dnb-space__right--x-large{margin-right:calc(var(--spacing-xx-large) + var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__bottom--zero{margin-bottom:0}.dnb-core-style .dnb-space__bottom--xx-small{margin-bottom:var(--spacing-xx-small)}.dnb-core-style .dnb-space__bottom--x-small{margin-bottom:var(--spacing-x-small)}.dnb-core-style .dnb-space__bottom--small{margin-bottom:var(--spacing-small)}.dnb-core-style .dnb-space__bottom--medium{margin-bottom:var(--spacing-medium)}.dnb-core-style .dnb-space__bottom--large{margin-bottom:var(--spacing-large)}.dnb-core-style .dnb-space__bottom--large.dnb-core-style .dnb-space__bottom--x-small{margin-bottom:calc(var(--spacing-large) + var(--spacing-x-small))}.dnb-core-style .dnb-space__bottom--x-large{margin-bottom:var(--spacing-x-large)}.dnb-core-style .dnb-space__bottom--xx-large{margin-bottom:var(--spacing-xx-large)}.dnb-core-style .dnb-space__bottom--xx-large.dnb-core-style .dnb-space__bottom--x-small{margin-bottom:calc(var(--spacing-large) + var(--spacing-large))}.dnb-core-style .dnb-space__bottom--xx-large.dnb-core-style .dnb-space__bottom--small{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-medium))}.dnb-core-style .dnb-space__bottom--xx-large.dnb-core-style .dnb-space__bottom--medium{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-large))}.dnb-core-style .dnb-space__bottom--xx-large.dnb-core-style .dnb-space__bottom--large{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-x-small))}.dnb-core-style .dnb-space__bottom--xx-large.dnb-core-style .dnb-space__bottom--large.dnb-core-style .dnb-space__bottom--x-small{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-small))}.dnb-core-style .dnb-space__bottom--xx-large.dnb-core-style .dnb-space__bottom--x-large{margin-bottom:calc(var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__bottom--xx-large-x2{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-large))}.dnb-core-style .dnb-space__bottom--xx-large-x2.dnb-core-style .dnb-space__bottom--x-small{margin-bottom:calc(var(--spacing-xx-large) + var(--spacing-large) + var(--spacing-large))}.dnb-core-style .dnb-space__bottom--xx-large-x2.dnb-core-style .dnb-space__bottom--small{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-core-style .dnb-space__bottom--xx-large-x2.dnb-core-style .dnb-space__bottom--medium{margin-bottom:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-core-style .dnb-space__bottom--xx-large-x2.dnb-core-style .dnb-space__bottom--large{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__bottom--xx-large-x2.dnb-core-style .dnb-space__bottom--large.dnb-core-style .dnb-space__bottom--x-small{margin-bottom:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__bottom--xx-large-x2.dnb-core-style .dnb-space__bottom--x-large{margin-bottom:calc(var(--spacing-xx-large) + var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__left--zero{margin-left:0}.dnb-core-style .dnb-space__left--xx-small{margin-left:var(--spacing-xx-small)}.dnb-core-style .dnb-space__left--x-small{margin-left:var(--spacing-x-small)}.dnb-core-style .dnb-space__left--small{margin-left:var(--spacing-small)}.dnb-core-style .dnb-space__left--medium{margin-left:var(--spacing-medium)}.dnb-core-style .dnb-space__left--large{margin-left:var(--spacing-large)}.dnb-core-style .dnb-space__left--large.dnb-core-style .dnb-space__left--x-small{margin-left:calc(var(--spacing-large) + var(--spacing-x-small))}.dnb-core-style .dnb-space__left--x-large{margin-left:var(--spacing-x-large)}.dnb-core-style .dnb-space__left--xx-large{margin-left:var(--spacing-xx-large)}.dnb-core-style .dnb-space__left--xx-large.dnb-core-style .dnb-space__left--x-small{margin-left:calc(var(--spacing-large) + var(--spacing-large))}.dnb-core-style .dnb-space__left--xx-large.dnb-core-style .dnb-space__left--small{margin-left:calc(var(--spacing-x-large) + var(--spacing-medium))}.dnb-core-style .dnb-space__left--xx-large.dnb-core-style .dnb-space__left--medium{margin-left:calc(var(--spacing-x-large) + var(--spacing-large))}.dnb-core-style .dnb-space__left--xx-large.dnb-core-style .dnb-space__left--large{margin-left:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-x-small))}.dnb-core-style .dnb-space__left--xx-large.dnb-core-style .dnb-space__left--large.dnb-core-style .dnb-space__left--x-small{margin-left:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-small))}.dnb-core-style .dnb-space__left--xx-large.dnb-core-style .dnb-space__left--x-large{margin-left:calc(var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__left--xx-large-x2{margin-left:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-large))}.dnb-core-style .dnb-space__left--xx-large-x2.dnb-core-style .dnb-space__left--x-small{margin-left:calc(var(--spacing-xx-large) + var(--spacing-large) + var(--spacing-large))}.dnb-core-style .dnb-space__left--xx-large-x2.dnb-core-style .dnb-space__left--small{margin-left:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-core-style .dnb-space__left--xx-large-x2.dnb-core-style .dnb-space__left--medium{margin-left:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-core-style .dnb-space__left--xx-large-x2.dnb-core-style .dnb-space__left--large{margin-left:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__left--xx-large-x2.dnb-core-style .dnb-space__left--large.dnb-core-style .dnb-space__left--x-small{margin-left:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__left--xx-large-x2.dnb-core-style .dnb-space__left--x-large{margin-left:calc(var(--spacing-xx-large) + var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-space--no-collapse{display:flow-root}.dnb-space--stretch{width:100%}.dnb-space--inline{display:inline-block}.dnb-space__top--zero{margin-top:0}.dnb-space__top--xx-small{margin-top:var(--spacing-xx-small)}.dnb-space__top--x-small{margin-top:var(--spacing-x-small)}.dnb-space__top--small{margin-top:var(--spacing-small)}.dnb-space__top--medium{margin-top:var(--spacing-medium)}.dnb-space__top--large{margin-top:var(--spacing-large)}.dnb-space__top--large.dnb-space__top--x-small{margin-top:calc(var(--spacing-large) + var(--spacing-x-small))}.dnb-space__top--x-large{margin-top:var(--spacing-x-large)}.dnb-space__top--xx-large{margin-top:var(--spacing-xx-large)}.dnb-space__top--xx-large.dnb-space__top--x-small{margin-top:calc(var(--spacing-large) + var(--spacing-large))}.dnb-space__top--xx-large.dnb-space__top--small{margin-top:calc(var(--spacing-x-large) + var(--spacing-medium))}.dnb-space__top--xx-large.dnb-space__top--medium{margin-top:calc(var(--spacing-x-large) + var(--spacing-large))}.dnb-space__top--xx-large.dnb-space__top--large{margin-top:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-x-small))}.dnb-space__top--xx-large.dnb-space__top--large.dnb-space__top--x-small{margin-top:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-small))}.dnb-space__top--xx-large.dnb-space__top--x-large{margin-top:calc(var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-space__top--xx-large-x2{margin-top:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-large))}.dnb-space__top--xx-large-x2.dnb-space__top--x-small{margin-top:calc(var(--spacing-xx-large) + var(--spacing-large) + var(--spacing-large))}.dnb-space__top--xx-large-x2.dnb-space__top--small{margin-top:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-space__top--xx-large-x2.dnb-space__top--medium{margin-top:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-space__top--xx-large-x2.dnb-space__top--large{margin-top:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-space__top--xx-large-x2.dnb-space__top--large.dnb-space__top--x-small{margin-top:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-space__top--xx-large-x2.dnb-space__top--x-large{margin-top:calc(var(--spacing-xx-large) + var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-space__right--zero{margin-right:0}.dnb-space__right--xx-small{margin-right:var(--spacing-xx-small)}.dnb-space__right--x-small{margin-right:var(--spacing-x-small)}.dnb-space__right--small{margin-right:var(--spacing-small)}.dnb-space__right--medium{margin-right:var(--spacing-medium)}.dnb-space__right--large{margin-right:var(--spacing-large)}.dnb-space__right--large.dnb-space__right--x-small{margin-right:calc(var(--spacing-large) + var(--spacing-x-small))}.dnb-space__right--x-large{margin-right:var(--spacing-x-large)}.dnb-space__right--xx-large{margin-right:var(--spacing-xx-large)}.dnb-space__right--xx-large.dnb-space__right--x-small{margin-right:calc(var(--spacing-large) + var(--spacing-large))}.dnb-space__right--xx-large.dnb-space__right--small{margin-right:calc(var(--spacing-x-large) + var(--spacing-medium))}.dnb-space__right--xx-large.dnb-space__right--medium{margin-right:calc(var(--spacing-x-large) + var(--spacing-large))}.dnb-space__right--xx-large.dnb-space__right--large{margin-right:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-x-small))}.dnb-space__right--xx-large.dnb-space__right--large.dnb-space__right--x-small{margin-right:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-small))}.dnb-space__right--xx-large.dnb-space__right--x-large{margin-right:calc(var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-space__right--xx-large-x2{margin-right:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-large))}.dnb-space__right--xx-large-x2.dnb-space__right--x-small{margin-right:calc(var(--spacing-xx-large) + var(--spacing-large) + var(--spacing-large))}.dnb-space__right--xx-large-x2.dnb-space__right--small{margin-right:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-space__right--xx-large-x2.dnb-space__right--medium{margin-right:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-space__right--xx-large-x2.dnb-space__right--large{margin-right:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-space__right--xx-large-x2.dnb-space__right--large.dnb-space__right--x-small{margin-right:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-space__right--xx-large-x2.dnb-space__right--x-large{margin-right:calc(var(--spacing-xx-large) + var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-space__bottom--zero{margin-bottom:0}.dnb-space__bottom--xx-small{margin-bottom:var(--spacing-xx-small)}.dnb-space__bottom--x-small{margin-bottom:var(--spacing-x-small)}.dnb-space__bottom--small{margin-bottom:var(--spacing-small)}.dnb-space__bottom--medium{margin-bottom:var(--spacing-medium)}.dnb-space__bottom--large{margin-bottom:var(--spacing-large)}.dnb-space__bottom--large.dnb-space__bottom--x-small{margin-bottom:calc(var(--spacing-large) + var(--spacing-x-small))}.dnb-space__bottom--x-large{margin-bottom:var(--spacing-x-large)}.dnb-space__bottom--xx-large{margin-bottom:var(--spacing-xx-large)}.dnb-space__bottom--xx-large.dnb-space__bottom--x-small{margin-bottom:calc(var(--spacing-large) + var(--spacing-large))}.dnb-space__bottom--xx-large.dnb-space__bottom--small{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-medium))}.dnb-space__bottom--xx-large.dnb-space__bottom--medium{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-large))}.dnb-space__bottom--xx-large.dnb-space__bottom--large{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-x-small))}.dnb-space__bottom--xx-large.dnb-space__bottom--large.dnb-space__bottom--x-small{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-small))}.dnb-space__bottom--xx-large.dnb-space__bottom--x-large{margin-bottom:calc(var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-space__bottom--xx-large-x2{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-large))}.dnb-space__bottom--xx-large-x2.dnb-space__bottom--x-small{margin-bottom:calc(var(--spacing-xx-large) + var(--spacing-large) + var(--spacing-large))}.dnb-space__bottom--xx-large-x2.dnb-space__bottom--small{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-space__bottom--xx-large-x2.dnb-space__bottom--medium{margin-bottom:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-space__bottom--xx-large-x2.dnb-space__bottom--large{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-space__bottom--xx-large-x2.dnb-space__bottom--large.dnb-space__bottom--x-small{margin-bottom:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-space__bottom--xx-large-x2.dnb-space__bottom--x-large{margin-bottom:calc(var(--spacing-xx-large) + var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-space__left--zero{margin-left:0}.dnb-space__left--xx-small{margin-left:var(--spacing-xx-small)}.dnb-space__left--x-small{margin-left:var(--spacing-x-small)}.dnb-space__left--small{margin-left:var(--spacing-small)}.dnb-space__left--medium{margin-left:var(--spacing-medium)}.dnb-space__left--large{margin-left:var(--spacing-large)}.dnb-space__left--large.dnb-space__left--x-small{margin-left:calc(var(--spacing-large) + var(--spacing-x-small))}.dnb-space__left--x-large{margin-left:var(--spacing-x-large)}.dnb-space__left--xx-large{margin-left:var(--spacing-xx-large)}.dnb-space__left--xx-large.dnb-space__left--x-small{margin-left:calc(var(--spacing-large) + var(--spacing-large))}.dnb-space__left--xx-large.dnb-space__left--small{margin-left:calc(var(--spacing-x-large) + var(--spacing-medium))}.dnb-space__left--xx-large.dnb-space__left--medium{margin-left:calc(var(--spacing-x-large) + var(--spacing-large))}.dnb-space__left--xx-large.dnb-space__left--large{margin-left:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-x-small))}.dnb-space__left--xx-large.dnb-space__left--large.dnb-space__left--x-small{margin-left:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-small))}.dnb-space__left--xx-large.dnb-space__left--x-large{margin-left:calc(var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-space__left--xx-large-x2{margin-left:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-large))}.dnb-space__left--xx-large-x2.dnb-space__left--x-small{margin-left:calc(var(--spacing-xx-large) + var(--spacing-large) + var(--spacing-large))}.dnb-space__left--xx-large-x2.dnb-space__left--small{margin-left:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-space__left--xx-large-x2.dnb-space__left--medium{margin-left:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-space__left--xx-large-x2.dnb-space__left--large{margin-left:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-space__left--xx-large-x2.dnb-space__left--large.dnb-space__left--x-small{margin-left:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-space__left--xx-large-x2.dnb-space__left--x-large{margin-left:calc(var(--spacing-xx-large) + var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-space__reset:not([class=dnb-space__top]){margin-top:0}.dnb-space__reset:not([class=dnb-space__bottom]){margin-bottom:0}.dnb-space__reset:not([class=dnb-space__left]){margin-left:0}.dnb-space__reset:not([class=dnb-space__right]){margin-right:0}.dnb-space[style="--space-t-"]{padding-top:var(--padding-top,0)}.dnb-space[style="--space-r-"]{padding-right:var(--padding-right,0)}.dnb-space[style="--space-b-"]{padding-bottom:var(--padding-bottom,0)}.dnb-space[style="--space-l-"]{padding-left:var(--padding-left,0)}@media screen and (max-width:60em){.dnb-space{--padding-right:var(--space-r-s);--padding-left:var(--space-l-s);--padding-top:var(--space-t-s);--padding-bottom:var(--space-b-s)}}@media screen and (max-width:60em) and (min-width:40.0625em){.dnb-space{--padding-right:var(--space-r-m);--padding-left:var(--space-l-m);--padding-top:var(--space-t-m);--padding-bottom:var(--space-b-m)}}@media screen and (min-width:60.0625em){.dnb-space{--padding-right:var(--space-r-l);--padding-left:var(--space-l-l);--padding-top:var(--space-t-l);--padding-bottom:var(--space-b-l)}}span.dnb-space--no-collapse>span{display:block}
1	+ .dnb-core-style .dnb-space__top--zero{margin-top:0}.dnb-core-style .dnb-space__top--xx-small{margin-top:var(--spacing-xx-small)}.dnb-core-style .dnb-space__top--x-small{margin-top:var(--spacing-x-small)}.dnb-core-style .dnb-space__top--small{margin-top:var(--spacing-small)}.dnb-core-style .dnb-space__top--medium{margin-top:var(--spacing-medium)}.dnb-core-style .dnb-space__top--large{margin-top:var(--spacing-large)}.dnb-core-style .dnb-space__top--large.dnb-core-style .dnb-space__top--x-small{margin-top:calc(var(--spacing-large) + var(--spacing-x-small))}.dnb-core-style .dnb-space__top--x-large{margin-top:var(--spacing-x-large)}.dnb-core-style .dnb-space__top--xx-large{margin-top:var(--spacing-xx-large)}.dnb-core-style .dnb-space__top--xx-large.dnb-core-style .dnb-space__top--x-small{margin-top:calc(var(--spacing-large) + var(--spacing-large))}.dnb-core-style .dnb-space__top--xx-large.dnb-core-style .dnb-space__top--small{margin-top:calc(var(--spacing-x-large) + var(--spacing-medium))}.dnb-core-style .dnb-space__top--xx-large.dnb-core-style .dnb-space__top--medium{margin-top:calc(var(--spacing-x-large) + var(--spacing-large))}.dnb-core-style .dnb-space__top--xx-large.dnb-core-style .dnb-space__top--large{margin-top:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-x-small))}.dnb-core-style .dnb-space__top--xx-large.dnb-core-style .dnb-space__top--large.dnb-core-style .dnb-space__top--x-small{margin-top:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-small))}.dnb-core-style .dnb-space__top--xx-large.dnb-core-style .dnb-space__top--x-large{margin-top:calc(var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__top--xx-large-x2{margin-top:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-large))}.dnb-core-style .dnb-space__top--xx-large-x2.dnb-core-style .dnb-space__top--x-small{margin-top:calc(var(--spacing-xx-large) + var(--spacing-large) + var(--spacing-large))}.dnb-core-style .dnb-space__top--xx-large-x2.dnb-core-style .dnb-space__top--small{margin-top:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-core-style .dnb-space__top--xx-large-x2.dnb-core-style .dnb-space__top--medium{margin-top:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-core-style .dnb-space__top--xx-large-x2.dnb-core-style .dnb-space__top--large{margin-top:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__top--xx-large-x2.dnb-core-style .dnb-space__top--large.dnb-core-style .dnb-space__top--x-small{margin-top:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__top--xx-large-x2.dnb-core-style .dnb-space__top--x-large{margin-top:calc(var(--spacing-xx-large) + var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__right--zero{margin-right:0}.dnb-core-style .dnb-space__right--xx-small{margin-right:var(--spacing-xx-small)}.dnb-core-style .dnb-space__right--x-small{margin-right:var(--spacing-x-small)}.dnb-core-style .dnb-space__right--small{margin-right:var(--spacing-small)}.dnb-core-style .dnb-space__right--medium{margin-right:var(--spacing-medium)}.dnb-core-style .dnb-space__right--large{margin-right:var(--spacing-large)}.dnb-core-style .dnb-space__right--large.dnb-core-style .dnb-space__right--x-small{margin-right:calc(var(--spacing-large) + var(--spacing-x-small))}.dnb-core-style .dnb-space__right--x-large{margin-right:var(--spacing-x-large)}.dnb-core-style .dnb-space__right--xx-large{margin-right:var(--spacing-xx-large)}.dnb-core-style .dnb-space__right--xx-large.dnb-core-style .dnb-space__right--x-small{margin-right:calc(var(--spacing-large) + var(--spacing-large))}.dnb-core-style .dnb-space__right--xx-large.dnb-core-style .dnb-space__right--small{margin-right:calc(var(--spacing-x-large) + var(--spacing-medium))}.dnb-core-style .dnb-space__right--xx-large.dnb-core-style .dnb-space__right--medium{margin-right:calc(var(--spacing-x-large) + var(--spacing-large))}.dnb-core-style .dnb-space__right--xx-large.dnb-core-style .dnb-space__right--large{margin-right:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-x-small))}.dnb-core-style .dnb-space__right--xx-large.dnb-core-style .dnb-space__right--large.dnb-core-style .dnb-space__right--x-small{margin-right:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-small))}.dnb-core-style .dnb-space__right--xx-large.dnb-core-style .dnb-space__right--x-large{margin-right:calc(var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__right--xx-large-x2{margin-right:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-large))}.dnb-core-style .dnb-space__right--xx-large-x2.dnb-core-style .dnb-space__right--x-small{margin-right:calc(var(--spacing-xx-large) + var(--spacing-large) + var(--spacing-large))}.dnb-core-style .dnb-space__right--xx-large-x2.dnb-core-style .dnb-space__right--small{margin-right:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-core-style .dnb-space__right--xx-large-x2.dnb-core-style .dnb-space__right--medium{margin-right:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-core-style .dnb-space__right--xx-large-x2.dnb-core-style .dnb-space__right--large{margin-right:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__right--xx-large-x2.dnb-core-style .dnb-space__right--large.dnb-core-style .dnb-space__right--x-small{margin-right:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__right--xx-large-x2.dnb-core-style .dnb-space__right--x-large{margin-right:calc(var(--spacing-xx-large) + var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__bottom--zero{margin-bottom:0}.dnb-core-style .dnb-space__bottom--xx-small{margin-bottom:var(--spacing-xx-small)}.dnb-core-style .dnb-space__bottom--x-small{margin-bottom:var(--spacing-x-small)}.dnb-core-style .dnb-space__bottom--small{margin-bottom:var(--spacing-small)}.dnb-core-style .dnb-space__bottom--medium{margin-bottom:var(--spacing-medium)}.dnb-core-style .dnb-space__bottom--large{margin-bottom:var(--spacing-large)}.dnb-core-style .dnb-space__bottom--large.dnb-core-style .dnb-space__bottom--x-small{margin-bottom:calc(var(--spacing-large) + var(--spacing-x-small))}.dnb-core-style .dnb-space__bottom--x-large{margin-bottom:var(--spacing-x-large)}.dnb-core-style .dnb-space__bottom--xx-large{margin-bottom:var(--spacing-xx-large)}.dnb-core-style .dnb-space__bottom--xx-large.dnb-core-style .dnb-space__bottom--x-small{margin-bottom:calc(var(--spacing-large) + var(--spacing-large))}.dnb-core-style .dnb-space__bottom--xx-large.dnb-core-style .dnb-space__bottom--small{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-medium))}.dnb-core-style .dnb-space__bottom--xx-large.dnb-core-style .dnb-space__bottom--medium{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-large))}.dnb-core-style .dnb-space__bottom--xx-large.dnb-core-style .dnb-space__bottom--large{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-x-small))}.dnb-core-style .dnb-space__bottom--xx-large.dnb-core-style .dnb-space__bottom--large.dnb-core-style .dnb-space__bottom--x-small{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-small))}.dnb-core-style .dnb-space__bottom--xx-large.dnb-core-style .dnb-space__bottom--x-large{margin-bottom:calc(var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__bottom--xx-large-x2{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-large))}.dnb-core-style .dnb-space__bottom--xx-large-x2.dnb-core-style .dnb-space__bottom--x-small{margin-bottom:calc(var(--spacing-xx-large) + var(--spacing-large) + var(--spacing-large))}.dnb-core-style .dnb-space__bottom--xx-large-x2.dnb-core-style .dnb-space__bottom--small{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-core-style .dnb-space__bottom--xx-large-x2.dnb-core-style .dnb-space__bottom--medium{margin-bottom:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-core-style .dnb-space__bottom--xx-large-x2.dnb-core-style .dnb-space__bottom--large{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__bottom--xx-large-x2.dnb-core-style .dnb-space__bottom--large.dnb-core-style .dnb-space__bottom--x-small{margin-bottom:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__bottom--xx-large-x2.dnb-core-style .dnb-space__bottom--x-large{margin-bottom:calc(var(--spacing-xx-large) + var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__left--zero{margin-left:0}.dnb-core-style .dnb-space__left--xx-small{margin-left:var(--spacing-xx-small)}.dnb-core-style .dnb-space__left--x-small{margin-left:var(--spacing-x-small)}.dnb-core-style .dnb-space__left--small{margin-left:var(--spacing-small)}.dnb-core-style .dnb-space__left--medium{margin-left:var(--spacing-medium)}.dnb-core-style .dnb-space__left--large{margin-left:var(--spacing-large)}.dnb-core-style .dnb-space__left--large.dnb-core-style .dnb-space__left--x-small{margin-left:calc(var(--spacing-large) + var(--spacing-x-small))}.dnb-core-style .dnb-space__left--x-large{margin-left:var(--spacing-x-large)}.dnb-core-style .dnb-space__left--xx-large{margin-left:var(--spacing-xx-large)}.dnb-core-style .dnb-space__left--xx-large.dnb-core-style .dnb-space__left--x-small{margin-left:calc(var(--spacing-large) + var(--spacing-large))}.dnb-core-style .dnb-space__left--xx-large.dnb-core-style .dnb-space__left--small{margin-left:calc(var(--spacing-x-large) + var(--spacing-medium))}.dnb-core-style .dnb-space__left--xx-large.dnb-core-style .dnb-space__left--medium{margin-left:calc(var(--spacing-x-large) + var(--spacing-large))}.dnb-core-style .dnb-space__left--xx-large.dnb-core-style .dnb-space__left--large{margin-left:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-x-small))}.dnb-core-style .dnb-space__left--xx-large.dnb-core-style .dnb-space__left--large.dnb-core-style .dnb-space__left--x-small{margin-left:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-small))}.dnb-core-style .dnb-space__left--xx-large.dnb-core-style .dnb-space__left--x-large{margin-left:calc(var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__left--xx-large-x2{margin-left:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-large))}.dnb-core-style .dnb-space__left--xx-large-x2.dnb-core-style .dnb-space__left--x-small{margin-left:calc(var(--spacing-xx-large) + var(--spacing-large) + var(--spacing-large))}.dnb-core-style .dnb-space__left--xx-large-x2.dnb-core-style .dnb-space__left--small{margin-left:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-core-style .dnb-space__left--xx-large-x2.dnb-core-style .dnb-space__left--medium{margin-left:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-core-style .dnb-space__left--xx-large-x2.dnb-core-style .dnb-space__left--large{margin-left:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__left--xx-large-x2.dnb-core-style .dnb-space__left--large.dnb-core-style .dnb-space__left--x-small{margin-left:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-core-style .dnb-space__left--xx-large-x2.dnb-core-style .dnb-space__left--x-large{margin-left:calc(var(--spacing-xx-large) + var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-space--no-collapse{display:flow-root}.dnb-space--stretch{width:100%}.dnb-space--inline{display:inline-block}.dnb-space__top--zero{margin-top:0}.dnb-space__top--xx-small{margin-top:var(--spacing-xx-small)}.dnb-space__top--x-small{margin-top:var(--spacing-x-small)}.dnb-space__top--small{margin-top:var(--spacing-small)}.dnb-space__top--medium{margin-top:var(--spacing-medium)}.dnb-space__top--large{margin-top:var(--spacing-large)}.dnb-space__top--large.dnb-space__top--x-small{margin-top:calc(var(--spacing-large) + var(--spacing-x-small))}.dnb-space__top--x-large{margin-top:var(--spacing-x-large)}.dnb-space__top--xx-large{margin-top:var(--spacing-xx-large)}.dnb-space__top--xx-large.dnb-space__top--x-small{margin-top:calc(var(--spacing-large) + var(--spacing-large))}.dnb-space__top--xx-large.dnb-space__top--small{margin-top:calc(var(--spacing-x-large) + var(--spacing-medium))}.dnb-space__top--xx-large.dnb-space__top--medium{margin-top:calc(var(--spacing-x-large) + var(--spacing-large))}.dnb-space__top--xx-large.dnb-space__top--large{margin-top:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-x-small))}.dnb-space__top--xx-large.dnb-space__top--large.dnb-space__top--x-small{margin-top:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-small))}.dnb-space__top--xx-large.dnb-space__top--x-large{margin-top:calc(var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-space__top--xx-large-x2{margin-top:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-large))}.dnb-space__top--xx-large-x2.dnb-space__top--x-small{margin-top:calc(var(--spacing-xx-large) + var(--spacing-large) + var(--spacing-large))}.dnb-space__top--xx-large-x2.dnb-space__top--small{margin-top:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-space__top--xx-large-x2.dnb-space__top--medium{margin-top:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-space__top--xx-large-x2.dnb-space__top--large{margin-top:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-space__top--xx-large-x2.dnb-space__top--large.dnb-space__top--x-small{margin-top:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-space__top--xx-large-x2.dnb-space__top--x-large{margin-top:calc(var(--spacing-xx-large) + var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-space__right--zero{margin-right:0}.dnb-space__right--xx-small{margin-right:var(--spacing-xx-small)}.dnb-space__right--x-small{margin-right:var(--spacing-x-small)}.dnb-space__right--small{margin-right:var(--spacing-small)}.dnb-space__right--medium{margin-right:var(--spacing-medium)}.dnb-space__right--large{margin-right:var(--spacing-large)}.dnb-space__right--large.dnb-space__right--x-small{margin-right:calc(var(--spacing-large) + var(--spacing-x-small))}.dnb-space__right--x-large{margin-right:var(--spacing-x-large)}.dnb-space__right--xx-large{margin-right:var(--spacing-xx-large)}.dnb-space__right--xx-large.dnb-space__right--x-small{margin-right:calc(var(--spacing-large) + var(--spacing-large))}.dnb-space__right--xx-large.dnb-space__right--small{margin-right:calc(var(--spacing-x-large) + var(--spacing-medium))}.dnb-space__right--xx-large.dnb-space__right--medium{margin-right:calc(var(--spacing-x-large) + var(--spacing-large))}.dnb-space__right--xx-large.dnb-space__right--large{margin-right:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-x-small))}.dnb-space__right--xx-large.dnb-space__right--large.dnb-space__right--x-small{margin-right:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-small))}.dnb-space__right--xx-large.dnb-space__right--x-large{margin-right:calc(var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-space__right--xx-large-x2{margin-right:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-large))}.dnb-space__right--xx-large-x2.dnb-space__right--x-small{margin-right:calc(var(--spacing-xx-large) + var(--spacing-large) + var(--spacing-large))}.dnb-space__right--xx-large-x2.dnb-space__right--small{margin-right:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-space__right--xx-large-x2.dnb-space__right--medium{margin-right:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-space__right--xx-large-x2.dnb-space__right--large{margin-right:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-space__right--xx-large-x2.dnb-space__right--large.dnb-space__right--x-small{margin-right:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-space__right--xx-large-x2.dnb-space__right--x-large{margin-right:calc(var(--spacing-xx-large) + var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-space__bottom--zero{margin-bottom:0}.dnb-space__bottom--xx-small{margin-bottom:var(--spacing-xx-small)}.dnb-space__bottom--x-small{margin-bottom:var(--spacing-x-small)}.dnb-space__bottom--small{margin-bottom:var(--spacing-small)}.dnb-space__bottom--medium{margin-bottom:var(--spacing-medium)}.dnb-space__bottom--large{margin-bottom:var(--spacing-large)}.dnb-space__bottom--large.dnb-space__bottom--x-small{margin-bottom:calc(var(--spacing-large) + var(--spacing-x-small))}.dnb-space__bottom--x-large{margin-bottom:var(--spacing-x-large)}.dnb-space__bottom--xx-large{margin-bottom:var(--spacing-xx-large)}.dnb-space__bottom--xx-large.dnb-space__bottom--x-small{margin-bottom:calc(var(--spacing-large) + var(--spacing-large))}.dnb-space__bottom--xx-large.dnb-space__bottom--small{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-medium))}.dnb-space__bottom--xx-large.dnb-space__bottom--medium{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-large))}.dnb-space__bottom--xx-large.dnb-space__bottom--large{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-x-small))}.dnb-space__bottom--xx-large.dnb-space__bottom--large.dnb-space__bottom--x-small{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-small))}.dnb-space__bottom--xx-large.dnb-space__bottom--x-large{margin-bottom:calc(var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-space__bottom--xx-large-x2{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-large))}.dnb-space__bottom--xx-large-x2.dnb-space__bottom--x-small{margin-bottom:calc(var(--spacing-xx-large) + var(--spacing-large) + var(--spacing-large))}.dnb-space__bottom--xx-large-x2.dnb-space__bottom--small{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-space__bottom--xx-large-x2.dnb-space__bottom--medium{margin-bottom:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-space__bottom--xx-large-x2.dnb-space__bottom--large{margin-bottom:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-space__bottom--xx-large-x2.dnb-space__bottom--large.dnb-space__bottom--x-small{margin-bottom:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-space__bottom--xx-large-x2.dnb-space__bottom--x-large{margin-bottom:calc(var(--spacing-xx-large) + var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-space__left--zero{margin-left:0}.dnb-space__left--xx-small{margin-left:var(--spacing-xx-small)}.dnb-space__left--x-small{margin-left:var(--spacing-x-small)}.dnb-space__left--small{margin-left:var(--spacing-small)}.dnb-space__left--medium{margin-left:var(--spacing-medium)}.dnb-space__left--large{margin-left:var(--spacing-large)}.dnb-space__left--large.dnb-space__left--x-small{margin-left:calc(var(--spacing-large) + var(--spacing-x-small))}.dnb-space__left--x-large{margin-left:var(--spacing-x-large)}.dnb-space__left--xx-large{margin-left:var(--spacing-xx-large)}.dnb-space__left--xx-large.dnb-space__left--x-small{margin-left:calc(var(--spacing-large) + var(--spacing-large))}.dnb-space__left--xx-large.dnb-space__left--small{margin-left:calc(var(--spacing-x-large) + var(--spacing-medium))}.dnb-space__left--xx-large.dnb-space__left--medium{margin-left:calc(var(--spacing-x-large) + var(--spacing-large))}.dnb-space__left--xx-large.dnb-space__left--large{margin-left:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-x-small))}.dnb-space__left--xx-large.dnb-space__left--large.dnb-space__left--x-small{margin-left:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-small))}.dnb-space__left--xx-large.dnb-space__left--x-large{margin-left:calc(var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-space__left--xx-large-x2{margin-left:calc(var(--spacing-x-large) + var(--spacing-large) + var(--spacing-large))}.dnb-space__left--xx-large-x2.dnb-space__left--x-small{margin-left:calc(var(--spacing-xx-large) + var(--spacing-large) + var(--spacing-large))}.dnb-space__left--xx-large-x2.dnb-space__left--small{margin-left:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-space__left--xx-large-x2.dnb-space__left--medium{margin-left:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-large))}.dnb-space__left--xx-large-x2.dnb-space__left--large{margin-left:calc(var(--spacing-x-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-space__left--xx-large-x2.dnb-space__left--large.dnb-space__left--x-small{margin-left:calc(var(--spacing-xx-large) + var(--spacing-x-large) + var(--spacing-x-large))}.dnb-space__left--xx-large-x2.dnb-space__left--x-large{margin-left:calc(var(--spacing-xx-large) + var(--spacing-xx-large) + var(--spacing-x-large))}.dnb-space__reset:not([class=dnb-space__top]){margin-top:0}.dnb-space__reset:not([class=dnb-space__bottom]){margin-bottom:0}.dnb-space__reset:not([class=dnb-space__left]){margin-left:0}.dnb-space__reset:not([class=dnb-space__right]){margin-right:0}.dnb-space[style="--space-t-"]{padding-top:var(--padding-top,0)}.dnb-space[style="--space-r-"]{padding-right:var(--padding-right,0)}.dnb-space[style="--space-b-"]{padding-bottom:var(--padding-bottom,0)}.dnb-space[style="--space-l-"]{padding-left:var(--padding-left,0)}@media screen and (max-width:60em){.dnb-space{--padding-right:var(--space-r-s);--padding-left:var(--space-l-s);--padding-top:var(--space-t-s);--padding-bottom:var(--space-b-s)}}@media screen and (max-width:60em) and (min-width:40.00625em){.dnb-space{--padding-right:var(--space-r-m);--padding-left:var(--space-l-m);--padding-top:var(--space-t-m);--padding-bottom:var(--space-b-m)}}@media screen and (min-width:60.00625em){.dnb-space{--padding-right:var(--space-r-l);--padding-left:var(--space-l-l);--padding-top:var(--space-t-l);--padding-bottom:var(--space-b-l)}}span.dnb-space--no-collapse>span{display:block}

package/cjs/components/switch/Switch.d.ts CHANGED Viewed

@@ -1,94 +1,103 @@
-import * as React from 'react';
-import type { FormStatusState, FormStatusText } from '../FormStatus';
-import type { GlobalStatusConfigObject } from '../GlobalStatus';
-import type { SkeletonShow } from '../Skeleton';
-import type { SpacingProps } from '../space/types';
-export type SwitchLabel =
-  | string
-  | ((...args: any[]) => any)
-  | React.ReactNode;
+import React, { KeyboardEvent } from 'react';
+import { FormStatusState, FormStatusText } from '../form-status/FormStatus';
+import { GlobalStatusConfigObject } from '../GlobalStatus';
+import { SkeletonShow } from '../Skeleton';
+import { SpacingProps } from '../space/types';
 export type SwitchLabelPosition = 'left' | 'right';
 export type SwitchSize = 'default' | 'medium' | 'large';
-export type SwitchSuffix =
-  | string
-  | ((...args: any[]) => any)
-  | React.ReactNode;
 export type SwitchAttributes = string | Record<string, unknown>;
-export type SwitchChildren = string | ((...args: any[]) => any);
-export interface SwitchProps
-  extends Omit<React.HTMLProps<HTMLElement>, 'ref'>,
-    SpacingProps {
-  /**
-   * Use either the `label` property or provide a custom one.
-   */
-  label?: SwitchLabel;
-  /**
-   * Defines the position of the `label`. Use either `left` or `right`. Defaults to `right`.
-   */
-  label_position?: SwitchLabelPosition;
-  /**
-   * Use `true` to make the label only readable by screen readers.
-   */
-  label_sr_only?: boolean;
-  /**
-   * <em>(required)</em> the `title` of the input - describing it a bit further for accessibility reasons.
-   */
-  title?: string;
-  /**
-   * Determine whether the switch is checked or not. The default will be `false`.
-   */
-  checked?: boolean;
-  disabled?: boolean;
-  id?: string;
-  /**
-   * The size of the switch. For now there is "medium" (default) and "large".
-   */
-  size?: SwitchSize;
-  /**
-   * Text with a status message. The style defaults to an error message. You can use `true` to only get the status color, without a message.
-   */
-  status?: FormStatusText;
-  /**
-   * Defines the state of the status. Currently, there are two statuses `[error, info]`. Defaults to `error`.
-   */
-  status_state?: FormStatusState;
-  /**
-   * Use an object to define additional FormStatus properties.
-   */
-  status_props?: Record<string, unknown>;
-  /**
-   * The <a href="/uilib/components/global-status/properties/#configuration-object">configuration</a> used for the target <a href="/uilib/components/global-status">GlobalStatus</a>.
-   */
-  globalStatus?: GlobalStatusConfigObject;
-  status_no_animation?: boolean;
-  /**
-   * Text describing the content of the Switch more than the label. You can also send in a React component, so it gets wrapped inside the Switch component.
-   */
-  suffix?: SwitchSuffix;
-  value?: string;
-  attributes?: SwitchAttributes;
-  readOnly?: boolean;
-  /**
-   * If set to `true`, an overlaying skeleton with animation will be shown.
-   */
-  skeleton?: SkeletonShow;
-  className?: string;
-  children?: SwitchChildren;
-  /**
-   * Will be called on state changes made by the user. Returns a boolean `{ checked, event }`.
-   */
-  on_change?: (...args: any[]) => any;
-  /**
-   * Will be called on state changes made by the user, but with a delay. This way the user sees the animation before e.g. an error will be removed. Returns a boolean `{ checked, event }`.
-   */
-  on_change_end?: (...args: any[]) => any;
-  on_state_update?: (...args: any[]) => any;
-  /**
-   * By providing a React.ref we can get the internally used input element (DOM). E.g. `innerRef={myRef}` by using `React.createRef()` or `React.useRef()`.
-   */
-  innerRef?: React.Ref;
-}
-export default class Switch extends React.Component<SwitchProps, any> {
-  static defaultProps: object;
-  render(): JSX.Element;
-}
+export type SwitchOnChange = (args: {
+    checked: boolean;
+    event: MouseEvent | TouchEvent | KeyboardEvent;
+}) => void;
+export type SwitchProps = {
+    /**
+     * Use either the `label` property or provide a custom one.
+     */
+    label?: React.ReactNode;
+    /**
+     * Defines the position of the `label`. Use either `left` or `right`. Defaults to `right`.
+     */
+    labelPosition?: SwitchLabelPosition;
+    /**
+     * Use `true` to make the label only readable by screen readers.
+     */
+    labelSrOnly?: boolean;
+    /**
+     * <em>(required)</em> the `title` of the input - describing it a bit further for accessibility reasons.
+     */
+    title?: string;
+    /**
+     * Determine whether the switch is checked or not. The default will be `false`.
+     */
+    checked?: boolean;
+    disabled?: boolean;
+    id?: string;
+    /**
+     * The size of the switch. For now there is "medium" (default) and "large".
+     */
+    size?: SwitchSize;
+    /**
+     * Text with a status message. The style defaults to an error message. You can use `true` to only get the status color, without a message.
+     */
+    status?: FormStatusText;
+    /**
+     * Defines the state of the status. Currently, there are two statuses `[error, info]`. Defaults to `error`.
+     */
+    statusState?: FormStatusState;
+    /**
+     * Use an object to define additional FormStatus properties.
+     */
+    statusProps?: Record<string, unknown>;
+    /**
+     * The <a href="/uilib/components/global-status/properties/#configuration-object">configuration</a> used for the target <a href="/uilib/components/global-status">GlobalStatus</a>.
+     */
+    globalStatus?: GlobalStatusConfigObject;
+    statusNoAnimation?: boolean;
+    /**
+     * Text describing the content of the Switch more than the label. You can also send in a React component, so it gets wrapped inside the Switch component.
+     */
+    suffix?: React.ReactNode;
+    value?: string;
+    attributes?: SwitchAttributes;
+    readOnly?: boolean;
+    /**
+     * If set to `true`, an overlaying skeleton with animation will be shown.
+     */
+    skeleton?: SkeletonShow;
+    className?: string;
+    children?: React.ReactNode;
+    /**
+     * Will be called on state changes made by the user. Returns a boolean `{ checked, event }`.
+     */
+    onChange?: SwitchOnChange;
+    /**
+     * Will be called on state changes made by the user, but with a delay. This way the user sees the animation before e.g. an error will be removed. Returns a boolean `{ checked, event }`.
+     */
+    onChangeEnd?: SwitchOnChange;
+    onStateUpdate?: SwitchOnChange;
+    /**
+     * By providing a React.ref we can get the internally used input element (DOM). E.g. `innerRef={myRef}` by using `React.createRef()` or `React.useRef()`.
+     */
+    innerRef?: React.MutableRefObject<HTMLInputElement> | ((elem: HTMLInputElement) => void);
+} & Omit<React.HTMLProps<HTMLElement>, 'ref' | 'size' | 'onChange' | 'innerRef' | 'label'> & SpacingProps & DeprecatedSwitchProps;
+type DeprecatedSwitchProps = {
+    /**  @deprecated use `labelPosition` */
+    label_position?: SwitchLabelPosition;
+    /**  @deprecated use `labelSrOnly` */
+    label_sr_only?: boolean;
+    /**  @deprecated use `statusState` */
+    status_state?: FormStatusState;
+    /**  @deprecated use `statusProps` */
+    status_props?: Record<string, unknown>;
+    /**  @deprecated use `onChange` */
+    on_change?: SwitchOnChange;
+    /**  @deprecated use `onChangeEnd` */
+    on_change_end?: SwitchOnChange;
+    /**  @deprecated use `onStateUpdate` */
+    on_state_update?: SwitchOnChange;
+    /**  @deprecated use `statusNoAnimation` */
+    status_no_animation?: boolean;
+};
+export default function Switch(props: SwitchProps): import("react/jsx-runtime").JSX.Element;
+export {};