@sbb-esta/lyne-elements 1.2.1 → 1.3.0

package/toast.js

@@ -1,22 +1,24 @@
 import { css as m, html as d, nothing as p } from "lit";
 import { property as b, customElement as h } from "lit/decorators.js";
 import { SbbOpenCloseBaseElement as f } from "./core/base-elements.js";
-import { SbbConnectedAbortController as v, SbbLanguageController as g, SbbSlotStateController as u } from "./core/controllers.js";
+import { SbbConnectedAbortController as v, SbbLanguageController as g } from "./core/controllers.js";
+import { slotState as u } from "./core/decorators.js";
 import { isFirefox as _ } from "./core/dom.js";
 import { composedPathHasAttribute as x } from "./core/eventing.js";
 import { i18nCloseAlert as y } from "./core/i18n.js";
-import { SbbIconNameMixin as T } from "./icon.js";
+import { SbbHydrationMixin as T } from "./core/mixins.js";
+import { SbbIconNameMixin as k } from "./icon.js";
 import "./button/transparent-button.js";
-const k = m`*,:before,:after{box-sizing:border-box}:host{--sbb-toast-max-width: 25rem;--sbb-toast-animation-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-6x) );--sbb-toast-animation-timing-function: ease;--sbb-toast-color: var(--sbb-color-white);--sbb-toast-text-color: var(--sbb-color-milk);--sbb-toast-background-color: var(--sbb-color-midnight);--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);--sbb-toast-margin: var(--sbb-spacing-responsive-s);--sbb-toast-padding-block: var(--sbb-spacing-responsive-xxxs);--sbb-toast-padding-inline: var(--sbb-spacing-responsive-xs);--sbb-toast-border-radius: var(--sbb-border-radius-4x);--sbb-toast-container-display: flex;--sbb-toast-container-position: fixed;--sbb-toast-horizontal-position: initial;--sbb-toast-vertical-position: initial;display:block}:host(:not([data-state])),:host([data-state=closed]){--sbb-toast-container-display: none}:host([position=bottom-left]),:host([position=bottom-start]){--sbb-toast-horizontal-position: flex-start;--sbb-toast-vertical-position: flex-end}:host([position=bottom-center]){--sbb-toast-horizontal-position: center;--sbb-toast-vertical-position: flex-end}:host([position=bottom-right]),:host([position=bottom-end]){--sbb-toast-horizontal-position: flex-end;--sbb-toast-vertical-position: flex-end}:host([position=top-left]),:host([position=top-start]){--sbb-toast-horizontal-position: flex-start;--sbb-toast-vertical-position: flex-start}:host([position=top-center]){--sbb-toast-horizontal-position: center;--sbb-toast-vertical-position: flex-start}:host([position=top-right]),:host([position=top-end]){--sbb-toast-horizontal-position: flex-end;--sbb-toast-vertical-position: flex-start}.sbb-toast__overlay-container{position:var(--sbb-toast-container-position);pointer-events:none;top:0;right:0;bottom:0;left:0;display:var(--sbb-toast-container-display);justify-content:var(--sbb-toast-horizontal-position);align-items:var(--sbb-toast-vertical-position)}.sbb-toast{z-index:var(--sbb-toast-z-index, var(--sbb-overlay-default-z-index));pointer-events:auto;margin:var(--sbb-toast-margin);padding-block:var(--sbb-toast-padding-block);padding-inline:var(--sbb-toast-padding-inline);border-radius:var(--sbb-toast-border-radius);max-width:var(--sbb-toast-max-width);display:flex;color:var(--sbb-toast-color);background-color:var(--sbb-toast-background-color)}:host([data-state=opening]) .sbb-toast{animation-name:open;animation-duration:var(--sbb-toast-animation-duration);animation-timing-function:var(--sbb-toast-animation-timing-function)}:host([data-state=closing]) .sbb-toast{animation-name:close;animation-duration:var(--sbb-toast-animation-duration);animation-timing-function:var(--sbb-toast-animation-timing-function)}.sbb-toast__icon{margin-inline-end:var(--sbb-spacing-fixed-2x);line-height:initial}:host(:not([data-slot-names~=icon],[icon-name])) .sbb-toast__icon{display:none}.sbb-toast__content{--sbb-title-line-height: var(--sbb-typo-line-height-titles);--sbb-title-margin-block-start: 0;--sbb-title-margin-block-end: 0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;margin-block:var(--sbb-title-margin-block-start) var(--sbb-title-margin-block-end);font-family:var(--sbb-typo-font-family);font-weight:700;line-height:var(--sbb-title-line-height);letter-spacing:var(--sbb-typo-letter-spacing-titles);font-size:var(--sbb-title-font-size);--sbb-title-font-size: var(--sbb-font-size-title-6);--sbb-title-line-height: var(--sbb-typo-line-height-body-text);color:var(--sbb-toast-text-color);flex:1 1 0}.sbb-toast__action{position:relative;min-width:2.5rem}:host(:not([data-slot-names~=action],[dismissible])) .sbb-toast__action{display:none}::slotted([data-sbb-button]),.sbb-toast__action-button{margin-inline:var(--sbb-spacing-fixed-2x);position:absolute;top:-.625rem}::slotted(:is(sbb-link,sbb-link-button,sbb-link-static)){margin-inline-start:var(--sbb-spacing-fixed-4x)}@keyframes open{0%{visibility:hidden;opacity:0;transform:translateY(var(--sbb-spacing-fixed-2x))}to{visibility:visible;opacity:1;transform:translateY(0)}}@keyframes close{0%{visibility:visible;opacity:1;transform:translateY(0)}to{visibility:hidden;opacity:0;transform:translateY(var(--sbb-spacing-fixed-2x))}}`;
-var N = Object.defineProperty, C = Object.getOwnPropertyDescriptor, n = (o, s, i, a) => {
-  for (var t = a > 1 ? void 0 : a ? C(s, i) : s, r = o.length - 1, l; r >= 0; r--)
+const N = m`*,:before,:after{box-sizing:border-box}:host{--sbb-toast-max-width: 25rem;--sbb-toast-animation-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-6x) );--sbb-toast-animation-timing-function: ease;--sbb-toast-color: var(--sbb-color-white);--sbb-toast-text-color: var(--sbb-color-milk);--sbb-toast-background-color: var(--sbb-color-midnight);--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);--sbb-toast-margin: var(--sbb-spacing-responsive-s);--sbb-toast-padding-block: var(--sbb-spacing-responsive-xxxs);--sbb-toast-padding-inline: var(--sbb-spacing-responsive-xs);--sbb-toast-border-radius: var(--sbb-border-radius-4x);--sbb-toast-container-display: flex;--sbb-toast-container-position: fixed;--sbb-toast-horizontal-position: initial;--sbb-toast-vertical-position: initial;display:block}:host(:not([data-state])),:host([data-state=closed]){--sbb-toast-container-display: none}:host([position=bottom-left]),:host([position=bottom-start]){--sbb-toast-horizontal-position: flex-start;--sbb-toast-vertical-position: flex-end}:host([position=bottom-center]){--sbb-toast-horizontal-position: center;--sbb-toast-vertical-position: flex-end}:host([position=bottom-right]),:host([position=bottom-end]){--sbb-toast-horizontal-position: flex-end;--sbb-toast-vertical-position: flex-end}:host([position=top-left]),:host([position=top-start]){--sbb-toast-horizontal-position: flex-start;--sbb-toast-vertical-position: flex-start}:host([position=top-center]){--sbb-toast-horizontal-position: center;--sbb-toast-vertical-position: flex-start}:host([position=top-right]),:host([position=top-end]){--sbb-toast-horizontal-position: flex-end;--sbb-toast-vertical-position: flex-start}.sbb-toast__overlay-container{position:var(--sbb-toast-container-position);pointer-events:none;top:0;right:0;bottom:0;left:0;display:var(--sbb-toast-container-display);justify-content:var(--sbb-toast-horizontal-position);align-items:var(--sbb-toast-vertical-position)}.sbb-toast{z-index:var(--sbb-toast-z-index, var(--sbb-overlay-default-z-index));pointer-events:auto;margin:var(--sbb-toast-margin);padding-block:var(--sbb-toast-padding-block);padding-inline:var(--sbb-toast-padding-inline);border-radius:var(--sbb-toast-border-radius);max-width:var(--sbb-toast-max-width);display:flex;color:var(--sbb-toast-color);background-color:var(--sbb-toast-background-color)}:host([data-state=opening]) .sbb-toast{animation-name:open;animation-duration:var(--sbb-toast-animation-duration);animation-timing-function:var(--sbb-toast-animation-timing-function)}:host([data-state=closing]) .sbb-toast{animation-name:close;animation-duration:var(--sbb-toast-animation-duration);animation-timing-function:var(--sbb-toast-animation-timing-function)}.sbb-toast__icon{margin-inline-end:var(--sbb-spacing-fixed-2x);line-height:initial}:host(:not([data-slot-names~=icon],[icon-name])) .sbb-toast__icon{display:none}.sbb-toast__content{--sbb-title-line-height: var(--sbb-typo-line-height-titles);--sbb-title-margin-block-start: 0;--sbb-title-margin-block-end: 0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;margin-block:var(--sbb-title-margin-block-start) var(--sbb-title-margin-block-end);font-family:var(--sbb-typo-font-family);font-weight:700;line-height:var(--sbb-title-line-height);letter-spacing:var(--sbb-typo-letter-spacing-titles);font-size:var(--sbb-title-font-size);--sbb-title-font-size: var(--sbb-font-size-title-6);--sbb-title-line-height: var(--sbb-typo-line-height-body-text);color:var(--sbb-toast-text-color);flex:1 1 0}.sbb-toast__action{position:relative;min-width:2.5rem}:host(:not([data-slot-names~=action],[dismissible])) .sbb-toast__action{display:none}::slotted([data-sbb-button]),.sbb-toast__action-button{margin-inline:var(--sbb-spacing-fixed-2x);position:absolute;top:-.625rem}::slotted(:is(sbb-link,sbb-link-button,sbb-link-static)){margin-inline-start:var(--sbb-spacing-fixed-4x)}@keyframes open{0%{visibility:hidden;opacity:0;transform:translateY(var(--sbb-spacing-fixed-2x))}to{visibility:visible;opacity:1;transform:translateY(0)}}@keyframes close{0%{visibility:visible;opacity:1;transform:translateY(0)}to{visibility:hidden;opacity:0;transform:translateY(var(--sbb-spacing-fixed-2x))}}`;
+var C = Object.defineProperty, S = Object.getOwnPropertyDescriptor, n = (o, s, i, a) => {
+  for (var t = a > 1 ? void 0 : a ? S(s, i) : s, r = o.length - 1, l; r >= 0; r--)
     (l = o[r]) && (t = (a ? l(s, i, t) : l(t)) || t);
-  return a && t && N(s, i, t), t;
+  return a && t && C(s, i, t), t;
 };
 const c = /* @__PURE__ */ new Set();
-let e = class extends T(f) {
+let e = class extends k(T(f)) {
   constructor() {
-    super(), this.timeout = 6e3, this.position = "bottom-center", this.dismissible = !1, this.politeness = "polite", this._abort = new v(this), this._language = new g(this), new u(this);
+    super(...arguments), this.timeout = 6e3, this.position = "bottom-center", this.dismissible = !1, this.politeness = "polite", this._abort = new v(this), this._language = new g(this);
   }
   /**
    * Role of the live region. This is only for Firefox as there is a known issue where Firefox +
@@ -96,10 +98,10 @@ let e = class extends T(f) {
   render() {
     return d`
       <div class="sbb-toast__overlay-container">
+        ${/* Firefox needs 'role' to enable screen readers */
+    ""}
         <div
           class="sbb-toast"
-          ${/* Firefox needs 'role' to enable screen readers */
-    ""}
           role=${this._role ?? p}
           @animationend=${this._onToastAnimationEnd}
         >
@@ -126,7 +128,7 @@ let e = class extends T(f) {
     `;
   }
 };
-e.styles = k;
+e.styles = N;
 n([
   b({ type: Number })
 ], e.prototype, "timeout", 2);
@@ -140,7 +142,8 @@ n([
   b()
 ], e.prototype, "politeness", 2);
 e = n([
-  h("sbb-toast")
+  h("sbb-toast"),
+  u()
 ], e);
 export {
   e as SbbToastElement

package/toggle/toggle-option/toggle-option.d.ts

@@ -19,7 +19,6 @@ export declare class SbbToggleOptionElement extends SbbToggleOptionElement_base
     private _value;
     private _toggle?;
     private _abort;
-    constructor();
     connectedCallback(): void;
     protected willUpdate(changedProperties: PropertyValues<this>): void;
     private _uncheckOtherOptions;

package/toggle/toggle-option/toggle-option.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"toggle-option.d.ts","sourceRoot":"","sources":["../../../../src/elements/toggle/toggle-option/toggle-option.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAQ,UAAU,EAAW,MAAM,KAAK,CAAC;;AAWhD;;;;;GAKG;AACH,qBAIa,sBAAuB,SAAQ,2BAA4B;IACtE,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,4CAA4C;IAErC,OAAO,UAAS;IAEvB,6CAA6C;IAEtC,QAAQ,EAAE,OAAO,CAAS;IAEjC,8BAA8B;IAC9B,IACW,KAAK,CAAC,KAAK,EAAE,MAAM,EAE7B;IACD,IAAW,KAAK,IAAI,MAAM,CAEzB;IACD,OAAO,CAAC,MAAM,CAAc;IAE5B,OAAO,CAAC,OAAO,CAAC,CAAmB;IACnC,OAAO,CAAC,MAAM,CAAyC;;IAOvC,iBAAiB,IAAI,IAAI;cAetB,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAe5E,OAAO,CAAC,oBAAoB;IAI5B,OAAO,CAAC,qBAAqB;IAc7B,OAAO,CAAC,YAAY;IAQpB,OAAO,CAAC,eAAe;cAIJ,MAAM,IAAI,cAAc;CAoB5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,mBAAmB,EAAE,sBAAsB,CAAC;KAC7C;CACF"}
+{"version":3,"file":"toggle-option.d.ts","sourceRoot":"","sources":["../../../../src/elements/toggle/toggle-option/toggle-option.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAQ,UAAU,EAAW,MAAM,KAAK,CAAC;;AAWhD;;;;;GAKG;AACH,qBAKa,sBAAuB,SAAQ,2BAA4B;IACtE,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,4CAA4C;IAErC,OAAO,UAAS;IAEvB,6CAA6C;IAEtC,QAAQ,EAAE,OAAO,CAAS;IAEjC,8BAA8B;IAC9B,IACW,KAAK,CAAC,KAAK,EAAE,MAAM,EAE7B;IACD,IAAW,KAAK,IAAI,MAAM,CAEzB;IACD,OAAO,CAAC,MAAM,CAAc;IAE5B,OAAO,CAAC,OAAO,CAAC,CAAmB;IACnC,OAAO,CAAC,MAAM,CAAyC;IAEvC,iBAAiB,IAAI,IAAI;cAetB,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAe5E,OAAO,CAAC,oBAAoB;IAI5B,OAAO,CAAC,qBAAqB;IAc7B,OAAO,CAAC,YAAY;IAQpB,OAAO,CAAC,eAAe;cAIJ,MAAM,IAAI,cAAc;CAoB5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,mBAAmB,EAAE,sBAAsB,CAAC;KAC7C;CACF"}

package/toggle/toggle-option.js

@@ -1,18 +1,18 @@
 import { css as h, LitElement as c, html as g, nothing as d } from "lit";
-import { property as a, customElement as p } from "lit/decorators.js";
-import { SbbConnectedAbortController as u, SbbSlotStateController as f } from "../core/controllers.js";
-import { hostAttributes as v } from "../core/decorators.js";
+import { property as b, customElement as p } from "lit/decorators.js";
+import { SbbConnectedAbortController as u } from "../core/controllers.js";
+import { hostAttributes as f, slotState as v } from "../core/decorators.js";
 import { setOrRemoveAttribute as m } from "../core/dom.js";
 import { SbbIconNameMixin as _ } from "../icon.js";
 const y = h`*,:before,:after{box-sizing:border-box}:host{--sbb-toggle-option-cursor: pointer;--sbb-toggle-option-color: var(--sbb-color-anthracite);--sbb-toggle-option-icon-min-size: var(--sbb-size-icon-ui-small);--sbb-toggle-option-border-radius: var(--sbb-border-radius-infinity);--sbb-toggle-option-line-height: calc(1em * var(--sbb-typo-line-height-body-text));display:inline-block;min-width:var(--sbb-toggle-min-width);overflow:hidden;z-index:1}:host(:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch])){outline:none!important}:host([checked]){--sbb-toggle-option-color: var(--sbb-color-charcoal)}:host([disabled]){--sbb-toggle-option-cursor: unset;--sbb-toggle-option-color: var(--sbb-color-granite)}input[type=radio]{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.sbb-toggle-option{--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;cursor:var(--sbb-toggle-option-cursor);display:flex;justify-content:center;align-items:center;height:var(--sbb-toggle-height);padding-inline:var(--sbb-toggle-padding-inline);border-radius:var(--sbb-toggle-option-border-radius);color:var(--sbb-toggle-option-color)}:host([data-slot-names~=unnamed]:where([data-slot-names~=icon],[icon-name])) .sbb-toggle-option{gap:var(--sbb-spacing-fixed-1x)}.sbb-toggle-option__label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch])) .sbb-toggle-option__label:before{content:"";position:absolute;pointer-events:none;inset:calc(var(--sbb-focus-outline-offset) * -2);border:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width);border-radius:var(--sbb-toggle-option-border-radius)}sbb-icon,::slotted(sbb-icon){min-width:var(--sbb-toggle-option-icon-min-size);min-height:var(--sbb-toggle-option-icon-min-size)}`;
 var x = Object.defineProperty, w = Object.getOwnPropertyDescriptor, n = (e, t, i, l) => {
-  for (var o = l > 1 ? void 0 : l ? w(t, i) : t, r = e.length - 1, b; r >= 0; r--)
-    (b = e[r]) && (o = (l ? b(t, i, o) : b(o)) || o);
+  for (var o = l > 1 ? void 0 : l ? w(t, i) : t, r = e.length - 1, a; r >= 0; r--)
+    (a = e[r]) && (o = (l ? a(t, i, o) : a(o)) || o);
   return l && o && x(t, i, o), o;
 };
 let s = class extends _(c) {
   constructor() {
-    super(), this.checked = !1, this.disabled = !1, this._value = "", this._abort = new u(this), new f(this);
+    super(...arguments), this.checked = !1, this.disabled = !1, this._value = "", this._abort = new u(this);
   }
   set value(e) {
     this._value = `${e}`;
@@ -70,19 +70,20 @@ let s = class extends _(c) {
 };
 s.styles = y;
 n([
-  a({ reflect: !0, type: Boolean })
+  b({ reflect: !0, type: Boolean })
 ], s.prototype, "checked", 2);
 n([
-  a({ reflect: !0, type: Boolean })
+  b({ reflect: !0, type: Boolean })
 ], s.prototype, "disabled", 2);
 n([
-  a()
+  b()
 ], s.prototype, "value", 1);
 s = n([
   p("sbb-toggle-option"),
-  v({
+  f({
     role: "radio"
-  })
+  }),
+  v()
 ], s);
 export {
   s as SbbToggleOptionElement

package/toggle-check/toggle-check.d.ts

@@ -21,7 +21,6 @@ export declare class SbbToggleCheckElement extends SbbToggleCheckElement_base {
     iconName: string;
     /** The label position relative to the toggle. Defaults to 'after' */
     labelPosition?: 'before' | 'after';
-    constructor();
     protected willUpdate(changedProperties: PropertyValues<this>): Promise<void>;
     protected render(): TemplateResult;
 }

package/toggle-check/toggle-check.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"toggle-check.d.ts","sourceRoot":"","sources":["../../../src/elements/toggle-check/toggle-check.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;;;;;;;;GAQG;AACH,qBACa,qBAAsB,SAAQ,0BAE1C;IACC,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,gBAAuB,MAAM;;MAElB;IAEX,uCAAuC;IACH,IAAI,EAAE,IAAI,GAAG,GAAG,GAAG,GAAG,CAAO;IAEjE,gEAAgE;IACV,QAAQ,SAAgB;IAE9E,qEAAqE;IAE9D,aAAa,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAW;;cAO3B,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC;cASxE,MAAM,IAAI,cAAc;CAgB5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,kBAAkB,EAAE,qBAAqB,CAAC;KAC3C;CACF"}
+{"version":3,"file":"toggle-check.d.ts","sourceRoot":"","sources":["../../../src/elements/toggle-check/toggle-check.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;;;;;;;;GAQG;AACH,qBAEa,qBAAsB,SAAQ,0BAE1C;IACC,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,gBAAuB,MAAM;;MAElB;IAEX,uCAAuC;IACH,IAAI,EAAE,IAAI,GAAG,GAAG,GAAG,GAAG,CAAO;IAEjE,gEAAgE;IACV,QAAQ,SAAgB;IAE9E,qEAAqE;IAE9D,aAAa,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAW;cAE3B,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC;cASxE,MAAM,IAAI,cAAc;CAgB5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,kBAAkB,EAAE,qBAAqB,CAAC;KAC3C;CACF"}

package/toggle-check.js

@@ -1,6 +1,6 @@
 import { css as g, LitElement as n, html as h } from "lit";
 import { property as i, customElement as d } from "lit/decorators.js";
-import { SbbSlotStateController as k } from "./core/controllers.js";
+import { slotState as k } from "./core/decorators.js";
 import { SbbFormAssociatedCheckboxMixin as v } from "./core/mixins.js";
 import { SbbIconNameMixin as f } from "./icon.js";
 const p = g`@charset "UTF-8";*,:before,:after{box-sizing:border-box}:host{display:inline-block;outline:none!important;--sbb-toggle-check-checked-color: var(--sbb-color-red);--sbb-toggle-check-background-color: var(--sbb-color-cloud);--sbb-toggle-check-icon-color: var(--sbb-toggle-check-checked-color);--sbb-toggle-check-icon-opacity: 0;--sbb-toggle-check-circle-background-color: var(--sbb-color-white);--sbb-toggle-check-circle-border-color: var(--sbb-color-smoke);--sbb-toggle-check-circle-border-style: solid;--sbb-toggle-check-circle-diameter: 1.75rem;--sbb-toggle-check-overall-height: var(--sbb-toggle-check-circle-diameter);--sbb-toggle-check-circle-transform: translate(0, -50%);--sbb-toggle-check-height: 1.5rem;--sbb-toggle-check-width: calc(2 * var(--sbb-toggle-check-height));--sbb-toggle-check-cursor: pointer;--sbb-toggle-check-flex-direction: row-reverse;--sbb-toggle-check-gap: var(--sbb-spacing-fixed-3x);--sbb-toggle-check-animation-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-6x) )}@media (forced-colors: active){:host{--sbb-toggle-check-background-color: CanvasText;--sbb-toggle-check-circle-background-color: Canvas}}:host([size=m]){--sbb-toggle-check-overall-height: calc(1em * var(--sbb-typo-line-height-body-text))}:host([data-checked]){--sbb-toggle-check-background-color: var(--sbb-toggle-check-checked-color);--sbb-toggle-check-circle-border-color: var(--sbb-toggle-check-background-color);--sbb-toggle-check-icon-opacity: 1;--sbb-toggle-check-circle-transform: translate( calc(100% - 2 * (100% - .5 * var(--sbb-toggle-check-width))), -50% )}@media (forced-colors: active){:host([data-checked]){--sbb-toggle-check-icon-color: Highlight;--sbb-toggle-check-background-color: Highlight}}:host(:disabled){--sbb-toggle-check-background-color: var(--sbb-color-cloud);--sbb-toggle-check-circle-border-color: var(--sbb-color-smoke);--sbb-toggle-check-circle-border-style: dashed;--sbb-toggle-check-circle-background-color: var(--sbb-color-milk);--sbb-toggle-check-icon-color: var(--sbb-color-granite);--sbb-toggle-check-cursor: default}@media (forced-colors: active){:host(:disabled){--sbb-toggle-check-icon-color: GrayText;--sbb-toggle-check-background-color: GrayText;--sbb-toggle-check-circle-border-style: solid}}:host([data-checked]:disabled){--sbb-toggle-check-circle-background-color: var(--sbb-color-white)}:host([label-position=before]){--sbb-toggle-check-flex-direction: row}.sbb-toggle-check{position:relative;display:flex;color:var(--sbb-color-charcoal);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;cursor:var(--sbb-toggle-check-cursor)}.sbb-toggle-check:before{content:"​";-webkit-user-select:none;user-select:none;width:0;height:0}:host(:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch])) .sbb-toggle-check{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width);border-radius:calc(var(--sbb-border-radius-4x) - var(--sbb-focus-outline-offset))}.sbb-toggle-check__container{--sbb-text-font-size: var(--sbb-font-size-text-s);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;flex-direction:var(--sbb-toggle-check-flex-direction);gap:var(--sbb-toggle-check-gap);align-items:start;width:100%}:host([size=m]) .sbb-toggle-check__container{--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)}:host([size=xs]) .sbb-toggle-check__container{--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)}.sbb-toggle-check__label{flex-grow:1;padding-block-start:calc((var(--sbb-toggle-check-circle-diameter) - var(--sbb-typo-line-height-body-text) * 1em) / 2)}:host(:not([data-slot-names~=unnamed])) .sbb-toggle-check__label{display:none}.sbb-toggle-check__track{display:inline-block;position:relative;min-width:var(--sbb-toggle-check-width);height:var(--sbb-toggle-check-height);border-radius:var(--sbb-border-radius-infinity);background-color:var(--sbb-toggle-check-background-color);margin-block:calc((var(--sbb-toggle-check-overall-height) - var(--sbb-toggle-check-height)) / 2)}.sbb-toggle-check__circle{box-shadow:var(--sbb-shadow-elevation-level-5-shadow-2-offset-x) var(--sbb-shadow-elevation-level-5-shadow-2-offset-y) var(--sbb-shadow-elevation-level-5-shadow-2-blur) var(--sbb-shadow-elevation-level-5-shadow-2-spread) var(--sbb-shadow-elevation-level-5-hard-2-color),var(--sbb-shadow-elevation-level-5-shadow-1-offset-x) var(--sbb-shadow-elevation-level-5-shadow-1-offset-y) var(--sbb-shadow-elevation-level-5-shadow-1-blur) var(--sbb-shadow-elevation-level-5-shadow-1-spread) var(--sbb-shadow-elevation-level-5-hard-1-color);position:absolute;top:50%;transform:translateY(-50%);width:var(--sbb-toggle-check-circle-diameter);height:var(--sbb-toggle-check-circle-diameter);border:var(--sbb-border-width-1x) var(--sbb-toggle-check-circle-border-style) var(--sbb-toggle-check-circle-border-color);border-radius:50%;background-color:var(--sbb-toggle-check-circle-background-color);color:var(--sbb-toggle-check-icon-color);will-change:transform;transform:var(--sbb-toggle-check-circle-transform);transition:transform ease var(--sbb-toggle-check-animation-duration)}.sbb-toggle-check__icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:var(--sbb-size-icon-ui-small);height:var(--sbb-size-icon-ui-small);opacity:var(--sbb-toggle-check-icon-opacity);transition:opacity ease var(--sbb-toggle-check-animation-duration)}`;
@@ -13,7 +13,7 @@ let o = class extends v(
   f(n)
 ) {
   constructor() {
-    super(), this.size = "s", this.iconName = "tick-small", this.labelPosition = "after", new k(this);
+    super(...arguments), this.size = "s", this.iconName = "tick-small", this.labelPosition = "after";
   }
   async willUpdate(t) {
     super.willUpdate(t), t.has("checked") && (this.internals.ariaChecked = `${this.checked}`, this.toggleAttribute("data-checked", this.checked));
@@ -49,7 +49,8 @@ b([
   i({ attribute: "label-position", reflect: !0 })
 ], o.prototype, "labelPosition", 2);
 o = b([
-  d("sbb-toggle-check")
+  d("sbb-toggle-check"),
+  k()
 ], o);
 export {
   o as SbbToggleCheckElement