@jasonshimmy/custom-elements-runtime 3.3.0 → 3.5.0

package/dist/custom-elements-runtime.es.js

@@ -1,272 +1,225 @@
-import { i as G, n as J, r as b, t as m } from "./logger-L25axmB-.js";
-import { B as T, H as W, I as Y, J as Z, L as X, R as F, U as Q, V as f, Y as ee, Z as te, _ as k, a as ne, d as A, f as re, g as I, h as oe, i as D, l as se, m as ie, n as ae, o as U, p as ce, r as le, s as ue, u as de, v as he, w as me, y as fe, z as pe } from "./hooks-_3xP4G2N.js";
-import { n as g, r as p, t as l } from "./template-compiler-Cs5axmn4.js";
-import { o as ve } from "./css-utils-CC43BbEy.js";
-function Ce(e = document) {
-  typeof CustomEvent > "u" || (e instanceof Document ? e.documentElement : e).dispatchEvent(new CustomEvent("cer:hydrate", {
-    bubbles: !0,
-    composed: !0
-  }));
+import { i as e, n as t, r as n, t as r } from "./logger-DIJ0UH3R.js";
+import { D as i, E as a, _ as o, b as s, g as c, h as l, k as u, m as d, n as f, v as p, x as m, y as h } from "./helpers-tJgb4Qve.js";
+import { n as g, r as _, t as v } from "./template-compiler-C3h8_vbE.js";
+import { o as y } from "./css-utils-Bn-dO44e.js";
+import { _ as b, a as x, d as S, f as C, g as w, h as T, i as E, l as D, m as O, n as k, o as A, p as j, r as M, s as N, u as P, v as F, y as I } from "./hooks-CEUnvtsA.js";
+//#region src/lib/runtime/hydration.ts
+function L(e = document) {
+	typeof CustomEvent > "u" || (e instanceof Document ? e.documentElement : e).dispatchEvent(new CustomEvent("cer:hydrate", {
+		bubbles: !0,
+		composed: !0
+	}));
 }
-var x = 100, O = 3e4;
-function z(e, t, r) {
-  return r === "jitCacheHitRate" ? e < t * 0.5 ? "critical" : e < t ? "warning" : "healthy" : e > t * 2 ? "critical" : e > t ? "warning" : "healthy";
+//#endregion
+//#region src/lib/runtime/monitoring/health-monitor.ts
+var R = 100, z = 3e4;
+function B(e, t, n) {
+	return n === "jitCacheHitRate" ? e < t * .5 ? "critical" : e < t ? "warning" : "healthy" : e > t * 2 ? "critical" : e > t ? "warning" : "healthy";
 }
-function K(e) {
-  const t = [];
-  return e.memoryUsage?.status !== "healthy" && t.push("Consider reducing component complexity or implementing better memory cleanup"), e.averageRenderTime?.status !== "healthy" && t.push("Optimize component render functions - consider lazy loading or virtualization"), e.jitCacheHitRate?.status !== "healthy" && t.push("JIT CSS cache performance is poor - review CSS patterns for optimization"), e.componentErrorRate?.status !== "healthy" && t.push("High component error rate detected - review error handling and component logic"), e.activeReactiveStates?.status !== "healthy" && t.push("High number of reactive states - consider state consolidation or cleanup"), e.memoryLeakIndicator?.status !== "healthy" && t.push("Potential memory leak detected - review component cleanup and event listener management"), t;
+function V(e) {
+	let t = [];
+	return e.memoryUsage?.status !== "healthy" && t.push("Consider reducing component complexity or implementing better memory cleanup"), e.averageRenderTime?.status !== "healthy" && t.push("Optimize component render functions - consider lazy loading or virtualization"), e.jitCacheHitRate?.status !== "healthy" && t.push("JIT CSS cache performance is poor - review CSS patterns for optimization"), e.componentErrorRate?.status !== "healthy" && t.push("High component error rate detected - review error handling and component logic"), e.activeReactiveStates?.status !== "healthy" && t.push("High number of reactive states - consider state consolidation or cleanup"), e.memoryLeakIndicator?.status !== "healthy" && t.push("Potential memory leak detected - review component cleanup and event listener management"), t;
 }
-function N() {
-  const e = /* @__PURE__ */ new Map(), t = /* @__PURE__ */ new Set();
-  let r = null;
-  function n(o, s, i) {
-    e.set(o, {
-      name: o,
-      value: s,
-      threshold: i,
-      status: "healthy",
-      lastUpdated: Date.now(),
-      history: []
-    });
-  }
-  function c() {
-    n("activeComponents", 0, 1e3), n("componentCreateRate", 0, 50), n("componentErrorRate", 0, 0.1), n("memoryUsage", 0, 50 * 1024 * 1024), n("memoryGrowthRate", 0, 1024 * 1024), n("averageRenderTime", 0, 16), n("slowRenderCount", 0, 10), n("jitCacheHitRate", 100, 80), n("activeReactiveStates", 0, 5e3), n("dependencyUpdates", 0, 100), n("memoryLeakIndicator", 0, 0.1);
-  }
-  function a(o, s) {
-    const i = e.get(o);
-    i && (i.value = s, i.lastUpdated = Date.now(), i.history.push(s), i.history.length > x && i.history.shift(), i.status = z(s, i.threshold, o));
-  }
-  function h() {
-    const o = {};
-    let s = "healthy";
-    for (const [i, u] of e)
-      o[i] = { ...u }, u.status === "critical" ? s = "critical" : u.status === "warning" && s === "healthy" && (s = "warning");
-    return {
-      overall: s,
-      metrics: o,
-      timestamp: Date.now(),
-      recommendations: K(o)
-    };
-  }
-  function C() {
-    if ("memory" in performance && performance.memory) {
-      const o = performance.memory;
-      a("memoryUsage", o.usedJSHeapSize);
-      const s = e.get("memoryUsage");
-      if (s && s.history.length > 1) {
-        const i = s.history[s.history.length - 2], u = s.history[s.history.length - 1];
-        a("memoryGrowthRate", Math.max(0, u - i));
-      }
-    }
-  }
-  function w(o) {
-    for (const s of t) try {
-      s(o);
-    } catch (i) {
-      m("Error in health monitor listener:", i);
-    }
-  }
-  function E() {
-    C();
-    const o = h();
-    w(o), o.overall === "critical" ? m("🚨 Runtime Health: Critical issues detected", o.recommendations) : o.overall === "warning" && b("⚠️ Runtime Health: Performance warnings", o.recommendations);
-  }
-  function S() {
-    typeof window > "u" || (r = setInterval(E, O));
-  }
-  function _() {
-    r !== null && (clearInterval(r), r = null);
-  }
-  function R(o) {
-    t.add(o);
-  }
-  function H(o) {
-    t.delete(o);
-  }
-  function M(o) {
-    const s = e.get(o);
-    return s ? [...s.history] : [];
-  }
-  function L() {
-    for (const o of e.values()) o.history = [];
-  }
-  return c(), S(), {
-    updateMetric: a,
-    getHealthReport: h,
-    addListener: R,
-    removeListener: H,
-    stop: _,
-    getMetricHistory: M,
-    clearHistory: L
-  };
+function H() {
+	let e = /* @__PURE__ */ new Map(), t = /* @__PURE__ */ new Set(), i = null;
+	function a(t, n, r) {
+		e.set(t, {
+			name: t,
+			value: n,
+			threshold: r,
+			status: "healthy",
+			lastUpdated: Date.now(),
+			history: []
+		});
+	}
+	function o() {
+		a("activeComponents", 0, 1e3), a("componentCreateRate", 0, 50), a("componentErrorRate", 0, .1), a("memoryUsage", 0, 50 * 1024 * 1024), a("memoryGrowthRate", 0, 1024 * 1024), a("averageRenderTime", 0, 16), a("slowRenderCount", 0, 10), a("jitCacheHitRate", 100, 80), a("activeReactiveStates", 0, 5e3), a("dependencyUpdates", 0, 100), a("memoryLeakIndicator", 0, .1);
+	}
+	function s(t, n) {
+		let r = e.get(t);
+		r && (r.value = n, r.lastUpdated = Date.now(), r.history.push(n), r.history.length > R && r.history.shift(), r.status = B(n, r.threshold, t));
+	}
+	function c() {
+		let t = {}, n = "healthy";
+		for (let [r, i] of e) t[r] = { ...i }, i.status === "critical" ? n = "critical" : i.status === "warning" && n === "healthy" && (n = "warning");
+		return {
+			overall: n,
+			metrics: t,
+			timestamp: Date.now(),
+			recommendations: V(t)
+		};
+	}
+	function l() {
+		if ("memory" in performance && performance.memory) {
+			let t = performance.memory;
+			s("memoryUsage", t.usedJSHeapSize);
+			let n = e.get("memoryUsage");
+			if (n && n.history.length > 1) {
+				let e = n.history[n.history.length - 2], t = n.history[n.history.length - 1];
+				s("memoryGrowthRate", Math.max(0, t - e));
+			}
+		}
+	}
+	function u(e) {
+		for (let n of t) try {
+			n(e);
+		} catch (e) {
+			r("Error in health monitor listener:", e);
+		}
+	}
+	function d() {
+		l();
+		let e = c();
+		u(e), e.overall === "critical" ? r("🚨 Runtime Health: Critical issues detected", e.recommendations) : e.overall === "warning" && n("⚠️ Runtime Health: Performance warnings", e.recommendations);
+	}
+	function f() {
+		typeof window > "u" || (i = setInterval(d, z));
+	}
+	function p() {
+		i !== null && (clearInterval(i), i = null);
+	}
+	function m(e) {
+		t.add(e);
+	}
+	function h(e) {
+		t.delete(e);
+	}
+	function g(t) {
+		let n = e.get(t);
+		return n ? [...n.history] : [];
+	}
+	function _() {
+		for (let t of e.values()) t.history = [];
+	}
+	return o(), f(), {
+		updateMetric: s,
+		getHealthReport: c,
+		addListener: m,
+		removeListener: h,
+		stop: p,
+		getMetricHistory: g,
+		clearHistory: _
+	};
 }
-var d = null;
-function v() {
-  return d || (d = N()), d;
+var U = null;
+function W() {
+	return U ||= H(), U;
 }
-function we(e, t) {
-  v().updateMetric(e, t);
+function G(e, t) {
+	W().updateMetric(e, t);
 }
-function Ee() {
-  return v().getHealthReport();
+function K() {
+	return W().getHealthReport();
 }
-function $() {
-  typeof window > "u" || typeof customElements > "u" || customElements.get("cer-keep-alive") || customElements.define("cer-keep-alive", j());
+//#endregion
+//#region src/lib/keep-alive.ts
+function q() {
+	typeof window > "u" || typeof customElements > "u" || customElements.get("cer-keep-alive") || customElements.define("cer-keep-alive", J());
 }
-function j() {
-  return class extends HTMLElement {
-    _cache = /* @__PURE__ */ new Map();
-    _slot = null;
-    _slotListener = null;
-    connectedCallback() {
-      this.shadowRoot || this.attachShadow({ mode: "open" }), this.shadowRoot.querySelector("slot") || (this.shadowRoot.innerHTML = "<slot></slot>"), this._slot = this.shadowRoot.querySelector("slot"), this._slot && (this._slotListener = () => this._handleSlotChange(), this._slot.addEventListener("slotchange", this._slotListener), this._handleSlotChange());
-    }
-    disconnectedCallback() {
-      this._slot && this._slotListener && this._slot.removeEventListener("slotchange", this._slotListener), this._slotListener = null;
-    }
-    clearCache(t) {
-      t ? this._cache.delete(t) : this._cache.clear();
-    }
-    _handleSlotChange() {
-      if (!this._slot) return;
-      const t = this._slot.assignedElements({ flatten: !0 });
-      for (const r of t) {
-        const n = this._buildCacheKey(r);
-        if (!this._cache.has(n)) this._cache.set(n, r);
-        else {
-          const c = this._cache.get(n);
-          if (c !== r) try {
-            r.parentNode?.replaceChild(c, r);
-          } catch {
-            this._cache.set(n, r);
-          }
-        }
-      }
-    }
-    _buildCacheKey(t) {
-      const r = t.tagName.toLowerCase(), n = t.getAttribute("id");
-      return n ? `${r}:${n}` : r;
-    }
-  };
+function J() {
+	return class extends HTMLElement {
+		_cache = /* @__PURE__ */ new Map();
+		_slot = null;
+		_slotListener = null;
+		connectedCallback() {
+			this.shadowRoot || this.attachShadow({ mode: "open" }), this.shadowRoot.querySelector("slot") || (this.shadowRoot.innerHTML = "<slot></slot>"), this._slot = this.shadowRoot.querySelector("slot"), this._slot && (this._slotListener = () => this._handleSlotChange(), this._slot.addEventListener("slotchange", this._slotListener), this._handleSlotChange());
+		}
+		disconnectedCallback() {
+			this._slot && this._slotListener && this._slot.removeEventListener("slotchange", this._slotListener), this._slotListener = null;
+		}
+		clearCache(e) {
+			e ? this._cache.delete(e) : this._cache.clear();
+		}
+		_handleSlotChange() {
+			if (!this._slot) return;
+			let e = this._slot.assignedElements({ flatten: !0 });
+			for (let t of e) {
+				let e = this._buildCacheKey(t);
+				if (!this._cache.has(e)) this._cache.set(e, t);
+				else {
+					let n = this._cache.get(e);
+					if (n !== t) try {
+						t.parentNode?.replaceChild(n, t);
+					} catch {
+						this._cache.set(e, t);
+					}
+				}
+			}
+		}
+		_buildCacheKey(e) {
+			let t = e.tagName.toLowerCase(), n = e.getAttribute("id");
+			return n ? `${t}:${n}` : t;
+		}
+	};
 }
-function P() {
-  typeof customElements < "u" && customElements.get("cer-suspense") || g("cer-suspense", () => {
-    const { pending: e } = k({ pending: !1 });
-    return e ? l`<slot name="fallback"><span>Loading…</span></slot>` : l`<slot></slot>`;
-  });
+//#endregion
+//#region src/lib/runtime/builtin-components.ts
+function Y() {
+	typeof customElements < "u" && customElements.get("cer-suspense") || g("cer-suspense", () => {
+		let { pending: e } = b({ pending: !1 });
+		return e ? v`<slot name="fallback"><span>Loading…</span></slot>` : v`<slot></slot>`;
+	});
 }
-function q() {
-  typeof customElements < "u" && customElements.get("cer-error-boundary") || g("cer-error-boundary", () => {
-    const e = f(!1), t = f("");
-    return I((r) => {
-      e.value = !0, t.value = r.message;
-    }), A({
-      _cerHandleChildError: (r) => {
-        e.peek() || (e.value = !0, t.value = r instanceof Error ? r.message : String(r));
-      },
-      reset: () => {
-        e.value = !1, t.value = "";
-      }
-    }), e.value ? l`<slot name="fallback"
+function X() {
+	typeof customElements < "u" && customElements.get("cer-error-boundary") || g("cer-error-boundary", () => {
+		let e = h(!1), t = h("");
+		return w((n) => {
+			e.value = !0, t.value = n.message;
+		}), S({
+			_cerHandleChildError: (n) => {
+				e.peek() || (e.value = !0, t.value = n instanceof Error ? n.message : String(n));
+			},
+			reset: () => {
+				e.value = !1, t.value = "";
+			}
+		}), e.value ? v`<slot name="fallback"
           ><div role="alert">
             <strong>Something went wrong.</strong>
-            ${t.value ? l`<p>${t.value}</p>` : l``}
+            ${t.value ? v`<p>${t.value}</p>` : v``}
           </div></slot
-        >` : l`<slot></slot>`;
-  });
+        >` : v`<slot></slot>`;
+	});
 }
-function _e() {
-  P(), q(), $();
+function Z() {
+	Y(), X(), q();
 }
-function Re(e) {
-  if (typeof document > "u") return {
-    portal: () => {
-    },
-    destroy: () => {
-    }
-  };
-  if (U()) return {
-    portal: () => {
-    },
-    destroy: () => {
-    }
-  };
-  if (D()) {
-    const t = T.getOrCreateState(null), r = t.peek();
-    if (r !== null) return r;
-    const n = y(e, () => t.initSilent(null));
-    return t.initSilent(n), n;
-  }
-  return y(e);
+//#endregion
+//#region src/lib/teleport.ts
+function Q(e) {
+	if (typeof document > "u" || A()) return {
+		portal: () => {},
+		destroy: () => {}
+	};
+	if (E()) {
+		let t = p.getOrCreateState(null), n = t.peek();
+		if (n !== null) return n;
+		let r = $(e, () => t.initSilent(null));
+		return t.initSilent(r), r;
+	}
+	return $(e);
 }
-function y(e, t) {
-  const r = typeof e == "string" ? document.querySelector(e) : e;
-  if (!r)
-    return console.warn(`[useTeleport] Target "${String(e)}" not found in the document. Teleported content will not be rendered.`), {
-      portal: () => {
-      },
-      destroy: () => {
-      }
-    };
-  const n = document.createElement("cer-teleport");
-  n.dataset.cerTeleport = "", r.appendChild(n);
-  const c = {};
-  return {
-    portal(a) {
-      p(n, a == null ? [] : Array.isArray(a) ? a : [a], void 0, c);
-    },
-    destroy() {
-      try {
-        p(n, [], void 0, c);
-      } catch {
-      }
-      n.parentNode && n.parentNode.removeChild(n), t?.();
-    }
-  };
+function $(e, t) {
+	let n = typeof e == "string" ? document.querySelector(e) : e;
+	if (!n) return console.warn(`[useTeleport] Target "${String(e)}" not found in the document. Teleported content will not be rendered.`), {
+		portal: () => {},
+		destroy: () => {}
+	};
+	let r = document.createElement("cer-teleport");
+	r.dataset.cerTeleport = "", n.appendChild(r);
+	let i = {};
+	return {
+		portal(e) {
+			_(r, e == null ? [] : Array.isArray(e) ? e : [e], void 0, i);
+		},
+		destroy() {
+			try {
+				_(r, [], void 0, i);
+			} catch {}
+			r.parentNode && r.parentNode.removeChild(r), t?.();
+		}
+	};
 }
-export {
-  X as ReactiveState,
-  g as component,
-  F as computed,
-  ae as createComposable,
-  N as createHealthMonitor,
-  ve as css,
-  me as decodeEntities,
-  le as defineModel,
-  J as devLog,
-  Z as flushDOMUpdates,
-  D as getCurrentComponentContext,
-  v as getHealthMonitor,
-  Ee as getHealthStatus,
-  l as html,
-  Ce as hydrateApp,
-  ne as inject,
-  pe as isReactiveState,
-  ee as nextTick,
-  ue as provide,
-  f as ref,
-  _e as registerBuiltinComponents,
-  q as registerErrorBoundary,
-  $ as registerKeepAlive,
-  P as registerSuspense,
-  te as scheduleWithPriority,
-  G as setDevMode,
-  Y as unsafeHTML,
-  we as updateHealthMetric,
-  se as useDesignTokens,
-  de as useEmit,
-  A as useExpose,
-  re as useGlobalStyle,
-  ce as useOnAttributeChanged,
-  ie as useOnConnected,
-  oe as useOnDisconnected,
-  I as useOnError,
-  k as useProps,
-  he as useSlots,
-  fe as useStyle,
-  Re as useTeleport,
-  W as watch,
-  Q as watchEffect
-};
+//#endregion
+export { l as ReactiveState, g as component, c as computed, k as createComposable, H as createHealthMonitor, y as css, f as decodeEntities, M as defineModel, t as devLog, a as flushDOMUpdates, E as getCurrentComponentContext, W as getHealthMonitor, K as getHealthStatus, v as html, L as hydrateApp, x as inject, o as isReactiveState, i as nextTick, N as provide, h as ref, Z as registerBuiltinComponents, X as registerErrorBoundary, q as registerKeepAlive, Y as registerSuspense, u as scheduleWithPriority, e as setDevMode, d as unsafeHTML, G as updateHealthMetric, D as useDesignTokens, P as useEmit, S as useExpose, C as useGlobalStyle, j as useOnAttributeChanged, O as useOnConnected, T as useOnDisconnected, w as useOnError, b as useProps, F as useSlots, I as useStyle, Q as useTeleport, s as watch, m as watchEffect };
 
 //# sourceMappingURL=custom-elements-runtime.es.js.map