@praxisjs/devtools 0.2.2 → 0.2.4

package/dist/index.js

@@ -1,33 +1,33 @@
-var Bt = Object.create;
+var Tt = Object.create;
 var pe = Object.defineProperty;
-var Ht = Object.getOwnPropertyDescriptor;
-var Ae = (r, t) => (t = Symbol[r]) ? t : /* @__PURE__ */ Symbol.for("Symbol." + r), J = (r) => {
+var qt = Object.getOwnPropertyDescriptor;
+var Ae = (r, t) => (t = Symbol[r]) ? t : /* @__PURE__ */ Symbol.for("Symbol." + r), q = (r) => {
   throw TypeError(r);
 };
-var Fe = (r, t, e) => t in r ? pe(r, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : r[t] = e;
-var Ne = (r, t) => pe(r, "name", { value: t, configurable: !0 });
-var b = (r) => [, , , Bt(r?.[Ae("metadata")] ?? null)], Be = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"], Y = (r) => r !== void 0 && typeof r != "function" ? J("Function expected") : r, Gt = (r, t, e, n, i) => ({ kind: Be[r], name: t, metadata: n, addInitializer: (s) => e._ ? J("Already initialized") : i.push(Y(s || null)) }), Tt = (r, t) => Fe(t, Ae("metadata"), r[3]), a = (r, t, e, n) => {
-  for (var i = 0, s = r[t >> 1], l = s && s.length; i < l; i++) t & 1 ? s[i].call(e) : n = s[i].call(e, n);
+var Be = (r, t, e) => t in r ? pe(r, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : r[t] = e;
+var Ue = (r, t) => pe(r, "name", { value: t, configurable: !0 });
+var b = (r) => [, , , Tt(r?.[Ae("metadata")] ?? null)], He = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"], T = (r) => r !== void 0 && typeof r != "function" ? q("Function expected") : r, Xt = (r, t, e, n, i) => ({ kind: He[r], name: t, metadata: n, addInitializer: (a) => e._ ? q("Already initialized") : i.push(T(a || null)) }), Kt = (r, t) => Be(t, Ae("metadata"), r[3]), s = (r, t, e, n) => {
+  for (var i = 0, a = r[t >> 1], c = a && a.length; i < c; i++) t & 1 ? a[i].call(e) : n = a[i].call(e, n);
   return n;
-}, d = (r, t, e, n, i, s) => {
-  var l, p, g, h, m, u = t & 7, k = !!(t & 8), z = !!(t & 16), _ = u > 3 ? r.length + 1 : u ? k ? 1 : 2 : 0, U = Be[u + 5], W = u > 3 && (r[_ - 1] = []), Ft = r[_] || (r[_] = []), L = u && (!z && !k && (i = i.prototype), u < 5 && (u > 3 || !z) && Ht(u < 4 ? i : { get [e]() {
-    return Ue(this, s);
-  }, set [e](C) {
-    return Oe(this, s, C);
+}, l = (r, t, e, n, i, a) => {
+  var c, p, g, h, w, u = t & 7, k = !!(t & 8), z = !!(t & 16), j = u > 3 ? r.length + 1 : u ? k ? 1 : 2 : 0, A = He[u + 5], R = u > 3 && (r[j - 1] = []), Rt = r[j] || (r[j] = []), $ = u && (!z && !k && (i = i.prototype), u < 5 && (u > 3 || !z) && qt(u < 4 ? i : { get [e]() {
+    return Oe(this, a);
+  }, set [e](M) {
+    return Fe(this, a, M);
   } }, e));
-  u ? z && u < 4 && Ne(s, (u > 2 ? "set " : u > 1 ? "get " : "") + e) : Ne(i, e);
-  for (var ce = n.length - 1; ce >= 0; ce--)
-    h = Gt(u, e, g = {}, r[3], Ft), u && (h.static = k, h.private = z, m = h.access = { has: z ? (C) => Rt(i, C) : (C) => e in C }, u ^ 3 && (m.get = z ? (C) => (u ^ 1 ? Ue : Wt)(C, i, u ^ 4 ? s : L.get) : (C) => C[e]), u > 2 && (m.set = z ? (C, de) => Oe(C, i, de, u ^ 4 ? s : L.set) : (C, de) => C[e] = de)), p = (0, n[ce])(u ? u < 4 ? z ? s : L[U] : u > 4 ? void 0 : { get: L.get, set: L.set } : i, h), g._ = 1, u ^ 4 || p === void 0 ? Y(p) && (u > 4 ? W.unshift(p) : u ? z ? s = p : L[U] = p : i = p) : typeof p != "object" || p === null ? J("Object expected") : (Y(l = p.get) && (L.get = l), Y(l = p.set) && (L.set = l), Y(l = p.init) && W.unshift(l));
-  return u || Tt(r, i), L && pe(i, e, L), z ? u ^ 4 ? s : L : i;
-}, f = (r, t, e) => Fe(r, typeof t != "symbol" ? t + "" : t, e), ue = (r, t, e) => t.has(r) || J("Cannot " + e), Rt = (r, t) => Object(t) !== t ? J('Cannot use the "in" operator on this value') : r.has(t), Ue = (r, t, e) => (ue(r, t, "read from private field"), e ? e.call(r) : t.get(r));
-var Oe = (r, t, e, n) => (ue(r, t, "write to private field"), n ? n.call(r, e) : t.set(r, e), e), Wt = (r, t, e) => (ue(r, t, "access private method"), e);
-import { jsxs as c, jsx as o } from "@praxisjs/jsx/jsx-runtime";
-import { StatelessComponent as w, StatefulComponent as R } from "@praxisjs/core";
-import { Component as x, State as M } from "@praxisjs/decorators";
-import { render as He } from "@praxisjs/runtime";
-import { computed as Yt } from "@praxisjs/core/internal";
-const At = "data:image/svg+xml,%3csvg%20width='1024'%20height='1024'%20viewBox='0%200%201024%201024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M605.411%20445.66L641.322%20498.293L641.342%20498.278L697.538%20578.57L742.673%20512.806L512.5%20178.878L281.327%20512.806L512.5%20848.182L603.519%20715.561L650.559%20782.134L512.701%20983L187%20510.478L512.701%2040L837%20510.478L698.206%20712.709L668.895%20671.104L604.033%20578.775L512%20712.504L373.199%20511.5L512.233%20309.092L584.13%20414.469L536.746%20480.456L513.69%20445.66L466.305%20511.5L512.166%20577.425L556.48%20513.91L605.411%20445.66Z'%20fill='url(%23paint0_linear_3024_20)'/%3e%3cdefs%3e%3clinearGradient%20id='paint0_linear_3024_20'%20x1='512'%20y1='40'%20x2='512'%20y2='983'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%239B76FF'%20stop-opacity='0.86'/%3e%3cstop%20offset='1'%20stop-color='%232D246B'/%3e%3c/linearGradient%3e%3c/defs%3e%3c/svg%3e", Jt = '*,:before,:after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }:host{all:initial;display:block;font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif}*{box-sizing:border-box}input::placeholder{color:#6f6a8f}input:focus{outline:none;box-shadow:0 0 0 2px #9b90e64d}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#9b90e633;border-radius:2px}::-webkit-scrollbar-thumb:hover{background:#9b90e666}.container{width:100%}@media(min-width:640px){.container{max-width:640px}}@media(min-width:768px){.container{max-width:768px}}@media(min-width:1024px){.container{max-width:1024px}}@media(min-width:1280px){.container{max-width:1280px}}@media(min-width:1536px){.container{max-width:1536px}}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.bottom-0{bottom:0}.bottom-5{bottom:1.25rem}.left-0{left:0}.right-0{right:0}.right-5{right:1.25rem}.top-0{top:0}.top-full{top:100%}.z-\\[2147483647\\]{z-index:2147483647}.z-10{z-index:10}.grid{display:grid}.grid-cols-\\[1\\.2fr_0\\.8fr_1fr_auto\\]{grid-template-columns:1.2fr .8fr 1fr auto}.m6{margin:1.5rem}.mx-1{margin-left:.25rem;margin-right:.25rem}.mr-\\[2px\\]{margin-right:2px}.ms{margin-inline-start:1rem}.mt-1{margin-top:.25rem}.box-border{box-sizing:border-box}.inline-block{display:inline-block}.h-\\[13px\\]{height:13px}.h-\\[22px\\]{height:22px}.h-\\[2px\\]{height:2px}.h-\\[32px\\]{height:32px}.h-\\[6px\\]{height:6px}.h-1{height:.25rem}.h-10{height:2.5rem}.h-3{height:.75rem}.h-7{height:1.75rem}.h-full{height:100%}.h-screen{height:100vh}.max-w-\\[200px\\]{max-width:200px}.min-w-0{min-width:0}.w-\\[13px\\]{width:13px}.w-\\[22px\\]{width:22px}.w-\\[2px\\]{width:2px}.w-\\[6px\\]{width:6px}.w-1{width:.25rem}.w-10{width:2.5rem}.w-12{width:3rem}.w-4{width:1rem}.w-full{width:100%}.w-px{width:1px}.flex{display:flex}.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}.flex-row-reverse{flex-direction:row-reverse}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.flex-wrap{flex-wrap:wrap}.cursor-\\[ew-resize\\]{cursor:ew-resize}.cursor-\\[ns-resize\\]{cursor:ns-resize}.cursor-default{cursor:default}.cursor-pointer{cursor:pointer}.select-none{-webkit-user-select:none;user-select:none}.items-center{align-items:center}.items-stretch{align-items:stretch}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-\\[2px\\]{gap:2px}.gap-\\[3px\\]{gap:3px}.gap-\\[6px\\]{gap:6px}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.border{border-width:1px}.border-b{border-bottom-width:1px}.border-l{border-left-width:1px}.border-r{border-right-width:1px}.border-t{border-top-width:1px}.border-border{--un-border-opacity:.25;border-color:rgba(155,144,230,var(--un-border-opacity))}.border-warn{--un-border-opacity:1;border-color:rgb(217 119 6 / var(--un-border-opacity))}.hover\\:border-accent:hover{--un-border-opacity:1;border-color:rgb(155 144 230 / var(--un-border-opacity))}.rounded{border-radius:.25rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-md{border-radius:.375rem}.rounded-xl{border-radius:.75rem}.rounded-r{border-top-right-radius:.25rem;border-bottom-right-radius:.25rem}.bg-\\[rgba\\(124\\,109\\,214\\,0\\.14\\)\\]{--un-bg-opacity:.14;background-color:rgba(124,109,214,var(--un-bg-opacity))}.bg-\\[rgba\\(14\\,165\\,122\\,0\\.14\\)\\]{--un-bg-opacity:.14;background-color:rgba(14,165,122,var(--un-bg-opacity))}.bg-\\[rgba\\(155\\,144\\,230\\,0\\.14\\)\\]{--un-bg-opacity:.14;background-color:rgba(155,144,230,var(--un-bg-opacity))}.bg-\\[rgba\\(217\\,119\\,6\\,0\\.14\\)\\]{--un-bg-opacity:.14;background-color:rgba(217,119,6,var(--un-bg-opacity))}.bg-\\[rgba\\(220\\,38\\,38\\,0\\.14\\)\\]{--un-bg-opacity:.14;background-color:rgba(220,38,38,var(--un-bg-opacity))}.bg-\\[rgba\\(74\\,222\\,128\\,0\\.12\\)\\]{--un-bg-opacity:.12;background-color:rgba(74,222,128,var(--un-bg-opacity))}.bg-accent{--un-bg-opacity:1;background-color:rgb(155 144 230 / var(--un-bg-opacity))}.bg-bg{--un-bg-opacity:1;background-color:rgb(15 13 23 / var(--un-bg-opacity))}.bg-border{--un-bg-opacity:.25;background-color:rgba(155,144,230,var(--un-bg-opacity))}.bg-header{--un-bg-opacity:1;background-color:rgb(22 19 38 / var(--un-bg-opacity))}.bg-input,.bg-section{--un-bg-opacity:1;background-color:rgb(27 24 48 / var(--un-bg-opacity))}.bg-selected{--un-bg-opacity:1;background-color:rgb(34 30 61 / var(--un-bg-opacity))}.bg-soft{--un-bg-opacity:.18;background-color:rgba(155,144,230,var(--un-bg-opacity))}.bg-subtle{--un-bg-opacity:1;background-color:rgb(111 106 143 / var(--un-bg-opacity))}.bg-success{--un-bg-opacity:1;background-color:rgb(14 165 122 / var(--un-bg-opacity))}.bg-transparent{background-color:transparent}.hover\\:bg-accent:hover{--un-bg-opacity:1;background-color:rgb(155 144 230 / var(--un-bg-opacity))}.hover\\:bg-section:hover{--un-bg-opacity:1;background-color:rgb(27 24 48 / var(--un-bg-opacity))}.hover\\:bg-soft:hover{--un-bg-opacity:.18;background-color:rgba(155,144,230,var(--un-bg-opacity))}.p-1{padding:.25rem}.px{padding-left:1rem;padding-right:1rem}.px-\\[6px\\]{padding-left:6px;padding-right:6px}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-\\[2px\\]{padding-top:2px;padding-bottom:2px}.py-\\[3px\\]{padding-top:3px;padding-bottom:3px}.py-\\[4px\\]{padding-top:4px;padding-bottom:4px}.py-\\[5px\\]{padding-top:5px;padding-bottom:5px}.py-12{padding-top:3rem;padding-bottom:3rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.pl-\\[10px\\]{padding-left:10px}.pl-\\[56px\\]{padding-left:56px}.pl-1{padding-left:.25rem}.pr-\\[14px\\]{padding-right:14px}.pr-3{padding-right:.75rem}.text-center{text-align:center}.text-right{text-align:right}.text-\\[10px\\]{font-size:10px}.text-\\[11px\\]{font-size:11px}.text-\\[12px\\]{font-size:12px}.text-\\[20px\\]{font-size:20px}.text-\\[9px\\]{font-size:9px}.text-\\[\\#0ea57a\\]{--un-text-opacity:1;color:rgb(14 165 122 / var(--un-text-opacity))}.text-\\[\\#4ade80\\]{--un-text-opacity:1;color:rgb(74 222 128 / var(--un-text-opacity))}.text-\\[\\#7c6dd6\\]{--un-text-opacity:1;color:rgb(124 109 214 / var(--un-text-opacity))}.text-\\[\\#9b90e6\\],.text-accent{--un-text-opacity:1;color:rgb(155 144 230 / var(--un-text-opacity))}.text-\\[\\#d97706\\],.text-warn{--un-text-opacity:1;color:rgb(217 119 6 / var(--un-text-opacity))}.text-\\[\\#dc2626\\]{--un-text-opacity:1;color:rgb(220 38 38 / var(--un-text-opacity))}.text-muted{--un-text-opacity:1;color:rgb(199 195 230 / var(--un-text-opacity))}.text-subtle{--un-text-opacity:1;color:rgb(111 106 143 / var(--un-text-opacity))}.text-text,.hover\\:text-text:hover{--un-text-opacity:1;color:rgb(244 242 255 / var(--un-text-opacity))}.color-white{--un-text-opacity:1;color:rgb(255 255 255 / var(--un-text-opacity))}.hover\\:color-muted:hover{--un-text-opacity:1;color:rgb(199 195 230 / var(--un-text-opacity))}.font-bold{font-weight:700}.font-semibold{font-weight:600}.leading-none{line-height:1}.leading-relaxed{line-height:1.625}.tracking-\\[0\\.07em\\]{letter-spacing:.07em}.tracking-\\[0\\.12em\\]{letter-spacing:.12em}.tracking-widest{letter-spacing:.1em}.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.font-sans{font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji"}.uppercase{text-transform:uppercase}.tabular-nums{--un-numeric-spacing:tabular-nums;font-variant-numeric:var(--un-ordinal) var(--un-slashed-zero) var(--un-numeric-figure) var(--un-numeric-spacing) var(--un-numeric-fraction)}.shadow{--un-shadow:var(--un-shadow-inset) 0 1px 3px 0 var(--un-shadow-color, rgb(0 0 0 / .1)),var(--un-shadow-inset) 0 1px 2px -1px var(--un-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)}.shadow-\\[0_8px_32px_rgba\\(0\\,0\\,0\\,0\\.7\\)\\]{--un-shadow:0 8px 32px var(--un-shadow-color, rgba(0, 0, 0, .7));box-shadow:var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)}.shadow-lg{--un-shadow:var(--un-shadow-inset) 0 10px 15px -3px var(--un-shadow-color, rgb(0 0 0 / .1)),var(--un-shadow-inset) 0 4px 6px -4px var(--un-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)}.hover\\:shadow-\\[0_8px_32px_rgba\\(56\\,189\\,248\\,0\\.1\\)\\]:hover{--un-shadow:0 8px 32px var(--un-shadow-color, rgba(56, 189, 248, .1));box-shadow:var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)}.outline-none{outline:2px solid transparent;outline-offset:2px}.filter{filter:var(--un-blur) var(--un-brightness) var(--un-contrast) var(--un-drop-shadow) var(--un-grayscale) var(--un-hue-rotate) var(--un-invert) var(--un-saturate) var(--un-sepia)}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-shadow{transition-property:box-shadow;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-100{transition-duration:.1s}.duration-150{transition-duration:.15s}.duration-200{transition-duration:.2s}';
-class qt {
+  u ? z && u < 4 && Ue(a, (u > 2 ? "set " : u > 1 ? "get " : "") + e) : Ue(i, e);
+  for (var de = n.length - 1; de >= 0; de--)
+    h = Xt(u, e, g = {}, r[3], Rt), u && (h.static = k, h.private = z, w = h.access = { has: z ? (M) => Zt(i, M) : (M) => e in M }, u ^ 3 && (w.get = z ? (M) => (u ^ 1 ? Oe : Qt)(M, i, u ^ 4 ? a : $.get) : (M) => M[e]), u > 2 && (w.set = z ? (M, ue) => Fe(M, i, ue, u ^ 4 ? a : $.set) : (M, ue) => M[e] = ue)), p = (0, n[de])(u ? u < 4 ? z ? a : $[A] : u > 4 ? void 0 : { get: $.get, set: $.set } : i, h), g._ = 1, u ^ 4 || p === void 0 ? T(p) && (u > 4 ? R.unshift(p) : u ? z ? a = p : $[A] = p : i = p) : typeof p != "object" || p === null ? q("Object expected") : (T(c = p.get) && ($.get = c), T(c = p.set) && ($.set = c), T(c = p.init) && R.unshift(c));
+  return u || Kt(r, i), $ && pe(i, e, $), z ? u ^ 4 ? a : $ : i;
+}, f = (r, t, e) => Be(r, typeof t != "symbol" ? t + "" : t, e), he = (r, t, e) => t.has(r) || q("Cannot " + e), Zt = (r, t) => Object(t) !== t ? q('Cannot use the "in" operator on this value') : r.has(t), Oe = (r, t, e) => (he(r, t, "read from private field"), e ? e.call(r) : t.get(r));
+var Fe = (r, t, e, n) => (he(r, t, "write to private field"), n ? n.call(r, e) : t.set(r, e), e), Qt = (r, t, e) => (he(r, t, "access private method"), e);
+import { jsxs as d, jsx as o } from "@praxisjs/jsx/jsx-runtime";
+import { StatelessComponent as y, StatefulComponent as J } from "@praxisjs/core";
+import { Component as m, State as C, Prop as Z, Emit as Vt } from "@praxisjs/decorators";
+import { render as Ge } from "@praxisjs/runtime";
+import { computed as Pt } from "@praxisjs/core/internal";
+const Jt = "data:image/svg+xml,%3csvg%20width='1024'%20height='1024'%20viewBox='0%200%201024%201024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M605.411%20445.66L641.322%20498.293L641.342%20498.278L697.538%20578.57L742.673%20512.806L512.5%20178.878L281.327%20512.806L512.5%20848.182L603.519%20715.561L650.559%20782.134L512.701%20983L187%20510.478L512.701%2040L837%20510.478L698.206%20712.709L668.895%20671.104L604.033%20578.775L512%20712.504L373.199%20511.5L512.233%20309.092L584.13%20414.469L536.746%20480.456L513.69%20445.66L466.305%20511.5L512.166%20577.425L556.48%20513.91L605.411%20445.66Z'%20fill='url(%23paint0_linear_3024_20)'/%3e%3cdefs%3e%3clinearGradient%20id='paint0_linear_3024_20'%20x1='512'%20y1='40'%20x2='512'%20y2='983'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%239B76FF'%20stop-opacity='0.86'/%3e%3cstop%20offset='1'%20stop-color='%232D246B'/%3e%3c/linearGradient%3e%3c/defs%3e%3c/svg%3e", en = '*,:before,:after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }:host{all:initial;display:block;font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif}*{box-sizing:border-box}input::placeholder{color:#6f6a8f}input:focus{outline:none;box-shadow:0 0 0 2px #9b90e64d}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#9b90e633;border-radius:2px}::-webkit-scrollbar-thumb:hover{background:#9b90e666}.container{width:100%}@media(min-width:640px){.container{max-width:640px}}@media(min-width:768px){.container{max-width:768px}}@media(min-width:1024px){.container{max-width:1024px}}@media(min-width:1280px){.container{max-width:1280px}}@media(min-width:1536px){.container{max-width:1536px}}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.bottom-0{bottom:0}.bottom-5{bottom:1.25rem}.left-0{left:0}.right-0{right:0}.right-5{right:1.25rem}.top-0{top:0}.top-full{top:100%}.z-\\[2147483647\\]{z-index:2147483647}.z-10{z-index:10}.grid{display:grid}.grid-cols-\\[1\\.2fr_0\\.8fr_1fr_auto\\]{grid-template-columns:1.2fr .8fr 1fr auto}.m6{margin:1.5rem}.mx-1{margin-left:.25rem;margin-right:.25rem}.mr-\\[2px\\]{margin-right:2px}.ms{margin-inline-start:1rem}.mt-1{margin-top:.25rem}.box-border{box-sizing:border-box}.inline-block{display:inline-block}.h-\\[13px\\]{height:13px}.h-\\[22px\\]{height:22px}.h-\\[2px\\]{height:2px}.h-\\[32px\\]{height:32px}.h-\\[6px\\]{height:6px}.h-1{height:.25rem}.h-10{height:2.5rem}.h-3{height:.75rem}.h-7{height:1.75rem}.h-full{height:100%}.h-screen{height:100vh}.max-w-\\[200px\\]{max-width:200px}.min-w-0{min-width:0}.w-\\[13px\\]{width:13px}.w-\\[22px\\]{width:22px}.w-\\[2px\\]{width:2px}.w-\\[6px\\]{width:6px}.w-1{width:.25rem}.w-10{width:2.5rem}.w-12{width:3rem}.w-4{width:1rem}.w-full{width:100%}.w-px{width:1px}.flex{display:flex}.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}.flex-row-reverse{flex-direction:row-reverse}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.flex-wrap{flex-wrap:wrap}.cursor-\\[ew-resize\\]{cursor:ew-resize}.cursor-\\[ns-resize\\]{cursor:ns-resize}.cursor-default{cursor:default}.cursor-pointer{cursor:pointer}.select-none{-webkit-user-select:none;user-select:none}.items-center{align-items:center}.items-stretch{align-items:stretch}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-\\[2px\\]{gap:2px}.gap-\\[3px\\]{gap:3px}.gap-\\[6px\\]{gap:6px}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.border{border-width:1px}.border-b{border-bottom-width:1px}.border-l{border-left-width:1px}.border-r{border-right-width:1px}.border-t{border-top-width:1px}.border-border{--un-border-opacity:.25;border-color:rgba(155,144,230,var(--un-border-opacity))}.border-warn{--un-border-opacity:1;border-color:rgb(217 119 6 / var(--un-border-opacity))}.hover\\:border-accent:hover{--un-border-opacity:1;border-color:rgb(155 144 230 / var(--un-border-opacity))}.rounded{border-radius:.25rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-md{border-radius:.375rem}.rounded-xl{border-radius:.75rem}.rounded-r{border-top-right-radius:.25rem;border-bottom-right-radius:.25rem}.bg-\\[rgba\\(124\\,109\\,214\\,0\\.14\\)\\]{--un-bg-opacity:.14;background-color:rgba(124,109,214,var(--un-bg-opacity))}.bg-\\[rgba\\(14\\,165\\,122\\,0\\.14\\)\\]{--un-bg-opacity:.14;background-color:rgba(14,165,122,var(--un-bg-opacity))}.bg-\\[rgba\\(155\\,144\\,230\\,0\\.14\\)\\]{--un-bg-opacity:.14;background-color:rgba(155,144,230,var(--un-bg-opacity))}.bg-\\[rgba\\(217\\,119\\,6\\,0\\.14\\)\\]{--un-bg-opacity:.14;background-color:rgba(217,119,6,var(--un-bg-opacity))}.bg-\\[rgba\\(220\\,38\\,38\\,0\\.14\\)\\]{--un-bg-opacity:.14;background-color:rgba(220,38,38,var(--un-bg-opacity))}.bg-\\[rgba\\(74\\,222\\,128\\,0\\.12\\)\\]{--un-bg-opacity:.12;background-color:rgba(74,222,128,var(--un-bg-opacity))}.bg-accent{--un-bg-opacity:1;background-color:rgb(155 144 230 / var(--un-bg-opacity))}.bg-bg{--un-bg-opacity:1;background-color:rgb(15 13 23 / var(--un-bg-opacity))}.bg-border{--un-bg-opacity:.25;background-color:rgba(155,144,230,var(--un-bg-opacity))}.bg-header{--un-bg-opacity:1;background-color:rgb(22 19 38 / var(--un-bg-opacity))}.bg-input,.bg-section{--un-bg-opacity:1;background-color:rgb(27 24 48 / var(--un-bg-opacity))}.bg-selected{--un-bg-opacity:1;background-color:rgb(34 30 61 / var(--un-bg-opacity))}.bg-soft{--un-bg-opacity:.18;background-color:rgba(155,144,230,var(--un-bg-opacity))}.bg-subtle{--un-bg-opacity:1;background-color:rgb(111 106 143 / var(--un-bg-opacity))}.bg-success{--un-bg-opacity:1;background-color:rgb(14 165 122 / var(--un-bg-opacity))}.bg-transparent{background-color:transparent}.hover\\:bg-accent:hover{--un-bg-opacity:1;background-color:rgb(155 144 230 / var(--un-bg-opacity))}.hover\\:bg-section:hover{--un-bg-opacity:1;background-color:rgb(27 24 48 / var(--un-bg-opacity))}.hover\\:bg-soft:hover{--un-bg-opacity:.18;background-color:rgba(155,144,230,var(--un-bg-opacity))}.p-1{padding:.25rem}.px{padding-left:1rem;padding-right:1rem}.px-\\[6px\\]{padding-left:6px;padding-right:6px}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-\\[2px\\]{padding-top:2px;padding-bottom:2px}.py-\\[3px\\]{padding-top:3px;padding-bottom:3px}.py-\\[4px\\]{padding-top:4px;padding-bottom:4px}.py-\\[5px\\]{padding-top:5px;padding-bottom:5px}.py-12{padding-top:3rem;padding-bottom:3rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.pl-\\[10px\\]{padding-left:10px}.pl-\\[56px\\]{padding-left:56px}.pl-1{padding-left:.25rem}.pr-\\[14px\\]{padding-right:14px}.pr-3{padding-right:.75rem}.text-center{text-align:center}.text-right{text-align:right}.text-\\[10px\\]{font-size:10px}.text-\\[11px\\]{font-size:11px}.text-\\[12px\\]{font-size:12px}.text-\\[20px\\]{font-size:20px}.text-\\[9px\\]{font-size:9px}.text-\\[\\#0ea57a\\]{--un-text-opacity:1;color:rgb(14 165 122 / var(--un-text-opacity))}.text-\\[\\#4ade80\\]{--un-text-opacity:1;color:rgb(74 222 128 / var(--un-text-opacity))}.text-\\[\\#7c6dd6\\]{--un-text-opacity:1;color:rgb(124 109 214 / var(--un-text-opacity))}.text-\\[\\#9b90e6\\],.text-accent{--un-text-opacity:1;color:rgb(155 144 230 / var(--un-text-opacity))}.text-\\[\\#d97706\\],.text-warn{--un-text-opacity:1;color:rgb(217 119 6 / var(--un-text-opacity))}.text-\\[\\#dc2626\\]{--un-text-opacity:1;color:rgb(220 38 38 / var(--un-text-opacity))}.text-muted{--un-text-opacity:1;color:rgb(199 195 230 / var(--un-text-opacity))}.text-subtle{--un-text-opacity:1;color:rgb(111 106 143 / var(--un-text-opacity))}.text-text,.hover\\:text-text:hover{--un-text-opacity:1;color:rgb(244 242 255 / var(--un-text-opacity))}.color-white{--un-text-opacity:1;color:rgb(255 255 255 / var(--un-text-opacity))}.hover\\:color-muted:hover{--un-text-opacity:1;color:rgb(199 195 230 / var(--un-text-opacity))}.font-bold{font-weight:700}.font-semibold{font-weight:600}.leading-none{line-height:1}.leading-relaxed{line-height:1.625}.tracking-\\[0\\.07em\\]{letter-spacing:.07em}.tracking-\\[0\\.12em\\]{letter-spacing:.12em}.tracking-widest{letter-spacing:.1em}.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.font-sans{font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji"}.uppercase{text-transform:uppercase}.tabular-nums{--un-numeric-spacing:tabular-nums;font-variant-numeric:var(--un-ordinal) var(--un-slashed-zero) var(--un-numeric-figure) var(--un-numeric-spacing) var(--un-numeric-fraction)}.shadow{--un-shadow:var(--un-shadow-inset) 0 1px 3px 0 var(--un-shadow-color, rgb(0 0 0 / .1)),var(--un-shadow-inset) 0 1px 2px -1px var(--un-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)}.shadow-\\[0_8px_32px_rgba\\(0\\,0\\,0\\,0\\.7\\)\\]{--un-shadow:0 8px 32px var(--un-shadow-color, rgba(0, 0, 0, .7));box-shadow:var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)}.shadow-lg{--un-shadow:var(--un-shadow-inset) 0 10px 15px -3px var(--un-shadow-color, rgb(0 0 0 / .1)),var(--un-shadow-inset) 0 4px 6px -4px var(--un-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)}.hover\\:shadow-\\[0_8px_32px_rgba\\(56\\,189\\,248\\,0\\.1\\)\\]:hover{--un-shadow:0 8px 32px var(--un-shadow-color, rgba(56, 189, 248, .1));box-shadow:var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)}.outline-none{outline:2px solid transparent;outline-offset:2px}.filter{filter:var(--un-blur) var(--un-brightness) var(--un-contrast) var(--un-drop-shadow) var(--un-grayscale) var(--un-hue-rotate) var(--un-invert) var(--un-saturate) var(--un-sepia)}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-shadow{transition-property:box-shadow;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-100{transition-duration:.1s}.duration-150{transition-duration:.15s}.duration-200{transition-duration:.2s}';
+class tn {
   handlers = /* @__PURE__ */ new Map();
   on(t, e) {
     return this.handlers.has(t) || this.handlers.set(t, /* @__PURE__ */ new Set()), this.handlers.get(t).add(e), () => this.handlers.get(t)?.delete(e);
@@ -38,38 +38,38 @@ class qt {
     });
   }
 }
-const Xt = 200;
-let Kt = 0;
-function Ge() {
-  return `v${(++Kt).toString()}_${Date.now().toString(36)}`;
+const nn = 200;
+let rn = 0;
+function We() {
+  return `v${(++rn).toString()}_${Date.now().toString(36)}`;
 }
 class v {
   static _instance = null;
   static get instance() {
     return v._instance ??= new v(), v._instance;
   }
-  bus = new qt();
+  bus = new tn();
   instanceIds = /* @__PURE__ */ new WeakMap();
   signals = /* @__PURE__ */ new Map();
   components = /* @__PURE__ */ new Map();
   timeline = [];
   getInstanceId(t) {
-    return this.instanceIds.has(t) || this.instanceIds.set(t, Ge()), this.instanceIds.get(t);
+    return this.instanceIds.has(t) || this.instanceIds.set(t, We()), this.instanceIds.get(t);
   }
   registerSignal(t, e, n, i) {
-    const s = this.getInstanceId(t), l = `${s}:${e}`, p = {
-      id: l,
+    const a = this.getInstanceId(t), c = `${a}:${e}`, p = {
+      id: c,
       label: e,
-      componentId: s,
+      componentId: a,
       componentName: i,
       value: n,
       history: [{ value: n, timestamp: Date.now() }],
       changedAt: Date.now()
     };
-    this.signals.set(l, p), this.bus.emit("signal:registered", p);
+    this.signals.set(c, p), this.bus.emit("signal:registered", p);
   }
   updateSignal(t, e, n, i) {
-    const l = `${this.getInstanceId(t)}:${e}`, p = this.signals.get(l);
+    const c = `${this.getInstanceId(t)}:${e}`, p = this.signals.get(c);
     if (!p) return;
     const g = [
       ...p.history,
@@ -80,10 +80,10 @@ class v {
       history: g,
       changedAt: Date.now()
     };
-    this.signals.set(l, h), this.bus.emit("signal:changed", { entry: h, oldValue: i }), this.pushTimeline({
+    this.signals.set(c, h), this.bus.emit("signal:changed", { entry: h, oldValue: i }), this.pushTimeline({
       type: "signal:change",
       label: `${p.componentName}.${e}`,
-      data: { old: i, new: n, signalId: l }
+      data: { old: i, new: n, signalId: c }
     });
   }
   registerComponent(t, e) {
@@ -113,11 +113,11 @@ class v {
   recordLifecycle(t, e) {
     const n = this.getInstanceId(t), i = this.components.get(n);
     if (!i) return;
-    const s = { hook: e, timestamp: Date.now() };
-    i.lifecycle.push(s), this.bus.emit("lifecycle", { componentId: n, name: i.name, hook: e });
-    const l = e === "onUnmount" ? "component:unmount" : e === "onBeforeMount" ? "component:mount" : "lifecycle";
+    const a = { hook: e, timestamp: Date.now() };
+    i.lifecycle.push(a), this.bus.emit("lifecycle", { componentId: n, name: i.name, hook: e });
+    const c = e === "onUnmount" ? "component:unmount" : e === "onBeforeMount" ? "component:mount" : "lifecycle";
     if (this.pushTimeline({
-      type: l,
+      type: c,
       label: `<${i.name}>.${e}`,
       data: { componentId: n, hook: e }
     }), e === "onUnmount") {
@@ -126,16 +126,16 @@ class v {
         g.componentId === n && this.signals.delete(p);
     }
   }
-  recordMethodCall(t, e, n, i, s, l) {
+  recordMethodCall(t, e, n, i, a, c) {
     const p = this.getInstanceId(t);
     this.pushTimeline({
       type: "method:call",
-      label: `${l}.${e}()`,
+      label: `${c}.${e}()`,
       data: {
         componentId: p,
         args: n,
         result: i,
-        duration: +s.toFixed(3)
+        duration: +a.toFixed(3)
       }
     });
   }
@@ -153,27 +153,27 @@ class v {
   }
   pushTimeline(t) {
     const e = {
-      id: Ge(),
+      id: We(),
       timestamp: Date.now(),
       ...t
     };
-    this.timeline.push(e), this.timeline.length > Xt && this.timeline.shift(), this.bus.emit("timeline:push", e);
+    this.timeline.push(e), this.timeline.length > nn && this.timeline.shift(), this.bus.emit("timeline:push", e);
   }
 }
-var Ye, he, an;
-Ye = [x()];
-class H extends (an = w) {
+var Te, ge, bn;
+Te = [m()];
+class G extends (bn = y) {
   render() {
-    return /* @__PURE__ */ c("div", { class: "flex flex-col items-center justify-center gap-2 py-12", children: [
+    return /* @__PURE__ */ d("div", { class: "flex flex-col items-center justify-center gap-2 py-12", children: [
       /* @__PURE__ */ o("span", { class: "text-subtle text-[20px] leading-none select-none font-mono", children: "—" }),
       /* @__PURE__ */ o("p", { class: "text-subtle text-[11px] text-center leading-relaxed max-w-[200px]", children: this.props.message })
     ] });
   }
 }
-he = b(an), H = d(he, 0, "EmptyState", Ye, H), a(he, 1, H);
-var Je, ge, ln;
-Je = [x()];
-class X extends (ln = w) {
+ge = b(bn), G = l(ge, 0, "EmptyState", Te, G), s(ge, 1, G);
+var qe, be, xn;
+qe = [m()];
+class X extends (xn = y) {
   render() {
     const { children: t, width: e = "280px" } = this.props;
     return /* @__PURE__ */ o(
@@ -186,8 +186,8 @@ class X extends (ln = w) {
     );
   }
 }
-ge = b(ln), X = d(ge, 0, "SidePanel", Je, X), a(ge, 1, X);
-function Ee(r) {
+be = b(xn), X = l(be, 0, "SidePanel", qe, X), s(be, 1, X);
+function Ne(r) {
   if (r === null) return "null";
   if (r === void 0) return "undefined";
   if (typeof r == "string") return `"${r}"`;
@@ -199,12 +199,12 @@ function Ee(r) {
     }
   return String(r);
 }
-var qe, be, cn;
-qe = [x()];
-class N extends (cn = w) {
+var Xe, xe, mn;
+Xe = [m()];
+class F extends (mn = y) {
   render() {
     const { k: t, v: e, signal: n } = this.props;
-    return /* @__PURE__ */ c("div", { class: "flex justify-between items-center px-3 py-2 border-b border-border gap-3", children: [
+    return /* @__PURE__ */ d("div", { class: "flex justify-between items-center px-3 py-2 border-b border-border gap-3", children: [
       /* @__PURE__ */ o(
         "span",
         {
@@ -216,21 +216,21 @@ class N extends (cn = w) {
     ] });
   }
 }
-be = b(cn), N = d(be, 0, "DetailRow", qe, N), a(be, 1, N);
-var Xe, xe, dn;
-Xe = [x()];
-class G extends (dn = w) {
+xe = b(mn), F = l(xe, 0, "DetailRow", Xe, F), s(xe, 1, F);
+var Ke, me, fn;
+Ke = [m()];
+class W extends (fn = y) {
   render() {
-    return /* @__PURE__ */ c("div", { class: "border-b border-border", children: [
+    return /* @__PURE__ */ d("div", { class: "border-b border-border", children: [
       /* @__PURE__ */ o("div", { class: "px-3 py-[4px] text-[9px] text-subtle font-bold tracking-[0.12em] uppercase bg-section border-b border-border", children: this.props.label }),
       this.props.children
     ] });
   }
 }
-xe = b(dn), G = d(xe, 0, "DetailSection", Xe, G), a(xe, 1, G);
-var Ke, me, pn;
-Ke = [x()];
-class K extends (pn = w) {
+me = b(fn), W = l(me, 0, "DetailSection", Ke, W), s(me, 1, W);
+var Ze, fe, wn;
+Ze = [m()];
+class K extends (wn = y) {
   render() {
     const { status: t } = this.props;
     return /* @__PURE__ */ o(
@@ -242,43 +242,43 @@ class K extends (pn = w) {
     );
   }
 }
-me = b(pn), K = d(me, 0, "StatusDot", Ke, K), a(me, 1, K);
-var Ze, fe, un;
-Ze = [x()];
-class Z extends (un = w) {
+fe = b(wn), K = l(fe, 0, "StatusDot", Ze, K), s(fe, 1, K);
+var Qe, we, yn;
+Qe = [m()];
+class Q extends (yn = y) {
   render() {
     const { entry: t, signals: e } = this.props;
-    return /* @__PURE__ */ c(X, { children: [
-      /* @__PURE__ */ c("div", { class: "px-3 py-2 border-b border-border flex items-center gap-2 bg-bg shrink-0", children: [
+    return /* @__PURE__ */ d(X, { children: [
+      /* @__PURE__ */ d("div", { class: "px-3 py-2 border-b border-border flex items-center gap-2 bg-bg shrink-0", children: [
         /* @__PURE__ */ o(K, { status: t.status }),
-        /* @__PURE__ */ c("span", { class: "text-accent font-mono text-[11px] font-semibold truncate pl-1", children: [
+        /* @__PURE__ */ d("span", { class: "text-accent font-mono text-[11px] font-semibold truncate pl-1", children: [
           "<",
           t.name,
           ">"
         ] })
       ] }),
-      /* @__PURE__ */ c("div", { class: "flex-1 overflow-y-auto", children: [
-        /* @__PURE__ */ c(G, { label: "Stats", children: [
-          /* @__PURE__ */ o(N, { k: "renders", v: String(t.renderCount) }),
+      /* @__PURE__ */ d("div", { class: "flex-1 overflow-y-auto", children: [
+        /* @__PURE__ */ d(W, { label: "Stats", children: [
+          /* @__PURE__ */ o(F, { k: "renders", v: String(t.renderCount) }),
           /* @__PURE__ */ o(
-            N,
+            F,
             {
               k: "last render",
               v: `${t.lastRenderDuration.toFixed(3)}ms`
             }
           ),
-          /* @__PURE__ */ o(N, { k: "status", v: t.status })
+          /* @__PURE__ */ o(F, { k: "status", v: t.status })
         ] }),
-        e.length > 0 && /* @__PURE__ */ o(G, { label: "State", children: e.map((n) => /* @__PURE__ */ o(
-          N,
+        e.length > 0 && /* @__PURE__ */ o(W, { label: "State", children: e.map((n) => /* @__PURE__ */ o(
+          F,
           {
             k: n.label,
-            v: Ee(n.value),
+            v: Ne(n.value),
             signal: !0
           },
           n.id
         )) }),
-        t.lifecycle.length > 0 && /* @__PURE__ */ o(G, { label: "Lifecycle", children: [...t.lifecycle].reverse().slice(0, 20).map((n, i) => /* @__PURE__ */ c(
+        t.lifecycle.length > 0 && /* @__PURE__ */ o(W, { label: "Lifecycle", children: [...t.lifecycle].reverse().slice(0, 20).map((n, i) => /* @__PURE__ */ d(
           "div",
           {
             class: "px-3 py-2 flex justify-between items-center border-b border-border",
@@ -293,13 +293,13 @@ class Z extends (un = w) {
     ] });
   }
 }
-fe = b(un), Z = d(fe, 0, "ComponentDetail", Ze, Z), a(fe, 1, Z);
-var Qe, we, hn;
-Qe = [x()];
-class Q extends (hn = w) {
+we = b(yn), Q = l(we, 0, "ComponentDetail", Qe, Q), s(we, 1, Q);
+var Ve, ye, vn;
+Ve = [m()];
+class V extends (vn = y) {
   render() {
     const { entry: t, selected: e, onClick: n } = this.props;
-    return /* @__PURE__ */ c(
+    return /* @__PURE__ */ d(
       "div",
       {
         onClick: n,
@@ -307,16 +307,16 @@ class Q extends (hn = w) {
         children: [
           () => e() && /* @__PURE__ */ o("span", { class: "absolute left-0 top-0 bottom-0 w-[2px] bg-accent rounded-r" }),
           /* @__PURE__ */ o(K, { status: t.status }),
-          /* @__PURE__ */ c("span", { class: "text-accent font-mono text-[11px] flex-1 truncate pl-1", children: [
+          /* @__PURE__ */ d("span", { class: "text-accent font-mono text-[11px] flex-1 truncate pl-1", children: [
             "<",
             t.name,
             ">"
           ] }),
-          /* @__PURE__ */ c("span", { class: "text-muted text-[11px] tabular-nums", children: [
+          /* @__PURE__ */ d("span", { class: "text-muted text-[11px] tabular-nums", children: [
             "×",
             t.renderCount
           ] }),
-          /* @__PURE__ */ c(
+          /* @__PURE__ */ d(
             "span",
             {
               class: `text-[10px] tabular-nums w-12 text-right ${t.lastRenderDuration > 16 ? "text-warn" : "text-subtle"}`,
@@ -331,14 +331,14 @@ class Q extends (hn = w) {
     );
   }
 }
-we = b(hn), Q = d(we, 0, "ComponentRow", Qe, Q), a(we, 1, Q);
-var Pe, Ve, et, tt, $;
-tt = [x()];
-class F extends (et = R, Ve = [M()], Pe = [M()], et) {
+ye = b(vn), V = l(ye, 0, "ComponentRow", Ve, V), s(ye, 1, V);
+var Pe, et, tt, nt, E;
+nt = [m()];
+class B extends (tt = J, et = [C()], Pe = [C()], tt) {
   constructor() {
     super(...arguments);
-    f(this, "components", a($, 8, this, [])), a($, 11, this);
-    f(this, "selectedId", a($, 12, this, null)), a($, 15, this);
+    f(this, "components", s(E, 8, this, [])), s(E, 11, this);
+    f(this, "selectedId", s(E, 12, this, null)), s(E, 15, this);
     f(this, "_handlers", []);
   }
   get registry() {
@@ -365,15 +365,15 @@ class F extends (et = R, Ve = [M()], Pe = [M()], et) {
   }
   render() {
     const { registry: e } = this;
-    return /* @__PURE__ */ c("div", { class: "flex h-full overflow-hidden", children: [
-      /* @__PURE__ */ c("div", { class: "flex-1 flex flex-col overflow-hidden min-w-0", children: [
-        /* @__PURE__ */ c("div", { class: "flex items-center px-3 h-7 text-[9px] text-subtle font-bold tracking-[0.12em] uppercase border-b border-border bg-section gap-2 shrink-0", children: [
+    return /* @__PURE__ */ d("div", { class: "flex h-full overflow-hidden", children: [
+      /* @__PURE__ */ d("div", { class: "flex-1 flex flex-col overflow-hidden min-w-0", children: [
+        /* @__PURE__ */ d("div", { class: "flex items-center px-3 h-7 text-[9px] text-subtle font-bold tracking-[0.12em] uppercase border-b border-border bg-section gap-2 shrink-0", children: [
           /* @__PURE__ */ o("span", { class: "flex-1", children: "Component" }),
           /* @__PURE__ */ o("span", { children: "Renders" }),
           /* @__PURE__ */ o("span", { class: "w-12 text-right", children: "Last" })
         ] }),
-        /* @__PURE__ */ o("div", { class: "flex-1 overflow-y-auto", children: () => this.components.length === 0 ? /* @__PURE__ */ o(H, { message: "No components tracked. Add @Trace() to component classes." }) : this.components.map((n) => /* @__PURE__ */ o(
-          Q,
+        /* @__PURE__ */ o("div", { class: "flex-1 overflow-y-auto", children: () => this.components.length === 0 ? /* @__PURE__ */ o(G, { message: "No components tracked. Add @Trace() to component classes." }) : this.components.map((n) => /* @__PURE__ */ o(
+          V,
           {
             entry: n,
             selected: () => this.selectedId === n.id,
@@ -385,21 +385,21 @@ class F extends (et = R, Ve = [M()], Pe = [M()], et) {
         )) })
       ] }),
       () => {
-        const n = this.selectedId, i = n ? this.components.find((l) => l.id === n) ?? null : null, s = n ? e.getSignalsByComponent(n) : [];
-        return i ? /* @__PURE__ */ o(Z, { entry: i, signals: s }) : null;
+        const n = this.selectedId, i = n ? this.components.find((c) => c.id === n) ?? null : null, a = n ? e.getSignalsByComponent(n) : [];
+        return i ? /* @__PURE__ */ o(Q, { entry: i, signals: a }) : null;
       }
     ] });
   }
 }
-$ = b(et), d($, 5, "components", Ve, F), d($, 5, "selectedId", Pe, F), F = d($, 0, "ComponentsTab", tt, F), a($, 1, F);
-const Zt = {
+E = b(tt), l(E, 5, "components", et, B), l(E, 5, "selectedId", Pe, B), B = l(E, 0, "ComponentsTab", nt, B), s(E, 1, B);
+const on = {
   id: "components",
   label: "Components",
-  component: F
+  component: B
 };
-var nt, ye, gn;
-nt = [x()];
-class P extends (gn = w) {
+var rt, ve, kn;
+rt = [m()];
+class P extends (kn = y) {
   render() {
     const { placeholder: t, onInput: e } = this.props;
     return /* @__PURE__ */ o(
@@ -415,34 +415,34 @@ class P extends (gn = w) {
     );
   }
 }
-ye = b(gn), P = d(ye, 0, "SearchInput", nt, P), a(ye, 1, P);
-var rt, ve, bn;
-rt = [x()];
-class V extends (bn = w) {
+ve = b(kn), P = l(ve, 0, "SearchInput", rt, P), s(ve, 1, P);
+var ot, ke, zn;
+ot = [m()];
+class ee extends (zn = y) {
   render() {
-    return /* @__PURE__ */ c("div", { class: "border-b border-border", children: [
+    return /* @__PURE__ */ d("div", { class: "border-b border-border", children: [
       /* @__PURE__ */ o("div", { class: "px-3 py-[4px] text-[9px] text-subtle font-bold tracking-[0.12em] uppercase bg-section border-b border-border", children: this.props.label }),
       this.props.children
     ] });
   }
 }
-ve = b(bn), V = d(ve, 0, "PanelSection", rt, V), a(ve, 1, V);
+ke = b(zn), ee = l(ke, 0, "PanelSection", ot, ee), s(ke, 1, ee);
 function De(r, t) {
   const e = t ? ` ${t}` : "", n = Date.now() - r;
   return n < 1e3 ? `${n.toString()}ms${e}` : n < 6e4 ? `${(n / 1e3).toFixed(1)}s${e}` : `${Math.floor(n / 6e4).toString()}m${e}`;
 }
-var ot, ke, xn;
-ot = [x()];
-class ee extends (xn = w) {
+var it, ze, Cn;
+it = [m()];
+class te extends (Cn = y) {
   render() {
     const { entry: t } = this.props;
-    return /* @__PURE__ */ o(X, { width: "260px", children: /* @__PURE__ */ o(V, { label: "History", children: /* @__PURE__ */ c("div", { class: "overflow-y-auto", children: [
-      [...t.history].reverse().map((e, n) => /* @__PURE__ */ c(
+    return /* @__PURE__ */ o(X, { width: "260px", children: /* @__PURE__ */ o(ee, { label: "History", children: /* @__PURE__ */ d("div", { class: "overflow-y-auto", children: [
+      [...t.history].reverse().map((e, n) => /* @__PURE__ */ d(
         "div",
         {
           class: "px-3 py-2 border-b border-border flex justify-between items-center gap-3",
           children: [
-            /* @__PURE__ */ o("span", { class: "font-mono text-[11px] text-text truncate", children: Ee(e.value) }),
+            /* @__PURE__ */ o("span", { class: "font-mono text-[11px] text-text truncate", children: Ne(e.value) }),
             /* @__PURE__ */ o("span", { class: "text-[10px] text-subtle shrink-0 tabular-nums", children: De(e.timestamp, "ago") })
           ]
         },
@@ -452,13 +452,13 @@ class ee extends (xn = w) {
     ] }) }) });
   }
 }
-ke = b(xn), ee = d(ke, 0, "SignalDetail", ot, ee), a(ke, 1, ee);
-var it, ze, mn;
-it = [x()];
-class te extends (mn = w) {
+ze = b(Cn), te = l(ze, 0, "SignalDetail", it, te), s(ze, 1, te);
+var st, Ce, Mn;
+st = [m()];
+class ne extends (Mn = y) {
   render() {
     const { entry: t, selected: e, onClick: n } = this.props;
-    return /* @__PURE__ */ c(
+    return /* @__PURE__ */ d(
       "div",
       {
         onClick: n,
@@ -467,22 +467,22 @@ class te extends (mn = w) {
           e && /* @__PURE__ */ o("span", { class: "absolute left-0 top-0 bottom-0 w-[2px] bg-accent rounded-r" }),
           /* @__PURE__ */ o("span", { class: "text-accent font-mono text-[11px] truncate pl-1", children: t.label }),
           /* @__PURE__ */ o("span", { class: "text-muted text-[11px] truncate", children: t.componentName }),
-          /* @__PURE__ */ o("span", { class: "text-text font-mono text-[11px] truncate", children: Ee(t.value) }),
+          /* @__PURE__ */ o("span", { class: "text-text font-mono text-[11px] truncate", children: Ne(t.value) }),
           /* @__PURE__ */ o("span", { class: "text-subtle text-[10px] text-right tabular-nums", children: De(t.changedAt, "ago") })
         ]
       }
     );
   }
 }
-ze = b(mn), te = d(ze, 0, "SignalRow", it, te), a(ze, 1, te);
-var st, at, lt, ct, dt, S;
-dt = [x()];
-class E extends (ct = R, lt = [M()], at = [M()], st = [M()], ct) {
+Ce = b(Mn), ne = l(Ce, 0, "SignalRow", st, ne), s(Ce, 1, ne);
+var at, lt, ct, dt, ut, S;
+ut = [m()];
+class U extends (dt = J, ct = [C()], lt = [C()], at = [C()], dt) {
   constructor() {
     super(...arguments);
-    f(this, "signals", a(S, 8, this, [])), a(S, 11, this);
-    f(this, "search", a(S, 12, this, "")), a(S, 15, this);
-    f(this, "selectedId", a(S, 16, this, null)), a(S, 19, this);
+    f(this, "signals", s(S, 8, this, [])), s(S, 11, this);
+    f(this, "search", s(S, 12, this, "")), s(S, 15, this);
+    f(this, "selectedId", s(S, 16, this, null)), s(S, 19, this);
     f(this, "_handlers", []);
   }
   get registry() {
@@ -504,8 +504,8 @@ class E extends (ct = R, lt = [M()], at = [M()], st = [M()], ct) {
     });
   }
   render() {
-    return /* @__PURE__ */ c("div", { class: "flex h-full overflow-hidden", children: [
-      /* @__PURE__ */ c("div", { class: "flex-1 flex flex-col overflow-hidden min-w-0", children: [
+    return /* @__PURE__ */ d("div", { class: "flex h-full overflow-hidden", children: [
+      /* @__PURE__ */ d("div", { class: "flex-1 flex flex-col overflow-hidden min-w-0", children: [
         /* @__PURE__ */ o("div", { class: "px-3 py-2 border-b border-border bg-bg shrink-0", children: /* @__PURE__ */ o(
           P,
           {
@@ -515,7 +515,7 @@ class E extends (ct = R, lt = [M()], at = [M()], st = [M()], ct) {
             }
           }
         ) }),
-        /* @__PURE__ */ c("div", { class: "grid grid-cols-[1.2fr_0.8fr_1fr_auto] items-center px-3 h-7 text-[9px] text-subtle font-bold tracking-[0.12em] uppercase border-b border-border bg-section gap-2 shrink-0", children: [
+        /* @__PURE__ */ d("div", { class: "grid grid-cols-[1.2fr_0.8fr_1fr_auto] items-center px-3 h-7 text-[9px] text-subtle font-bold tracking-[0.12em] uppercase border-b border-border bg-section gap-2 shrink-0", children: [
           /* @__PURE__ */ o("span", { children: "Signal" }),
           /* @__PURE__ */ o("span", { children: "Component" }),
           /* @__PURE__ */ o("span", { children: "Value" }),
@@ -526,12 +526,12 @@ class E extends (ct = R, lt = [M()], at = [M()], st = [M()], ct) {
             (i) => i.label.toLowerCase().includes(e) || i.componentName.toLowerCase().includes(e)
           );
           return n.length === 0 ? /* @__PURE__ */ o(
-            H,
+            G,
             {
               message: this.signals.length === 0 ? "No signals tracked. Add @Debug() on top of @State() properties." : "No signals match your search."
             }
           ) : n.map((i) => /* @__PURE__ */ o(
-            te,
+            ne,
             {
               entry: i,
               selected: this.selectedId === i.id,
@@ -545,24 +545,24 @@ class E extends (ct = R, lt = [M()], at = [M()], st = [M()], ct) {
       ] }),
       () => {
         const e = this.selectedId, n = e ? this.signals.find((i) => i.id === e) ?? null : null;
-        return n ? /* @__PURE__ */ o(ee, { entry: n }) : null;
+        return n ? /* @__PURE__ */ o(te, { entry: n }) : null;
       }
     ] });
   }
 }
-S = b(ct), d(S, 5, "signals", lt, E), d(S, 5, "search", at, E), d(S, 5, "selectedId", st, E), E = d(S, 0, "SignalsTab", dt, E), a(S, 1, E);
-const Qt = {
+S = b(dt), l(S, 5, "signals", ct, U), l(S, 5, "search", lt, U), l(S, 5, "selectedId", at, U), U = l(S, 0, "SignalsTab", ut, U), s(S, 1, U);
+const sn = {
   id: "signals",
   label: "Signals",
-  component: E
-}, Pt = {
+  component: U
+}, an = {
   "signal:change": { label: "signal", cls: "text-[#9b90e6] bg-[rgba(155,144,230,0.14)]" },
   "component:render": { label: "render", cls: "text-[#4ade80] bg-[rgba(74,222,128,0.12)]" },
   "component:mount": { label: "mount", cls: "text-[#0ea57a] bg-[rgba(14,165,122,0.14)]" },
   "component:unmount": { label: "unmount", cls: "text-[#dc2626] bg-[rgba(220,38,38,0.14)]" },
   lifecycle: { label: "lifecycle", cls: "text-[#d97706] bg-[rgba(217,119,6,0.14)]" },
   "method:call": { label: "method", cls: "text-[#7c6dd6] bg-[rgba(124,109,214,0.14)]" }
-}, Vt = [
+}, ln = [
   { value: "all", label: "All" },
   { value: "signal:change", label: "Signals" },
   { value: "component:render", label: "Renders" },
@@ -570,11 +570,11 @@ const Qt = {
   { value: "lifecycle", label: "Lifecycle" },
   { value: "method:call", label: "Methods" }
 ];
-var pt, Me, fn;
-pt = [x()];
-class ne extends (fn = w) {
+var pt, Me, Sn;
+pt = [m()];
+class re extends (Sn = y) {
   render() {
-    const t = Pt[this.props.type];
+    const t = an[this.props.type];
     return /* @__PURE__ */ o(
       "span",
       {
@@ -584,18 +584,21 @@ class ne extends (fn = w) {
     );
   }
 }
-Me = b(fn), ne = d(Me, 0, "Badge", pt, ne), a(Me, 1, ne);
-var ut, ht, gt, O;
-gt = [x()];
-class q extends (ht = R, ut = [M()], ht) {
+Me = b(Sn), re = l(Me, 0, "Badge", pt, re), s(Me, 1, re);
+var ht, gt, bt, xt, N;
+xt = [m()];
+class H extends (bt = J, gt = [C()], ht = [Z()], bt) {
   constructor() {
     super(...arguments);
-    f(this, "open", a(O, 8, this, !1)), a(O, 11, this);
+    f(this, "open", s(N, 8, this, !1)), s(N, 11, this);
+    f(this, "entry", s(N, 12, this)), s(N, 15, this);
   }
   render() {
-    const { entry: e } = this.props, n = Object.keys(e.data).length > 0;
-    return /* @__PURE__ */ c("div", { class: "border-b border-border", children: [
-      /* @__PURE__ */ c(
+    const e = this.entry;
+    if (!e) return null;
+    const n = Object.keys(e.data).length > 0;
+    return /* @__PURE__ */ d("div", { class: "border-b border-border", children: [
+      /* @__PURE__ */ d(
         "div",
         {
           onClick: () => {
@@ -604,31 +607,31 @@ class q extends (ht = R, ut = [M()], ht) {
           class: `flex items-center gap-2 px-3 py-2 transition-colors duration-100 ${n ? "cursor-pointer hover:bg-section" : "cursor-default"}`,
           children: [
             /* @__PURE__ */ o("span", { class: "text-subtle text-[10px] w-10 shrink-0 text-right tabular-nums font-mono", children: De(e.timestamp) }),
-            /* @__PURE__ */ o(ne, { type: e.type }),
+            /* @__PURE__ */ o(re, { type: e.type }),
             /* @__PURE__ */ o("span", { class: "flex-1 text-text font-mono text-[11px] truncate", children: e.label }),
             n && /* @__PURE__ */ o("span", { class: "text-subtle text-[11px] shrink-0 w-4 text-center", children: () => this.open ? "▾" : "▸" })
           ]
         }
       ),
-      () => this.open && n ? /* @__PURE__ */ o("div", { class: "px-3 py-2 pl-[56px] font-mono text-[11px] bg-section border-t border-border", children: Object.entries(e.data).map(([i, s]) => /* @__PURE__ */ c("div", { class: "flex gap-3 py-[3px]", children: [
-        /* @__PURE__ */ c("span", { class: "text-accent shrink-0", children: [
+      () => this.open && n ? /* @__PURE__ */ o("div", { class: "px-3 py-2 pl-[56px] font-mono text-[11px] bg-section border-t border-border", children: Object.entries(e.data).map(([i, a]) => /* @__PURE__ */ d("div", { class: "flex gap-3 py-[3px]", children: [
+        /* @__PURE__ */ d("span", { class: "text-accent shrink-0", children: [
           i,
           ":"
         ] }),
-        /* @__PURE__ */ o("span", { class: "text-muted truncate", children: typeof s == "object" ? JSON.stringify(s) : String(s) })
+        /* @__PURE__ */ o("span", { class: "text-muted truncate", children: typeof a == "object" ? JSON.stringify(a) : String(a) })
       ] }, i)) }) : null
     ] });
   }
 }
-O = b(ht), d(O, 5, "open", ut, q), q = d(O, 0, "TimelineRow", gt, q), a(O, 1, q);
-var bt, xt, mt, ft, wt, I;
-wt = [x()];
-class D extends (ft = R, mt = [M()], xt = [M()], bt = [M()], ft) {
+N = b(bt), l(N, 5, "open", gt, H), l(N, 5, "entry", ht, H), H = l(N, 0, "TimelineRow", xt, H), s(N, 1, H);
+var mt, ft, wt, yt, vt, I;
+vt = [m()];
+class O extends (yt = J, wt = [C()], ft = [C()], mt = [C()], yt) {
   constructor() {
     super(...arguments);
-    f(this, "entries", a(I, 8, this, [])), a(I, 11, this);
-    f(this, "filter", a(I, 12, this, "all")), a(I, 15, this);
-    f(this, "paused", a(I, 16, this, !1)), a(I, 19, this);
+    f(this, "entries", s(I, 8, this, [])), s(I, 11, this);
+    f(this, "filter", s(I, 12, this, "all")), s(I, 15, this);
+    f(this, "paused", s(I, 16, this, !1)), s(I, 19, this);
     f(this, "_handlers", []);
   }
   get registry() {
@@ -647,9 +650,9 @@ class D extends (ft = R, mt = [M()], xt = [M()], bt = [M()], ft) {
     });
   }
   render() {
-    return /* @__PURE__ */ c("div", { class: "flex flex-col h-full overflow-hidden", children: [
-      /* @__PURE__ */ c("div", { class: "flex items-center gap-[3px] px-2 py-2 border-b border-border bg-bg shrink-0 flex-wrap", children: [
-        Vt.map((e) => /* @__PURE__ */ o(
+    return /* @__PURE__ */ d("div", { class: "flex flex-col h-full overflow-hidden", children: [
+      /* @__PURE__ */ d("div", { class: "flex items-center gap-[3px] px-2 py-2 border-b border-border bg-bg shrink-0 flex-wrap", children: [
+        ln.map((e) => /* @__PURE__ */ o(
           "button",
           {
             onClick: () => {
@@ -686,22 +689,22 @@ class D extends (ft = R, mt = [M()], xt = [M()], bt = [M()], ft) {
         const e = this.filter, n = e === "all" ? this.entries : this.entries.filter(
           (i) => i.type === e || e === "component:mount" && i.type === "component:unmount"
         );
-        return n.length === 0 ? /* @__PURE__ */ o(H, { message: "No events yet. Interact with your app to see the timeline." }) : [...n].reverse().map((i) => /* @__PURE__ */ o(q, { entry: i }, i.id));
+        return n.length === 0 ? /* @__PURE__ */ o(G, { message: "No events yet. Interact with your app to see the timeline." }) : [...n].reverse().map((i) => /* @__PURE__ */ o(H, { entry: i }, i.id));
       } })
     ] });
   }
 }
-I = b(ft), d(I, 5, "entries", mt, D), d(I, 5, "filter", xt, D), d(I, 5, "paused", bt, D), D = d(I, 0, "TimelineTab", wt, D), a(I, 1, D);
-const en = {
+I = b(yt), l(I, 5, "entries", wt, O), l(I, 5, "filter", ft, O), l(I, 5, "paused", mt, O), O = l(I, 0, "TimelineTab", vt, O), s(I, 1, O);
+const cn = {
   id: "timeline",
   label: "Timeline",
-  component: D
-}, tn = '*,:after,:before,::backdrop,::file-selector-button{box-sizing:border-box;margin:0;padding:0;border:0 solid}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea,::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;border-radius:0;background-color:transparent;opacity:1}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit,::-webkit-datetime-edit-year-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]),::file-selector-button{appearance:button}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}';
-var yt, Ce, wn;
-yt = [x()];
-class re extends (wn = w) {
+  component: O
+}, dn = '*,:after,:before,::backdrop,::file-selector-button{box-sizing:border-box;margin:0;padding:0;border:0 solid}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea,::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;border-radius:0;background-color:transparent;opacity:1}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit,::-webkit-datetime-edit-year-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]),::file-selector-button{appearance:button}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}';
+var kt, Se, In;
+kt = [m()];
+class oe extends (In = y) {
   render() {
-    return /* @__PURE__ */ c(
+    return /* @__PURE__ */ d(
       "svg",
       {
         xmlns: "http://www.w3.org/2000/svg",
@@ -723,12 +726,12 @@ class re extends (wn = w) {
     );
   }
 }
-Ce = b(wn), re = d(Ce, 0, "EllipsisVerticalIcon", yt, re), a(Ce, 1, re);
-var vt, Se, yn;
-vt = [x()];
-class oe extends (yn = w) {
+Se = b(In), oe = l(Se, 0, "EllipsisVerticalIcon", kt, oe), s(Se, 1, oe);
+var zt, Ie, Ln;
+zt = [m()];
+class ie extends (Ln = y) {
   render() {
-    return /* @__PURE__ */ c(
+    return /* @__PURE__ */ d(
       "svg",
       {
         xmlns: "http://www.w3.org/2000/svg",
@@ -749,12 +752,12 @@ class oe extends (yn = w) {
     );
   }
 }
-Se = b(yn), oe = d(Se, 0, "PanelBottomIcon", vt, oe), a(Se, 1, oe);
-var kt, Ie, vn;
-kt = [x()];
-class ie extends (vn = w) {
+Ie = b(Ln), ie = l(Ie, 0, "PanelBottomIcon", zt, ie), s(Ie, 1, ie);
+var Ct, Le, _n;
+Ct = [m()];
+class se extends (_n = y) {
   render() {
-    return /* @__PURE__ */ c(
+    return /* @__PURE__ */ d(
       "svg",
       {
         xmlns: "http://www.w3.org/2000/svg",
@@ -775,12 +778,12 @@ class ie extends (vn = w) {
     );
   }
 }
-Ie = b(vn), ie = d(Ie, 0, "PanelLeftIcon", kt, ie), a(Ie, 1, ie);
-var zt, Le, kn;
-zt = [x()];
-class se extends (kn = w) {
+Le = b(_n), se = l(Le, 0, "PanelLeftIcon", Ct, se), s(Le, 1, se);
+var Mt, _e, $n;
+Mt = [m()];
+class ae extends ($n = y) {
   render() {
-    return /* @__PURE__ */ c(
+    return /* @__PURE__ */ d(
       "svg",
       {
         xmlns: "http://www.w3.org/2000/svg",
@@ -801,12 +804,12 @@ class se extends (kn = w) {
     );
   }
 }
-Le = b(kn), se = d(Le, 0, "PanelRightIcon", zt, se), a(Le, 1, se);
-var Mt, _e, zn;
-Mt = [x()];
-class ae extends (zn = w) {
+_e = b($n), ae = l(_e, 0, "PanelRightIcon", Mt, ae), s(_e, 1, ae);
+var St, $e, jn;
+St = [m()];
+class le extends (jn = y) {
   render() {
-    return /* @__PURE__ */ c(
+    return /* @__PURE__ */ d(
       "svg",
       {
         xmlns: "http://www.w3.org/2000/svg",
@@ -827,12 +830,12 @@ class ae extends (zn = w) {
     );
   }
 }
-_e = b(zn), ae = d(_e, 0, "PanelTopIcon", Mt, ae), a(_e, 1, ae);
-var Ct, $e, Mn;
-Ct = [x()];
-class le extends (Mn = w) {
+$e = b(jn), le = l($e, 0, "PanelTopIcon", St, le), s($e, 1, le);
+var It, je, En;
+It = [m()];
+class ce extends (En = y) {
   render() {
-    return /* @__PURE__ */ c(
+    return /* @__PURE__ */ d(
       "svg",
       {
         xmlns: "http://www.w3.org/2000/svg",
@@ -853,10 +856,10 @@ class le extends (Mn = w) {
     );
   }
 }
-$e = b(Mn), le = d($e, 0, "XIcon", Ct, le), a($e, 1, le);
-var St, je, Cn;
-St = [x()];
-class T extends (Cn = w) {
+je = b(En), ce = l(je, 0, "XIcon", It, ce), s(je, 1, ce);
+var Lt, Ee, Nn;
+Lt = [m()];
+class Y extends (Nn = y) {
   render() {
     const { title: t, active: e, icon: n, onClick: i } = this.props;
     return /* @__PURE__ */ o(
@@ -870,58 +873,54 @@ class T extends (Cn = w) {
     );
   }
 }
-je = b(Cn), T = d(je, 0, "IconButton", St, T), a(je, 1, T);
-const Te = 180, nn = 300, Re = 240, rn = 380, on = {
-  bottom: oe,
-  top: ae,
-  left: ie,
-  right: se
+Ee = b(Nn), Y = l(Ee, 0, "IconButton", Lt, Y), s(Ee, 1, Y);
+const Ye = 180, un = 300, Je = 240, pn = 380, hn = {
+  bottom: ie,
+  top: le,
+  left: se,
+  right: ae
 };
-var It, Lt, _t, $t, jt, Et, Dt, y;
-Dt = [x()];
-class j extends (Et = R, jt = [M()], $t = [M()], _t = [M()], Lt = [M()], It = [M()], Et) {
+var _t, $t, jt, Et, Nt, Dt, Ut, Ot, Ft, At, x;
+At = [m()];
+class _ extends (Ft = J, Ot = [C()], Ut = [C()], Dt = [C()], Nt = [C()], Et = [C()], jt = [Z()], $t = [Z()], _t = [Vt("onClose")], Ft) {
   constructor() {
     super(...arguments);
-    f(this, "activeTab", a(y, 8, this, "")), a(y, 11, this);
-    f(this, "dock", a(y, 12, this, "bottom")), a(y, 15, this);
-    f(this, "dockMenuOpen", a(y, 16, this, !1)), a(y, 19, this);
-    f(this, "bottomSize", a(y, 20, this, nn)), a(y, 23, this);
-    f(this, "vertSize", a(y, 24, this, rn)), a(y, 27, this);
+    s(x, 5, this);
+    f(this, "activeTab", s(x, 8, this, "")), s(x, 11, this);
+    f(this, "dock", s(x, 12, this, "bottom")), s(x, 15, this);
+    f(this, "dockMenuOpen", s(x, 16, this, !1)), s(x, 19, this);
+    f(this, "bottomSize", s(x, 20, this, un)), s(x, 23, this);
+    f(this, "vertSize", s(x, 24, this, pn)), s(x, 27, this);
+    f(this, "plugins", s(x, 28, this, [])), s(x, 31, this);
+    f(this, "registry", s(x, 32, this)), s(x, 35, this);
   }
-  get p() {
-    return this.props;
+  handleClose() {
   }
-  onBeforeMount() {
-    this.activeTab = this.p.plugins[0]?.id ?? "";
+  onMount() {
+    this.plugins.length > 0 && (this.activeTab = this.plugins[0].id);
   }
   handleMouseDown(e) {
     e.preventDefault();
-    const n = e.clientX, i = e.clientY, s = this.dock, l = s === "bottom" || s === "top" ? this.bottomSize : this.vertSize, p = (h) => {
-      const m = this.dock;
-      m === "bottom" ? this.bottomSize = Math.max(
-        Te,
+    const n = e.clientX, i = e.clientY, a = this.dock, c = a === "bottom" || a === "top" ? this.bottomSize : this.vertSize, p = (h) => {
+      const w = this.dock;
+      w === "bottom" ? this.bottomSize = Math.max(
+        Ye,
         Math.min(
           window.innerHeight * 0.85,
-          l + (i - h.clientY)
+          c + (i - h.clientY)
         )
-      ) : m === "top" ? this.bottomSize = Math.max(
-        Te,
+      ) : w === "top" ? this.bottomSize = Math.max(
+        Ye,
         Math.min(
           window.innerHeight * 0.85,
-          l + (h.clientY - i)
-        )
-      ) : m === "left" ? this.vertSize = Math.max(
-        Re,
-        Math.min(
-          window.innerWidth * 0.6,
-          l + (h.clientX - n)
+          c + (h.clientY - i)
         )
+      ) : w === "left" ? this.vertSize = Math.max(
+        Je,
+        Math.min(window.innerWidth * 0.6, c + (h.clientX - n))
       ) : this.vertSize = Math.max(
-        Re,
-        Math.min(
-          window.innerWidth * 0.6,
-          l + (n - h.clientX)
-        )
+        Je,
+        Math.min(window.innerWidth * 0.6, c + (n - h.clientX))
       );
     }, g = () => {
       document.removeEventListener("mousemove", p), document.removeEventListener("mouseup", g);
@@ -929,24 +928,23 @@ class j extends (Et = R, jt = [M()], $t = [M()], _t = [M()], Lt = [M()], It = [M
     document.addEventListener("mousemove", p), document.addEventListener("mouseup", g);
   }
   render() {
-    const { plugins: e, registry: n, onClose: i } = this.p;
-    return /* @__PURE__ */ c(
+    return /* @__PURE__ */ d(
       "div",
       {
         class: () => {
-          const s = this.dock;
-          return s === "top" ? "flex flex-col-reverse fixed top-0 left-0 w-full z-[2147483647]" : s === "left" ? "flex flex-row-reverse fixed left-0 top-0 h-screen z-[2147483647]" : s === "right" ? "flex fixed right-0 top-0 h-screen z-[2147483647]" : "flex flex-col fixed bottom-0 left-0 w-full z-[2147483647]";
+          const e = this.dock;
+          return e === "top" ? "flex flex-col-reverse fixed top-0 left-0 w-full z-[2147483647]" : e === "left" ? "flex flex-row-reverse fixed left-0 top-0 h-screen z-[2147483647]" : e === "right" ? "flex fixed right-0 top-0 h-screen z-[2147483647]" : "flex flex-col fixed bottom-0 left-0 w-full z-[2147483647]";
         },
         children: [
           /* @__PURE__ */ o(
             "div",
             {
               class: () => {
-                const s = this.dock;
-                return s === "bottom" || s === "top" ? "h-1 cursor-[ns-resize] bg-transparent hover:bg-accent transition-colors duration-200" : "w-1 cursor-[ew-resize] bg-transparent hover:bg-accent transition-colors duration-200";
+                const e = this.dock;
+                return e === "bottom" || e === "top" ? "h-1 cursor-[ns-resize] bg-transparent hover:bg-accent transition-colors duration-200" : "w-1 cursor-[ew-resize] bg-transparent hover:bg-accent transition-colors duration-200";
               },
-              onMouseDown: (s) => {
-                this.handleMouseDown(s);
+              onMouseDown: (e) => {
+                this.handleMouseDown(e);
               }
             }
           ),
@@ -954,40 +952,40 @@ class j extends (Et = R, jt = [M()], $t = [M()], _t = [M()], Lt = [M()], It = [M
             "div",
             {
               class: () => {
-                const s = this.dock;
-                return s === "top" ? "w-full h-full bg-bg border-b border-border" : s === "left" ? "w-full h-full bg-bg border-r border-border" : s === "right" ? "w-full h-full bg-bg border-l border-border" : "w-full h-full bg-bg border-t border-border";
+                const e = this.dock;
+                return e === "top" ? "w-full h-full bg-bg border-b border-border" : e === "left" ? "w-full h-full bg-bg border-r border-border" : e === "right" ? "w-full h-full bg-bg border-l border-border" : "w-full h-full bg-bg border-t border-border";
               },
               style: () => {
-                const s = this.dock;
-                return s === "bottom" || s === "top" ? { height: `${this.bottomSize.toString()}px` } : { width: `${this.vertSize.toString()}px` };
+                const e = this.dock;
+                return e === "bottom" || e === "top" ? { height: `${this.bottomSize.toString()}px` } : { width: `${this.vertSize.toString()}px` };
               },
-              children: /* @__PURE__ */ c("div", { class: "flex flex-col flex-1 w-full h-full overflow-hidden", children: [
-                /* @__PURE__ */ c("div", { class: "flex h-10 items-stretch border-b border-border bg-header shrink-0 px-2 gap-[2px]", children: [
-                  /* @__PURE__ */ c("div", { class: "flex items-center gap-[6px] pr-3 mr-[2px] border-r border-border shrink-0", children: [
-                    /* @__PURE__ */ o("img", { class: "h-[13px] w-[13px]", src: At }),
+              children: /* @__PURE__ */ d("div", { class: "flex flex-col flex-1 w-full h-full overflow-hidden", children: [
+                /* @__PURE__ */ d("div", { class: "flex h-10 items-stretch border-b border-border bg-header shrink-0 px-2 gap-[2px]", children: [
+                  /* @__PURE__ */ d("div", { class: "flex items-center gap-[6px] pr-3 mr-[2px] border-r border-border shrink-0", children: [
+                    /* @__PURE__ */ o("img", { class: "h-[13px] w-[13px]", src: Jt }),
                     /* @__PURE__ */ o("span", { class: "text-[10px] font-bold text-accent tracking-widest uppercase", children: "praxisjs" })
                   ] }),
-                  /* @__PURE__ */ o("div", { class: "flex items-stretch flex-1", children: e.map((s) => /* @__PURE__ */ c(
+                  /* @__PURE__ */ o("div", { class: "flex items-stretch flex-1", children: () => this.plugins.map((e) => /* @__PURE__ */ d(
                     "button",
                     {
-                      class: () => this.activeTab === s.id ? "relative flex items-center px-3 text-[11px] font-semibold text-accent cursor-pointer" : "flex items-center px-3 text-[11px] text-muted cursor-pointer hover:text-text transition-colors duration-150",
+                      class: () => this.activeTab === e.id ? "relative flex items-center px-3 text-[11px] font-semibold text-accent cursor-pointer" : "flex items-center px-3 text-[11px] text-muted cursor-pointer hover:text-text transition-colors duration-150",
                       onClick: () => {
-                        this.activeTab = s.id;
+                        this.activeTab = e.id;
                       },
                       children: [
-                        s.label,
-                        () => this.activeTab === s.id ? /* @__PURE__ */ o("span", { class: "absolute bottom-0 left-0 right-0 h-[2px] bg-accent" }) : null
+                        e.label,
+                        () => this.activeTab === e.id ? /* @__PURE__ */ o("span", { class: "absolute bottom-0 left-0 right-0 h-[2px] bg-accent" }) : null
                       ]
                     },
-                    s.id
+                    e.id
                   )) }),
-                  /* @__PURE__ */ c("div", { class: "flex items-center gap-[2px] shrink-0", children: [
-                    /* @__PURE__ */ c("div", { class: "relative", children: [
+                  /* @__PURE__ */ d("div", { class: "flex items-center gap-[2px] shrink-0", children: [
+                    /* @__PURE__ */ d("div", { class: "relative", children: [
                       /* @__PURE__ */ o(
-                        T,
+                        Y,
                         {
                           title: "Dock position",
-                          icon: re,
+                          icon: oe,
                           active: () => this.dockMenuOpen,
                           onClick: () => {
                             this.dockMenuOpen = !this.dockMenuOpen;
@@ -995,27 +993,38 @@ class j extends (Et = R, jt = [M()], $t = [M()], _t = [M()], Lt = [M()], It = [M
                         }
                       ),
                       () => this.dockMenuOpen ? /* @__PURE__ */ o("div", { class: "absolute right-0 top-full mt-1 flex gap-[2px] bg-bg border border-border rounded-md shadow-lg p-1 z-10", children: ["bottom", "top", "left", "right"].map(
-                        (s) => /* @__PURE__ */ o(
-                          T,
+                        (e) => /* @__PURE__ */ o(
+                          Y,
                           {
-                            title: `Dock ${s}`,
-                            active: () => this.dock === s,
-                            icon: on[s],
+                            title: `Dock ${e}`,
+                            active: () => this.dock === e,
+                            icon: hn[e],
                             onClick: () => {
-                              this.dock = s, this.dockMenuOpen = !1;
+                              this.dock = e, this.dockMenuOpen = !1;
                             }
                           },
-                          s
+                          e
                         )
                       ) }) : null
                     ] }),
                     /* @__PURE__ */ o("div", { class: "w-px h-3 bg-border mx-1" }),
-                    /* @__PURE__ */ o(T, { title: "Close", icon: le, onClick: i })
+                    /* @__PURE__ */ o(
+                      Y,
+                      {
+                        title: "Close",
+                        icon: ce,
+                        onClick: () => {
+                          this.handleClose();
+                        }
+                      }
+                    )
                   ] })
                 ] }),
                 /* @__PURE__ */ o("div", { class: "flex-1 overflow-hidden flex flex-col", children: () => {
-                  const l = e.find((p) => p.id === this.activeTab)?.component;
-                  return l ? /* @__PURE__ */ o(l, { registry: n }) : null;
+                  const n = this.plugins.find(
+                    (i) => i.id === this.activeTab
+                  )?.component;
+                  return n ? /* @__PURE__ */ o(n, { registry: this.registry }) : null;
                 } })
               ] })
             }
@@ -1025,34 +1034,32 @@ class j extends (Et = R, jt = [M()], $t = [M()], _t = [M()], Lt = [M()], It = [M
     );
   }
 }
-y = b(Et), d(y, 5, "activeTab", jt, j), d(y, 5, "dock", $t, j), d(y, 5, "dockMenuOpen", _t, j), d(y, 5, "bottomSize", Lt, j), d(y, 5, "vertSize", It, j), j = d(y, 0, "Panel", Dt, j), a(y, 1, j);
-const sn = [
-  Qt,
-  Zt,
-  en
+x = b(Ft), l(x, 1, "handleClose", _t, _), l(x, 5, "activeTab", Ot, _), l(x, 5, "dock", Ut, _), l(x, 5, "dockMenuOpen", Dt, _), l(x, 5, "bottomSize", Nt, _), l(x, 5, "vertSize", Et, _), l(x, 5, "plugins", jt, _), l(x, 5, "registry", $t, _), _ = l(x, 0, "Panel", At, _), s(x, 1, _);
+const gn = [
+  sn,
+  on,
+  cn
 ];
-var Nt, Ut, Ot, A;
-Ot = [x()];
-class B extends (Ut = R, Nt = [M()], Ut) {
+var Bt, Ht, Gt, Wt, Yt, L;
+Yt = [m()];
+class D extends (Wt = J, Gt = [C()], Ht = [Z()], Bt = [Z()], Wt) {
   constructor() {
     super(...arguments);
-    f(this, "open", a(A, 8, this, !1)), a(A, 11, this);
-  }
-  get p() {
-    return this.props;
+    f(this, "open", s(L, 8, this, !1)), s(L, 11, this);
+    f(this, "plugins", s(L, 12, this, [])), s(L, 15, this);
+    f(this, "registry", s(L, 16, this)), s(L, 19, this);
   }
   render() {
-    const { plugins: e, registry: n } = this.p;
     return /* @__PURE__ */ o("div", { children: () => this.open ? /* @__PURE__ */ o(
-      j,
+      _,
       {
-        plugins: e,
-        registry: n,
+        plugins: this.plugins,
+        registry: this.registry,
         onClose: () => {
           this.open = !1;
         }
       }
-    ) : /* @__PURE__ */ c(
+    ) : /* @__PURE__ */ d(
       "button",
       {
         onClick: () => {
@@ -1060,28 +1067,28 @@ class B extends (Ut = R, Nt = [M()], Ut) {
         },
         class: "fixed bottom-5 right-5 z-[2147483647] flex items-center gap-1 pl-[10px] pr-[14px] h-[32px] rounded-xl font-sans font-semibold text-[12px] text-accent bg-header border border-border cursor-pointer select-none shadow-[0_8px_32px_rgba(0,0,0,0.7)] transition-all duration-200 hover:border-accent hover:bg-soft hover:shadow-[0_8px_32px_rgba(56,189,248,0.1)]",
         children: [
-          /* @__PURE__ */ o("img", { class: "h-[13px] w-[13px]", src: At }),
+          /* @__PURE__ */ o("img", { class: "h-[13px] w-[13px]", src: Jt }),
           /* @__PURE__ */ o("span", { class: "text-[10px] font-bold text-accent tracking-widest uppercase", children: "devtools" })
         ]
       }
     ) });
   }
 }
-A = b(Ut), d(A, 5, "open", Nt, B), B = d(A, 0, "DevToolsApp", Ot, B), a(A, 1, B);
-const En = {
-  plugins: [...sn],
+L = b(Wt), l(L, 5, "open", Gt, D), l(L, 5, "plugins", Ht, D), l(L, 5, "registry", Bt, D), D = l(L, 0, "DevToolsApp", Yt, D), s(L, 1, D);
+const Hn = {
+  plugins: [...gn],
   host: null,
   cleanup: null,
   init(r = {}) {
     if (this.host) return;
-    r.plugins && (this.plugins = r.plugins), this.plugins.forEach((s) => s.setup?.(v.instance));
+    r.plugins && (this.plugins = r.plugins), this.plugins.forEach((a) => a.setup?.(v.instance));
     const t = document.createElement("div");
     t.id = "praxisjs-devtools", document.body.appendChild(t), this.host = t;
     const e = t.attachShadow({ mode: "open" }), n = document.createElement("style");
-    n.textContent = tn + Jt, e.appendChild(n);
+    n.textContent = dn + en, e.appendChild(n);
     const i = document.createElement("div");
-    e.appendChild(i), this.cleanup = He(
-      () => /* @__PURE__ */ o(B, { plugins: this.plugins, registry: v.instance }),
+    e.appendChild(i), this.cleanup = Ge(
+      () => /* @__PURE__ */ o(D, { plugins: this.plugins, registry: v.instance }),
       i
     );
   },
@@ -1094,34 +1101,34 @@ const En = {
   remount() {
     if (!this.host) return;
     const t = this.host.shadowRoot.querySelector("div:last-child");
-    this.cleanup?.(), this.cleanup = He(
-      () => /* @__PURE__ */ o(B, { plugins: this.plugins, registry: v.instance }),
+    this.cleanup?.(), this.cleanup = Ge(
+      () => /* @__PURE__ */ o(D, { plugins: this.plugins, registry: v.instance }),
       t
     );
   }
 };
-function We(r) {
+function Re(r) {
   return typeof r == "function" && typeof r.subscribe == "function" && !("set" in r);
 }
-function Dn(r = {}) {
+function Gn(r = {}) {
   return function(e, n) {
     const i = r.label ?? n.name;
     if (n.kind === "method") {
-      const s = e;
-      return function(...l) {
+      const a = e;
+      return function(...c) {
         const p = this.constructor.name, g = performance.now();
-        let h, m = !1;
+        let h, w = !1;
         try {
-          h = s.apply(this, l);
+          h = a.apply(this, c);
         } catch (u) {
-          throw m = !0, h = u, u;
+          throw w = !0, h = u, u;
         } finally {
           const u = performance.now() - g;
           v.instance.recordMethodCall(
             this,
             i,
-            l,
-            m ? `throw ${String(h)}` : h,
+            c,
+            w ? `throw ${String(h)}` : h,
             u,
             p
           );
@@ -1130,76 +1137,76 @@ function Dn(r = {}) {
       };
     }
     if (n.kind === "getter") {
-      const s = e;
+      const a = e;
       n.addInitializer(function() {
-        const l = this, p = l.constructor.name;
+        const c = this, p = c.constructor.name;
         queueMicrotask(() => {
-          const g = Yt(() => s.call(l));
-          let h = !0, m = g();
-          v.instance.registerSignal(l, i, m, p), g.subscribe((u) => {
+          const g = Pt(() => a.call(c));
+          let h = !0, w = g();
+          v.instance.registerSignal(c, i, w, p), g.subscribe((u) => {
             if (h) {
               h = !1;
               return;
             }
-            v.instance.updateSignal(l, i, u, m), m = u;
+            v.instance.updateSignal(c, i, u, w), w = u;
           });
         });
       });
       return;
     }
     n.addInitializer(function() {
-      const s = this, l = n.name, p = s.constructor.name, g = Object.getOwnPropertyDescriptor(s, l);
+      const a = this, c = n.name, p = a.constructor.name, g = Object.getOwnPropertyDescriptor(a, c);
       if (g?.get && g.set) {
         const k = g.get, z = g.set;
         v.instance.registerSignal(
-          s,
+          a,
           i,
-          k.call(s),
+          k.call(a),
           p
-        ), Object.defineProperty(s, l, {
+        ), Object.defineProperty(a, c, {
           get() {
             return k.call(this);
           },
-          set(_) {
-            const U = k.call(this);
-            z.call(this, _), v.instance.updateSignal(this, i, _, U);
+          set(j) {
+            const A = k.call(this);
+            z.call(this, j), v.instance.updateSignal(this, i, j, A);
           },
           enumerable: !0,
           configurable: !0
         });
         return;
       }
-      const h = s[l];
-      if (Reflect.deleteProperty(s, l), !We(h)) {
+      const h = a[c];
+      if (Reflect.deleteProperty(a, c), !Re(h)) {
         h !== void 0 && console.warn(
-          `[PraxisJS DevTools] @Debug() on "${p}.${l}": expected a computed() value but got ${typeof h}. Skipping.`
-        ), s[l] = h;
+          `[PraxisJS DevTools] @Debug() on "${p}.${c}": expected a computed() value but got ${typeof h}. Skipping.`
+        ), a[c] = h;
         return;
       }
-      let m;
+      let w;
       function u(k) {
-        let z = !0, _ = k();
-        const U = k.subscribe((W) => {
+        let z = !0, j = k();
+        const A = k.subscribe((R) => {
           if (z) {
             z = !1;
             return;
           }
-          v.instance.updateSignal(s, i, W, _), _ = W;
+          v.instance.updateSignal(a, i, R, j), j = R;
         });
-        return v.instance.registerSignal(s, i, _, p), U;
+        return v.instance.registerSignal(a, i, j, p), A;
       }
-      m = { computed: h, unsub: u(h) }, Object.defineProperty(s, l, {
+      w = { computed: h, unsub: u(h) }, Object.defineProperty(a, c, {
         get() {
-          return m.computed;
+          return w.computed;
         },
         set(k) {
-          if (m.unsub(), !We(k)) {
+          if (w.unsub(), !Re(k)) {
             console.warn(
-              `[PraxisJS DevTools] @Debug() on "${p}.${l}": expected a computed() value but got ${typeof k}. Skipping.`
+              `[PraxisJS DevTools] @Debug() on "${p}.${c}": expected a computed() value but got ${typeof k}. Skipping.`
             );
             return;
           }
-          m = { computed: k, unsub: u(k) };
+          w = { computed: k, unsub: u(k) };
         },
         enumerable: !0,
         configurable: !0
@@ -1207,16 +1214,16 @@ function Dn(r = {}) {
     });
   };
 }
-function Nn() {
+function Wn() {
   return function(r, t) {
-    const e = r.name, n = v.instance, i = r.prototype, s = i.render;
-    s && (i.render = function(...g) {
-      const h = performance.now(), m = s.call(this, ...g), u = performance.now() - h;
-      return n.recordRender(this, u), m;
+    const e = r.name, n = v.instance, i = r.prototype, a = i.render;
+    a && (i.render = function(...g) {
+      const h = performance.now(), w = a.call(this, ...g), u = performance.now() - h;
+      return n.recordRender(this, u), w;
     });
-    const l = i.onBeforeMount;
+    const c = i.onBeforeMount;
     i.onBeforeMount = function(...g) {
-      return n.registerComponent(this, e), n.recordLifecycle(this, "onBeforeMount"), l?.call(this, ...g);
+      return n.registerComponent(this, e), n.recordLifecycle(this, "onBeforeMount"), c?.call(this, ...g);
     };
     const p = [
       "onMount",
@@ -1227,19 +1234,19 @@ function Nn() {
     ];
     for (const g of p) {
       const h = i[g];
-      i[g] = function(...m) {
-        return n.recordLifecycle(this, g), h?.call(this, ...m);
+      i[g] = function(...w) {
+        return n.recordLifecycle(this, g), h?.call(this, ...w);
       };
     }
     return r;
   };
 }
 export {
-  Zt as ComponentsPlugin,
-  Dn as Debug,
-  En as DevTools,
+  on as ComponentsPlugin,
+  Gn as Debug,
+  Hn as DevTools,
   v as Registry,
-  Qt as SignalsPlugin,
-  en as TimelinePlugin,
-  Nn as Trace
+  sn as SignalsPlugin,
+  cn as TimelinePlugin,
+  Wn as Trace
 };