@mhmo91/schmancy 0.4.2 → 0.4.3

package/dist/{avatar-m6kOcWq2.js → avatar-WaHuf8DW.js}

@@ -1,65 +1,66 @@
-import { css as u, html as l, nothing as mt } from "lit";
-import { property as c, customElement as h, state as d, queryAssignedElements as ut, query as J } from "lit/decorators.js";
-import { Subject as tt, merge as et, fromEvent as v, startWith as xt, tap as C, map as w, debounceTime as V, distinctUntilChanged as L, takeUntil as y, from as at, of as F, Observable as $t, zip as ct, filter as bt, take as Ct, timeout as Ot, bufferTime as St, concatMap as Dt, interval as kt, throwIfEmpty as zt } from "rxjs";
-import "./animated-text-DE4jCzlq.js";
-import { a as lt, F as Et, H as jt } from "./area.component-DQKc0WXK.js";
-import "./autocomplete-ytqc1f_C.js";
+import { css as O, html as c, nothing as at } from "lit";
+import { property as l, customElement as v, state as d, queryAssignedElements as lt, query as F } from "lit/decorators.js";
+import { Subject as G, merge as J, fromEvent as g, startWith as ut, tap as $, map as f, debounceTime as q, distinctUntilChanged as K, takeUntil as p, from as st, of as B, Observable as bt, zip as rt, filter as ct, take as gt, timeout as ft, bufferTime as vt, concatMap as wt, interval as xt, throwIfEmpty as $t } from "rxjs";
+import "./animated-text-C63wwL5H.js";
+import { a as it, F as Ct, H as St } from "./area.component-mDv3w12S.js";
+import "./autocomplete-BLtChct9.js";
 import "lit/directives/class-map.js";
 import "lit/directives/style-map.js";
-import { T } from "./tailwind.mixin-t3Yj_Xbu.js";
-import { c as W, f as Mt } from "./ripple-BumgqsDT.js";
-import "./boat-BeW5NYdz.js";
-import "./spinner-RvzzGIF-.js";
-import "./icon-button-eM7fkcaa.js";
-import { S as i } from "./theme.interface-C5Kj6WjD.js";
-import "./checkbox-DSEvvPj1.js";
-import "./chips-DCKLuDxP.js";
-import "./circular-progress-CKlT4zjF.js";
-import "./code-preview-CuDOLS91.js";
-import "./payment-card-form-DgkNJsE1.js";
+import { T as dt } from "./tailwind.mixin-Ba46CZMW.js";
+import { c as U, f as Dt } from "./ripple-BumgqsDT.js";
+import "./boat-BTnwHy3K.js";
+import "./spinner-BuH3Wf-1.js";
+import "./icon-button-BMkYjAl1.js";
+import "./media-DR_teeoc.js";
+import "./checkbox-C6B9Iii2.js";
+import "./chips-CLKkNCVv.js";
+import "./circular-progress-C246y_3U.js";
+import "./code-preview-CxDOJhpM.js";
+import "./payment-card-form-DPf41TU3.js";
 import { SchmancyEvents as m } from "./types.js";
-import { n as P, e as M } from "./provide-tcktw8xB.js";
-import { $ as k } from "./litElement.mixin-CUhEpTgZ.js";
-import { c as p } from "./consume-5D1qfVWM.js";
-import "./date-range-CmeAQ5QS.js";
-import "./delay-pKHFTza9.js";
-import "./dialog-content-B_fVl8nu.js";
+import { n as j, e as M } from "./provide-tcktw8xB.js";
+import { $ as z } from "./litElement.mixin-BC40ZfGG.js";
+import { c as h } from "./consume-5D1qfVWM.js";
+import "./date-range-DStUXYx-.js";
+import "./delay-1MUDagyy.js";
+import "./dialog-content-CXBx9Bmp.js";
 import "./dialog-service-CnjZCTMj.js";
-import "./divider-njFvOEz7.js";
-import "./dropdown-content-C4o6Y70E.js";
-import "./timezone-pKGsUkVR.js";
-import "./form-eXTuXutS.js";
-import "./icon-as6C4b0_.js";
-import "./input-C1JcUy_t.js";
-import "./flex-CbKzMNEV.js";
-import "./list-Cn2oKOHN.js";
-import "./menu--0VMi_rl.js";
-import { when as Q } from "lit/directives/when.js";
-import "./notification-service-BSp9bz1i.js";
-import "./option-BBH03Xsg.js";
-import "./radio-button-Cuo-ybx9.js";
+import "./divider-GhXZhIur.js";
+import "./dropdown-content-BcGSsDWz.js";
+import "./timezone-CDz5qI2Z.js";
+import "./form-2QZDF5pF.js";
+import "./icon-DWdq9YQM.js";
+import "./input-6XNB7MZP.js";
+import "./flex-BftnODFE.js";
+import "./list-BxLFi3dU.js";
+import "./menu-CwKx1goz.js";
+import { when as Y } from "lit/directives/when.js";
+import "./notification-service-ufUrNaq3.js";
+import "./option-CayvURH3.js";
+import "./radio-button-DouFDjcL.js";
 import "./index-CuY8m6ta.js";
-import "./select-ChxNr4a9.js";
-import "./sheet-2FAz4r9B.js";
-import { s as Z } from "./theme.component-DGfwQDsP.js";
-import "./slider-DU3_sk4c.js";
-import "./schmancy-steps-container-CmGuY9sB.js";
+import "./select-BjZUTKHm.js";
+import "./sheet-D8SmGguy.js";
+import { s as V } from "./theme.component-DC3WGfcn.js";
+import "./slider-ytiEVvLJ.js";
+import "./schmancy-steps-container-CWBj3izf.js";
 import "./context-object-CDDP4bTk.js";
-import { map as Wt, distinctUntilChanged as Pt, take as It } from "rxjs/operators";
-import "./surface-s7dL8dsr.js";
-import "./table-DzYvbr4k.js";
-import "./tabs-compatibility-vhn4Kp7N.js";
-import "./textarea-DB4ma3Yk.js";
-import "./theme-button-DiugvNq0.js";
-import "./tooltip-OGPdu-15.js";
-import "./tree-BLnyRUxk.js";
-import "./typewriter-P4fs9-rU.js";
-import "./typography-BouLjmvn.js";
-var Nt = Object.defineProperty, Tt = Object.getOwnPropertyDescriptor, z = (t, e, o, r) => {
-  for (var n, s = r > 1 ? void 0 : r ? Tt(e, o) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (s = (r ? n(e, o, s) : n(s)) || s);
-  return r && s && Nt(e, o, s), s;
+import { map as Ot, distinctUntilChanged as zt, take as Et } from "rxjs/operators";
+import "./surface-Bkj3lZLo.js";
+import "./table-BNUCQw-a.js";
+import "./tabs-compatibility-c-iBrBOK.js";
+import "./textarea-jbhUeEzu.js";
+import "./theme-button-CBJXLV0Z.js";
+import "./tooltip-BaX2Qoi8.js";
+import "./tree-DGUU6cQI.js";
+import "./typewriter-BdQEQLOW.js";
+import "./typography-B1KbZvto.js";
+import { S as i } from "./theme.interface-C5Kj6WjD.js";
+var kt = Object.defineProperty, Wt = Object.getOwnPropertyDescriptor, E = (t, e, r, o) => {
+  for (var n, s = o > 1 ? void 0 : o ? Wt(e, r) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (s = (o ? n(e, r, s) : n(s)) || s);
+  return o && s && kt(e, r, s), s;
 };
-let O = class extends T(u`
+let C = class extends dt(O`
 	:host {
 		display: inline-flex;
 	}
@@ -171,19 +172,19 @@ let O = class extends T(u`
     return { primary: { bg: this.outlined ? "transparent" : `color-mix(in srgb, ${i.sys.color.primary.container} 92%, ${i.sys.color.primary.default} 8%)`, text: this.outlined ? i.sys.color.primary.default : i.sys.color.primary.onContainer, border: this.outlined ? `color-mix(in srgb, ${i.sys.color.primary.default} 90%, ${i.sys.color.surface.highest} 10%)` : void 0 }, secondary: { bg: this.outlined ? "transparent" : `color-mix(in srgb, ${i.sys.color.secondary.container} 95%, ${i.sys.color.secondary.default} 5%)`, text: this.outlined ? i.sys.color.secondary.default : i.sys.color.secondary.onContainer, border: this.outlined ? `color-mix(in srgb, ${i.sys.color.secondary.default} 85%, ${i.sys.color.surface.highest} 15%)` : void 0 }, tertiary: { bg: this.outlined ? "transparent" : `color-mix(in srgb, ${i.sys.color.tertiary.container} 94%, ${i.sys.color.tertiary.default} 6%)`, text: this.outlined ? i.sys.color.tertiary.default : i.sys.color.tertiary.onContainer, border: this.outlined ? `color-mix(in srgb, ${i.sys.color.tertiary.default} 88%, ${i.sys.color.surface.highest} 12%)` : void 0 }, success: { bg: this.outlined ? "transparent" : `color-mix(in srgb, ${i.sys.color.success.container} 90%, ${i.sys.color.success.default} 10%)`, text: this.outlined ? i.sys.color.success.default : i.sys.color.success.onContainer, border: this.outlined ? `color-mix(in srgb, ${i.sys.color.success.default} 85%, ${i.sys.color.surface.bright} 15%)` : void 0 }, warning: { bg: this.outlined ? "transparent" : `color-mix(in srgb, ${i.sys.color.tertiary.container} 85%, ${i.sys.color.tertiary.default} 15%)`, text: this.outlined ? i.sys.color.tertiary.default : i.sys.color.tertiary.onContainer, border: this.outlined ? `color-mix(in srgb, ${i.sys.color.tertiary.default} 90%, ${i.sys.color.surface.highest} 10%)` : void 0 }, error: { bg: this.outlined ? "transparent" : `color-mix(in srgb, ${i.sys.color.error.container} 92%, ${i.sys.color.error.default} 8%)`, text: this.outlined ? i.sys.color.error.default : i.sys.color.error.onContainer, border: this.outlined ? `color-mix(in srgb, ${i.sys.color.error.default} 88%, ${i.sys.color.surface.bright} 12%)` : void 0 }, neutral: { bg: this.outlined ? "transparent" : `color-mix(in srgb, ${i.sys.color.surface.high} 95%, ${i.sys.color.outline} 5%)`, text: this.outlined ? `color-mix(in srgb, ${i.sys.color.surface.on} 95%, ${i.sys.color.surface.default} 5%)` : i.sys.color.surface.on, border: this.outlined ? `color-mix(in srgb, ${i.sys.color.outline} 85%, ${i.sys.color.surface.highest} 15%)` : void 0 } }[this.color];
   }
   render() {
-    const t = this.getSizeClasses(), e = this.getShapeClasses(), o = this.getColorStyles(), r = this.getIconSize(), n = this.getExoticStyles(), s = { "inline-flex items-center justify-center font-medium": !0, [t]: !0, [e]: !0, "animate-pulse": this.pulse, "border border-solid": this.outlined, "shadow-sm": !this.outlined && this.size === "sm", shadow: !this.outlined && this.size === "md", "shadow-md": !this.outlined && this.size === "lg" }, a = { borderColor: o.border, transition: "all 0.2s ease", ...this.outlined ? { backdropFilter: "blur(4px)", borderWidth: "1px" } : {}, ...this.size !== "lg" || this.outlined ? {} : { boxShadow: "0 1px 2px rgba(0, 0, 0, 0.06), 0 1px 3px rgba(0, 0, 0, 0.1)" }, ...n };
-    return l`
+    const t = this.getSizeClasses(), e = this.getShapeClasses(), r = this.getColorStyles(), o = this.getIconSize(), n = this.getExoticStyles(), s = { "inline-flex items-center justify-center font-medium": !0, [t]: !0, [e]: !0, "animate-pulse": this.pulse, "border border-solid": this.outlined, "shadow-sm": !this.outlined && this.size === "sm", shadow: !this.outlined && this.size === "md", "shadow-md": !this.outlined && this.size === "lg" }, a = { borderColor: r.border, transition: "all 0.2s ease", ...this.outlined ? { backdropFilter: "blur(4px)", borderWidth: "1px" } : {}, ...this.size !== "lg" || this.outlined ? {} : { boxShadow: "0 1px 2px rgba(0, 0, 0, 0.06), 0 1px 3px rgba(0, 0, 0, 0.1)" }, ...n };
+    return c`
 			<div
 				part="badge"
 				class="${this.classMap(s)}"
 				style="${this.styleMap(a)}"
-				${W({ bgColor: o.bg, color: o.text })}
+				${U({ bgColor: r.bg, color: r.text })}
 			>
 				<!-- Icon slot or named icon -->
 				<slot name="icon">
-					${this.icon ? l`
+					${this.icon ? c`
 								<div part="icon" class="icon-container flex-shrink-0 flex items-center justify-center">
-									<schmancy-icon .size=${r} class="flex items-center">${this.icon}</schmancy-icon>
+									<schmancy-icon .size=${o} class="flex items-center">${this.icon}</schmancy-icon>
 								</div>
 							` : ""}
 				</slot>
@@ -196,143 +197,25 @@ let O = class extends T(u`
 		`;
   }
 };
-z([c({ type: String, reflect: !0 })], O.prototype, "color", 2), z([c({ type: String, reflect: !0 })], O.prototype, "size", 2), z([c({ type: String, reflect: !0 })], O.prototype, "shape", 2), z([c({ type: Boolean, reflect: !0 })], O.prototype, "outlined", 2), z([c({ type: String })], O.prototype, "icon", 2), z([c({ type: Boolean, reflect: !0 })], O.prototype, "pulse", 2), O = z([h("sch-badge")], O);
-var Xt = Object.getOwnPropertyDescriptor;
-let ht = class extends T(u`
-	:host {
-		display: block;
-	}
-`) {
-  render() {
-    return l` <section class="pb-4 px-4"><slot> </slot></section> `;
-  }
-};
-ht = ((t, e, o, r) => {
-  for (var n, s = r > 1 ? void 0 : r ? Xt(e, o) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (s = n(s) || s);
-  return s;
-})([h("schmancy-card-action")], ht);
-var _t = Object.defineProperty, At = Object.getOwnPropertyDescriptor, Y = (t, e, o, r) => {
-  for (var n, s = r > 1 ? void 0 : r ? At(e, o) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (s = (r ? n(e, o, s) : n(s)) || s);
-  return r && s && _t(e, o, s), s;
-};
-let H = class extends T(u`:host{
-	display: block;
-	position: relative;
-	inset: 0;
-	border-radius: 0.375rem; /* rounded-md */
-}
-:host([type="elevated"]) {
-	background-color: var(--schmancy-sys-color-surface-low);
-	box-shadow: var(--schmancy-sys-elevation-1);
-}
-:host([type="elevated"]:hover) {
-	box-shadow: var(--schmancy-sys-elevation-2);
-}
-:host([type="filled"]) {
-	background-color: var(--schmancy-sys-color-surface-highest);
-}
-:host([type="filled"]:hover) {
-	box-shadow: var(--schmancy-sys-elevation-1);
-}
-:host([type="outlined"]) {
-	background-color: var(--schmancy-sys-color-surface-default);
-	border: 1px solid var(--schmancy-sys-color-outlineVariant);
-}
-:host([type="outlined"]:hover) {
-	box-shadow: var(--schmancy-sys-elevation-1);
-}
-:host([elevation="1"]) {
-	box-shadow: var(--schmancy-sys-elevation-1);
-}
-:host([elevation="2"]) {
-	box-shadow: var(--schmancy-sys-elevation-2);
-}
-:host([elevation="3"]) {
-	box-shadow: var(--schmancy-sys-elevation-3);
-}
-:host([elevation="4"]) {
-	box-shadow: var(--schmancy-sys-elevation-4);
-}
-:host([elevation="5"]) {
-	box-shadow: var(--schmancy-sys-elevation-5);
-}`) {
-  constructor() {
-    super(...arguments), this.type = "elevated", this.elevation = 0;
-  }
-  render() {
-    return l`<slot></slot>`;
-  }
-};
-Y([c()], H.prototype, "type", 2), Y([c({ type: Number })], H.prototype, "elevation", 2), H = Y([h("schmancy-card")], H);
-var Ht = Object.getOwnPropertyDescriptor;
-let dt = class extends T() {
-  render() {
-    const t = i.sys.color.surface.on, e = i.sys.color.surface.onVariant;
-    return l`<schmancy-grid gap="md" class="${this.classMap({ "px-[16px] py-[24px]": !0 })}">
-			<schmancy-grid gap="xs">
-				<schmancy-typography
-					${W({ color: t })}
-					type="body"
-					token="lg"
-					><slot name="headline"> </slot
-				></schmancy-typography>
-				<schmancy-typography
-					${W({ color: e })}
-					type="body"
-					><slot name="subhead"></slot>
-				</schmancy-typography>
-			</schmancy-grid>
-			<schmancy-typography
-				type="body"
-				${W({ color: e })}
-			>
-				<slot></slot>
-			</schmancy-typography>
-		</schmancy-grid>`;
-  }
-};
-dt = ((t, e, o, r) => {
-  for (var n, s = r > 1 ? void 0 : r ? Ht(e, o) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (s = n(s) || s);
-  return s;
-})([h("schmancy-card-content")], dt);
-var Rt = Object.defineProperty, qt = Object.getOwnPropertyDescriptor, G = (t, e, o, r) => {
-  for (var n, s = r > 1 ? void 0 : r ? qt(e, o) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (s = (r ? n(e, o, s) : n(s)) || s);
-  return r && s && Rt(e, o, s), s;
-};
-let R = class extends T(u`
-	:host {
-		display: block;
-	}
-`) {
+E([l({ type: String, reflect: !0 })], C.prototype, "color", 2), E([l({ type: String, reflect: !0 })], C.prototype, "size", 2), E([l({ type: String, reflect: !0 })], C.prototype, "shape", 2), E([l({ type: Boolean, reflect: !0 })], C.prototype, "outlined", 2), E([l({ type: String })], C.prototype, "icon", 2), E([l({ type: Boolean, reflect: !0 })], C.prototype, "pulse", 2), C = E([v("sch-badge")], C);
+const Ze = new class {
   constructor() {
-    super(...arguments), this.src = "", this.fit = "contain";
-  }
-  render() {
-    const t = { "object-center": !0, "object-contain": this.fit === "contain", "object-cover w-full": this.fit === "cover", "object-fill": this.fit === "fill", "object-none": this.fit === "none", "object-scale-down": this.fit === "scale-down" };
-    return l`<schmancy-grid align="stretch" justify="stretch" gap="md">
-			<img src="${this.src}" style=${this.styleMap({ height: "200px" })} class="${this.classMap(t)}" />
-		</schmancy-grid>`;
-  }
-};
-G([c({ type: String, reflect: !0 })], R.prototype, "src", 2), G([c({ type: String })], R.prototype, "fit", 2), R = G([h("schmancy-card-media")], R);
-const hs = new class {
-  constructor() {
-    this.$drawer = new tt(), this.$drawer.pipe().subscribe((t) => {
+    this.$drawer = new G(), this.$drawer.pipe().subscribe((t) => {
       t.action === "dismiss" ? t.ref.dispatchEvent(new CustomEvent(m.ContentDrawerToggle, { detail: { state: "close" }, bubbles: !0, composed: !0 })) : t.action === "render" && (t.ref.dispatchEvent(new CustomEvent(m.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 })));
     });
   }
   dimiss(t) {
     this.$drawer.next({ action: "dismiss", ref: t });
   }
-  render(t, e, o) {
-    t.dispatchEvent(new CustomEvent("custom-event")), this.$drawer.next({ action: "render", ref: t, component: e, title: o });
+  render(t, e, r) {
+    t.dispatchEvent(new CustomEvent("custom-event")), this.$drawer.next({ action: "render", ref: t, component: e, title: r });
   }
-}(), st = P("push"), gt = P("close"), ft = P(Math.floor(Math.random() * Date.now()).toString()), ot = P("100%"), rt = P({});
-var Bt = Object.defineProperty, Ut = Object.getOwnPropertyDescriptor, E = (t, e, o, r) => {
-  for (var n, s = r > 1 ? void 0 : r ? Ut(e, o) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (s = (r ? n(e, o, s) : n(s)) || s);
-  return r && s && Bt(e, o, s), s;
+}(), L = j("push"), ht = j("close"), pt = j(Math.floor(Math.random() * Date.now()).toString()), Q = j("100%"), Z = j({});
+var Mt = Object.defineProperty, jt = Object.getOwnPropertyDescriptor, k = (t, e, r, o) => {
+  for (var n, s = o > 1 ? void 0 : o ? jt(e, r) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (s = (o ? n(e, r, s) : n(s)) || s);
+  return o && s && Mt(e, r, s), s;
 };
-let S = class extends k(u`
+let S = class extends z(O`
 	:host {
 		position: relative;
 		inset: 0;
@@ -344,19 +227,19 @@ let S = class extends k(u`
     super(...arguments), this.minWidth = { main: 360, sheet: 576 }, this.schmancyContentDrawerID = Math.floor(Math.random() * Date.now()).toString(), this.maxHeight = "100%";
   }
   firstUpdated() {
-    et(v(window, "resize"), v(window, m.ContentDrawerResize)).pipe(xt(!0), C(() => {
-    }), w(() => this.clientWidth ? this.clientWidth : window.innerWidth), w((t) => t >= this.minWidth.main + this.minWidth.sheet), V(100), C(() => {
+    J(g(window, "resize"), g(window, m.ContentDrawerResize)).pipe(ut(!0), $(() => {
+    }), f(() => this.clientWidth ? this.clientWidth : window.innerWidth), f((t) => t >= this.minWidth.main + this.minWidth.sheet), q(100), $(() => {
       this.maxHeight = window.innerHeight - this.getOffsetTop(this) - 32 + "px", this.style.setProperty("max-height", this.maxHeight);
-    }), L(), y(this.disconnecting)).subscribe((t) => {
+    }), K(), p(this.disconnecting)).subscribe((t) => {
       t ? (this.mode = "push", this.open = "open") : (this.mode = "overlay", this.open = "close");
-    }), v(window, m.ContentDrawerToggle).pipe(C((t) => {
+    }), g(window, m.ContentDrawerToggle).pipe($((t) => {
       t.stopPropagation();
-    }), w((t) => t.detail.state), y(this.disconnecting)).subscribe((t) => {
+    }), f((t) => t.detail.state), p(this.disconnecting)).subscribe((t) => {
       this.open = t;
-    }), v(window, "schmancy-content-drawer-render").pipe(C((t) => {
+    }), g(window, "schmancy-content-drawer-render").pipe($((t) => {
       t.stopPropagation();
-    }), w((t) => t.detail), y(this.disconnecting)).subscribe(({ component: t, title: e }) => {
-      this.mode === "push" ? (lt.push({ area: this.schmancyContentDrawerID, component: "empty", historyStrategy: "silent" }), lt.push({ area: this.schmancyContentDrawerID, component: t, historyStrategy: "silent" })) : (this.mode = "overlay") && Z.open({ component: t, uid: this.schmancyContentDrawerID, title: e });
+    }), f((t) => t.detail), p(this.disconnecting)).subscribe(({ component: t, title: e }) => {
+      this.mode === "push" ? (it.push({ area: this.schmancyContentDrawerID, component: "empty", historyStrategy: "silent" }), it.push({ area: this.schmancyContentDrawerID, component: t, historyStrategy: "silent" })) : (this.mode = "overlay") && V.open({ component: t, uid: this.schmancyContentDrawerID, title: e });
     });
   }
   getOffsetTop(t) {
@@ -365,7 +248,7 @@ let S = class extends k(u`
     return e;
   }
   render() {
-    return this.mode && this.open ? l`
+    return this.mode && this.open ? c`
 			<schmancy-grid
 				cols=${this.mode === "overlay" ? "1fr" : "auto 1fr"}
 				rows="1fr"
@@ -375,15 +258,15 @@ let S = class extends k(u`
 			>
 				<slot></slot>
 			</schmancy-grid>
-		` : mt;
+		` : at;
   }
 };
-E([M({ context: rt })], S.prototype, "minWidth", 2), E([M({ context: gt }), c()], S.prototype, "open", 2), E([M({ context: st }), d()], S.prototype, "mode", 2), E([M({ context: ft })], S.prototype, "schmancyContentDrawerID", 2), E([M({ context: ot })], S.prototype, "maxHeight", 2), E([ut({ flatten: !0 })], S.prototype, "assignedElements", 2), S = E([h("schmancy-content-drawer")], S);
-var Kt = Object.defineProperty, Vt = Object.getOwnPropertyDescriptor, X = (t, e, o, r) => {
-  for (var n, s = r > 1 ? void 0 : r ? Vt(e, o) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (s = (r ? n(e, o, s) : n(s)) || s);
-  return r && s && Kt(e, o, s), s;
+k([M({ context: Z })], S.prototype, "minWidth", 2), k([M({ context: ht }), l()], S.prototype, "open", 2), k([M({ context: L }), d()], S.prototype, "mode", 2), k([M({ context: pt })], S.prototype, "schmancyContentDrawerID", 2), k([M({ context: Q })], S.prototype, "maxHeight", 2), k([lt({ flatten: !0 })], S.prototype, "assignedElements", 2), S = k([v("schmancy-content-drawer")], S);
+var Pt = Object.defineProperty, It = Object.getOwnPropertyDescriptor, N = (t, e, r, o) => {
+  for (var n, s = o > 1 ? void 0 : o ? It(e, r) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (s = (o ? n(e, r, s) : n(s)) || s);
+  return o && s && Pt(e, r, s), s;
 };
-let I = class extends k(u`
+let P = class extends z(O`
 	:host {
 		display: block;
 		overflow: hidden;
@@ -397,7 +280,7 @@ let I = class extends k(u`
   }
   render() {
     const t = { minWidth: `${this.minWidth}px`, maxHeight: this.maxHeight };
-    return l`
+    return c`
 			<section class="relative inset-0 h-full">
 				<schmancy-grid
 					class="h-full relative overflow-scroll"
@@ -411,17 +294,17 @@ let I = class extends k(u`
 						<slot></slot>
 					</section>
 				</schmancy-grid>
-				${Q(this.mode === "push", () => l` <schmancy-divider class="absolute right-0 top-0" orientation="vertical"></schmancy-divider>`)}
+				${Y(this.mode === "push", () => c` <schmancy-divider class="absolute right-0 top-0" orientation="vertical"></schmancy-divider>`)}
 			</section>
 		`;
   }
 };
-X([c({ type: Number })], I.prototype, "minWidth", 2), X([p({ context: rt, subscribe: !0 })], I.prototype, "drawerMinWidth", 2), X([p({ context: st, subscribe: !0 }), d()], I.prototype, "mode", 2), X([p({ context: ot, subscribe: !0 }), d()], I.prototype, "maxHeight", 2), I = X([h("schmancy-content-drawer-main")], I);
-var Ft = Object.defineProperty, Yt = Object.getOwnPropertyDescriptor, x = (t, e, o, r) => {
-  for (var n, s = r > 1 ? void 0 : r ? Yt(e, o) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (s = (r ? n(e, o, s) : n(s)) || s);
-  return r && s && Ft(e, o, s), s;
+N([l({ type: Number })], P.prototype, "minWidth", 2), N([h({ context: Z, subscribe: !0 })], P.prototype, "drawerMinWidth", 2), N([h({ context: L, subscribe: !0 }), d()], P.prototype, "mode", 2), N([h({ context: Q, subscribe: !0 }), d()], P.prototype, "maxHeight", 2), P = N([v("schmancy-content-drawer-main")], P);
+var Nt = Object.defineProperty, Tt = Object.getOwnPropertyDescriptor, w = (t, e, r, o) => {
+  for (var n, s = o > 1 ? void 0 : o ? Tt(e, r) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (s = (o ? n(e, r, s) : n(s)) || s);
+  return o && s && Nt(e, r, s), s;
 };
-let b = class extends k(u`
+let y = class extends z(O`
 	:host {
 		overflow: scroll;
 	}
@@ -430,19 +313,19 @@ let b = class extends k(u`
     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(m.ContentDrawerResize, { bubbles: !0, composed: !0 }))) : (t.has("state") || t.has("mode")) && (this.mode === "overlay" ? this.state === "close" ? this.closeAll() : this.state : this.mode === "push" && (Z.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(m.ContentDrawerResize, { bubbles: !0, composed: !0 }))) : (t.has("state") || t.has("mode")) && (this.mode === "overlay" ? this.state === "close" ? this.closeAll() : this.state : this.mode === "push" && (V.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() {
-    et(at(this.closeModalSheet()), at(this.closeSheet())).pipe(y(this.disconnecting)).subscribe();
+    J(st(this.closeModalSheet()), st(this.closeSheet())).pipe(p(this.disconnecting)).subscribe();
   }
   closeModalSheet() {
-    return F(!0).pipe(C(() => Z.dismiss(this.schmancyContentDrawerID)));
+    return B(!0).pipe($(() => V.dismiss(this.schmancyContentDrawerID)));
   }
   closeSheet() {
-    return new $t((t) => {
+    return new bt((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();
       };
@@ -450,7 +333,7 @@ let b = class extends k(u`
   }
   render() {
     const t = { block: this.mode === "push", "absolute z-50": this.mode === "overlay", "opacity-1": this.mode === "overlay" && this.state === "open" }, e = { minWidth: `${this.minWidth}px`, maxHeight: this.maxHeight };
-    return l`
+    return c`
 			<section id="sheet" class="${this.classMap(t)}" style=${this.styleMap(e)}>
 				<schmancy-area name="${this.schmancyContentDrawerID}">
 					<slot name="placeholder"></slot>
@@ -459,10 +342,10 @@ let b = class extends k(u`
 		`;
   }
 };
-x([c({ type: Number })], b.prototype, "minWidth", 2), x([p({ context: st, subscribe: !0 }), d()], b.prototype, "mode", 2), x([p({ context: gt, subscribe: !0 }), d()], b.prototype, "state", 2), x([p({ context: ft })], b.prototype, "schmancyContentDrawerID", 2), x([J("#sheet")], b.prototype, "sheet", 2), x([ut({ flatten: !0, slot: void 0 })], b.prototype, "defaultSlot", 2), x([p({ context: rt, subscribe: !0 })], b.prototype, "drawerMinWidth", 2), x([p({ context: ot, subscribe: !0 }), d()], b.prototype, "maxHeight", 2), b = x([h("schmancy-content-drawer-sheet")], b);
-const Gt = new class {
+w([l({ type: Number })], y.prototype, "minWidth", 2), w([h({ context: L, subscribe: !0 }), d()], y.prototype, "mode", 2), w([h({ context: ht, subscribe: !0 }), d()], y.prototype, "state", 2), w([h({ context: pt })], y.prototype, "schmancyContentDrawerID", 2), w([F("#sheet")], y.prototype, "sheet", 2), w([lt({ flatten: !0, slot: void 0 })], y.prototype, "defaultSlot", 2), w([h({ context: Z, subscribe: !0 })], y.prototype, "drawerMinWidth", 2), w([h({ context: Q, subscribe: !0 }), d()], y.prototype, "maxHeight", 2), y = w([v("schmancy-content-drawer-sheet")], y);
+const Xt = new class {
   constructor() {
-    this.$drawer = new tt(), this.$drawer.pipe(V(10)).subscribe((t) => {
+    this.$drawer = new G(), this.$drawer.pipe(q(10)).subscribe((t) => {
       t.state ? window.dispatchEvent(new CustomEvent(m.NavDrawer_toggle, { detail: { state: "open" }, bubbles: !0, composed: !0 })) : window.dispatchEvent(new CustomEvent(m.NavDrawer_toggle, { detail: { state: "close" }, bubbles: !0, composed: !0 }));
     });
   }
@@ -472,12 +355,12 @@ const Gt = new class {
   close(t) {
     this.$drawer.next({ self: t, state: !1 });
   }
-}(), ds = Gt, it = P("push"), nt = P("close");
-var Jt = Object.defineProperty, Lt = Object.getOwnPropertyDescriptor, q = (t, e, o, r) => {
-  for (var n, s = r > 1 ? void 0 : r ? Lt(e, o) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (s = (r ? n(e, o, s) : n(s)) || s);
-  return r && s && Jt(e, o, s), s;
+}(), ts = Xt, tt = j("push"), et = j("close");
+var _t = Object.defineProperty, At = Object.getOwnPropertyDescriptor, _ = (t, e, r, o) => {
+  for (var n, s = o > 1 ? void 0 : o ? At(e, r) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (s = (o ? n(e, r, s) : n(s)) || s);
+  return o && s && _t(e, r, s), s;
 };
-let _ = class extends T(u`
+let T = class extends dt(O`
 	:host {
 		display: block;
 	}
@@ -487,7 +370,7 @@ let _ = class extends T(u`
   }
   render() {
     const t = { "block left-3  z-50": this.sidebarMode === "overlay", hidden: this.sidebarMode === "push" };
-    return l`
+    return c`
 			<schmancy-grid
 				cols=${this.sidebarMode === "overlay" && this.toggler ? "auto 1fr" : "1fr"}
 				flow="col"
@@ -495,14 +378,14 @@ let _ = class extends T(u`
 				gap="sm"
 				align="center"
 			>
-				${Q(this.sidebarMode === "overlay" && this.toggler, () => l`<slot name="toggler">
+				${Y(this.sidebarMode === "overlay" && this.toggler, () => c`<slot name="toggler">
 							<div class="${this.classMap(t)}">
 								<schmancy-icon-button
 									@click=${() => {
       this.dispatchEvent(new CustomEvent(m.NavDrawer_toggle, { detail: { state: this.sidebarOpen === "open" ? "close" : "open" }, bubbles: !0, composed: !0 }));
     }}
 								>
-									${Q(this.sidebarOpen === "close", () => l`menu`, () => l`menu_open`)}
+									${Y(this.sidebarOpen === "close", () => c`menu`, () => c`menu_open`)}
 								</schmancy-icon-button>
 							</div>
 						</slot>`)}
@@ -512,9 +395,9 @@ let _ = class extends T(u`
 		`;
   }
 };
-q([p({ context: it, subscribe: !0 }), d()], _.prototype, "sidebarMode", 2), q([p({ context: nt, subscribe: !0 }), d()], _.prototype, "sidebarOpen", 2), q([c({ type: Boolean })], _.prototype, "toggler", 2), _ = q([h("schmancy-nav-drawer-appbar")], _);
-var Qt = Object.getOwnPropertyDescriptor;
-let pt = class extends k(u`
+_([h({ context: tt, subscribe: !0 }), d()], T.prototype, "sidebarMode", 2), _([h({ context: et, subscribe: !0 }), d()], T.prototype, "sidebarOpen", 2), _([l({ type: Boolean })], T.prototype, "toggler", 2), T = _([v("schmancy-nav-drawer-appbar")], T);
+var Ht = Object.getOwnPropertyDescriptor;
+let ot = class extends z(O`
 	:host {
 		display: block;
 		position: relative;
@@ -523,23 +406,23 @@ let pt = class extends k(u`
 	}
 `) {
   connectedCallback() {
-    super.connectedCallback(), v(this, "scroll").pipe(y(this.disconnecting)).subscribe((t) => {
+    super.connectedCallback(), g(this, "scroll").pipe(p(this.disconnecting)).subscribe((t) => {
       this.parentElement.dispatchEvent(new CustomEvent("scroll", { detail: t, bubbles: !0, composed: !0 }));
     });
   }
   render() {
-    return l` <slot></slot> `;
+    return c` <slot></slot> `;
   }
 };
-pt = ((t, e, o, r) => {
-  for (var n, s = r > 1 ? void 0 : r ? Qt(e, o) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (s = n(s) || s);
+ot = ((t, e, r, o) => {
+  for (var n, s = o > 1 ? void 0 : o ? Ht(e, r) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (s = n(s) || s);
   return s;
-})([h("schmancy-nav-drawer-content")], pt);
-var Zt = Object.defineProperty, te = Object.getOwnPropertyDescriptor, N = (t, e, o, r) => {
-  for (var n, s = r > 1 ? void 0 : r ? te(e, o) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (s = (r ? n(e, o, s) : n(s)) || s);
-  return r && s && Zt(e, o, s), s;
+})([v("schmancy-nav-drawer-content")], ot);
+var Rt = Object.defineProperty, qt = Object.getOwnPropertyDescriptor, I = (t, e, r, o) => {
+  for (var n, s = o > 1 ? void 0 : o ? qt(e, r) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (s = (o ? n(e, r, s) : n(s)) || s);
+  return o && s && Rt(e, r, s), s;
 };
-let f = class extends k(u`
+let b = class extends z(O`
 	:host {
 		display: flex;
 		flex-grow: 1;
@@ -556,40 +439,40 @@ let f = class extends k(u`
     super(...arguments), this.fullscreen = !1, this.breakpoint = "md", this._initialized = !1;
   }
   firstUpdated() {
-    this.updateState(window.innerWidth), this._initialized = !0, this.setAttribute("data-ready", ""), v(window, "resize").pipe(w((t) => t.target.innerWidth), w((t) => t >= f.BREAKPOINTS[this.breakpoint]), L(), V(100), y(this.disconnecting)).subscribe((t) => {
+    this.updateState(window.innerWidth), this._initialized = !0, this.setAttribute("data-ready", ""), g(window, "resize").pipe(f((t) => t.target.innerWidth), f((t) => t >= b.BREAKPOINTS[this.breakpoint]), K(), q(100), p(this.disconnecting)).subscribe((t) => {
       t ? (this.mode = "push", this.open = "open") : (this.mode = "overlay", this.open = "close");
-    }), v(window, m.NavDrawer_toggle).pipe(C((t) => {
+    }), g(window, m.NavDrawer_toggle).pipe($((t) => {
       t.stopPropagation();
-    }), w((t) => t.detail.state), L(), y(this.disconnecting), V(10)).subscribe((t) => {
+    }), f((t) => t.detail.state), K(), p(this.disconnecting), q(10)).subscribe((t) => {
       this.mode === "push" && t === "close" || (this.open = t);
     });
   }
   updateState(t) {
-    const e = t >= f.BREAKPOINTS[this.breakpoint];
+    const e = t >= b.BREAKPOINTS[this.breakpoint];
     this.mode = e ? "push" : "overlay", this.open = e ? "open" : "close";
   }
   render() {
-    return this._initialized ? l`
+    return this._initialized ? c`
 			<schmancy-grid
 				cols=${this.fullscreen ? "1fr" : "auto 1fr"}
 				rows="1fr"
 				flow="col"
 				justify="stretch"
 				align="stretch"
-				${Mt()}
+				${Dt()}
 			>
 				<slot></slot>
 			</schmancy-grid>
-		` : mt;
+		` : at;
   }
 };
-f.BREAKPOINTS = { sm: 640, md: 768, lg: 1024, xl: 1280 }, N([c({ type: Boolean })], f.prototype, "fullscreen", 2), N([c({ type: String, attribute: "breakpoint" })], f.prototype, "breakpoint", 2), N([M({ context: it }), d()], f.prototype, "mode", 2), N([M({ context: nt }), c()], f.prototype, "open", 2), N([d()], f.prototype, "_initialized", 2), f = N([h("schmancy-nav-drawer")], f);
-var ee = Object.defineProperty, se = Object.getOwnPropertyDescriptor, j = (t, e, o, r) => {
-  for (var n, s = r > 1 ? void 0 : r ? se(e, o) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (s = (r ? n(e, o, s) : n(s)) || s);
-  return r && s && ee(e, o, s), s;
+b.BREAKPOINTS = { sm: 640, md: 768, lg: 1024, xl: 1280 }, I([l({ type: Boolean })], b.prototype, "fullscreen", 2), I([l({ type: String, attribute: "breakpoint" })], b.prototype, "breakpoint", 2), I([M({ context: tt }), d()], b.prototype, "mode", 2), I([M({ context: et }), l()], b.prototype, "open", 2), I([d()], b.prototype, "_initialized", 2), b = I([v("schmancy-nav-drawer")], b);
+var Bt = Object.defineProperty, Ut = Object.getOwnPropertyDescriptor, W = (t, e, r, o) => {
+  for (var n, s = o > 1 ? void 0 : o ? Ut(e, r) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (s = (o ? n(e, r, s) : n(s)) || s);
+  return o && s && Bt(e, r, s), s;
 };
-const B = "cubic-bezier(0.5, 0.01, 0.25, 1)";
-let D = class extends k() {
+const A = "cubic-bezier(0.5, 0.01, 0.25, 1)";
+let D = class extends z() {
   constructor() {
     super(...arguments), this.width = "320px", this._initialized = !1;
   }
@@ -600,20 +483,20 @@ let D = class extends k() {
     this._initialized && (t.has("drawerState") || t.has("mode")) && (this.mode === "overlay" ? this.drawerState === "open" ? this.nav.style.transform !== "translateX(0)" && (this.openOverlay(), this.showNavDrawer()) : this.drawerState === "close" && this.nav.style.transform !== "translateX(-100%)" && (this.hideNavDrawer(), this.closeOverlay()) : this.mode === "push" && (this.nav.style.transform !== "translateX(0)" && this.showNavDrawer(), this.overlay.style.display !== "none" && this.closeOverlay()));
   }
   openOverlay() {
-    this.overlay.style.display = "block", this.overlay.animate([{ opacity: 0 }, { opacity: 0.4 }], { duration: 200, easing: B, fill: "forwards" });
+    this.overlay.style.display = "block", this.overlay.animate([{ opacity: 0 }, { opacity: 0.4 }], { duration: 200, easing: A, fill: "forwards" });
   }
   closeOverlay() {
-    this.overlay.animate([{ opacity: 0.4 }, { opacity: 0 }], { duration: 150, easing: B, fill: "forwards" }).onfinish = () => {
+    this.overlay.animate([{ opacity: 0.4 }, { opacity: 0 }], { duration: 150, easing: A, fill: "forwards" }).onfinish = () => {
       this.overlay.style.display = "none";
     };
   }
   showNavDrawer() {
-    this.nav.animate([{ transform: "translateX(-100%)" }, { transform: "translateX(0)" }], { duration: 200, easing: B, fill: "forwards" }).onfinish = () => {
+    this.nav.animate([{ transform: "translateX(-100%)" }, { transform: "translateX(0)" }], { duration: 200, easing: A, fill: "forwards" }).onfinish = () => {
       this.nav.style.transform = "translateX(0)";
     };
   }
   hideNavDrawer() {
-    this.nav.animate([{ transform: "translateX(0)" }, { transform: "translateX(-100%)" }], { duration: 200, easing: B, fill: "forwards" }).onfinish = () => {
+    this.nav.animate([{ transform: "translateX(0)" }, { transform: "translateX(-100%)" }], { duration: 200, easing: A, fill: "forwards" }).onfinish = () => {
       this.nav.style.transform = "translateX(-100%)";
     };
   }
@@ -622,46 +505,46 @@ let D = class extends k() {
   }
   render() {
     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 l`
+    return c`
 			<nav
 				style=${this.styleMap(e)}
 				class="${this.classMap({ ...t })}"
-				${W({ bgColor: i.sys.color.surface.container })}
+				${U({ bgColor: i.sys.color.surface.container })}
 			>
 				<slot></slot>
 			</nav>
 			<div
 				id="overlay"
-				${W({ bgColor: i.sys.color.scrim })}
+				${U({ bgColor: i.sys.color.scrim })}
 				@click=${this.handleOverlayClick}
 				class="${this.classMap({ "fixed inset-0 z-49 hidden": !0 })}"
 			></div>
 		`;
   }
 };
-j([p({ context: it, subscribe: !0 }), d()], D.prototype, "mode", 2), j([p({ context: nt, subscribe: !0 }), d()], D.prototype, "drawerState", 2), j([J("#overlay")], D.prototype, "overlay", 2), j([J("nav")], D.prototype, "nav", 2), j([c({ type: String })], D.prototype, "width", 2), j([d()], D.prototype, "_initialized", 2), D = j([h("schmancy-nav-drawer-navbar")], D);
-const vt = "whereAreYouRicky", wt = "hereMorty", U = new class {
+W([h({ context: tt, subscribe: !0 }), d()], D.prototype, "mode", 2), W([h({ context: et, subscribe: !0 }), d()], D.prototype, "drawerState", 2), W([F("#overlay")], D.prototype, "overlay", 2), W([F("nav")], D.prototype, "nav", 2), W([l({ type: String })], D.prototype, "width", 2), W([d()], D.prototype, "_initialized", 2), D = W([v("schmancy-nav-drawer-navbar")], D);
+const mt = "whereAreYouRicky", yt = "hereMorty", H = new class {
   constructor() {
-    this.activeTeleportations = /* @__PURE__ */ new Map(), this.flipRequests = new tt(), this.find = (t) => ct([v(window, wt).pipe(bt((e) => !!e.detail.component.uuid && !!t.id && e.detail.component.id === t.id && e.detail.component.uuid !== t.uuid), w((e) => e.detail.component), Ct(1)), F(t).pipe(C(() => {
-      window.dispatchEvent(new CustomEvent(vt, { detail: { id: t.id, callerID: t.uuid } }));
-    }))]).pipe(w(([e]) => e), Ot(0)), this.flip = (t) => {
-      const { from: e, to: o } = t, r = o.element.style.zIndex;
-      o.element.style.transformOrigin = "top left", o.element.style.setProperty("visibility", "visible"), o.element.style.zIndex = "1000";
-      const n = [{ 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(n, { duration: 250, delay: 10, easing: "cubic-bezier(0.455, 0.03, 0.515, 0.955)" }).onfinish = () => {
-        o.element.style.zIndex = r, o.element.style.transformOrigin = "";
+    this.activeTeleportations = /* @__PURE__ */ new Map(), this.flipRequests = new G(), this.find = (t) => rt([g(window, yt).pipe(ct((e) => !!e.detail.component.uuid && !!t.id && e.detail.component.id === t.id && e.detail.component.uuid !== t.uuid), f((e) => e.detail.component), gt(1)), B(t).pipe($(() => {
+      window.dispatchEvent(new CustomEvent(mt, { detail: { id: t.id, callerID: t.uuid } }));
+    }))]).pipe(f(([e]) => e), ft(0)), this.flip = (t) => {
+      const { from: e, to: r } = t, o = r.element.style.zIndex;
+      r.element.style.transformOrigin = "top left", r.element.style.setProperty("visibility", "visible"), r.element.style.zIndex = "1000";
+      const n = [{ transform: `translate(${e.rect.left - r.rect.left}px, ${e.rect.top - r.rect.top}px) scale(${e.rect.width / r.rect.width}, ${e.rect.height / r.rect.height})` }, { transform: "translate(0, 0) scale(1, 1)" }];
+      r.element.animate(n, { duration: 250, delay: 10, easing: "cubic-bezier(0.455, 0.03, 0.515, 0.955)" }).onfinish = () => {
+        r.element.style.zIndex = o, r.element.style.transformOrigin = "";
       };
-    }, this.flipRequests.pipe(St(1), w((t) => t.map(({ from: e, to: o, host: r }, n) => ({ from: e, to: o, host: r, i: n }))), Dt((t) => ct(t.map((e) => F(this.flip(e)))))).subscribe();
+    }, this.flipRequests.pipe(vt(1), f((t) => t.map(({ from: e, to: r, host: o }, n) => ({ from: e, to: r, host: o, i: n }))), wt((t) => rt(t.map((e) => B(this.flip(e)))))).subscribe();
   }
 }();
-function yt(t) {
-  return kt(50).pipe(Wt(() => t.getBoundingClientRect()), Pt((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));
+function nt(t) {
+  return xt(50).pipe(Ot(() => t.getBoundingClientRect()), zt((e, r) => e.width === r.width && e.height === r.height && e.top === r.top && e.right === r.right && e.bottom === r.bottom && e.left === r.left), Et(1));
 }
-var oe = Object.defineProperty, re = Object.getOwnPropertyDescriptor, K = (t, e, o, r) => {
-  for (var n, s = r > 1 ? void 0 : r ? re(e, o) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (s = (r ? n(e, o, s) : n(s)) || s);
-  return r && s && oe(e, o, s), s;
+var Ft = Object.defineProperty, Kt = Object.getOwnPropertyDescriptor, R = (t, e, r, o) => {
+  for (var n, s = o > 1 ? void 0 : o ? Kt(e, r) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (s = (o ? n(e, r, s) : n(s)) || s);
+  return o && s && Ft(e, r, s), s;
 };
-let A = class extends k(u``) {
+let X = class extends z(O``) {
   constructor() {
     super(...arguments), this.uuid = Math.floor(Math.random() * Date.now()), this.delay = 0, this.debugging = !1;
   }
@@ -670,82 +553,82 @@ let A = class extends k(u``) {
   }
   connectedCallback() {
     if (this.id === void 0) throw new Error("id is required");
-    super.connectedCallback(), et(v(window, Et).pipe(C({ next: () => {
-      this.dispatchEvent(new CustomEvent(jt, { detail: { component: this }, bubbles: !0, composed: !0 }));
-    } })), v(window, vt).pipe(C({ 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(y(this.disconnecting)).subscribe();
+    super.connectedCallback(), J(g(window, Ct).pipe($({ next: () => {
+      this.dispatchEvent(new CustomEvent(St, { detail: { component: this }, bubbles: !0, composed: !0 }));
+    } })), g(window, mt).pipe($({ next: (t) => {
+      t.detail.id === this.id && this.uuid && t.detail.callerID !== this.uuid && this.dispatchEvent(new CustomEvent(yt, { detail: { component: this }, bubbles: !0, composed: !0 }));
+    } }))).pipe(p(this.disconnecting)).subscribe();
   }
   async firstUpdated() {
-    F(U.activeTeleportations.get(this.id)).pipe(bt((t) => !!t), y(this.disconnecting), zt()).subscribe({ next: (t) => {
-      this.style.setProperty("visibility", "hidden"), yt(this).pipe(y(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 });
+    B(H.activeTeleportations.get(this.id)).pipe(ct((t) => !!t), p(this.disconnecting), $t()).subscribe({ next: (t) => {
+      this.style.setProperty("visibility", "hidden"), nt(this).pipe(p(this.disconnecting)).subscribe({ next: (e) => {
+        H.activeTeleportations.set(this.id, e), H.flipRequests.next({ from: { rect: t }, to: { rect: e, element: this._slottedChildren[0] }, host: this });
       } });
     }, error: () => {
-      this.style.setProperty("visibility", "visible"), yt(this).pipe(y(this.disconnecting)).subscribe({ next: (t) => {
-        U.activeTeleportations.set(this.id, t);
+      this.style.setProperty("visibility", "visible"), nt(this).pipe(p(this.disconnecting)).subscribe({ next: (t) => {
+        H.activeTeleportations.set(this.id, t);
       } });
     }, complete: () => {
     } });
   }
   render() {
-    return l`<slot></slot>`;
+    return c`<slot></slot>`;
   }
 };
-K([c({ type: Number, reflect: !0 })], A.prototype, "uuid", 2), K([c({ type: String })], A.prototype, "id", 2), K([c({ type: Number })], A.prototype, "delay", 2), A = K([h("schmancy-teleport")], A);
-var ie = Object.defineProperty, ne = Object.getOwnPropertyDescriptor, $ = (t, e, o, r) => {
-  for (var n, s = r > 1 ? void 0 : r ? ne(e, o) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (s = (r ? n(e, o, s) : n(s)) || s);
-  return r && s && ie(e, o, s), s;
+R([l({ type: Number, reflect: !0 })], X.prototype, "uuid", 2), R([l({ type: String })], X.prototype, "id", 2), R([l({ type: Number })], X.prototype, "delay", 2), X = R([v("schmancy-teleport")], X);
+var Yt = Object.defineProperty, Vt = Object.getOwnPropertyDescriptor, x = (t, e, r, o) => {
+  for (var n, s = o > 1 ? void 0 : o ? Vt(e, r) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (s = (o ? n(e, r, s) : n(s)) || s);
+  return o && s && Yt(e, r, s), s;
 };
-let g = class extends k() {
+let u = class extends z() {
   constructor() {
     super(...arguments), this.initials = "", this.src = "", this.icon = "", this.size = "md", this.color = "primary", this.shape = "circle", this.bordered = !1, this.status = "none";
   }
   render() {
     let t;
-    t = this.src ? l`<img class="w-full h-full object-cover" src="${this.src}" alt="Avatar" />` : this.initials ? l`<span class="text-center font-medium">${this.initials.substring(0, 2).toUpperCase()}</span>` : this.icon ? l`<schmancy-icon>${this.icon}</schmancy-icon>` : l`<schmancy-icon>person</schmancy-icon>`;
-    const e = { "relative flex items-center justify-center overflow-hidden": !0, [{ xs: "w-6 h-6 text-xs", sm: "w-8 h-8 text-sm", md: "w-10 h-10 text-base", lg: "w-12 h-12 text-lg", xl: "w-16 h-16 text-xl" }[this.size]]: !0, [{ circle: "rounded-full", square: "rounded-md" }[this.shape]]: !0, "border-2 border-surface-container": this.bordered }, o = this.getColorAttributes();
-    return l`
-			<div class="${this.classMap(e)}" ${o}>
+    t = this.src ? c`<img class="w-full h-full object-cover" src="${this.src}" alt="Avatar" />` : this.initials ? c`<span class="text-center font-medium">${this.initials.substring(0, 2).toUpperCase()}</span>` : this.icon ? c`<schmancy-icon>${this.icon}</schmancy-icon>` : c`<schmancy-icon>person</schmancy-icon>`;
+    const e = { "relative flex items-center justify-center overflow-hidden": !0, [{ xs: "w-6 h-6 text-xs", sm: "w-8 h-8 text-sm", md: "w-10 h-10 text-base", lg: "w-12 h-12 text-lg", xl: "w-16 h-16 text-xl" }[this.size]]: !0, [{ circle: "rounded-full", square: "rounded-md" }[this.shape]]: !0, "border-2 border-surface-container": this.bordered }, r = this.getColorAttributes();
+    return c`
+			<div class="${this.classMap(e)}" ${r}>
 				${t} ${this.status !== "none" ? this.renderStatusIndicator() : ""}
 			</div>
 		`;
   }
   getColorAttributes() {
     const t = { primary: { bgColor: i.sys.color.primary.container, color: i.sys.color.primary.onContainer }, secondary: { bgColor: i.sys.color.secondary.container, color: i.sys.color.secondary.onContainer }, tertiary: { bgColor: i.sys.color.tertiary.container, color: i.sys.color.tertiary.onContainer }, success: { bgColor: i.sys.color.success.container, color: i.sys.color.success.onContainer }, error: { bgColor: i.sys.color.error.container, color: i.sys.color.error.onContainer }, neutral: { bgColor: i.sys.color.surface.container, color: i.sys.color.surface.on } };
-    return W(t[this.color]);
+    return U(t[this.color]);
   }
   renderStatusIndicator() {
     const t = { online: i.sys.color.success.default, offline: i.sys.color.surface.onVariant, busy: i.sys.color.error.default, away: i.sys.color.tertiary.default }, e = { "absolute bottom-0 right-0 rounded-full border-2 border-surface-default": !0, [{ xs: "w-1.5 h-1.5", sm: "w-2 h-2", md: "w-2.5 h-2.5", lg: "w-3 h-3", xl: "w-4 h-4" }[this.size]]: !0 };
-    return l`
+    return c`
 			<div class="${this.classMap(e)}" style="background-color: ${t[this.status]};"></div>
 		`;
   }
 };
-$([c({ type: String })], g.prototype, "initials", 2), $([c({ type: String })], g.prototype, "src", 2), $([c({ type: String })], g.prototype, "icon", 2), $([c({ type: String })], g.prototype, "size", 2), $([c({ type: String })], g.prototype, "color", 2), $([c({ type: String })], g.prototype, "shape", 2), $([c({ type: Boolean })], g.prototype, "bordered", 2), $([c({ type: String })], g.prototype, "status", 2), g = $([h("schmancy-avatar")], g);
+x([l({ type: String })], u.prototype, "initials", 2), x([l({ type: String })], u.prototype, "src", 2), x([l({ type: String })], u.prototype, "icon", 2), x([l({ type: String })], u.prototype, "size", 2), x([l({ type: String })], u.prototype, "color", 2), x([l({ type: String })], u.prototype, "shape", 2), x([l({ type: Boolean })], u.prototype, "bordered", 2), x([l({ type: String })], u.prototype, "status", 2), u = x([v("schmancy-avatar")], u);
 export {
-  ds as $,
-  wt as H,
-  O as S,
-  vt as W,
-  st as a,
-  gt as b,
-  ft as c,
-  ot as d,
-  rt as e,
+  ts as $,
+  yt as H,
+  C as S,
+  mt as W,
+  L as a,
+  ht as b,
+  pt as c,
+  Q as d,
+  Z as e,
   S as f,
-  I as g,
-  b as h,
-  Gt as i,
-  _ as j,
-  pt as k,
-  it as l,
-  nt as m,
-  f as n,
+  P as g,
+  y as h,
+  Xt as i,
+  T as j,
+  ot as k,
+  tt as l,
+  et as m,
+  b as n,
   D as o,
-  A as p,
-  g as q,
-  hs as s,
-  U as t
+  X as p,
+  u as q,
+  Ze as s,
+  H as t
 };
-//# sourceMappingURL=avatar-m6kOcWq2.js.map
+//# sourceMappingURL=avatar-WaHuf8DW.js.map