@sbb-esta/lyne-elements 1.15.1 → 2.0.0

package/flip-card/flip-card.js

@@ -1,11 +1,11 @@
-var C = (e) => {
+var k = (e) => {
   throw TypeError(e);
 };
-var k = (e, a, s) => a.has(e) || C("Cannot " + s);
-var m = (e, a, s) => (k(e, a, "read from private field"), s ? s.call(e) : a.get(e)), f = (e, a, s) => a.has(e) ? C("Cannot add the same private member more than once") : a instanceof WeakSet ? a.add(e) : a.set(e, s), d = (e, a, s, r) => (k(e, a, "write to private field"), r ? r.call(e, s) : a.set(e, s), s);
+var w = (e, a, s) => a.has(e) || k("Cannot " + s);
+var m = (e, a, s) => (w(e, a, "read from private field"), s ? s.call(e) : a.get(e)), f = (e, a, s) => a.has(e) ? k("Cannot add the same private member more than once") : a instanceof WeakSet ? a.add(e) : a.set(e, s), d = (e, a, s, r) => (w(e, a, "write to private field"), r ? r.call(e, s) : a.set(e, s), s);
 import { __runInitializers as c, __esDecorate as h } from "tslib";
-import { ResizeController as w } from "@lit-labs/observers/resize-controller.js";
-import { css as L, LitElement as S, isServer as E, html as D } from "lit";
+import { ResizeController as L } from "@lit-labs/observers/resize-controller.js";
+import { css as z, LitElement as S, isServer as E, html as D } from "lit";
 import { customElement as H, property as R, state as $ } from "lit/decorators.js";
 import { until as I } from "lit/directives/until.js";
 import { IS_FOCUSABLE_QUERY as O } from "../core/a11y.js";
@@ -16,16 +16,16 @@ import { i18nFlipCard as q, i18nReverseCard as M } from "../core/i18n.js";
 import { SbbHydrationMixin as P } from "../core/mixins.js";
 import "../button/secondary-button-static.js";
 import "../screen-reader-only.js";
-const U = L`*,:before,:after{box-sizing:border-box}:host{--sbb-flip-card-toggle-icon-transform: rotate(0);--sbb-flip-card-background-color: var(--sbb-color-cloud);--sbb-flip-card-border-radius: var(--sbb-border-radius-4x);--sbb-flip-card-min-height: 17.5rem;--sbb-flip-card-summary-transition-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-5x) );--sbb-flip-card-summary-transition-delay: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-2x) );--sbb-flip-card-details-transition-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-4x) );position:relative;display:block}@media (min-width: 52.5rem){:host{--sbb-flip-card-min-height: 20rem}}@media (any-hover: hover){:host(:hover){--sbb-flip-card-background-color: var(--sbb-color-cloud-alpha-80);--sbb-flip-card-translate-title-y-hover: -.0625rem}}:host([data-flipped]){--sbb-flip-card-toggle-icon-transform: rotate(45deg);--sbb-flip-card-details-transition-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-2x) );--sbb-flip-card-summary-transition-delay: 0s}:host([data-flipped]) ::slotted(sbb-flip-card-summary){--sbb-flip-card-summary-opacity: 0;--sbb-flip-card-summary-pointer-events: none}:host([data-flipped]) ::slotted(sbb-flip-card-details){--sbb-flip-card-details-opacity: 1;--sbb-flip-card-details-translate-y: 0}@media (min-width: 37.5rem) and (max-width: 52.4375rem){:host([data-image-alignment=after]){--sbb-flip-card-min-height: 15rem}}@media (min-width: 80rem){:host([data-image-alignment=after]){--sbb-flip-card-min-height: 25rem}}.sbb-flip-card{position:relative;display:flex;height:100%;flex-flow:wrap;flex-direction:column;gap:var(--sbb-spacing-responsive-xs);min-height:var(--sbb-flip-card-min-height);background-color:var(--sbb-flip-card-background-color);border-radius:var(--sbb-flip-card-border-radius);transition:all var(--sbb-flip-card-summary-transition-duration) ease-out,min-height var(--sbb-flip-card-details-transition-duration);transition-delay:var(--sbb-flip-card-summary-transition-delay);cursor:pointer}:host([data-flipped]) .sbb-flip-card{min-height:max(var(--sbb-flip-card-min-height),var(--sbb-flip-card-details-height))}@media (forced-colors: active){.sbb-flip-card:after{content:"";border:var(--sbb-border-width-2x) solid CanvasText;border-radius:var(--sbb-flip-card-border-radius);position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}}@media (forced-colors: active) and (any-hover: hover){:host(:hover) .sbb-flip-card:after{border-color:Highlight}}.sbb-flip-card:before{content:"";opacity:0;pointer-events:none;position:absolute;inset-inline-start:var(--sbb-spacing-responsive-s);inset-block-end:var(--sbb-spacing-responsive-s);background-color:var(--sbb-color-midnight);width:var(--sbb-size-element-xs);height:var(--sbb-size-element-xs);border-radius:16rem;transition:var(--sbb-disable-animation-zero-time, var(--sbb-animation-duration-3x)) ease-out}:host([data-flipped]) .sbb-flip-card:before{opacity:1;inset-inline-start:0;inset-block-end:0;width:100%;height:100%;border-radius:var(--sbb-flip-card-border-radius);transition-duration:var(--sbb-disable-animation-zero-time, var(--sbb-animation-duration-5x))}.sbb-flip-card--toggle-button{position:absolute;inset-inline-start:var(--sbb-spacing-responsive-s);inset-block-end:var(--sbb-spacing-responsive-s)}:host([data-flipped]) .sbb-flip-card--toggle-button{--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark)}.sbb-flip-card--toggle-button-icon{transform:var(--sbb-flip-card-toggle-icon-transform);transition:transform var(--sbb-flip-card-summary-transition-duration) ease-out}.sbb-flip-card-button{-webkit-appearance:none;-moz-appearance:none;box-sizing:border-box;margin:0;outline:none;border:none;border-radius:0;padding:0;background:none;-webkit-tap-highlight-color:transparent;color:inherit;position:absolute;top:0;right:0;bottom:0;left:0;width:100%;border-radius:var(--sbb-flip-card-border-radius);cursor:pointer}.sbb-flip-card-button:not([data-focus-origin=mouse],[data-focus-origin=touch]):focus-visible{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}`;
+const U = z`*,:before,:after{box-sizing:border-box}:host{--sbb-flip-card-toggle-icon-transform: rotate(0);--sbb-flip-card-background-color: var(--sbb-color-cloud);--sbb-flip-card-border-radius: var(--sbb-border-radius-4x);--sbb-flip-card-min-height: 17.5rem;--sbb-flip-card-summary-transition-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-5x) );--sbb-flip-card-summary-transition-delay: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );--sbb-flip-card-details-transition-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-4x) );position:relative;display:block}@media (min-width: 52.5rem){:host{--sbb-flip-card-min-height: 20rem}}@media (any-hover: hover){:host(:hover){--sbb-flip-card-background-color: var(--sbb-color-cloud-alpha-80);--sbb-flip-card-translate-title-y-hover: -.0625rem}}:host([data-flipped]){--sbb-flip-card-toggle-icon-transform: rotate(45deg);--sbb-flip-card-details-transition-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );--sbb-flip-card-summary-transition-delay: 0s}:host([data-flipped]) ::slotted(sbb-flip-card-summary){--sbb-flip-card-summary-opacity: 0;--sbb-flip-card-summary-pointer-events: none}:host([data-flipped]) ::slotted(sbb-flip-card-details){--sbb-flip-card-details-opacity: 1;--sbb-flip-card-details-translate-y: 0}@media (min-width: 37.5rem) and (max-width: 52.4375rem){:host([data-image-alignment=after]){--sbb-flip-card-min-height: 15rem}}@media (min-width: 80rem){:host([data-image-alignment=after]){--sbb-flip-card-min-height: 25rem}}.sbb-flip-card{position:relative;display:flex;height:100%;flex-flow:wrap;flex-direction:column;gap:var(--sbb-spacing-responsive-xs);min-height:var(--sbb-flip-card-min-height);background-color:var(--sbb-flip-card-background-color);border-radius:var(--sbb-flip-card-border-radius);transition:all var(--sbb-flip-card-summary-transition-duration) ease-out,min-height var(--sbb-flip-card-details-transition-duration);transition-delay:var(--sbb-flip-card-summary-transition-delay);cursor:pointer}:host([data-flipped]) .sbb-flip-card{min-height:max(var(--sbb-flip-card-min-height),var(--sbb-flip-card-details-height))}@media (forced-colors: active){.sbb-flip-card:after{content:"";border:var(--sbb-border-width-2x) solid CanvasText;border-radius:var(--sbb-flip-card-border-radius);position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}}@media (forced-colors: active) and (any-hover: hover){:host(:hover) .sbb-flip-card:after{border-color:Highlight}}.sbb-flip-card:before{content:"";opacity:0;pointer-events:none;position:absolute;inset-inline-start:var(--sbb-spacing-responsive-s);inset-block-end:var(--sbb-spacing-responsive-s);background-color:var(--sbb-color-midnight);width:var(--sbb-size-element-xs);height:var(--sbb-size-element-xs);border-radius:16rem;transition:var(--sbb-disable-animation-duration, var(--sbb-animation-duration-3x)) ease-out}:host([data-flipped]) .sbb-flip-card:before{opacity:1;inset-inline-start:0;inset-block-end:0;width:100%;height:100%;border-radius:var(--sbb-flip-card-border-radius);transition-duration:var(--sbb-disable-animation-duration, var(--sbb-animation-duration-5x))}.sbb-flip-card--toggle-button{position:absolute;inset-inline-start:var(--sbb-spacing-responsive-s);inset-block-end:var(--sbb-spacing-responsive-s)}:host([data-flipped]) .sbb-flip-card--toggle-button{--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark)}.sbb-flip-card--toggle-button-icon{transform:var(--sbb-flip-card-toggle-icon-transform);transition:transform var(--sbb-flip-card-summary-transition-duration) ease-out}.sbb-flip-card-button{-webkit-appearance:none;-moz-appearance:none;box-sizing:border-box;margin:0;outline:none;border:none;border-radius:0;padding:0;background:none;-webkit-tap-highlight-color:transparent;color:inherit;position:absolute;top:0;right:0;bottom:0;left:0;width:100%;border-radius:var(--sbb-flip-card-border-radius);cursor:pointer}.sbb-flip-card-button:not([data-focus-origin=mouse],[data-focus-origin=touch]):focus-visible{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}`;
 let st = (() => {
   var l, n, o;
-  let e = [H("sbb-flip-card")], a, s = [], r, u = P(S), g, v = [], _ = [], y, x = [], z = [];
+  let e = [H("sbb-flip-card")], a, s = [], r, u = P(S), g, v = [], _ = [], y, x = [], C = [];
   var p = (o = class extends u {
     constructor() {
       super(...arguments);
       f(this, l);
       f(this, n);
-      d(this, l, c(this, v, "")), this.flip = (c(this, _), new j(this, p.events.flip)), d(this, n, c(this, x, !1)), this._abort = (c(this, z), new F(this)), this._language = new A(this), this._cardDetailsResizeObserver = new w(this, {
+      d(this, l, c(this, v, "")), this.flip = (c(this, _), new j(this, p.events.flip)), d(this, n, c(this, x, !1)), this._abort = (c(this, C), new F(this)), this._language = new A(this), this._cardDetailsResizeObserver = new L(this, {
         target: null,
         skipInitial: !0,
         callback: () => this._setCardDetailsHeight()
@@ -113,7 +113,7 @@ let st = (() => {
       i.accessibilityLabel = b;
     } }, metadata: t }, v, _), h(o, null, y, { kind: "accessor", name: "_flipped", static: !1, private: !1, access: { has: (i) => "_flipped" in i, get: (i) => i._flipped, set: (i, b) => {
       i._flipped = b;
-    } }, metadata: t }, x, z), h(null, a = { value: r }, e, { kind: "class", name: r.name, metadata: t }, null, s), p = r = a.value, t && Object.defineProperty(r, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
+    } }, metadata: t }, x, C), h(null, a = { value: r }, e, { kind: "class", name: r.name, metadata: t }, null, s), p = r = a.value, t && Object.defineProperty(r, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
   })(), o.styles = U, o.events = {
     flip: "flip"
   }, c(r, s), o);

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

@@ -1,4 +1,4 @@
-import { CSSResultGroup, PropertyValues, TemplateResult, LitElement } from 'lit';
+import { CSSResultGroup, LitElement, PropertyValues, TemplateResult } from 'lit';
 declare const SbbFormFieldElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbNegativeMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbHydrationMixinType> & typeof LitElement;
 /**
  * It wraps an input element adding label, errors, icon, etc.
@@ -24,7 +24,10 @@ export declare class SbbFormFieldElement extends SbbFormFieldElement_base {
     accessor errorSpace: 'none' | 'reserve';
     /** Indicates whether the input is optional. */
     accessor optional: boolean;
-    /** Size variant, either l or m. */
+    /**
+     * Size variant, either l, m or s.
+     * @default 'm' / 's' (lean)
+     */
     accessor size: 'l' | 'm' | 's';
     /** Whether to display the form field without a border. */
     accessor borderless: boolean;
@@ -46,7 +49,6 @@ export declare class SbbFormFieldElement extends SbbFormFieldElement_base {
     private accessor _label;
     /** Returns the input element. */
     get inputElement(): HTMLInputElement | HTMLSelectElement | HTMLElement | undefined;
-    private _abort;
     private _language;
     /**
      * Listens to the changes on `readonly` and `disabled` attributes of `<input>`.
@@ -56,8 +58,6 @@ export declare class SbbFormFieldElement extends SbbFormFieldElement_base {
     connectedCallback(): void;
     protected willUpdate(changedProperties: PropertyValues<this>): void;
     disconnectedCallback(): void;
-    private _onPopupOpen;
-    private _onPopupClose;
     private _handleWrapperClick;
     private _isButtonOrPopup;
     private _onSlotLabelChange;
@@ -68,6 +68,8 @@ export declare class SbbFormFieldElement extends SbbFormFieldElement_base {
     private _syncLabelInputReferences;
     private _registerInputListener;
     private _getInputForm;
+    private _patchInputValue;
+    private _unpatchInputValue;
     private _checkAndUpdateInputEmpty;
     private _isInputEmpty;
     private _isInputValueEmpty;
@@ -82,11 +84,6 @@ export declare class SbbFormFieldElement extends SbbFormFieldElement_base {
     reset(): void;
     /** Manually clears the input value. It only works for inputs, selects are not supported. */
     clear(): void;
-    /**
-     * Returns the input element.
-     * @deprecated Use the 'inputElement' property instead
-     */
-    getInputElement(): HTMLInputElement | HTMLSelectElement | HTMLElement | undefined;
     private _syncNegative;
     protected render(): TemplateResult;
 }

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,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,qBAGM,mBAAoB,SAAQ,wBAA+C;IAC/E,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;IACH,SACgB,UAAU,EAAE,MAAM,GAAG,SAAS,CAAU;IAExD,+CAA+C;IAC/C,SAEgB,QAAQ,EAAE,OAAO,CAAS;IAE1C,mCAAmC;IACnC,SAA6C,IAAI,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,CAAO;IAEzE,0DAA0D;IAC1D,SAEgB,UAAU,EAAE,OAAO,CAAS;IAE5C;;+EAE2E;IAC3E,SAA6C,KAAK,EAAE,SAAS,GAAG,UAAU,CAAa;IAEvF,wFAAwF;IACxF,SAEgB,WAAW,EAAE,OAAO,CAAS;IAE7C,4FAA4F;IAC5F,SAEgB,aAAa,EAAE,OAAO,CAAS;IAE/C,qDAAqD;IAC5C,OAAO,CAAC,QAAQ,CAAC,cAAc,CAAiB;IAEzD,oEAAoE;IACpE,OAAO,CAAC,6BAA6B,CAAC,CAAgB;IAEtD,8CAA8C;IACrC,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAkE;IAElG,+CAA+C;IACtC,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAoB;IAEpD,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"}
+{"version":3,"file":"form-field.d.ts","sourceRoot":"","sources":["../../../../src/elements/form-field/form-field/form-field.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EAGnB,UAAU,EAEV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;AAcb,OAAO,eAAe,CAAC;;AAOvB;;;;;;;;GAQG;AACH,qBAGM,mBAAoB,SAAQ,wBAA+C;IAC/E,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,CAA2C;IAElF,OAAO,CAAC,QAAQ,CAAC,oCAAoC,CAKnD;IAEF,OAAO,CAAC,QAAQ,CAAC,iCAAiC,CAQhD;IAEF;;;;OAIG;IACH,SACgB,UAAU,EAAE,MAAM,GAAG,SAAS,CAAU;IAExD,+CAA+C;IAC/C,SAEgB,QAAQ,EAAE,OAAO,CAAS;IAE1C;;;OAGG;IACH,SAA6C,IAAI,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,CAAwB;IAE1F,0DAA0D;IAC1D,SAEgB,UAAU,EAAE,OAAO,CAAS;IAE5C;;+EAE2E;IAC3E,SAA6C,KAAK,EAAE,SAAS,GAAG,UAAU,CAAa;IAEvF,wFAAwF;IACxF,SAEgB,WAAW,EAAE,OAAO,CAAS;IAE7C,4FAA4F;IAC5F,SAEgB,aAAa,EAAE,OAAO,CAAS;IAE/C,qDAAqD;IAC5C,OAAO,CAAC,QAAQ,CAAC,cAAc,CAAiB;IAEzD,oEAAoE;IACpE,OAAO,CAAC,6BAA6B,CAAC,CAAgB;IAEtD,8CAA8C;IACrC,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAkE;IAElG,+CAA+C;IACtC,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAoB;IAEpD,iCAAiC;IACjC,IAAW,YAAY,IAAI,gBAAgB,GAAG,iBAAiB,GAAG,WAAW,GAAG,SAAS,CAExF;IAED,OAAO,CAAC,SAAS,CAAmC;IAEpD;;OAEG;IACH,OAAO,CAAC,2BAA2B,CAM1B;IAET,OAAO,CAAC,qBAAqB,CAAyB;IAEtC,iBAAiB,IAAI,IAAI;cAMtB,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAQ5D,oBAAoB,IAAI,IAAI;IAS5C,OAAO,CAAC,mBAAmB;IAgB3B,OAAO,CAAC,gBAAgB;IAUxB,OAAO,CAAC,kBAAkB;IAW1B;;OAEG;IACH,OAAO,CAAC,kBAAkB;IAkC1B,OAAO,CAAC,yBAAyB;IA4BjC,OAAO,CAAC,sBAAsB;IAsE9B,OAAO,CAAC,aAAa;IASrB,OAAO,CAAC,gBAAgB;IA4BxB,OAAO,CAAC,kBAAkB;IAS1B,OAAO,CAAC,yBAAyB;IAQjC,OAAO,CAAC,aAAa;IAerB,OAAO,CAAC,kBAAkB;IAK1B,OAAO,CAAC,YAAY;IAOpB,OAAO,CAAC,eAAe;IAoBvB;;OAEG;IACH,OAAO,CAAC,kBAAkB;IAsB1B,OAAO,CAAC,qBAAqB;IAiB7B,qFAAqF;IAC9E,KAAK,IAAI,IAAI;IAIpB,4FAA4F;IACrF,KAAK,IAAI,IAAI;IAQpB,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-clear.js

@@ -1,18 +1,18 @@
 import { __esDecorate as l, __runInitializers as d } from "tslib";
 import { css as c, html as u } from "lit";
-import { customElement as m } from "lit/decorators.js";
-import { SbbButtonBaseElement as v } from "../core/base-elements.js";
+import { customElement as v } from "lit/decorators.js";
+import { SbbButtonBaseElement as m } from "../core/base-elements.js";
 import { SbbConnectedAbortController as f, SbbLanguageController as h } from "../core/controllers.js";
 import { hostAttributes as g } from "../core/decorators.js";
 import { i18nClearInput as p } from "../core/i18n.js";
 import { SbbNegativeMixin as k } from "../core/mixins.js";
 import "../icon.js";
-const y = c`*,:before,:after{box-sizing:border-box}:host{display:block;outline:none!important}:host{display:inline-block;-webkit-tap-highlight-color:transparent;height:fit-content;outline:none!important;--sbb-button-color-text: var(--sbb-color-charcoal);--sbb-button-color-default-background: var(--sbb-color-black-alpha-0);--sbb-button-color-hover-background: var(--sbb-color-milk);--sbb-button-color-active-background: var(--sbb-color-cloud);--sbb-button-color-disabled-background: var(--sbb-color-milk);--sbb-button-color-disabled-border: var(--sbb-color-smoke);--sbb-button-color-disabled-text: var(--sbb-color-granite);--sbb-button-border-disabled-width: var(--sbb-border-width-1x);--sbb-button-border-disabled-style: dashed;--sbb-button-border-radius: var(--sbb-border-radius-infinity);--sbb-button-transition-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-2x) );--sbb-button-transition-easing-function: var(--sbb-animation-easing)}@media (forced-colors: active){:host{--sbb-button-color-text: ButtonText !important;--sbb-button-color-hover-background: Highlight !important;--sbb-button-color-active-background: Highlight !important;--sbb-button-color-disabled-background: Canvas !important;--sbb-button-color-disabled-border: GrayText !important;--sbb-button-color-disabled-text: GrayText !important}}:host .sbb-form-field-clear{position:relative;transition-duration:var(--sbb-button-transition-duration);transition-timing-function:var(--sbb-button-transition-easing-function);transition-property:color;border-radius:var(--sbb-button-border-radius);color:var(--sbb-button-color-text);cursor:pointer;-webkit-user-select:none;user-select:none;display:flex}:host .sbb-form-field-clear:before{position:absolute;content:"";top:0;right:0;bottom:0;left:0;border-radius:var(--sbb-button-border-radius);background-color:var(--sbb-button-color-default-background);transition-duration:var(--sbb-button-transition-duration);transition-timing-function:var(--sbb-button-transition-easing-function);transition-property:inset,background-color}sbb-icon{transition:transform var(--sbb-button-transition-duration) var(--sbb-button-transition-easing-function);transform:translateY(var(--sbb-button-translate-y-content-hover, 0rem));display:flex}:host([negative]){--sbb-button-color-text: var(--sbb-color-milk);--sbb-button-color-default-background: var(--sbb-color-black-alpha-0);--sbb-button-color-hover-background: var(--sbb-color-charcoal);--sbb-button-color-active-background: var(--sbb-color-iron);--sbb-button-color-disabled-background: var(--sbb-color-charcoal);--sbb-button-color-disabled-border: var(--sbb-color-smoke);--sbb-button-color-disabled-text: var(--sbb-color-smoke)}:host(:is([disabled],[data-disabled],[data-group-disabled])) .sbb-form-field-clear{color:var(--sbb-button-color-disabled-text);cursor:default;pointer-events:none}:host(:is([disabled],[data-disabled],[data-group-disabled])) .sbb-form-field-clear:before{background-color:var(--sbb-button-color-disabled-background);border:var(--sbb-button-border-disabled-width) var(--sbb-button-border-disabled-style) var(--sbb-button-color-disabled-border)}:host(:is([data-focus-visible],:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch]))) .sbb-form-field-clear:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}@media (any-hover: hover){:host(:not([disabled],[data-disabled],[data-group-disabled],:active,[data-active]):hover){--sbb-button-translate-y-content-hover: -.0625rem}}@media (any-hover: hover){:host(:not([disabled],[data-disabled],[data-group-disabled],:active,[data-active]):hover) .sbb-form-field-clear:before{background-color:var(--sbb-button-color-hover-background)}}:host(:not([disabled],[data-disabled],[data-group-disabled]):is(:active,[data-active])) .sbb-form-field-clear:before{background-color:var(--sbb-button-color-active-background)}`;
-let A = (() => {
+const y = c`*,:before,:after{box-sizing:border-box}:host{display:block;outline:none!important}:host{display:inline-block;-webkit-tap-highlight-color:transparent;height:fit-content;outline:none!important;--sbb-button-color-text: var(--sbb-color-charcoal);--sbb-button-color-default-background: var(--sbb-color-black-alpha-0);--sbb-button-color-hover-background: var(--sbb-color-milk);--sbb-button-color-active-background: var(--sbb-color-cloud);--sbb-button-color-disabled-background: var(--sbb-color-milk);--sbb-button-color-disabled-border: var(--sbb-color-smoke);--sbb-button-color-disabled-text: var(--sbb-color-granite);--sbb-button-border-disabled-width: var(--sbb-border-width-1x);--sbb-button-border-disabled-style: dashed;--sbb-button-border-radius: var(--sbb-border-radius-infinity);--sbb-button-transition-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );--sbb-button-transition-easing-function: var(--sbb-animation-easing)}@media (forced-colors: active){:host{--sbb-button-color-text: ButtonText !important;--sbb-button-color-hover-background: Highlight !important;--sbb-button-color-active-background: Highlight !important;--sbb-button-color-disabled-background: Canvas !important;--sbb-button-color-disabled-border: GrayText !important;--sbb-button-color-disabled-text: GrayText !important}}:host .sbb-form-field-clear{position:relative;transition-duration:var(--sbb-button-transition-duration);transition-timing-function:var(--sbb-button-transition-easing-function);transition-property:color;border-radius:var(--sbb-button-border-radius);color:var(--sbb-button-color-text);cursor:pointer;-webkit-user-select:none;user-select:none;display:flex}:host .sbb-form-field-clear:before{position:absolute;content:"";top:0;right:0;bottom:0;left:0;border-radius:var(--sbb-button-border-radius);background-color:var(--sbb-button-color-default-background);transition-duration:var(--sbb-button-transition-duration);transition-timing-function:var(--sbb-button-transition-easing-function);transition-property:inset,background-color}sbb-icon{transition:transform var(--sbb-button-transition-duration) var(--sbb-button-transition-easing-function);transform:translateY(var(--sbb-button-translate-y-content-hover, 0rem));display:flex}:host([negative]){--sbb-button-color-text: var(--sbb-color-milk);--sbb-button-color-default-background: var(--sbb-color-black-alpha-0);--sbb-button-color-hover-background: var(--sbb-color-charcoal);--sbb-button-color-active-background: var(--sbb-color-iron);--sbb-button-color-disabled-background: var(--sbb-color-charcoal);--sbb-button-color-disabled-border: var(--sbb-color-smoke);--sbb-button-color-disabled-text: var(--sbb-color-smoke)}:host(:is([disabled],:disabled,[disabled-interactive],[data-disabled],[data-group-disabled])) .sbb-form-field-clear{color:var(--sbb-button-color-disabled-text);cursor:default;pointer-events:none}:host(:is([disabled],:disabled,[disabled-interactive],[data-disabled],[data-group-disabled])) .sbb-form-field-clear:before{background-color:var(--sbb-button-color-disabled-background);border:var(--sbb-button-border-disabled-width) var(--sbb-button-border-disabled-style) var(--sbb-button-color-disabled-border)}:host(:is([data-focus-visible],:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch]))) .sbb-form-field-clear:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}@media (any-hover: hover){:host(:not([disabled],:disabled,[disabled-interactive],[data-disabled],[data-group-disabled],:active,[data-active]):hover){--sbb-button-translate-y-content-hover: -.0625rem}}@media (any-hover: hover){:host(:not([disabled],:disabled,[disabled-interactive],[data-disabled],[data-group-disabled],:active,[data-active]):hover) .sbb-form-field-clear:before{background-color:var(--sbb-button-color-hover-background)}}:host(:not([disabled],:disabled,[disabled-interactive],[data-disabled],[data-group-disabled]):is(:active,[data-active])) .sbb-form-field-clear:before{background-color:var(--sbb-button-color-active-background)}`;
+let I = (() => {
   var r;
-  let n = [m("sbb-form-field-clear"), g({
+  let n = [v("sbb-form-field-clear"), g({
     slot: "suffix"
-  })], b, a = [], o, e = k(v);
+  })], a, b = [], o, e = k(m);
   return r = class extends e {
     constructor() {
       super(...arguments), this._abort = new f(this), this._language = new h(this);
@@ -23,9 +23,9 @@ let A = (() => {
       this.addEventListener("click", () => this._handleClick(), { signal: t }), this._formField = this.closest("sbb-form-field, [data-form-field]"), this._formField && (this.negative = this._formField.hasAttribute("negative"));
     }
     async _handleClick() {
-      var s, i;
-      const t = (s = this._formField) == null ? void 0 : s.inputElement;
-      !t || t.localName !== "input" || ((i = this._formField) == null || i.clear(), t.focus(), t.dispatchEvent(new InputEvent("input", { bubbles: !0, composed: !0 })), t.dispatchEvent(new Event("change", { bubbles: !0 })));
+      var i, s;
+      const t = (i = this._formField) == null ? void 0 : i.inputElement;
+      !t || t.localName !== "input" || ((s = this._formField) == null || s.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.setAttribute("aria-label", p[this._language.current]);
@@ -35,9 +35,9 @@ let A = (() => {
     }
   }, o = r, (() => {
     const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(e[Symbol.metadata] ?? null) : void 0;
-    l(null, b = { value: o }, n, { kind: "class", name: o.name, metadata: t }, null, a), o = b.value, t && Object.defineProperty(o, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
-  })(), r.styles = y, d(o, a), o;
+    l(null, a = { value: o }, n, { kind: "class", name: o.name, metadata: t }, null, b), o = a.value, t && Object.defineProperty(o, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
+  })(), r.styles = y, d(o, b), o;
 })();
 export {
-  A as SbbFormFieldClearElement
+  I as SbbFormFieldClearElement
 };