@sbb-esta/lyne-elements 4.0.0-next.3 → 4.0.0-next.4

package/form-field/form-field-clear/form-field-clear.component.js

@@ -3,27 +3,27 @@ import { html as m } from "lit";
 import { customElement as c } from "lit/decorators.js";
 import { miniButtonStyle as u } from "../../button/common.js";
 import { SbbButtonBaseElement as b } from "../../core/base-elements.js";
-import { SbbLanguageController as d } from "../../core/controllers.js";
-import { i18nClearInput as f } from "../../core/i18n.js";
-import { SbbNegativeMixin as p } from "../../core/mixins.js";
+import { SbbLanguageController as p } from "../../core/controllers.js";
+import { i18nClearInput as d } from "../../core/i18n.js";
+import { SbbNegativeMixin as f } from "../../core/mixins.js";
 import { boxSizingStyles as h } from "../../core/styles.js";
 import "../../icon.js";
 let x = (() => {
   var i;
-  let s = [c("sbb-form-field-clear")], l, a = [], e, r = p(b);
+  let s = [c("sbb-form-field-clear")], l, a = [], e, r = f(b);
   return i = class extends r {
     constructor() {
-      super(), this._language = new d(this), this.addEventListener?.("click", () => this._handleClick());
+      super(), this._language = new p(this), this.addEventListener?.("click", () => this._handleClick());
     }
     connectedCallback() {
-      super.connectedCallback(), this._formField = this.closest("sbb-form-field, [data-form-field]"), this._formField && (this.slot ||= "suffix", this.negative = this._formField.hasAttribute("negative"));
+      super.connectedCallback(), this._formField = this.closest("sbb-form-field"), this._formField && (this.slot ||= "suffix", this.negative = this._formField.hasAttribute("negative"));
     }
     async _handleClick() {
       const t = this._formField?.inputElement;
       !t || t.localName !== "input" || (this._formField?.clear(), t.focus(), t.dispatchEvent(new InputEvent("input", { bubbles: !0, composed: !0 })), t.dispatchEvent(new Event("change", { bubbles: !0 })));
     }
     willUpdate(t) {
-      super.willUpdate(t), this.internals.ariaLabel = f[this._language.current];
+      super.willUpdate(t), this.internals.ariaLabel = d[this._language.current];
     }
     renderTemplate() {
       return m`<sbb-icon name="cross-small"></sbb-icon>`;

package/header/common/header-action-common.js

@@ -1,22 +1,22 @@
-var c = (e) => {
+var d = (e) => {
   throw TypeError(e);
 };
-var h = (e, a, t) => a.has(e) || c("Cannot " + t);
-var l = (e, a, t) => (h(e, a, "read from private field"), t ? t.call(e) : a.get(e)), m = (e, a, t) => a.has(e) ? c("Cannot add the same private member more than once") : a instanceof WeakSet ? a.add(e) : a.set(e, t), p = (e, a, t, o) => (h(e, a, "write to private field"), o ? o.call(e, t) : a.set(e, t), t);
+var h = (e, a, t) => a.has(e) || d("Cannot " + t);
+var l = (e, a, t) => (h(e, a, "read from private field"), t ? t.call(e) : a.get(e)), m = (e, a, t) => a.has(e) ? d("Cannot add the same private member more than once") : a instanceof WeakSet ? a.add(e) : a.set(e, t), p = (e, a, t, o) => (h(e, a, "write to private field"), o ? o.call(e, t) : a.set(e, t), t);
 import { __esDecorate as g, __runInitializers as v } from "tslib";
 import { property as x } from "lit/decorators.js";
 import { html as u } from "lit/static-html.js";
 import { boxSizingStyles as w } from "../../core/styles.js";
 import { SbbIconNameMixin as _ } from "../../icon.js";
 import { css as y } from "lit";
-const z = y`:host{display:inline-block;outline:none!important;--sbb-header-action-padding-inline: var(--sbb-spacing-fixed-5x);--sbb-header-action-color: var(--sbb-color-1);--sbb-header-action-background-color: transparent;--sbb-header-action-min-height: var(--sbb-size-element-s);--sbb-header-action-min-width: var(--sbb-header-action-min-height);--sbb-header-action-transition-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );--sbb-header-action-transition-easing: var(--sbb-animation-easing);--sbb-header-action-border-color: transparent;--sbb-header-action-background-inset: 0;--sbb-header-action-translate-y: 0;--sbb-header-action-gap: var(--sbb-spacing-fixed-2x);--sbb-header-action-icon-dimension: var(--sbb-size-icon-ui-small);--sbb-header-action-active-border-width: var(--sbb-border-width-2x);--sbb-header-action-active-border-color: var(--sbb-header-action-color);--sbb-header-action-active-border-margin-inline: var(--sbb-header-action-padding-inline);--sbb-header-action-active-border-scale: 0;--_sbb-header-first-item-padding-shift: calc(-1 * var(--sbb-header-action-padding-inline));--sbb-header-first-item-icon-shift: .125rem;--sbb-header-first-item-margin-inline-start: calc( var(--_sbb-header-first-item-padding-shift) - var(--sbb-header-first-item-icon-shift) )}@media(forced-colors:active){:host{--sbb-header-action-border-color: CanvasText;--sbb-header-action-color: LinkText;--sbb-header-action-active-border-width: 0}}@media(any-hover:hover){:host(:hover:not(:active,[data-active])){--sbb-header-action-background-color: var(--sbb-background-color-3);--sbb-header-action-translate-y: -.0625rem;--sbb-header-action-background-inset: calc(var(--sbb-border-width-2x) * -1)}}@media(any-hover:hover)and (forced-colors:active){:host(:hover:not(:active,[data-active])){--sbb-header-action-border-color: Highlight}}:host(:is(:active,[data-active])){--sbb-header-action-background-color: var(--sbb-background-color-4)}@media(forced-colors:active){:host(:is(:active,[data-active])){--sbb-header-action-border-color: Highlight}}:host(.sbb-active){--sbb-header-action-active-border-scale: 1}@media(forced-colors:active){:host(.sbb-active){--sbb-header-action-border-color: Highlight}}@media(forced-colors:active){:host([data-button]){--sbb-header-action-color: ButtonText}}:host(:not(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))){--sbb-header-first-item-margin-inline-start: var(--_sbb-header-first-item-padding-shift)}.sbb-action-base{font-family:inherit;font-weight:inherit;line-height:inherit;letter-spacing:inherit;font-size:inherit;text-align:inherit;display:flex;position:relative;align-items:center;justify-content:center;color:var(--sbb-header-action-color);text-decoration:none;min-height:var(--sbb-header-action-min-height);min-width:var(--sbb-header-action-min-width);padding-inline:var(--sbb-header-action-padding-inline-zero, var(--sbb-header-action-padding-inline));cursor:var(--sbb-cursor-pointer);-webkit-user-select:none;user-select:none;outline:none}.sbb-action-base:before{position:absolute;content:"";inset:var(--sbb-header-action-background-inset);border-radius:var(--sbb-border-radius-infinity);background-color:var(--sbb-header-action-background-color);transition-duration:var(--sbb-header-action-transition-duration);transition-timing-function:var(--sbb-header-action-transition-easing);transition-property:inset,background-color;border:var(--sbb-border-width-1x) solid var(--sbb-header-action-border-color)}@media(forced-colors:active){.sbb-action-base:before{border-width:var(--sbb-border-width-2x)}}:host(:focus-visible) .sbb-action-base:before,.sbb-action-base:focus-visible:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width)}.sbb-action-base:after{content:"";position:absolute;border-bottom:var(--sbb-header-action-active-border-width) solid var(--sbb-header-action-active-border-color);inset:auto 0 calc(-1 * var(--sbb-header-action-active-border-width));margin-inline:var(--sbb-header-action-active-border-margin-inline);scale:var(--sbb-header-action-active-border-scale);transition:scale var(--sbb-header-action-transition-easing) var(--sbb-header-action-transition-duration)}.sbb-header-action__wrapper{display:flex;align-items:center;gap:var(--sbb-header-action-gap);white-space:nowrap;transform:translateY(var(--sbb-header-action-translate-y));transition:transform var(--sbb-header-action-transition-duration) var(--sbb-header-action-transition-easing);will-change:transform;max-width:100%}.sbb-header-action__icon{--sbb-icon-svg-stroke-color: currentcolor;--sbb-icon-svg-stroke-width: 1px;min-width:var(--sbb-header-action-icon-dimension);min-height:var(--sbb-header-action-icon-dimension);line-height:0}:host(:not(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))) .sbb-header-action__icon{display:none}.sbb-header-action__text{--sbb-text-font-size: var(--sbb-text-font-size-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size);font-weight:700;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:block}:host(:not(:is(:state(slotted),[state--slotted]))) .sbb-header-action__text{display:none}@media(max-width:-.0625rem){:host([expand-from=zero]:is(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))){--_sbb-header-first-item-padding-shift: calc( -.5 * (var(--sbb-header-action-min-width) - var(--sbb-header-action-icon-dimension)) );--sbb-header-action-padding-inline-zero: 0;--sbb-header-action-active-border-margin-inline: calc( .5 * (100% - var(--sbb-size-icon-ui-small)) )}:host([expand-from=zero]:is(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))) .sbb-header-action__text{border:0;clip-path:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px;display:flex}}@media(max-width:37.4375rem){:host([expand-from=small]:is(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))){--_sbb-header-first-item-padding-shift: calc( -.5 * (var(--sbb-header-action-min-width) - var(--sbb-header-action-icon-dimension)) );--sbb-header-action-padding-inline-zero: 0;--sbb-header-action-active-border-margin-inline: calc( .5 * (100% - var(--sbb-size-icon-ui-small)) )}:host([expand-from=small]:is(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))) .sbb-header-action__text{border:0;clip-path:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px;display:flex}}@media(max-width:63.9375rem){:host([expand-from=large]:is(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))){--_sbb-header-first-item-padding-shift: calc( -.5 * (var(--sbb-header-action-min-width) - var(--sbb-header-action-icon-dimension)) );--sbb-header-action-padding-inline-zero: 0;--sbb-header-action-active-border-margin-inline: calc( .5 * (100% - var(--sbb-size-icon-ui-small)) )}:host([expand-from=large]:is(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))) .sbb-header-action__text{border:0;clip-path:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px;display:flex}}@media(max-width:89.9375rem){:host([expand-from=ultra]:is(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))){--_sbb-header-first-item-padding-shift: calc( -.5 * (var(--sbb-header-action-min-width) - var(--sbb-header-action-icon-dimension)) );--sbb-header-action-padding-inline-zero: 0;--sbb-header-action-active-border-margin-inline: calc( .5 * (100% - var(--sbb-size-icon-ui-small)) )}:host([expand-from=ultra]:is(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))) .sbb-header-action__text{border:0;clip-path:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px;display:flex}}@media(max-width:98.9375rem){:host([expand-from=ultra--max-content]:is(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))){--_sbb-header-first-item-padding-shift: calc( -.5 * (var(--sbb-header-action-min-width) - var(--sbb-header-action-icon-dimension)) );--sbb-header-action-padding-inline-zero: 0;--sbb-header-action-active-border-margin-inline: calc( .5 * (100% - var(--sbb-size-icon-ui-small)) )}:host([expand-from=ultra--max-content]:is(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))) .sbb-header-action__text{border:0;clip-path:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px;display:flex}}::slotted([slot=icon]:is(sbb-image,img)){width:var(--sbb-header-action-icon-dimension);height:var(--sbb-header-action-icon-dimension);border-radius:var(--sbb-border-radius-infinity)}`, M = (e) => (() => {
-  var n, i;
-  let t = _(e), o, b = [], d = [];
+const z = y`:host{display:inline-block;outline:none!important;--sbb-header-action-padding-inline: var(--sbb-spacing-fixed-5x);--sbb-header-action-color: var(--sbb-color-1);--sbb-header-action-background-color: transparent;--sbb-header-action-min-height: var(--sbb-size-element-s);--sbb-header-action-min-width: var(--sbb-header-action-min-height);--sbb-header-action-transition-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );--sbb-header-action-transition-easing: var(--sbb-animation-easing);--sbb-header-action-border-color: transparent;--sbb-header-action-background-inset: 0;--sbb-header-action-translate-y: 0;--sbb-header-action-gap: var(--sbb-spacing-fixed-2x);--sbb-header-action-icon-dimension: var(--sbb-size-icon-ui-small);--sbb-header-action-active-border-width: var(--sbb-border-width-2x);--sbb-header-action-active-border-color: var(--sbb-header-action-color);--sbb-header-action-active-border-margin-inline: var(--sbb-header-action-padding-inline);--sbb-header-action-active-border-scale: 0;--_sbb-header-first-item-padding-shift: calc(-1 * var(--sbb-header-action-padding-inline));--sbb-header-first-item-icon-shift: .125rem;--sbb-header-first-item-margin-inline-start: calc( var(--_sbb-header-first-item-padding-shift) - var(--sbb-header-first-item-icon-shift) )}@media(forced-colors:active){:host{--sbb-header-action-border-color: CanvasText;--sbb-header-action-color: LinkText;--sbb-header-action-active-border-width: 0}}@media(any-hover:hover){:host(:hover:not(:active,:is(:state(active),[state--active]))){--sbb-header-action-background-color: var(--sbb-background-color-3);--sbb-header-action-translate-y: -.0625rem;--sbb-header-action-background-inset: calc(var(--sbb-border-width-2x) * -1)}}@media(any-hover:hover)and (forced-colors:active){:host(:hover:not(:active,:is(:state(active),[state--active]))){--sbb-header-action-border-color: Highlight}}:host(:is(:active,:is(:state(active),[state--active]))){--sbb-header-action-background-color: var(--sbb-background-color-4)}@media(forced-colors:active){:host(:is(:active,:is(:state(active),[state--active]))){--sbb-header-action-border-color: Highlight}}:host(.sbb-active){--sbb-header-action-active-border-scale: 1}@media(forced-colors:active){:host(.sbb-active){--sbb-header-action-border-color: Highlight}}@media(forced-colors:active){:host(:is(:state(button),[state--button])){--sbb-header-action-color: ButtonText}}:host(:not(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))){--sbb-header-first-item-margin-inline-start: var(--_sbb-header-first-item-padding-shift)}.sbb-action-base{font-family:inherit;font-weight:inherit;line-height:inherit;letter-spacing:inherit;font-size:inherit;text-align:inherit;display:flex;position:relative;align-items:center;justify-content:center;color:var(--sbb-header-action-color);text-decoration:none;min-height:var(--sbb-header-action-min-height);min-width:var(--sbb-header-action-min-width);padding-inline:var(--sbb-header-action-padding-inline-zero, var(--sbb-header-action-padding-inline));cursor:var(--sbb-cursor-pointer);-webkit-user-select:none;user-select:none;outline:none}.sbb-action-base:before{position:absolute;content:"";inset:var(--sbb-header-action-background-inset);border-radius:var(--sbb-border-radius-infinity);background-color:var(--sbb-header-action-background-color);transition-duration:var(--sbb-header-action-transition-duration);transition-timing-function:var(--sbb-header-action-transition-easing);transition-property:inset,background-color;border:var(--sbb-border-width-1x) solid var(--sbb-header-action-border-color)}@media(forced-colors:active){.sbb-action-base:before{border-width:var(--sbb-border-width-2x)}}:host(:focus-visible) .sbb-action-base:before,.sbb-action-base:focus-visible:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width)}.sbb-action-base:after{content:"";position:absolute;border-bottom:var(--sbb-header-action-active-border-width) solid var(--sbb-header-action-active-border-color);inset:auto 0 calc(-1 * var(--sbb-header-action-active-border-width));margin-inline:var(--sbb-header-action-active-border-margin-inline);scale:var(--sbb-header-action-active-border-scale);transition:scale var(--sbb-header-action-transition-easing) var(--sbb-header-action-transition-duration)}.sbb-header-action__wrapper{display:flex;align-items:center;gap:var(--sbb-header-action-gap);white-space:nowrap;transform:translateY(var(--sbb-header-action-translate-y));transition:transform var(--sbb-header-action-transition-duration) var(--sbb-header-action-transition-easing);will-change:transform;max-width:100%}.sbb-header-action__icon{--sbb-icon-svg-stroke-color: currentcolor;--sbb-icon-svg-stroke-width: 1px;min-width:var(--sbb-header-action-icon-dimension);min-height:var(--sbb-header-action-icon-dimension);line-height:0}:host(:not(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))) .sbb-header-action__icon{display:none}.sbb-header-action__text{--sbb-text-font-size: var(--sbb-text-font-size-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size);font-weight:700;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:block}:host(:not(:is(:state(slotted),[state--slotted]))) .sbb-header-action__text{display:none}@media(max-width:-.0625rem){:host([expand-from=zero]:is(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))){--_sbb-header-first-item-padding-shift: calc( -.5 * (var(--sbb-header-action-min-width) - var(--sbb-header-action-icon-dimension)) );--sbb-header-action-padding-inline-zero: 0;--sbb-header-action-active-border-margin-inline: calc( .5 * (100% - var(--sbb-size-icon-ui-small)) )}:host([expand-from=zero]:is(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))) .sbb-header-action__text{border:0;clip-path:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px;display:flex}}@media(max-width:37.4375rem){:host([expand-from=small]:is(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))){--_sbb-header-first-item-padding-shift: calc( -.5 * (var(--sbb-header-action-min-width) - var(--sbb-header-action-icon-dimension)) );--sbb-header-action-padding-inline-zero: 0;--sbb-header-action-active-border-margin-inline: calc( .5 * (100% - var(--sbb-size-icon-ui-small)) )}:host([expand-from=small]:is(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))) .sbb-header-action__text{border:0;clip-path:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px;display:flex}}@media(max-width:63.9375rem){:host([expand-from=large]:is(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))){--_sbb-header-first-item-padding-shift: calc( -.5 * (var(--sbb-header-action-min-width) - var(--sbb-header-action-icon-dimension)) );--sbb-header-action-padding-inline-zero: 0;--sbb-header-action-active-border-margin-inline: calc( .5 * (100% - var(--sbb-size-icon-ui-small)) )}:host([expand-from=large]:is(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))) .sbb-header-action__text{border:0;clip-path:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px;display:flex}}@media(max-width:89.9375rem){:host([expand-from=ultra]:is(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))){--_sbb-header-first-item-padding-shift: calc( -.5 * (var(--sbb-header-action-min-width) - var(--sbb-header-action-icon-dimension)) );--sbb-header-action-padding-inline-zero: 0;--sbb-header-action-active-border-margin-inline: calc( .5 * (100% - var(--sbb-size-icon-ui-small)) )}:host([expand-from=ultra]:is(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))) .sbb-header-action__text{border:0;clip-path:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px;display:flex}}@media(max-width:98.9375rem){:host([expand-from=ultra--max-content]:is(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))){--_sbb-header-first-item-padding-shift: calc( -.5 * (var(--sbb-header-action-min-width) - var(--sbb-header-action-icon-dimension)) );--sbb-header-action-padding-inline-zero: 0;--sbb-header-action-active-border-margin-inline: calc( .5 * (100% - var(--sbb-size-icon-ui-small)) )}:host([expand-from=ultra--max-content]:is(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))) .sbb-header-action__text{border:0;clip-path:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px;display:flex}}::slotted([slot=icon]:is(sbb-image,img)){width:var(--sbb-header-action-icon-dimension);height:var(--sbb-header-action-icon-dimension);border-radius:var(--sbb-border-radius-infinity)}`, M = (e) => (() => {
+  var s, i;
+  let t = _(e), o, b = [], c = [];
   return i = class extends t {
     constructor() {
       super(...arguments);
-      m(this, n, v(this, b, "large"));
-      v(this, d);
+      m(this, s, v(this, b, "large"));
+      v(this, c);
     }
     /**
      * Used to set the minimum breakpoint from which the text is displayed.
@@ -24,10 +24,10 @@ const z = y`:host{display:inline-block;outline:none!important;--sbb-header-actio
      * and hidden for all the others. Ignored if no icon is set.
      */
     get expandFrom() {
-      return l(this, n);
+      return l(this, s);
     }
-    set expandFrom(s) {
-      p(this, n, s);
+    set expandFrom(n) {
+      p(this, s, n);
     }
     renderTemplate() {
       return u`
@@ -39,11 +39,11 @@ const z = y`:host{display:inline-block;outline:none!important;--sbb-header-actio
         </span>
       `;
     }
-  }, n = new WeakMap(), (() => {
-    const s = typeof Symbol == "function" && Symbol.metadata ? Object.create(t[Symbol.metadata] ?? null) : void 0;
+  }, s = new WeakMap(), (() => {
+    const n = typeof Symbol == "function" && Symbol.metadata ? Object.create(t[Symbol.metadata] ?? null) : void 0;
     o = [x({ attribute: "expand-from", reflect: !0 })], g(i, null, o, { kind: "accessor", name: "expandFrom", static: !1, private: !1, access: { has: (r) => "expandFrom" in r, get: (r) => r.expandFrom, set: (r, f) => {
       r.expandFrom = f;
-    } }, metadata: s }, b, d), s && Object.defineProperty(i, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: s });
+    } }, metadata: n }, b, c), n && Object.defineProperty(i, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: n });
   })(), i.styles = [w, z], i;
 })();
 export {

package/header/header/header.component.d.ts

@@ -1,5 +1,5 @@
 import { CSSResultGroup, LitElement, PropertyDeclaration, PropertyValues, TemplateResult } from 'lit';
-declare const SbbHeaderElement_base: import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbHydrationMixinType> & typeof LitElement;
+declare const SbbHeaderElement_base: import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbHydrationMixinType> & import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbElementInternalsMixinType> & typeof LitElement & import('../../core/mixins.ts').SbbElementInternalsConstructor;
 /**
  * It displays a header section for the page.
  *

package/header/header/header.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"header.component.d.ts","sourceRoot":"","sources":["../../../../src/elements/header/header/header.component.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EAGnB,UAAU,EACV,KAAK,mBAAmB,EACxB,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;;AAab;;;;;;GAMG;AACH,qBAEM,gBAAiB,SAAQ,qBAA6B;IAC1D,OAAuB,MAAM,EAAE,cAAc,CAA4B;IAEzE;;;OAGG;IACH,SAEgB,QAAQ,EAAE,OAAO,CAAS;IAE1C;;;;OAIG;IACH,SAEgB,YAAY,EAAE,WAAW,GAAG,IAAI,CAAQ;IAExD,yDAAyD;IACzD,SAEgB,YAAY,EAAE,OAAO,CAAS;IAE9C;;;OAGG;IACH,SAA6C,IAAI,EAAE,GAAG,GAAG,GAAG,CAAwB;IAE3E,OAAO,CAAC,QAAQ,CAAC,YAAY,CAAQ;IAE9C,OAAO,CAAC,cAAc,CAA4C;IAClE,OAAO,CAAC,uBAAuB,CAAmB;IAClD,OAAO,CAAC,eAAe,CAA2B;IAClD,OAAO,CAAC,WAAW,CAAK;;IAOxB,gGAAgG;IAChF,iBAAiB,IAAI,IAAI;IAOzC,2DAA2D;IAC3C,oBAAoB,IAAI,IAAI;IAM5B,aAAa,CAC3B,IAAI,CAAC,EAAE,WAAW,EAClB,QAAQ,CAAC,EAAE,OAAO,EAClB,OAAO,CAAC,EAAE,mBAAmB,GAC5B,IAAI;cAQY,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAK9E,OAAO,CAAC,qBAAqB;IAuB7B,wDAAwD;IACxD,OAAO,CAAC,kBAAkB;IAI1B,2DAA2D;IAC3D,OAAO,CAAC,yBAAyB;IAOjC;;;;;OAKG;IACH,OAAO,CAAC,eAAe;IA8CvB,uEAAuE;IACvE,OAAO,CAAC,qBAAqB;IAI7B,OAAO,CAAC,kBAAkB;cAgBP,MAAM,IAAI,cAAc;CAS5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,YAAY,EAAE,gBAAgB,CAAC;KAChC;CACF"}
+{"version":3,"file":"header.component.d.ts","sourceRoot":"","sources":["../../../../src/elements/header/header/header.component.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EAGnB,UAAU,EACV,KAAK,mBAAmB,EACxB,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;;AAab;;;;;;GAMG;AACH,qBAEM,gBAAiB,SAAQ,qBAAuD;IACpF,OAAuB,MAAM,EAAE,cAAc,CAA4B;IAEzE;;;OAGG;IACH,SAEgB,QAAQ,EAAE,OAAO,CAAS;IAE1C;;;;OAIG;IACH,SAEgB,YAAY,EAAE,WAAW,GAAG,IAAI,CAAQ;IAExD,yDAAyD;IACzD,SAEgB,YAAY,EAAE,OAAO,CAAS;IAE9C;;;OAGG;IACH,SAA6C,IAAI,EAAE,GAAG,GAAG,GAAG,CAAwB;IAE3E,OAAO,CAAC,QAAQ,CAAC,YAAY,CAAQ;IAE9C,OAAO,CAAC,cAAc,CAA4C;IAClE,OAAO,CAAC,uBAAuB,CAAmB;IAClD,OAAO,CAAC,eAAe,CAA2B;IAClD,OAAO,CAAC,WAAW,CAAK;;IAOxB,gGAAgG;IAChF,iBAAiB,IAAI,IAAI;IAOzC,2DAA2D;IAC3C,oBAAoB,IAAI,IAAI;IAM5B,aAAa,CAC3B,IAAI,CAAC,EAAE,WAAW,EAClB,QAAQ,CAAC,EAAE,OAAO,EAClB,OAAO,CAAC,EAAE,mBAAmB,GAC5B,IAAI;cAQY,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAK9E,OAAO,CAAC,qBAAqB;IAuB7B,wDAAwD;IACxD,OAAO,CAAC,kBAAkB;IAI1B,2DAA2D;IAC3D,OAAO,CAAC,yBAAyB;IAOjC;;;;;OAKG;IACH,OAAO,CAAC,eAAe;IA8CvB,uEAAuE;IACvE,OAAO,CAAC,qBAAqB;IAI7B,OAAO,CAAC,kBAAkB;cAgBP,MAAM,IAAI,cAAc;CAS5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,YAAY,EAAE,gBAAgB,CAAC;KAChC;CACF"}

package/header/header/header.component.js

@@ -1,39 +1,39 @@
-var D = (s) => {
+var F = (s) => {
   throw TypeError(s);
 };
-var F = (s, i, r) => i.has(s) || D("Cannot " + r);
-var m = (s, i, r) => (F(s, i, "read from private field"), r ? r.call(s) : i.get(s)), f = (s, i, r) => i.has(s) ? D("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(s) : i.set(s, r), l = (s, i, r, d) => (F(s, i, "write to private field"), d ? d.call(s, r) : i.set(s, r), r);
-import { __esDecorate as _, __runInitializers as n } from "tslib";
+var A = (s, i, r) => i.has(s) || F("Cannot " + r);
+var u = (s, i, r) => (A(s, i, "read from private field"), r ? r.call(s) : i.get(s)), m = (s, i, r) => i.has(s) ? F("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(s) : i.set(s, r), n = (s, i, r, d) => (A(s, i, "write to private field"), d ? d.call(s, r) : i.set(s, r), r);
+import { __esDecorate as _, __runInitializers as l } from "tslib";
 import { css as q, LitElement as B, isServer as M, html as N } from "lit";
 import { customElement as R, property as g, state as Z } from "lit/decorators.js";
 import { SbbFocusVisibleWithinController as Q } from "../../core/a11y.js";
 import { forceType as j, idReference as V } from "../../core/decorators.js";
 import { isLean as W } from "../../core/dom.js";
-import { SbbHydrationMixin as Y } from "../../core/mixins.js";
-import { boxSizingStyles as G } from "../../core/styles.js";
-const J = q`:host{display:block;height:var(--sbb-header-height);--sbb-logo-height: 1rem;--sbb-signet-height: 1rem;--sbb-header-position: fixed;--sbb-header-transition-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-6x) );--sbb-header-inset-inline-end: 0}@media(min-width:64rem){:host{--sbb-logo-height: 1.25rem;--sbb-signet-height: 1.25rem}}:host([hide-on-scroll]){--sbb-header-position: absolute}:host([hide-on-scroll][data-fixed]){--sbb-header-position: fixed;--sbb-header-animation-name: hide;--sbb-header-transform: translate3d(0, -100%, 0);--sbb-header-inset-inline-end: var(--sbb-scrollbar-width, 0)}:host([hide-on-scroll][data-fixed][data-animated]){--sbb-header-transition-timing: cubic-bezier(.4, 0, 1, 1)}:host([hide-on-scroll][data-fixed][data-visible]){--sbb-header-animation-name: show;--sbb-header-transform: translate3d(0, 0, 0);--sbb-header-transition-timing: cubic-bezier(0, 0, .2, 1)}:host([hide-on-scroll][data-fixed][data-has-visible-focus-within]){--sbb-header-transition-duration: 0;--sbb-header-transform: translate3d(0, 0, 0)}.sbb-header{position:var(--sbb-header-position);inset:0 var(--sbb-header-inset-inline-end) auto 0;background:var(--sbb-background-color-1);z-index:var(--sbb-header-z-index, 10);transform:var(--sbb-header-transform);transition-property:box-shadow;transition-duration:var(--sbb-header-transition-duration);transition-timing-function:var(--sbb-header-transition-timing);animation-name:var(--sbb-header-animation-name);animation-duration:var(--sbb-header-transition-duration);animation-timing-function:var(--sbb-header-transition-timing)}:host(:is([data-shadow],[data-has-visible-focus-within][data-fixed])) .sbb-header{box-shadow:var(--sbb-box-shadow-level-9-soft)}@media(forced-colors:active){.sbb-header{border-block-end:var(--sbb-border-width-1x) solid CanvasText}}.sbb-header__wrapper{display:flex;align-items:center;justify-content:flex-start;height:var(--sbb-header-height)}:host(:not([expanded])) .sbb-header__wrapper{padding-inline:var(--sbb-page-spacing-padding, var(--sbb-layout-base-offset-responsive));margin-inline:auto;width:100%}@media(min-width:90rem){:host(:not([expanded])) .sbb-header__wrapper{max-width:var(--sbb-spacing-max-width, calc(var(--sbb-layout-base-page-max-width) + 2 * var(--sbb-layout-base-offset-responsive)))}}:host([expanded]) .sbb-header__wrapper{padding-inline:var(--sbb-page-spacing-padding, var(--sbb-spacing-responsive-xxs))}::slotted(:is(sbb-header-button,sbb-header-link):first-child){margin-inline-start:var(--sbb-header-first-item-margin-inline-start)}:host([size=s]) ::slotted(:is(sbb-header-button,sbb-header-link)){--sbb-header-action-min-height: var(--sbb-size-element-xs);--sbb-header-action-padding-inline: var(--sbb-spacing-fixed-4x)}::slotted(*){flex:0 0 auto}::slotted(.sbb-header-shrinkable){flex-shrink:1;min-width:0}::slotted(.sbb-header-spacer){flex-grow:1}::slotted(.sbb-header-logo){margin-inline-start:var(--sbb-spacing-responsive-s)}::slotted(a.sbb-header-logo){display:block;padding-block:var(--sbb-spacing-fixed-3x);position:relative;outline:none!important}::slotted(a.sbb-header-logo):before{content:"";display:block;position:absolute;inset:var(--sbb-spacing-fixed-3x) 0}::slotted(a.sbb-header-logo:focus-visible):before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);outline-offset:var(--sbb-spacing-fixed-3x);border-radius:1px}@keyframes show{0%{transform:translate3d(0,-100%,0)}to{transform:translateZ(0)}}@keyframes hide{0%{transform:translateZ(0)}to{transform:translate3d(0,-100%,0)}}`, K = "[aria-controls][aria-expanded='true']";
-let ne = (() => {
-  var h, c, b, u, p, o;
-  let s = [R("sbb-header")], i, r = [], d, v = Y(B), x, S = [], O = [], y, w = [], z = [], E, k = [], T = [], C, L = [], A = [], I, U = [], P = [];
+import { SbbHydrationMixin as Y, SbbElementInternalsMixin as G } from "../../core/mixins.js";
+import { boxSizingStyles as J } from "../../core/styles.js";
+const K = q`:host{display:block;height:var(--sbb-header-height);--sbb-logo-height: 1rem;--sbb-signet-height: 1rem;--sbb-header-position: fixed;--sbb-header-transition-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-6x) );--sbb-header-inset-inline-end: 0}@media(min-width:64rem){:host{--sbb-logo-height: 1.25rem;--sbb-signet-height: 1.25rem}}:host([hide-on-scroll]){--sbb-header-position: absolute}:host([hide-on-scroll]:is(:state(fixed),[state--fixed])){--sbb-header-position: fixed;--sbb-header-animation-name: hide;--sbb-header-transform: translate3d(0, -100%, 0);--sbb-header-inset-inline-end: var(--sbb-scrollbar-width, 0)}:host([hide-on-scroll]:is(:state(fixed),[state--fixed]):is(:state(animated),[state--animated])){--sbb-header-transition-timing: cubic-bezier(.4, 0, 1, 1)}:host([hide-on-scroll]:is(:state(fixed),[state--fixed]):is(:state(visible),[state--visible])){--sbb-header-animation-name: show;--sbb-header-transform: translate3d(0, 0, 0);--sbb-header-transition-timing: cubic-bezier(0, 0, .2, 1)}:host([hide-on-scroll]:is(:state(fixed),[state--fixed]):is(:state(has-visible-focus-within),[state--has-visible-focus-within])){--sbb-header-transition-duration: 0;--sbb-header-transform: translate3d(0, 0, 0)}.sbb-header{position:var(--sbb-header-position);inset:0 var(--sbb-header-inset-inline-end) auto 0;background:var(--sbb-background-color-1);z-index:var(--sbb-header-z-index, 10);transform:var(--sbb-header-transform);transition-property:box-shadow;transition-duration:var(--sbb-header-transition-duration);transition-timing-function:var(--sbb-header-transition-timing);animation-name:var(--sbb-header-animation-name);animation-duration:var(--sbb-header-transition-duration);animation-timing-function:var(--sbb-header-transition-timing)}:host(:is(:is(:state(shadow),[state--shadow]),:is(:state(has-visible-focus-within),[state--has-visible-focus-within]):is(:state(fixed),[state--fixed]))) .sbb-header{box-shadow:var(--sbb-box-shadow-level-9-soft)}@media(forced-colors:active){.sbb-header{border-block-end:var(--sbb-border-width-1x) solid CanvasText}}.sbb-header__wrapper{display:flex;align-items:center;justify-content:flex-start;height:var(--sbb-header-height)}:host(:not([expanded])) .sbb-header__wrapper{padding-inline:var(--sbb-page-spacing-padding, var(--sbb-layout-base-offset-responsive));margin-inline:auto;width:100%}@media(min-width:90rem){:host(:not([expanded])) .sbb-header__wrapper{max-width:var(--sbb-spacing-max-width, calc(var(--sbb-layout-base-page-max-width) + 2 * var(--sbb-layout-base-offset-responsive)))}}:host([expanded]) .sbb-header__wrapper{padding-inline:var(--sbb-page-spacing-padding, var(--sbb-spacing-responsive-xxs))}::slotted(:is(sbb-header-button,sbb-header-link):first-child){margin-inline-start:var(--sbb-header-first-item-margin-inline-start)}:host([size=s]) ::slotted(:is(sbb-header-button,sbb-header-link)){--sbb-header-action-min-height: var(--sbb-size-element-xs);--sbb-header-action-padding-inline: var(--sbb-spacing-fixed-4x)}::slotted(*){flex:0 0 auto}::slotted(.sbb-header-shrinkable){flex-shrink:1;min-width:0}::slotted(.sbb-header-spacer){flex-grow:1}::slotted(.sbb-header-logo){margin-inline-start:var(--sbb-spacing-responsive-s)}::slotted(a.sbb-header-logo){display:block;padding-block:var(--sbb-spacing-fixed-3x);position:relative;outline:none!important}::slotted(a.sbb-header-logo):before{content:"";display:block;position:absolute;inset:var(--sbb-spacing-fixed-3x) 0}::slotted(a.sbb-header-logo:focus-visible):before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);outline-offset:var(--sbb-spacing-fixed-3x);border-radius:1px}@keyframes show{0%{transform:translate3d(0,-100%,0)}to{transform:translateZ(0)}}@keyframes hide{0%{transform:translateZ(0)}to{transform:translate3d(0,-100%,0)}}`, X = "[aria-controls][aria-expanded='true']";
+let de = (() => {
+  var h, c, b, f, p, o;
+  let s = [R("sbb-header")], i, r = [], d, v = Y(G(B)), x, S = [], O = [], w, y = [], E = [], z, k = [], T = [], C, I = [], L = [], U, P = [], H = [];
   return o = class extends v {
     constructor() {
       super();
-      f(this, h);
-      f(this, c);
-      f(this, b);
-      f(this, u);
-      f(this, p);
-      l(this, h, n(this, S, !1)), l(this, c, (n(this, O), n(this, w, null))), l(this, b, (n(this, z), n(this, k, !1))), l(this, u, (n(this, T), n(this, L, W() ? "s" : "m"))), l(this, p, (n(this, A), n(this, U, !0))), this._scrollElement = n(this, P), this._lastScroll = 0, this.addController(new Q(this));
+      m(this, h);
+      m(this, c);
+      m(this, b);
+      m(this, f);
+      m(this, p);
+      n(this, h, l(this, S, !1)), n(this, c, (l(this, O), l(this, y, null))), n(this, b, (l(this, E), l(this, k, !1))), n(this, f, (l(this, T), l(this, I, W() ? "s" : "m"))), n(this, p, (l(this, L), l(this, P, !0))), this._scrollElement = l(this, H), this._lastScroll = 0, this.addController(new Q(this));
     }
     /**
      * Whether to allow the header content to stretch to full width.
      * By default, the content has the appropriate page size.
      */
     get expanded() {
-      return m(this, h);
+      return u(this, h);
     }
     set expanded(e) {
-      l(this, h, e);
+      n(this, h, e);
     }
     /**
      * The element's id or the element on which the scroll listener is attached.
@@ -41,33 +41,33 @@ let ne = (() => {
      * For attribute usage, provide an id reference.
      */
     get scrollOrigin() {
-      return m(this, c);
+      return u(this, c);
     }
     set scrollOrigin(e) {
-      l(this, c, e);
+      n(this, c, e);
     }
     /** Whether the header should hide and show on scroll. */
     get hideOnScroll() {
-      return m(this, b);
+      return u(this, b);
     }
     set hideOnScroll(e) {
-      l(this, b, e);
+      n(this, b, e);
     }
     /**
      * Size of the header, either m or s.
      * @default 'm' / 's' (lean)
      */
     get size() {
-      return m(this, u);
+      return u(this, f);
     }
     set size(e) {
-      l(this, u, e);
+      n(this, f, e);
     }
     get _headerOnTop() {
-      return m(this, p);
+      return u(this, p);
     }
     set _headerOnTop(e) {
-      l(this, p, e);
+      n(this, p, e);
     }
     /** If `hideOnScroll` is set, checks the element to hook the listener on, and possibly add it.*/
     connectedCallback() {
@@ -110,19 +110,19 @@ let ne = (() => {
      */
     _scrollListener() {
       const e = this._getCurrentScrollProperty("scrollTop");
-      this._getCurrentScrollProperty("scrollHeight") - window.innerHeight - e <= 0 || (this.toggleAttribute("data-shadow", e !== 0), e > this.offsetHeight && e > 0 && this._lastScroll < e && this._closeOpenOverlays(), e > this.offsetHeight * 2 ? (this._headerOnTop = !1, e > 0 && this._lastScroll < e ? ["data-shadow", "data-visible"].forEach((t) => this.removeAttribute(t)) : ["data-fixed", "data-shadow", "data-animated", "data-visible"].forEach((t) => this.toggleAttribute(t, !0))) : (e === 0 && (this._headerOnTop = !0), this._headerOnTop && ["data-shadow", "data-animated", "data-fixed", "data-visible"].forEach((t) => this.removeAttribute(t))), this._lastScroll = e <= 0 ? 0 : e);
+      this._getCurrentScrollProperty("scrollHeight") - window.innerHeight - e <= 0 || (this.toggleState("shadow", e !== 0), e > this.offsetHeight && e > 0 && this._lastScroll < e && this._closeOpenOverlays(), e > this.offsetHeight * 2 ? (this._headerOnTop = !1, e > 0 && this._lastScroll < e ? ["shadow", "visible"].forEach((t) => this.internals.states.delete(t)) : ["fixed", "shadow", "animated", "visible"].forEach((t) => this.internals.states.add(t))) : (e === 0 && (this._headerOnTop = !0), this._headerOnTop && ["shadow", "animated", "fixed", "visible"].forEach((t) => this.internals.states.delete(t))), this._lastScroll = e <= 0 ? 0 : e);
     }
     /** Apply the shadow if the element/document has been scrolled down. */
     _scrollShadowListener() {
-      this.toggleAttribute("data-shadow", this._getCurrentScrollProperty("scrollTop") !== 0);
+      this.toggleState("shadow", this._getCurrentScrollProperty("scrollTop") !== 0);
     }
     _closeOpenOverlays() {
-      if (this.hasAttribute("data-has-visible-focus-within"))
+      if (this.matches(":is(:state(has-visible-focus-within),[state--has-visible-focus-within])"))
         return;
-      const e = Array.from(this.querySelectorAll(K));
+      const e = Array.from(this.querySelectorAll(X));
       for (const t of e) {
-        const a = t.getAttribute("aria-controls"), H = document.getElementById(a);
-        typeof H?.close == "function" && H.close();
+        const a = t.getAttribute("aria-controls"), D = document.getElementById(a);
+        typeof D?.close == "function" && D.close();
       }
     }
     render() {
@@ -134,21 +134,21 @@ let ne = (() => {
       </header>
     `;
     }
-  }, h = new WeakMap(), c = new WeakMap(), b = new WeakMap(), u = new WeakMap(), p = new WeakMap(), d = o, (() => {
+  }, h = new WeakMap(), c = new WeakMap(), b = new WeakMap(), f = new WeakMap(), p = new WeakMap(), d = o, (() => {
     const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(v[Symbol.metadata] ?? null) : void 0;
-    x = [j(), g({ reflect: !0, type: Boolean })], y = [V(), g({ attribute: "scroll-origin" })], E = [j(), g({ attribute: "hide-on-scroll", reflect: !0, type: Boolean })], C = [g({ reflect: !0 })], I = [Z()], _(o, null, x, { kind: "accessor", name: "expanded", static: !1, private: !1, access: { has: (t) => "expanded" in t, get: (t) => t.expanded, set: (t, a) => {
+    x = [j(), g({ reflect: !0, type: Boolean })], w = [V(), g({ attribute: "scroll-origin" })], z = [j(), g({ attribute: "hide-on-scroll", reflect: !0, type: Boolean })], C = [g({ reflect: !0 })], U = [Z()], _(o, null, x, { kind: "accessor", name: "expanded", static: !1, private: !1, access: { has: (t) => "expanded" in t, get: (t) => t.expanded, set: (t, a) => {
       t.expanded = a;
-    } }, metadata: e }, S, O), _(o, null, y, { kind: "accessor", name: "scrollOrigin", static: !1, private: !1, access: { has: (t) => "scrollOrigin" in t, get: (t) => t.scrollOrigin, set: (t, a) => {
+    } }, metadata: e }, S, O), _(o, null, w, { kind: "accessor", name: "scrollOrigin", static: !1, private: !1, access: { has: (t) => "scrollOrigin" in t, get: (t) => t.scrollOrigin, set: (t, a) => {
       t.scrollOrigin = a;
-    } }, metadata: e }, w, z), _(o, null, E, { kind: "accessor", name: "hideOnScroll", static: !1, private: !1, access: { has: (t) => "hideOnScroll" in t, get: (t) => t.hideOnScroll, set: (t, a) => {
+    } }, metadata: e }, y, E), _(o, null, z, { kind: "accessor", name: "hideOnScroll", static: !1, private: !1, access: { has: (t) => "hideOnScroll" in t, get: (t) => t.hideOnScroll, set: (t, a) => {
       t.hideOnScroll = a;
     } }, metadata: e }, k, T), _(o, null, C, { kind: "accessor", name: "size", static: !1, private: !1, access: { has: (t) => "size" in t, get: (t) => t.size, set: (t, a) => {
       t.size = a;
-    } }, metadata: e }, L, A), _(o, null, I, { kind: "accessor", name: "_headerOnTop", static: !1, private: !1, access: { has: (t) => "_headerOnTop" in t, get: (t) => t._headerOnTop, set: (t, a) => {
+    } }, metadata: e }, I, L), _(o, null, U, { kind: "accessor", name: "_headerOnTop", static: !1, private: !1, access: { has: (t) => "_headerOnTop" in t, get: (t) => t._headerOnTop, set: (t, a) => {
       t._headerOnTop = a;
-    } }, metadata: e }, U, P), _(null, i = { value: d }, s, { kind: "class", name: d.name, metadata: e }, null, r), d = i.value, e && Object.defineProperty(d, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
-  })(), o.styles = [G, J], n(d, r), d;
+    } }, metadata: e }, P, H), _(null, i = { value: d }, s, { kind: "class", name: d.name, metadata: e }, null, r), d = i.value, e && Object.defineProperty(d, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
+  })(), o.styles = [J, K], l(d, r), d;
 })();
 export {
-  ne as SbbHeaderElement
+  de as SbbHeaderElement
 };

package/header/header-environment/header-environment.component.d.ts

@@ -10,6 +10,7 @@ declare const SbbHeaderEnvironmentElement_base: import('../../core/mixins.ts').A
  */
 export declare class SbbHeaderEnvironmentElement extends SbbHeaderEnvironmentElement_base {
     static styles: CSSResultGroup;
+    private _env;
     constructor();
     private _slottedTextChange;
     protected render(): TemplateResult;

package/header/header-environment/header-environment.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"header-environment.component.d.ts","sourceRoot":"","sources":["../../../../src/elements/header/header-environment/header-environment.component.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,cAAc,EAAQ,UAAU,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;;AAQjF;;;;;;;GAOG;AACH,qBAEM,2BAA4B,SAAQ,gCAAoC;IAC5E,OAAuB,MAAM,EAAE,cAAc,CAA4B;;IAczE,OAAO,CAAC,kBAAkB;cAQP,MAAM,IAAI,cAAc;CAO5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,wBAAwB,EAAE,2BAA2B,CAAC;KACvD;CACF"}
+{"version":3,"file":"header-environment.component.d.ts","sourceRoot":"","sources":["../../../../src/elements/header/header-environment/header-environment.component.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,cAAc,EAAQ,UAAU,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;;AAQjF;;;;;;;GAOG;AACH,qBAEM,2BAA4B,SAAQ,gCAAoC;IAC5E,OAAuB,MAAM,EAAE,cAAc,CAA4B;IAEzE,OAAO,CAAC,IAAI,CAAuB;;IAcnC,OAAO,CAAC,kBAAkB;cAUP,MAAM,IAAI,cAAc;CAO5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,wBAAwB,EAAE,2BAA2B,CAAC;KACvD;CACF"}

package/header/header-environment/header-environment.component.js

@@ -4,13 +4,13 @@ import { css as c, LitElement as v, html as d } from "lit";
 import { customElement as m } from "lit/decorators.js";
 import { SbbElementInternalsMixin as h } from "../../core/mixins.js";
 import { boxSizingStyles as u } from "../../core/styles.js";
-const g = c`:host{--sbb-header-environment-background-color: var(--sbb-color-granite);--sbb-header-environment-color: var(--sbb-color-1-negative);--sbb-header-environment-size: 2.375rem;--sbb-header-environment-rotate: 45deg;position:absolute;inset-inline-end:0;inset-block-start:0;display:flex;align-items:center;justify-content:center}:host(:dir(rtl)){--sbb-header-environment-rotate: -45deg}:host(:is(:state(env-dev),[state--env-dev])){--sbb-header-environment-background-color: var(--sbb-color-orange)}:host(:is(:state(env-edu),[state--env-edu])){--sbb-header-environment-background-color: var(--sbb-color-green)}:host(:is(:state(env-int),[state--env-int])),:host(:is(:state(env-inte),[state--env-inte])){--sbb-header-environment-background-color: var(--sbb-color-granite)}:host(:is(:state(env-loc),[state--env-loc])){--sbb-header-environment-background-color: var(--sbb-color-pink)}:host(:is(:state(env-test),[state--env-test])){--sbb-header-environment-background-color: var(--sbb-color-sky)}:host:before{content:"";border-block-start:var(--sbb-header-environment-size) solid var(--sbb-header-environment-background-color);border-inline-start:var(--sbb-header-environment-size) solid transparent}.sbb-header-environment__text{--sbb-text-font-size: var(--sbb-text-font-size-xxs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size);font-weight:700;position:absolute;color:var(--sbb-header-environment-color);rotate:var(--sbb-header-environment-rotate);padding-block-end:var(--sbb-spacing-fixed-4x)}`;
+const f = c`:host{--sbb-header-environment-background-color: var(--sbb-color-granite);--sbb-header-environment-color: var(--sbb-color-1-negative);--sbb-header-environment-size: 2.375rem;--sbb-header-environment-rotate: 45deg;position:absolute;inset-inline-end:0;inset-block-start:0;display:flex;align-items:center;justify-content:center}:host(:dir(rtl)){--sbb-header-environment-rotate: -45deg}:host(:is(:state(env-dev),[state--env-dev])){--sbb-header-environment-background-color: var(--sbb-color-orange)}:host(:is(:state(env-edu),[state--env-edu])){--sbb-header-environment-background-color: var(--sbb-color-green)}:host(:is(:state(env-int),[state--env-int])),:host(:is(:state(env-inte),[state--env-inte])){--sbb-header-environment-background-color: var(--sbb-color-granite)}:host(:is(:state(env-loc),[state--env-loc])){--sbb-header-environment-background-color: var(--sbb-color-pink)}:host(:is(:state(env-test),[state--env-test])){--sbb-header-environment-background-color: var(--sbb-color-sky)}:host:before{content:"";border-block-start:var(--sbb-header-environment-size) solid var(--sbb-header-environment-background-color);border-inline-start:var(--sbb-header-environment-size) solid transparent}.sbb-header-environment__text{--sbb-text-font-size: var(--sbb-text-font-size-xxs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size);font-weight:700;position:absolute;color:var(--sbb-header-environment-color);rotate:var(--sbb-header-environment-rotate);padding-block-end:var(--sbb-spacing-fixed-4x)}`;
 let z = (() => {
   var t;
-  let a = [m("sbb-header-environment")], r, o = [], e, s = h(v);
-  return t = class extends s {
+  let a = [m("sbb-header-environment")], r, s = [], e, o = h(v);
+  return t = class extends o {
     constructor() {
-      super(), this.addController(new l(this, {
+      super(), this._env = null, this.addController(new l(this, {
         config: { characterData: !0, subtree: !0 },
         callback: () => {
           this._slottedTextChange();
@@ -18,8 +18,7 @@ let z = (() => {
       }));
     }
     _slottedTextChange() {
-      const n = this.textContent?.trim();
-      this.internals.states.clear(), n && this.toggleState(`env-${n}`, !0);
+      this._env && this.internals.states.delete(`env-${this._env}`), this._env = this.textContent?.trim() ?? "", this._env && this.internals.states.add(`env-${this._env}`);
     }
     render() {
       return d`
@@ -29,9 +28,9 @@ let z = (() => {
     `;
     }
   }, e = t, (() => {
-    const n = typeof Symbol == "function" && Symbol.metadata ? Object.create(s[Symbol.metadata] ?? null) : void 0;
-    i(null, r = { value: e }, a, { kind: "class", name: e.name, metadata: n }, null, o), e = r.value, n && Object.defineProperty(e, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: n });
-  })(), t.styles = [u, g], b(e, o), e;
+    const n = typeof Symbol == "function" && Symbol.metadata ? Object.create(o[Symbol.metadata] ?? null) : void 0;
+    i(null, r = { value: e }, a, { kind: "class", name: e.name, metadata: n }, null, s), e = r.value, n && Object.defineProperty(e, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: n });
+  })(), t.styles = [u, f], b(e, s), e;
 })();
 export {
   z as SbbHeaderEnvironmentElement

package/icon/icon-base.d.ts

@@ -19,6 +19,7 @@ export declare abstract class SbbIconBase extends SbbIconBase_base {
      * @default false
      */
     accessor noSanitize: boolean;
+    constructor();
     protected loadSvgIcon(iconName: string): Promise<void>;
     protected fetchSvgIcon(namespace: string, name: string): Promise<string>;
     private _splitIconName;

package/icon/icon-base.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"icon-base.d.ts","sourceRoot":"","sources":["../../../src/elements/icon/icon-base.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1D,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;;AAgBvC;;;GAGG;AACH,8BAKe,WAAY,SAAQ,gBAAoC;IACrE,OAAuB,MAAM,EAAE,cAAc,CAA4B;IACzE,gBAAgC,IAAI,SAAS;IAEpC,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAoB;IAE3D;;OAEG;IACM,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAC3B;IAEP;;;;;OAKG;IACH,SAEgB,UAAU,EAAE,OAAO,CAAS;cAE5B,WAAW,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;cAkB5C,YAAY,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC;IAI9E,OAAO,CAAC,cAAc;cAgBH,MAAM,IAAI,cAAc;CAS5C"}
+{"version":3,"file":"icon-base.d.ts","sourceRoot":"","sources":["../../../src/elements/icon/icon-base.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1D,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;;AAgBvC;;;GAGG;AACH,8BAAsB,WAAY,SAAQ,gBAAoC;IAC5E,OAAuB,MAAM,EAAE,cAAc,CAA4B;IACzE,gBAAgC,IAAI,SAAS;IAEpC,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAoB;IAE3D;;OAEG;IACM,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAC3B;IAEP;;;;;OAKG;IACH,SAEgB,UAAU,EAAE,OAAO,CAAS;;cAO5B,WAAW,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;cAwB5C,YAAY,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC;IAI9E,OAAO,CAAC,cAAc;cAgBH,MAAM,IAAI,cAAc;CAS5C"}

package/icon/icon-base.js

@@ -1,34 +1,31 @@
-var $ = (s) => {
+var S = (s) => {
   throw TypeError(s);
 };
-var A = (s, a, i) => a.has(s) || $("Cannot " + i);
-var g = (s, a, i) => (A(s, a, "read from private field"), i ? i.call(s) : a.get(s)), p = (s, a, i) => a.has(s) ? $("Cannot add the same private member more than once") : a instanceof WeakSet ? a.add(s) : a.set(s, i), u = (s, a, i, o) => (A(s, a, "write to private field"), o ? o.call(s, i) : a.set(s, i), i);
-import { __esDecorate as d, __runInitializers as l } from "tslib";
-import { css as j, LitElement as B, html as E } from "lit";
-import { state as D, property as L } from "lit/decorators.js";
+var w = (s, a, i) => a.has(s) || S("Cannot " + i);
+var h = (s, a, i) => (w(s, a, "read from private field"), i ? i.call(s) : a.get(s)), g = (s, a, i) => a.has(s) ? S("Cannot add the same private member more than once") : a instanceof WeakSet ? a.add(s) : a.set(s, i), u = (s, a, i, l) => (w(s, a, "write to private field"), l ? l.call(s, i) : a.set(s, i), i);
+import { __esDecorate as v, __runInitializers as r } from "tslib";
+import { css as E, LitElement as j, html as N } from "lit";
+import { state as k, property as L } from "lit/decorators.js";
 import { unsafeHTML as M } from "lit/directives/unsafe-html.js";
 import { until as O } from "lit/directives/until.js";
-import { hostAttributes as C, forceType as H } from "../core/decorators.js";
-import { SbbElementInternalsMixin as P } from "../core/mixins.js";
-import { boxSizingStyles as q } from "../core/styles.js";
-import { getSvgContent as F } from "./icon-request.js";
-const G = j`:host{display:inline-block;line-height:0;-webkit-tap-highlight-color:transparent}:host([data-empty]){--sbb-icon-default-dimension: 0}:host([data-empty][data-namespace=default][name$=-extra-small]){--sbb-icon-default-dimension: var(--sbb-size-icon-ui-extra-small)}:host([data-empty][data-namespace=default][name$=-small]){--sbb-icon-default-dimension: var(--sbb-size-icon-ui-small)}:host([data-empty][data-namespace=default][name$=-medium]){--sbb-icon-default-dimension: var(--sbb-size-icon-ui-medium)}:host([data-empty][data-namespace=default][name$=-large]){--sbb-icon-default-dimension: var(--sbb-size-icon-ui-large)}svg{width:var(--sbb-icon-svg-width, var(--sbb-icon-default-dimension));height:var(--sbb-icon-svg-height, var(--sbb-icon-default-dimension));stroke:var(--sbb-icon-svg-stroke-color);stroke-width:var(--sbb-icon-svg-stroke-width)}svg:not(.color-immutable) [fill]:not([fill=none]){fill:currentcolor}svg:not(.color-immutable) [stroke]:not([stroke=none]){stroke:currentcolor}svg:not(.color-immutable)>:where(path,polygon,polyline):where(:not([stroke]):not([fill])),svg:not(.color-immutable) :where(:not([stroke]):not([fill])) :where(path,polygon,polyline):where(:not([stroke]):not([fill])){fill:currentcolor}`, _ = "default";
-let et = (() => {
-  var c, m, h, n;
-  let s = [C({
-    "data-namespace": _,
-    "data-empty": ""
-  })], a, i = [], o, v = P(B), b, f = [], y = [], I, z = [], S = [], k, w = [], N = [];
-  return n = class extends v {
+import { forceType as T } from "../core/decorators.js";
+import { SbbElementInternalsMixin as C } from "../core/mixins.js";
+import { boxSizingStyles as D } from "../core/styles.js";
+import { getSvgContent as H } from "./icon-request.js";
+const P = E`:host{display:inline-block;line-height:0;-webkit-tap-highlight-color:transparent}:host(:is(:state(empty),[state--empty])){--sbb-icon-default-dimension: 0}:host(:is(:state(empty),[state--empty]):is(:state(namespace-default),[state--namespace-default])[name$=-extra-small]){--sbb-icon-default-dimension: var(--sbb-size-icon-ui-extra-small)}:host(:is(:state(empty),[state--empty]):is(:state(namespace-default),[state--namespace-default])[name$=-small]){--sbb-icon-default-dimension: var(--sbb-size-icon-ui-small)}:host(:is(:state(empty),[state--empty]):is(:state(namespace-default),[state--namespace-default])[name$=-medium]){--sbb-icon-default-dimension: var(--sbb-size-icon-ui-medium)}:host(:is(:state(empty),[state--empty]):is(:state(namespace-default),[state--namespace-default])[name$=-large]){--sbb-icon-default-dimension: var(--sbb-size-icon-ui-large)}svg{width:var(--sbb-icon-svg-width, var(--sbb-icon-default-dimension));height:var(--sbb-icon-svg-height, var(--sbb-icon-default-dimension));stroke:var(--sbb-icon-svg-stroke-color);stroke-width:var(--sbb-icon-svg-stroke-width)}svg:not(.color-immutable) [fill]:not([fill=none]){fill:currentcolor}svg:not(.color-immutable) [stroke]:not([stroke=none]){stroke:currentcolor}svg:not(.color-immutable)>:where(path,polygon,polyline):where(:not([stroke]):not([fill])),svg:not(.color-immutable) :where(:not([stroke]):not([fill])) :where(path,polygon,polyline):where(:not([stroke]):not([fill])){fill:currentcolor}`, x = "default";
+let X = (() => {
+  var c, m, p, n;
+  let s = C(j), a, i = [], l = [], d, f = [], _ = [], b, y = [], z = [];
+  return n = class extends s {
     constructor() {
-      super(...arguments);
-      p(this, c, l(this, f, _));
-      p(this, m, (l(this, y), l(this, z, null)));
-      p(this, h, (l(this, S), l(this, w, !1)));
-      l(this, N);
+      super();
+      g(this, c, r(this, i, x));
+      g(this, m, (r(this, l), r(this, f, null)));
+      g(this, p, (r(this, _), r(this, y, !1)));
+      r(this, z), this.internals.states.add("empty");
     }
     get _svgNamespace() {
-      return g(this, c);
+      return h(this, c);
     }
     set _svgNamespace(e) {
       u(this, c, e);
@@ -37,7 +34,7 @@ let et = (() => {
      * The icon svg content rendered on the page: <svg>...</svg>.
      */
     get _svgIcon() {
-      return g(this, m);
+      return h(this, m);
     }
     set _svgIcon(e) {
       u(this, m, e);
@@ -49,26 +46,26 @@ let et = (() => {
      * @default false
      */
     get noSanitize() {
-      return g(this, h);
+      return h(this, p);
     }
     set noSanitize(e) {
-      u(this, h, e);
+      u(this, p, e);
     }
     async loadSvgIcon(e) {
       if (!e)
         return;
-      const [t, r] = this._splitIconName(e);
-      this._svgNamespace = t, this.setAttribute("data-namespace", this._svgNamespace);
-      const x = this.fetchSvgIcon(this._svgNamespace, r);
-      this._svgIcon = x.then((T) => M(T));
+      const [t, o] = this._splitIconName(e);
+      this._svgNamespace && this.internals.states.delete(`namespace-${this._svgNamespace}`), this._svgNamespace = t, this._svgNamespace && this.internals.states.add(`namespace-${this._svgNamespace}`);
+      const I = this.fetchSvgIcon(this._svgNamespace, o);
+      this._svgIcon = I.then(($) => M($));
       try {
-        this.toggleAttribute("data-empty", !await x);
+        this.toggleState("empty", !await I);
       } catch {
-        this.toggleAttribute("data-empty", !0);
+        this.internals.states.add("empty");
       }
     }
     async fetchSvgIcon(e, t) {
-      return await F(e, t, !this.noSanitize);
+      return await H(e, t, !this.noSanitize);
     }
     _splitIconName(e) {
       if (!e)
@@ -76,7 +73,7 @@ let et = (() => {
       const t = e.split(":");
       switch (t.length) {
         case 1:
-          return [_, t[0]];
+          return [x, t[0]];
         case 2:
           return t;
         default:
@@ -84,25 +81,25 @@ let et = (() => {
       }
     }
     render() {
-      return E`<span class="sbb-icon-inner"
+      return N`<span class="sbb-icon-inner"
       >${O(
         this._svgIcon,
         // To reserve space, we need an empty svg to apply dimension to.
-        E`<svg width="0" height="0"></svg>`
+        N`<svg width="0" height="0"></svg>`
       )}</span
     >`;
     }
-  }, c = new WeakMap(), m = new WeakMap(), h = new WeakMap(), o = n, (() => {
-    const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(v[Symbol.metadata] ?? null) : void 0;
-    b = [D()], I = [D()], k = [H(), L({ attribute: "no-sanitize", type: Boolean })], d(n, null, b, { kind: "accessor", name: "_svgNamespace", static: !1, private: !1, access: { has: (t) => "_svgNamespace" in t, get: (t) => t._svgNamespace, set: (t, r) => {
-      t._svgNamespace = r;
-    } }, metadata: e }, f, y), d(n, null, I, { kind: "accessor", name: "_svgIcon", static: !1, private: !1, access: { has: (t) => "_svgIcon" in t, get: (t) => t._svgIcon, set: (t, r) => {
-      t._svgIcon = r;
-    } }, metadata: e }, z, S), d(n, null, k, { kind: "accessor", name: "noSanitize", static: !1, private: !1, access: { has: (t) => "noSanitize" in t, get: (t) => t.noSanitize, set: (t, r) => {
-      t.noSanitize = r;
-    } }, metadata: e }, w, N), d(null, a = { value: o }, s, { kind: "class", name: o.name, metadata: e }, null, i), o = a.value, e && Object.defineProperty(o, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
-  })(), n.styles = [q, G], n.role = "img", l(o, i), o;
+  }, c = new WeakMap(), m = new WeakMap(), p = new WeakMap(), (() => {
+    const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(s[Symbol.metadata] ?? null) : void 0;
+    a = [k()], d = [k()], b = [T(), L({ attribute: "no-sanitize", type: Boolean })], v(n, null, a, { kind: "accessor", name: "_svgNamespace", static: !1, private: !1, access: { has: (t) => "_svgNamespace" in t, get: (t) => t._svgNamespace, set: (t, o) => {
+      t._svgNamespace = o;
+    } }, metadata: e }, i, l), v(n, null, d, { kind: "accessor", name: "_svgIcon", static: !1, private: !1, access: { has: (t) => "_svgIcon" in t, get: (t) => t._svgIcon, set: (t, o) => {
+      t._svgIcon = o;
+    } }, metadata: e }, f, _), v(n, null, b, { kind: "accessor", name: "noSanitize", static: !1, private: !1, access: { has: (t) => "noSanitize" in t, get: (t) => t.noSanitize, set: (t, o) => {
+      t.noSanitize = o;
+    } }, metadata: e }, y, z), e && Object.defineProperty(n, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
+  })(), n.styles = [D, P], n.role = "img", n;
 })();
 export {
-  et as SbbIconBase
+  X as SbbIconBase
 };

package/icon/icon-validate.js

@@ -12,15 +12,15 @@ const a = (e) => typeof e == "string", s = (e) => {
         return !1;
   }
   return !0;
-}, l = (e, t = !0, o = !1) => {
+}, d = (e, t = !0, o = !1) => {
   const i = document.createElement("div");
   i.innerHTML = e;
   for (let r = i.childNodes.length - 1; r >= 0; r--)
     i.childNodes[r].nodeName.toLowerCase() !== "svg" && i.removeChild(i.childNodes[r]);
   const n = i.firstElementChild;
-  return n && n.nodeName.toLowerCase() === "svg" && (o && !n.classList.contains("color-immutable") && n.classList.add("color-immutable"), t === !1 || s(n)) ? i.innerHTML : "";
+  return n && n.nodeName.toLowerCase() === "svg" && (o && !n.classList.contains("color-immutable") && n.classList.add("color-immutable"), !t || s(n)) ? i.innerHTML : "";
 };
 export {
   s as isValid,
-  l as validateContent
+  d as validateContent
 };

package/{icon-sidebar-button-common-W6GYJbVt.js → icon-sidebar-button-common-ffAscVDk.js}

@@ -1,5 +1,5 @@
 import { css as o } from "lit";
-const i = o`:host{position:absolute;inset:0}`, b = o`:host{position:relative;display:block;height:100%;overflow:auto;outline-color:var(--sbb-focus-outline-color)}`, r = o`:host{display:block;outline:none!important;--sbb-icon-sidebar-button-transition-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );--sbb-icon-sidebar-button-transition-easing-function: var(--sbb-animation-easing);--sbb-icon-sidebar-button-dimension: var(--sbb-size-element-m);--sbb-icon-sidebar-button-border-radius: var(--sbb-border-radius-4x);--sbb-icon-sidebar-button-color: var(--sbb-color-granite);--sbb-icon-sidebar-button-color: light-dark(var(--sbb-color-granite), var(--sbb-color-graphite));--sbb-icon-sidebar-button-current-color: var(--sbb-color-3);--sbb-icon-sidebar-button-current-border-width: var(--sbb-border-width-3x);--sbb-icon-sidebar-button-current-border-inset-block: var(--sbb-spacing-fixed-2x);--sbb-icon-sidebar-button__current-border-inset-inline-start: 0;--sbb-icon-sidebar-button__color: var(--sbb-icon-sidebar-button-color)}@media(forced-colors:active){:host{--sbb-icon-sidebar-button-current-color: Highlight !important}}@media(forced-colors:active){:host([data-button]){--sbb-icon-sidebar-button-color: ButtonText !important}}@media(forced-colors:active){:host([data-link]){--sbb-icon-sidebar-button-color: LinkText !important}}@media(any-hover:hover){:host(:not(:active,[data-active]):hover){--sbb-icon-sidebar-button__hover-shift: .0625rem;--sbb-icon-sidebar-button__cursor: var(--sbb-cursor-pointer)}}.sbb-action-base{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:var(--sbb-icon-sidebar-button-dimension);padding-block:0 calc(2 * var(--sbb-icon-sidebar-button__hover-shift, 0rem));color:var(--sbb-icon-sidebar-button__color);border-radius:var(--sbb-icon-sidebar-button-border-radius);cursor:var(--sbb-icon-sidebar-button__cursor);-webkit-user-select:none;user-select:none;transition-duration:var(--sbb-icon-sidebar-button-transition-duration);transition-timing-function:var(--sbb-icon-sidebar-button-transition-easing-function);transition-property:color,padding}:host(.sbb-active) .sbb-action-base{color:var(--sbb-icon-sidebar-button-current-color)}:host(.sbb-active) .sbb-action-base:before{content:"";display:block;position:absolute;inset-block:var(--sbb-icon-sidebar-button-current-border-inset-block);inset-inline:var(--sbb-icon-sidebar-button__current-border-inset-inline-start) 0;border-inline-start:var(--sbb-icon-sidebar-button-current-border-width) solid currentcolor}:host(:focus-visible) .sbb-action-base,.sbb-action-base:focus-visible{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);outline-offset:calc(-1 * var(--sbb-focus-outline-width) - .3125rem)}`;
+const i = o`:host{position:absolute;inset:0}`, b = o`:host{position:relative;display:block;height:100%;overflow:auto;outline-color:var(--sbb-focus-outline-color)}`, r = o`:host{display:block;outline:none!important;--sbb-icon-sidebar-button-transition-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );--sbb-icon-sidebar-button-transition-easing-function: var(--sbb-animation-easing);--sbb-icon-sidebar-button-dimension: var(--sbb-size-element-m);--sbb-icon-sidebar-button-border-radius: var(--sbb-border-radius-4x);--sbb-icon-sidebar-button-color: var(--sbb-color-granite);--sbb-icon-sidebar-button-color: light-dark(var(--sbb-color-granite), var(--sbb-color-graphite));--sbb-icon-sidebar-button-current-color: var(--sbb-color-3);--sbb-icon-sidebar-button-current-border-width: var(--sbb-border-width-3x);--sbb-icon-sidebar-button-current-border-inset-block: var(--sbb-spacing-fixed-2x);--sbb-icon-sidebar-button__current-border-inset-inline-start: 0;--sbb-icon-sidebar-button__color: var(--sbb-icon-sidebar-button-color)}@media(forced-colors:active){:host{--sbb-icon-sidebar-button-current-color: Highlight !important}}@media(forced-colors:active){:host(:is(:state(button),[state--button])){--sbb-icon-sidebar-button-color: ButtonText !important}}@media(forced-colors:active){:host(:is(:state(link),[state--link])){--sbb-icon-sidebar-button-color: LinkText !important}}@media(any-hover:hover){:host(:not(:active,:is(:state(active),[state--active])):hover){--sbb-icon-sidebar-button__hover-shift: .0625rem;--sbb-icon-sidebar-button__cursor: var(--sbb-cursor-pointer)}}.sbb-action-base{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:var(--sbb-icon-sidebar-button-dimension);padding-block:0 calc(2 * var(--sbb-icon-sidebar-button__hover-shift, 0rem));color:var(--sbb-icon-sidebar-button__color);border-radius:var(--sbb-icon-sidebar-button-border-radius);cursor:var(--sbb-icon-sidebar-button__cursor);-webkit-user-select:none;user-select:none;transition-duration:var(--sbb-icon-sidebar-button-transition-duration);transition-timing-function:var(--sbb-icon-sidebar-button-transition-easing-function);transition-property:color,padding}:host(.sbb-active) .sbb-action-base{color:var(--sbb-icon-sidebar-button-current-color)}:host(.sbb-active) .sbb-action-base:before{content:"";display:block;position:absolute;inset-block:var(--sbb-icon-sidebar-button-current-border-inset-block);inset-inline:var(--sbb-icon-sidebar-button__current-border-inset-inline-start) 0;border-inline-start:var(--sbb-icon-sidebar-button-current-border-width) solid currentcolor}:host(:focus-visible) .sbb-action-base,.sbb-action-base:focus-visible{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);outline-offset:calc(-1 * var(--sbb-focus-outline-width) - .3125rem)}`;
 export {
   b as a,
   r as i,