@mhmo91/schmancy 0.1.3 → 0.2.0

package/dist/{theme-button-BQZkb1t4.js → teleport.component-CgNOwz49.js}

@@ -1,50 +1,51 @@
-import { Subject as Q, merge as Z, fromEvent as b, startWith as ut, tap as v, map as h, debounceTime as bt, distinctUntilChanged as J, takeUntil as d, from as nt, of as X, Observable as $t, zip as at, filter as gt, take as Ct, timeout as Dt, bufferTime as jt, concatMap as kt, interval as Et, throwIfEmpty as Mt } from "rxjs";
+import { css as f, html as a, nothing as yt } from "lit";
+import { customElement as l, property as c, state as m, queryAssignedElements as A, query as G } from "lit/decorators.js";
+import { Subject as Z, merge as tt, fromEvent as b, startWith as ut, tap as v, map as h, debounceTime as L, distinctUntilChanged as J, takeUntil as d, from as nt, of as V, Observable as xt, distinctUntilKeyChanged as Ot, zip as at, filter as bt, take as Dt, timeout as Ct, bufferTime as $t, concatMap as jt, interval as Et, throwIfEmpty as Mt } from "rxjs";
+import "./animated-text-B9SdI5HG.js";
+import { a as ct, F as kt, H as Pt } from "./area.component-AMUgdMqi.js";
+import "./autocomplete-S7nz-gls.js";
+import "./spinner-tOzccpuH.js";
+import "./icon-button-BkcXisF4.js";
 import "lit/directives/class-map.js";
 import "lit/directives/style-map.js";
-import { T as $ } from "./tailwind.mixin-DZctuRzi.js";
-import { css as g, html as a, nothing as ft } from "lit";
-import { customElement as l, property as c, state as m, queryAssignedElements as L, query as tt } from "lit/decorators.js";
-import "./animated-text-CXWL8BLX.js";
-import { a as ct, F as Pt, H as Wt } from "./area.component-lv5p1JAi.js";
-import "./autocomplete-IIohssup.js";
-import "./spinner-Bxpq8jN0.js";
-import "./icon-button-B1siCgt2.js";
-import { S as N } from "./theme.interface-C5Kj6WjD.js";
-import "./checkbox-rX1ai5aE.js";
-import "./chips-DKyOFX0b.js";
-import "./payment-card-form-BNCVkn4A.js";
+import { T as E } from "./tailwind.mixin-Cwk3HTxV.js";
+import { S as T } from "./theme.interface-C5Kj6WjD.js";
+import "./checkbox-DNbOp9CO.js";
+import "./chips-B1DqsDUN.js";
+import "./payment-card-form-DrWyUhkX.js";
 import { SchmancyEvents as y } from "./types.js";
-import { n as C, e as O } from "./provide-kj6-udep.js";
-import { $ as k } from "./litElement.mixin-BQQ8SViR.js";
+import { n as D, e as O } from "./provide-kj6-udep.js";
+import { $ as M } from "./litElement.mixin-BcBF7FRS.js";
 import { c as p } from "./consume-DSKPc5vj.js";
-import "./date-range-Cv7J4zqk.js";
-import "./delay-DDTFbzUT.js";
-import { c as W, f as zt } from "./ripple-BumgqsDT.js";
-import "./divider-LocxHBJv.js";
-import "./form-BV79BLFu.js";
-import "./icon-DMom-EmW.js";
-import "./input-JeE5xI6K.js";
-import "./scroll-C2AdiqOm.js";
-import { a as St } from "./surface-B0Wpttcp.js";
-import { when as R } from "lit/directives/when.js";
-import "./menu-HLuts8V3.js";
-import "./outlet-CXxpQ37y.js";
-import "./option-C5egpChO.js";
-import "./radio-group-CPmdicYZ.js";
+import "./date-range-BRkCPAff.js";
+import "./delay-B7VUwnDz.js";
+import { c as z, f as Wt } from "./ripple-BumgqsDT.js";
+import "./divider-DpHFBFrA.js";
+import "./form-DD-SYyrx.js";
+import "./icon-Dl79Z-46.js";
+import "./input-Dv_d3Ube.js";
+import "./scroll-BFAm-L6v.js";
+import { a as zt } from "./surface-PcBZIgVN.js";
+import { when as X } from "lit/directives/when.js";
+import "./menu-CDsJkpu5.js";
+import "./outlet-Ci9xMSJ0.js";
+import "./option-DIpHfpFS.js";
+import "./radio-group-DwAtByja.js";
 import "./index-CuY8m6ta.js";
-import "./select-CHqzliGG.js";
-import { s as K } from "./sheet-CGmu7xn7.js";
-import "./slider-D-M3pFtn.js";
-import "./table-DXYjwhsS.js";
-import "./tabs-group-jVXSw4vO.js";
-import "./textarea-Buxkp6z0.js";
-import { $ as It } from "./dynamicTheme-DYtQDYE_.js";
-import "./tree-7PVEhRCU.js";
-import "./typewriter-ZnPAe8JA.js";
-import "./typography-L0ZKDX-X.js";
-import { map as Ht, distinctUntilChanged as Tt, take as Nt } from "rxjs/operators";
-var Rt = Object.defineProperty, _t = Object.getOwnPropertyDescriptor;
-let lt = class extends $(g`
+import "./select-D1iuS17j.js";
+import { s as Q } from "./sheet-DRevGqjY.js";
+import "./slider-Dqe5E2F9.js";
+import "./table-Dfip6wRe.js";
+import "./tabs-group-BUtko5gD.js";
+import "./textarea-BRE-ZxNE.js";
+import "./theme.component-DELqRYyh.js";
+import "./theme-button-B3n5iZsE.js";
+import "./tree-C-rEmlo4.js";
+import "./typewriter-BJW4ypAk.js";
+import "./typography-BFPivXLr.js";
+import { map as St, distinctUntilChanged as Nt, take as It } from "rxjs/operators";
+var Ht = Object.defineProperty, Tt = Object.getOwnPropertyDescriptor;
+let lt = class extends E(f`
 	:host {
 		display: block;
 	}
@@ -54,46 +55,46 @@ let lt = class extends $(g`
   }
 };
 lt = ((t, e, o, i) => {
-  for (var r, s = i > 1 ? void 0 : i ? _t(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
-  return i && s && Rt(e, o, s), s;
+  for (var r, s = i > 1 ? void 0 : i ? Tt(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
+  return i && s && Ht(e, o, s), s;
 })([l("schmancy-card-action")], lt);
-var qt = Object.defineProperty, Bt = Object.getOwnPropertyDescriptor, V = (t, e, o, i) => {
-  for (var r, s = i > 1 ? void 0 : i ? Bt(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
-  return i && s && qt(e, o, s), s;
+var Xt = Object.defineProperty, Rt = Object.getOwnPropertyDescriptor, F = (t, e, o, i) => {
+  for (var r, s = i > 1 ? void 0 : i ? Rt(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
+  return i && s && Xt(e, o, s), s;
 };
-let _ = class extends $() {
+let R = class extends E() {
   constructor() {
     super(...arguments), this.type = "elevated", this.elevation = 0;
   }
   render() {
-    const t = { "rounded-md": !0, "shadow-1": this.elevation === 1, "shadow-2": this.elevation === 2, "shadow-3": this.elevation === 3, "shadow-4": this.elevation === 4, "shadow-5": this.elevation === 5, "hover:shadow-1": ["outlined", "filled"].includes(this.type), "bg-surface-low shadow-1 hover:shadow-2": this.type === "elevated", "bg-surface-highest": this.type === "filled", "bg-surface-default border-1 border-outlineVariant": this.type === "outlined" };
+    const t = { "rounded-md": !0, "shadow-1": this.elevation === 1, "shadow-2": this.elevation === 2, "shadow-3": this.elevation === 3, "shadow-4": this.elevation === 4, "shadow-5": this.elevation === 5, "hover:shadow-1": ["outlined", "filled"].includes(this.type), "bg-surface-low shadow-1 hover:shadow-2": this.type === "elevated", "bg-surface-highest": this.type === "filled", "bg-surface-default border border-solid border-1 border-outlineVariant": this.type === "outlined" };
     return a`<div class="${this.classMap(t)}">
 			<slot> </slot>
 		</div>`;
   }
 };
-V([c()], _.prototype, "type", 2), V([c({ type: Number })], _.prototype, "elevation", 2), _ = V([l("schmancy-card")], _);
-var Ut = Object.defineProperty, At = Object.getOwnPropertyDescriptor;
-let pt = class extends $() {
+F([c()], R.prototype, "type", 2), F([c({ type: Number })], R.prototype, "elevation", 2), R = F([l("schmancy-card")], R);
+var _t = Object.defineProperty, qt = Object.getOwnPropertyDescriptor;
+let pt = class extends E() {
   render() {
-    const t = N.sys.color.surface.on, e = N.sys.color.surface.onVariant;
+    const t = T.sys.color.surface.on, e = T.sys.color.surface.onVariant;
     return a`<schmancy-grid gap="md" class="${this.classMap({ "px-[16px] py-[24px]": !0 })}">
 			<schmancy-grid gap="xs">
 				<schmancy-typography
-					${W({ color: t })}
+					${z({ color: t })}
 					type="body"
 					token="lg"
 					><slot name="headline"> </slot
 				></schmancy-typography>
 				<schmancy-typography
-					${W({ color: e })}
+					${z({ color: e })}
 					type="body"
 					><slot name="subhead"></slot>
 				</schmancy-typography>
 			</schmancy-grid>
 			<schmancy-typography
 				type="body"
-				${W({ color: e })}
+				${z({ color: e })}
 			>
 				<slot></slot>
 			</schmancy-typography>
@@ -101,14 +102,14 @@ let pt = class extends $() {
   }
 };
 pt = ((t, e, o, i) => {
-  for (var r, s = i > 1 ? void 0 : i ? At(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
-  return i && s && Ut(e, o, s), s;
+  for (var r, s = i > 1 ? void 0 : i ? qt(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
+  return i && s && _t(e, o, s), s;
 })([l("schmancy-card-content")], pt);
-var Xt = Object.defineProperty, Lt = Object.getOwnPropertyDescriptor, F = (t, e, o, i) => {
-  for (var r, s = i > 1 ? void 0 : i ? Lt(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
-  return i && s && Xt(e, o, s), s;
+var Ut = Object.defineProperty, Bt = Object.getOwnPropertyDescriptor, K = (t, e, o, i) => {
+  for (var r, s = i > 1 ? void 0 : i ? Bt(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
+  return i && s && Ut(e, o, s), s;
 };
-let q = class extends $(g`
+let _ = class extends E(f`
 	:host {
 		display: block;
 	}
@@ -123,10 +124,10 @@ let q = class extends $(g`
 		</schmancy-grid>`;
   }
 };
-F([c({ type: String, reflect: !0 })], q.prototype, "src", 2), F([c({ type: String })], q.prototype, "fit", 2), q = F([l("schmancy-card-media")], q);
-const ns = new class {
+K([c({ type: String, reflect: !0 })], _.prototype, "src", 2), K([c({ type: String })], _.prototype, "fit", 2), _ = K([l("schmancy-card-media")], _);
+const os = new class {
   constructor() {
-    this.$drawer = new Q(), this.$drawer.pipe().subscribe((t) => {
+    this.$drawer = new Z(), this.$drawer.pipe().subscribe((t) => {
       t.action === "dismiss" ? t.ref.dispatchEvent(new CustomEvent(y.ContentDrawerToggle, { detail: { state: "close" }, bubbles: !0, composed: !0 })) : t.action === "render" && (t.ref.dispatchEvent(new CustomEvent(y.ContentDrawerToggle, { detail: { state: "open" }, bubbles: !0, composed: !0 })), t.ref.dispatchEvent(new CustomEvent("schmancy-content-drawer-render", { detail: { component: t.component, title: t.title }, bubbles: !0, composed: !0 })));
     });
   }
@@ -136,12 +137,12 @@ const ns = new class {
   render(t, e, o) {
     t.dispatchEvent(new CustomEvent("custom-event")), this.$drawer.next({ action: "render", ref: t, component: e, title: o });
   }
-}(), et = C("push"), vt = C("close"), wt = C(Math.floor(Math.random() * Date.now()).toString()), st = C("100%"), ot = C({});
-var Vt = Object.defineProperty, Ft = Object.getOwnPropertyDescriptor, D = (t, e, o, i) => {
-  for (var r, s = i > 1 ? void 0 : i ? Ft(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
-  return i && s && Vt(e, o, s), s;
+}(), et = D("push"), ft = D("close"), gt = D(Math.floor(Math.random() * Date.now()).toString()), st = D("100%"), ot = D({});
+var At = Object.defineProperty, Lt = Object.getOwnPropertyDescriptor, C = (t, e, o, i) => {
+  for (var r, s = i > 1 ? void 0 : i ? Lt(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
+  return i && s && At(e, o, s), s;
 };
-let w = class extends k(g`
+let w = class extends M(f`
 	:host {
 		position: relative;
 		inset: 0;
@@ -153,8 +154,8 @@ let w = class extends k(g`
     super(...arguments), this.minWidth = { main: 360, sheet: 576 }, this.schmancyContentDrawerID = Math.floor(Math.random() * Date.now()).toString(), this.maxHeight = "100%";
   }
   firstUpdated() {
-    Z(b(window, "resize"), b(window, y.ContentDrawerResize)).pipe(ut(!0), v(() => {
-    }), h(() => this.clientWidth ? this.clientWidth : window.innerWidth), h((t) => t >= this.minWidth.main + this.minWidth.sheet), bt(100), v(() => {
+    tt(b(window, "resize"), b(window, y.ContentDrawerResize)).pipe(ut(!0), v(() => {
+    }), h(() => this.clientWidth ? this.clientWidth : window.innerWidth), h((t) => t >= this.minWidth.main + this.minWidth.sheet), L(100), v(() => {
       this.maxHeight = window.innerHeight - this.getOffsetTop(this) - 32 + "px", this.style.setProperty("max-height", this.maxHeight);
     }), J(), d(this.disconnecting)).subscribe((t) => {
       t ? (this.mode = "push", this.open = "open") : (this.mode = "overlay", this.open = "close");
@@ -165,7 +166,7 @@ let w = class extends k(g`
     }), b(window, "schmancy-content-drawer-render").pipe(v((t) => {
       t.stopPropagation();
     }), h((t) => t.detail), d(this.disconnecting)).subscribe(({ component: t, title: e }) => {
-      this.mode === "push" ? (ct.push({ area: this.schmancyContentDrawerID, component: "empty", historyStrategy: "silent" }), ct.push({ area: this.schmancyContentDrawerID, component: t, historyStrategy: "silent" })) : (this.mode = "overlay") && K.open({ component: t, uid: this.schmancyContentDrawerID, title: e });
+      this.mode === "push" ? (ct.push({ area: this.schmancyContentDrawerID, component: "empty", historyStrategy: "silent" }), ct.push({ area: this.schmancyContentDrawerID, component: t, historyStrategy: "silent" })) : (this.mode = "overlay") && Q.open({ component: t, uid: this.schmancyContentDrawerID, title: e });
     });
   }
   getOffsetTop(t) {
@@ -184,15 +185,15 @@ let w = class extends k(g`
 			>
 				<slot></slot>
 			</schmancy-grid>
-		` : ft;
+		` : yt;
   }
 };
-D([O({ context: ot })], w.prototype, "minWidth", 2), D([O({ context: vt }), c()], w.prototype, "open", 2), D([O({ context: et }), m()], w.prototype, "mode", 2), D([O({ context: wt })], w.prototype, "schmancyContentDrawerID", 2), D([O({ context: st })], w.prototype, "maxHeight", 2), D([L({ flatten: !0 })], w.prototype, "assignedElements", 2), w = D([l("schmancy-content-drawer")], w);
-var Yt = Object.defineProperty, Gt = Object.getOwnPropertyDescriptor, z = (t, e, o, i) => {
-  for (var r, s = i > 1 ? void 0 : i ? Gt(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
-  return i && s && Yt(e, o, s), s;
+C([O({ context: ot })], w.prototype, "minWidth", 2), C([O({ context: ft }), c()], w.prototype, "open", 2), C([O({ context: et }), m()], w.prototype, "mode", 2), C([O({ context: gt })], w.prototype, "schmancyContentDrawerID", 2), C([O({ context: st })], w.prototype, "maxHeight", 2), C([A({ flatten: !0 })], w.prototype, "assignedElements", 2), w = C([l("schmancy-content-drawer")], w);
+var Vt = Object.defineProperty, Ft = Object.getOwnPropertyDescriptor, S = (t, e, o, i) => {
+  for (var r, s = i > 1 ? void 0 : i ? Ft(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
+  return i && s && Vt(e, o, s), s;
 };
-let E = class extends k(g`
+let k = class extends M(f`
 	:host {
 		display: block;
 		overflow: hidden;
@@ -220,17 +221,17 @@ let E = class extends k(g`
 						<slot></slot>
 					</section>
 				</schmancy-grid>
-				${R(this.mode === "push", () => a` <schmancy-divider class="absolute right-0 top-0" orientation="vertical"></schmancy-divider>`)}
+				${X(this.mode === "push", () => a` <schmancy-divider class="absolute right-0 top-0" orientation="vertical"></schmancy-divider>`)}
 			</section>
 		`;
   }
 };
-z([c({ type: Number })], E.prototype, "minWidth", 2), z([p({ context: ot, subscribe: !0 })], E.prototype, "drawerMinWidth", 2), z([p({ context: et, subscribe: !0 }), m()], E.prototype, "mode", 2), z([p({ context: st, subscribe: !0 }), m()], E.prototype, "maxHeight", 2), E = z([l("schmancy-content-drawer-main")], E);
-var Jt = Object.defineProperty, Kt = Object.getOwnPropertyDescriptor, f = (t, e, o, i) => {
-  for (var r, s = i > 1 ? void 0 : i ? Kt(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
-  return i && s && Jt(e, o, s), s;
+S([c({ type: Number })], k.prototype, "minWidth", 2), S([p({ context: ot, subscribe: !0 })], k.prototype, "drawerMinWidth", 2), S([p({ context: et, subscribe: !0 }), m()], k.prototype, "mode", 2), S([p({ context: st, subscribe: !0 }), m()], k.prototype, "maxHeight", 2), k = S([l("schmancy-content-drawer-main")], k);
+var Kt = Object.defineProperty, Yt = Object.getOwnPropertyDescriptor, g = (t, e, o, i) => {
+  for (var r, s = i > 1 ? void 0 : i ? Yt(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
+  return i && s && Kt(e, o, s), s;
 };
-let u = class extends k(g`
+let u = class extends M(f`
 	:host {
 		overflow: scroll;
 	}
@@ -239,19 +240,19 @@ let u = class extends k(g`
     super.connectedCallback(), this.minWidth ? this.drawerMinWidth.sheet = this.minWidth : this.minWidth = this.drawerMinWidth.sheet;
   }
   updated(t) {
-    super.updated(t), t.has("minWidth") && this.minWidth ? (this.drawerMinWidth.sheet = this.minWidth, this.dispatchEvent(new CustomEvent(y.ContentDrawerResize, { bubbles: !0, composed: !0 }))) : (t.has("state") || t.has("mode")) && (this.mode === "overlay" ? this.state === "close" ? this.closeAll() : this.state : this.mode === "push" && (K.dismiss(this.schmancyContentDrawerID), this.state === "close" ? this.closeAll() : this.state === "open" && this.open()));
+    super.updated(t), t.has("minWidth") && this.minWidth ? (this.drawerMinWidth.sheet = this.minWidth, this.dispatchEvent(new CustomEvent(y.ContentDrawerResize, { bubbles: !0, composed: !0 }))) : (t.has("state") || t.has("mode")) && (this.mode === "overlay" ? this.state === "close" ? this.closeAll() : this.state : this.mode === "push" && (Q.dismiss(this.schmancyContentDrawerID), this.state === "close" ? this.closeAll() : this.state === "open" && this.open()));
   }
   open() {
     this.mode === "overlay" ? this.sheet.style.position = "fixed" : this.sheet.style.position = "relative", this.sheet.style.display = "block", this.sheet.animate([{ opacity: 0, transform: "translateX(100%)" }, { opacity: 1, transform: "translateX(0%)" }], { duration: 500, easing: "cubic-bezier(0.5, 0.01, 0.25, 1)" });
   }
   closeAll() {
-    Z(nt(this.closeModalSheet()), nt(this.closeSheet())).pipe(d(this.disconnecting)).subscribe();
+    tt(nt(this.closeModalSheet()), nt(this.closeSheet())).pipe(d(this.disconnecting)).subscribe();
   }
   closeModalSheet() {
-    return X(!0).pipe(v(() => K.dismiss(this.schmancyContentDrawerID)));
+    return V(!0).pipe(v(() => Q.dismiss(this.schmancyContentDrawerID)));
   }
   closeSheet() {
-    return new $t((t) => {
+    return new xt((t) => {
       this.sheet.animate([{ opacity: 1, transform: "translateX(0%)" }, { opacity: 1, transform: "translateX(100%)" }], { duration: 500, easing: "cubic-bezier(0.5, 0.01, 0.25, 1)" }).onfinish = () => {
         this.sheet.style.display = "none", t.next(), t.complete();
       };
@@ -268,12 +269,12 @@ let u = class extends k(g`
 		`;
   }
 };
-f([c({ type: Number })], u.prototype, "minWidth", 2), f([p({ context: et, subscribe: !0 }), m()], u.prototype, "mode", 2), f([p({ context: vt, subscribe: !0 }), m()], u.prototype, "state", 2), f([p({ context: wt })], u.prototype, "schmancyContentDrawerID", 2), f([tt("#sheet")], u.prototype, "sheet", 2), f([L({ flatten: !0, slot: void 0 })], u.prototype, "defaultSlot", 2), f([p({ context: ot, subscribe: !0 })], u.prototype, "drawerMinWidth", 2), f([p({ context: st, subscribe: !0 }), m()], u.prototype, "maxHeight", 2), u = f([l("schmancy-content-drawer-sheet")], u);
-var Qt = Object.defineProperty, Zt = Object.getOwnPropertyDescriptor, j = (t, e, o, i) => {
-  for (var r, s = i > 1 ? void 0 : i ? Zt(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
-  return i && s && Qt(e, o, s), s;
+g([c({ type: Number })], u.prototype, "minWidth", 2), g([p({ context: et, subscribe: !0 }), m()], u.prototype, "mode", 2), g([p({ context: ft, subscribe: !0 }), m()], u.prototype, "state", 2), g([p({ context: gt })], u.prototype, "schmancyContentDrawerID", 2), g([G("#sheet")], u.prototype, "sheet", 2), g([A({ flatten: !0, slot: void 0 })], u.prototype, "defaultSlot", 2), g([p({ context: ot, subscribe: !0 })], u.prototype, "drawerMinWidth", 2), g([p({ context: st, subscribe: !0 }), m()], u.prototype, "maxHeight", 2), u = g([l("schmancy-content-drawer-sheet")], u);
+var Gt = Object.defineProperty, Jt = Object.getOwnPropertyDescriptor, $ = (t, e, o, i) => {
+  for (var r, s = i > 1 ? void 0 : i ? Jt(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
+  return i && s && Gt(e, o, s), s;
 };
-let x = class extends $() {
+let x = class extends E() {
   constructor() {
     super(...arguments), this.selected = !1;
   }
@@ -291,32 +292,32 @@ let x = class extends $() {
   render() {
     const t = { "rounded-none": this.rounded === !1, "rounded-full": this.rounded, "w-full min-h-[56px] relative flex items-center gap-[16px] py-[8px] px-[16px] duration-500 transition-colors": !0, "bg-secondary-container text-secondery-onContainer": this.selected }, e = { "z-0 duration-500 transition-opacity": !0, "rounded-none": this.rounded === !1, "rounded-full": this.rounded, "hover:bg-surface-on opacity-[0.08] cursor-pointer absolute inset-0": !this.readonly };
     return a`<li class=${this.classMap(t)}>
-			${R(!this.readonly, () => a` <div class="${this.classMap(e)}"></div> `)}
+			${X(!this.readonly, () => a` <div class="${this.classMap(e)}"></div> `)}
 			<slot name="leading"> </slot>
 			<schmancy-flex flow="row">
 				<schmancy-typography type="body" token="lg">
 					<slot></slot>
 				</schmancy-typography>
 				<schmancy-typography
-					${W({ color: N.sys.color.surface.onVariant })}
+					${z({ color: T.sys.color.surface.onVariant })}
 					type="body"
 					token="md"
 				>
 					<slot name="support"></slot>
 				</schmancy-typography>
 			</schmancy-flex>
-			${R(!this.readonly, () => a` <div class="${this.classMap(e)}"></div> `)}
+			${X(!this.readonly, () => a` <div class="${this.classMap(e)}"></div> `)}
 			<slot name="trailing"></slot>
 		</li>`;
   }
 };
-j([p({ context: St, subscribe: !0 }), c()], x.prototype, "variant", 2), j([c({ type: Boolean })], x.prototype, "rounded", 2), j([c({ type: Boolean })], x.prototype, "readonly", 2), j([c({ type: Boolean })], x.prototype, "selected", 2), j([L({ slot: "leading", flatten: !0 })], x.prototype, "leading", 2), j([L({ slot: "trailing", flatten: !0 })], x.prototype, "trailing", 2), x = j([l("schmancy-list-item")], x);
-const te = C(void 0);
-var ee = Object.defineProperty, se = Object.getOwnPropertyDescriptor, ht = (t, e, o, i) => {
-  for (var r, s = i > 1 ? void 0 : i ? se(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
-  return i && s && ee(e, o, s), s;
+$([p({ context: zt, subscribe: !0 }), c()], x.prototype, "variant", 2), $([c({ type: Boolean })], x.prototype, "rounded", 2), $([c({ type: Boolean })], x.prototype, "readonly", 2), $([c({ type: Boolean })], x.prototype, "selected", 2), $([A({ slot: "leading", flatten: !0 })], x.prototype, "leading", 2), $([A({ slot: "trailing", flatten: !0 })], x.prototype, "trailing", 2), x = $([l("schmancy-list-item")], x);
+const Qt = D(void 0);
+var Zt = Object.defineProperty, te = Object.getOwnPropertyDescriptor, ht = (t, e, o, i) => {
+  for (var r, s = i > 1 ? void 0 : i ? te(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
+  return i && s && Zt(e, o, s), s;
 };
-let Y = class extends $(g`
+let Y = class extends E(f`
 	:host {
 		display: block;
 		padding-top: 8px;
@@ -333,10 +334,10 @@ let Y = class extends $(g`
 		`;
   }
 };
-ht([O({ context: te }), c()], Y.prototype, "surface", 2), Y = ht([l("schmancy-list")], Y);
-const as = new class {
+ht([O({ context: Qt }), c()], Y.prototype, "surface", 2), Y = ht([l("schmancy-list")], Y);
+const is = new class {
   constructor() {
-    this.$drawer = new Q(), this.$drawer.subscribe((t) => {
+    this.$drawer = new Z(), this.$drawer.pipe(Ot("state"), L(100)).subscribe((t) => {
       t.state ? window.dispatchEvent(new CustomEvent(y.NavDrawer_toggle, { detail: { state: "open" }, bubbles: !0, composed: !0 })) : window.dispatchEvent(new CustomEvent(y.NavDrawer_toggle, { detail: { state: "close" }, bubbles: !0, composed: !0 }));
     });
   }
@@ -346,12 +347,12 @@ const as = new class {
   close(t) {
     this.$drawer.next({ self: t, state: !1 });
   }
-}(), it = C("push"), rt = C("close");
-var oe = Object.defineProperty, ie = Object.getOwnPropertyDescriptor, B = (t, e, o, i) => {
-  for (var r, s = i > 1 ? void 0 : i ? ie(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
-  return i && s && oe(e, o, s), s;
+}(), it = D("push"), rt = D("close");
+var ee = Object.defineProperty, se = Object.getOwnPropertyDescriptor, q = (t, e, o, i) => {
+  for (var r, s = i > 1 ? void 0 : i ? se(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
+  return i && s && ee(e, o, s), s;
 };
-let S = class extends $(g`
+let N = class extends E(f`
 	:host {
 		display: block;
 	}
@@ -369,14 +370,14 @@ let S = class extends $(g`
 				gap="sm"
 				align="center"
 			>
-				${R(this.sidebarMode === "overlay" && this.toggler, () => a`<slot name="toggler">
+				${X(this.sidebarMode === "overlay" && this.toggler, () => a`<slot name="toggler">
 							<div class="${this.classMap(t)}">
 								<schmancy-icon-button
 									@click=${() => {
       this.dispatchEvent(new CustomEvent(y.NavDrawer_toggle, { detail: { state: this.sidebarOpen === "open" ? "close" : "open" }, bubbles: !0, composed: !0 }));
     }}
 								>
-									${R(this.sidebarOpen === "close", () => a`menu`, () => a`menu_open`)}
+									${X(this.sidebarOpen === "close", () => a`menu`, () => a`menu_open`)}
 								</schmancy-icon-button>
 							</div>
 						</slot>`)}
@@ -386,9 +387,9 @@ let S = class extends $(g`
 		`;
   }
 };
-B([p({ context: it, subscribe: !0 }), m()], S.prototype, "sidebarMode", 2), B([p({ context: rt, subscribe: !0 }), m()], S.prototype, "sidebarOpen", 2), B([c({ type: Boolean })], S.prototype, "toggler", 2), S = B([l("schmancy-nav-drawer-appbar")], S);
-var re = Object.defineProperty, ne = Object.getOwnPropertyDescriptor;
-let dt = class extends k(g`
+q([p({ context: it, subscribe: !0 }), m()], N.prototype, "sidebarMode", 2), q([p({ context: rt, subscribe: !0 }), m()], N.prototype, "sidebarOpen", 2), q([c({ type: Boolean })], N.prototype, "toggler", 2), N = q([l("schmancy-nav-drawer-appbar")], N);
+var oe = Object.defineProperty, ie = Object.getOwnPropertyDescriptor;
+let dt = class extends M(f`
 	:host {
 		display: block;
 		position: relative;
@@ -406,14 +407,14 @@ let dt = class extends k(g`
   }
 };
 dt = ((t, e, o, i) => {
+  for (var r, s = i > 1 ? void 0 : i ? ie(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
+  return i && s && oe(e, o, s), s;
+})([l("schmancy-nav-drawer-content")], dt);
+var re = Object.defineProperty, ne = Object.getOwnPropertyDescriptor, I = (t, e, o, i) => {
   for (var r, s = i > 1 ? void 0 : i ? ne(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
   return i && s && re(e, o, s), s;
-})([l("schmancy-nav-drawer-content")], dt);
-var ae = Object.defineProperty, ce = Object.getOwnPropertyDescriptor, I = (t, e, o, i) => {
-  for (var r, s = i > 1 ? void 0 : i ? ce(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
-  return i && s && ae(e, o, s), s;
 };
-let M = class extends k(g`
+let P = class extends M(f`
 	:host {
 		display: flex;
 		flex-grow: 1;
@@ -424,12 +425,12 @@ let M = class extends k(g`
     super(...arguments), this.fullscreen = !1, this.breakpoint = 768;
   }
   connectedCallback() {
-    super.connectedCallback(), b(window, "resize").pipe(h((t) => t.target), ut(window), h((t) => t.innerWidth), h((t) => t >= this.breakpoint), J(), d(this.disconnecting), bt(100)).subscribe((t) => {
+    super.connectedCallback(), b(window, "resize").pipe(h((t) => t.target), ut(window), h((t) => t.innerWidth), h((t) => t >= this.breakpoint), J(), d(this.disconnecting), L(100)).subscribe((t) => {
       t ? (this.mode = "push", this.open = "open") : (this.mode = "overlay", this.open = "close");
     }), b(window, y.NavDrawer_toggle).pipe(v((t) => {
       t.stopPropagation();
-    }), h((t) => t.detail.state), J(), d(this.disconnecting)).subscribe((t) => {
-      this.open = t;
+    }), h((t) => t.detail.state), J(), d(this.disconnecting), L(100)).subscribe((t) => {
+      this.mode === "push" && t === "close" || (this.open = t);
     });
   }
   render() {
@@ -440,49 +441,56 @@ let M = class extends k(g`
 				flow="col"
 				justify="stretch"
 				align="stretch"
-				${zt()}
+				${Wt()}
 			>
 				<slot></slot>
 			</schmancy-grid>
-		` : ft;
+		` : yt;
   }
 };
-I([c({ type: Boolean })], M.prototype, "fullscreen", 2), I([c({ type: Number, attribute: "breakpoint" })], M.prototype, "breakpoint", 2), I([O({ context: it }), m()], M.prototype, "mode", 2), I([O({ context: rt }), c()], M.prototype, "open", 2), M = I([l("schmancy-nav-drawer")], M);
-var le = Object.defineProperty, pe = Object.getOwnPropertyDescriptor, H = (t, e, o, i) => {
-  for (var r, s = i > 1 ? void 0 : i ? pe(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
-  return i && s && le(e, o, s), s;
+I([c({ type: Boolean })], P.prototype, "fullscreen", 2), I([c({ type: Number, attribute: "breakpoint" })], P.prototype, "breakpoint", 2), I([O({ context: it }), m()], P.prototype, "mode", 2), I([O({ context: rt }), c()], P.prototype, "open", 2), P = I([l("schmancy-nav-drawer")], P);
+var ae = Object.defineProperty, ce = Object.getOwnPropertyDescriptor, W = (t, e, o, i) => {
+  for (var r, s = i > 1 ? void 0 : i ? ce(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
+  return i && s && ae(e, o, s), s;
 };
-let P = class extends k() {
+let j = class extends M() {
   constructor() {
     super(...arguments), this.width = "320px";
   }
-  connectedCallback() {
-    super.connectedCallback();
-  }
   updated(t) {
-    t.has("state") && (this.mode === "overlay" ? this.state === "close" ? this.closeOverlay() : this.state === "open" && this.openOverlay() : this.mode === "push" && this.closeOverlay());
+    t.has("state") && (this.mode === "overlay" ? this.state === "close" ? (this.hideNavDrawer(), this.closeOverlay()) : this.state === "open" && (this.openOverlay(), this.showNavDrawer()) : this.mode === "push" && (this.showNavDrawer(), this.closeOverlay()));
   }
   openOverlay() {
     this.overlay.style.display = "block", this.overlay.animate([{ opacity: 0 }, { opacity: 0.4 }], { duration: 200, easing: "cubic-bezier(0.5, 0.01, 0.25, 1)", fill: "forwards" });
   }
   closeOverlay() {
-    this.overlay.animate([{ opacity: 0.4 }, { opacity: 0 }], { duration: 150, easing: "cubic-bezier(0.5, 0.01, 0.25, 1)" }).onfinish = () => {
+    this.overlay.animate([{ opacity: 0.4 }, { opacity: 0 }], { duration: 150, easing: "cubic-bezier(0.5, 0.01, 0.25, 1)", fill: "forwards" }).onfinish = () => {
       this.overlay.style.display = "none";
     };
   }
+  showNavDrawer() {
+    this.nav.style.transform !== "translateX(0)" && (this.nav.animate([{ transform: "translateX(-100%)" }, { transform: "translateX(0)" }], { duration: 200, easing: "cubic-bezier(0.5, 0.01, 0.25, 1)", fill: "forwards" }).onfinish = () => {
+      this.state = "open";
+    });
+  }
+  hideNavDrawer() {
+    this.nav.style.transform !== "translateX(-100%)" && (this.nav.animate([{ transform: "translateX(0)" }, { transform: "translateX(-100%)" }], { duration: 200, easing: "cubic-bezier(0.5, 0.01, 0.25, 1)", fill: "forwards" }).onfinish = () => {
+      this.state = "close";
+    });
+  }
   render() {
-    const t = { "p-[16px] max-w-[360px] w-fit h-full overflow-auto": !0, block: this.mode === "push", "fixed inset-0 translate-x-[-100%] z-50": this.mode === "overlay", "translate-x-0": this.mode === "overlay" && this.state === "open", "translate-x-[-100%]": this.mode === "overlay" && this.state === "close" }, e = { width: this.width };
+    const t = { "p-[16px] max-w-[360px] w-fit h-full overflow-auto": !0, block: this.mode === "push", "fixed inset-0 z-50": this.mode === "overlay" }, e = { width: this.width };
     return a`
 			<nav
 				style=${this.styleMap(e)}
-				class="${this.classMap({ ...t, "transition-all transform-gpu duration-[200ms] ease-[cubicBezier(0.5, 0.01, 0.25, 1)]": !0 })}"
-				${W({ bgColor: N.sys.color.surface.container })}
+				class="${this.classMap({ ...t })}"
+				${z({ bgColor: T.sys.color.surface.container })}
 			>
 				<slot></slot>
 			</nav>
 			<div
 				id="overlay"
-				${W({ bgColor: N.sys.color.scrim })}
+				${z({ bgColor: T.sys.color.scrim })}
 				@click=${() => {
       window.dispatchEvent(new CustomEvent(y.NavDrawer_toggle, { detail: { state: "close" }, bubbles: !0, composed: !0 }));
     }}
@@ -491,29 +499,29 @@ let P = class extends k() {
 		`;
   }
 };
-H([p({ context: it, subscribe: !0 }), m()], P.prototype, "mode", 2), H([p({ context: rt, subscribe: !0 }), m()], P.prototype, "state", 2), H([tt("#overlay")], P.prototype, "overlay", 2), H([c({ type: String })], P.prototype, "width", 2), P = H([l("schmancy-nav-drawer-navbar")], P);
-const xt = "whereAreYouRicky", Ot = "hereMorty", U = new class {
+W([p({ context: it, subscribe: !0 }), m()], j.prototype, "mode", 2), W([p({ context: rt, subscribe: !0 }), m()], j.prototype, "state", 2), W([G("#overlay")], j.prototype, "overlay", 2), W([G("nav")], j.prototype, "nav", 2), W([c({ type: String })], j.prototype, "width", 2), j = W([l("schmancy-nav-drawer-navbar")], j);
+const vt = "whereAreYouRicky", wt = "hereMorty", U = new class {
   constructor() {
-    this.activeTeleportations = /* @__PURE__ */ new Map(), this.flipRequests = new Q(), this.find = (t) => at([b(window, Ot).pipe(gt((e) => !!e.detail.component.uuid && !!t.id && e.detail.component.id === t.id && e.detail.component.uuid !== t.uuid), h((e) => e.detail.component), Ct(1)), X(t).pipe(v(() => {
-      window.dispatchEvent(new CustomEvent(xt, { detail: { id: t.id, callerID: t.uuid } }));
-    }))]).pipe(h(([e]) => e), Dt(0)), this.flip = (t) => {
+    this.activeTeleportations = /* @__PURE__ */ new Map(), this.flipRequests = new Z(), this.find = (t) => at([b(window, wt).pipe(bt((e) => !!e.detail.component.uuid && !!t.id && e.detail.component.id === t.id && e.detail.component.uuid !== t.uuid), h((e) => e.detail.component), Dt(1)), V(t).pipe(v(() => {
+      window.dispatchEvent(new CustomEvent(vt, { detail: { id: t.id, callerID: t.uuid } }));
+    }))]).pipe(h(([e]) => e), Ct(0)), this.flip = (t) => {
       const { from: e, to: o } = t, i = o.element.style.zIndex;
       o.element.style.transformOrigin = "top left", o.element.style.setProperty("visibility", "visible"), o.element.style.zIndex = "1000";
       const r = [{ transform: `translate(${e.rect.left - o.rect.left}px, ${e.rect.top - o.rect.top}px) scale(${e.rect.width / o.rect.width}, ${e.rect.height / o.rect.height})` }, { transform: "translate(0, 0) scale(1, 1)" }];
       o.element.animate(r, { duration: 250, delay: 10, easing: "cubic-bezier(0.455, 0.03, 0.515, 0.955)" }).onfinish = () => {
         o.element.style.zIndex = i, o.element.style.transformOrigin = "";
       };
-    }, this.flipRequests.pipe(jt(1), h((t) => t.map(({ from: e, to: o, host: i }, r) => ({ from: e, to: o, host: i, i: r }))), kt((t) => at(t.map((e) => X(this.flip(e)))))).subscribe();
+    }, this.flipRequests.pipe($t(1), h((t) => t.map(({ from: e, to: o, host: i }, r) => ({ from: e, to: o, host: i, i: r }))), jt((t) => at(t.map((e) => V(this.flip(e)))))).subscribe();
   }
 }();
 function mt(t) {
-  return Et(50).pipe(Ht(() => t.getBoundingClientRect()), Tt((e, o) => e.width === o.width && e.height === o.height && e.top === o.top && e.right === o.right && e.bottom === o.bottom && e.left === o.left), Nt(1));
+  return Et(50).pipe(St(() => t.getBoundingClientRect()), Nt((e, o) => e.width === o.width && e.height === o.height && e.top === o.top && e.right === o.right && e.bottom === o.bottom && e.left === o.left), It(1));
 }
-var he = Object.defineProperty, de = Object.getOwnPropertyDescriptor, A = (t, e, o, i) => {
-  for (var r, s = i > 1 ? void 0 : i ? de(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
-  return i && s && he(e, o, s), s;
+var le = Object.defineProperty, pe = Object.getOwnPropertyDescriptor, B = (t, e, o, i) => {
+  for (var r, s = i > 1 ? void 0 : i ? pe(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
+  return i && s && le(e, o, s), s;
 };
-let T = class extends k(g``) {
+let H = class extends M(f``) {
   constructor() {
     super(...arguments), this.uuid = Math.floor(Math.random() * Date.now()), this.delay = 0, this.debugging = !1;
   }
@@ -522,14 +530,14 @@ let T = class extends k(g``) {
   }
   connectedCallback() {
     if (this.id === void 0) throw new Error("id is required");
-    super.connectedCallback(), Z(b(window, Pt).pipe(v({ next: () => {
-      this.dispatchEvent(new CustomEvent(Wt, { detail: { component: this }, bubbles: !0, composed: !0 }));
-    } })), b(window, xt).pipe(v({ next: (t) => {
-      t.detail.id === this.id && this.uuid && t.detail.callerID !== this.uuid && this.dispatchEvent(new CustomEvent(Ot, { detail: { component: this }, bubbles: !0, composed: !0 }));
+    super.connectedCallback(), tt(b(window, kt).pipe(v({ next: () => {
+      this.dispatchEvent(new CustomEvent(Pt, { detail: { component: this }, bubbles: !0, composed: !0 }));
+    } })), b(window, vt).pipe(v({ next: (t) => {
+      t.detail.id === this.id && this.uuid && t.detail.callerID !== this.uuid && this.dispatchEvent(new CustomEvent(wt, { detail: { component: this }, bubbles: !0, composed: !0 }));
     } }))).pipe(d(this.disconnecting)).subscribe();
   }
   async firstUpdated() {
-    X(U.activeTeleportations.get(this.id)).pipe(gt((t) => !!t), d(this.disconnecting), Mt()).subscribe({ next: (t) => {
+    V(U.activeTeleportations.get(this.id)).pipe(bt((t) => !!t), d(this.disconnecting), Mt()).subscribe({ next: (t) => {
       this.style.setProperty("visibility", "hidden"), mt(this).pipe(d(this.disconnecting)).subscribe({ next: (e) => {
         U.activeTeleportations.set(this.id, e), U.flipRequests.next({ from: { rect: t }, to: { rect: e, element: this._slottedChildren[0] }, host: this });
       } });
@@ -544,48 +552,29 @@ let T = class extends k(g``) {
     return a`<slot></slot>`;
   }
 };
-A([c({ type: Number, reflect: !0 })], T.prototype, "uuid", 2), A([c({ type: String })], T.prototype, "id", 2), A([c({ type: Number })], T.prototype, "delay", 2), T = A([l("schmancy-teleport")], T);
-var me = Object.defineProperty, ye = Object.getOwnPropertyDescriptor, yt = (t, e, o, i) => {
-  for (var r, s = i > 1 ? void 0 : i ? ye(e, o) : e, n = t.length - 1; n >= 0; n--) (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
-  return i && s && me(e, o, s), s;
-};
-let G = class extends $() {
-  render() {
-    return a`
-			<schmancy-button
-				@click=${() => {
-      It.next(void 0), this.color.animate([{ transform: "rotate(0deg)" }, { transform: "rotate(360deg)" }], { duration: 300 });
-    }}
-				variant="text"
-			>
-				<schmancy-icon id="color">palette</schmancy-icon>
-			</schmancy-button>
-		`;
-  }
-};
-yt([tt("#color")], G.prototype, "color", 2), G = yt([l("schmancy-theme-button")], G);
+B([c({ type: Number, reflect: !0 })], H.prototype, "uuid", 2), B([c({ type: String })], H.prototype, "id", 2), B([c({ type: Number })], H.prototype, "delay", 2), H = B([l("schmancy-teleport")], H);
 export {
-  Ot as H,
+  wt as H,
   Y as L,
   et as S,
-  xt as W,
-  vt as a,
-  wt as b,
+  vt as W,
+  ft as a,
+  gt as b,
   st as c,
   ot as d,
   w as e,
-  E as f,
+  k as f,
   u as g,
   x as h,
-  as as i,
-  S as j,
+  is as i,
+  N as j,
   dt as k,
   it as l,
   rt as m,
-  M as n,
-  P as o,
-  T as p,
-  ns as s,
+  P as n,
+  j as o,
+  H as p,
+  os as s,
   U as t
 };
-//# sourceMappingURL=theme-button-BQZkb1t4.js.map
+//# sourceMappingURL=teleport.component-CgNOwz49.js.map