@sbb-esta/lyne-elements 1.10.0 → 1.11.1

package/dialog/dialog/dialog.d.ts

@@ -31,7 +31,6 @@ export declare class SbbDialogElement extends SbbOverlayBaseElement {
     connectedCallback(): void;
     protected firstUpdated(changedProperties: PropertyValues<this>): void;
     protected willUpdate(changedProperties: PropertyValues<this>): void;
-    disconnectedCallback(): void;
     protected attachOpenOverlayEvents(): void;
     protected onOverlayAnimationEnd(event: AnimationEvent): void;
     protected setOverlayFocus(): void;

package/dialog/dialog/dialog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.d.ts","sourceRoot":"","sources":["../../../../src/elements/dialog/dialog/dialog.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAO1E,OAAO,EAAe,qBAAqB,EAAE,MAAM,kBAAkB,CAAC;AAMtE,OAAO,6BAA6B,CAAC;AAIrC;;;;;;;;;;;GAWG;AACH,qBACa,gBAAiB,SAAQ,qBAAqB;IACzD,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,6BAA6B;IACsB,cAAc,EAAE,OAAO,GAAG,MAAM,CAAW;IAM9F,OAAO,CAAC,4BAA4B,CAElC;IAEF,OAAO,CAAC,mBAAmB,CAAsC;IACjE,OAAO,CAAC,kBAAkB,CAAC,CAAS;IACpC,OAAO,CAAC,qBAAqB,CAA4B;IACzD,OAAO,CAAC,qBAAqB,CAAwC;IACrE,OAAO,CAAC,2BAA2B,CAAkB;IACrD,OAAO,CAAC,UAAU,CAAkB;IACpC,OAAO,CAAC,WAAW,CAAK;IACxB,OAAO,CAAC,SAAS,CAA4B;IAC7C,SAAS,CAAC,cAAc,EAAE,MAAM,CAAsB;IAEtD,2BAA2B;IACpB,IAAI,IAAI,IAAI;IA2BH,iBAAiB,IAAI,IAAI;cAYtB,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;cAO3D,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAQ5D,oBAAoB,IAAI,IAAI;cAKzB,uBAAuB,IAAI,IAAI;IAgBlD,SAAS,CAAC,qBAAqB,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI;IAsC5D,SAAS,CAAC,eAAe,IAAI,IAAI;IAQjC,OAAO,CAAC,aAAa;IAUrB,OAAO,CAAC,gBAAgB;IAqCxB,OAAO,CAAC,oBAAoB,CAS1B;IAGF,OAAO,CAAC,qBAAqB,CAc3B;IAEF,OAAO,CAAC,sBAAsB;IAK9B,OAAO,CAAC,gBAAgB;IASxB,OAAO,CAAC,2BAA2B;IAYnC,OAAO,CAAC,0BAA0B;cAMf,MAAM,IAAI,cAAc;CAmB5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,YAAY,EAAE,gBAAgB,CAAC;KAChC;CACF"}
+{"version":3,"file":"dialog.d.ts","sourceRoot":"","sources":["../../../../src/elements/dialog/dialog/dialog.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAM1E,OAAO,EAAe,qBAAqB,EAAE,MAAM,kBAAkB,CAAC;AAMtE,OAAO,6BAA6B,CAAC;AAIrC;;;;;;;;;;;GAWG;AACH,qBACa,gBAAiB,SAAQ,qBAAqB;IACzD,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,6BAA6B;IACsB,cAAc,EAAE,OAAO,GAAG,MAAM,CAAW;IAM9F,OAAO,CAAC,4BAA4B,CAIjC;IAEH,OAAO,CAAC,mBAAmB,CAAsC;IACjE,OAAO,CAAC,kBAAkB,CAAC,CAAS;IACpC,OAAO,CAAC,qBAAqB,CAA4B;IACzD,OAAO,CAAC,qBAAqB,CAAwC;IACrE,OAAO,CAAC,2BAA2B,CAAkB;IACrD,OAAO,CAAC,UAAU,CAAkB;IACpC,OAAO,CAAC,WAAW,CAAK;IACxB,OAAO,CAAC,SAAS,CAA4B;IAC7C,SAAS,CAAC,cAAc,EAAE,MAAM,CAAsB;IAEtD,2BAA2B;IACpB,IAAI,IAAI,IAAI;IA2BH,iBAAiB,IAAI,IAAI;cAYtB,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;cAO3D,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;cAQzD,uBAAuB,IAAI,IAAI;IAgBlD,SAAS,CAAC,qBAAqB,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI;IAwC5D,SAAS,CAAC,eAAe,IAAI,IAAI;IAQjC,OAAO,CAAC,aAAa;IAUrB,OAAO,CAAC,gBAAgB;IAqCxB,OAAO,CAAC,oBAAoB,CAS1B;IAGF,OAAO,CAAC,qBAAqB,CAc3B;IAEF,OAAO,CAAC,sBAAsB;IAK9B,OAAO,CAAC,gBAAgB;IASxB,OAAO,CAAC,2BAA2B;IAYnC,OAAO,CAAC,0BAA0B;cAMf,MAAM,IAAI,cAAc;CAmB5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,YAAY,EAAE,gBAAgB,CAAC;KAChC;CACF"}

package/dialog/dialog.js

@@ -1,8 +1,8 @@
-import { property as h, customElement as c } from "lit/decorators.js";
-import { html as g } from "lit/static-html.js";
-import { setModalityOnNextFocus as r, getFirstFocusableElement as m } from "../core/a11y.js";
-import { isBreakpoint as v } from "../core/dom.js";
-import { AgnosticResizeObserver as p } from "../core/observers.js";
+import { ResizeController as h } from "@lit-labs/observers/resize-controller.js";
+import { property as c, customElement as g } from "lit/decorators.js";
+import { html as m } from "lit/static-html.js";
+import { setModalityOnNextFocus as r, getFirstFocusableElement as v } from "../core/a11y.js";
+import { isBreakpoint as p } from "../core/dom.js";
 import { SbbOverlayBaseElement as u, overlayRefs as d } from "../overlay.js";
 import { css as f } from "lit";
 import "../screen-reader-only.js";
@@ -14,9 +14,11 @@ var w = Object.defineProperty, E = Object.getOwnPropertyDescriptor, b = (t, e, a
 };
 let y = 0, s = class extends u {
   constructor() {
-    super(...arguments), this.backdropAction = "close", this._dialogContentResizeObserver = new p(
-      () => setTimeout(() => this._onContentResize())
-    ), this._dialogTitleElement = null, this._dialogContentElement = null, this._dialogActionsElement = null, this._isPointerDownEventOnDialog = !1, this._overflows = !1, this._lastScroll = 0, this._dialogId = `sbb-dialog-${y++}`, this.closeAttribute = "sbb-dialog-close", this._pointerDownListener = (t) => {
+    super(...arguments), this.backdropAction = "close", this._dialogContentResizeObserver = new h(this, {
+      target: null,
+      skipInitial: !0,
+      callback: () => setTimeout(() => this._onContentResize())
+    }), this._dialogTitleElement = null, this._dialogContentElement = null, this._dialogActionsElement = null, this._isPointerDownEventOnDialog = !1, this._overflows = !1, this._lastScroll = 0, this._dialogId = `sbb-dialog-${y++}`, this.closeAttribute = "sbb-dialog-close", this._pointerDownListener = (t) => {
       this.backdropAction === "close" && (this._isPointerDownEventOnDialog = t.composedPath().filter((e) => e instanceof window.HTMLElement).some((e) => e.id === this._dialogId));
     }, this._closeOnBackdropClick = (t) => {
       this.backdropAction === "close" && !this._isPointerDownEventOnDialog && !t.composedPath().filter((e) => e instanceof window.HTMLElement).some((e) => e.id === this._dialogId) && this.close();
@@ -40,9 +42,6 @@ let y = 0, s = class extends u {
   willUpdate(t) {
     super.willUpdate(t), t.has("negative") && this._syncNegative();
   }
-  disconnectedCallback() {
-    super.disconnectedCallback(), this._dialogContentResizeObserver.disconnect();
-  }
   attachOpenOverlayEvents() {
     var t;
     super.attachOpenOverlayEvents(), (t = this._dialogContentElement) == null || t.addEventListener("scroll", () => this._onContentScroll(), {
@@ -64,14 +63,14 @@ let y = 0, s = class extends u {
           this.accessibilityLabel || ((o = this._dialogTitleElement) == null ? void 0 : o.innerText.trim())
         );
       }
-    ), this.focusHandler.trap(this)) : t.animationName === "close" && this.state === "closing" && (this._setHideHeaderDataAttribute(!1), (e = this._dialogContentElement) == null || e.scrollTo(0, 0), this.state = "closed", this.inertController.deactivate(), r(this.lastFocusedElement), (a = this.lastFocusedElement) == null || a.focus(), (i = this.openOverlayController) == null || i.abort(), this.focusHandler.disconnect(), this._dialogContentResizeObserver.disconnect(), this.removeInstanceFromGlobalCollection(), d.length || this.scrollHandler.enableScroll(), this.didClose.emit({
+    ), this.focusHandler.trap(this)) : t.animationName === "close" && this.state === "closing" && (this._setHideHeaderDataAttribute(!1), (e = this._dialogContentElement) == null || e.scrollTo(0, 0), this.state = "closed", this.inertController.deactivate(), r(this.lastFocusedElement), (a = this.lastFocusedElement) == null || a.focus(), (i = this.openOverlayController) == null || i.abort(), this.focusHandler.disconnect(), this._dialogContentElement && this._dialogContentResizeObserver.unobserve(this._dialogContentElement), this.removeInstanceFromGlobalCollection(), d.length || this.scrollHandler.enableScroll(), this.didClose.emit({
       returnValue: this.returnValue,
       closeTarget: this.overlayCloseElement
     }));
   }
   // Set focus on the first focusable element.
   setOverlayFocus() {
-    const t = m(
+    const t = v(
       Array.from(this.children).filter((e) => e instanceof window.HTMLElement)
     );
     r(t), t == null || t.focus();
@@ -95,7 +94,7 @@ let y = 0, s = class extends u {
   }
   _setHideHeaderDataAttribute(t) {
     var i;
-    const e = ((i = this._dialogTitleElement) == null ? void 0 : i.hideOnScroll) ?? !1, a = typeof e == "boolean" ? e : v("zero", e, { includeMaxBreakpoint: !0 });
+    const e = ((i = this._dialogTitleElement) == null ? void 0 : i.hideOnScroll) ?? !1, a = typeof e == "boolean" ? e : p("zero", e, { includeMaxBreakpoint: !0 });
     this.toggleAttribute("data-hide-header", a ? t : !1), this._dialogTitleElement && this._dialogTitleElement.toggleAttribute("data-hide-header", a ? t : !1);
   }
   _setOverflowsDataAttribute() {
@@ -103,7 +102,7 @@ let y = 0, s = class extends u {
     this.toggleAttribute("data-overflows", this._overflows), (t = this._dialogTitleElement) == null || t.toggleAttribute("data-overflows", this._overflows), (e = this._dialogActionsElement) == null || e.toggleAttribute("data-overflows", this._overflows);
   }
   render() {
-    return g`
+    return m`
       <div class="sbb-dialog__container">
         <div
           @animationend=${(t) => this.onOverlayAnimationEnd(t)}
@@ -124,10 +123,10 @@ let y = 0, s = class extends u {
 };
 s.styles = _;
 b([
-  h({ attribute: "backdrop-action" })
+  c({ attribute: "backdrop-action" })
 ], s.prototype, "backdropAction", 2);
 s = b([
-  c("sbb-dialog")
+  g("sbb-dialog")
 ], s);
 export {
   s as SbbDialogElement

package/expansion-panel/expansion-panel-header/expansion-panel-header.d.ts

@@ -1,6 +1,6 @@
 import { CSSResultGroup, TemplateResult } from 'lit';
 import { SbbButtonBaseElement } from '../../core/base-elements.js';
-declare const SbbExpansionPanelHeaderElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../icon.js').SbbIconNameMixinType> & typeof SbbButtonBaseElement;
+declare const SbbExpansionPanelHeaderElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType & import('../../core/mixins.js').SbbDisabledInteractiveMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../icon.js').SbbIconNameMixinType> & typeof SbbButtonBaseElement;
 /**
  * It acts as a native `summary` tag for the `sbb-expansion-panel` component.
  *

package/expansion-panel/expansion-panel-header.js

@@ -4,7 +4,7 @@ import { SbbButtonBaseElement as c } from "../core/base-elements.js";
 import { SbbConnectedAbortController as h, SbbSlotStateController as x } from "../core/controllers.js";
 import { hostAttributes as g } from "../core/decorators.js";
 import { EventEmitter as m } from "../core/eventing.js";
-import { SbbFocusableDisabledActionMixin as v } from "../core/mixins.js";
+import { SbbDisabledTabIndexActionMixin as v } from "../core/mixins.js";
 import { SbbIconNameMixin as f } from "../icon.js";
 const u = l`*,:before,:after{box-sizing:border-box}:host{display:block;--sbb-expansion-panel-header-cursor: pointer;--sbb-expansion-panel-header-text-color: var(--sbb-color-charcoal);--sbb-expansion-panel-header-gap: var(--sbb-spacing-fixed-6x);--sbb-expansion-panel-header-padding-block: var(--sbb-spacing-responsive-xs);--sbb-expansion-panel-header-padding-inline: var(--sbb-spacing-fixed-6x)}@media (forced-colors: active){:host{--sbb-expansion-panel-header-text-color: ButtonText}}:host([data-size=s]){--sbb-expansion-panel-header-gap: var(--sbb-spacing-fixed-2x);--sbb-expansion-panel-header-padding-block: var(--sbb-spacing-fixed-3x);--sbb-expansion-panel-header-padding-inline: var(--sbb-spacing-fixed-5x)}:host([disabled]){--sbb-expansion-panel-header-cursor: default;--sbb-expansion-panel-header-text-color: var(--sbb-color-granite)}@media (forced-colors: active){:host([disabled]){--sbb-expansion-panel-header-text-color: GrayText}}:host(:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch])){outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width);outline-offset:var(--sbb-spacing-fixed-1x);border-radius:var(--sbb-expansion-panel-border-radius)}.sbb-expansion-panel-header{--sbb-text-font-size: var(--sbb-font-size-text-l);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);display:flex;justify-content:space-between;align-items:center;gap:var(--sbb-expansion-panel-header-gap);width:100%;padding:var(--sbb-expansion-panel-header-padding-block) var(--sbb-expansion-panel-header-padding-inline);text-align:start;cursor:var(--sbb-expansion-panel-header-cursor);color:var(--sbb-expansion-panel-header-text-color);-webkit-tap-highlight-color:transparent}.sbb-expansion-panel-header__title,.sbb-expansion-panel-header__toggle,.sbb-expansion-panel-header__icon{display:flex}.sbb-expansion-panel-header__icon{width:var(--sbb-expansion-panel-icon-size);--sbb-icon-svg-width: var(--sbb-expansion-panel-icon-size);--sbb-icon-svg-height: var(--sbb-expansion-panel-icon-size)}:host(:not([data-slot-names~=icon],[icon-name])) .sbb-expansion-panel-header__icon{display:none}.sbb-expansion-panel-header__title{align-items:center;gap:var(--sbb-expansion-panel-title-gap);overflow:hidden;min-height:var(--sbb-size-icon-ui-medium)}.sbb-expansion-panel-header__toggle-icon{transition:transform var(--sbb-disable-animation-zero-time, var(--sbb-animation-duration-4x))}:host([aria-expanded]:not([aria-expanded=false])) .sbb-expansion-panel-header__toggle-icon{transform:rotate(-180deg)}`;
 var _ = Object.defineProperty, E = Object.getOwnPropertyDescriptor, w = (e, n, o, t) => {

package/flip-card/flip-card-details/flip-card-details.d.ts

@@ -1,4 +1,4 @@
-import { CSSResultGroup, PropertyValues, TemplateResult, LitElement } from 'lit';
+import { CSSResultGroup, TemplateResult, LitElement } from 'lit';
 /**
  * Combined with a `sbb-flip-card`, it displays its content when the card is flipped.
  *
@@ -6,11 +6,8 @@ import { CSSResultGroup, PropertyValues, TemplateResult, LitElement } from 'lit'
  */
 export declare class SbbFlipCardDetailsElement extends LitElement {
     static styles: CSSResultGroup;
-    private _flipCardMutationObserver;
+    constructor();
     private _checkForSlottedActions;
-    connectedCallback(): void;
-    protected firstUpdated(changedProperties: PropertyValues): void;
-    disconnectedCallback(): void;
     protected render(): TemplateResult;
 }
 declare global {

package/flip-card/flip-card-details/flip-card-details.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"flip-card-details.d.ts","sourceRoot":"","sources":["../../../../src/elements/flip-card/flip-card-details/flip-card-details.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AASvC;;;;GAIG;AACH,qBAIa,yBAA0B,SAAQ,UAAU;IACvD,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,OAAO,CAAC,yBAAyB,CAE/B;IAEF,OAAO,CAAC,uBAAuB;IAQf,iBAAiB,IAAI,IAAI;cAStB,YAAY,CAAC,iBAAiB,EAAE,cAAc,GAAG,IAAI;IAKxD,oBAAoB,IAAI,IAAI;cAKzB,MAAM,IAAI,cAAc;CAS5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,uBAAuB,EAAE,yBAAyB,CAAC;KACpD;CACF"}
+{"version":3,"file":"flip-card-details.d.ts","sourceRoot":"","sources":["../../../../src/elements/flip-card/flip-card-details/flip-card-details.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1D,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAQvC;;;;GAIG;AACH,qBAIa,yBAA0B,SAAQ,UAAU;IACvD,OAAuB,MAAM,EAAE,cAAc,CAAS;;IActD,OAAO,CAAC,uBAAuB;cAQZ,MAAM,IAAI,cAAc;CAS5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,uBAAuB,EAAE,yBAAyB,CAAC;KACpD;CACF"}

package/flip-card/flip-card-details.js

@@ -1,39 +1,31 @@
-import { css as o, LitElement as n, html as b } from "lit";
+import { MutationController as o } from "@lit-labs/observers/mutation-controller.js";
+import { css as b, LitElement as n, html as p } from "lit";
 import { customElement as c } from "lit/decorators.js";
-import { IS_FOCUSABLE_QUERY as p } from "../core/a11y.js";
-import { hostAttributes as f } from "../core/decorators.js";
-import { AgnosticMutationObserver as v } from "../core/observers.js";
-const m = o`*,:before,:after{box-sizing:border-box}:host{--sbb-flip-card-details-opacity: 0;--sbb-flip-card-details-translate-y: var(--sbb-spacing-fixed-2x);--sbb-flip-card-details-transition-delay: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-5x) );--sbb-flip-card-details-padding: var(--sbb-spacing-responsive-s);--sbb-flip-card-details-padding-block-end: calc( var(--sbb-spacing-responsive-s) + var(--sbb-spacing-responsive-xs) + var(--sbb-size-element-m) );display:contents}.sbb-flip-card-details--wrapper{display:grid;grid-template-rows:0fr;pointer-events:none;color:var(--sbb-color-milk);opacity:var(--sbb-flip-card-details-opacity);transform:translateY(var(--sbb-flip-card-details-translate-y));transition-property:grid-template-rows,transform,opacity;transition-duration:var(--sbb-flip-card-details-transition-duration)}:host([data-flipped]) .sbb-flip-card-details--wrapper{grid-template-rows:1fr;transition-delay:0s,var(--sbb-flip-card-details-transition-delay),var(--sbb-flip-card-details-transition-delay)}.sbb-flip-card-details{overflow:hidden;padding:var(--sbb-flip-card-details-padding);padding-block-end:var(--sbb-flip-card-details-padding-block-end)}`;
-var u = Object.defineProperty, h = Object.getOwnPropertyDescriptor, g = (t, r, s, a) => {
-  for (var e = a > 1 ? void 0 : a ? h(r, s) : r, i = t.length - 1, l; i >= 0; i--)
-    (l = t[i]) && (e = (a ? l(r, s, e) : l(e)) || e);
-  return a && e && u(r, s, e), e;
+import { IS_FOCUSABLE_QUERY as f } from "../core/a11y.js";
+import { hostAttributes as v } from "../core/decorators.js";
+const m = b`*,:before,:after{box-sizing:border-box}:host{--sbb-flip-card-details-opacity: 0;--sbb-flip-card-details-translate-y: var(--sbb-spacing-fixed-2x);--sbb-flip-card-details-transition-delay: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-5x) );--sbb-flip-card-details-padding: var(--sbb-spacing-responsive-s);--sbb-flip-card-details-padding-block-end: calc( var(--sbb-spacing-responsive-s) + var(--sbb-spacing-responsive-xs) + var(--sbb-size-element-m) );display:contents}.sbb-flip-card-details--wrapper{display:grid;grid-template-rows:0fr;pointer-events:none;color:var(--sbb-color-milk);opacity:var(--sbb-flip-card-details-opacity);transform:translateY(var(--sbb-flip-card-details-translate-y));transition-property:grid-template-rows,transform,opacity;transition-duration:var(--sbb-flip-card-details-transition-duration)}:host([data-flipped]) .sbb-flip-card-details--wrapper{grid-template-rows:1fr;transition-delay:0s,var(--sbb-flip-card-details-transition-delay),var(--sbb-flip-card-details-transition-delay)}.sbb-flip-card-details{overflow:hidden;padding:var(--sbb-flip-card-details-padding);padding-block-end:var(--sbb-flip-card-details-padding-block-end)}`;
+var u = Object.defineProperty, y = Object.getOwnPropertyDescriptor, g = (s, r, t, i) => {
+  for (var a = i > 1 ? void 0 : i ? y(r, t) : r, e = s.length - 1, l; e >= 0; e--)
+    (l = s[e]) && (a = (i ? l(r, t, a) : l(a)) || a);
+  return i && a && u(r, t, a), a;
 };
 let d = class extends n {
   constructor() {
-    super(...arguments), this._flipCardMutationObserver = new v(
-      () => this._checkForSlottedActions()
-    );
+    super(), new o(this, {
+      config: {
+        childList: !0,
+        subtree: !0
+      },
+      callback: () => this._checkForSlottedActions()
+    });
   }
   _checkForSlottedActions() {
     var r;
-    const t = "data-card-focusable";
-    Array.from(((r = this.querySelectorAll) == null ? void 0 : r.call(this, p)) ?? []).filter((s) => !s.hasAttribute(t)).forEach((s) => s.setAttribute(t, ""));
-  }
-  connectedCallback() {
-    super.connectedCallback(), this._checkForSlottedActions(), this._flipCardMutationObserver.observe(this, {
-      childList: !0,
-      subtree: !0
-    });
-  }
-  firstUpdated(t) {
-    super.firstUpdated(t), this._checkForSlottedActions();
-  }
-  disconnectedCallback() {
-    super.disconnectedCallback(), this._flipCardMutationObserver.disconnect();
+    const s = "data-card-focusable";
+    Array.from(((r = this.querySelectorAll) == null ? void 0 : r.call(this, f)) ?? []).filter((t) => !t.hasAttribute(s)).forEach((t) => t.setAttribute(s, ""));
   }
   render() {
-    return b`
+    return p`
       <div class="sbb-flip-card-details--wrapper">
         <div class="sbb-flip-card-details">
           <slot></slot>
@@ -45,7 +37,7 @@ let d = class extends n {
 d.styles = m;
 d = g([
   c("sbb-flip-card-details"),
-  f({
+  v({
     slot: "details"
   })
 ], d);

package/form-field/form-field/form-field.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"form-field.d.ts","sourceRoot":"","sources":["../../../../src/elements/form-field/form-field/form-field.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAQ,UAAU,EAAW,MAAM,KAAK,CAAC;AAehD,OAAO,eAAe,CAAC;;AAOvB;;;;;;;;GAQG;AACH,qBAEa,mBAAoB,SAAQ,wBAA+C;IACtF,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,OAAO,CAAC,QAAQ,CAAC,6BAA6B,CAAmC;IAEjF,OAAO,CAAC,QAAQ,CAAC,uBAAuB,CAItC;IAEF,OAAO,CAAC,QAAQ,CAAC,sBAAsB,CAA6B;IAEpE,OAAO,CAAC,QAAQ,CAAC,oCAAoC,CAKnD;IAEF,OAAO,CAAC,QAAQ,CAAC,iCAAiC,CAQhD;IAEF;;;;OAIG;IAEI,UAAU,CAAC,EAAE,MAAM,GAAG,SAAS,CAAU;IAEhD,+CAA+C;IACX,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEvD,mCAAmC;IACC,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,CAAO;IAEjE,0DAA0D;IACP,UAAU,UAAS;IAEtE;;+EAE2E;IACvC,KAAK,EAAE,SAAS,GAAG,UAAU,CAAa;IAE9E,wFAAwF;IACV,WAAW,UAAS;IAElG,4FAA4F;IACZ,aAAa,UACrF;IAER,qDAAqD;IAC5C,OAAO,CAAC,cAAc,CAAiB;IAEhD,oEAAoE;IACpE,OAAO,CAAC,6BAA6B,CAAC,CAAgB;IAEtD,8CAA8C;IACrC,OAAO,CAAC,MAAM,CAAC,CAAqD;IAE7E,+CAA+C;IACtC,OAAO,CAAC,MAAM,CAAC,CAAmB;IAE3C,iCAAiC;IACjC,IAAW,YAAY,IAAI,gBAAgB,GAAG,iBAAiB,GAAG,WAAW,GAAG,SAAS,CAExF;IAED,OAAO,CAAC,MAAM,CAAyC;IACvD,OAAO,CAAC,SAAS,CAAmC;IAEpD;;OAEG;IACH,OAAO,CAAC,2BAA2B,CAMjC;IAEF,OAAO,CAAC,qBAAqB,CAAyB;IAEtC,iBAAiB,IAAI,IAAI;cAStB,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAQ5D,oBAAoB,IAAI,IAAI;IAM5C,OAAO,CAAC,YAAY;IAMpB,OAAO,CAAC,aAAa;IAMrB,OAAO,CAAC,mBAAmB;IAa3B,OAAO,CAAC,gBAAgB;IAUxB,OAAO,CAAC,kBAAkB;IAW1B;;OAEG;IACH,OAAO,CAAC,kBAAkB;IA4B1B,OAAO,CAAC,yBAAyB;IA4BjC,OAAO,CAAC,sBAAsB;IAuD9B,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,yBAAyB;IAQjC,OAAO,CAAC,aAAa;IAerB,OAAO,CAAC,kBAAkB;IAK1B,OAAO,CAAC,YAAY;IAOpB,OAAO,CAAC,eAAe;IAevB;;OAEG;IACH,OAAO,CAAC,kBAAkB;IAsB1B,OAAO,CAAC,qBAAqB;IAiB7B,qFAAqF;IAC9E,KAAK,IAAI,IAAI;IAIpB,4FAA4F;IACrF,KAAK,IAAI,IAAI;IAQpB;;;OAGG;IACI,eAAe,IAAI,gBAAgB,GAAG,iBAAiB,GAAG,WAAW,GAAG,SAAS;IAIxF,OAAO,CAAC,aAAa;cAMF,MAAM,IAAI,cAAc;CAmC5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,gBAAgB,EAAE,mBAAmB,CAAC;KACvC;CACF"}
+{"version":3,"file":"form-field.d.ts","sourceRoot":"","sources":["../../../../src/elements/form-field/form-field/form-field.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAY,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAC9F,OAAO,EAAQ,UAAU,EAAW,MAAM,KAAK,CAAC;AAchD,OAAO,eAAe,CAAC;;AAOvB;;;;;;;;GAQG;AACH,qBAEa,mBAAoB,SAAQ,wBAA+C;IACtF,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,OAAO,CAAC,QAAQ,CAAC,6BAA6B,CAAmC;IAEjF,OAAO,CAAC,QAAQ,CAAC,uBAAuB,CAItC;IAEF,OAAO,CAAC,QAAQ,CAAC,sBAAsB,CAA6B;IAEpE,OAAO,CAAC,QAAQ,CAAC,oCAAoC,CAKnD;IAEF,OAAO,CAAC,QAAQ,CAAC,iCAAiC,CAQhD;IAEF;;;;OAIG;IAEI,UAAU,CAAC,EAAE,MAAM,GAAG,SAAS,CAAU;IAEhD,+CAA+C;IACX,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEvD,mCAAmC;IACC,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,CAAO;IAEjE,0DAA0D;IACP,UAAU,UAAS;IAEtE;;+EAE2E;IACvC,KAAK,EAAE,SAAS,GAAG,UAAU,CAAa;IAE9E,wFAAwF;IACV,WAAW,UAAS;IAElG,4FAA4F;IACZ,aAAa,UACrF;IAER,qDAAqD;IAC5C,OAAO,CAAC,cAAc,CAAiB;IAEhD,oEAAoE;IACpE,OAAO,CAAC,6BAA6B,CAAC,CAAgB;IAEtD,8CAA8C;IACrC,OAAO,CAAC,MAAM,CAAC,CAAqD;IAE7E,+CAA+C;IACtC,OAAO,CAAC,MAAM,CAAC,CAAmB;IAE3C,iCAAiC;IACjC,IAAW,YAAY,IAAI,gBAAgB,GAAG,iBAAiB,GAAG,WAAW,GAAG,SAAS,CAExF;IAED,OAAO,CAAC,MAAM,CAAyC;IACvD,OAAO,CAAC,SAAS,CAAmC;IAEpD;;OAEG;IACH,OAAO,CAAC,2BAA2B,CAM1B;IAET,OAAO,CAAC,qBAAqB,CAAyB;IAEtC,iBAAiB,IAAI,IAAI;cAStB,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAQ5D,oBAAoB,IAAI,IAAI;IAM5C,OAAO,CAAC,YAAY;IAMpB,OAAO,CAAC,aAAa;IAMrB,OAAO,CAAC,mBAAmB;IAa3B,OAAO,CAAC,gBAAgB;IAUxB,OAAO,CAAC,kBAAkB;IAW1B;;OAEG;IACH,OAAO,CAAC,kBAAkB;IA4B1B,OAAO,CAAC,yBAAyB;IA4BjC,OAAO,CAAC,sBAAsB;IAuD9B,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,yBAAyB;IAQjC,OAAO,CAAC,aAAa;IAerB,OAAO,CAAC,kBAAkB;IAK1B,OAAO,CAAC,YAAY;IAOpB,OAAO,CAAC,eAAe;IAevB;;OAEG;IACH,OAAO,CAAC,kBAAkB;IAsB1B,OAAO,CAAC,qBAAqB;IAiB7B,qFAAqF;IAC9E,KAAK,IAAI,IAAI;IAIpB,4FAA4F;IACrF,KAAK,IAAI,IAAI;IAQpB;;;OAGG;IACI,eAAe,IAAI,gBAAgB,GAAG,iBAAiB,GAAG,WAAW,GAAG,SAAS;IAIxF,OAAO,CAAC,aAAa;cAMF,MAAM,IAAI,cAAc;CAmC5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,gBAAgB,EAAE,mBAAmB,CAAC;KACvC;CACF"}

package/form-field/form-field.js

@@ -1,22 +1,21 @@
-import { css as h, LitElement as u, html as d, nothing as f } from "lit";
-import { property as b, state as c, customElement as v } from "lit/decorators.js";
-import { sbbInputModalityDetector as g } from "../core/a11y.js";
-import { SbbConnectedAbortController as _, SbbLanguageController as x } from "../core/controllers.js";
-import { slotState as y } from "../core/decorators.js";
-import { isFirefox as w, setOrRemoveAttribute as k } from "../core/dom.js";
-import { i18nOptional as A } from "../core/i18n.js";
-import { SbbNegativeMixin as E, SbbHydrationMixin as z } from "../core/mixins.js";
-import { AgnosticMutationObserver as I } from "../core/observers.js";
+import { css as m, LitElement as u, isServer as v, html as d, nothing as f } from "lit";
+import { property as b, state as c, customElement as g } from "lit/decorators.js";
+import { sbbInputModalityDetector as _ } from "../core/a11y.js";
+import { SbbConnectedAbortController as x, SbbLanguageController as y } from "../core/controllers.js";
+import { slotState as w } from "../core/decorators.js";
+import { isFirefox as k, setOrRemoveAttribute as A } from "../core/dom.js";
+import { i18nOptional as E } from "../core/i18n.js";
+import { SbbNegativeMixin as z, SbbHydrationMixin as I } from "../core/mixins.js";
 import "../icon.js";
-const L = h`@charset "UTF-8";*,:before,:after{box-sizing:border-box}:host{display:inline-block;--sbb-form-field-background-color: var(--sbb-color-white);--sbb-form-field-border-color: var(--sbb-color-smoke);--sbb-form-field-border-style: solid;--sbb-form-field-border-radius: var(--sbb-border-radius-4x);--sbb-form-field-border-width: var(--sbb-border-width-1x);--sbb-form-field-min-height: var(--sbb-size-element-m);--sbb-form-field-label-color: var(--sbb-color-metal);--sbb-form-field-prefix-color: var(--sbb-color-metal);--sbb-form-field-padding-inline: var(--sbb-spacing-fixed-3x);--sbb-form-field-text-color: var(--sbb-color-charcoal);--sbb-form-field-arrow-color: var(--sbb-color-charcoal);--sbb-form-field-error-divider-width: var(--sbb-spacing-fixed-1x);--sbb-form-field-error-padding-block-start: var(--sbb-form-field-error-divider-width);--sbb-form-field-gap: var(--sbb-spacing-fixed-2x);--sbb-form-field-label-to-input-overlapping: var(--sbb-spacing-fixed-1x);--sbb-form-field-select-inline-padding-end: calc( var(--sbb-icon-svg-width) + var(--sbb-form-field-gap) );--sbb-form-field-overflow: hidden;--sbb-form-field-input-text-size: var(--sbb-font-size-text-m);--sbb-form-field-label-text-size: var(--sbb-font-size-text-xs);--sbb-form-field-label-size: calc( var(--sbb-form-field-label-text-size) * var(--sbb-typo-line-height-body-text) );--sbb-form-field-text-line-height: calc( var(--sbb-form-field-input-text-size) * var(--sbb-typo-line-height-body-text) );--sbb-form-field-margin-block-start: calc( ( var(--sbb-form-field-min-height) - var(--sbb-form-field-label-size) - var( --sbb-form-field-text-line-height ) + var(--sbb-form-field-label-to-input-overlapping) ) / 2 );--sbb-form-field-spacer-margin-block-end: calc( -1 * var(--sbb-form-field-label-to-input-overlapping) );--sbb-form-field-floating-label-transform: .53125rem;--sbb-icon-svg-width: var(--sbb-size-icon-ui-small);--sbb-icon-svg-height: var(--sbb-size-icon-ui-small);--sbb-focus-outline-color: var(--sbb-focus-outline-color-default)}@media (min-width: 52.5rem){:host{--sbb-form-field-floating-label-transform: .65625rem}}@media (forced-colors: active){:host{--sbb-form-field-border-color: ButtonBorder}}:host(:where(:not([width=collapse]))){min-width:9.375rem;width:min(18.75rem,100%)}:host([negative]){--sbb-form-field-background-color: var(--sbb-color-midnight);--sbb-form-field-border-color: var(--sbb-color-smoke);--sbb-form-field-label-color: var(--sbb-color-smoke);--sbb-form-field-prefix-color: var(--sbb-color-smoke);--sbb-form-field-text-color: var(--sbb-color-milk);--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);--sbb-form-field-arrow-color: var(--sbb-color-milk)}@media (forced-colors: active){:host([negative]){--sbb-form-field-border-color: ButtonBorder}}:host([size=s]){--sbb-form-field-min-height: var(--sbb-size-element-xs);--sbb-form-field-padding-inline: var(--sbb-spacing-fixed-2x);--sbb-form-field-input-text-size: var(--sbb-font-size-text-s);--sbb-form-field-label-text-size: var(--sbb-font-size-text-xxs);--sbb-form-field-label-to-input-overlapping: .625rem;--sbb-form-field-floating-label-transform: .34375rem;--sbb-form-field-spacer-margin-block-end: -.53125rem}@media (min-width: 52.5rem){:host([size=s]){--sbb-form-field-label-to-input-overlapping: .6875rem;--sbb-form-field-floating-label-transform: .3125rem;--sbb-form-field-spacer-margin-block-end: -.5rem}}:host([size=l]){--sbb-form-field-min-height: var(--sbb-size-element-l);--sbb-form-field-padding-inline: var(--sbb-spacing-responsive-xxxs)}:host([error-space=reserve]){--sbb-form-field-error-min-height: calc( var(--sbb-typo-line-height-body-text) * var(--sbb-font-size-text-xs) );--sbb-form-field-error-padding-block-start-override: var(--sbb-form-field-error-divider-width)}:host(:is([data-readonly],[data-disabled])){--sbb-form-field-background-color: var(--sbb-color-milk);--sbb-form-field-border-color: var(--sbb-color-graphite);--sbb-form-field-arrow-color: var(--sbb-color-granite)}@media (forced-colors: active){:host(:is([data-readonly],[data-disabled])){--sbb-form-field-border-color: ButtonBorder}}:host(:is([data-readonly],[data-disabled])[negative]){--sbb-form-field-background-color: var(--sbb-color-charcoal);--sbb-form-field-border-color: var(--sbb-color-smoke);--sbb-form-field-arrow-color: var(--sbb-color-smoke)}:host([data-disabled]){--sbb-form-field-label-color: var(--sbb-color-granite);--sbb-form-field-prefix-color: var(--sbb-color-granite);--sbb-form-field-border-style: dashed}@media (forced-colors: active){:host([data-disabled]){--sbb-form-field-label-color: GrayText !important;--sbb-form-field-prefix-color: GrayText !important;--sbb-form-field-text-color: GrayText !important;--sbb-form-field-border-color: GrayText !important}}:host([data-disabled][negative]){--sbb-form-field-text-color: var(--sbb-color-smoke);--sbb-form-field-label-color: var(--sbb-color-smoke);--sbb-form-field-prefix-color: var(--sbb-color-smoke)}:host([data-readonly]:not([negative])){--sbb-form-field-label-color: var(--sbb-color-granite);--sbb-form-field-prefix-color: var(--sbb-color-granite)}:host(:is([data-input-focused],[data-has-popup-open])){--sbb-form-field-border-color: var(--sbb-color-charcoal);--sbb-form-field-prefix-color: var(--sbb-color-charcoal);--sbb-form-field-border-width: var(--sbb-border-width-2x)}@media (forced-colors: active){:host(:is([data-input-focused],[data-has-popup-open])){--sbb-form-field-border-color: Highlight !important;--sbb-form-field-prefix-color: Highlight !important}}:host(:is([data-input-focused],[data-has-popup-open])[negative]){--sbb-form-field-border-color: var(--sbb-color-milk);--sbb-form-field-prefix-color: var(--sbb-color-milk)}:host([data-invalid]){--sbb-form-field-border-color: var(--sbb-color-red125);--sbb-form-field-text-color: var(--sbb-color-red125)}@media (forced-colors: active){:host([data-invalid]){--sbb-form-field-border-color: LinkText !important;--sbb-form-field-text-color: LinkText !important}}:host([data-invalid][negative]){--sbb-form-field-border-color: var(--sbb-color-red-mode-dark);--sbb-form-field-text-color: var(--sbb-color-red-mode-dark)}:host(:not([data-has-error])){--sbb-form-field-error-padding-block-start: 0}:host([floating-label]){--sbb-select-placeholder-color: transparent}@media (forced-colors: active){:host([floating-label]){--sbb-select-placeholder-color: Canvas}}:host(:is(:not([data-slot-names~=label],[label]),[hidden-label])){--sbb-form-field-label-size: 0rem;--sbb-form-field-label-to-input-overlapping: 0rem}:host([data-input-type=sbb-slider]){--sbb-form-field-overflow: visible}:host([data-input-type=textarea]){--sbb-form-field-max-height: fit-content}.sbb-form-field__space-wrapper{display:flex;flex-direction:column}.sbb-form-field__space-wrapper:before{content:"​";-webkit-user-select:none;user-select:none;width:0;height:0}.sbb-form-field__wrapper{display:flex;gap:var(--sbb-form-field-gap);padding-inline:var(--sbb-form-field-padding-inline);border-radius:var(--sbb-form-field-border-radius);min-height:var(--sbb-form-field-min-height);max-height:var(--sbb-form-field-max-height);background-color:var(--sbb-form-field-background-color);position:relative}.sbb-form-field__wrapper:before{content:"";display:block;position:absolute;top:0;right:0;bottom:0;left:0;border:var(--sbb-form-field-border-width) var(--sbb-form-field-border-style) var(--sbb-form-field-border-color);border-radius:var(--sbb-form-field-border-radius)}:host([data-input-focused][data-focus-origin=keyboard]) .sbb-form-field__wrapper{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}@media (forced-colors: none){:host(:is([borderless],[data-input-type=sbb-slider])) .sbb-form-field__wrapper:before{border-color:transparent}:host(:is([data-input-focused],[data-has-popup-open],[data-disabled])[borderless]) .sbb-form-field__wrapper:after{content:"";position:absolute;border-block-end:var(--sbb-border-width-1x) var(--sbb-form-field-border-style) var(--sbb-form-field-border-color);inset-inline:var(--sbb-form-field-padding-inline);inset-block-end:0}}::slotted(*[slot=prefix]){color:var(--sbb-form-field-prefix-color)}::slotted(*[slot=prefix]),::slotted(*[slot=suffix]){display:flex;min-width:var(--sbb-icon-svg-width);margin-block-start:calc((var(--sbb-form-field-min-height) - var(--sbb-size-icon-ui-small)) / 2)}:host(:is([data-input-empty],[data-disabled],[data-readonly])) ::slotted(sbb-form-field-clear){display:none}::slotted(sbb-datepicker-toggle){height:calc((var(--sbb-form-field-min-height) + var(--sbb-size-icon-ui-small)) / 2)}@media (forced-colors: active){::slotted(*[slot=suffix]){color:var(--sbb-form-field-prefix-color)}}.sbb-form-field__select-input-icon{top:50%;transform:translateY(-50%);position:absolute;inset-inline-end:0;margin-block-start:calc(-1 * var(--sbb-form-field-margin-block-start) / 2);pointer-events:none;color:var(--sbb-form-field-arrow-color)}.sbb-form-field__input-container{flex:1 1 auto;position:relative;margin-block-start:var(--sbb-form-field-margin-block-start);min-width:0}.sbb-form-field__label-spacer{display:flex;height:calc(var(--sbb-form-field-label-text-size) * var(--sbb-typo-line-height-body-text));margin-block-end:var(--sbb-form-field-spacer-margin-block-end)}:host(:not([data-slot-names~=label],[label])) :is(.sbb-form-field__label,.sbb-form-field__label-spacer){display:none}:host([hidden-label]) :is(.sbb-form-field__label,.sbb-form-field__label-spacer){border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.sbb-form-field__label{display:flex;max-width:100%;cursor:default;position:absolute;inset-block-start:0;color:var(--sbb-form-field-label-color);z-index:1;--sbb-text-font-size: var(--sbb-font-size-text-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size)}:host([size=s]) .sbb-form-field__label{--sbb-text-font-size: var(--sbb-font-size-text-xxs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size)}:host([data-input-type=select]) .sbb-form-field__label,:host([data-input-type=sbb-select]) .sbb-form-field__label{padding-inline-end:var(--sbb-form-field-select-inline-padding-end)}:host([floating-label]) .sbb-form-field__label{transform-origin:0 0;pointer-events:none;backface-visibility:hidden;will-change:transform,font-size;transition-duration:var(--sbb-disable-animation-zero-time, var(--sbb-animation-duration-2x));transition-timing-function:var(--sbb-animation-easing);transition-property:transform,font-size}:host([floating-label]:is(:not([data-input-focused]:not([data-input-type=sbb-select]),[data-has-popup-open]),[data-readonly])[data-input-empty]) .sbb-form-field__label{font-size:var(--sbb-form-field-input-text-size);transform:translateY(var(--sbb-form-field-floating-label-transform))}.sbb-form-field__label-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.sbb-form-field__input{display:flex}:host([size=s]:is([data-input-type=input],[data-input-type=select],[data-input-type=sbb-select])) .sbb-form-field__input{margin-block-end:-.125rem}.sbb-form-field__input ::slotted(:where(input,select,textarea,sbb-select)){--sbb-text-font-size: var(--sbb-font-size-text-m);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;outline:none;border:none;padding:0;-webkit-appearance:none;outline:none!important;overflow:var(--sbb-form-field-overflow);width:100%;box-sizing:border-box;color:var(--sbb-form-field-text-color);-webkit-text-fill-color:var(--sbb-form-field-text-color);opacity:1;background-color:transparent;font-size:var(--sbb-form-field-input-text-size)!important;font-family:var(--sbb-typo-font-family)!important;line-height:var(--sbb-typo-line-height-body-text)!important}.sbb-form-field__input ::slotted(:where(input,select,textarea,sbb-select))::placeholder{color:var(--sbb-color-metal);-webkit-text-fill-color:var(--sbb-color-metal);opacity:1}:host([floating-label]) .sbb-form-field__input ::slotted(:where(input,select,textarea,sbb-select))::placeholder{color:transparent!important;-webkit-text-fill-color:transparent!important}@media (forced-colors: active){:host([floating-label]) .sbb-form-field__input ::slotted(:where(input,select,textarea,sbb-select))::placeholder{color:Canvas!important;-webkit-text-fill-color:Canvas!important}}:host([data-disabled]:not([floating-label])) .sbb-form-field__input ::slotted(:where(input,select,textarea,sbb-select))::placeholder{color:var(--sbb-color-granite);-webkit-text-fill-color:var(--sbb-color-granite)}:host([data-input-type=select]) .sbb-form-field__input ::slotted(:where(input,select,textarea,sbb-select)){vertical-align:middle}.sbb-form-field__input ::slotted(:where(select,sbb-select)){padding-inline-end:var(--sbb-form-field-select-inline-padding-end)}.sbb-form-field__input ::slotted(textarea){--sbb-scrollbar-thumb-width: .125rem;--sbb-scrollbar-thumb-width-hover: .25rem;--sbb-scrollbar-width-firefox: thin;--sbb-scrollbar-color: var(--sbb-color-black-alpha-30);--sbb-scrollbar-color-hover: var(--sbb-color-black-alpha-60);--sbb-scrollbar-track-color: transparent;--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x)}.sbb-form-field__input ::slotted(textarea)::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-form-field__input ::slotted(textarea)::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-form-field__input ::slotted(textarea)::-webkit-scrollbar-thumb{background-color:var(--sbb-scrollbar-color, currentcolor);border:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;border-radius:var(--sbb-border-radius-4x);background-clip:padding-box}.sbb-form-field__input ::slotted(textarea)::-webkit-scrollbar-thumb:hover{background-color:var(--sbb-scrollbar-color-hover, currentcolor);border-width:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)))}.sbb-form-field__input ::slotted(textarea)::-webkit-scrollbar-button,.sbb-form-field__input ::slotted(textarea)::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-form-field__input ::slotted(textarea){scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-form-field__input ::slotted(textarea){position:relative;resize:none;white-space:break-spaces;overflow-y:auto;min-height:calc(var(--sbb-typo-line-height-body-text) * 1em)}:host([size=l]) .sbb-form-field__input ::slotted(textarea){padding-block-end:.34375rem}:host([negative]) .sbb-form-field__input ::slotted(textarea){--sbb-scrollbar-thumb-width: .125rem;--sbb-scrollbar-thumb-width-hover: .25rem;--sbb-scrollbar-width-firefox: thin;--sbb-scrollbar-color: var(--sbb-color-white-alpha-30);--sbb-scrollbar-color-hover: var(--sbb-color-white-alpha-60);--sbb-scrollbar-track-color: transparent;--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x)}:host([negative]) .sbb-form-field__input ::slotted(textarea)::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}:host([negative]) .sbb-form-field__input ::slotted(textarea)::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}:host([negative]) .sbb-form-field__input ::slotted(textarea)::-webkit-scrollbar-thumb{background-color:var(--sbb-scrollbar-color, currentcolor);border:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;border-radius:var(--sbb-border-radius-4x);background-clip:padding-box}:host([negative]) .sbb-form-field__input ::slotted(textarea)::-webkit-scrollbar-thumb:hover{background-color:var(--sbb-scrollbar-color-hover, currentcolor);border-width:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)))}:host([negative]) .sbb-form-field__input ::slotted(textarea)::-webkit-scrollbar-button,:host([negative]) .sbb-form-field__input ::slotted(textarea)::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){:host([negative]) .sbb-form-field__input ::slotted(textarea){scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-form-field__error{display:flex;min-height:var(--sbb-form-field-error-min-height);margin-block-start:var(--sbb-form-field-error-padding-block-start-override, var(--sbb-form-field-error-padding-block-start))}`;
+const L = m`@charset "UTF-8";*,:before,:after{box-sizing:border-box}:host{display:inline-block;--sbb-form-field-background-color: var(--sbb-color-white);--sbb-form-field-border-color: var(--sbb-color-smoke);--sbb-form-field-border-style: solid;--sbb-form-field-border-radius: var(--sbb-border-radius-4x);--sbb-form-field-border-width: var(--sbb-border-width-1x);--sbb-form-field-min-height: var(--sbb-size-element-m);--sbb-form-field-label-color: var(--sbb-color-metal);--sbb-form-field-prefix-color: var(--sbb-color-metal);--sbb-form-field-padding-inline: var(--sbb-spacing-fixed-3x);--sbb-form-field-text-color: var(--sbb-color-charcoal);--sbb-form-field-arrow-color: var(--sbb-color-charcoal);--sbb-form-field-error-divider-width: var(--sbb-spacing-fixed-1x);--sbb-form-field-error-padding-block-start: var(--sbb-form-field-error-divider-width);--sbb-form-field-gap: var(--sbb-spacing-fixed-2x);--sbb-form-field-label-to-input-overlapping: var(--sbb-spacing-fixed-1x);--sbb-form-field-select-inline-padding-end: calc( var(--sbb-icon-svg-width) + var(--sbb-form-field-gap) );--sbb-form-field-overflow: hidden;--sbb-form-field-input-text-size: var(--sbb-font-size-text-m);--sbb-form-field-label-text-size: var(--sbb-font-size-text-xs);--sbb-form-field-label-size: calc( var(--sbb-form-field-label-text-size) * var(--sbb-typo-line-height-body-text) );--sbb-form-field-text-line-height: calc( var(--sbb-form-field-input-text-size) * var(--sbb-typo-line-height-body-text) );--sbb-form-field-margin-block-start: calc( ( var(--sbb-form-field-min-height) - var(--sbb-form-field-label-size) - var( --sbb-form-field-text-line-height ) + var(--sbb-form-field-label-to-input-overlapping) ) / 2 );--sbb-form-field-spacer-margin-block-end: calc( -1 * var(--sbb-form-field-label-to-input-overlapping) );--sbb-form-field-floating-label-transform: .53125rem;--sbb-icon-svg-width: var(--sbb-size-icon-ui-small);--sbb-icon-svg-height: var(--sbb-size-icon-ui-small);--sbb-focus-outline-color: var(--sbb-focus-outline-color-default)}@media (min-width: 52.5rem){:host{--sbb-form-field-floating-label-transform: .65625rem}}@media (forced-colors: active){:host{--sbb-form-field-border-color: ButtonBorder}}:host(:where(:not([width=collapse]))){min-width:9.375rem;width:min(18.75rem,100%)}:host([negative]){--sbb-form-field-background-color: var(--sbb-color-midnight);--sbb-form-field-border-color: var(--sbb-color-smoke);--sbb-form-field-label-color: var(--sbb-color-smoke);--sbb-form-field-prefix-color: var(--sbb-color-smoke);--sbb-form-field-text-color: var(--sbb-color-milk);--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);--sbb-form-field-arrow-color: var(--sbb-color-milk)}@media (forced-colors: active){:host([negative]){--sbb-form-field-border-color: ButtonBorder}}:host([size=s]){--sbb-form-field-min-height: var(--sbb-size-element-xs);--sbb-form-field-padding-inline: var(--sbb-spacing-fixed-2x);--sbb-form-field-input-text-size: var(--sbb-font-size-text-s);--sbb-form-field-label-text-size: var(--sbb-font-size-text-xxs);--sbb-form-field-label-to-input-overlapping: .625rem;--sbb-form-field-floating-label-transform: .34375rem;--sbb-form-field-spacer-margin-block-end: -.53125rem}@media (min-width: 52.5rem){:host([size=s]){--sbb-form-field-label-to-input-overlapping: .6875rem;--sbb-form-field-floating-label-transform: .3125rem;--sbb-form-field-spacer-margin-block-end: -.5rem}}:host([size=l]){--sbb-form-field-min-height: var(--sbb-size-element-l);--sbb-form-field-padding-inline: var(--sbb-spacing-responsive-xxxs)}:host([error-space=reserve]){--sbb-form-field-error-min-height: calc( var(--sbb-typo-line-height-body-text) * var(--sbb-font-size-text-xs) );--sbb-form-field-error-padding-block-start-override: var(--sbb-form-field-error-divider-width)}:host(:is([data-readonly],[data-disabled])){--sbb-form-field-background-color: var(--sbb-color-milk);--sbb-form-field-border-color: var(--sbb-color-graphite);--sbb-form-field-arrow-color: var(--sbb-color-granite)}@media (forced-colors: active){:host(:is([data-readonly],[data-disabled])){--sbb-form-field-border-color: ButtonBorder}}:host(:is([data-readonly],[data-disabled])[negative]){--sbb-form-field-background-color: var(--sbb-color-charcoal);--sbb-form-field-border-color: var(--sbb-color-smoke);--sbb-form-field-arrow-color: var(--sbb-color-smoke)}:host([data-disabled]){--sbb-form-field-label-color: var(--sbb-color-granite);--sbb-form-field-prefix-color: var(--sbb-color-granite);--sbb-form-field-border-style: dashed}@media (forced-colors: active){:host([data-disabled]){--sbb-form-field-label-color: GrayText !important;--sbb-form-field-prefix-color: GrayText !important;--sbb-form-field-text-color: GrayText !important;--sbb-form-field-border-color: GrayText !important}}:host([data-disabled][negative]){--sbb-form-field-text-color: var(--sbb-color-smoke);--sbb-form-field-label-color: var(--sbb-color-smoke);--sbb-form-field-prefix-color: var(--sbb-color-smoke)}:host([data-readonly]:not([negative])){--sbb-form-field-label-color: var(--sbb-color-granite);--sbb-form-field-prefix-color: var(--sbb-color-granite)}:host(:is([data-input-focused],[data-has-popup-open])){--sbb-form-field-border-color: var(--sbb-color-charcoal);--sbb-form-field-prefix-color: var(--sbb-color-charcoal);--sbb-form-field-border-width: var(--sbb-border-width-2x)}@media (forced-colors: active){:host(:is([data-input-focused],[data-has-popup-open])){--sbb-form-field-border-color: Highlight !important;--sbb-form-field-prefix-color: Highlight !important}}:host(:is([data-input-focused],[data-has-popup-open])[negative]){--sbb-form-field-border-color: var(--sbb-color-milk);--sbb-form-field-prefix-color: var(--sbb-color-milk)}:host([data-invalid]){--sbb-form-field-border-color: var(--sbb-color-red125);--sbb-form-field-text-color: var(--sbb-color-red125)}@media (forced-colors: active){:host([data-invalid]){--sbb-form-field-border-color: LinkText !important;--sbb-form-field-text-color: LinkText !important}}:host([data-invalid][negative]){--sbb-form-field-border-color: var(--sbb-color-red-mode-dark);--sbb-form-field-text-color: var(--sbb-color-red-mode-dark)}:host(:not([data-has-error])){--sbb-form-field-error-padding-block-start: 0}:host([floating-label]){--sbb-select-placeholder-color: transparent}@media (forced-colors: active){:host([floating-label]){--sbb-select-placeholder-color: Canvas}}:host(:is(:not([data-slot-names~=label],[label]),[hidden-label])){--sbb-form-field-label-size: 0rem;--sbb-form-field-label-to-input-overlapping: 0rem}:host([data-input-type=sbb-slider]){--sbb-form-field-overflow: visible}:host([data-input-type=textarea]){--sbb-form-field-max-height: fit-content}.sbb-form-field__space-wrapper{display:flex;flex-direction:column}.sbb-form-field__space-wrapper:before{content:"​";-webkit-user-select:none;user-select:none;width:0;height:0}.sbb-form-field__wrapper{display:flex;gap:var(--sbb-form-field-gap);padding-inline:var(--sbb-form-field-padding-inline);border-radius:var(--sbb-form-field-border-radius);min-height:var(--sbb-form-field-min-height);max-height:var(--sbb-form-field-max-height);background-color:var(--sbb-form-field-background-color);position:relative}.sbb-form-field__wrapper:before{content:"";display:block;position:absolute;top:0;right:0;bottom:0;left:0;border:var(--sbb-form-field-border-width) var(--sbb-form-field-border-style) var(--sbb-form-field-border-color);border-radius:var(--sbb-form-field-border-radius)}:host([data-input-focused][data-focus-origin=keyboard]) .sbb-form-field__wrapper{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}@media (forced-colors: none){:host(:is([borderless],[data-input-type=sbb-slider])) .sbb-form-field__wrapper:before{border-color:transparent}:host(:is([data-input-focused],[data-has-popup-open],[data-disabled])[borderless]) .sbb-form-field__wrapper:after{content:"";position:absolute;border-block-end:var(--sbb-border-width-1x) var(--sbb-form-field-border-style) var(--sbb-form-field-border-color);inset-inline:var(--sbb-form-field-padding-inline);inset-block-end:0}}::slotted(*[slot=prefix]){color:var(--sbb-form-field-prefix-color)}::slotted(*[slot=prefix]),::slotted(*[slot=suffix]){display:flex;min-width:var(--sbb-icon-svg-width);margin-block-start:calc((var(--sbb-form-field-min-height) - var(--sbb-size-icon-ui-small)) / 2)}:host(:is([data-input-empty],[data-disabled],[data-readonly])) ::slotted(sbb-form-field-clear){display:none}::slotted(sbb-datepicker-toggle){height:calc((var(--sbb-form-field-min-height) + var(--sbb-size-icon-ui-small)) / 2)}@media (forced-colors: active){::slotted(*[slot=suffix]){color:var(--sbb-form-field-prefix-color)}}.sbb-form-field__select-input-icon{top:50%;transform:translateY(-50%);position:absolute;inset-inline-end:0;margin-block-start:calc(-1 * var(--sbb-form-field-margin-block-start) / 2);pointer-events:none;color:var(--sbb-form-field-arrow-color)}.sbb-form-field__input-container{flex:1 1 auto;position:relative;margin-block-start:var(--sbb-form-field-margin-block-start);min-width:0}.sbb-form-field__label-spacer{display:flex;height:calc(var(--sbb-form-field-label-text-size) * var(--sbb-typo-line-height-body-text));margin-block-end:var(--sbb-form-field-spacer-margin-block-end)}:host(:not([data-slot-names~=label],[label])) :is(.sbb-form-field__label,.sbb-form-field__label-spacer){display:none}:host([hidden-label]) :is(.sbb-form-field__label,.sbb-form-field__label-spacer){border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.sbb-form-field__label{display:flex;max-width:100%;cursor:default;position:absolute;inset-block-start:0;color:var(--sbb-form-field-label-color);z-index:1;--sbb-text-font-size: var(--sbb-font-size-text-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size)}:host([size=s]) .sbb-form-field__label{--sbb-text-font-size: var(--sbb-font-size-text-xxs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size)}:host([data-input-type=select]) .sbb-form-field__label,:host([data-input-type=sbb-select]) .sbb-form-field__label{padding-inline-end:var(--sbb-form-field-select-inline-padding-end)}:host([floating-label]) .sbb-form-field__label{transform-origin:0 0;pointer-events:none;backface-visibility:hidden;will-change:transform,font-size;transition-duration:var(--sbb-disable-animation-zero-time, var(--sbb-animation-duration-2x));transition-timing-function:var(--sbb-animation-easing);transition-property:transform,font-size}:host([floating-label]:is(:not([data-input-focused]:not([data-input-type=sbb-select]),[data-has-popup-open]),[data-readonly])[data-input-empty]) .sbb-form-field__label{font-size:var(--sbb-form-field-input-text-size);transform:translateY(var(--sbb-form-field-floating-label-transform))}.sbb-form-field__label-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.sbb-form-field__input{display:flex}:host([size=s]:is([data-input-type=input],[data-input-type=select],[data-input-type=sbb-select])) .sbb-form-field__input{margin-block-end:-.125rem}.sbb-form-field__input ::slotted(:where(input,select,textarea,sbb-select)){--sbb-text-font-size: var(--sbb-font-size-text-m);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;outline:none;border:none;padding:0;-webkit-appearance:none;outline:none!important;overflow:var(--sbb-form-field-overflow);width:100%;box-sizing:border-box;color:var(--sbb-form-field-text-color);-webkit-text-fill-color:var(--sbb-form-field-text-color);opacity:1;background-color:transparent;font-size:var(--sbb-form-field-input-text-size)!important;font-family:var(--sbb-typo-font-family)!important;line-height:var(--sbb-typo-line-height-body-text)!important}.sbb-form-field__input ::slotted(:where(input,select,textarea,sbb-select))::placeholder{color:var(--sbb-color-metal);-webkit-text-fill-color:var(--sbb-color-metal);opacity:1}:host([floating-label]) .sbb-form-field__input ::slotted(:where(input,select,textarea,sbb-select))::placeholder{color:transparent!important;-webkit-text-fill-color:transparent!important}@media (forced-colors: active){:host([floating-label]) .sbb-form-field__input ::slotted(:where(input,select,textarea,sbb-select))::placeholder{color:Canvas!important;-webkit-text-fill-color:Canvas!important}}:host([data-disabled]:not([floating-label])) .sbb-form-field__input ::slotted(:where(input,select,textarea,sbb-select))::placeholder{color:var(--sbb-color-granite);-webkit-text-fill-color:var(--sbb-color-granite)}:host([data-input-type=select]) .sbb-form-field__input ::slotted(:where(input,select,textarea,sbb-select)){vertical-align:middle}.sbb-form-field__input ::slotted(:where(select,sbb-select)){padding-inline-end:var(--sbb-form-field-select-inline-padding-end)}.sbb-form-field__input ::slotted(textarea){--sbb-scrollbar-thumb-width: .125rem;--sbb-scrollbar-thumb-width-hover: .25rem;--sbb-scrollbar-width-firefox: thin;--sbb-scrollbar-color: var(--sbb-color-black-alpha-30);--sbb-scrollbar-color-hover: var(--sbb-color-black-alpha-60);--sbb-scrollbar-track-color: transparent;--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x)}.sbb-form-field__input ::slotted(textarea)::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-form-field__input ::slotted(textarea)::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-form-field__input ::slotted(textarea)::-webkit-scrollbar-thumb{background-color:var(--sbb-scrollbar-color, currentcolor);border:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;border-radius:var(--sbb-border-radius-4x);background-clip:padding-box}.sbb-form-field__input ::slotted(textarea)::-webkit-scrollbar-thumb:hover{background-color:var(--sbb-scrollbar-color-hover, currentcolor);border-width:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)))}.sbb-form-field__input ::slotted(textarea)::-webkit-scrollbar-button,.sbb-form-field__input ::slotted(textarea)::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-form-field__input ::slotted(textarea){scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-form-field__input ::slotted(textarea){position:relative;resize:none;white-space:break-spaces;overflow-y:auto;min-height:calc(var(--sbb-typo-line-height-body-text) * 1em)}:host([size=l]) .sbb-form-field__input ::slotted(textarea){padding-block-end:.34375rem}:host([negative]) .sbb-form-field__input ::slotted(textarea){--sbb-scrollbar-thumb-width: .125rem;--sbb-scrollbar-thumb-width-hover: .25rem;--sbb-scrollbar-width-firefox: thin;--sbb-scrollbar-color: var(--sbb-color-white-alpha-30);--sbb-scrollbar-color-hover: var(--sbb-color-white-alpha-60);--sbb-scrollbar-track-color: transparent;--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x)}:host([negative]) .sbb-form-field__input ::slotted(textarea)::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}:host([negative]) .sbb-form-field__input ::slotted(textarea)::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}:host([negative]) .sbb-form-field__input ::slotted(textarea)::-webkit-scrollbar-thumb{background-color:var(--sbb-scrollbar-color, currentcolor);border:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;border-radius:var(--sbb-border-radius-4x);background-clip:padding-box}:host([negative]) .sbb-form-field__input ::slotted(textarea)::-webkit-scrollbar-thumb:hover{background-color:var(--sbb-scrollbar-color-hover, currentcolor);border-width:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)))}:host([negative]) .sbb-form-field__input ::slotted(textarea)::-webkit-scrollbar-button,:host([negative]) .sbb-form-field__input ::slotted(textarea)::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){:host([negative]) .sbb-form-field__input ::slotted(textarea){scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-form-field__error{display:flex;min-height:var(--sbb-form-field-error-min-height);margin-block-start:var(--sbb-form-field-error-padding-block-start-override, var(--sbb-form-field-error-padding-block-start))}`;
 var C = Object.defineProperty, S = Object.getOwnPropertyDescriptor, i = (e, t, r, l) => {
   for (var s = l > 1 ? void 0 : l ? S(t, r) : t, a = e.length - 1, n; a >= 0; a--)
     (n = e[a]) && (s = (l ? n(t, r, s) : n(s)) || s);
   return l && s && C(t, r, s), s;
 };
 let p = 0, N = 0;
-const m = ["sbb-autocomplete", "sbb-autocomplete-grid", "sbb-select"];
-let o = class extends E(z(u)) {
+const h = ["sbb-autocomplete", "sbb-autocomplete-grid", "sbb-select"];
+let o = class extends z(I(u)) {
   constructor() {
     super(...arguments), this._supportedNativeInputElements = ["input", "select", "textarea"], this._supportedInputElements = [
       ...this._supportedNativeInputElements,
@@ -35,11 +34,9 @@ let o = class extends E(z(u)) {
       "tel",
       "text",
       "url"
-    ], this.errorSpace = "none", this.size = "m", this.borderless = !1, this.width = "default", this.hiddenLabel = !1, this.floatingLabel = !1, this._errorElements = [], this._abort = new _(this), this._language = new x(this), this._formFieldAttributeObserver = new I(
-      (e) => {
-        e.some((t) => t.type === "attributes") && this._readInputState();
-      }
-    ), this._inputAbortController = new AbortController();
+    ], this.errorSpace = "none", this.size = "m", this.borderless = !1, this.width = "default", this.hiddenLabel = !1, this.floatingLabel = !1, this._errorElements = [], this._abort = new x(this), this._language = new y(this), this._formFieldAttributeObserver = v ? null : new MutationObserver((e) => {
+      e.some((t) => t.type === "attributes") && this._readInputState();
+    }), this._inputAbortController = new AbortController();
   }
   /** Returns the input element. */
   get inputElement() {
@@ -54,13 +51,14 @@ let o = class extends E(z(u)) {
     super.willUpdate(e), e.has("negative") && this._syncNegative();
   }
   disconnectedCallback() {
-    super.disconnectedCallback(), this._formFieldAttributeObserver.disconnect(), this._inputAbortController.abort();
+    var e;
+    super.disconnectedCallback(), (e = this._formFieldAttributeObserver) == null || e.disconnect(), this._inputAbortController.abort();
   }
   _onPopupOpen({ target: e }) {
-    m.includes(e.localName) && this.toggleAttribute("data-has-popup-open", !0);
+    h.includes(e.localName) && this.toggleAttribute("data-has-popup-open", !0);
   }
   _onPopupClose({ target: e }) {
-    m.includes(e.localName) && this.removeAttribute("data-has-popup-open");
+    h.includes(e.localName) && this.removeAttribute("data-has-popup-open");
   }
   _handleWrapperClick(e) {
     var t, r;
@@ -79,7 +77,8 @@ let o = class extends E(z(u)) {
    * It is used internally to assign the attributes of `<input>` to `_id` and `_input` and to observe the native readonly and disabled attributes.
    */
   _onSlotInputChange(e) {
-    this._input = e.target.assignedElements().find((t) => this._supportedInputElements.includes(t.localName)), this._assignSlots(), this._input && (this._originalInputAriaDescribedby = this._input.getAttribute("aria-describedby"), this._applyAriaDescribedby(), this._readInputState(), this._registerInputListener(), this._input.localName === "textarea" && this._input.setAttribute("rows", this._input.getAttribute("rows") || "3"), this._formFieldAttributeObserver.disconnect(), this._formFieldAttributeObserver.observe(this._input, {
+    var t, r;
+    this._input = e.target.assignedElements().find((l) => this._supportedInputElements.includes(l.localName)), this._assignSlots(), this._input && (this._originalInputAriaDescribedby = this._input.getAttribute("aria-describedby"), this._applyAriaDescribedby(), this._readInputState(), this._registerInputListener(), this._input.localName === "textarea" && this._input.setAttribute("rows", this._input.getAttribute("rows") || "3"), (t = this._formFieldAttributeObserver) == null || t.disconnect(), (r = this._formFieldAttributeObserver) == null || r.observe(this._input, {
       attributes: !0,
       attributeFilter: ["readonly", "disabled", "class", "data-sbb-invalid"]
     }), this.setAttribute("data-input-type", this._input.localName), this._syncLabelInputReferences());
@@ -114,7 +113,7 @@ let o = class extends E(z(u)) {
       () => {
         this.toggleAttribute("data-input-focused", !0), this.setAttribute(
           "data-focus-origin",
-          g.mostRecentModality ?? ""
+          _.mostRecentModality ?? ""
         );
       },
       {
@@ -164,14 +163,14 @@ let o = class extends E(z(u)) {
   _onSlotErrorChange(e) {
     this._errorElements = e.target.assignedElements();
     for (const t of this._errorElements)
-      t.id || (t.id = `sbb-form-field-error-${++N}`), t.role || (t.role = "status", w && t.setAttribute("role", "status"));
+      t.id || (t.id = `sbb-form-field-error-${++N}`), t.role || (t.role = "status", k && t.setAttribute("role", "status"));
     this._applyAriaDescribedby(), this.toggleAttribute("data-has-error", !!this._errorElements.length), this._syncNegative();
   }
   _applyAriaDescribedby() {
     const e = [];
     this._originalInputAriaDescribedby && e.push(this._originalInputAriaDescribedby), this._errorElements.length && this._errorElements.forEach((r) => e.push(r.id));
     const t = e.join(" ");
-    this._input && k(this._input, "aria-describedby", t);
+    this._input && A(this._input, "aria-describedby", t);
   }
   /** Manually reset the form field. Currently, this only resets the floating label. */
   reset() {
@@ -209,7 +208,7 @@ let o = class extends E(z(u)) {
             <span class="sbb-form-field__label">
               <span class="sbb-form-field__label-ellipsis">
                 <slot name="label" @slotchange=${this._onSlotLabelChange}></slot>
-                ${this.optional ? d` <span aria-hidden="true"> ${A[this._language.current]} </span>` : f}
+                ${this.optional ? d` <span aria-hidden="true"> ${E[this._language.current]} </span>` : f}
               </span>
             </span>
             <div class="sbb-form-field__input">
@@ -262,8 +261,8 @@ i([
   c()
 ], o.prototype, "_label", 2);
 o = i([
-  v("sbb-form-field"),
-  y()
+  g("sbb-form-field"),
+  w()
 ], o);
 export {
   o as SbbFormFieldElement

package/header/common.js

@@ -2,13 +2,13 @@ import { property as n } from "lit/decorators.js";
 import { html as s } from "lit/static-html.js";
 import { SbbIconNameMixin as d } from "../icon.js";
 import { css as b } from "lit";
-const h = b`*,:before,:after{box-sizing:border-box}:host{display:inline-block;outline:none!important;--sbb-header-action-padding-inline: var(--sbb-spacing-fixed-5x);--sbb-header-action-color: var(--sbb-color-black);--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-zero-time, 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-first-item-margin-inline-start: calc(-1 * var(--sbb-header-action-padding-inline))}@media (forced-colors: active){:host{--sbb-header-action-border-color: CanvasText;--sbb-header-action-color: LinkText}}@media (any-hover: hover){:host(:hover:not(:active,[data-active],[aria-expanded=true])){--sbb-header-action-background-color: var(--sbb-color-milk);--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],[aria-expanded=true])){--sbb-header-action-border-color: Highlight}}:host(:is(:active,[data-active])){--sbb-header-action-background-color: var(--sbb-color-cloud)}@media (forced-colors: active){:host(:is(:active,[data-active])){--sbb-header-action-border-color: Highlight}}@media (forced-colors: active){:host([role=button]){--sbb-header-action-color: ButtonText}}:is(.sbb-header-button,.sbb-header-link){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);cursor:pointer;-webkit-user-select:none;user-select:none;outline:none}:is(.sbb-header-button,.sbb-header-link):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){:is(.sbb-header-button,.sbb-header-link):before{border-width:var(--sbb-border-width-2x)}}:host(:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch])) :is(.sbb-header-button,.sbb-header-link):before,:host(:not([data-focus-origin=mouse],[data-focus-origin=touch])) :is(.sbb-header-button,.sbb-header-link):focus-visible:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}.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-size-icon-ui-small);min-height:var(--sbb-size-icon-ui-small);line-height:0}.sbb-header-action__text{--sbb-text-font-size: var(--sbb-font-size-text-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);font-weight:700;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:block}@media (max-width: -.0625rem){:host([expand-from=zero]){--sbb-header-first-item-margin-inline-start: -.75rem;--sbb-header-action-padding-inline: 0}:host([expand-from=zero]) .sbb-header-action__text{border:0;clip: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: 22.4375rem){:host([expand-from=micro]){--sbb-header-first-item-margin-inline-start: -.75rem;--sbb-header-action-padding-inline: 0}:host([expand-from=micro]) .sbb-header-action__text{border:0;clip: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]){--sbb-header-first-item-margin-inline-start: -.75rem;--sbb-header-action-padding-inline: 0}:host([expand-from=small]) .sbb-header-action__text{border:0;clip: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: 52.4375rem){:host([expand-from=medium]){--sbb-header-first-item-margin-inline-start: -.75rem;--sbb-header-action-padding-inline: 0}:host([expand-from=medium]) .sbb-header-action__text{border:0;clip: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]){--sbb-header-first-item-margin-inline-start: -.75rem;--sbb-header-action-padding-inline: 0}:host([expand-from=large]) .sbb-header-action__text{border:0;clip: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: 79.9375rem){:host([expand-from=wide]){--sbb-header-first-item-margin-inline-start: -.75rem;--sbb-header-action-padding-inline: 0}:host([expand-from=wide]) .sbb-header-action__text{border:0;clip: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]){--sbb-header-first-item-margin-inline-start: -.75rem;--sbb-header-action-padding-inline: 0}:host([expand-from=ultra]) .sbb-header-action__text{border:0;clip: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: calc(99rem-0.0625rem)){:host([expand-from=ultra--max-content]){--sbb-header-first-item-margin-inline-start: -.75rem;--sbb-header-action-padding-inline: 0}:host([expand-from=ultra--max-content]) .sbb-header-action__text{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px;display:flex}}`;
+const h = b`*,:before,:after{box-sizing:border-box}:host{display:inline-block;outline:none!important;--sbb-header-action-padding-inline: var(--sbb-spacing-fixed-5x);--sbb-header-action-color: var(--sbb-color-black);--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-zero-time, 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-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}}@media (any-hover: hover){:host(:hover:not(:active,[data-active],[aria-expanded=true])){--sbb-header-action-background-color: var(--sbb-color-milk);--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],[aria-expanded=true])){--sbb-header-action-border-color: Highlight}}:host(:is(:active,[data-active])){--sbb-header-action-background-color: var(--sbb-color-cloud)}@media (forced-colors: active){:host(:is(:active,[data-active])){--sbb-header-action-border-color: Highlight}}@media (forced-colors: active){:host([role=button]){--sbb-header-action-color: ButtonText}}:is(.sbb-header-button,.sbb-header-link){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:pointer;-webkit-user-select:none;user-select:none;outline:none}:is(.sbb-header-button,.sbb-header-link):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){:is(.sbb-header-button,.sbb-header-link):before{border-width:var(--sbb-border-width-2x)}}:host(:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch])) :is(.sbb-header-button,.sbb-header-link):before,:host(:not([data-focus-origin=mouse],[data-focus-origin=touch])) :is(.sbb-header-button,.sbb-header-link):focus-visible:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}.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}.sbb-header-action__text{--sbb-text-font-size: var(--sbb-font-size-text-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);font-weight:700;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:block}@media (max-width: -.0625rem){:host([expand-from=zero]){--_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}:host([expand-from=zero]) .sbb-header-action__text{border:0;clip: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: 22.4375rem){:host([expand-from=micro]){--_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}:host([expand-from=micro]) .sbb-header-action__text{border:0;clip: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]){--_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}:host([expand-from=small]) .sbb-header-action__text{border:0;clip: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: 52.4375rem){:host([expand-from=medium]){--_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}:host([expand-from=medium]) .sbb-header-action__text{border:0;clip: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]){--_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}:host([expand-from=large]) .sbb-header-action__text{border:0;clip: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: 79.9375rem){:host([expand-from=wide]){--_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}:host([expand-from=wide]) .sbb-header-action__text{border:0;clip: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]){--_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}:host([expand-from=ultra]) .sbb-header-action__text{border:0;clip: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: calc(99rem-0.0625rem)){:host([expand-from=ultra--max-content]){--_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}:host([expand-from=ultra--max-content]) .sbb-header-action__text{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px;display:flex}}`;
 var c = Object.defineProperty, l = (t, e, i, p) => {
   for (var a = void 0, r = t.length - 1, o; r >= 0; r--)
     (o = t[r]) && (a = o(e, i, a) || a);
   return a && c(e, i, a), a;
 };
-const u = (t) => {
+const v = (t) => {
   const i = class i extends d(t) {
     constructor() {
       super(...arguments), this.expandFrom = "medium";
@@ -31,5 +31,5 @@ const u = (t) => {
   ], e.prototype, "expandFrom"), e;
 };
 export {
-  u as SbbHeaderActionCommonElementMixin
+  v as SbbHeaderActionCommonElementMixin
 };

package/header/header/header.d.ts

@@ -21,6 +21,8 @@ export declare class SbbHeaderElement extends SbbHeaderElement_base {
     private _scrollOrigin;
     /** Whether the header should hide and show on scroll. */
     hideOnScroll: boolean;
+    /** Size of the header. */
+    size: 'm' | 's';
     private _headerOnTop;
     private _scrollElement;
     private _scrollEventsController;

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

@@ -1 +1 @@
-{"version":3,"file":"header.d.ts","sourceRoot":"","sources":["../../../../src/elements/header/header/header.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAkB,UAAU,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAS3F,OAAO,eAAe,CAAC;;AAIvB;;;;;;;GAOG;AACH,qBACa,gBAAiB,SAAQ,qBAA6B;IACjE,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD;;;OAGG;IACgD,QAAQ,UAAS;IAEpE,gFAAgF;IAChF,IACW,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,WAAW,GAAG,QAAQ,EAI7D;IACD,IAAW,YAAY,IAAI,MAAM,GAAG,WAAW,GAAG,QAAQ,CAEzD;IACD,OAAO,CAAC,aAAa,CAAiE;IAEtF,yDAAyD;IACuB,YAAY,UACpF;IAEC,OAAO,CAAC,YAAY,CAAQ;IAErC,OAAO,CAAC,cAAc,CAA4C;IAClE,OAAO,CAAC,uBAAuB,CAAmB;IAClD,OAAO,CAAC,eAAe,CAA2B;IAClD,OAAO,CAAC,WAAW,CAAK;IAExB,OAAO,CAAC,mBAAmB;IAY3B,gGAAgG;IAChF,iBAAiB,IAAI,IAAI;IAMzC,2DAA2D;IAC3C,oBAAoB,IAAI,IAAI;IAK5C,sHAAsH;IACtH,OAAO,CAAC,2BAA2B;IAWnC,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;CAc5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,YAAY,EAAE,gBAAgB,CAAC;KAChC;CACF"}
+{"version":3,"file":"header.d.ts","sourceRoot":"","sources":["../../../../src/elements/header/header/header.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAkB,UAAU,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAS3F,OAAO,eAAe,CAAC;;AAIvB;;;;;;;GAOG;AACH,qBACa,gBAAiB,SAAQ,qBAA6B;IACjE,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD;;;OAGG;IACgD,QAAQ,UAAS;IAEpE,gFAAgF;IAChF,IACW,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,WAAW,GAAG,QAAQ,EAI7D;IACD,IAAW,YAAY,IAAI,MAAM,GAAG,WAAW,GAAG,QAAQ,CAEzD;IACD,OAAO,CAAC,aAAa,CAAiE;IAEtF,yDAAyD;IACuB,YAAY,UACpF;IAER,0BAA0B;IACU,IAAI,EAAE,GAAG,GAAG,GAAG,CAAO;IAEjD,OAAO,CAAC,YAAY,CAAQ;IAErC,OAAO,CAAC,cAAc,CAA4C;IAClE,OAAO,CAAC,uBAAuB,CAAmB;IAClD,OAAO,CAAC,eAAe,CAA2B;IAClD,OAAO,CAAC,WAAW,CAAK;IAExB,OAAO,CAAC,mBAAmB;IAY3B,gGAAgG;IAChF,iBAAiB,IAAI,IAAI;IAMzC,2DAA2D;IAC3C,oBAAoB,IAAI,IAAI;IAK5C,sHAAsH;IACtH,OAAO,CAAC,2BAA2B;IAWnC,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;CAc5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,YAAY,EAAE,gBAAgB,CAAC;KAChC;CACF"}

package/header/header.js

@@ -1,19 +1,19 @@
 import { css as h, LitElement as c, isServer as b, html as f } from "lit";
-import { property as d, state as u, customElement as v } from "lit/decorators.js";
+import { property as n, state as u, customElement as v } from "lit/decorators.js";
 import { SbbFocusVisibleWithinController as m } from "../core/a11y.js";
 import { findReferencedElement as p } from "../core/dom.js";
 import { SbbHydrationMixin as g } from "../core/mixins.js";
 import "../logo.js";
-const _ = h`*,:before,:after{box-sizing:border-box}:host{display:block;height:var(--sbb-header-height);--sbb-logo-height: 1rem;--sbb-header-position: fixed;--sbb-header-transition-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-6x) );--sbb-header-inset-inline-end: 0}@media (min-width: 52.5rem){:host{--sbb-logo-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-color-white);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-shadow-elevation-level-9-shadow-2-offset-x) var(--sbb-shadow-elevation-level-9-shadow-2-offset-y) var(--sbb-shadow-elevation-level-9-shadow-2-blur) var(--sbb-shadow-elevation-level-9-shadow-2-spread) var(--sbb-shadow-elevation-level-9-soft-2-color),var(--sbb-shadow-elevation-level-9-shadow-1-offset-x) var(--sbb-shadow-elevation-level-9-shadow-1-offset-y) var(--sbb-shadow-elevation-level-9-shadow-1-blur) var(--sbb-shadow-elevation-level-9-shadow-1-spread) var(--sbb-shadow-elevation-level-9-soft-1-color)}@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-layout-base-offset-responsive);margin-inline:auto;width:100%}@media (min-width: 90rem){:host(:not([expanded])) .sbb-header__wrapper{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-spacing-responsive-xxs)}.sbb-header__logo{flex:0 0 auto;margin-inline-start:auto;padding-inline-start:var(--sbb-spacing-responsive-s)}::slotted(:is(sbb-header-button,sbb-header-link):first-child){margin-inline-start:var(--sbb-header-first-item-margin-inline-start)}::slotted(*){flex:0 0 auto}::slotted(.sbb-header-shrinkable){flex-shrink:1;min-width:0}::slotted(.sbb-header-spacer){flex-grow:1}::slotted(a[slot=logo]){display:block;padding-block:var(--sbb-spacing-fixed-3x);position:relative;outline:none!important}::slotted(a[slot=logo]):before{content:"";display:block;position:absolute;inset:var(--sbb-spacing-fixed-3x) 0}::slotted(a[slot=logo]:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch])):before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) 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)}}`;
+const _ = h`*,:before,:after{box-sizing:border-box}: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-zero-time, var(--sbb-animation-duration-6x) );--sbb-header-inset-inline-end: 0}@media (min-width: 52.5rem){: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-color-white);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-shadow-elevation-level-9-shadow-2-offset-x) var(--sbb-shadow-elevation-level-9-shadow-2-offset-y) var(--sbb-shadow-elevation-level-9-shadow-2-blur) var(--sbb-shadow-elevation-level-9-shadow-2-spread) var(--sbb-shadow-elevation-level-9-soft-2-color),var(--sbb-shadow-elevation-level-9-shadow-1-offset-x) var(--sbb-shadow-elevation-level-9-shadow-1-offset-y) var(--sbb-shadow-elevation-level-9-shadow-1-blur) var(--sbb-shadow-elevation-level-9-shadow-1-spread) var(--sbb-shadow-elevation-level-9-soft-1-color)}@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-layout-base-offset-responsive);margin-inline:auto;width:100%}@media (min-width: 90rem){:host(:not([expanded])) .sbb-header__wrapper{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-spacing-responsive-xxs)}.sbb-header__logo{flex:0 0 auto;margin-inline-start:auto;padding-inline-start:var(--sbb-spacing-responsive-s)}::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(a[slot=logo]){display:block;padding-block:var(--sbb-spacing-fixed-3x);position:relative;outline:none!important}::slotted(a[slot=logo]):before{content:"";display:block;position:absolute;inset:var(--sbb-spacing-fixed-3x) 0}::slotted(a[slot=logo]:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch])):before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) 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)}}`;
 var w = Object.defineProperty, x = Object.getOwnPropertyDescriptor, a = (e, t, s, r) => {
-  for (var o = r > 1 ? void 0 : r ? x(t, s) : t, l = e.length - 1, n; l >= 0; l--)
-    (n = e[l]) && (o = (r ? n(t, s, o) : n(o)) || o);
-  return r && o && w(t, s, o), o;
+  for (var i = r > 1 ? void 0 : r ? x(t, s) : t, l = e.length - 1, d; l >= 0; l--)
+    (d = e[l]) && (i = (r ? d(t, s, i) : d(i)) || i);
+  return r && i && w(t, s, i), i;
 };
 const y = "[aria-controls][aria-expanded='true']";
-let i = class extends g(c) {
+let o = class extends g(c) {
   constructor() {
-    super(...arguments), this.expanded = !1, this._scrollOrigin = b ? null : document, this.hideOnScroll = !1, this._headerOnTop = !0, this._lastScroll = 0;
+    super(...arguments), this.expanded = !1, this._scrollOrigin = b ? null : document, this.hideOnScroll = !1, this.size = "m", this._headerOnTop = !0, this._lastScroll = 0;
   }
   set scrollOrigin(e) {
     const t = this._scrollOrigin;
@@ -99,22 +99,25 @@ let i = class extends g(c) {
     `;
   }
 };
-i.styles = _;
+o.styles = _;
 a([
-  d({ reflect: !0, type: Boolean })
-], i.prototype, "expanded", 2);
+  n({ reflect: !0, type: Boolean })
+], o.prototype, "expanded", 2);
 a([
-  d({ attribute: "scroll-origin" })
-], i.prototype, "scrollOrigin", 1);
+  n({ attribute: "scroll-origin" })
+], o.prototype, "scrollOrigin", 1);
 a([
-  d({ attribute: "hide-on-scroll", reflect: !0, type: Boolean })
-], i.prototype, "hideOnScroll", 2);
+  n({ attribute: "hide-on-scroll", reflect: !0, type: Boolean })
+], o.prototype, "hideOnScroll", 2);
+a([
+  n({ reflect: !0 })
+], o.prototype, "size", 2);
 a([
   u()
-], i.prototype, "_headerOnTop", 2);
-i = a([
+], o.prototype, "_headerOnTop", 2);
+o = a([
   v("sbb-header")
-], i);
+], o);
 export {
-  i as SbbHeaderElement
+  o as SbbHeaderElement
 };

package/journey-header/journey-header.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"journey-header.d.ts","sourceRoot":"","sources":["../../../src/elements/journey-header/journey-header.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1D,OAAO,EAAQ,UAAU,EAAW,MAAM,KAAK,CAAC;AAOhD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAIjD,OAAO,YAAY,CAAC;AACpB,OAAO,0BAA0B,CAAC;AAClC,OAAO,aAAa,CAAC;AAErB,MAAM,MAAM,iBAAiB,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;;AAQhD;;GAEG;AACH,qBACa,uBAAwB,SAAQ,4BAA4B;IACvE,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,8CAA8C;IAC3B,MAAM,EAAG,MAAM,CAAC;IAEnC,mDAAmD;IAChC,WAAW,EAAG,MAAM,CAAC;IAExC,wFAAwF;IAC3B,SAAS,CAAC,EAAE,OAAO,CAAC;IAEjF,gEAAgE;IAC7C,KAAK,EAAE,aAAa,CAAO;IAE9C,2BAA2B;IACS,IAAI,EAAE,iBAAiB,CAAO;IAElE,OAAO,CAAC,SAAS,CAAmC;cAEjC,MAAM,IAAI,cAAc;CAgC5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,oBAAoB,EAAE,uBAAuB,CAAC;KAC/C;CACF"}
+{"version":3,"file":"journey-header.d.ts","sourceRoot":"","sources":["../../../src/elements/journey-header/journey-header.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1D,OAAO,EAAQ,UAAU,EAAW,MAAM,KAAK,CAAC;AAMhD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAIjD,OAAO,YAAY,CAAC;AACpB,OAAO,0BAA0B,CAAC;AAClC,OAAO,aAAa,CAAC;AAErB,MAAM,MAAM,iBAAiB,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;;AAQhD;;GAEG;AACH,qBACa,uBAAwB,SAAQ,4BAA4B;IACvE,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,8CAA8C;IAC3B,MAAM,EAAG,MAAM,CAAC;IAEnC,mDAAmD;IAChC,WAAW,EAAG,MAAM,CAAC;IAExC,wFAAwF;IAC3B,SAAS,CAAC,EAAE,OAAO,CAAC;IAEjF,gEAAgE;IAC7C,KAAK,EAAE,aAAa,CAAO;IAE9C,2BAA2B;IACS,IAAI,EAAE,iBAAiB,CAAO;IAElE,OAAO,CAAC,SAAS,CAAmC;cAEjC,MAAM,IAAI,cAAc;CAgC5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,oBAAoB,EAAE,uBAAuB,CAAC;KAC/C;CACF"}