@sbb-esta/lyne-elements-dev 4.7.0-dev.1773149675 → 4.7.0-dev.1773159918

package/form-field/error.js

@@ -1,4 +1,7 @@
-import { SbbErrorElement as o } from "./error/error.component.js";
+import { SbbErrorElement as e } from "./error/error.component.js";
+e.define();
+console.warn(`The entrypoint '@sbb-esta/elements/form-field/error.js' has been deprecated.
+Use either '@sbb-esta/elements/form-field.js' or '@sbb-esta/elements/form-field.pure.js' instead.`);
 export {
-  o as SbbErrorElement
+  e as SbbErrorElement
 };

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

@@ -1,36 +1,38 @@
-var oe = (o) => {
+var te = (o) => {
   throw TypeError(o);
 };
-var le = (o, l, n) => l.has(o) || oe("Cannot " + n);
-var b = (o, l, n) => (le(o, l, "read from private field"), n ? n.call(o) : l.get(o)), d = (o, l, n) => l.has(o) ? oe("Cannot add the same private member more than once") : l instanceof WeakSet ? l.add(o) : l.set(o, n), i = (o, l, n, f) => (le(o, l, "write to private field"), f ? f.call(o, n) : l.set(o, n), n);
+var se = (o, a, n) => a.has(o) || te("Cannot " + n);
+var b = (o, a, n) => (se(o, a, "read from private field"), n ? n.call(o) : a.get(o)), d = (o, a, n) => a.has(o) ? te("Cannot add the same private member more than once") : a instanceof WeakSet ? a.add(o) : a.set(o, n), i = (o, a, n, k) => (se(o, a, "write to private field"), k ? k.call(o, n) : a.set(o, n), n);
 import { __esDecorate as c, __runInitializers as r } from "tslib";
-import { css as pe, LitElement as he, isServer as me, nothing as ae, html as I } from "lit";
-import { customElement as ue, property as p, state as S } from "lit/decorators.js";
-import { sbbInputModalityDetector as _e } from "../../core/a11y.js";
-import { SbbLanguageController as ge } from "../../core/controllers.js";
-import { forceType as k } from "../../core/decorators.js";
-import { isLean as ve } from "../../core/dom.js";
-import { i18nOptional as ye } from "../../core/i18n.js";
-import { SbbNegativeMixin as xe, SbbElementInternalsMixin as Ee, SbbHydrationMixin as we, removeAriaElements as ke, appendAriaElements as ze } from "../../core/mixins.js";
-import { boxSizingStyles as Ie } from "../../core/styles.js";
+import { css as be, isServer as de, nothing as ie, html as I } from "lit";
+import { property as f, state as A } from "lit/decorators.js";
+import { sbbInputModalityDetector as ce } from "../../core/a11y.js";
+import { SbbElement as fe } from "../../core/base-elements.js";
+import { SbbLanguageController as pe } from "../../core/controllers.js";
+import { forceType as E } from "../../core/decorators.js";
+import { isLean as he } from "../../core/dom.js";
+import { i18nOptional as me } from "../../core/i18n.js";
+import { SbbNegativeMixin as ue, removeAriaElements as _e, appendAriaElements as ge } from "../../core/mixins.js";
+import { boxSizingStyles as ve } from "../../core/styles.js";
 import "../../icon.js";
-const Se = pe`@charset "UTF-8";:host{display:inline-block;color:var(--sbb-color-3);--sbb-form-field-background-color: var(--sbb-background-color-1);--sbb-form-field-border-color: var(--sbb-border-color-5);--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-label-color: light-dark(var(--sbb-color-metal), var(--sbb-color-smoke));--sbb-form-field-prefix-color: var(--sbb-color-metal);--sbb-form-field-prefix-color: light-dark(var(--sbb-color-metal), var(--sbb-color-smoke));--sbb-form-field-padding-inline: var(--sbb-spacing-fixed-3x);--sbb-form-field-text-color: var(--sbb-color-3);--sbb-form-field-arrow-color: var(--sbb-color-3);--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-text-font-size-m);--sbb-form-field-label-text-size: var(--sbb-text-font-size-xs);--sbb-form-field-label-size: calc( var(--sbb-form-field-label-text-size) * var(--sbb-typo-line-height-text) );--sbb-form-field-text-line-height: calc( var(--sbb-form-field-input-text-size) * var(--sbb-typo-line-height-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);--sbb-focus-outline-color: light-dark( var(--sbb-focus-outline-color-default), var(--sbb-focus-outline-color-dark) )}@media(min-width:64rem){: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]){color:var(--sbb-color-3-negative);--sbb-form-field-background-color: var(--sbb-background-color-1-negative);--sbb-form-field-border-color: var(--sbb-border-color-5);--sbb-form-field-label-color: var(--sbb-color-5);--sbb-form-field-prefix-color: var(--sbb-color-5);--sbb-form-field-text-color: var(--sbb-color-3-negative);--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);--sbb-form-field-arrow-color: var(--sbb-color-3-negative)}@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-text-font-size-s);--sbb-form-field-label-text-size: var(--sbb-text-font-size-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:64rem){: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-text) * var(--sbb-text-font-size-xs) );--sbb-form-field-error-padding-block-start-override: var(--sbb-form-field-error-divider-width)}:host(:where(:is(:state(readonly),[state--readonly]),:is(:state(disabled),[state--disabled]))){--sbb-form-field-background-color: var(--sbb-background-color-3);--sbb-form-field-border-color: var(--sbb-color-graphite);--sbb-form-field-border-color: light-dark(var(--sbb-color-graphite), var(--sbb-color-smoke));--sbb-form-field-arrow-color: var(--sbb-color-granite);--sbb-form-field-arrow-color: light-dark(var(--sbb-color-granite), var(--sbb-color-storm))}@media(forced-colors:active){:host(:where(:is(:state(readonly),[state--readonly]),:is(:state(disabled),[state--disabled]))){--sbb-form-field-border-color: ButtonBorder}}:host(:where(:is(:state(readonly),[state--readonly]),:is(:state(disabled),[state--disabled]))[negative]){--sbb-form-field-background-color: var(--sbb-background-color-3-negative);--sbb-form-field-border-color: var(--sbb-border-color-5);--sbb-form-field-arrow-color: var(--sbb-border-color-5)}:host(:where(:is(:state(disabled),[state--disabled]))){--sbb-form-field-label-color: var(--sbb-color-granite);--sbb-form-field-label-color: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));--sbb-form-field-prefix-color: var(--sbb-color-granite);--sbb-form-field-prefix-color: light-dark(var(--sbb-color-granite), var(--sbb-color-storm));--sbb-form-field-border-style: dashed}@media(forced-colors:active){:host(:where(:is(:state(disabled),[state--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(:where(:is(:state(disabled),[state--disabled]))[negative]){--sbb-form-field-text-color: var(--sbb-color-5);--sbb-form-field-label-color: var(--sbb-color-5);--sbb-form-field-prefix-color: var(--sbb-color-5)}:host(:where(:is(:state(readonly),[state--readonly])):not([negative])){--sbb-form-field-label-color: var(--sbb-color-granite);--sbb-form-field-label-color: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));--sbb-form-field-prefix-color: var(--sbb-color-granite);--sbb-form-field-prefix-color: light-dark(var(--sbb-color-granite), var(--sbb-color-storm))}:host(:where(:is(:state(focus),[state--focus]))){--sbb-form-field-border-color: var(--sbb-border-color-3);--sbb-form-field-prefix-color: var(--sbb-color-3);--sbb-form-field-border-width: var(--sbb-border-width-2x)}:host(:where(:is(:state(focus),[state--focus]))[negative]){--sbb-form-field-border-color: var(--sbb-border-color-3-negative);--sbb-form-field-prefix-color: var(--sbb-color-3-negative)}@media(forced-colors:active){:host(:is(:state(focus),[state--focus])){--sbb-form-field-border-color: Highlight;--sbb-form-field-prefix-color: Highlight}}:host(:not(:where(:is(:state(has-error),[state--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(:is(:state(slotted-label),[state--slotted-label])),[hidden-label])){--sbb-form-field-label-size: 0rem;--sbb-form-field-label-to-input-overlapping: 0rem}:host(:where(:is(:state(input-type-sbb-slider),[state--input-type-sbb-slider]))){--sbb-form-field-overflow: visible}.sbb-form-field__space-wrapper{display:flex;flex-direction:column;height:100%}.sbb-form-field__space-wrapper:before{content:"​";-webkit-user-select:none;user-select:none;width:0;height:0}.sbb-form-field__wrapper{display:flex;flex:1;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;inset: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);pointer-events:none}:host(:where(:is(:state(focus),[state--focus]):is(:state(focus-origin-keyboard),[state--focus-origin-keyboard]))) .sbb-form-field__wrapper{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);outline-offset:var(--sbb-form-field-outline-offset, var(--sbb-focus-outline-offset))}@media(forced-colors:none){:host(:is([borderless],:is(:state(input-type-sbb-slider),[state--input-type-sbb-slider]))) .sbb-form-field__wrapper:before{border-color:transparent}:host(:where(:is(:state(focus),[state--focus]),:is(:state(disabled),[state--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;z-index:var(--sbb-form-field-focus-underline-z-index, initial)}}::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(:where(:is(:state(empty),[state--empty]),:is(:state(disabled),[state--disabled]),:is(:state(readonly),[state--readonly]))) ::slotted(sbb-form-field-clear){display:none}::slotted(sbb-datepicker-toggle){padding-block-end: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{display:flex;flex-direction:column;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-text));margin-block-end:var(--sbb-form-field-spacer-margin-block-end)}:host(:not(:is(:state(slotted-label),[state--slotted-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-path: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:var(--sbb-cursor-default);position:absolute;inset-block-start:0;color:var(--sbb-form-field-label-color);--sbb-text-font-size: var(--sbb-text-font-size-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size)}:host([size=s]) .sbb-form-field__label{--sbb-text-font-size: var(--sbb-text-font-size-xxs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size)}:host(:where(:is(:state(input-type-select),[state--input-type-select]),:is(:state(input-type-sbb-select),[state--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-duration, var(--sbb-animation-duration-2x));transition-timing-function:var(--sbb-animation-easing);transition-property:transform,font-size}:host([floating-label]:is(:not(:where(:is(:state(focus),[state--focus])):not(:where(:is(:state(input-type-sbb-select),[state--input-type-sbb-select]))),:where(:is(:state(has-popup-open),[state--has-popup-open]))),:where(:is(:state(readonly),[state--readonly]))):where(:is(:state(empty),[state--empty]))) .sbb-form-field__label{font-size:var(--sbb-form-field-input-text-size);transform:translateY(var(--sbb-form-field-floating-label-transform))}@media(forced-colors:active){:host(:where(:is(:state(input-type-textarea),[state--input-type-textarea]))) .sbb-form-field__label{z-index:1}}.sbb-form-field__label-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.sbb-form-field__input{display:flex;flex:1;align-items:start}:host([size=s]:is(:is(:state(input-type-input),[state--input-type-input]),:is(:state(input-type-select),[state--input-type-select]),:is(:state(input-type-sbb-select),[state--input-type-sbb-select]),:is(:state(input-type-sbb-date-input),[state--input-type-sbb-date-input]),:is(:state(input-type-sbb-time-input),[state--input-type-sbb-time-input]))) .sbb-form-field__input{margin-block-end:-.125rem}.sbb-form-field__error{display:flex;min-height:var(--sbb-form-field-error-min-height);flex-direction:column;margin-block-start:var(--sbb-form-field-error-padding-block-start-override, var(--sbb-form-field-error-padding-block-start))}`;
-let ne = 0;
-const z = /* @__PURE__ */ new WeakMap(), be = ["input", "textarea", "select"];
-class qe extends Event {
+const ye = be`@charset "UTF-8";:host{display:inline-block;color:var(--sbb-color-3);--sbb-form-field-background-color: var(--sbb-background-color-1);--sbb-form-field-border-color: var(--sbb-border-color-5);--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-label-color: light-dark(var(--sbb-color-metal), var(--sbb-color-smoke));--sbb-form-field-prefix-color: var(--sbb-color-metal);--sbb-form-field-prefix-color: light-dark(var(--sbb-color-metal), var(--sbb-color-smoke));--sbb-form-field-padding-inline: var(--sbb-spacing-fixed-3x);--sbb-form-field-text-color: var(--sbb-color-3);--sbb-form-field-arrow-color: var(--sbb-color-3);--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-text-font-size-m);--sbb-form-field-label-text-size: var(--sbb-text-font-size-xs);--sbb-form-field-label-size: calc( var(--sbb-form-field-label-text-size) * var(--sbb-typo-line-height-text) );--sbb-form-field-text-line-height: calc( var(--sbb-form-field-input-text-size) * var(--sbb-typo-line-height-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);--sbb-focus-outline-color: light-dark( var(--sbb-focus-outline-color-default), var(--sbb-focus-outline-color-dark) )}@media(min-width:64rem){: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]){color:var(--sbb-color-3-negative);--sbb-form-field-background-color: var(--sbb-background-color-1-negative);--sbb-form-field-border-color: var(--sbb-border-color-5);--sbb-form-field-label-color: var(--sbb-color-5);--sbb-form-field-prefix-color: var(--sbb-color-5);--sbb-form-field-text-color: var(--sbb-color-3-negative);--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);--sbb-form-field-arrow-color: var(--sbb-color-3-negative)}@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-text-font-size-s);--sbb-form-field-label-text-size: var(--sbb-text-font-size-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:64rem){: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-text) * var(--sbb-text-font-size-xs) );--sbb-form-field-error-padding-block-start-override: var(--sbb-form-field-error-divider-width)}:host(:where(:is(:state(readonly),[state--readonly]),:is(:state(disabled),[state--disabled]))){--sbb-form-field-background-color: var(--sbb-background-color-3);--sbb-form-field-border-color: var(--sbb-color-graphite);--sbb-form-field-border-color: light-dark(var(--sbb-color-graphite), var(--sbb-color-smoke));--sbb-form-field-arrow-color: var(--sbb-color-granite);--sbb-form-field-arrow-color: light-dark(var(--sbb-color-granite), var(--sbb-color-storm))}@media(forced-colors:active){:host(:where(:is(:state(readonly),[state--readonly]),:is(:state(disabled),[state--disabled]))){--sbb-form-field-border-color: ButtonBorder}}:host(:where(:is(:state(readonly),[state--readonly]),:is(:state(disabled),[state--disabled]))[negative]){--sbb-form-field-background-color: var(--sbb-background-color-3-negative);--sbb-form-field-border-color: var(--sbb-border-color-5);--sbb-form-field-arrow-color: var(--sbb-border-color-5)}:host(:where(:is(:state(disabled),[state--disabled]))){--sbb-form-field-label-color: var(--sbb-color-granite);--sbb-form-field-label-color: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));--sbb-form-field-prefix-color: var(--sbb-color-granite);--sbb-form-field-prefix-color: light-dark(var(--sbb-color-granite), var(--sbb-color-storm));--sbb-form-field-border-style: dashed}@media(forced-colors:active){:host(:where(:is(:state(disabled),[state--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(:where(:is(:state(disabled),[state--disabled]))[negative]){--sbb-form-field-text-color: var(--sbb-color-5);--sbb-form-field-label-color: var(--sbb-color-5);--sbb-form-field-prefix-color: var(--sbb-color-5)}:host(:where(:is(:state(readonly),[state--readonly])):not([negative])){--sbb-form-field-label-color: var(--sbb-color-granite);--sbb-form-field-label-color: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));--sbb-form-field-prefix-color: var(--sbb-color-granite);--sbb-form-field-prefix-color: light-dark(var(--sbb-color-granite), var(--sbb-color-storm))}:host(:where(:is(:state(focus),[state--focus]))){--sbb-form-field-border-color: var(--sbb-border-color-3);--sbb-form-field-prefix-color: var(--sbb-color-3);--sbb-form-field-border-width: var(--sbb-border-width-2x)}:host(:where(:is(:state(focus),[state--focus]))[negative]){--sbb-form-field-border-color: var(--sbb-border-color-3-negative);--sbb-form-field-prefix-color: var(--sbb-color-3-negative)}@media(forced-colors:active){:host(:is(:state(focus),[state--focus])){--sbb-form-field-border-color: Highlight;--sbb-form-field-prefix-color: Highlight}}:host(:not(:where(:is(:state(has-error),[state--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(:is(:state(slotted-label),[state--slotted-label])),[hidden-label])){--sbb-form-field-label-size: 0rem;--sbb-form-field-label-to-input-overlapping: 0rem}:host(:where(:is(:state(input-type-sbb-slider),[state--input-type-sbb-slider]))){--sbb-form-field-overflow: visible}.sbb-form-field__space-wrapper{display:flex;flex-direction:column;height:100%}.sbb-form-field__space-wrapper:before{content:"​";-webkit-user-select:none;user-select:none;width:0;height:0}.sbb-form-field__wrapper{display:flex;flex:1;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;inset: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);pointer-events:none}:host(:where(:is(:state(focus),[state--focus]):is(:state(focus-origin-keyboard),[state--focus-origin-keyboard]))) .sbb-form-field__wrapper{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);outline-offset:var(--sbb-form-field-outline-offset, var(--sbb-focus-outline-offset))}@media(forced-colors:none){:host(:is([borderless],:is(:state(input-type-sbb-slider),[state--input-type-sbb-slider]))) .sbb-form-field__wrapper:before{border-color:transparent}:host(:where(:is(:state(focus),[state--focus]),:is(:state(disabled),[state--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;z-index:var(--sbb-form-field-focus-underline-z-index, initial)}}::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(:where(:is(:state(empty),[state--empty]),:is(:state(disabled),[state--disabled]),:is(:state(readonly),[state--readonly]))) ::slotted(sbb-form-field-clear){display:none}::slotted(sbb-datepicker-toggle){padding-block-end: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{display:flex;flex-direction:column;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-text));margin-block-end:var(--sbb-form-field-spacer-margin-block-end)}:host(:not(:is(:state(slotted-label),[state--slotted-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-path: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:var(--sbb-cursor-default);position:absolute;inset-block-start:0;color:var(--sbb-form-field-label-color);--sbb-text-font-size: var(--sbb-text-font-size-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size)}:host([size=s]) .sbb-form-field__label{--sbb-text-font-size: var(--sbb-text-font-size-xxs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size)}:host(:where(:is(:state(input-type-select),[state--input-type-select]),:is(:state(input-type-sbb-select),[state--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-duration, var(--sbb-animation-duration-2x));transition-timing-function:var(--sbb-animation-easing);transition-property:transform,font-size}:host([floating-label]:is(:not(:where(:is(:state(focus),[state--focus])):not(:where(:is(:state(input-type-sbb-select),[state--input-type-sbb-select]))),:where(:is(:state(has-popup-open),[state--has-popup-open]))),:where(:is(:state(readonly),[state--readonly]))):where(:is(:state(empty),[state--empty]))) .sbb-form-field__label{font-size:var(--sbb-form-field-input-text-size);transform:translateY(var(--sbb-form-field-floating-label-transform))}@media(forced-colors:active){:host(:where(:is(:state(input-type-textarea),[state--input-type-textarea]))) .sbb-form-field__label{z-index:1}}.sbb-form-field__label-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.sbb-form-field__input{display:flex;flex:1;align-items:start}:host([size=s]:is(:is(:state(input-type-input),[state--input-type-input]),:is(:state(input-type-select),[state--input-type-select]),:is(:state(input-type-sbb-select),[state--input-type-sbb-select]),:is(:state(input-type-sbb-date-input),[state--input-type-sbb-date-input]),:is(:state(input-type-sbb-time-input),[state--input-type-sbb-time-input]))) .sbb-form-field__input{margin-block-end:-.125rem}.sbb-form-field__error{display:flex;min-height:var(--sbb-form-field-error-min-height);flex-direction:column;margin-block-start:var(--sbb-form-field-error-padding-block-start-override, var(--sbb-form-field-error-padding-block-start))}`;
+let re = 0;
+const z = /* @__PURE__ */ new WeakMap(), oe = ["input", "textarea", "select"];
+class $e extends Event {
   get control() {
     return this._control;
   }
-  constructor(l) {
-    super("formfieldcontrol"), this._control = l;
+  constructor(a) {
+    super("formfieldcontrol"), this._control = a;
   }
 }
-let je = (() => {
-  var h, m, u, _, g, v, y, x, E, w, a;
-  let o = [ue("sbb-form-field")], l, n = [], f, A = xe(Ee(we(he))), L, N = [], C = [], F, U = [], B = [], O, $ = [], D = [], M, T = [], V = [], q, j = [], H = [], G, R = [], P = [], W, Y = [], J = [], K, Q = [], X = [], Z, ee = [], te = [], se, ie = [], re = [];
-  return a = class extends A {
+let De = (() => {
+  var p, h, m, u, _, g, v, y, x, w, l;
+  let o = ue(fe), a, n = [], k = [], S, L = [], N = [], C, U = [], B = [], O, $ = [], D = [], M, T = [], V = [], q, j = [], H = [], G, R = [], P = [], W, Y = [], J = [], K, Q = [], X = [], Z, F = [], ee = [];
+  return l = class extends o {
     constructor() {
       super();
+      d(this, p);
       d(this, h);
       d(this, m);
       d(this, u);
@@ -39,7 +41,6 @@ let je = (() => {
       d(this, v);
       d(this, y);
       d(this, x);
-      d(this, E);
       d(this, w);
       this._excludedFocusElements = ["button", "sbb-popover", "sbb-option", "sbb-chip"], this._floatingLabelSupportedInputElements = [
         "input",
@@ -54,10 +55,10 @@ let je = (() => {
         "tel",
         "text",
         "url"
-      ], i(this, h, r(this, N, "none")), i(this, m, (r(this, C), r(this, U, !1))), i(this, u, (r(this, B), r(this, $, ve() ? "s" : "m"))), i(this, _, (r(this, D), r(this, T, !1))), i(this, g, (r(this, V), r(this, j, "default"))), i(this, v, (r(this, H), r(this, R, !1))), i(this, y, (r(this, P), r(this, Y, !1))), i(this, x, (r(this, J), r(this, Q, []))), i(this, E, (r(this, X), r(this, ee, null))), i(this, w, (r(this, te), r(this, ie, void 0))), this._language = (r(this, re), new ge(this)), this._formFieldAttributeObserver = me ? null : new MutationObserver((e) => {
+      ], i(this, p, r(this, n, "none")), i(this, h, (r(this, k), r(this, L, !1))), i(this, m, (r(this, N), r(this, U, he() ? "s" : "m"))), i(this, u, (r(this, B), r(this, $, !1))), i(this, _, (r(this, D), r(this, T, "default"))), i(this, g, (r(this, V), r(this, j, !1))), i(this, v, (r(this, H), r(this, R, !1))), i(this, y, (r(this, P), r(this, Y, []))), i(this, x, (r(this, J), r(this, Q, null))), i(this, w, (r(this, X), r(this, F, void 0))), this._language = (r(this, ee), new pe(this)), this._formFieldAttributeObserver = de ? null : new MutationObserver((e) => {
         e.some((t) => t.type === "attributes") && this._input && (this._readInputState(), this._registerInputFormListener(), this._checkAndUpdateInputEmpty());
       }), this._inputFormAbortController = new AbortController(), this._control = null, this.addEventListener?.("focusin", (e) => {
-        (e.target === this.inputElement || e.target === this.inputElement?.inputElement) && (this.internals.states.add("focus"), this.internals.states.add(`focus-origin-${_e.mostRecentModality}`));
+        (e.target === this.inputElement || e.target === this.inputElement?.inputElement) && (this.internals.states.add("focus"), this.internals.states.add(`focus-origin-${ce.mostRecentModality}`));
       }, { passive: !0 }), this.addEventListener?.("focusout", (e) => {
         if (e.target === this.inputElement || e.target === this.inputElement?.inputElement) {
           this._checkAndUpdateInputEmpty(), this.internals.states.delete("focus");
@@ -74,71 +75,71 @@ let je = (() => {
      * `reserve` does reserve one row for an error message.
      */
     get errorSpace() {
-      return b(this, h);
+      return b(this, p);
     }
     set errorSpace(e) {
-      i(this, h, e);
+      i(this, p, e);
     }
     /** Indicates whether the input is optional. */
     get optional() {
-      return b(this, m);
+      return b(this, h);
     }
     set optional(e) {
-      i(this, m, e);
+      i(this, h, e);
     }
     /**
      * Size variant, either l, m or s.
      * @default 'm' / 's' (lean)
      */
     get size() {
-      return b(this, u);
+      return b(this, m);
     }
     set size(e) {
-      i(this, u, e);
+      i(this, m, e);
     }
     /** Whether to display the form field without a border. */
     get borderless() {
-      return b(this, _);
+      return b(this, u);
     }
     set borderless(e) {
-      i(this, _, e);
+      i(this, u, e);
     }
     /** Defines the width of the component:
      * - `default`: the component has defined width and min-width;
      * - `collapse`: the component adapts itself to its inner input content. */
     get width() {
-      return b(this, g);
+      return b(this, _);
     }
     set width(e) {
-      i(this, g, e);
+      i(this, _, e);
     }
     /** Whether to visually hide the label. If hidden, screen readers will still read it. */
     get hiddenLabel() {
-      return b(this, v);
+      return b(this, g);
     }
     set hiddenLabel(e) {
-      i(this, v, e);
+      i(this, g, e);
     }
     /** Whether the label should float. If activated, the placeholder of the input is hidden. */
     get floatingLabel() {
-      return b(this, y);
+      return b(this, v);
     }
     set floatingLabel(e) {
-      i(this, y, e);
+      i(this, v, e);
     }
     /** It is used internally to get the `error` slot. */
     get _errorElements() {
-      return b(this, x);
+      return b(this, y);
     }
     set _errorElements(e) {
-      i(this, x, e);
+      i(this, y, e);
     }
     /** Reference to the slotted input element. */
     get _input() {
-      return b(this, E);
+      return b(this, x);
     }
     set _input(e) {
-      i(this, E, e);
+      i(this, x, e);
     }
     /** Reference to the slotted label elements. */
     get _label() {
@@ -198,16 +199,16 @@ let je = (() => {
     }
     _syncLabelInputReferences() {
       if (!(!this._input || !this._label))
-        if (be.includes(this._input.localName) || customElements.get(this._input.localName)?.formAssociated)
-          this._input.id ||= `sbb-form-field-input-${ne++}`, this._label.htmlFor = this._input.id;
+        if (oe.includes(this._input.localName) || customElements.get(this._input.localName)?.formAssociated)
+          this._input.id ||= `sbb-form-field-input-${re++}`, this._label.htmlFor = this._input.id;
         else {
-          this._label.id ||= `sbb-form-field-label-${ne++}`;
+          this._label.id ||= `sbb-form-field-label-${re++}`;
           const e = this._input.getAttribute("aria-labelledby")?.split(" ").filter((t) => !!t && t !== this._label.id) ?? [];
           this._input.setAttribute("aria-labelledby", [...e, this._label.id].join(" "));
         }
     }
     _isInputElement(e) {
-      return be.includes(e.localName) || !!customElements.get(e.localName)?.formAssociated;
+      return oe.includes(e.localName) || !!customElements.get(e.localName)?.formAssociated;
     }
     _readInputState() {
       this.toggleState("readonly", this._control?.readOnly ?? this._input.hasAttribute("readonly")), this.toggleState("disabled", this._control?.disabled ?? this._input.hasAttribute("disabled")), this.toggleState("has-popup-open", this._input.hasAttribute("data-expanded"));
@@ -227,14 +228,14 @@ let je = (() => {
       if (!t || !t.set || !t.get)
         return;
       z.set(e, t);
-      const { get: s, set: de } = t, ce = () => this._checkAndUpdateInputEmpty();
+      const { get: s, set: le } = t, ae = () => this._checkAndUpdateInputEmpty();
       Object.defineProperty(e, "value", {
         ...t,
         get() {
           return s.call(this);
         },
-        set(fe) {
-          de.call(this, fe), ce();
+        set(ne) {
+          le.call(this, ne), ae();
         }
       });
     }
@@ -258,13 +259,13 @@ let je = (() => {
      */
     _onSlotErrorChange(e) {
       const t = e.target.assignedElements();
-      this._input && this._input.ariaDescribedByElements?.length && (this._input.ariaDescribedByElements = ke(this._input.ariaDescribedByElements, ...this._errorElements ?? [])), this._errorElements = t;
+      this._input && this._input.ariaDescribedByElements?.length && (this._input.ariaDescribedByElements = _e(this._input.ariaDescribedByElements, ...this._errorElements ?? [])), this._errorElements = t;
       for (const s of this._errorElements)
         s.role ||= "status";
       this._assignErrorMessageElements(), this.toggleState("has-error", !!this._errorElements.length), this._syncNegative();
     }
     _assignErrorMessageElements() {
-      this._input && (this._input.ariaDescribedByElements = ze(this._input.ariaDescribedByElements, ...this._errorElements));
+      this._input && (this._input.ariaDescribedByElements = ge(this._input.ariaDescribedByElements, ...this._errorElements));
     }
     /** Manually reset the form field. Currently, this only resets the floating label. */
     reset() {
@@ -292,7 +293,7 @@ let je = (() => {
             <span class="sbb-form-field__label">
               <span class="sbb-form-field__label-ellipsis">
                 <slot name="label" @slotchange=${this._onSlotLabelChange}></slot>
-                ${this.optional ? I` <span aria-hidden="true"> ${ye[this._language.current]} </span>` : ae}
+                ${this.optional ? I` <span aria-hidden="true"> ${me[this._language.current]} </span>` : ie}
               </span>
             </span>
             <div class="sbb-form-field__input">
@@ -301,7 +302,7 @@ let je = (() => {
             ${this.hasUpdated && ["select", "sbb-select"].includes(this._input?.localName) ? I`<sbb-icon
                   name="chevron-small-down-small"
                   class="sbb-form-field__select-input-icon"
-                ></sbb-icon>` : ae}
+                ></sbb-icon>` : ie}
           </div>
           <slot name="suffix" @slotchange=${this._syncNegative}></slot>
         </div>
@@ -312,32 +313,32 @@ let je = (() => {
       </div>
     `;
     }
-  }, h = new WeakMap(), m = new WeakMap(), u = new WeakMap(), _ = new WeakMap(), g = new WeakMap(), v = new WeakMap(), y = new WeakMap(), x = new WeakMap(), E = new WeakMap(), w = new WeakMap(), f = a, (() => {
-    const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(A[Symbol.metadata] ?? null) : void 0;
-    L = [p({ attribute: "error-space", reflect: !0 })], F = [k(), p({ type: Boolean })], O = [p({ reflect: !0 })], M = [k(), p({ reflect: !0, type: Boolean })], q = [p({ reflect: !0 })], G = [k(), p({ attribute: "hidden-label", reflect: !0, type: Boolean })], W = [k(), p({ attribute: "floating-label", reflect: !0, type: Boolean })], K = [S()], Z = [S()], se = [S()], c(a, null, L, { kind: "accessor", name: "errorSpace", static: !1, private: !1, access: { has: (t) => "errorSpace" in t, get: (t) => t.errorSpace, set: (t, s) => {
+  }, p = new WeakMap(), h = new WeakMap(), m = new WeakMap(), u = new WeakMap(), _ = new WeakMap(), g = new WeakMap(), v = new WeakMap(), y = new WeakMap(), x = new WeakMap(), w = new WeakMap(), (() => {
+    const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(o[Symbol.metadata] ?? null) : void 0;
+    a = [f({ attribute: "error-space", reflect: !0 })], S = [E(), f({ type: Boolean })], C = [f({ reflect: !0 })], O = [E(), f({ reflect: !0, type: Boolean })], M = [f({ reflect: !0 })], q = [E(), f({ attribute: "hidden-label", reflect: !0, type: Boolean })], G = [E(), f({ attribute: "floating-label", reflect: !0, type: Boolean })], W = [A()], K = [A()], Z = [A()], c(l, null, a, { kind: "accessor", name: "errorSpace", static: !1, private: !1, access: { has: (t) => "errorSpace" in t, get: (t) => t.errorSpace, set: (t, s) => {
       t.errorSpace = s;
-    } }, metadata: e }, N, C), c(a, null, F, { kind: "accessor", name: "optional", static: !1, private: !1, access: { has: (t) => "optional" in t, get: (t) => t.optional, set: (t, s) => {
+    } }, metadata: e }, n, k), c(l, null, S, { kind: "accessor", name: "optional", static: !1, private: !1, access: { has: (t) => "optional" in t, get: (t) => t.optional, set: (t, s) => {
       t.optional = s;
-    } }, metadata: e }, U, B), c(a, null, O, { kind: "accessor", name: "size", static: !1, private: !1, access: { has: (t) => "size" in t, get: (t) => t.size, set: (t, s) => {
+    } }, metadata: e }, L, N), c(l, null, C, { kind: "accessor", name: "size", static: !1, private: !1, access: { has: (t) => "size" in t, get: (t) => t.size, set: (t, s) => {
       t.size = s;
-    } }, metadata: e }, $, D), c(a, null, M, { kind: "accessor", name: "borderless", static: !1, private: !1, access: { has: (t) => "borderless" in t, get: (t) => t.borderless, set: (t, s) => {
+    } }, metadata: e }, U, B), c(l, null, O, { kind: "accessor", name: "borderless", static: !1, private: !1, access: { has: (t) => "borderless" in t, get: (t) => t.borderless, set: (t, s) => {
       t.borderless = s;
-    } }, metadata: e }, T, V), c(a, null, q, { kind: "accessor", name: "width", static: !1, private: !1, access: { has: (t) => "width" in t, get: (t) => t.width, set: (t, s) => {
+    } }, metadata: e }, $, D), c(l, null, M, { kind: "accessor", name: "width", static: !1, private: !1, access: { has: (t) => "width" in t, get: (t) => t.width, set: (t, s) => {
       t.width = s;
-    } }, metadata: e }, j, H), c(a, null, G, { kind: "accessor", name: "hiddenLabel", static: !1, private: !1, access: { has: (t) => "hiddenLabel" in t, get: (t) => t.hiddenLabel, set: (t, s) => {
+    } }, metadata: e }, T, V), c(l, null, q, { kind: "accessor", name: "hiddenLabel", static: !1, private: !1, access: { has: (t) => "hiddenLabel" in t, get: (t) => t.hiddenLabel, set: (t, s) => {
       t.hiddenLabel = s;
-    } }, metadata: e }, R, P), c(a, null, W, { kind: "accessor", name: "floatingLabel", static: !1, private: !1, access: { has: (t) => "floatingLabel" in t, get: (t) => t.floatingLabel, set: (t, s) => {
+    } }, metadata: e }, j, H), c(l, null, G, { kind: "accessor", name: "floatingLabel", static: !1, private: !1, access: { has: (t) => "floatingLabel" in t, get: (t) => t.floatingLabel, set: (t, s) => {
       t.floatingLabel = s;
-    } }, metadata: e }, Y, J), c(a, null, K, { kind: "accessor", name: "_errorElements", static: !1, private: !1, access: { has: (t) => "_errorElements" in t, get: (t) => t._errorElements, set: (t, s) => {
+    } }, metadata: e }, R, P), c(l, null, W, { kind: "accessor", name: "_errorElements", static: !1, private: !1, access: { has: (t) => "_errorElements" in t, get: (t) => t._errorElements, set: (t, s) => {
       t._errorElements = s;
-    } }, metadata: e }, Q, X), c(a, null, Z, { kind: "accessor", name: "_input", static: !1, private: !1, access: { has: (t) => "_input" in t, get: (t) => t._input, set: (t, s) => {
+    } }, metadata: e }, Y, J), c(l, null, K, { kind: "accessor", name: "_input", static: !1, private: !1, access: { has: (t) => "_input" in t, get: (t) => t._input, set: (t, s) => {
       t._input = s;
-    } }, metadata: e }, ee, te), c(a, null, se, { kind: "accessor", name: "_label", static: !1, private: !1, access: { has: (t) => "_label" in t, get: (t) => t._label, set: (t, s) => {
+    } }, metadata: e }, Q, X), c(l, null, Z, { kind: "accessor", name: "_label", static: !1, private: !1, access: { has: (t) => "_label" in t, get: (t) => t._label, set: (t, s) => {
       t._label = s;
-    } }, metadata: e }, ie, re), c(null, l = { value: f }, o, { kind: "class", name: f.name, metadata: e }, null, n), f = l.value, e && Object.defineProperty(f, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
-  })(), a.styles = [Ie, Se], r(f, n), f;
+    } }, metadata: e }, F, ee), e && Object.defineProperty(l, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
+  })(), l.elementName = "sbb-form-field", l.styles = [ve, ye], l;
 })();
 export {
-  qe as SbbFormFieldControlEvent,
-  je as SbbFormFieldElement
+  $e as SbbFormFieldControlEvent,
+  De as SbbFormFieldElement
 };

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

@@ -1,38 +1,31 @@
-import { __esDecorate as n, __runInitializers as o } from "tslib";
-import { html as m } from "lit";
-import { customElement as c } from "lit/decorators.js";
-import { miniButtonStyle as u } from "../../button/common.js";
-import { SbbButtonBaseElement as b } from "../../core/base-elements.js";
-import { SbbLanguageController as p } from "../../core/controllers.js";
-import { i18nClearInput as d } from "../../core/i18n.js";
-import { SbbNegativeMixin as f } from "../../core/mixins.js";
-import { boxSizingStyles as h } from "../../core/styles.js";
+import { html as s } from "lit";
+import { miniButtonStyle as n } from "../../button/common.js";
+import { SbbButtonBaseElement as r } from "../../core/base-elements.js";
+import { SbbLanguageController as o } from "../../core/controllers.js";
+import { i18nClearInput as a } from "../../core/i18n.js";
+import { SbbNegativeMixin as l } from "../../core/mixins.js";
+import { boxSizingStyles as c } from "../../core/styles.js";
 import "../../icon.js";
-let x = (() => {
-  var i;
-  let s = [c("sbb-form-field-clear")], l, a = [], e, r = f(b);
-  return i = class extends r {
-    constructor() {
-      super(), this._language = new p(this), this.addEventListener?.("click", () => this._handleClick());
-    }
-    connectedCallback() {
-      super.connectedCallback(), this._formField = this.closest("sbb-form-field"), this._formField && (this.slot ||= "suffix", this.negative = this._formField.hasAttribute("negative"));
-    }
-    async _handleClick() {
-      const t = this._formField?.inputElement;
-      !t || t.localName !== "input" || (this._formField?.clear(), t.focus(), t.dispatchEvent(new InputEvent("input", { bubbles: !0, composed: !0 })), t.dispatchEvent(new Event("change", { bubbles: !0 })));
-    }
-    willUpdate(t) {
-      super.willUpdate(t), this.internals.ariaLabel = d[this._language.current];
-    }
-    renderTemplate() {
-      return m`<sbb-icon name="cross-small"></sbb-icon>`;
-    }
-  }, e = i, (() => {
-    const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(r[Symbol.metadata] ?? null) : void 0;
-    n(null, l = { value: e }, s, { kind: "class", name: e.name, metadata: t }, null, a), e = l.value, t && Object.defineProperty(e, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
-  })(), i.styles = [h, u], o(e, a), e;
-})();
+const e = class e extends l(r) {
+  constructor() {
+    super(), this._language = new o(this), this.addEventListener?.("click", () => this._handleClick());
+  }
+  connectedCallback() {
+    super.connectedCallback(), this._formField = this.closest("sbb-form-field"), this._formField && (this.slot ||= "suffix", this.negative = this._formField.hasAttribute("negative"));
+  }
+  async _handleClick() {
+    const t = this._formField?.inputElement;
+    !t || t.localName !== "input" || (this._formField?.clear(), t.focus(), t.dispatchEvent(new InputEvent("input", { bubbles: !0, composed: !0 })), t.dispatchEvent(new Event("change", { bubbles: !0 })));
+  }
+  willUpdate(t) {
+    super.willUpdate(t), this.internals.ariaLabel = a[this._language.current];
+  }
+  renderTemplate() {
+    return s`<sbb-icon name="cross-small"></sbb-icon>`;
+  }
+};
+e.elementName = "sbb-form-field-clear", e.styles = [c, n];
+let i = e;
 export {
-  x as SbbFormFieldClearElement
+  i as SbbFormFieldClearElement
 };

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

@@ -1,4 +1,7 @@
-import { SbbFormFieldClearElement as l } from "./form-field-clear/form-field-clear.component.js";
+import { SbbFormFieldClearElement as e } from "./form-field-clear/form-field-clear.component.js";
+e.define();
+console.warn(`The entrypoint '@sbb-esta/elements/form-field/form-field-clear.js' has been deprecated.
+Use either '@sbb-esta/elements/form-field.js' or '@sbb-esta/elements/form-field.pure.js' instead.`);
 export {
-  l as SbbFormFieldClearElement
+  e as SbbFormFieldClearElement
 };

package/form-field/form-field.js

@@ -1,5 +1,9 @@
-import { SbbFormFieldControlEvent as r, SbbFormFieldElement as b } from "./form-field/form-field.component.js";
+import { SbbFormFieldElement as e } from "./form-field/form-field.component.js";
+import { SbbFormFieldControlEvent as s } from "./form-field/form-field.component.js";
+e.define();
+console.warn(`The entrypoint '@sbb-esta/elements/form-field/form-field.js' has been deprecated.
+Use either '@sbb-esta/elements/form-field.js' or '@sbb-esta/elements/form-field.pure.js' instead.`);
 export {
-  r as SbbFormFieldControlEvent,
-  b as SbbFormFieldElement
+  s as SbbFormFieldControlEvent,
+  e as SbbFormFieldElement
 };

package/form-field.js

@@ -1,9 +1,13 @@
-import { SbbErrorElement as o } from "./form-field/error/error.component.js";
-import { SbbFormFieldControlEvent as b, SbbFormFieldElement as l } from "./form-field/form-field/form-field.component.js";
-import { SbbFormFieldClearElement as F } from "./form-field/form-field-clear/form-field-clear.component.js";
+import { SbbErrorElement as e } from "./form-field/error/error.component.js";
+import { SbbFormFieldClearElement as r } from "./form-field/form-field-clear/form-field-clear.component.js";
+import { SbbFormFieldElement as o } from "./form-field/form-field/form-field.component.js";
+import { SbbFormFieldControlEvent as n } from "./form-field/form-field/form-field.component.js";
+e.define();
+o.define();
+r.define();
 export {
-  o as SbbErrorElement,
-  F as SbbFormFieldClearElement,
-  b as SbbFormFieldControlEvent,
-  l as SbbFormFieldElement
+  e as SbbErrorElement,
+  r as SbbFormFieldClearElement,
+  n as SbbFormFieldControlEvent,
+  o as SbbFormFieldElement
 };

package/form-field.pure.js

@@ -0,0 +1,9 @@
+import { SbbErrorElement as o } from "./form-field/error/error.component.js";
+import { SbbFormFieldClearElement as b } from "./form-field/form-field-clear/form-field-clear.component.js";
+import { SbbFormFieldControlEvent as t, SbbFormFieldElement as F } from "./form-field/form-field/form-field.component.js";
+export {
+  o as SbbErrorElement,
+  b as SbbFormFieldClearElement,
+  t as SbbFormFieldControlEvent,
+  F as SbbFormFieldElement
+};

package/header/common.js

@@ -1,4 +1,6 @@
-import { SbbHeaderActionCommonElementMixin as m } from "./common/header-action-common.js";
+import { SbbHeaderActionCommonElementMixin as n } from "./common/header-action-common.js";
+console.warn(`The entrypoint '@sbb-esta/elements/header/common.js' has been deprecated.
+Use either '@sbb-esta/elements/header.js' or '@sbb-esta/elements/header.pure.js' instead.`);
 export {
-  m as SbbHeaderActionCommonElementMixin
+  n as SbbHeaderActionCommonElementMixin
 };