@dnb/eufemia 10.33.0 → 10.34.1

package/components/autocomplete/style/dnb-autocomplete.css

@@ -60,7 +60,6 @@
   display: flex;
   justify-content: center;
   align-items: center;
-  color: var(--color-sea-green);
 }
 .dnb-autocomplete__show-all .dnb-drawer-list__option__inner .dnb-drawer-list__option__item {
   display: flex;

package/components/autocomplete/style/dnb-autocomplete.min.css

@@ -1 +1 @@
-.dnb-autocomplete{--autocomplete-width:16rem;--autocomplete-height:2rem;--autocomplete-height--small:1.5rem;--autocomplete-height--medium:2.5rem;--autocomplete-height--large:3rem;--autocomplete-padding-horizontal:1rem;--autocomplete-focus-border-width:0.125rem;--autocomplete-text-padding:0.5rem;--autocomplete-border-radius:0.25rem;align-items:center;display:inline-flex;font-size:var(--font-size-small);line-height:var(--autocomplete-height)}.dnb-autocomplete__inner{color:inherit;display:inline-flex;flex-direction:column;margin:0;padding:0;width:auto}.dnb-autocomplete--right .dnb-autocomplete__inner{align-items:flex-end}.dnb-autocomplete__shell{color:inherit;margin:0;padding:0;position:relative;width:var(--autocomplete-width)}.dnb-autocomplete__row{align-items:center;display:inline-flex}.dnb-autocomplete--small{line-height:var(--autocomplete-height--small)}.dnb-autocomplete--medium{line-height:var(--autocomplete-height--medium)}.dnb-autocomplete--large{line-height:var(--autocomplete-height--large)}.dnb-autocomplete__icon{display:inline-flex;justify-content:center;pointer-events:none}.dnb-autocomplete__show-all .dnb-drawer-list__option__inner{align-items:center;color:var(--color-sea-green);display:flex;justify-content:center}.dnb-autocomplete__show-all .dnb-drawer-list__option__inner .dnb-drawer-list__option__item{display:flex;flex-direction:column}.dnb-autocomplete__show-all .dnb-drawer-list__option__inner .dnb-icon{align-self:center}.dnb-autocomplete__input{align-items:center;display:inline-flex;outline:none}.dnb-autocomplete__input,.dnb-autocomplete__input .dnb-input__inner,.dnb-autocomplete__input .dnb-input__input,.dnb-autocomplete__input .dnb-input__shell{width:100%}.dnb-autocomplete--opened .dnb-input__submit-button__button .dnb-icon{transform:rotate(180deg);transform-origin:50% 50%}.dnb-autocomplete .dnb-input__submit-button__button[disabled]:not(.dnb-button--has-text){--border-color:var(--color-black-55);--border-width:0.0625rem;border-color:transparent;box-shadow:inset 0 0 0 var(--border-width) var(--border-color)}.dnb-autocomplete .dnb-input__submit-button__button .dnb-icon{transition:transform .4s ease-out}html[data-visual-test] .dnb-autocomplete .dnb-input__submit-button__button .dnb-icon{transition-duration:1ms!important}.dnb-autocomplete .dnb-input__inner__element{cursor:text;position:relative;z-index:3}@media screen and (min-width:40em){.dnb-autocomplete .dnb-input--has-inner-element .dnb-input__input,.dnb-autocomplete .dnb-input--has-inner-element .dnb-input__placeholder{padding-right:0!important}}@media screen and (max-width:40em){.dnb-autocomplete .dnb-input--has-inner-element .dnb-input__input,.dnb-autocomplete .dnb-input--has-inner-element .dnb-input__placeholder{padding-right:2.5rem!important}}.dnb-autocomplete .dnb-input__inner__element.dnb-p{padding:0 .5rem;white-space:nowrap}@media screen and (max-width:40em){.dnb-autocomplete .dnb-input__inner__element.dnb-p{display:none}}.dnb-autocomplete .dnb-input__inner__element.dnb-p,.dnb-spacing .dnb-autocomplete .dnb-input__inner__element.dnb-p{margin:0}.dnb-autocomplete .dnb-input--has-submit-element .dnb-input__inner__element{margin-right:2.5rem!important}.dnb-autocomplete--icon-position-right .dnb-input__inner__element.dnb-p{padding-right:3rem}.dnb-autocomplete--icon-position-right .dnb-input--icon-position-right .dnb-autocomplete--icon-position-right .dnb-input--icon-position-right.dnb-autocomplete--icon-position-right .dnb-input--has-icon .dnb-autocomplete--icon-position-right .dnb-input__input{padding-right:1rem}.dnb-autocomplete--disabled .dnb-input__inner__element{cursor:not-allowed}.dnb-autocomplete__text{font-size:var(--font-size-basis);line-height:inherit;order:1;padding:0 var(--autocomplete-text-padding) 0 0;position:relative;text-align:left;text-overflow:ellipsis;z-index:4}.dnb-autocomplete__text,.dnb-autocomplete__text__inner{color:inherit;height:inherit;overflow:hidden;width:100%}.dnb-autocomplete__text__inner{display:inline-block;padding:0;text-align:inherit;-webkit-text-decoration:none;text-decoration:none;text-overflow:inherit;white-space:nowrap}.dnb-autocomplete>.dnb-form-label{line-height:var(--line-height-basis);margin-right:1rem}@media screen and (max-width:40em){.dnb-autocomplete{flex-wrap:wrap}.dnb-autocomplete>.dnb-form-label{margin-bottom:.5rem;margin-top:.5rem}}.dnb-autocomplete--stretch{display:flex;flex-grow:1}.dnb-autocomplete--stretch .dnb-autocomplete__inner{flex-grow:1}.dnb-autocomplete--stretch .dnb-autocomplete__inner,.dnb-autocomplete--stretch .dnb-autocomplete__row,.dnb-autocomplete--stretch .dnb-autocomplete__shell{width:100%}.dnb-autocomplete--stretch .dnb-form-label+.dnb-autocomplete__inner{width:auto}.dnb-autocomplete--vertical.dnb-autocomplete--stretch .dnb-autocomplete__inner,.dnb-form-row--horizontal .dnb-autocomplete--stretch{width:100%}label+.dnb-autocomplete[class*=__form-status]{vertical-align:top}label+.dnb-autocomplete[class*=__form-status] .dnb-autocomplete__shell{top:-.375rem}.dnb-autocomplete__inner>.dnb-form-status{margin-top:.5rem;order:2}.dnb-autocomplete--vertical{align-items:flex-start;display:flex;flex-direction:column}.dnb-autocomplete:not(.dnb-autocomplete--vertical)[class*=__status]{align-items:flex-start}.dnb-autocomplete:not(.dnb-autocomplete--vertical)[class*=__status]>.dnb-form-label{margin-top:.25rem}@media screen and (max-width:40em){.dnb-responsive-component .dnb-autocomplete{align-items:flex-start;display:flex;flex-direction:column;margin-bottom:.5rem}.dnb-responsive-component .dnb-autocomplete>.dnb-form-label{margin-bottom:.5rem}.dnb-responsive-component .dnb-autocomplete__helper{display:none}}.dnb-autocomplete__list .dnb-drawer-list__option__item>span{padding-right:.125em}
+.dnb-autocomplete{--autocomplete-width:16rem;--autocomplete-height:2rem;--autocomplete-height--small:1.5rem;--autocomplete-height--medium:2.5rem;--autocomplete-height--large:3rem;--autocomplete-padding-horizontal:1rem;--autocomplete-focus-border-width:0.125rem;--autocomplete-text-padding:0.5rem;--autocomplete-border-radius:0.25rem;align-items:center;display:inline-flex;font-size:var(--font-size-small);line-height:var(--autocomplete-height)}.dnb-autocomplete__inner{color:inherit;display:inline-flex;flex-direction:column;margin:0;padding:0;width:auto}.dnb-autocomplete--right .dnb-autocomplete__inner{align-items:flex-end}.dnb-autocomplete__shell{color:inherit;margin:0;padding:0;position:relative;width:var(--autocomplete-width)}.dnb-autocomplete__row{align-items:center;display:inline-flex}.dnb-autocomplete--small{line-height:var(--autocomplete-height--small)}.dnb-autocomplete--medium{line-height:var(--autocomplete-height--medium)}.dnb-autocomplete--large{line-height:var(--autocomplete-height--large)}.dnb-autocomplete__icon{display:inline-flex;justify-content:center;pointer-events:none}.dnb-autocomplete__show-all .dnb-drawer-list__option__inner{align-items:center;display:flex;justify-content:center}.dnb-autocomplete__show-all .dnb-drawer-list__option__inner .dnb-drawer-list__option__item{display:flex;flex-direction:column}.dnb-autocomplete__show-all .dnb-drawer-list__option__inner .dnb-icon{align-self:center}.dnb-autocomplete__input{align-items:center;display:inline-flex;outline:none}.dnb-autocomplete__input,.dnb-autocomplete__input .dnb-input__inner,.dnb-autocomplete__input .dnb-input__input,.dnb-autocomplete__input .dnb-input__shell{width:100%}.dnb-autocomplete--opened .dnb-input__submit-button__button .dnb-icon{transform:rotate(180deg);transform-origin:50% 50%}.dnb-autocomplete .dnb-input__submit-button__button[disabled]:not(.dnb-button--has-text){--border-color:var(--color-black-55);--border-width:0.0625rem;border-color:transparent;box-shadow:inset 0 0 0 var(--border-width) var(--border-color)}.dnb-autocomplete .dnb-input__submit-button__button .dnb-icon{transition:transform .4s ease-out}html[data-visual-test] .dnb-autocomplete .dnb-input__submit-button__button .dnb-icon{transition-duration:1ms!important}.dnb-autocomplete .dnb-input__inner__element{cursor:text;position:relative;z-index:3}@media screen and (min-width:40em){.dnb-autocomplete .dnb-input--has-inner-element .dnb-input__input,.dnb-autocomplete .dnb-input--has-inner-element .dnb-input__placeholder{padding-right:0!important}}@media screen and (max-width:40em){.dnb-autocomplete .dnb-input--has-inner-element .dnb-input__input,.dnb-autocomplete .dnb-input--has-inner-element .dnb-input__placeholder{padding-right:2.5rem!important}}.dnb-autocomplete .dnb-input__inner__element.dnb-p{padding:0 .5rem;white-space:nowrap}@media screen and (max-width:40em){.dnb-autocomplete .dnb-input__inner__element.dnb-p{display:none}}.dnb-autocomplete .dnb-input__inner__element.dnb-p,.dnb-spacing .dnb-autocomplete .dnb-input__inner__element.dnb-p{margin:0}.dnb-autocomplete .dnb-input--has-submit-element .dnb-input__inner__element{margin-right:2.5rem!important}.dnb-autocomplete--icon-position-right .dnb-input__inner__element.dnb-p{padding-right:3rem}.dnb-autocomplete--icon-position-right .dnb-input--icon-position-right .dnb-autocomplete--icon-position-right .dnb-input--icon-position-right.dnb-autocomplete--icon-position-right .dnb-input--has-icon .dnb-autocomplete--icon-position-right .dnb-input__input{padding-right:1rem}.dnb-autocomplete--disabled .dnb-input__inner__element{cursor:not-allowed}.dnb-autocomplete__text{font-size:var(--font-size-basis);line-height:inherit;order:1;padding:0 var(--autocomplete-text-padding) 0 0;position:relative;text-align:left;text-overflow:ellipsis;z-index:4}.dnb-autocomplete__text,.dnb-autocomplete__text__inner{color:inherit;height:inherit;overflow:hidden;width:100%}.dnb-autocomplete__text__inner{display:inline-block;padding:0;text-align:inherit;-webkit-text-decoration:none;text-decoration:none;text-overflow:inherit;white-space:nowrap}.dnb-autocomplete>.dnb-form-label{line-height:var(--line-height-basis);margin-right:1rem}@media screen and (max-width:40em){.dnb-autocomplete{flex-wrap:wrap}.dnb-autocomplete>.dnb-form-label{margin-bottom:.5rem;margin-top:.5rem}}.dnb-autocomplete--stretch{display:flex;flex-grow:1}.dnb-autocomplete--stretch .dnb-autocomplete__inner{flex-grow:1}.dnb-autocomplete--stretch .dnb-autocomplete__inner,.dnb-autocomplete--stretch .dnb-autocomplete__row,.dnb-autocomplete--stretch .dnb-autocomplete__shell{width:100%}.dnb-autocomplete--stretch .dnb-form-label+.dnb-autocomplete__inner{width:auto}.dnb-autocomplete--vertical.dnb-autocomplete--stretch .dnb-autocomplete__inner,.dnb-form-row--horizontal .dnb-autocomplete--stretch{width:100%}label+.dnb-autocomplete[class*=__form-status]{vertical-align:top}label+.dnb-autocomplete[class*=__form-status] .dnb-autocomplete__shell{top:-.375rem}.dnb-autocomplete__inner>.dnb-form-status{margin-top:.5rem;order:2}.dnb-autocomplete--vertical{align-items:flex-start;display:flex;flex-direction:column}.dnb-autocomplete:not(.dnb-autocomplete--vertical)[class*=__status]{align-items:flex-start}.dnb-autocomplete:not(.dnb-autocomplete--vertical)[class*=__status]>.dnb-form-label{margin-top:.25rem}@media screen and (max-width:40em){.dnb-responsive-component .dnb-autocomplete{align-items:flex-start;display:flex;flex-direction:column;margin-bottom:.5rem}.dnb-responsive-component .dnb-autocomplete>.dnb-form-label{margin-bottom:.5rem}.dnb-responsive-component .dnb-autocomplete__helper{display:none}}.dnb-autocomplete__list .dnb-drawer-list__option__item>span{padding-right:.125em}

package/components/autocomplete/style/dnb-autocomplete.scss

@@ -84,8 +84,6 @@
       .dnb-icon {
         align-self: center;
       }
-
-      color: var(--color-sea-green);
     }
   }
 

package/components/autocomplete/style/themes/dnb-autocomplete-theme-sbanken.css

@@ -0,0 +1,41 @@
+/*
+* Autocomplete theme for sbanken
+* TODO: this theme is just a prelimenary fix to avoid dnb colors
+*/
+/*
+ * Utilities
+ */
+.dnb-autocomplete__show-all .dnb-drawer-list__option__inner {
+  color: var(--sb-color-violet);
+}
+.dnb-autocomplete--opened .dnb-input .dnb-input__shell .dnb-input__shell, .dnb-autocomplete:not(.dnb-autocomplete__status--error) .dnb-form-label:hover ~ .dnb-autocomplete__inner .dnb-input:not([data-input-state=disabled]) .dnb-input__shell {
+  --border-color: var(--sb-color-violet);
+  --border-width: 0.125rem;
+  box-shadow: 0 0 0 var(--border-width) var(--border-color);
+  border-color: transparent;
+}
+.dnb-autocomplete--show-indicator .dnb-autocomplete__input .dnb-input__icon {
+  color: transparent;
+}
+.dnb-autocomplete__shell, .dnb-autocomplete__input {
+  border-radius: var(--autocomplete-border-radius);
+}
+.dnb-autocomplete__status--error:not(.dnb-autocomplete--opened) .dnb-form-label:hover ~ .dnb-autocomplete__inner .dnb-input:not([data-input-state=disabled]) .dnb-input__shell {
+  --border-color: var(--sb-color-red);
+  --border-width: 0.125rem;
+  box-shadow: 0 0 0 var(--border-width) var(--border-color);
+  border-color: transparent;
+}
+
+.dnb-autocomplete__root .dnb-drawer-list__option--focus, .dnb-autocomplete__root .dnb-drawer-list__option__item:nth-of-type(1) {
+  font-weight: var(--font-weight-basis);
+}
+.dnb-autocomplete__root .dnb-drawer-list__option__item:nth-of-type(n + 2) {
+  color: var(--sb-color-gray-dark-2);
+}
+.dnb-autocomplete__root .dnb-drawer-list__option--selected:not(.dnb-drawer-list__option--focus) .dnb-drawer-list__option__item:nth-of-type(n + 2), .dnb-autocomplete__root .dnb-drawer-list__option--selected:not(.dnb-drawer-list__option--focus) .dnb-drawer-list__option__item:nth-of-type(n + 2) .dnb-anchor {
+  color: var(--sb-color-white);
+}
+.dnb-autocomplete__root .dnb-drawer-list__option__item--highlight {
+  font-weight: var(--font-weight-bold);
+}

package/components/autocomplete/style/themes/dnb-autocomplete-theme-sbanken.min.css

@@ -0,0 +1 @@
+.dnb-autocomplete__show-all .dnb-drawer-list__option__inner{color:var(--sb-color-violet)}.dnb-autocomplete--opened .dnb-input .dnb-input__shell .dnb-input__shell,.dnb-autocomplete:not(.dnb-autocomplete__status--error) .dnb-form-label:hover~.dnb-autocomplete__inner .dnb-input:not([data-input-state=disabled]) .dnb-input__shell{--border-color:var(--sb-color-violet);--border-width:0.125rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-autocomplete--show-indicator .dnb-autocomplete__input .dnb-input__icon{color:transparent}.dnb-autocomplete__input,.dnb-autocomplete__shell{border-radius:var(--autocomplete-border-radius)}.dnb-autocomplete__status--error:not(.dnb-autocomplete--opened) .dnb-form-label:hover~.dnb-autocomplete__inner .dnb-input:not([data-input-state=disabled]) .dnb-input__shell{--border-color:var(--sb-color-red);--border-width:0.125rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-autocomplete__root .dnb-drawer-list__option--focus,.dnb-autocomplete__root .dnb-drawer-list__option__item:first-of-type{font-weight:var(--font-weight-basis)}.dnb-autocomplete__root .dnb-drawer-list__option__item:nth-of-type(n+2){color:var(--sb-color-gray-dark-2)}.dnb-autocomplete__root .dnb-drawer-list__option--selected:not(.dnb-drawer-list__option--focus) .dnb-drawer-list__option__item:nth-of-type(n+2),.dnb-autocomplete__root .dnb-drawer-list__option--selected:not(.dnb-drawer-list__option--focus) .dnb-drawer-list__option__item:nth-of-type(n+2) .dnb-anchor{color:var(--sb-color-white)}.dnb-autocomplete__root .dnb-drawer-list__option__item--highlight{font-weight:var(--font-weight-bold)}

package/components/autocomplete/style/themes/dnb-autocomplete-theme-sbanken.scss

@@ -0,0 +1,65 @@
+/*
+* Autocomplete theme for sbanken
+* TODO: this theme is just a prelimenary fix to avoid dnb colors
+*/
+
+@import '../../../../style/core/utilities.scss';
+
+.dnb-autocomplete {
+  &__show-all {
+    .dnb-drawer-list__option__inner {
+      color: var(--sb-color-violet);
+    }
+  }
+
+  &--opened .dnb-input .dnb-input__shell,
+  &:not(#{&}__status--error)
+    .dnb-form-label:hover
+    ~ &__inner
+    .dnb-input:not([data-input-state='disabled']) {
+    .dnb-input__shell {
+      @include fakeBorder(var(--sb-color-violet), 0.125rem);
+    }
+  }
+
+  &--show-indicator &__input .dnb-input__icon {
+    color: transparent;
+  }
+
+  &__shell,
+  &__input {
+    border-radius: var(--autocomplete-border-radius);
+  }
+
+  &__status--error:not(#{&}--opened)
+    .dnb-form-label:hover
+    ~ &__inner
+    .dnb-input:not([data-input-state='disabled']) {
+    .dnb-input__shell {
+      @include fakeBorder(var(--sb-color-red), 0.125rem);
+    }
+  }
+}
+
+.dnb-autocomplete__root .dnb-drawer-list__option {
+  &--focus,
+  &__item:nth-of-type(1) {
+    font-weight: var(--font-weight-basis);
+  }
+
+  &__item:nth-of-type(n + 2) {
+    color: var(--sb-color-gray-dark-2);
+  }
+
+  &--selected:not(.dnb-drawer-list__option--focus)
+    .dnb-drawer-list__option__item:nth-of-type(n + 2) {
+    &,
+    & .dnb-anchor {
+      color: var(--sb-color-white);
+    }
+  }
+
+  &__item--highlight {
+    font-weight: var(--font-weight-bold);
+  }
+}

package/components/autocomplete/style/themes/dnb-autocomplete-theme-ui.css

@@ -5,6 +5,9 @@
 /*
  * Utilities
  */
+.dnb-autocomplete__show-all .dnb-drawer-list__option__inner {
+  color: var(--color-sea-green);
+}
 .dnb-autocomplete--opened .dnb-input .dnb-input__shell .dnb-input__shell, .dnb-autocomplete:not(.dnb-autocomplete__status--error) .dnb-form-label:hover ~ .dnb-autocomplete__inner .dnb-input:not([data-input-state=disabled]) .dnb-input__shell {
   --border-color: var(--color-sea-green);
   --border-width: 0.125rem;

package/components/autocomplete/style/themes/dnb-autocomplete-theme-ui.min.css

@@ -1 +1 @@
-.dnb-autocomplete--opened .dnb-input .dnb-input__shell .dnb-input__shell,.dnb-autocomplete:not(.dnb-autocomplete__status--error) .dnb-form-label:hover~.dnb-autocomplete__inner .dnb-input:not([data-input-state=disabled]) .dnb-input__shell{--border-color:var(--color-sea-green);--border-width:0.125rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-autocomplete--opened .dnb-input .dnb-input__shell .dnb-input__submit-button__button,.dnb-autocomplete:not(.dnb-autocomplete__status--error) .dnb-form-label:hover~.dnb-autocomplete__inner .dnb-input:not([data-input-state=disabled]) .dnb-input__submit-button__button{background-color:var(--color-sea-green);border-radius:0;box-shadow:none;color:var(--color-white)}.dnb-autocomplete--show-indicator .dnb-autocomplete__input .dnb-input__icon{color:transparent}.dnb-autocomplete__input,.dnb-autocomplete__shell{border-radius:var(--autocomplete-border-radius)}.dnb-autocomplete__status--error:not(.dnb-autocomplete--opened) .dnb-form-label:hover~.dnb-autocomplete__inner .dnb-input:not([data-input-state=disabled]) .dnb-input__shell{--border-color:var(--color-fire-red);--border-width:0.125rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-autocomplete__root .dnb-drawer-list__option__item:first-of-type{font-weight:var(--font-weight-basis)}.dnb-autocomplete__root .dnb-drawer-list__option__item:nth-of-type(n+2){color:var(--color-black-55)}.dnb-autocomplete__root .dnb-drawer-list__option__item--highlight{font-weight:var(--font-weight-bold)}.dnb-autocomplete__root .dnb-drawer-list__option--selected .dnb-anchor,.dnb-autocomplete__root .dnb-drawer-list__option--selected .dnb-drawer-list__option__item:nth-of-type(n+2){color:var(--color-white)}
+.dnb-autocomplete__show-all .dnb-drawer-list__option__inner{color:var(--color-sea-green)}.dnb-autocomplete--opened .dnb-input .dnb-input__shell .dnb-input__shell,.dnb-autocomplete:not(.dnb-autocomplete__status--error) .dnb-form-label:hover~.dnb-autocomplete__inner .dnb-input:not([data-input-state=disabled]) .dnb-input__shell{--border-color:var(--color-sea-green);--border-width:0.125rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-autocomplete--opened .dnb-input .dnb-input__shell .dnb-input__submit-button__button,.dnb-autocomplete:not(.dnb-autocomplete__status--error) .dnb-form-label:hover~.dnb-autocomplete__inner .dnb-input:not([data-input-state=disabled]) .dnb-input__submit-button__button{background-color:var(--color-sea-green);border-radius:0;box-shadow:none;color:var(--color-white)}.dnb-autocomplete--show-indicator .dnb-autocomplete__input .dnb-input__icon{color:transparent}.dnb-autocomplete__input,.dnb-autocomplete__shell{border-radius:var(--autocomplete-border-radius)}.dnb-autocomplete__status--error:not(.dnb-autocomplete--opened) .dnb-form-label:hover~.dnb-autocomplete__inner .dnb-input:not([data-input-state=disabled]) .dnb-input__shell{--border-color:var(--color-fire-red);--border-width:0.125rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-autocomplete__root .dnb-drawer-list__option__item:first-of-type{font-weight:var(--font-weight-basis)}.dnb-autocomplete__root .dnb-drawer-list__option__item:nth-of-type(n+2){color:var(--color-black-55)}.dnb-autocomplete__root .dnb-drawer-list__option__item--highlight{font-weight:var(--font-weight-bold)}.dnb-autocomplete__root .dnb-drawer-list__option--selected .dnb-anchor,.dnb-autocomplete__root .dnb-drawer-list__option--selected .dnb-drawer-list__option__item:nth-of-type(n+2){color:var(--color-white)}

package/components/autocomplete/style/themes/dnb-autocomplete-theme-ui.scss

@@ -6,6 +6,12 @@
 @import '../../../../style/core/utilities.scss';
 
 .dnb-autocomplete {
+  &__show-all {
+    .dnb-drawer-list__option__inner {
+      color: var(--color-sea-green);
+    }
+  }
+
   &--opened .dnb-input .dnb-input__shell,
   &:not(#{&}__status--error)
     .dnb-form-label:hover

package/components/breadcrumb/Breadcrumb.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { SectionSpacing, SectionStyleTypes } from '../section/Section';
+import { SectionSpacing, SectionStyleTypes, SectionVariants } from '../section/Section';
 import type { SpacingProps } from '../../shared/types';
 import type { SkeletonShow } from '../skeleton/Skeleton';
 import BreadcrumbItem, { BreadcrumbItemProps } from './BreadcrumbItem';
@@ -70,10 +70,10 @@ export type BreadcrumbProps = {
      */
     styleType?: SectionStyleTypes;
     /**
-     * Use one of the Section component style types (style_type)
-     * Default: pistachio
+     * Use one of the Section component variants
+     * Default: info
      */
-    collapsedStyleType?: SectionStyleTypes;
+    collapsedStyleType?: SectionVariants;
     /**
      * Include spacing properties from the Section component in breadcrumb. If only `true` is given, the spacing will be `small`.
      * Default: false

package/components/breadcrumb/Breadcrumb.js

@@ -13,7 +13,7 @@ import Context from '../../shared/Context';
 import BreadcrumbItem from './BreadcrumbItem';
 import { convertJsxToString, isTrue, validateDOMAttributes, extendPropsWithContext } from '../../shared/component-helper';
 import { BreadcrumbMultiple } from './BreadcrumbMultiple';
-import { useMedia } from '../../shared';
+import { useMedia, useTheme } from '../../shared';
 export const defaultProps = {
   skeleton: false,
   navText: 'Back',
@@ -26,7 +26,7 @@ export const defaultProps = {
   spacing: false
 };
 const Breadcrumb = localProps => {
-  var _context$translation;
+  var _context$translation, _useTheme;
   const context = React.useContext(Context);
   const allProps = extendPropsWithContext(localProps, defaultProps, context === null || context === void 0 ? void 0 : (_context$translation = context.translation) === null || _context$translation === void 0 ? void 0 : _context$translation.Breadcrumb, context === null || context === void 0 ? void 0 : context.Breadcrumb, {
     skeleton: context === null || context === void 0 ? void 0 : context.skeleton
@@ -85,6 +85,7 @@ const Breadcrumb = localProps => {
   }, [data, items, variant]);
   validateDOMAttributes(allProps, props);
   const innerSpace = isTrue(spacing) ? 'small' : spacing;
+  const overrideSbankenSectionColor = ((_useTheme = useTheme()) === null || _useTheme === void 0 ? void 0 : _useTheme.isSbanken) && collapsedStyleType === 'info';
   return React.createElement("nav", _extends({
     "aria-label": convertJsxToString(navText),
     className: classnames(`dnb-breadcrumb dnb-breadcrumb--variant-${currentVariant}`, skeletonClasses, spacingClasses, className)
@@ -113,8 +114,9 @@ const Breadcrumb = localProps => {
     isCollapsed: false,
     noAnimation: noAnimation
   }))), (currentVariant === 'collapse' || currentVariant === 'responsive') && React.createElement(Section, {
-    variant: collapsedStyleType,
-    className: "dnb-breadcrumb__collapse"
+    variant: overrideSbankenSectionColor ? undefined : collapsedStyleType,
+    className: "dnb-breadcrumb__collapse",
+    backgroundColor: overrideSbankenSectionColor ? 'var(--sb-color-gray-light-2)' : undefined
   }, React.createElement(BreadcrumbMultiple, {
     data: data,
     items: items,

package/components/breadcrumb/Breadcrumb.js.map

@@ -1 +1 @@
-{"version":3,"file":"Breadcrumb.js","names":["React","useCallback","useEffect","useMemo","useReducer","useRef","classnames","createSkeletonClass","createSpacingClasses","Section","Button","Context","BreadcrumbItem","convertJsxToString","isTrue","validateDOMAttributes","extendPropsWithContext","BreadcrumbMultiple","useMedia","defaultProps","skeleton","navText","goBackText","homeText","backToText","isCollapsed","styleType","collapsedStyleType","spacing","Breadcrumb","localProps","_context$translation","context","useContext","allProps","translation","className","children","items","variant","onClick","overrideIsCollapsed","noAnimation","data","href","props","_objectWithoutProperties","_excluded","skeletonClasses","spacingClasses","forceUpdate","isCollapsedRef","isLarge","current","onClickHandler","currentVariant","innerSpace","createElement","_extends","style_type","text","icon","icon_position","Fragment","Item","_supportsSpacingProps"],"sources":["../../../../src/components/breadcrumb/Breadcrumb.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useEffect,\n  useMemo,\n  useReducer,\n  useRef,\n} from 'react'\nimport classnames from 'classnames'\n\n// Components\nimport { createSkeletonClass } from '../skeleton/SkeletonHelper'\nimport { createSpacingClasses } from '../space/SpacingHelper'\nimport Section, {\n  SectionSpacing,\n  SectionStyleTypes,\n} from '../section/Section'\nimport Button from '../button/Button'\n\n// Shared\nimport Context from '../../shared/Context'\nimport type { SpacingProps } from '../../shared/types'\nimport type { SkeletonShow } from '../skeleton/Skeleton'\n\n// Internal\nimport BreadcrumbItem, { BreadcrumbItemProps } from './BreadcrumbItem'\nimport {\n  convertJsxToString,\n  isTrue,\n  validateDOMAttributes,\n  extendPropsWithContext,\n} from '../../shared/component-helper'\nimport { BreadcrumbMultiple } from './BreadcrumbMultiple'\nimport { useMedia } from '../../shared'\n\nexport type BreadcrumbProps = {\n  /**\n   * Custom className on the component root\n   * Default: null\n   */\n  className?: string\n\n  /**\n   * Skeleton should be applied when loading content\n   * Default: null\n   */\n  skeleton?: SkeletonShow\n\n  /**\n   * Pass in a list of your pages as objects of breadcrumbitem to render them as breadcrumbitems.\n   * Default: null\n   */\n  data?: Array<BreadcrumbItemProps>\n\n  /**\n   * The content of the component. Can be used instead of prop \"data\".\n   * Default: null\n   */\n  children?:\n    | React.ReactElement<BreadcrumbItemProps>\n    | Array<React.ReactElement<BreadcrumbItemProps>>\n\n  /**\n   * The variant of the component.\n   * Default: When children and data is not defined, it defaults to \"single\". \"responsive\" if they are defined.\n   */\n  variant?: 'responsive' | 'single' | 'multiple' | 'collapse'\n\n  /**\n   * Handle the click event on 'single'/'collapse'\n   * Default: null\n   */\n  onClick?: React.MouseEventHandler<HTMLButtonElement>\n\n  /**\n   * For variant 'single', use href (or onClick) to set href when clicking \"Back\"\n   * Default: null\n   */\n  href?: string\n\n  /**\n   * Every <nav> on a page needs an unique aria-label text\n   * Default: Page hierarchy\n   */\n  navText?: React.ReactNode\n\n  /**\n   * Add custom 'Back' text for variant 'single'\n   * Default: 'Back' or defined by Context translation\n   */\n  goBackText?: React.ReactNode\n\n  /**\n   * Add custom 'Home' text\n   * Default: 'Home' or defined by Context translation\n   */\n  homeText?: React.ReactNode\n\n  /**\n   * Add custom 'Back to...' text, for variant collapse\n   * Default 'Back to...' or defined by Context translation\n   */\n  backToText?: React.ReactNode\n\n  /**\n   * If variant='collapse', you can override isCollapsed for the collapsed content by updating this value.\n   * Default: null\n   */\n  isCollapsed?: boolean\n\n  /**\n   * Use one of the Section component style types (style_type)\n   * Default: transparent\n   */\n  styleType?: SectionStyleTypes\n\n  /**\n   * Use one of the Section component style types (style_type)\n   * Default: pistachio\n   */\n  collapsedStyleType?: SectionStyleTypes\n\n  /**\n   * Include spacing properties from the Section component in breadcrumb. If only `true` is given, the spacing will be `small`.\n   * Default: false\n   */\n  spacing?: SectionSpacing\n\n  /**\n   * Will disable the height animation\n   * Default: false\n   */\n  noAnimation?: boolean\n}\n\nexport const defaultProps = {\n  skeleton: false,\n  navText: 'Back',\n  goBackText: 'Back',\n  homeText: 'Home',\n  backToText: 'Back to...',\n  isCollapsed: true,\n  styleType: 'transparent',\n  collapsedStyleType: 'info',\n  spacing: false,\n}\n\nconst Breadcrumb = (localProps: BreadcrumbProps & SpacingProps) => {\n  // Every component should have a context\n  const context = React.useContext(Context)\n\n  // Extract additional props from global context\n  const allProps = extendPropsWithContext(\n    localProps,\n    defaultProps,\n    context?.translation?.Breadcrumb,\n    context?.Breadcrumb,\n    { skeleton: context?.skeleton }\n  )\n\n  const {\n    className,\n    skeleton,\n    children: items,\n    variant,\n    onClick,\n    navText, // has a translation in context\n    goBackText, // has a translation in context\n    homeText, // eslint-disable-line\n    backToText, // has a translation in context\n    styleType,\n    collapsedStyleType,\n    isCollapsed: overrideIsCollapsed,\n    spacing,\n    noAnimation,\n    data,\n    href,\n    ...props\n  } = allProps\n  const skeletonClasses = createSkeletonClass('font', skeleton, context)\n  const spacingClasses = createSpacingClasses(props)\n\n  const [, forceUpdate] = useReducer(() => ({}), {})\n\n  const isCollapsedRef = useRef(overrideIsCollapsed)\n\n  const { isLarge } = useMedia()\n\n  useEffect(() => {\n    if (overrideIsCollapsed !== isCollapsedRef.current) {\n      isCollapsedRef.current = overrideIsCollapsed\n      forceUpdate()\n    }\n  }, [overrideIsCollapsed])\n\n  // Auto-collapse breadcrumbs if going from small screen to large screen.\n  useEffect(() => {\n    if (isLarge && overrideIsCollapsed !== false) {\n      isCollapsedRef.current = true\n      forceUpdate()\n    }\n  }, [isLarge, overrideIsCollapsed])\n\n  const onClickHandler = useCallback(() => {\n    isCollapsedRef.current = !isCollapsedRef.current\n    forceUpdate()\n  }, [])\n\n  const currentVariant = useMemo(() => {\n    if (!variant) {\n      if (items || data) {\n        return 'responsive'\n      } else {\n        return 'single'\n      }\n    }\n\n    return variant\n  }, [data, items, variant])\n\n  validateDOMAttributes(allProps, props)\n\n  const innerSpace = isTrue(spacing) ? 'small' : spacing\n\n  return (\n    <nav\n      aria-label={convertJsxToString(navText)}\n      className={classnames(\n        'dnb-breadcrumb',\n        `dnb-breadcrumb--variant-${currentVariant}`,\n        skeletonClasses,\n        spacingClasses,\n        className\n      )}\n      {...props}\n    >\n      <Section\n        className=\"dnb-breadcrumb__bar\"\n        style_type={styleType || 'transparent'}\n        innerSpace={innerSpace}\n      >\n        {currentVariant === 'single' ? (\n          <Button\n            text={goBackText}\n            variant=\"tertiary\"\n            icon=\"chevron_left\"\n            icon_position=\"left\"\n            onClick={onClick}\n            href={href}\n          />\n        ) : (\n          <>\n            {currentVariant !== 'multiple' && (\n              <Button\n                className=\"dnb-breadcrumb__toggle\"\n                text={backToText}\n                variant=\"tertiary\"\n                icon=\"chevron_left\"\n                icon_position=\"left\"\n                onClick={onClick ?? onClickHandler}\n                aria-expanded={!isCollapsedRef.current}\n              />\n            )}\n\n            {currentVariant !== 'collapse' && (\n              <BreadcrumbMultiple\n                data={data}\n                items={items}\n                isCollapsed={false}\n                noAnimation={noAnimation}\n              />\n            )}\n          </>\n        )}\n      </Section>\n\n      {(currentVariant === 'collapse' ||\n        currentVariant === 'responsive') && (\n        <Section\n          variant={collapsedStyleType}\n          className=\"dnb-breadcrumb__collapse\"\n        >\n          <BreadcrumbMultiple\n            data={data}\n            items={items}\n            isCollapsed={isCollapsedRef.current}\n            noAnimation={noAnimation}\n          />\n        </Section>\n      )}\n    </nav>\n  )\n}\n\nBreadcrumb.Item = BreadcrumbItem\nBreadcrumb._supportsSpacingProps = true\n\nexport { BreadcrumbItem }\nexport default Breadcrumb\n"],"mappings":"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"}
+{"version":3,"file":"Breadcrumb.js","names":["React","useCallback","useEffect","useMemo","useReducer","useRef","classnames","createSkeletonClass","createSpacingClasses","Section","Button","Context","BreadcrumbItem","convertJsxToString","isTrue","validateDOMAttributes","extendPropsWithContext","BreadcrumbMultiple","useMedia","useTheme","defaultProps","skeleton","navText","goBackText","homeText","backToText","isCollapsed","styleType","collapsedStyleType","spacing","Breadcrumb","localProps","_context$translation","_useTheme","context","useContext","allProps","translation","className","children","items","variant","onClick","overrideIsCollapsed","noAnimation","data","href","props","_objectWithoutProperties","_excluded","skeletonClasses","spacingClasses","forceUpdate","isCollapsedRef","isLarge","current","onClickHandler","currentVariant","innerSpace","overrideSbankenSectionColor","isSbanken","createElement","_extends","style_type","text","icon","icon_position","Fragment","undefined","backgroundColor","Item","_supportsSpacingProps"],"sources":["../../../../src/components/breadcrumb/Breadcrumb.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useEffect,\n  useMemo,\n  useReducer,\n  useRef,\n} from 'react'\nimport classnames from 'classnames'\n\n// Components\nimport { createSkeletonClass } from '../skeleton/SkeletonHelper'\nimport { createSpacingClasses } from '../space/SpacingHelper'\nimport Section, {\n  SectionSpacing,\n  SectionStyleTypes,\n  SectionVariants,\n} from '../section/Section'\nimport Button from '../button/Button'\n\n// Shared\nimport Context from '../../shared/Context'\nimport type { SpacingProps } from '../../shared/types'\nimport type { SkeletonShow } from '../skeleton/Skeleton'\n\n// Internal\nimport BreadcrumbItem, { BreadcrumbItemProps } from './BreadcrumbItem'\nimport {\n  convertJsxToString,\n  isTrue,\n  validateDOMAttributes,\n  extendPropsWithContext,\n} from '../../shared/component-helper'\nimport { BreadcrumbMultiple } from './BreadcrumbMultiple'\nimport { useMedia, useTheme } from '../../shared'\n\nexport type BreadcrumbProps = {\n  /**\n   * Custom className on the component root\n   * Default: null\n   */\n  className?: string\n\n  /**\n   * Skeleton should be applied when loading content\n   * Default: null\n   */\n  skeleton?: SkeletonShow\n\n  /**\n   * Pass in a list of your pages as objects of breadcrumbitem to render them as breadcrumbitems.\n   * Default: null\n   */\n  data?: Array<BreadcrumbItemProps>\n\n  /**\n   * The content of the component. Can be used instead of prop \"data\".\n   * Default: null\n   */\n  children?:\n    | React.ReactElement<BreadcrumbItemProps>\n    | Array<React.ReactElement<BreadcrumbItemProps>>\n\n  /**\n   * The variant of the component.\n   * Default: When children and data is not defined, it defaults to \"single\". \"responsive\" if they are defined.\n   */\n  variant?: 'responsive' | 'single' | 'multiple' | 'collapse'\n\n  /**\n   * Handle the click event on 'single'/'collapse'\n   * Default: null\n   */\n  onClick?: React.MouseEventHandler<HTMLButtonElement>\n\n  /**\n   * For variant 'single', use href (or onClick) to set href when clicking \"Back\"\n   * Default: null\n   */\n  href?: string\n\n  /**\n   * Every <nav> on a page needs an unique aria-label text\n   * Default: Page hierarchy\n   */\n  navText?: React.ReactNode\n\n  /**\n   * Add custom 'Back' text for variant 'single'\n   * Default: 'Back' or defined by Context translation\n   */\n  goBackText?: React.ReactNode\n\n  /**\n   * Add custom 'Home' text\n   * Default: 'Home' or defined by Context translation\n   */\n  homeText?: React.ReactNode\n\n  /**\n   * Add custom 'Back to...' text, for variant collapse\n   * Default 'Back to...' or defined by Context translation\n   */\n  backToText?: React.ReactNode\n\n  /**\n   * If variant='collapse', you can override isCollapsed for the collapsed content by updating this value.\n   * Default: null\n   */\n  isCollapsed?: boolean\n\n  /**\n   * Use one of the Section component style types (style_type)\n   * Default: transparent\n   */\n  styleType?: SectionStyleTypes\n\n  /**\n   * Use one of the Section component variants\n   * Default: info\n   */\n  collapsedStyleType?: SectionVariants\n\n  /**\n   * Include spacing properties from the Section component in breadcrumb. If only `true` is given, the spacing will be `small`.\n   * Default: false\n   */\n  spacing?: SectionSpacing\n\n  /**\n   * Will disable the height animation\n   * Default: false\n   */\n  noAnimation?: boolean\n}\n\nexport const defaultProps = {\n  skeleton: false,\n  navText: 'Back',\n  goBackText: 'Back',\n  homeText: 'Home',\n  backToText: 'Back to...',\n  isCollapsed: true,\n  styleType: 'transparent',\n  collapsedStyleType: 'info',\n  spacing: false,\n}\n\nconst Breadcrumb = (localProps: BreadcrumbProps & SpacingProps) => {\n  // Every component should have a context\n  const context = React.useContext(Context)\n\n  // Extract additional props from global context\n  const allProps = extendPropsWithContext(\n    localProps,\n    defaultProps,\n    context?.translation?.Breadcrumb,\n    context?.Breadcrumb,\n    { skeleton: context?.skeleton }\n  )\n\n  const {\n    className,\n    skeleton,\n    children: items,\n    variant,\n    onClick,\n    navText, // has a translation in context\n    goBackText, // has a translation in context\n    homeText, // eslint-disable-line\n    backToText, // has a translation in context\n    styleType,\n    collapsedStyleType,\n    isCollapsed: overrideIsCollapsed,\n    spacing,\n    noAnimation,\n    data,\n    href,\n    ...props\n  } = allProps\n  const skeletonClasses = createSkeletonClass('font', skeleton, context)\n  const spacingClasses = createSpacingClasses(props)\n\n  const [, forceUpdate] = useReducer(() => ({}), {})\n\n  const isCollapsedRef = useRef(overrideIsCollapsed)\n\n  const { isLarge } = useMedia()\n\n  useEffect(() => {\n    if (overrideIsCollapsed !== isCollapsedRef.current) {\n      isCollapsedRef.current = overrideIsCollapsed\n      forceUpdate()\n    }\n  }, [overrideIsCollapsed])\n\n  // Auto-collapse breadcrumbs if going from small screen to large screen.\n  useEffect(() => {\n    if (isLarge && overrideIsCollapsed !== false) {\n      isCollapsedRef.current = true\n      forceUpdate()\n    }\n  }, [isLarge, overrideIsCollapsed])\n\n  const onClickHandler = useCallback(() => {\n    isCollapsedRef.current = !isCollapsedRef.current\n    forceUpdate()\n  }, [])\n\n  const currentVariant = useMemo(() => {\n    if (!variant) {\n      if (items || data) {\n        return 'responsive'\n      } else {\n        return 'single'\n      }\n    }\n\n    return variant\n  }, [data, items, variant])\n\n  validateDOMAttributes(allProps, props)\n\n  const innerSpace = isTrue(spacing) ? 'small' : spacing\n\n  const overrideSbankenSectionColor =\n    useTheme()?.isSbanken && collapsedStyleType === 'info'\n  return (\n    <nav\n      aria-label={convertJsxToString(navText)}\n      className={classnames(\n        'dnb-breadcrumb',\n        `dnb-breadcrumb--variant-${currentVariant}`,\n        skeletonClasses,\n        spacingClasses,\n        className\n      )}\n      {...props}\n    >\n      <Section\n        className=\"dnb-breadcrumb__bar\"\n        style_type={styleType || 'transparent'}\n        innerSpace={innerSpace}\n      >\n        {currentVariant === 'single' ? (\n          <Button\n            text={goBackText}\n            variant=\"tertiary\"\n            icon=\"chevron_left\"\n            icon_position=\"left\"\n            onClick={onClick}\n            href={href}\n          />\n        ) : (\n          <>\n            {currentVariant !== 'multiple' && (\n              <Button\n                className=\"dnb-breadcrumb__toggle\"\n                text={backToText}\n                variant=\"tertiary\"\n                icon=\"chevron_left\"\n                icon_position=\"left\"\n                onClick={onClick ?? onClickHandler}\n                aria-expanded={!isCollapsedRef.current}\n              />\n            )}\n\n            {currentVariant !== 'collapse' && (\n              <BreadcrumbMultiple\n                data={data}\n                items={items}\n                isCollapsed={false}\n                noAnimation={noAnimation}\n              />\n            )}\n          </>\n        )}\n      </Section>\n\n      {(currentVariant === 'collapse' ||\n        currentVariant === 'responsive') && (\n        <Section\n          variant={\n            overrideSbankenSectionColor ? undefined : collapsedStyleType\n          }\n          className=\"dnb-breadcrumb__collapse\"\n          backgroundColor={\n            overrideSbankenSectionColor\n              ? 'var(--sb-color-gray-light-2)'\n              : undefined\n          }\n        >\n          <BreadcrumbMultiple\n            data={data}\n            items={items}\n            isCollapsed={isCollapsedRef.current}\n            noAnimation={noAnimation}\n          />\n        </Section>\n      )}\n    </nav>\n  )\n}\n\nBreadcrumb.Item = BreadcrumbItem\nBreadcrumb._supportsSpacingProps = true\n\nexport { BreadcrumbItem }\nexport default Breadcrumb\n"],"mappings":"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"}

package/components/button/Button.d.ts

@@ -97,10 +97,6 @@ export type ButtonProps = {
    */
   globalStatus?: GlobalStatusConfigObject;
   id?: string;
-  /**
-   * Any extra modifying class.
-   */
-  class?: string;
   /**
    * If you want the button to behave as a link. Use with caution! A link should normally visually be a link and not a button.
    */

package/components/button/Button.js

@@ -4,7 +4,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 var _span, _span2, _span3;
-const _excluded = ["class", "className", "variant", "size", "title", "custom_content", "tooltip", "status", "status_state", "status_props", "status_no_animation", "globalStatus", "id", "disabled", "text", "icon", "icon_position", "icon_size", "wrap", "bounding", "stretch", "skeleton", "element", "inner_ref", "innerRef"];
+const _excluded = ["className", "variant", "size", "title", "custom_content", "tooltip", "status", "status_state", "status_props", "status_no_animation", "globalStatus", "id", "disabled", "text", "icon", "icon_position", "icon_size", "wrap", "bounding", "stretch", "skeleton", "element", "inner_ref", "innerRef"];
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import React from 'react';
@@ -59,7 +59,6 @@ export default class Button extends React.PureComponent {
       skeleton: (_this$context = this.context) === null || _this$context === void 0 ? void 0 : _this$context.skeleton
     }, pickFormElementProps((_this$context2 = this.context) === null || _this$context2 === void 0 ? void 0 : _this$context2.FormRow), pickFormElementProps((_this$context3 = this.context) === null || _this$context3 === void 0 ? void 0 : _this$context3.formElement), this.context.Button);
     const {
-        class: class_name,
         className,
         variant,
         size,
@@ -128,7 +127,7 @@ export default class Button extends React.PureComponent {
         icon = launch;
       }
     }
-    const classes = classnames(`dnb-button dnb-button--${usedVariant || 'primary'}`, (text || content || custom_content) && 'dnb-button--has-text', createSkeletonClass(variant === 'tertiary' ? 'font' : 'shape', skeleton, this.context), createSpacingClasses(props), class_name, className, (props.href || props.to) && '', icon && `dnb-button--icon-position-${icon_position} dnb-button--has-icon` + (iconSize ? ` dnb-button--icon-size-${iconSize}` : ""), usedSize && usedSize !== 'default' && `dnb-button--size-${usedSize}`, ((_this$context4 = this.context) === null || _this$context4 === void 0 ? void 0 : (_this$context4$theme = _this$context4.theme) === null || _this$context4$theme === void 0 ? void 0 : _this$context4$theme.darkBackground) && `dnb-button--on-dark-background`, isTrue(stretch) && 'dnb-button--stretch', wrap && 'dnb-button--wrap', status && `dnb-button__status--${status_state}`, Element === Anchor && 'dnb-anchor--no-style');
+    const classes = classnames(`dnb-button dnb-button--${usedVariant || 'primary'}`, (text || content || custom_content) && 'dnb-button--has-text', createSkeletonClass(variant === 'tertiary' ? 'font' : 'shape', skeleton, this.context), createSpacingClasses(props), className, (props.href || props.to) && '', icon && `dnb-button--icon-position-${icon_position} dnb-button--has-icon` + (iconSize ? ` dnb-button--icon-size-${iconSize}` : ""), usedSize && usedSize !== 'default' && `dnb-button--size-${usedSize}`, ((_this$context4 = this.context) === null || _this$context4 === void 0 ? void 0 : (_this$context4$theme = _this$context4.theme) === null || _this$context4$theme === void 0 ? void 0 : _this$context4$theme.darkBackground) && `dnb-button--on-dark-background`, isTrue(stretch) && 'dnb-button--stretch', wrap && 'dnb-button--wrap', status && `dnb-button__status--${status_state}`, Element === Anchor && 'dnb-anchor--no-style');
     const params = _objectSpread({
       className: classes,
       title,
@@ -189,7 +188,6 @@ process.env.NODE_ENV !== "production" ? Button.propTypes = _objectSpread(_object
     message: PropTypes.oneOfType([PropTypes.string, PropTypes.node])
   }),
   id: PropTypes.string,
-  class: PropTypes.string,
   href: PropTypes.string,
   target: PropTypes.string,
   rel: PropTypes.string,
@@ -222,7 +220,6 @@ Button.defaultProps = {
   rel: null,
   to: null,
   id: null,
-  class: null,
   custom_content: null,
   wrap: null,
   bounding: null,

package/components/button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","names":["React","PropTypes","classnames","Context","warn","makeUniqueId","isTrue","extendPropsWithContextInClassComponent","validateDOMAttributes","processChildren","getStatusState","dispatchCustomElementEvent","spacingPropTypes","createSpacingClasses","skeletonDOMAttributes","createSkeletonClass","pickFormElementProps","IconPrimary","FormStatus","Anchor","pickIcon","opensNewTab","launch","Tooltip","buttonVariantPropType","variant","oneOf","Button","PureComponent","getContent","props","constructor","_defineProperty","event","afterContent","isValidElement","setState","_id","id","status","tooltip","_ref","createRef","state","componentDidMount","innerRef","current","inner_ref","render","_this$context","_this$context2","_this$context3","_this$context4","_this$context4$theme","defaultProps","skeleton","context","FormRow","formElement","class","class_name","className","size","title","custom_content","status_state","status_props","status_no_animation","globalStatus","disabled","text","_text","icon","_icon","icon_position","icon_size","wrap","bounding","stretch","element","attributes","_objectWithoutProperties","_excluded","showStatus","usedVariant","usedSize","iconSize","content","isIconOnly","Boolean","Element","href","to","omitClass","target","classes","theme","darkBackground","params","_objectSpread","on_click","onClick","onClickHandler","type","undefined","createElement","Fragment","_extends","ref","Content","show","label","text_id","no_animation","targetElement","process","env","NODE_ENV","propTypes","oneOfType","string","node","func","number","bool","object","shape","message","rel","children","_span","key","_span2","_span3","array","_formElement","_supportsSpacingProps"],"sources":["../../../../src/components/button/Button.js"],"sourcesContent":["/**\n * Web Button Component\n *\n * This is a legacy component.\n * For refferencing while developing new features, please use a Functional component.\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport classnames from 'classnames'\nimport Context from '../../shared/Context'\nimport {\n  warn,\n  makeUniqueId,\n  isTrue,\n  extendPropsWithContextInClassComponent,\n  validateDOMAttributes,\n  processChildren,\n  getStatusState,\n  dispatchCustomElementEvent,\n} from '../../shared/component-helper'\nimport {\n  spacingPropTypes,\n  createSpacingClasses,\n} from '../space/SpacingHelper'\nimport {\n  skeletonDOMAttributes,\n  createSkeletonClass,\n} from '../skeleton/SkeletonHelper'\nimport { pickFormElementProps } from '../../shared/helpers/filterValidProps'\nimport IconPrimary from '../icon-primary/IconPrimary'\nimport FormStatus from '../form-status/FormStatus'\nimport Anchor, { pickIcon, opensNewTab } from '../anchor/Anchor'\nimport { launch } from '../../icons'\nimport Tooltip from '../tooltip/Tooltip'\n\nexport const buttonVariantPropType = {\n  variant: PropTypes.oneOf([\n    'primary',\n    'secondary',\n    'tertiary',\n    'signal',\n\n    /**\n     * For internal use only (as of now)\n     */\n    'unstyled',\n  ]),\n}\n\n/**\n * The button component should be used as the call-to-action in a form, or as a user interaction mechanism. Generally speaking, a button should not be used when a link would do the trick. Exceptions are made at times when it is used as a navigation element in the action-nav element.\n */\nexport default class Button extends React.PureComponent {\n  static contextType = Context\n\n  static getContent(props) {\n    return processChildren(props)\n  }\n\n  constructor(props) {\n    super(props)\n\n    this._id =\n      props.id || ((props.status || props.tooltip) && makeUniqueId()) // cause we need an id anyway\n    this._ref = React.createRef()\n\n    this.state = { afterContent: null }\n  }\n\n  componentDidMount() {\n    if (this.props.innerRef) {\n      typeof this.props.innerRef === 'function'\n        ? this.props.innerRef(this._ref.current)\n        : (this.props.innerRef.current = this._ref.current)\n    }\n    if (this.props.inner_ref) {\n      typeof this.props.innerRef === 'function'\n        ? this.props.inner_ref(this._ref.current)\n        : (this.props.inner_ref.current = this._ref.current)\n    }\n  }\n\n  onClickHandler = (event) => {\n    const afterContent = dispatchCustomElementEvent(this, 'on_click', {\n      event,\n    })\n    if (afterContent && React.isValidElement(afterContent)) {\n      this.setState({\n        afterContent,\n      })\n    }\n  }\n\n  render() {\n    // use only the props from context, who are available here anyway\n    const props = extendPropsWithContextInClassComponent(\n      this.props,\n      Button.defaultProps,\n      { skeleton: this.context?.skeleton },\n      // Deprecated – can be removed in v11\n      pickFormElementProps(this.context?.FormRow),\n      pickFormElementProps(this.context?.formElement),\n      this.context.Button\n    )\n\n    const {\n      class: class_name,\n      className,\n      variant,\n      size,\n      title,\n      custom_content,\n      tooltip,\n      status,\n      status_state,\n      status_props,\n      status_no_animation,\n      globalStatus,\n      id, // eslint-disable-line\n      disabled,\n      text: _text, // eslint-disable-line\n      icon: _icon, // eslint-disable-line\n      icon_position,\n      icon_size,\n      wrap,\n      bounding, // eslint-disable-line\n      stretch,\n      skeleton,\n      element,\n      inner_ref, // eslint-disable-line\n      innerRef, // eslint-disable-line\n      ...attributes\n    } = props\n\n    const showStatus = getStatusState(status)\n\n    let { text, icon } = props\n    let usedVariant = variant\n    let usedSize = size\n    let iconSize = icon_size\n    const content = Button.getContent(this.props)\n\n    if (\n      variant === 'tertiary' &&\n      (text || content) &&\n      !icon &&\n      icon !== false\n    ) {\n      warn(\n        `Icon required: A Tertiary Button requires an icon to be WCAG compliant in most cases, because variant tertiary has no underline.\n(Override this warning using icon={false}, or consider using one of the other variants)`\n      )\n    }\n\n    // if only has Icon, then resize it and define it as secondary\n    const isIconOnly = Boolean(!text && !content && icon)\n    if (isIconOnly) {\n      if (!usedVariant) {\n        usedVariant = 'secondary'\n      }\n      if (!iconSize && (usedSize === 'default' || usedSize === 'large')) {\n        iconSize = 'medium'\n      }\n      if (!usedSize) {\n        usedSize = 'medium'\n      }\n    } else if (content) {\n      if (!usedVariant) {\n        usedVariant = 'primary'\n      }\n      if (!usedSize) {\n        usedSize = 'default'\n      }\n    }\n    if (!iconSize && variant === 'tertiary' && icon_position === 'top') {\n      iconSize = 'medium'\n    }\n\n    const Element = element\n      ? element\n      : props.href || props.to\n      ? Anchor\n      : 'button'\n    if (Element === Anchor) {\n      attributes.omitClass = true\n      if (opensNewTab(props.target, props.href) && !icon) {\n        icon = launch\n      }\n    }\n\n    const classes = classnames(\n      'dnb-button',\n      `dnb-button--${usedVariant || 'primary'}`,\n      usedSize && usedSize !== 'default' && `dnb-button--size-${usedSize}`,\n      this.context?.theme?.darkBackground &&\n        `dnb-button--on-dark-background`,\n      icon && `dnb-button--icon-position-${icon_position}`,\n      isTrue(stretch) && 'dnb-button--stretch',\n      icon && iconSize && `dnb-button--icon-size-${iconSize}`,\n      (text || content || custom_content) && 'dnb-button--has-text',\n      icon && 'dnb-button--has-icon',\n      wrap && 'dnb-button--wrap',\n      status && `dnb-button__status--${status_state}`,\n      createSkeletonClass(\n        variant === 'tertiary' ? 'font' : 'shape',\n        skeleton,\n        this.context\n      ),\n      createSpacingClasses(props),\n      class_name,\n      className,\n      props.href || props.to ? '' : null, // dnb-anchor--no-underline dnb-anchor--no-hover\n      Element === Anchor && 'dnb-anchor--no-style'\n    )\n\n    const params = {\n      className: classes,\n      title,\n      id: this._id,\n      disabled: isTrue(disabled),\n      ...attributes,\n    }\n\n    if (this.props.on_click || this.props.onClick) {\n      params.onClick = this.onClickHandler\n    }\n\n    if (Element !== Anchor && !params.type) {\n      params.type = params.type === '' ? undefined : 'button'\n    }\n\n    skeletonDOMAttributes(params, skeleton, this.context)\n\n    // also used for code markup simulation\n    validateDOMAttributes(this.props, params)\n\n    return (\n      <>\n        <Element ref={this._ref} {...params}>\n          <Content\n            {...this.props}\n            icon={icon}\n            icon_size={iconSize}\n            content={text || content}\n            custom_content={custom_content}\n            isIconOnly={isIconOnly}\n            skeleton={isTrue(skeleton)}\n          />\n        </Element>\n\n        {this.state.afterContent}\n\n        <FormStatus\n          show={showStatus}\n          id={this._id + '-form-status'}\n          globalStatus={globalStatus}\n          label={text}\n          text={status}\n          state={status_state}\n          text_id={this._id + '-status'} // used for \"aria-describedby\"\n          no_animation={status_no_animation}\n          skeleton={skeleton}\n          {...status_props}\n        />\n\n        {tooltip && this._ref && (\n          <Tooltip\n            id={this._id + '-tooltip'}\n            targetElement={this._ref}\n            tooltip={tooltip}\n          />\n        )}\n      </>\n    )\n  }\n}\n\nButton.propTypes = {\n  text: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n  type: PropTypes.string,\n  title: PropTypes.node,\n  variant: buttonVariantPropType.variant,\n  size: PropTypes.oneOf(['default', 'small', 'medium', 'large']),\n  icon: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.node,\n    PropTypes.func,\n  ]),\n  icon_position: PropTypes.oneOf(['left', 'right', 'top']),\n  icon_size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n  tooltip: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.func,\n    PropTypes.node,\n  ]),\n  status: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.bool,\n    PropTypes.func,\n    PropTypes.node,\n  ]),\n  status_state: PropTypes.string,\n  status_props: PropTypes.object,\n  status_no_animation: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.bool,\n  ]),\n  globalStatus: PropTypes.shape({\n    id: PropTypes.string,\n    message: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n  }),\n  id: PropTypes.string,\n  class: PropTypes.string,\n  href: PropTypes.string,\n  target: PropTypes.string,\n  rel: PropTypes.string,\n  to: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.object,\n    PropTypes.func,\n  ]),\n  custom_content: PropTypes.node,\n  wrap: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  bounding: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  stretch: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  skeleton: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  disabled: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  inner_ref: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),\n\n  className: PropTypes.string,\n  innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),\n  children: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.func,\n    PropTypes.node,\n  ]),\n  element: PropTypes.oneOfType([\n    PropTypes.func,\n    PropTypes.object,\n    PropTypes.node,\n  ]),\n\n  ...spacingPropTypes,\n\n  on_click: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),\n}\n\nButton.defaultProps = {\n  type: null, // set the type because of the anchor/href situation – can be made more smart in future\n  text: null,\n  variant: null,\n  size: null,\n  title: null,\n  icon: null,\n  icon_position: 'right',\n  icon_size: null,\n  href: null,\n  target: null,\n  rel: null,\n  to: null,\n  id: null,\n  class: null,\n  custom_content: null,\n  wrap: null,\n  bounding: null,\n  stretch: null,\n  skeleton: null,\n  disabled: null,\n  tooltip: null,\n  status: null,\n  status_state: 'error',\n  status_props: null,\n  status_no_animation: null,\n  globalStatus: null,\n  inner_ref: null,\n\n  className: null,\n  innerRef: null,\n  children: null,\n  element: null,\n\n  on_click: null,\n}\n\nfunction Content({\n  title,\n  content,\n  custom_content,\n  icon,\n  icon_size,\n  bounding,\n  skeleton,\n  isIconOnly,\n}) {\n  return (\n    <>\n      {isTrue(bounding) && (\n        <span key=\"button-bounding\" className=\"dnb-button__bounding\" />\n      )}\n\n      {custom_content && (\n        <React.Fragment key=\"button-custom-content\">\n          {custom_content}\n        </React.Fragment>\n      )}\n\n      {content && (\n        <>\n          <span\n            key=\"button-alignment\"\n            className=\"dnb-button__alignment\"\n            aria-hidden\n          >\n            &zwnj;\n          </span>\n          <span\n            key=\"button-text\"\n            className=\"dnb-button__text dnb-skeleton--show-font\"\n          >\n            {content}\n          </span>\n        </>\n      )}\n\n      {\n        // on empty text, use a zero-width non-joiner\n        // so the icon button gets vertical aligned\n        // we need the dnb-button__text for alignment\n        !content && icon && (\n          <span\n            key=\"button-alignment\"\n            className=\"dnb-button__alignment\"\n            aria-hidden\n          >\n            &zwnj;\n          </span>\n        )\n      }\n\n      {icon &&\n        (pickIcon(icon, 'dnb-button__icon') || (\n          <IconPrimary\n            key=\"button-icon\"\n            className=\"dnb-button__icon\"\n            icon={icon}\n            size={icon_size}\n            aria-hidden={isIconOnly && !title ? null : true}\n            skeleton={skeleton}\n          />\n        ))}\n    </>\n  )\n}\n\nContent.propTypes = {\n  title: PropTypes.node,\n  custom_content: PropTypes.node,\n  content: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.array,\n    PropTypes.node,\n  ]),\n  icon: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.node,\n    PropTypes.func,\n  ]),\n  icon_size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n  bounding: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  skeleton: PropTypes.bool,\n  isIconOnly: PropTypes.bool,\n}\n\nContent.defaultProps = {\n  custom_content: null,\n  title: null,\n  content: null,\n  icon: null,\n  icon_size: 'default',\n  bounding: null,\n  skeleton: null,\n  isIconOnly: null,\n}\n\nButton._formElement = true\nButton._supportsSpacingProps = true\n"],"mappings":"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"}
+{"version":3,"file":"Button.js","names":["React","PropTypes","classnames","Context","warn","makeUniqueId","isTrue","extendPropsWithContextInClassComponent","validateDOMAttributes","processChildren","getStatusState","dispatchCustomElementEvent","spacingPropTypes","createSpacingClasses","skeletonDOMAttributes","createSkeletonClass","pickFormElementProps","IconPrimary","FormStatus","Anchor","pickIcon","opensNewTab","launch","Tooltip","buttonVariantPropType","variant","oneOf","Button","PureComponent","getContent","props","constructor","_defineProperty","event","afterContent","isValidElement","setState","_id","id","status","tooltip","_ref","createRef","state","componentDidMount","innerRef","current","inner_ref","render","_this$context","_this$context2","_this$context3","_this$context4","_this$context4$theme","defaultProps","skeleton","context","FormRow","formElement","className","size","title","custom_content","status_state","status_props","status_no_animation","globalStatus","disabled","text","_text","icon","_icon","icon_position","icon_size","wrap","bounding","stretch","element","attributes","_objectWithoutProperties","_excluded","showStatus","usedVariant","usedSize","iconSize","content","isIconOnly","Boolean","Element","href","to","omitClass","target","classes","theme","darkBackground","params","_objectSpread","on_click","onClick","onClickHandler","type","undefined","createElement","Fragment","_extends","ref","Content","show","label","text_id","no_animation","targetElement","process","env","NODE_ENV","propTypes","oneOfType","string","node","func","number","bool","object","shape","message","rel","children","_span","key","_span2","_span3","array","_formElement","_supportsSpacingProps"],"sources":["../../../../src/components/button/Button.js"],"sourcesContent":["/**\n * Web Button Component\n *\n * This is a legacy component.\n * For refferencing while developing new features, please use a Functional component.\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport classnames from 'classnames'\nimport Context from '../../shared/Context'\nimport {\n  warn,\n  makeUniqueId,\n  isTrue,\n  extendPropsWithContextInClassComponent,\n  validateDOMAttributes,\n  processChildren,\n  getStatusState,\n  dispatchCustomElementEvent,\n} from '../../shared/component-helper'\nimport {\n  spacingPropTypes,\n  createSpacingClasses,\n} from '../space/SpacingHelper'\nimport {\n  skeletonDOMAttributes,\n  createSkeletonClass,\n} from '../skeleton/SkeletonHelper'\nimport { pickFormElementProps } from '../../shared/helpers/filterValidProps'\nimport IconPrimary from '../icon-primary/IconPrimary'\nimport FormStatus from '../form-status/FormStatus'\nimport Anchor, { pickIcon, opensNewTab } from '../anchor/Anchor'\nimport { launch } from '../../icons'\nimport Tooltip from '../tooltip/Tooltip'\n\nexport const buttonVariantPropType = {\n  variant: PropTypes.oneOf([\n    'primary',\n    'secondary',\n    'tertiary',\n    'signal',\n\n    /**\n     * For internal use only (as of now)\n     */\n    'unstyled',\n  ]),\n}\n\n/**\n * The button component should be used as the call-to-action in a form, or as a user interaction mechanism. Generally speaking, a button should not be used when a link would do the trick. Exceptions are made at times when it is used as a navigation element in the action-nav element.\n */\nexport default class Button extends React.PureComponent {\n  static contextType = Context\n\n  static getContent(props) {\n    return processChildren(props)\n  }\n\n  constructor(props) {\n    super(props)\n\n    this._id =\n      props.id || ((props.status || props.tooltip) && makeUniqueId()) // cause we need an id anyway\n    this._ref = React.createRef()\n\n    this.state = { afterContent: null }\n  }\n\n  componentDidMount() {\n    if (this.props.innerRef) {\n      typeof this.props.innerRef === 'function'\n        ? this.props.innerRef(this._ref.current)\n        : (this.props.innerRef.current = this._ref.current)\n    }\n    if (this.props.inner_ref) {\n      typeof this.props.innerRef === 'function'\n        ? this.props.inner_ref(this._ref.current)\n        : (this.props.inner_ref.current = this._ref.current)\n    }\n  }\n\n  onClickHandler = (event) => {\n    const afterContent = dispatchCustomElementEvent(this, 'on_click', {\n      event,\n    })\n    if (afterContent && React.isValidElement(afterContent)) {\n      this.setState({\n        afterContent,\n      })\n    }\n  }\n\n  render() {\n    // use only the props from context, who are available here anyway\n    const props = extendPropsWithContextInClassComponent(\n      this.props,\n      Button.defaultProps,\n      { skeleton: this.context?.skeleton },\n      // Deprecated – can be removed in v11\n      pickFormElementProps(this.context?.FormRow),\n      pickFormElementProps(this.context?.formElement),\n      this.context.Button\n    )\n\n    const {\n      className,\n      variant,\n      size,\n      title,\n      custom_content,\n      tooltip,\n      status,\n      status_state,\n      status_props,\n      status_no_animation,\n      globalStatus,\n      id, // eslint-disable-line\n      disabled,\n      text: _text, // eslint-disable-line\n      icon: _icon, // eslint-disable-line\n      icon_position,\n      icon_size,\n      wrap,\n      bounding, // eslint-disable-line\n      stretch,\n      skeleton,\n      element,\n      inner_ref, // eslint-disable-line\n      innerRef, // eslint-disable-line\n      ...attributes\n    } = props\n\n    const showStatus = getStatusState(status)\n\n    let { text, icon } = props\n    let usedVariant = variant\n    let usedSize = size\n    let iconSize = icon_size\n    const content = Button.getContent(this.props)\n\n    if (\n      variant === 'tertiary' &&\n      (text || content) &&\n      !icon &&\n      icon !== false\n    ) {\n      warn(\n        `Icon required: A Tertiary Button requires an icon to be WCAG compliant in most cases, because variant tertiary has no underline.\n(Override this warning using icon={false}, or consider using one of the other variants)`\n      )\n    }\n\n    // if only has Icon, then resize it and define it as secondary\n    const isIconOnly = Boolean(!text && !content && icon)\n    if (isIconOnly) {\n      if (!usedVariant) {\n        usedVariant = 'secondary'\n      }\n      if (!iconSize && (usedSize === 'default' || usedSize === 'large')) {\n        iconSize = 'medium'\n      }\n      if (!usedSize) {\n        usedSize = 'medium'\n      }\n    } else if (content) {\n      if (!usedVariant) {\n        usedVariant = 'primary'\n      }\n      if (!usedSize) {\n        usedSize = 'default'\n      }\n    }\n    if (!iconSize && variant === 'tertiary' && icon_position === 'top') {\n      iconSize = 'medium'\n    }\n\n    const Element = element\n      ? element\n      : props.href || props.to\n      ? Anchor\n      : 'button'\n    if (Element === Anchor) {\n      attributes.omitClass = true\n      if (opensNewTab(props.target, props.href) && !icon) {\n        icon = launch\n      }\n    }\n\n    const classes = classnames(\n      'dnb-button',\n      `dnb-button--${usedVariant || 'primary'}`,\n      usedSize && usedSize !== 'default' && `dnb-button--size-${usedSize}`,\n      this.context?.theme?.darkBackground &&\n        `dnb-button--on-dark-background`,\n      icon && `dnb-button--icon-position-${icon_position}`,\n      isTrue(stretch) && 'dnb-button--stretch',\n      icon && iconSize && `dnb-button--icon-size-${iconSize}`,\n      (text || content || custom_content) && 'dnb-button--has-text',\n      icon && 'dnb-button--has-icon',\n      wrap && 'dnb-button--wrap',\n      status && `dnb-button__status--${status_state}`,\n      createSkeletonClass(\n        variant === 'tertiary' ? 'font' : 'shape',\n        skeleton,\n        this.context\n      ),\n      createSpacingClasses(props),\n      className,\n      props.href || props.to ? '' : null, // dnb-anchor--no-underline dnb-anchor--no-hover\n      Element === Anchor && 'dnb-anchor--no-style'\n    )\n\n    const params = {\n      className: classes,\n      title,\n      id: this._id,\n      disabled: isTrue(disabled),\n      ...attributes,\n    }\n\n    if (this.props.on_click || this.props.onClick) {\n      params.onClick = this.onClickHandler\n    }\n\n    if (Element !== Anchor && !params.type) {\n      params.type = params.type === '' ? undefined : 'button'\n    }\n\n    skeletonDOMAttributes(params, skeleton, this.context)\n\n    // also used for code markup simulation\n    validateDOMAttributes(this.props, params)\n\n    return (\n      <>\n        <Element ref={this._ref} {...params}>\n          <Content\n            {...this.props}\n            icon={icon}\n            icon_size={iconSize}\n            content={text || content}\n            custom_content={custom_content}\n            isIconOnly={isIconOnly}\n            skeleton={isTrue(skeleton)}\n          />\n        </Element>\n\n        {this.state.afterContent}\n\n        <FormStatus\n          show={showStatus}\n          id={this._id + '-form-status'}\n          globalStatus={globalStatus}\n          label={text}\n          text={status}\n          state={status_state}\n          text_id={this._id + '-status'} // used for \"aria-describedby\"\n          no_animation={status_no_animation}\n          skeleton={skeleton}\n          {...status_props}\n        />\n\n        {tooltip && this._ref && (\n          <Tooltip\n            id={this._id + '-tooltip'}\n            targetElement={this._ref}\n            tooltip={tooltip}\n          />\n        )}\n      </>\n    )\n  }\n}\n\nButton.propTypes = {\n  text: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n  type: PropTypes.string,\n  title: PropTypes.node,\n  variant: buttonVariantPropType.variant,\n  size: PropTypes.oneOf(['default', 'small', 'medium', 'large']),\n  icon: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.node,\n    PropTypes.func,\n  ]),\n  icon_position: PropTypes.oneOf(['left', 'right', 'top']),\n  icon_size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n  tooltip: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.func,\n    PropTypes.node,\n  ]),\n  status: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.bool,\n    PropTypes.func,\n    PropTypes.node,\n  ]),\n  status_state: PropTypes.string,\n  status_props: PropTypes.object,\n  status_no_animation: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.bool,\n  ]),\n  globalStatus: PropTypes.shape({\n    id: PropTypes.string,\n    message: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n  }),\n  id: PropTypes.string,\n  href: PropTypes.string,\n  target: PropTypes.string,\n  rel: PropTypes.string,\n  to: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.object,\n    PropTypes.func,\n  ]),\n  custom_content: PropTypes.node,\n  wrap: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  bounding: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  stretch: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  skeleton: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  disabled: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  inner_ref: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),\n\n  className: PropTypes.string,\n  innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),\n  children: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.func,\n    PropTypes.node,\n  ]),\n  element: PropTypes.oneOfType([\n    PropTypes.func,\n    PropTypes.object,\n    PropTypes.node,\n  ]),\n\n  ...spacingPropTypes,\n\n  on_click: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),\n}\n\nButton.defaultProps = {\n  type: null, // set the type because of the anchor/href situation – can be made more smart in future\n  text: null,\n  variant: null,\n  size: null,\n  title: null,\n  icon: null,\n  icon_position: 'right',\n  icon_size: null,\n  href: null,\n  target: null,\n  rel: null,\n  to: null,\n  id: null,\n  custom_content: null,\n  wrap: null,\n  bounding: null,\n  stretch: null,\n  skeleton: null,\n  disabled: null,\n  tooltip: null,\n  status: null,\n  status_state: 'error',\n  status_props: null,\n  status_no_animation: null,\n  globalStatus: null,\n  inner_ref: null,\n\n  className: null,\n  innerRef: null,\n  children: null,\n  element: null,\n\n  on_click: null,\n}\n\nfunction Content({\n  title,\n  content,\n  custom_content,\n  icon,\n  icon_size,\n  bounding,\n  skeleton,\n  isIconOnly,\n}) {\n  return (\n    <>\n      {isTrue(bounding) && (\n        <span key=\"button-bounding\" className=\"dnb-button__bounding\" />\n      )}\n\n      {custom_content && (\n        <React.Fragment key=\"button-custom-content\">\n          {custom_content}\n        </React.Fragment>\n      )}\n\n      {content && (\n        <>\n          <span\n            key=\"button-alignment\"\n            className=\"dnb-button__alignment\"\n            aria-hidden\n          >\n            &zwnj;\n          </span>\n          <span\n            key=\"button-text\"\n            className=\"dnb-button__text dnb-skeleton--show-font\"\n          >\n            {content}\n          </span>\n        </>\n      )}\n\n      {\n        // on empty text, use a zero-width non-joiner\n        // so the icon button gets vertical aligned\n        // we need the dnb-button__text for alignment\n        !content && icon && (\n          <span\n            key=\"button-alignment\"\n            className=\"dnb-button__alignment\"\n            aria-hidden\n          >\n            &zwnj;\n          </span>\n        )\n      }\n\n      {icon &&\n        (pickIcon(icon, 'dnb-button__icon') || (\n          <IconPrimary\n            key=\"button-icon\"\n            className=\"dnb-button__icon\"\n            icon={icon}\n            size={icon_size}\n            aria-hidden={isIconOnly && !title ? null : true}\n            skeleton={skeleton}\n          />\n        ))}\n    </>\n  )\n}\n\nContent.propTypes = {\n  title: PropTypes.node,\n  custom_content: PropTypes.node,\n  content: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.array,\n    PropTypes.node,\n  ]),\n  icon: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.node,\n    PropTypes.func,\n  ]),\n  icon_size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n  bounding: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  skeleton: PropTypes.bool,\n  isIconOnly: PropTypes.bool,\n}\n\nContent.defaultProps = {\n  custom_content: null,\n  title: null,\n  content: null,\n  icon: null,\n  icon_size: 'default',\n  bounding: null,\n  skeleton: null,\n  isIconOnly: null,\n}\n\nButton._formElement = true\nButton._supportsSpacingProps = true\n"],"mappings":"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"}

package/components/card/Card.js

@@ -69,6 +69,7 @@ function Card(props) {
     direction: direction !== null && direction !== void 0 ? direction : 'vertical',
     divider: divider,
     alignSelf: alignSelf,
+    align: stack ? 'stretch' : undefined,
     wrap: !stack,
     gap: stack ? 'medium' : (gap !== null && gap !== void 0 ? gap : spacing) || false,
     rowGap: rowGap || false

package/components/card/Card.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.js","names":["React","classnames","Flex","SectionParams","combineLabelledBy","useId","Space","Card","props","className","stack","direction","gap","spacing","innerSpace","alignSelf","divider","rowGap","responsive","filled","title","children","rest","_objectWithoutProperties","_excluded","titleId","falseWhenSmall","small","medium","large","trueWhenSmall","basisSpace","top","right","bottom","left","smallSpace","_objectSpread","params","breakout","roundedCorner","outline","createElement","Item","_extends","element","Container","wrap","id","_supportsSpacingProps"],"sources":["../../../../src/components/card/Card.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport Flex from '../flex/Flex'\nimport { SectionParams, SectionProps } from '../section/Section'\nimport { combineLabelledBy } from '../../shared/component-helper'\nimport useId from '../../shared/helpers/useId'\n\nimport type { BasicProps as FlexContainerProps } from '../flex/Container'\nimport type { BasicProps as FlexItemProps } from '../flex/Item'\nimport type { SpaceTypeMedia } from '../../shared/types'\nimport type { SpaceProps } from '../Space'\nimport Space from '../Space'\n\nexport type Props = {\n  /**\n   * Define a title that appears on top of the Card\n   */\n  title?: React.ReactNode\n\n  /**\n   * Define if the Card should behave responsive. Defaults to `true`\n   */\n  responsive?: boolean\n\n  /**\n   * Define if the Card should get the same background color as the outline border\n   */\n  filled?: boolean\n} & FlexContainerProps &\n  FlexItemProps & {\n    stack?: boolean\n  } & SpaceProps &\n  Omit<React.HTMLProps<HTMLElement>, 'ref' | 'wrap' | 'size'>\n\nfunction Card(props: Props) {\n  const {\n    className,\n    stack,\n    direction,\n    gap,\n    spacing,\n    innerSpace,\n    alignSelf = 'stretch',\n    divider = 'space',\n    rowGap,\n    responsive = true,\n    filled,\n    title,\n    children,\n    ...rest\n  } = props\n\n  const titleId = useId()\n  const falseWhenSmall = { small: false, medium: true, large: true }\n  const trueWhenSmall = { small: true, medium: false, large: false }\n  const basisSpace = {\n    top: 'medium',\n    right: 'medium',\n    bottom: 'large',\n    left: 'medium',\n  }\n  const smallSpace = responsive\n    ? {\n        ...basisSpace,\n        right: 0,\n        left: 0,\n      }\n    : basisSpace\n\n  const params = SectionParams({\n    className: classnames(\n      'dnb-card',\n      className,\n      responsive && 'dnb-card--responsive',\n      filled && 'dnb-card--filled'\n    ),\n    breakout: responsive ? trueWhenSmall : false,\n    roundedCorner: responsive ? falseWhenSmall : true,\n    outline: true,\n    innerSpace:\n      innerSpace ??\n      ({\n        small: smallSpace,\n        medium: basisSpace,\n        large: basisSpace,\n      } as SpaceTypeMedia),\n    ...(rest as SectionProps),\n    'aria-labelledby': combineLabelledBy(rest, title && titleId),\n  })\n\n  return (\n    <Flex.Item alignSelf={alignSelf} element=\"section\" {...params}>\n      <Flex.Container\n        direction={direction ?? 'vertical'}\n        divider={divider}\n        alignSelf={alignSelf}\n        wrap={!stack}\n        gap={stack ? 'medium' : (gap ?? spacing) || false}\n        rowGap={rowGap || false}\n      >\n        {title && (\n          <Space id={titleId} className=\"dnb-card__title\">\n            {title}\n          </Space>\n        )}\n        {children}\n      </Flex.Container>\n    </Flex.Item>\n  )\n}\n\nCard._supportsSpacingProps = true\n\nexport default Card\n"],"mappings":"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"}
+{"version":3,"file":"Card.js","names":["React","classnames","Flex","SectionParams","combineLabelledBy","useId","Space","Card","props","className","stack","direction","gap","spacing","innerSpace","alignSelf","divider","rowGap","responsive","filled","title","children","rest","_objectWithoutProperties","_excluded","titleId","falseWhenSmall","small","medium","large","trueWhenSmall","basisSpace","top","right","bottom","left","smallSpace","_objectSpread","params","breakout","roundedCorner","outline","createElement","Item","_extends","element","Container","align","undefined","wrap","id","_supportsSpacingProps"],"sources":["../../../../src/components/card/Card.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport Flex from '../flex/Flex'\nimport { SectionParams, SectionProps } from '../section/Section'\nimport { combineLabelledBy } from '../../shared/component-helper'\nimport useId from '../../shared/helpers/useId'\n\nimport type { BasicProps as FlexContainerProps } from '../flex/Container'\nimport type { BasicProps as FlexItemProps } from '../flex/Item'\nimport type { SpaceTypeMedia } from '../../shared/types'\nimport type { SpaceProps } from '../Space'\nimport Space from '../Space'\n\nexport type Props = {\n  /**\n   * Define a title that appears on top of the Card\n   */\n  title?: React.ReactNode\n\n  /**\n   * Define if the Card should behave responsive. Defaults to `true`\n   */\n  responsive?: boolean\n\n  /**\n   * Define if the Card should get the same background color as the outline border\n   */\n  filled?: boolean\n} & FlexContainerProps &\n  FlexItemProps & {\n    stack?: boolean\n  } & SpaceProps &\n  Omit<React.HTMLProps<HTMLElement>, 'ref' | 'wrap' | 'size'>\n\nfunction Card(props: Props) {\n  const {\n    className,\n    stack,\n    direction,\n    gap,\n    spacing,\n    innerSpace,\n    alignSelf = 'stretch',\n    divider = 'space',\n    rowGap,\n    responsive = true,\n    filled,\n    title,\n    children,\n    ...rest\n  } = props\n\n  const titleId = useId()\n  const falseWhenSmall = { small: false, medium: true, large: true }\n  const trueWhenSmall = { small: true, medium: false, large: false }\n  const basisSpace = {\n    top: 'medium',\n    right: 'medium',\n    bottom: 'large',\n    left: 'medium',\n  }\n  const smallSpace = responsive\n    ? {\n        ...basisSpace,\n        right: 0,\n        left: 0,\n      }\n    : basisSpace\n\n  const params = SectionParams({\n    className: classnames(\n      'dnb-card',\n      className,\n      responsive && 'dnb-card--responsive',\n      filled && 'dnb-card--filled'\n    ),\n    breakout: responsive ? trueWhenSmall : false,\n    roundedCorner: responsive ? falseWhenSmall : true,\n    outline: true,\n    innerSpace:\n      innerSpace ??\n      ({\n        small: smallSpace,\n        medium: basisSpace,\n        large: basisSpace,\n      } as SpaceTypeMedia),\n    ...(rest as SectionProps),\n    'aria-labelledby': combineLabelledBy(rest, title && titleId),\n  })\n\n  return (\n    <Flex.Item alignSelf={alignSelf} element=\"section\" {...params}>\n      <Flex.Container\n        direction={direction ?? 'vertical'}\n        divider={divider}\n        alignSelf={alignSelf}\n        align={stack ? 'stretch' : undefined}\n        wrap={!stack}\n        gap={stack ? 'medium' : (gap ?? spacing) || false}\n        rowGap={rowGap || false}\n      >\n        {title && (\n          <Space id={titleId} className=\"dnb-card__title\">\n            {title}\n          </Space>\n        )}\n        {children}\n      </Flex.Container>\n    </Flex.Item>\n  )\n}\n\nCard._supportsSpacingProps = true\n\nexport default Card\n"],"mappings":"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"}

package/components/card/style/dnb-card.css

@@ -63,4 +63,7 @@
 }
 .dnb-card > .dnb-flex-container > .dnb-space:has(> .dnb-scroll-view) {
   width: 100%;
+}
+.dnb-card > .dnb-flex-container--align-stretch > .dnb-button {
+  align-self: flex-start;
 }

package/components/card/style/dnb-card.min.css

@@ -1 +1 @@
-.dnb-card__heading{font-size:var(--font-size-basis);font-weight:var(--font-weight-medium)}.dnb-card+.dnb-card__heading{margin-top:var(--spacing-small)}.dnb-card__title{font-size:var(--font-size-small);font-weight:var(--font-weight-medium);padding-bottom:1rem}.dnb-card:not([style*="--space-"]) .dnb-card__title{padding:1rem}.dnb-card.dnb-section{background-color:var(--background-color)}.dnb-card--filled.dnb-card.dnb-section{--background-color:var(--outline-color)}@media screen and (max-width:40em){.dnb-card--responsive.dnb-section:before{--outline:99vw 0 0 0 var(--background-color),198vw 0 0 0 var(--background-color),297vw 0 0 0 var(--background-color),396vw 0 0 0 var(--background-color),0 var(--outline-width) 0 0 var(--outline-color),99vw var(--outline-width) 0 0 var(--outline-color),0 calc(var(--outline-width)*-1) 0 0 var(--outline-color),99vw calc(var(--outline-width)*-1) 0 0 var(--outline-color),198vw var(--outline-width) 0 0 var(--outline-color),198vw calc(var(--outline-width)*-1) 0 0 var(--outline-color);left:var(--left)}.dnb-card+.dnb-card--responsive:not([class*=space__top]){background:linear-gradient(to left,var(--background-color),var(--background-color)) no-repeat 0 var(--outline-width)}.dnb-card+.dnb-card--responsive:not([class*=space__top]):before{top:var(--outline-width)}.dnb-flex-container.dnb-flex-container--divider-space .dnb-card+.dnb-card--responsive{margin-top:0}.dnb-flex-container.dnb-flex-container--divider-space .dnb-card+.dnb-card--responsive:before{top:var(--outline-width);z-index:0}}.dnb-card .dnb-flex-container:has(>.dnb-card__title+.dnb-scroll-view){align-items:stretch;flex-wrap:nowrap}.dnb-card--filled .dnb-scroll-view{clip-path:inset(0 0 0 0 round var(--rounded-corner) var(--rounded-corner) var(--rounded-corner) var(--rounded-corner))}.dnb-card>.dnb-flex-container>.dnb-space:has(>.dnb-scroll-view){width:100%}
+.dnb-card__heading{font-size:var(--font-size-basis);font-weight:var(--font-weight-medium)}.dnb-card+.dnb-card__heading{margin-top:var(--spacing-small)}.dnb-card__title{font-size:var(--font-size-small);font-weight:var(--font-weight-medium);padding-bottom:1rem}.dnb-card:not([style*="--space-"]) .dnb-card__title{padding:1rem}.dnb-card.dnb-section{background-color:var(--background-color)}.dnb-card--filled.dnb-card.dnb-section{--background-color:var(--outline-color)}@media screen and (max-width:40em){.dnb-card--responsive.dnb-section:before{--outline:99vw 0 0 0 var(--background-color),198vw 0 0 0 var(--background-color),297vw 0 0 0 var(--background-color),396vw 0 0 0 var(--background-color),0 var(--outline-width) 0 0 var(--outline-color),99vw var(--outline-width) 0 0 var(--outline-color),0 calc(var(--outline-width)*-1) 0 0 var(--outline-color),99vw calc(var(--outline-width)*-1) 0 0 var(--outline-color),198vw var(--outline-width) 0 0 var(--outline-color),198vw calc(var(--outline-width)*-1) 0 0 var(--outline-color);left:var(--left)}.dnb-card+.dnb-card--responsive:not([class*=space__top]){background:linear-gradient(to left,var(--background-color),var(--background-color)) no-repeat 0 var(--outline-width)}.dnb-card+.dnb-card--responsive:not([class*=space__top]):before{top:var(--outline-width)}.dnb-flex-container.dnb-flex-container--divider-space .dnb-card+.dnb-card--responsive{margin-top:0}.dnb-flex-container.dnb-flex-container--divider-space .dnb-card+.dnb-card--responsive:before{top:var(--outline-width);z-index:0}}.dnb-card .dnb-flex-container:has(>.dnb-card__title+.dnb-scroll-view){align-items:stretch;flex-wrap:nowrap}.dnb-card--filled .dnb-scroll-view{clip-path:inset(0 0 0 0 round var(--rounded-corner) var(--rounded-corner) var(--rounded-corner) var(--rounded-corner))}.dnb-card>.dnb-flex-container>.dnb-space:has(>.dnb-scroll-view){width:100%}.dnb-card>.dnb-flex-container--align-stretch>.dnb-button{align-self:flex-start}

package/components/card/style/dnb-card.scss

@@ -92,4 +92,8 @@
   & > .dnb-flex-container > .dnb-space:has(> .dnb-scroll-view) {
     width: 100%;
   }
+
+  & > .dnb-flex-container--align-stretch > .dnb-button {
+    align-self: flex-start;
+  }
 }

package/components/checkbox/Checkbox.js

@@ -101,7 +101,7 @@ function Checkbox(localProps) {
     }
   }, [handleChange]);
   const mainParams = {
-    className: classnames("dnb-checkbox dnb-form-component", createSkeletonClass(null, skeleton), createSpacingClasses(props), className, status && `dnb-checkbox__status--${statusState}`, size && `dnb-checkbox--${size}`, label && `dnb-checkbox--label-position-${labelPosition || 'right'}`)
+    className: classnames("dnb-checkbox dnb-form-component", createSkeletonClass(null, skeleton, context), createSpacingClasses(props), className, status && `dnb-checkbox__status--${statusState}`, size && `dnb-checkbox--${size}`, label && `dnb-checkbox--label-position-${labelPosition || 'right'}`)
   };
   const showStatus = getStatusState(status);
   const inputParams = handleInputAttributes();