@mhmo91/schmancy 0.5.17 → 0.5.19

package/dist/avatar-BAaUCxc-.js

@@ -0,0 +1,895 @@
+import { css as w, html as c, nothing as ft } from "lit";
+import { property as l, customElement as p, state as h, queryAssignedElements as gt, query as tt } from "lit/decorators.js";
+import { Subject as ot, merge as Q, fromEvent as d, startWith as Ot, map as v, debounceTime as G, tap as z, distinctUntilChanged as et, takeUntil as y, from as dt, of as J, Observable as It, BehaviorSubject as vt, timer as zt, zip as pt, filter as wt, take as Mt, timeout as jt, bufferTime as Pt, concatMap as Wt, interval as Ht, throwIfEmpty as Lt } from "rxjs";
+import "./animated-text-DbBKOAWI.js";
+import { a as ut, F as At, H as Rt } from "./area.component-eV-v6J5C.js";
+import "./autocomplete-CTQ6eqYl.js";
+import "lit/directives/class-map.js";
+import "lit/directives/style-map.js";
+import { T as Z } from "./tailwind.mixin-Dj-xh5c5.js";
+import { c as M, f as Nt } from "./ripple-Cy-nvO8W.js";
+import "lit/directives/guard.js";
+import "./boat-CQyUVpLW.js";
+import "./spinner-BSaeqgVi.js";
+import "./icon-button-BSCcuC7U.js";
+import "./media-Xr5pO0WU.js";
+import "./checkbox-7annHqhF.js";
+import "./suggestion-chip-Ca9HEISE.js";
+import "./input-chip-CPNF4szF.js";
+import "./code-preview-Y783aZ7J.js";
+import "./payment-card-form-B1uZ9JUa.js";
+import { SchmancyEvents as m } from "./types.js";
+import { n as A, e as L } from "./provide-tcktw8xB.js";
+import { $ as j } from "./litElement.mixin-7HEBIRUp.js";
+import { c as u } from "./consume-5D1qfVWM.js";
+import "./date-range-BtFn7iGs.js";
+import "./date-range-inline-BnGPY5ZY.js";
+import "./delay-DafLdRaR.js";
+import "./details-89R5QI1S.js";
+import "./dialog-content-CGt4hZZn.js";
+import "./dialog-service-CyQzm5qE.js";
+import "./divider-dTggJNS0.js";
+import "./dropdown-content-Bty4mF1A.js";
+import "./timezone-ikqEpkrq.js";
+import "./form-DdQgacXw.js";
+import "./icon-CYqOQBoE.js";
+import "./input-CNs7L8A9.js";
+import "./flex-CYF9ejQL.js";
+import "./list-Cp-TE18p.js";
+import "./email-recipients-Tb0UBtjf.js";
+import "./map-CaTzsyI7.js";
+import "./menu-C-Lvh3cn.js";
+import { when as st } from "lit/directives/when.js";
+import "./navigation-rail-item-CZKWN1Ki.js";
+import "./notification-service-36m9Setj.js";
+import "./option-DwEBerwR.js";
+import "./progress-B3hQmGMa.js";
+import "./radio-button-DDE3kwPV.js";
+import "./index-CW6PhEkx.js";
+import "./select-BKkGETee.js";
+import "./sheet-_Nwjk8tC.js";
+import { s as it } from "./sheet.service-lXqUf6n5.js";
+import "./slider-BawxkW-m.js";
+import "./schmancy-steps-container-Bk6YDDXz.js";
+import "./context-object-u5gBaozZ.js";
+import { tap as F, takeUntil as B, filter as V, throttleTime as qt, map as xt, pairwise as Tt, distinctUntilChanged as _t, take as Bt } from "rxjs/operators";
+import "./surface-DssJvvqY.js";
+import "./table-DcgdSj1D.js";
+import "./tabs-compatibility-yIZW7NeR.js";
+import "./textarea-BQ94zdoX.js";
+import "./theme.component-DcPhAbxK.js";
+import "./theme-button-CKt6f6kw.js";
+import "./tooltip-DQeBYmkT.js";
+import "./tree-BL71j34m.js";
+import "./typewriter-KPl30p8k.js";
+import "./typography-D5Mf_MlW.js";
+import { S as r } from "./theme.interface-C5Kj6WjD.js";
+var Xt = Object.defineProperty, Ut = Object.getOwnPropertyDescriptor, I = (t, e, s, o) => {
+  for (var n, i = o > 1 ? void 0 : o ? Ut(e, s) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (i = (o ? n(e, s, i) : n(i)) || i);
+  return o && i && Xt(e, s, i), i;
+};
+let S = class extends Z(w`
+	:host {
+		display: inline-flex;
+	}
+
+	/* Enhanced pulse animation for better attention-getting */
+	@keyframes elegant-pulse {
+		0%, 100% {
+			opacity: 1;
+		}
+		50% {
+			opacity: 0.85;
+		}
+	}
+
+	.animate-pulse {
+		animation: elegant-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
+	}
+`) {
+  constructor() {
+    super(...arguments), this.color = "primary", this.size = "md", this.shape = "pill", this.outlined = !1, this.icon = "", this.pulse = !1;
+  }
+  getSizeClasses() {
+    switch (this.size) {
+      case "xs":
+        return "text-xs py-0.75 px-1.5 gap-0.5 leading-none";
+      case "sm":
+        return "text-xs py-1.5 px-2.5 gap-0.5 tracking-wide leading-none";
+      case "lg":
+        return "text-base py-2 px-4 gap-1 tracking-wide";
+      default:
+        return "text-sm py-1.5 px-3 gap-0.5";
+    }
+  }
+  getShapeClasses() {
+    switch (this.shape) {
+      case "square":
+        return "rounded";
+      case "rounded":
+        return "rounded-md";
+      default:
+        return "rounded-full";
+    }
+  }
+  getIconSize() {
+    switch (this.size) {
+      case "xs":
+        return "11px";
+      case "sm":
+        return "13px";
+      case "lg":
+        return "18px";
+      default:
+        return "15px";
+    }
+  }
+  getExoticStyles() {
+    const t = {};
+    return this.size === "lg" && (t.letterSpacing = "0.03em", t.fontWeight = "500"), this.size === "sm" && (t.letterSpacing = "0.02em"), t;
+  }
+  getColorStyles() {
+    return { primary: { bg: this.outlined ? "transparent" : `color-mix(in srgb, ${r.sys.color.primary.container} 92%, ${r.sys.color.primary.default} 8%)`, text: this.outlined ? r.sys.color.primary.default : r.sys.color.primary.onContainer, border: this.outlined ? `color-mix(in srgb, ${r.sys.color.primary.default} 90%, ${r.sys.color.surface.highest} 10%)` : void 0 }, secondary: { bg: this.outlined ? "transparent" : `color-mix(in srgb, ${r.sys.color.secondary.container} 95%, ${r.sys.color.secondary.default} 5%)`, text: this.outlined ? r.sys.color.secondary.default : r.sys.color.secondary.onContainer, border: this.outlined ? `color-mix(in srgb, ${r.sys.color.secondary.default} 85%, ${r.sys.color.surface.highest} 15%)` : void 0 }, tertiary: { bg: this.outlined ? "transparent" : `color-mix(in srgb, ${r.sys.color.tertiary.container} 94%, ${r.sys.color.tertiary.default} 6%)`, text: this.outlined ? r.sys.color.tertiary.default : r.sys.color.tertiary.onContainer, border: this.outlined ? `color-mix(in srgb, ${r.sys.color.tertiary.default} 88%, ${r.sys.color.surface.highest} 12%)` : void 0 }, success: { bg: this.outlined ? "transparent" : `color-mix(in srgb, ${r.sys.color.success.container} 90%, ${r.sys.color.success.default} 10%)`, text: this.outlined ? r.sys.color.success.default : r.sys.color.success.onContainer, border: this.outlined ? `color-mix(in srgb, ${r.sys.color.success.default} 85%, ${r.sys.color.surface.bright} 15%)` : void 0 }, warning: { bg: this.outlined ? "transparent" : `color-mix(in srgb, ${r.sys.color.tertiary.container} 85%, ${r.sys.color.tertiary.default} 15%)`, text: this.outlined ? r.sys.color.tertiary.default : r.sys.color.tertiary.onContainer, border: this.outlined ? `color-mix(in srgb, ${r.sys.color.tertiary.default} 90%, ${r.sys.color.surface.highest} 10%)` : void 0 }, error: { bg: this.outlined ? "transparent" : `color-mix(in srgb, ${r.sys.color.error.container} 92%, ${r.sys.color.error.default} 8%)`, text: this.outlined ? r.sys.color.error.default : r.sys.color.error.onContainer, border: this.outlined ? `color-mix(in srgb, ${r.sys.color.error.default} 88%, ${r.sys.color.surface.bright} 12%)` : void 0 }, neutral: { bg: this.outlined ? "transparent" : `color-mix(in srgb, ${r.sys.color.surface.high} 95%, ${r.sys.color.outline} 5%)`, text: this.outlined ? `color-mix(in srgb, ${r.sys.color.surface.on} 95%, ${r.sys.color.surface.default} 5%)` : r.sys.color.surface.on, border: this.outlined ? `color-mix(in srgb, ${r.sys.color.outline} 85%, ${r.sys.color.surface.highest} 15%)` : void 0 } }[this.color];
+  }
+  render() {
+    const t = this.getSizeClasses(), e = this.getShapeClasses(), s = this.getColorStyles(), o = this.getIconSize(), n = this.getExoticStyles(), i = { "inline-flex items-center justify-center font-medium": !0, "transition-all duration-200 ease-in-out": !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", "hover:brightness-95 hover:-translate-y-px": this.outlined, "hover:brightness-[0.98]": !this.outlined }, a = { borderColor: s.border, ...this.outlined ? { backdropFilter: "blur(4px)" } : {}, ...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(i)}"
+				style="${this.styleMap(a)}"
+				${M({ bgColor: s.bg, color: s.text })}
+			>
+				<!-- Icon slot or named icon -->
+				<slot name="icon">
+					${this.icon ? c`
+								<div part="icon" class="flex-shrink-0 flex items-center justify-center leading-none">
+									<schmancy-icon .size=${o} class="flex items-center justify-center">${this.icon}</schmancy-icon>
+								</div>
+							` : ""}
+				</slot>
+
+				<!-- Content with proper spacing from icon -->
+				<div part="content" class="flex items-center leading-none tracking-[0.01em] ${this.icon ? "ml-[0.38em]" : ""}">
+					<slot></slot>
+				</div>
+			</div>
+		`;
+  }
+};
+I([l({ type: String, reflect: !0 })], S.prototype, "color", 2), I([l({ type: String, reflect: !0 })], S.prototype, "size", 2), I([l({ type: String, reflect: !0 })], S.prototype, "shape", 2), I([l({ type: Boolean, reflect: !0 })], S.prototype, "outlined", 2), I([l({ type: String })], S.prototype, "icon", 2), I([l({ type: Boolean, reflect: !0 })], S.prototype, "pulse", 2), S = I([p("schmancy-badge")], S);
+let mt = class extends S {
+};
+mt = I([p("sch-badge")], mt);
+const Ds = new class {
+  constructor() {
+    this.$drawer = new ot(), this.lastComponent = null, 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 }))) : t.action === "push" && this.handlePush(t.ref, t.component);
+    });
+  }
+  dimiss(t) {
+    this.$drawer.next({ action: "dismiss", ref: t });
+  }
+  render(t, e, s) {
+    t.dispatchEvent(new CustomEvent("custom-event")), this.$drawer.next({ action: "render", ref: t, component: e, title: s });
+  }
+  async handlePush(t, e) {
+    let s;
+    if (typeof e == "string") s = document.createElement(e);
+    else if (e instanceof HTMLElement) s = e;
+    else {
+      if (typeof e != "function") return;
+      try {
+        const o = await e();
+        o && typeof o == "object" && "default" in o ? s = new o.default() : s = o instanceof HTMLElement ? o : new o();
+      } catch {
+        return;
+      }
+    }
+    this.lastComponent === s && "requestUpdate" in s && s.requestUpdate(), this.lastComponent = s, t.dispatchEvent(new CustomEvent(m.ContentDrawerToggle, { detail: { state: "open" }, bubbles: !0, composed: !0 })), t.dispatchEvent(new CustomEvent("schmancy-content-drawer-render", { detail: { component: s }, bubbles: !0, composed: !0 }));
+  }
+  push(t) {
+    this.$drawer.next({ action: "push", ref: window, component: t });
+  }
+}(), rt = A("push"), $t = A("close"), Ct = A(Math.floor(Math.random() * Date.now()).toString()), nt = A("100%"), at = A({});
+var Kt = Object.defineProperty, Yt = Object.getOwnPropertyDescriptor, P = (t, e, s, o) => {
+  for (var n, i = o > 1 ? void 0 : o ? Yt(e, s) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (i = (o ? n(e, s, i) : n(i)) || i);
+  return o && i && Kt(e, s, i), i;
+};
+let k = class extends j(w`
+	:host {
+		position: relative;
+		inset: 0;
+		display: block;
+		overflow: hidden;
+	}
+`) {
+  constructor() {
+    super(...arguments), this.minWidth = { main: 360, sheet: 576 }, this.schmancyContentDrawerID = Math.floor(Math.random() * Date.now()).toString(), this.maxHeight = "100%";
+  }
+  firstUpdated() {
+    Q(d(window, "resize"), d(window, m.ContentDrawerResize)).pipe(Ot(!0), v(() => this.clientWidth ? this.clientWidth : window.innerWidth), v((t) => t >= this.minWidth.main + this.minWidth.sheet), G(100), z(() => {
+      this.maxHeight = window.innerHeight - this.getOffsetTop(this) - 32 + "px", this.style.setProperty("max-height", this.maxHeight);
+    }), et(), y(this.disconnecting)).subscribe((t) => {
+      t ? (this.mode = "push", this.open = "open") : (this.mode = "overlay", this.open = "close");
+    }), d(window, m.ContentDrawerToggle).pipe(z((t) => {
+      t.stopPropagation();
+    }), v((t) => t.detail.state), y(this.disconnecting)).subscribe((t) => {
+      this.open = t;
+    }), d(window, "schmancy-content-drawer-render").pipe(z((t) => {
+      t.stopPropagation();
+    }), v((t) => t.detail), y(this.disconnecting)).subscribe(({ component: t, title: e }) => {
+      this.mode === "push" ? (ut.push({ area: this.schmancyContentDrawerID, component: "empty", historyStrategy: "silent" }), ut.push({ area: this.schmancyContentDrawerID, component: t, historyStrategy: "silent" })) : (this.mode = "overlay") && it.open({ component: t, uid: this.schmancyContentDrawerID, title: e });
+    });
+  }
+  getOffsetTop(t) {
+    let e = 0;
+    for (; t; ) e += t.offsetTop, t = t.offsetParent;
+    return e;
+  }
+  render() {
+    return this.mode && this.open ? c`
+			<schmancy-grid
+				cols=${this.mode === "overlay" ? "1fr" : "auto 1fr"}
+				rows="1fr"
+				flow="col"
+				justify="stretch"
+				align="stretch"
+			>
+				<slot></slot>
+			</schmancy-grid>
+		` : ft;
+  }
+};
+P([L({ context: at })], k.prototype, "minWidth", 2), P([L({ context: $t }), l()], k.prototype, "open", 2), P([L({ context: rt }), h()], k.prototype, "mode", 2), P([L({ context: Ct })], k.prototype, "schmancyContentDrawerID", 2), P([L({ context: nt })], k.prototype, "maxHeight", 2), P([gt({ flatten: !0 })], k.prototype, "assignedElements", 2), k = P([p("schmancy-content-drawer")], k);
+var Ft = Object.defineProperty, Vt = Object.getOwnPropertyDescriptor, q = (t, e, s, o) => {
+  for (var n, i = o > 1 ? void 0 : o ? Vt(e, s) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (i = (o ? n(e, s, i) : n(i)) || i);
+  return o && i && Ft(e, s, i), i;
+};
+let R = class extends j(w`
+	:host {
+		display: block;
+		overflow: hidden;
+	}
+`) {
+  connectedCallback() {
+    super.connectedCallback(), this.minWidth ? this.drawerMinWidth.main = this.minWidth : this.minWidth = this.drawerMinWidth.main;
+  }
+  update(t) {
+    super.update(t), t.has("minWidth") && this.minWidth && (this.drawerMinWidth.main = this.minWidth, this.dispatchEvent(new CustomEvent(m.ContentDrawerResize, { bubbles: !0, composed: !0 })));
+  }
+  render() {
+    const t = { minWidth: `${this.minWidth}px`, maxHeight: this.maxHeight };
+    return c`
+			<section class="relative inset-0 h-full">
+				<schmancy-grid
+					class="h-full relative overflow-scroll"
+					cols="${this.mode === "push" ? "auto 1fr" : "1fr"}"
+					rows="1fr"
+					flow="col"
+					align="stretch"
+					justify="stretch"
+				>
+					<section style=${this.styleMap(t)}>
+						<slot></slot>
+					</section>
+				</schmancy-grid>
+				${st(this.mode === "push", () => c` <schmancy-divider class="absolute right-0 top-0" orientation="vertical"></schmancy-divider>`)}
+			</section>
+		`;
+  }
+};
+q([l({ type: Number })], R.prototype, "minWidth", 2), q([u({ context: at, subscribe: !0 })], R.prototype, "drawerMinWidth", 2), q([u({ context: rt, subscribe: !0 }), h()], R.prototype, "mode", 2), q([u({ context: nt, subscribe: !0 }), h()], R.prototype, "maxHeight", 2), R = q([p("schmancy-content-drawer-main")], R);
+var Gt = Object.defineProperty, Jt = Object.getOwnPropertyDescriptor, x = (t, e, s, o) => {
+  for (var n, i = o > 1 ? void 0 : o ? Jt(e, s) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (i = (o ? n(e, s, i) : n(i)) || i);
+  return o && i && Gt(e, s, i), i;
+};
+let b = class extends j(w`
+	:host {
+		overflow: scroll;
+	}
+`) {
+  connectedCallback() {
+    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" && (it.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() {
+    Q(dt(this.closeModalSheet()), dt(this.closeSheet())).pipe(y(this.disconnecting)).subscribe();
+  }
+  closeModalSheet() {
+    return J(!0).pipe(z(() => it.dismiss(this.schmancyContentDrawerID)));
+  }
+  closeSheet() {
+    return new It((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();
+      };
+    });
+  }
+  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 c`
+			<section id="sheet" class="${this.classMap(t)}" style=${this.styleMap(e)}>
+				<schmancy-area name="${this.schmancyContentDrawerID}">
+					<slot name="placeholder"></slot>
+				</schmancy-area>
+			</section>
+		`;
+  }
+};
+x([l({ type: Number })], b.prototype, "minWidth", 2), x([u({ context: rt, subscribe: !0 }), h()], b.prototype, "mode", 2), x([u({ context: $t, subscribe: !0 }), h()], b.prototype, "state", 2), x([u({ context: Ct })], b.prototype, "schmancyContentDrawerID", 2), x([tt("#sheet")], b.prototype, "sheet", 2), x([gt({ flatten: !0, slot: void 0 })], b.prototype, "defaultSlot", 2), x([u({ context: at, subscribe: !0 })], b.prototype, "drawerMinWidth", 2), x([u({ context: nt, subscribe: !0 }), h()], b.prototype, "maxHeight", 2), b = x([p("schmancy-content-drawer-sheet")], b);
+const Qt = new class {
+  constructor() {
+    this.$drawer = new ot(), this.$drawer.pipe(G(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 }));
+    });
+  }
+  open(t) {
+    this.$drawer.next({ self: t, state: !0 });
+  }
+  close(t) {
+    this.$drawer.next({ self: t, state: !1 });
+  }
+}(), Es = Qt, lt = A("push"), ct = A("close");
+var Zt = Object.defineProperty, te = Object.getOwnPropertyDescriptor, X = (t, e, s, o) => {
+  for (var n, i = o > 1 ? void 0 : o ? te(e, s) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (i = (o ? n(e, s, i) : n(i)) || i);
+  return o && i && Zt(e, s, i), i;
+};
+let T = class extends Z(w`
+	:host {
+		display: block;
+	}
+`) {
+  constructor() {
+    super(...arguments), this.toggler = !0;
+  }
+  render() {
+    const t = { "block left-3  z-50": this.sidebarMode === "overlay", hidden: this.sidebarMode === "push" }, e = { "block z-50": !0, "grid gap-2 items-center": !0, "grid-cols-[auto_1fr]": this.sidebarMode === "overlay" && this.toggler, "grid-cols-1": !(this.sidebarMode === "overlay" && this.toggler) };
+    return c`
+			<div class=${this.classMap(e)}>
+				${st(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 }));
+    }}
+								>
+									${st(this.sidebarOpen === "close", () => c`menu`, () => c`menu_open`)}
+								</schmancy-icon-button>
+							</div>
+						</slot>`)}
+
+				<slot> </slot>
+			</div>
+		`;
+  }
+};
+X([u({ context: lt, subscribe: !0 }), h()], T.prototype, "sidebarMode", 2), X([u({ context: ct, subscribe: !0 }), h()], T.prototype, "sidebarOpen", 2), X([l({ type: Boolean })], T.prototype, "toggler", 2), T = X([p("schmancy-nav-drawer-appbar")], T);
+var ee = Object.getOwnPropertyDescriptor;
+let yt = class extends j(w`
+	:host {
+		display: block;
+		position: relative;
+		inset: 0;
+		overflow-y: auto;
+	}
+`) {
+  connectedCallback() {
+    super.connectedCallback(), d(this, "scroll").pipe(y(this.disconnecting)).subscribe((t) => {
+      this.parentElement.dispatchEvent(new CustomEvent("scroll", { detail: t, bubbles: !0, composed: !0 }));
+    });
+  }
+  render() {
+    return c` <slot></slot> `;
+  }
+};
+yt = ((t, e, s, o) => {
+  for (var n, i = o > 1 ? void 0 : o ? ee(e, s) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (i = n(i) || i);
+  return i;
+})([p("schmancy-nav-drawer-content")], yt);
+var se = Object.defineProperty, ie = Object.getOwnPropertyDescriptor, N = (t, e, s, o) => {
+  for (var n, i = o > 1 ? void 0 : o ? ie(e, s) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (i = (o ? n(e, s, i) : n(i)) || i);
+  return o && i && se(e, s, i), i;
+};
+let g = class extends j(w`
+	:host {
+		display: flex;
+		flex-grow: 1;
+		overflow: hidden;
+		/* Initially hide the component until it’s ready */
+		visibility: hidden;
+	}
+	/* Once the component is ready, remove the hidden style */
+	:host([data-ready]) {
+		visibility: visible;
+	}
+`) {
+  constructor() {
+    super(...arguments), this.fullscreen = !1, this.breakpoint = "md", this._initialized = !1;
+  }
+  firstUpdated() {
+    this.updateState(window.innerWidth), this._initialized = !0, this.setAttribute("data-ready", ""), d(window, "resize").pipe(v((t) => t.target.innerWidth), v((t) => t >= g.BREAKPOINTS[this.breakpoint]), et(), G(100), y(this.disconnecting)).subscribe((t) => {
+      t ? (this.mode = "push", this.open = "open") : (this.mode = "overlay", this.open = "close");
+    }), d(window, m.NavDrawer_toggle).pipe(z((t) => {
+      t.stopPropagation();
+    }), v((t) => t.detail.state), et(), y(this.disconnecting), G(10)).subscribe((t) => {
+      this.mode === "push" && t === "close" || (this.open = t);
+    });
+  }
+  updateState(t) {
+    const e = t >= g.BREAKPOINTS[this.breakpoint];
+    this.mode = e ? "push" : "overlay", this.open = e ? "open" : "close";
+  }
+  render() {
+    return this._initialized ? c`
+			<schmancy-grid
+				cols=${this.fullscreen ? "1fr" : "auto 1fr"}
+				rows="1fr"
+				flow="col"
+				justify="stretch"
+				align="stretch"
+				${Nt()}
+			>
+				<slot></slot>
+			</schmancy-grid>
+		` : ft;
+  }
+};
+g.BREAKPOINTS = { sm: 640, md: 768, lg: 1024, xl: 1280 }, N([l({ type: Boolean })], g.prototype, "fullscreen", 2), N([l({ type: String, attribute: "breakpoint" })], g.prototype, "breakpoint", 2), N([L({ context: lt }), h()], g.prototype, "mode", 2), N([L({ context: ct }), l()], g.prototype, "open", 2), N([h()], g.prototype, "_initialized", 2), g = N([p("schmancy-nav-drawer")], g);
+var oe = Object.defineProperty, re = Object.getOwnPropertyDescriptor, W = (t, e, s, o) => {
+  for (var n, i = o > 1 ? void 0 : o ? re(e, s) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (i = (o ? n(e, s, i) : n(i)) || i);
+  return o && i && oe(e, s, i), i;
+};
+const U = "cubic-bezier(0.5, 0.01, 0.25, 1)";
+let D = class extends j() {
+  constructor() {
+    super(...arguments), this.width = "220px", this._initialized = !1;
+  }
+  firstUpdated() {
+    this.mode === "overlay" ? this.drawerState === "close" ? (this.nav.style.transform = "translateX(-100%)", this.overlay.style.display = "none") : this.drawerState === "open" && (this.nav.style.transform = "translateX(0)", this.overlay.style.display = "block", this.overlay.style.opacity = "0.4") : this.mode === "push" && (this.nav.style.transform = "translateX(0)", this.overlay.style.display = "none"), this._initialized = !0;
+  }
+  updated(t) {
+    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: U, fill: "forwards" });
+  }
+  closeOverlay() {
+    this.overlay.animate([{ opacity: 0.4 }, { opacity: 0 }], { duration: 150, easing: U, fill: "forwards" }).onfinish = () => {
+      this.overlay.style.display = "none";
+    };
+  }
+  showNavDrawer() {
+    this.nav.animate([{ transform: "translateX(-100%)" }, { transform: "translateX(0)" }], { duration: 200, easing: U, fill: "forwards" }).onfinish = () => {
+      this.nav.style.transform = "translateX(0)";
+    };
+  }
+  hideNavDrawer() {
+    this.nav.animate([{ transform: "translateX(0)" }, { transform: "translateX(-100%)" }], { duration: 200, easing: U, fill: "forwards" }).onfinish = () => {
+      this.nav.style.transform = "translateX(-100%)";
+    };
+  }
+  handleOverlayClick() {
+    window.dispatchEvent(new CustomEvent(m.NavDrawer_toggle, { detail: { state: "close" }, bubbles: !0, composed: !0 }));
+  }
+  render() {
+    const t = { "p-2 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 c`
+			<nav
+				style=${this.styleMap(e)}
+				class="${this.classMap({ ...t })}"
+				${M({ bgColor: r.sys.color.surface.container })}
+			>
+				<slot></slot>
+			</nav>
+			<div
+				id="overlay"
+				${M({ bgColor: r.sys.color.scrim })}
+				@click=${this.handleOverlayClick}
+				class="${this.classMap({ "fixed inset-0 z-49 hidden": !0 })}"
+			></div>
+		`;
+  }
+};
+W([u({ context: lt, subscribe: !0 }), h()], D.prototype, "mode", 2), W([u({ context: ct, subscribe: !0 }), h()], D.prototype, "drawerState", 2), W([tt("#overlay")], D.prototype, "overlay", 2), W([tt("nav")], D.prototype, "nav", 2), W([l({ type: String })], D.prototype, "width", 2), W([h()], D.prototype, "_initialized", 2), D = W([p("schmancy-nav-drawer-navbar")], D);
+var ne = Object.defineProperty, ae = Object.getOwnPropertyDescriptor, E = (t, e, s, o) => {
+  for (var n, i = o > 1 ? void 0 : o ? ae(e, s) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (i = (o ? n(e, s, i) : n(i)) || i);
+  return o && i && ne(e, s, i), i;
+};
+let $ = class extends Z(w`
+	:host {
+		display: flex;
+		flex: 1;
+		min-width: 48px;
+		max-width: 168px;
+		user-select: none;
+		-webkit-tap-highlight-color: transparent;
+	}
+
+	:host([disabled]) {
+		pointer-events: none;
+	}
+
+	button {
+		font-family: inherit;
+		border: none;
+		background: none;
+		width: 100%;
+		padding: 0;
+		margin: 0;
+		text-align: center;
+		color: inherit;
+	}
+
+	button:focus {
+		outline: none;
+	}
+
+	button:focus-visible {
+		outline: 2px solid var(--focus-color);
+		outline-offset: 2px;
+		border-radius: 8px;
+	}
+
+	/* Ripple animation */
+	@keyframes ripple {
+		to {
+			transform: scale(4);
+			opacity: 0;
+		}
+	}
+
+	.ripple-effect {
+		position: absolute;
+		border-radius: 50%;
+		width: 20px;
+		height: 20px;
+		background-color: currentColor;
+		opacity: 0.25;
+		animation: ripple 0.6s ease-out;
+		pointer-events: none;
+	}
+`) {
+  constructor() {
+    super(...arguments), this.icon = "", this.label = "", this.badge = "", this.active$ = new vt(!1), this.disabled = !1, this.hideLabels = !1, this.ripples = [], this.addRippleEffect = (t) => {
+      if (this.disabled) return;
+      const e = this.shadowRoot?.querySelector(".w-16.h-8");
+      if (e) {
+        const s = e.getBoundingClientRect(), o = { x: t.clientX - s.left, y: t.clientY - s.top, id: Date.now() };
+        this.ripples = [...this.ripples, o], zt(600).pipe(F(() => {
+          this.ripples = this.ripples.filter((n) => n.id !== o.id);
+        }), B(this.disconnecting)).subscribe();
+      }
+    }, this.handleClick = (t) => {
+      if (this.disabled) return t.preventDefault(), void t.stopPropagation();
+      this.addRippleEffect(t);
+    }, this.handleKeyDown = (t) => {
+      this.disabled || t.key !== "Enter" && t.key !== " " || t.preventDefault();
+    };
+  }
+  get active() {
+    return this.active$.value;
+  }
+  set active(t) {
+    this.active$.next(t);
+  }
+  setActive(t) {
+    this.active = t;
+  }
+  connectedCallback() {
+    super.connectedCallback(), this.active$.pipe(B(this.disconnecting)).subscribe(() => {
+      this.requestUpdate();
+    }), this.setupNavigationStream();
+  }
+  setupNavigationStream() {
+    const t = this.shadowRoot?.querySelector("button");
+    if (!t) return;
+    const e = d(t, "click").pipe(V(() => !this.disabled)), s = d(t, "keydown").pipe(V(() => !this.disabled), V((o) => o.key === "Enter" || o.key === " "), F((o) => o.preventDefault()));
+    Q(e, s).pipe(F(() => {
+      this.dispatchEvent(new CustomEvent("bar-item-click", { detail: { icon: this.icon, label: this.label, active: this.active }, bubbles: !0, composed: !0 }));
+    }), B(this.disconnecting)).subscribe();
+  }
+  formatBadge(t) {
+    const e = Number(t);
+    return isNaN(e) ? t.slice(0, 3) : e > 99 ? "99+" : String(e);
+  }
+  firstUpdated() {
+    this.setupNavigationStream();
+  }
+  render() {
+    const t = this.querySelector("[slot]") || this.textContent?.trim() && !this.label, e = this.badge ? this.formatBadge(this.badge) : "", s = e && e !== "0", o = this.querySelector('[slot="icon"]'), n = { "relative flex flex-col items-center justify-center": !0, "flex-1 min-w-[48px] max-w-[168px]": !0, "py-2 px-1 cursor-pointer": !this.disabled, "transition-all duration-200": !0, "hover:bg-surface-container-high": !this.disabled && !this.active, "cursor-not-allowed opacity-38": this.disabled, "outline-none": !0, "focus-visible:outline-2 focus-visible:outline-offset-2": !0 }, i = { "w-16 h-8 rounded-2xl": !0, "flex items-center justify-center": !0, "transition-all duration-200": !0, "bg-secondary-container": this.active, "group-hover:bg-surface-container-highest": !this.active && !this.disabled, "relative overflow-hidden": !0 }, a = { "absolute top-0 right-3": !0, "min-w-[6px] h-1.5": !s, "min-w-[16px] h-4": s, "rounded-full": !s, "rounded-lg": s, "flex items-center justify-center": s, "px-1": s, "transition-all duration-200": !0, "z-10": !0 }, Dt = this.active ? { color: r.sys.color.secondary.onContainer } : { color: r.sys.color.surface.onVariant }, Et = { "--focus-color": r.sys.color.primary.default };
+    return c`
+			<button
+				type="button"
+				class=${this.classMap(n)}
+				@click=${this.handleClick}
+				@keydown=${this.handleKeyDown}
+				?disabled=${this.disabled}
+				aria-pressed=${this.active}
+				aria-label=${this.label || "Navigation item"}
+				style=${this.styleMap({ ...Et, "outline-color": "var(--focus-color)" })}
+				${M(Dt)}
+			>
+				<!-- Icon with indicator background -->
+				<div class=${this.classMap(i)}>
+					<!-- Ripple effects -->
+					${this.ripples.map((ht) => c`
+							<span
+								class="ripple-effect"
+								style=${this.styleMap({ left: `${ht.x}px`, top: `${ht.y}px`, transform: "translate(-50%, -50%)" })}
+							></span>
+						`)}
+
+					${o ? c`<slot name="icon"></slot>` : this.icon ? c`
+									<schmancy-icon
+										.fill=${this.active ? 1 : 0}
+										class="relative z-10 flex items-center justify-center transition-all duration-200"
+										style="--schmancy-icon-size: 24px;"
+										aria-hidden="true"
+									>
+										${this.icon}
+									</schmancy-icon>
+							  ` : t ? c`<slot></slot>` : ""}
+				</div>
+
+				<!-- Label below icon -->
+				${!this.hideLabels && this.label ? c`
+					<span class=${this.classMap({ "text-xs font-medium leading-4 mt-1": !0, "text-center max-w-full": !0, "overflow-hidden text-ellipsis whitespace-nowrap": !0, "transition-all duration-200": !0 })}>${this.label}</span>
+				` : ""}
+
+				<!-- Badge -->
+				${s ? c`
+					<span
+						class=${this.classMap(a)}
+						aria-label="${e} notifications"
+						${M({ bgColor: r.sys.color.error.default, color: r.sys.color.error.on })}
+					>
+						<span class="text-[10px] font-medium leading-none">${e}</span>
+					</span>
+				` : this.badge ? c`
+					<span
+						class=${this.classMap(a)}
+						aria-label="Has notifications"
+						${M({ bgColor: r.sys.color.error.default })}
+					></span>
+				` : ""}
+			</button>
+		`;
+  }
+};
+E([l({ type: String })], $.prototype, "icon", 2), E([l({ type: String })], $.prototype, "label", 2), E([l({ type: String })], $.prototype, "badge", 2), E([l({ type: Boolean, reflect: !0 })], $.prototype, "active", 1), E([l({ type: Boolean, reflect: !0 })], $.prototype, "disabled", 2), E([l({ type: Boolean, reflect: !0 })], $.prototype, "hideLabels", 2), E([h()], $.prototype, "ripples", 2), $ = E([p("schmancy-navigation-bar-item")], $);
+var le = Object.defineProperty, ce = Object.getOwnPropertyDescriptor, H = (t, e, s, o) => {
+  for (var n, i = o > 1 ? void 0 : o ? ce(e, s) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (i = (o ? n(e, s, i) : n(i)) || i);
+  return o && i && le(e, s, i), i;
+};
+let O = class extends Z(w`
+	:host {
+		display: block;
+		position: fixed;
+		bottom: 0;
+		left: 0;
+		right: 0;
+		z-index: 10;
+		transition: transform 0.3s ease-in-out;
+	}
+
+	:host([hide-on-scroll]) {
+		transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+	}
+
+	/* Support 3-7 items with equal distribution */
+	::slotted(schmancy-navigation-bar-item) {
+		flex: 1;
+		max-width: 168px; /* Prevent items from being too wide */
+	}
+
+	/* Accessibility focus indicators */
+	:host(:focus-within) {
+		outline: 2px solid var(--schmancy-sys-color-primary);
+		outline-offset: -2px;
+	}
+`) {
+  constructor() {
+    super(...arguments), this.activeIndex$ = new vt(-1), this.hideLabels = !1, this.elevation = 2, this.hideOnScroll = !1, this.focusedIndex = -1, this.isHidden = !1, this.SCROLL_THRESHOLD = 10, this.handleItemClick = (t) => {
+      const e = this.querySelectorAll("schmancy-navigation-bar-item"), s = t.target, o = Array.from(e).indexOf(s);
+      if (o !== -1 && this.activeIndex !== o) {
+        const n = this.activeIndex;
+        this.activeIndex = o, this.dispatchEvent(new CustomEvent("navigation-change", { detail: { oldIndex: n, newIndex: o, item: s }, bubbles: !0, composed: !0 }));
+      }
+    }, this.handleKeyDown = (t) => {
+      const e = Array.from(this.querySelectorAll("schmancy-navigation-bar-item")), s = this.focusedIndex === -1 ? this.activeIndex : this.focusedIndex;
+      switch (t.key) {
+        case "ArrowLeft":
+          t.preventDefault(), s > 0 && this.focusItem(s - 1);
+          break;
+        case "ArrowRight":
+          t.preventDefault(), s < e.length - 1 && this.focusItem(s + 1);
+          break;
+        case "Home":
+          t.preventDefault(), this.focusItem(0);
+          break;
+        case "End":
+          t.preventDefault(), this.focusItem(e.length - 1);
+          break;
+        case "Enter":
+        case " ":
+          t.preventDefault(), this.focusedIndex !== -1 && e[this.focusedIndex]?.click();
+      }
+    };
+  }
+  get activeIndex() {
+    return this.activeIndex$.value;
+  }
+  set activeIndex(t) {
+    this.activeIndex$.next(t);
+  }
+  connectedCallback() {
+    super.connectedCallback(), this.addEventListener("bar-item-click", this.handleItemClick), this.addEventListener("keydown", this.handleKeyDown), this.activeIndex$.pipe(B(this.disconnecting)).subscribe((t) => {
+      this.updateActiveStates(t);
+    }), this.hideOnScroll && this.setupScrollListener(), this.updateItems();
+  }
+  setupScrollListener() {
+    d(window, "scroll").pipe(qt(100), xt(() => window.scrollY), Tt(), V(([t, e]) => Math.abs(e - t) > this.SCROLL_THRESHOLD), F(([t, e]) => {
+      const s = e < t;
+      e > t && !this.isHidden ? this.isHidden = !0 : s && this.isHidden && (this.isHidden = !1), e <= this.SCROLL_THRESHOLD && (this.isHidden = !1);
+    }), B(this.disconnecting)).subscribe();
+  }
+  disconnectedCallback() {
+    this.removeEventListener("bar-item-click", this.handleItemClick), this.removeEventListener("keydown", this.handleKeyDown), super.disconnectedCallback();
+  }
+  focusItem(t) {
+    const e = this.querySelectorAll("schmancy-navigation-bar-item");
+    e[t] && (this.focusedIndex = t, e[t].focus());
+  }
+  updateItems() {
+    const t = this.shadowRoot?.querySelector("slot");
+    if (t) {
+      const e = () => {
+        this.updateActiveStates(this.activeIndex);
+      };
+      t.addEventListener("slotchange", e), e();
+    }
+  }
+  updateActiveStates(t) {
+    this.querySelectorAll("schmancy-navigation-bar-item").forEach((e, s) => {
+      const o = e;
+      o.setActive ? o.setActive(s === t) : o.active = s === t, o.hideLabels = this.hideLabels, e.tabIndex = s === t ? 0 : -1;
+    });
+  }
+  updated(t) {
+    super.updated(t), t.has("hideLabels") && this.updateActiveStates(this.activeIndex), t.has("hideOnScroll") && (this.hideOnScroll && !t.get("hideOnScroll") ? this.setupScrollListener() : this.hideOnScroll || (this.isHidden = !1));
+  }
+  render() {
+    const t = { "h-20": !0, "fixed bottom-0 left-0 right-0": !0, "flex items-center justify-around": !0, "px-2 py-3 box-border": !0, "transition-all duration-200 ease-in-out": !0, "shadow-none": this.elevation === 0, "shadow-sm": this.elevation === 1, "shadow-md": this.elevation === 2, "shadow-lg": this.elevation === 3, "shadow-xl": this.elevation === 4, "shadow-2xl": this.elevation === 5 }, e = this.isHidden ? "translateY(100%)" : "translateY(0)";
+    return c`
+			<nav
+				class=${this.classMap(t)}
+				role="navigation"
+				aria-label="Main navigation"
+				aria-hidden=${this.isHidden}
+				style="transform: ${e};"
+				${M({ bgColor: r.sys.color.surface.container, color: r.sys.color.surface.on })}
+			>
+				<slot></slot>
+			</nav>
+		`;
+  }
+};
+H([l({ type: Number })], O.prototype, "activeIndex", 1), H([l({ type: Boolean, reflect: !0 })], O.prototype, "hideLabels", 2), H([l({ type: Number, reflect: !0 })], O.prototype, "elevation", 2), H([l({ type: Boolean, reflect: !0 })], O.prototype, "hideOnScroll", 2), H([h()], O.prototype, "focusedIndex", 2), H([h()], O.prototype, "isHidden", 2), O = H([p("schmancy-navigation-bar")], O);
+const St = "whereAreYouRicky", kt = "hereMorty", K = new class {
+  constructor() {
+    this.activeTeleportations = /* @__PURE__ */ new Map(), this.flipRequests = new ot(), this.find = (t) => pt([d(window, kt).pipe(wt((e) => !!e.detail.component.uuid && !!t.id && e.detail.component.id === t.id && e.detail.component.uuid !== t.uuid), v((e) => e.detail.component), Mt(1)), J(t).pipe(z(() => {
+      window.dispatchEvent(new CustomEvent(St, { detail: { id: t.id, callerID: t.uuid } }));
+    }))]).pipe(v(([e]) => e), jt(0)), this.flip = (t) => {
+      const { from: e, to: s } = t, o = s.element.style.zIndex;
+      s.element.style.transformOrigin = "top left", s.element.style.setProperty("visibility", "visible"), s.element.style.zIndex = "1000";
+      const n = [{ transform: `translate(${e.rect.left - s.rect.left}px, ${e.rect.top - s.rect.top}px) scale(${e.rect.width / s.rect.width}, ${e.rect.height / s.rect.height})` }, { transform: "translate(0, 0) scale(1, 1)" }];
+      s.element.animate(n, { duration: 250, delay: 10, easing: "cubic-bezier(0.455, 0.03, 0.515, 0.955)" }).onfinish = () => {
+        s.element.style.zIndex = o, s.element.style.transformOrigin = "";
+      };
+    }, this.flipRequests.pipe(Pt(1), v((t) => t.map(({ from: e, to: s, host: o }, n) => ({ from: e, to: s, host: o, i: n }))), Wt((t) => pt(t.map((e) => J(this.flip(e)))))).subscribe();
+  }
+}();
+function bt(t) {
+  return Ht(50).pipe(xt(() => t.getBoundingClientRect()), _t((e, s) => e.width === s.width && e.height === s.height && e.top === s.top && e.right === s.right && e.bottom === s.bottom && e.left === s.left), Bt(1));
+}
+var he = Object.defineProperty, de = Object.getOwnPropertyDescriptor, Y = (t, e, s, o) => {
+  for (var n, i = o > 1 ? void 0 : o ? de(e, s) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (i = (o ? n(e, s, i) : n(i)) || i);
+  return o && i && he(e, s, i), i;
+};
+let _ = class extends j(w``) {
+  constructor() {
+    super(...arguments), this.uuid = Math.floor(Math.random() * Date.now()), this.delay = 0, this.debugging = !1;
+  }
+  get _slottedChildren() {
+    return this.shadowRoot.querySelector("slot").assignedElements({ flatten: !0 });
+  }
+  connectedCallback() {
+    if (this.id === void 0) throw new Error("id is required");
+    super.connectedCallback(), Q(d(window, At).pipe(z({ next: () => {
+      this.dispatchEvent(new CustomEvent(Rt, { detail: { component: this }, bubbles: !0, composed: !0 }));
+    } })), d(window, St).pipe(z({ next: (t) => {
+      t.detail.id === this.id && this.uuid && t.detail.callerID !== this.uuid && this.dispatchEvent(new CustomEvent(kt, { detail: { component: this }, bubbles: !0, composed: !0 }));
+    } }))).pipe(y(this.disconnecting)).subscribe();
+  }
+  async firstUpdated() {
+    J(K.activeTeleportations.get(this.id)).pipe(wt((t) => !!t), y(this.disconnecting), Lt()).subscribe({ next: (t) => {
+      this.style.setProperty("visibility", "hidden"), bt(this).pipe(y(this.disconnecting)).subscribe({ next: (e) => {
+        K.activeTeleportations.set(this.id, e), K.flipRequests.next({ from: { rect: t }, to: { rect: e, element: this._slottedChildren[0] }, host: this });
+      } });
+    }, error: () => {
+      this.style.setProperty("visibility", "visible"), bt(this).pipe(y(this.disconnecting)).subscribe({ next: (t) => {
+        K.activeTeleportations.set(this.id, t);
+      } });
+    }, complete: () => {
+    } });
+  }
+  render() {
+    return c`<slot></slot>`;
+  }
+};
+Y([l({ type: Number, reflect: !0 })], _.prototype, "uuid", 2), Y([l({ type: String })], _.prototype, "id", 2), Y([l({ type: Number })], _.prototype, "delay", 2), _ = Y([p("schmancy-teleport")], _);
+var pe = Object.defineProperty, ue = Object.getOwnPropertyDescriptor, C = (t, e, s, o) => {
+  for (var n, i = o > 1 ? void 0 : o ? ue(e, s) : e, a = t.length - 1; a >= 0; a--) (n = t[a]) && (i = (o ? n(e, s, i) : n(i)) || i);
+  return o && i && pe(e, s, i), i;
+};
+let f = class extends j() {
+  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 ? 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 }, s = this.getColorAttributes();
+    return c`
+			<div class="${this.classMap(e)}" ${s}>
+				${t} ${this.status !== "none" ? this.renderStatusIndicator() : ""}
+			</div>
+		`;
+  }
+  getColorAttributes() {
+    const t = { primary: { bgColor: r.sys.color.primary.container, color: r.sys.color.primary.onContainer }, secondary: { bgColor: r.sys.color.secondary.container, color: r.sys.color.secondary.onContainer }, tertiary: { bgColor: r.sys.color.tertiary.container, color: r.sys.color.tertiary.onContainer }, success: { bgColor: r.sys.color.success.container, color: r.sys.color.success.onContainer }, error: { bgColor: r.sys.color.error.container, color: r.sys.color.error.onContainer }, neutral: { bgColor: r.sys.color.surface.container, color: r.sys.color.surface.on } };
+    return M(t[this.color]);
+  }
+  renderStatusIndicator() {
+    const t = { online: r.sys.color.success.default, offline: r.sys.color.surface.onVariant, busy: r.sys.color.error.default, away: r.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 c`
+			<div class="${this.classMap(e)}" style="background-color: ${t[this.status]};"></div>
+		`;
+  }
+};
+C([l({ type: String })], f.prototype, "initials", 2), C([l({ type: String })], f.prototype, "src", 2), C([l({ type: String })], f.prototype, "icon", 2), C([l({ type: String })], f.prototype, "size", 2), C([l({ type: String })], f.prototype, "color", 2), C([l({ type: String })], f.prototype, "shape", 2), C([l({ type: Boolean })], f.prototype, "bordered", 2), C([l({ type: String })], f.prototype, "status", 2), f = C([p("schmancy-avatar")], f);
+export {
+  Es as $,
+  kt as H,
+  S,
+  St as W,
+  mt as a,
+  rt as b,
+  $t as c,
+  Ct as d,
+  nt as e,
+  at as f,
+  k as g,
+  R as h,
+  b as i,
+  Qt as j,
+  T as k,
+  yt as l,
+  lt as m,
+  ct as n,
+  g as o,
+  D as p,
+  $ as q,
+  O as r,
+  Ds as s,
+  _ as t,
+  K as u,
+  f as v
+};
+//# sourceMappingURL=avatar-BAaUCxc-.js.map