@zeus-js/zeus 0.1.0-beta.7 → 0.1.0-beta.9

package/dist/zeus.esm-browser.js

@@ -1,5 +1,5 @@
 /**
-* zeus v0.1.0-beta.7
+* zeus v0.1.0-beta.9
 * (c) 2026 baicie
 * Released under the MIT License.
 **/
@@ -17,21 +17,13 @@ function makeMap(str) {
 	for (const key of str.split(",")) map[key] = 1;
 	return (val) => val in map;
 }
-//#endregion
-//#region packages/core/shared/src/general.ts
-const EMPTY_OBJ = Object.freeze({});
+Object.freeze({});
 Object.freeze([]);
-const NOOP = () => {};
 const extend = Object.assign;
-const remove = (arr, el) => {
-	const i = arr.indexOf(el);
-	if (i > -1) arr.splice(i, 1);
-};
 const hasOwnProperty$1 = Object.prototype.hasOwnProperty;
 const hasOwn = (val, key) => hasOwnProperty$1.call(val, key);
 const isArray = Array.isArray;
 const isMap = (val) => toTypeString(val) === "[object Map]";
-const isSet = (val) => toTypeString(val) === "[object Set]";
 const isFunction = (val) => typeof val === "function";
 const isString = (val) => typeof val === "string";
 const isSymbol = (val) => typeof val === "symbol";
@@ -41,7 +33,6 @@ const toTypeString = (value) => objectToString.call(value);
 const toRawType = (value) => {
 	return toTypeString(value).slice(8, -1);
 };
-const isPlainObject$1 = (val) => toTypeString(val) === "[object Object]";
 const isIntegerKey = (key) => isString(key) && key !== "NaN" && key[0] !== "-" && "" + parseInt(key, 10) === key;
 const cacheStringFunction = (fn) => {
 	const cache = Object.create(null);
@@ -212,8 +203,9 @@ var ReactiveEffect = class {
 		this.depsTail = void 0;
 		this.flags = 5;
 		this.next = void 0;
-		this.cleanup = void 0;
+		this.cleanups = void 0;
 		this.scheduler = void 0;
+		this.scope = activeEffectScope;
 		if (activeEffectScope) if (activeEffectScope.active) activeEffectScope.effects.push(this);
 		else this.flags &= -2;
 	}
@@ -478,17 +470,26 @@ function resetTracking() {
 * an active effect.
 */
 function onEffectCleanup(fn, failSilently = false) {
-	if (activeSub instanceof ReactiveEffect) activeSub.cleanup = fn;
-	else if (!failSilently) warn("onEffectCleanup() was called when there was no active effect to associate with.");
+	if (activeSub instanceof ReactiveEffect) {
+		var _activeSub, _activeSub$cleanups;
+		((_activeSub$cleanups = (_activeSub = activeSub).cleanups) !== null && _activeSub$cleanups !== void 0 ? _activeSub$cleanups : _activeSub.cleanups = []).push(fn);
+	} else if (!failSilently) warn("onEffectCleanup() was called when there was no active effect to associate with.");
 }
 function cleanupEffect(e) {
-	const { cleanup } = e;
-	e.cleanup = void 0;
-	if (cleanup) {
+	const cleanups = e.cleanups;
+	e.cleanups = void 0;
+	if (cleanups) {
 		const prevSub = activeSub;
 		activeSub = void 0;
 		try {
-			cleanup();
+			let error;
+			for (const cleanup of cleanups) try {
+				cleanup();
+			} catch (cleanupError) {
+				var _error;
+				(_error = error) !== null && _error !== void 0 || (error = cleanupError);
+			}
+			if (error) throw error;
 		} finally {
 			activeSub = prevSub;
 		}
@@ -508,18 +509,6 @@ function batch(fn) {
 	}
 }
 /**
-* Executes the given function without tracking reactive dependencies.
-* Any reactive reads inside `fn` will not trigger effect re-runs.
-*/
-function untrack(fn) {
-	pauseTracking();
-	try {
-		return fn();
-	} finally {
-		resetTracking();
-	}
-}
-/**
 * Returns the currently executing reactive effect, if any.
 */
 function getCurrentEffect() {
@@ -717,6 +706,87 @@ function trigger(target, type, key, newValue, oldValue, oldTarget) {
 	endBatch();
 }
 //#endregion
+//#region packages/core/signal/src/computed.ts
+/**
+* @private exported by @vue/reactivity for Vue core use, but not exported from
+* the main vue package
+*/
+var ComputedRefImpl = class {
+	constructor(fn, setter, isSSR) {
+		this.fn = fn;
+		this.setter = setter;
+		this._value = void 0;
+		this.dep = new Dep(this);
+		this.__v_isRef = true;
+		this.deps = void 0;
+		this.depsTail = void 0;
+		this.flags = 16;
+		this.globalVersion = globalVersion - 1;
+		this.next = void 0;
+		this["__v_isReadonly"] = !setter;
+		this.isSSR = isSSR;
+	}
+	/**
+	* @internal
+	*/
+	notify() {
+		this.flags |= 16;
+		if (!(this.flags & 8) && activeSub !== this) {
+			queueSubscriber(this, true);
+			return true;
+		}
+	}
+	get value() {
+		const link = this.dep.track({
+			target: this,
+			type: "get",
+			key: "value"
+		});
+		refreshComputed(this);
+		if (link) link.version = this.dep.version;
+		return this._value;
+	}
+	set value(newValue) {
+		if (this.setter) this.setter(newValue);
+		else warn("Write operation failed: computed value is readonly");
+	}
+};
+/*@__NO_SIDE_EFFECTS__*/
+function computed(getterOrOptions, debugOptions, isSSR = false) {
+	let getter;
+	let setter;
+	if (isFunction(getterOrOptions)) getter = getterOrOptions;
+	else {
+		getter = getterOrOptions.get;
+		setter = getterOrOptions.set;
+	}
+	const cRef = new ComputedRefImpl(getter, setter, isSSR);
+	if (debugOptions && !isSSR) {
+		cRef.onTrack = debugOptions.onTrack;
+		cRef.onTrigger = debugOptions.onTrigger;
+	}
+	return cRef;
+}
+//#endregion
+//#region packages/core/signal/src/lifecycle.ts
+function onCleanup(fn) {
+	const effect = getCurrentEffect();
+	const scope = getCurrentScope();
+	if (scope && (effect === null || effect === void 0 ? void 0 : effect.scope) !== scope) {
+		onScopeDispose(fn, true);
+		return;
+	}
+	if (effect) {
+		onEffectCleanup(fn, true);
+		return;
+	}
+	if (scope) {
+		onScopeDispose(fn, true);
+		return;
+	}
+	warn("onCleanup() was called without active effect or scope.");
+}
+//#endregion
 //#region packages/core/signal/src/arrayInstrumentations.ts
 /**
 * Track array iteration and return:
@@ -902,60 +972,6 @@ function noTracking(self, method, args = []) {
 	return res;
 }
 //#endregion
-//#region packages/core/signal/src/ref.ts
-let _ReactiveFlags$IS_REF, _ReactiveFlags$IS_SHA;
-/*@__NO_SIDE_EFFECTS__*/
-function isRef(r) {
-	return r ? r["__v_isRef"] === true : false;
-}
-/*@__NO_SIDE_EFFECTS__*/
-function ref(value) {
-	return createRef(value, false);
-}
-function createRef(rawValue, shallow) {
-	if (/* @__PURE__ */ isRef(rawValue)) return rawValue;
-	return new RefImpl(rawValue, shallow);
-}
-_ReactiveFlags$IS_REF = "__v_isRef";
-_ReactiveFlags$IS_SHA = "__v_isShallow";
-/**
-* @internal
-*/
-var RefImpl = class {
-	constructor(value, isShallow) {
-		this.dep = new Dep();
-		this[_ReactiveFlags$IS_REF] = true;
-		this[_ReactiveFlags$IS_SHA] = false;
-		this._rawValue = isShallow ? value : /* @__PURE__ */ toRaw(value);
-		this._value = isShallow ? value : toReactive(value);
-		this["__v_isShallow"] = isShallow;
-	}
-	get value() {
-		this.dep.track({
-			target: this,
-			type: "get",
-			key: "value"
-		});
-		return this._value;
-	}
-	set value(newValue) {
-		const oldValue = this._rawValue;
-		const useDirectValue = this["__v_isShallow"] || /* @__PURE__ */ isShallow(newValue) || /* @__PURE__ */ isReadonly(newValue);
-		newValue = useDirectValue ? newValue : /* @__PURE__ */ toRaw(newValue);
-		if (hasChanged(newValue, oldValue)) {
-			this._rawValue = newValue;
-			this._value = useDirectValue ? newValue : toReactive(newValue);
-			this.dep.trigger({
-				target: this,
-				type: "set",
-				key: "value",
-				newValue,
-				oldValue
-			});
-		}
-	}
-};
-//#endregion
 //#region packages/core/signal/src/baseHandlers.ts
 const isNonTrackableKeys = /*@__PURE__*/ makeMap(`__proto__,__v_isRef,__isVue`);
 const builtInSymbols = new Set(/*@__PURE__*/ Object.getOwnPropertyNames(Symbol).filter((key) => key !== "arguments" && key !== "caller").map((key) => Symbol[key]).filter(isSymbol));
@@ -1388,256 +1404,152 @@ const toReactive = (value) => isObject(value) ? /* @__PURE__ */ reactive(value)
 */
 const toReadonly = (value) => isObject(value) ? /* @__PURE__ */ readonly(value) : value;
 //#endregion
-//#region packages/core/signal/src/state.ts
-function state(value) {
-	if (arguments.length === 0) return /* @__PURE__ */ ref();
-	return isProxyable(value) ? /* @__PURE__ */ reactive(value) : /* @__PURE__ */ ref(value);
+//#region packages/core/signal/src/ref.ts
+let _ReactiveFlags$IS_REF, _ReactiveFlags$IS_SHA;
+/*@__NO_SIDE_EFFECTS__*/
+function isRef(r) {
+	return r ? r["__v_isRef"] === true : false;
 }
-function isProxyable(value) {
-	if (value === null || typeof value !== "object") return false;
-	if (Array.isArray(value)) return true;
-	if (value instanceof Map || value instanceof Set || value instanceof WeakMap || value instanceof WeakSet) return true;
-	return isPlainObject(value);
+/*@__NO_SIDE_EFFECTS__*/
+function ref(value) {
+	return createRef(value, false);
 }
-function isPlainObject(value) {
-	const proto = Object.getPrototypeOf(value);
-	return proto === Object.prototype || proto === null;
+/*@__NO_SIDE_EFFECTS__*/
+function shallowRef(value) {
+	return createRef(value, true);
 }
-//#endregion
-//#region packages/core/signal/src/computed.ts
+function createRef(rawValue, shallow) {
+	if (/* @__PURE__ */ isRef(rawValue)) return rawValue;
+	return new RefImpl(rawValue, shallow);
+}
+_ReactiveFlags$IS_REF = "__v_isRef";
+_ReactiveFlags$IS_SHA = "__v_isShallow";
 /**
-* @private exported by @vue/reactivity for Vue core use, but not exported from
-* the main vue package
+* @internal
 */
-var ComputedRefImpl = class {
-	constructor(fn, setter, isSSR) {
-		this.fn = fn;
-		this.setter = setter;
-		this._value = void 0;
-		this.dep = new Dep(this);
-		this.__v_isRef = true;
-		this.deps = void 0;
-		this.depsTail = void 0;
-		this.flags = 16;
-		this.globalVersion = globalVersion - 1;
-		this.next = void 0;
-		this["__v_isReadonly"] = !setter;
-		this.isSSR = isSSR;
-	}
-	/**
-	* @internal
-	*/
-	notify() {
-		this.flags |= 16;
-		if (!(this.flags & 8) && activeSub !== this) {
-			queueSubscriber(this, true);
-			return true;
-		}
+var RefImpl = class {
+	constructor(value, isShallow) {
+		this.dep = new Dep();
+		this[_ReactiveFlags$IS_REF] = true;
+		this[_ReactiveFlags$IS_SHA] = false;
+		this._rawValue = isShallow ? value : /* @__PURE__ */ toRaw(value);
+		this._value = isShallow ? value : toReactive(value);
+		this["__v_isShallow"] = isShallow;
 	}
 	get value() {
-		const link = this.dep.track({
+		this.dep.track({
 			target: this,
 			type: "get",
 			key: "value"
 		});
-		refreshComputed(this);
-		if (link) link.version = this.dep.version;
 		return this._value;
 	}
 	set value(newValue) {
-		if (this.setter) this.setter(newValue);
-		else warn("Write operation failed: computed value is readonly");
+		const oldValue = this._rawValue;
+		const useDirectValue = this["__v_isShallow"] || /* @__PURE__ */ isShallow(newValue) || /* @__PURE__ */ isReadonly(newValue);
+		newValue = useDirectValue ? newValue : /* @__PURE__ */ toRaw(newValue);
+		if (hasChanged(newValue, oldValue)) {
+			this._rawValue = newValue;
+			this._value = useDirectValue ? newValue : toReactive(newValue);
+			this.dep.trigger({
+				target: this,
+				type: "set",
+				key: "value",
+				newValue,
+				oldValue
+			});
+		}
 	}
 };
-/*@__NO_SIDE_EFFECTS__*/
-function computed(getterOrOptions, debugOptions, isSSR = false) {
-	let getter;
-	let setter;
-	if (isFunction(getterOrOptions)) getter = getterOrOptions;
-	else {
-		getter = getterOrOptions.get;
-		setter = getterOrOptions.set;
-	}
-	const cRef = new ComputedRefImpl(getter, setter, isSSR);
-	if (debugOptions && !isSSR) {
-		cRef.onTrack = debugOptions.onTrack;
-		cRef.onTrigger = debugOptions.onTrigger;
+//#endregion
+//#region packages/core/signal/src/primitives.ts
+function createSignal(initialValue) {
+	const source = /* @__PURE__ */ shallowRef(initialValue);
+	const read = () => source.value;
+	const write = (value) => {
+		const next = typeof value === "function" ? value(source.value) : value;
+		source.value = next;
+		return next;
+	};
+	return [read, write];
+}
+function createMemo(compute) {
+	const memo = /* @__PURE__ */ computed(compute);
+	return () => memo.value;
+}
+function createEffect(run) {
+	effect(run);
+}
+function createRoot(run) {
+	const root = effectScope(true);
+	let disposed = false;
+	const dispose = () => {
+		if (disposed) return;
+		disposed = true;
+		root.stop();
+	};
+	try {
+		return root.run(() => run(dispose));
+	} catch (error) {
+		dispose();
+		throw error;
 	}
-	return cRef;
 }
 //#endregion
-//#region packages/core/signal/src/scheduler.ts
-function nextTick() {
-	return Promise.resolve();
+//#region packages/core/signal/src/state.ts
+function state(value) {
+	if (arguments.length === 0) return /* @__PURE__ */ ref();
+	return isProxyable(value) ? /* @__PURE__ */ reactive(value) : /* @__PURE__ */ ref(value);
+}
+function isProxyable(value) {
+	if (value === null || typeof value !== "object") return false;
+	if (Array.isArray(value)) return true;
+	if (value instanceof Map || value instanceof Set || value instanceof WeakMap || value instanceof WeakSet) return true;
+	return isPlainObject(value);
+}
+function isPlainObject(value) {
+	const proto = Object.getPrototypeOf(value);
+	return proto === Object.prototype || proto === null;
 }
 //#endregion
-//#region packages/core/signal/src/watch.ts
-const INITIAL_WATCHER_VALUE = {};
-const cleanupMap = /* @__PURE__ */ new WeakMap();
-let activeWatcher = void 0;
-/**
-* Registers a cleanup callback on the current active effect. This
-* registered cleanup callback will be invoked right before the
-* associated effect re-runs.
-*
-* @param cleanupFn - The callback function to attach to the effect's cleanup.
-* @param failSilently - if `true`, will not throw warning when called without
-* an active effect.
-* @param owner - The effect that this cleanup function should be attached to.
-* By default, the current active effect.
-*/
-function onWatcherCleanup(cleanupFn, failSilently = false, owner = activeWatcher) {
-	if (owner) {
-		let cleanups = cleanupMap.get(owner);
-		if (!cleanups) cleanupMap.set(owner, cleanups = []);
-		cleanups.push(cleanupFn);
-	} else if (!failSilently) warn("onWatcherCleanup() was called when there was no active watcher to associate with.");
-}
-function watch(source, cb, options = EMPTY_OBJ) {
-	const { immediate, deep, once, scheduler, augmentJob, call } = options;
-	const warnInvalidSource = (s) => {
-		(options.onWarn || warn)(`Invalid watch source: `, s, "A watch source can only be a getter/effect function, a ref, a reactive object, or an array of these types.");
-	};
-	const reactiveGetter = (source) => {
-		if (deep) return source;
-		if (/* @__PURE__ */ isShallow(source) || deep === false || deep === 0) return traverse(source, 1);
-		return traverse(source);
-	};
-	let effect;
-	let getter;
-	let cleanup;
-	let boundCleanup;
-	let forceTrigger = false;
-	let isMultiSource = false;
-	if (/* @__PURE__ */ isRef(source)) {
-		getter = () => source.value;
-		forceTrigger = /* @__PURE__ */ isShallow(source);
-	} else if (/* @__PURE__ */ isReactive(source)) {
-		getter = () => reactiveGetter(source);
-		forceTrigger = true;
-	} else if (isArray(source)) {
-		isMultiSource = true;
-		forceTrigger = source.some((s) => /* @__PURE__ */ isReactive(s) || /* @__PURE__ */ isShallow(s));
-		getter = () => source.map((s) => {
-			if (/* @__PURE__ */ isRef(s)) return s.value;
-			else if (/* @__PURE__ */ isReactive(s)) return reactiveGetter(s);
-			else if (isFunction(s)) return call ? call(s, 2) : s();
-			else warnInvalidSource(s);
-		});
-	} else if (isFunction(source)) if (cb) getter = call ? () => call(source, 2) : source;
-	else getter = () => {
-		if (cleanup) {
-			pauseTracking();
-			try {
-				cleanup();
-			} finally {
-				resetTracking();
-			}
-		}
-		const currentEffect = activeWatcher;
-		activeWatcher = effect;
-		try {
-			return call ? call(source, 3, [boundCleanup]) : source(boundCleanup);
-		} finally {
-			activeWatcher = currentEffect;
-		}
-	};
-	else {
-		getter = NOOP;
-		warnInvalidSource(source);
-	}
-	if (cb && deep) {
-		const baseGetter = getter;
-		const depth = deep === true ? Infinity : deep;
-		getter = () => traverse(baseGetter(), depth);
-	}
-	const scope = getCurrentScope();
-	const watchHandle = () => {
-		effect.stop();
-		if (scope && scope.active) remove(scope.effects, effect);
-	};
-	if (once && cb) {
-		const _cb = cb;
-		cb = (...args) => {
-			_cb(...args);
-			watchHandle();
-		};
-	}
-	let oldValue = isMultiSource ? new Array(source.length).fill(INITIAL_WATCHER_VALUE) : INITIAL_WATCHER_VALUE;
-	const job = (immediateFirstRun) => {
-		if (!(effect.flags & 1) || !effect.dirty && !immediateFirstRun) return;
-		if (cb) {
-			const newValue = effect.run();
-			if (deep || forceTrigger || (isMultiSource ? newValue.some((v, i) => hasChanged(v, oldValue[i])) : hasChanged(newValue, oldValue))) {
-				if (cleanup) cleanup();
-				const currentWatcher = activeWatcher;
-				activeWatcher = effect;
-				try {
-					const args = [
-						newValue,
-						oldValue === INITIAL_WATCHER_VALUE ? void 0 : isMultiSource && oldValue[0] === INITIAL_WATCHER_VALUE ? [] : oldValue,
-						boundCleanup
-					];
-					oldValue = newValue;
-					call ? call(cb, 3, args) : cb(...args);
-				} finally {
-					activeWatcher = currentWatcher;
-				}
-			}
-		} else effect.run();
-	};
-	if (augmentJob) augmentJob(job);
-	effect = new ReactiveEffect(getter);
-	effect.scheduler = scheduler ? () => scheduler(job, false) : job;
-	boundCleanup = (fn) => onWatcherCleanup(fn, false, effect);
-	cleanup = effect.onStop = () => {
-		const cleanups = cleanupMap.get(effect);
-		if (cleanups) {
-			if (call) call(cleanups, 4);
-			else for (const cleanup of cleanups) cleanup();
-			cleanupMap.delete(effect);
-		}
+//#region packages/core/runtime-dom/src/domOwnership.ts
+const activeLightDomHosts = /* @__PURE__ */ new WeakMap();
+const runtimeOwnedNodes = /* @__PURE__ */ new WeakSet();
+function registerLightDomHost(host, lightChildren) {
+	const ownership = { lightChildren };
+	activeLightDomHosts.set(host, ownership);
+	return () => {
+		if (activeLightDomHosts.get(host) === ownership) activeLightDomHosts.delete(host);
 	};
-	effect.onTrack = options.onTrack;
-	effect.onTrigger = options.onTrigger;
-	if (cb) if (immediate) job(true);
-	else oldValue = effect.run();
-	else if (scheduler) scheduler(job.bind(null, true), true);
-	else effect.run();
-	watchHandle.pause = effect.pause.bind(effect);
-	watchHandle.resume = effect.resume.bind(effect);
-	watchHandle.stop = watchHandle;
-	return watchHandle;
-}
-function traverse(value, depth = Infinity, seen) {
-	if (depth <= 0 || !isObject(value) || value["__v_skip"]) return value;
-	seen = seen || /* @__PURE__ */ new Map();
-	if ((seen.get(value) || 0) >= depth) return value;
-	seen.set(value, depth);
-	depth--;
-	if (/* @__PURE__ */ isRef(value)) traverse(value.value, depth, seen);
-	else if (isArray(value)) for (let i = 0; i < value.length; i++) traverse(value[i], depth, seen);
-	else if (isSet(value) || isMap(value)) value.forEach((v) => {
-		traverse(v, depth, seen);
-	});
-	else if (isPlainObject$1(value)) {
-		for (const key in value) traverse(value[key], depth, seen);
-		for (const key of Object.getOwnPropertySymbols(value)) if (Object.prototype.propertyIsEnumerable.call(value, key)) traverse(value[key], depth, seen);
-	}
-	return value;
 }
-//#endregion
-//#region packages/core/signal/src/lifecycle.ts
-function onCleanup(fn) {
-	if (getCurrentEffect()) {
-		onEffectCleanup(fn, true);
+function trackRuntimeDomInsertion(parent, node) {
+	const ownership = activeLightDomHosts.get(parent);
+	if (!ownership) return;
+	if (node.nodeType === 11) {
+		for (const child of node.childNodes) trackRuntimeNode(ownership, child);
 		return;
 	}
-	if (getCurrentScope()) {
-		onScopeDispose(fn, true);
-		return;
+	trackRuntimeNode(ownership, node);
+}
+function isRuntimeOwnedNode(node) {
+	return runtimeOwnedNodes.has(node);
+}
+function trackRuntimeNode(ownership, node) {
+	if (!ownership.lightChildren.includes(node)) runtimeOwnedNodes.add(node);
+}
+//#endregion
+//#region packages/core/runtime-dom/src/range.ts
+function insertTracked(parent, value, marker = null) {
+	if (value === void 0 || value == null || value === false || value === true) return [];
+	if (Array.isArray(value)) {
+		const nodes = [];
+		for (const item of value) nodes.push(...insertTracked(parent, item, marker));
+		return nodes;
 	}
-	warn("onCleanup() was called without active effect or scope.");
+	const node = value instanceof Node ? value : document.createTextNode(String(value));
+	trackRuntimeDomInsertion(parent, node);
+	parent.insertBefore(node, marker);
+	return [node];
 }
 //#endregion
 //#region packages/core/runtime-dom/src/hostContext.ts
@@ -1655,19 +1567,6 @@ function withHostContext(context, fn) {
 	}
 }
 //#endregion
-//#region packages/core/runtime-dom/src/range.ts
-function insertTracked(parent, value, marker = null) {
-	if (value === void 0 || value == null || value === false || value === true) return [];
-	if (Array.isArray(value)) {
-		const nodes = [];
-		for (const item of value) nodes.push(...insertTracked(parent, item, marker));
-		return nodes;
-	}
-	const node = value instanceof Node ? value : document.createTextNode(String(value));
-	parent.insertBefore(node, marker);
-	return [node];
-}
-//#endregion
 //#region packages/core/runtime-dom/src/insert.ts
 function insert(parent, value, marker = null) {
 	if (value === void 0) {
@@ -1924,11 +1823,11 @@ function bindStyle(el, value) {
 function patchStyle(el, prev, next) {
 	const style = el.style;
 	if (prev) {
-		for (const key in prev) if (!(key in next)) style.setProperty(toKebabCase$1(key), "");
+		for (const key in prev) if (!(key in next)) style.setProperty(toKebabCase$2(key), "");
 	}
 	for (const key in next) {
 		const value = next[key];
-		const name = toKebabCase$1(key);
+		const name = toKebabCase$2(key);
 		if (value == null) style.setProperty(name, "");
 		else style.setProperty(name, normalizeStyleValue(key, value));
 	}
@@ -1950,7 +1849,7 @@ const unitlessNumbers = /* @__PURE__ */ new Set([
 function isUnitlessNumber(key) {
 	return unitlessNumbers.has(key);
 }
-function toKebabCase$1(value) {
+function toKebabCase$2(value) {
 	return value.replace(/[A-Z]/g, (match) => `-${match.toLowerCase()}`);
 }
 //#endregion
@@ -1972,6 +1871,248 @@ function For(props) {
 	return (_props$each$map = (_props$each = props.each) === null || _props$each === void 0 ? void 0 : _props$each.map((item, index) => props.children(item, index))) !== null && _props$each$map !== void 0 ? _props$each$map : null;
 }
 //#endregion
+//#region packages/core/runtime-dom/src/customElementContract.ts
+function getCustomElementAttributeName(prop) {
+	var _prop$attrName;
+	if (prop.attrName === false) return void 0;
+	if (!isAttributeBackedType(prop.type) && !prop.deserialize) return;
+	return normalizeAttributeName((_prop$attrName = prop.attrName) !== null && _prop$attrName !== void 0 ? _prop$attrName : toKebabCase$1(prop.name));
+}
+function getCustomElementObservedAttributes(props) {
+	const attributes = /* @__PURE__ */ new Set();
+	for (const prop of props) {
+		const attrName = getCustomElementAttributeName(prop);
+		if (attrName) attributes.add(attrName);
+	}
+	return Array.from(attributes);
+}
+function coerceCustomElementAttribute(prop, value) {
+	if (typeof prop.deserialize === "function") return prop.deserialize(value);
+	if (prop.deserialize === true) return value;
+	switch (prop.type) {
+		case "boolean": return value !== null;
+		case "number": return value === null ? void 0 : Number(value);
+		case "string": return value !== null && value !== void 0 ? value : void 0;
+		case "object":
+		case "array": return coerceStructuredAttribute(prop, value);
+		case "function": return;
+		default: return value;
+	}
+}
+function reflectCustomElementProperty(element, prop, value, reflectingAttrs) {
+	const attrName = getCustomElementAttributeName(prop);
+	if (!attrName || prop.serialize === true) return;
+	reflectingAttrs === null || reflectingAttrs === void 0 || reflectingAttrs.add(attrName);
+	try {
+		const serialized = serializeCustomElementProperty(prop, value);
+		if (serialized == null) element.removeAttribute(attrName);
+		else element.setAttribute(attrName, serialized);
+	} finally {
+		reflectingAttrs === null || reflectingAttrs === void 0 || reflectingAttrs.delete(attrName);
+	}
+}
+function createCustomElementMountLifecycle(mount) {
+	let mounted;
+	return {
+		connect() {
+			var _mounted;
+			(_mounted = mounted) !== null && _mounted !== void 0 || (mounted = mount());
+			return mounted;
+		},
+		disconnect() {
+			const current = mounted;
+			mounted = void 0;
+			current === null || current === void 0 || current.dispose();
+		},
+		current() {
+			return mounted;
+		}
+	};
+}
+function serializeCustomElementProperty(prop, value) {
+	if (typeof prop.serialize === "function") return prop.serialize(value);
+	if (prop.type === "boolean") return value ? "" : null;
+	if (value == null) return null;
+	if (prop.type === "object" || prop.type === "array") return JSON.stringify(value);
+	if (prop.type === "function") return void 0;
+	return String(value);
+}
+function coerceStructuredAttribute(prop, value) {
+	if (value === null) return void 0;
+	try {
+		return JSON.parse(value);
+	} catch (_unused) {
+		console.warn(`[Zeus custom-element] Failed to parse JSON attribute "${getCustomElementAttributeName(prop)}".`);
+		return prop.type === "array" ? [] : {};
+	}
+}
+function isAttributeBackedType(type) {
+	return type === "string" || type === "number" || type === "boolean";
+}
+function normalizeAttributeName(value) {
+	return value.toLowerCase();
+}
+function toKebabCase$1(value) {
+	return value.replace(/[A-Z]/g, (match) => `-${match.toLowerCase()}`);
+}
+//#endregion
+//#region packages/core/runtime-dom/src/slot.ts
+function createSlot(name, fallback) {
+	const context = getCurrentHostContext();
+	if (!context) return createNativeSlot(name, fallback);
+	if (context.mode === "shadow") return createNativeSlot(name, fallback);
+	if (context.projection) return context.projection.createSlot(name, fallback);
+	const assigned = findLightSlotNodes(context.lightChildren, name);
+	if (assigned.length > 0) return Array.from(assigned);
+	return fallback ? fallback() : null;
+}
+function createLightDomProjection(host, lightChildren) {
+	const outlets = [];
+	let observer;
+	let unregisterHost;
+	const observe = () => {
+		observer === null || observer === void 0 || observer.observe(host, {
+			attributes: true,
+			attributeFilter: ["slot"],
+			childList: true,
+			subtree: true
+		});
+		for (const node of lightChildren) {
+			if (node.nodeType !== Node.ELEMENT_NODE || host.contains(node)) continue;
+			observer === null || observer === void 0 || observer.observe(node, {
+				attributes: true,
+				attributeFilter: ["slot"]
+			});
+		}
+	};
+	const reconcile = () => {
+		observer === null || observer === void 0 || observer.disconnect();
+		const claimed = /* @__PURE__ */ new Set();
+		for (const outlet of outlets) {
+			const assigned = lightChildren.filter((node) => {
+				if (claimed.has(node) || !matchesLightSlot(node, outlet.name)) return false;
+				claimed.add(node);
+				return true;
+			});
+			replaceOutletNodes(outlet, assigned.length > 0 ? assigned : outlet.fallbackNodes);
+		}
+		for (const node of lightChildren) if (!claimed.has(node) && host.contains(node)) {
+			var _node$parentNode;
+			(_node$parentNode = node.parentNode) === null || _node$parentNode === void 0 || _node$parentNode.removeChild(node);
+		}
+		observer === null || observer === void 0 || observer.takeRecords();
+		observe();
+	};
+	const handleMutations = (records) => {
+		const added = /* @__PURE__ */ new Set();
+		const removed = /* @__PURE__ */ new Set();
+		let changed = false;
+		for (const record of records) {
+			if (record.type === "attributes") {
+				if (lightChildren.includes(record.target)) changed = true;
+				continue;
+			}
+			for (const node of record.removedNodes) if (lightChildren.includes(node)) removed.add(node);
+			if (record.target !== host) continue;
+			const additions = Array.from(record.addedNodes).filter((node) => {
+				return !isRuntimeOwnedNode(node);
+			});
+			if (additions.length === 0) continue;
+			for (const node of additions) added.add(node);
+			insertLightChildren(lightChildren, additions, record);
+			changed = true;
+		}
+		for (const node of removed) {
+			if (added.has(node) || host.contains(node)) continue;
+			const index = lightChildren.indexOf(node);
+			if (index >= 0) {
+				lightChildren.splice(index, 1);
+				changed = true;
+			}
+		}
+		if (changed) reconcile();
+	};
+	return {
+		createSlot(name, fallback) {
+			const fragment = document.createDocumentFragment();
+			const start = document.createComment(name ? `zeus-slot:${name}` : "zeus-slot");
+			const end = document.createComment("/zeus-slot");
+			fragment.append(start, end);
+			const outlet = {
+				name,
+				start,
+				end,
+				fallbackNodes: fallback ? insertTracked(fragment, fallback(), end) : []
+			};
+			outlets.push(outlet);
+			reconcile();
+			return fragment;
+		},
+		connect() {
+			var _host$ownerDocument$d;
+			if (observer) return;
+			const Observer = (_host$ownerDocument$d = host.ownerDocument.defaultView) === null || _host$ownerDocument$d === void 0 ? void 0 : _host$ownerDocument$d.MutationObserver;
+			if (!Observer) return;
+			unregisterHost = registerLightDomHost(host, lightChildren);
+			observer = new Observer(handleMutations);
+			observe();
+		},
+		disconnect() {
+			observer === null || observer === void 0 || observer.disconnect();
+			observer = void 0;
+			unregisterHost === null || unregisterHost === void 0 || unregisterHost();
+			unregisterHost = void 0;
+		}
+	};
+}
+function replaceOutletNodes(outlet, nextNodes) {
+	const parent = outlet.end.parentNode;
+	if (!parent || parent !== outlet.start.parentNode) return;
+	let current = outlet.start.nextSibling;
+	while (current && current !== outlet.end) {
+		const next = current.nextSibling;
+		parent.removeChild(current);
+		current = next;
+	}
+	for (const node of nextNodes) parent.insertBefore(node, outlet.end);
+}
+function insertLightChildren(lightChildren, additions, record) {
+	for (const node of additions) {
+		const currentIndex = lightChildren.indexOf(node);
+		if (currentIndex >= 0) lightChildren.splice(currentIndex, 1);
+	}
+	let insertionIndex = lightChildren.length;
+	const previousIndex = record.previousSibling ? lightChildren.indexOf(record.previousSibling) : -1;
+	const nextIndex = record.nextSibling ? lightChildren.indexOf(record.nextSibling) : -1;
+	if (previousIndex >= 0) insertionIndex = previousIndex + 1;
+	else if (nextIndex >= 0) insertionIndex = nextIndex;
+	else if (record.previousSibling === null) insertionIndex = 0;
+	lightChildren.splice(insertionIndex, 0, ...additions);
+}
+function createNativeSlot(name, fallback) {
+	const slot = document.createElement("slot");
+	if (name) slot.setAttribute("name", name);
+	const fallbackValue = fallback === null || fallback === void 0 ? void 0 : fallback();
+	if (fallbackValue != null) insert(slot, fallbackValue);
+	return slot;
+}
+function findLightSlotNodes(nodes, name) {
+	return nodes.filter((node) => matchesLightSlot(node, name));
+}
+function matchesLightSlot(node, name) {
+	if (name) {
+		if (node.nodeType !== Node.ELEMENT_NODE) return false;
+		return node.getAttribute("slot") === name;
+	}
+	if (node.nodeType === Node.ELEMENT_NODE) return !node.hasAttribute("slot");
+	return isMeaningfulTextNode(node);
+}
+function isMeaningfulTextNode(node) {
+	var _node$textContent;
+	if (node.nodeType !== Node.TEXT_NODE) return false;
+	return Boolean((_node$textContent = node.textContent) === null || _node$textContent === void 0 ? void 0 : _node$textContent.trim());
+}
+//#endregion
 //#region packages/core/runtime-dom/src/defineElement.ts
 const ZEUS_ELEMENT_DEFINITION = Symbol.for("zeus.element.definition");
 function prop(input, options = {}) {
@@ -2013,8 +2154,8 @@ function createPropStore(defs) {
 	const props = {};
 	for (const def of defs) {
 		const slot = state();
-		slots.set(def.key, slot);
-		Object.defineProperty(props, def.key, {
+		slots.set(def.name, slot);
+		Object.defineProperty(props, def.name, {
 			configurable: false,
 			enumerable: true,
 			get() {
@@ -2053,7 +2194,7 @@ function defineElement(tagName, options, setup) {
 		setup,
 		propDefs
 	};
-	const observedAttributes = propDefs.filter((def) => def.attr !== false).map((def) => def.attr);
+	const observedAttributes = getCustomElementObservedAttributes(propDefs);
 	class ZeusElement extends HTMLElement {
 		static get observedAttributes() {
 			return observedAttributes;
@@ -2062,7 +2203,8 @@ function defineElement(tagName, options, setup) {
 			super();
 			this.lightChildren = [];
 			this.capturedLightChildren = false;
-			this.reflecting = false;
+			this.attributeProps = /* @__PURE__ */ new Set();
+			this.reflectingAttrs = /* @__PURE__ */ new Set();
 			this.propStore = createPropStore(propDefs);
 			this.props = this.propStore.props;
 			applyPropDefaults(this.propStore, propDefs);
@@ -2074,17 +2216,23 @@ function defineElement(tagName, options, setup) {
 				emit: createEmitApi(this, options.emits),
 				expose: createExpose(this)
 			};
+			this.mountLifecycle = createCustomElementMountLifecycle(() => this.mountElement());
 		}
 		connectedCallback() {
+			this.mountLifecycle.connect();
+		}
+		disconnectedCallback() {
+			this.mountLifecycle.disconnect();
+		}
+		mountElement() {
 			var _options$shadow, _options$consumes;
-			if (this.dispose) return;
 			const shadow = (_options$shadow = options.shadow) !== null && _options$shadow !== void 0 ? _options$shadow : false;
 			const mode = shadow ? "shadow" : "light";
 			if (mode === "light" && !this.capturedLightChildren) {
 				this.lightChildren = Array.from(this.childNodes);
 				this.capturedLightChildren = true;
 			}
-			this.syncAttributesToProps(propDefs);
+			const projection = mode === "light" ? createLightDomProjection(this, this.lightChildren) : void 0;
 			const owner = createOwner();
 			for (const context of (_options$consumes = options.consumes) !== null && _options$consumes !== void 0 ? _options$consumes : []) {
 				const resolved = resolveDOMContext(this, context);
@@ -2095,18 +2243,19 @@ function defineElement(tagName, options, setup) {
 			const hostContext = {
 				host: this,
 				mode,
-				lightChildren: this.lightChildren
+				lightChildren: this.lightChildren,
+				projection
 			};
-			this.dispose = render(() => runWithOwner(owner, () => withHostContext(hostContext, () => {
+			const dispose = render(() => runWithOwner(owner, () => withHostContext(hostContext, () => {
 				syncFormValue(this.props, this.setupContext, options.form);
 				return setup(this.props, this.setupContext);
 			})), target, { owner });
 			mountStyles(target, options.styles);
-		}
-		disconnectedCallback() {
-			var _this$dispose;
-			(_this$dispose = this.dispose) === null || _this$dispose === void 0 || _this$dispose.call(this);
-			this.dispose = void 0;
+			projection === null || projection === void 0 || projection.connect();
+			return { dispose() {
+				projection === null || projection === void 0 || projection.disconnect();
+				dispose();
+			} };
 		}
 		formAssociatedCallback(form) {
 			var _options$form, _options$form$associa;
@@ -2125,10 +2274,11 @@ function defineElement(tagName, options, setup) {
 			(_options$form4 = options.form) === null || _options$form4 === void 0 || (_options$form4$stateR = _options$form4.stateRestore) === null || _options$form4$stateR === void 0 || _options$form4$stateR.call(_options$form4, state, mode, this.props, this.setupContext);
 		}
 		attributeChangedCallback(name, oldValue, newValue) {
-			if (oldValue === newValue || this.reflecting) return;
-			const def = propDefs.find((item) => item.attr === name);
+			if (oldValue === newValue || this.reflectingAttrs.has(name)) return;
+			const def = propDefs.find((item) => item.attrName === name);
 			if (!def) return;
-			this.propStore.set(def.key, castAttributeValue(newValue, def));
+			this.attributeProps.add(def.name);
+			this.propStore.set(def.name, coerceCustomElementAttribute(def, newValue));
 		}
 		resolveRenderTarget(shadow) {
 			if (this.target) return this.target;
@@ -2139,24 +2289,11 @@ function defineElement(tagName, options, setup) {
 			this.target = this.attachShadow(typeof shadow === "object" ? shadow : { mode: "open" });
 			return this.target;
 		}
-		syncAttributesToProps(defs) {
-			for (const def of defs) {
-				if (def.attr === false) continue;
-				const value = this.getAttribute(def.attr);
-				if (value !== null || def.type === Boolean) this.propStore.set(def.key, castAttributeValue(value, def));
-			}
-		}
 		_writePropFromProperty(key, value) {
-			const def = propDefs.find((item) => item.key === key);
+			const def = propDefs.find((item) => item.name === key);
+			this.attributeProps.delete(key);
 			this.propStore.set(key, value);
-			if ((def === null || def === void 0 ? void 0 : def.reflect) && def.attr !== false) {
-				this.reflecting = true;
-				try {
-					reflectPropToAttribute(this, def, value);
-				} finally {
-					this.reflecting = false;
-				}
-			}
+			if (def === null || def === void 0 ? void 0 : def.reflect) reflectCustomElementProperty(this, def, value, this.reflectingAttrs);
 		}
 	}
 	ZeusElement.formAssociated = Boolean(options.formAssociated);
@@ -2174,18 +2311,18 @@ function normalizePropDefinitions(props) {
 		if (typeof input === "function") {
 			const type = input;
 			return {
-				key: propKey,
-				attr: isAttributeBackedConstructor(type) ? toKebabCase(propKey) : false,
-				type,
+				name: propKey,
+				attrName: isAttributeBackedConstructor(type) ? toKebabCase(propKey) : false,
+				type: normalizePropType(type),
 				reflect: false
 			};
 		}
 		const type = input === null || input === void 0 ? void 0 : input.type;
 		const defaultAttr = isAttributeBackedConstructor(type) ? toKebabCase(propKey) : false;
 		return {
-			key: propKey,
-			attr: (input === null || input === void 0 ? void 0 : input.attr) === void 0 ? defaultAttr : input.attr,
-			type,
+			name: propKey,
+			attrName: (input === null || input === void 0 ? void 0 : input.attr) === void 0 ? defaultAttr : input.attr,
+			type: normalizePropType(type),
 			reflect: Boolean(input === null || input === void 0 ? void 0 : input.reflect),
 			default: input === null || input === void 0 ? void 0 : input.default,
 			serialize: input === null || input === void 0 ? void 0 : input.serialize,
@@ -2197,12 +2334,12 @@ function applyPropDefaults(store, defs) {
 	for (const def of defs) {
 		if (!("default" in def)) continue;
 		const value = typeof def.default === "function" ? def.default() : def.default;
-		store.set(def.key, value);
+		store.set(def.name, value);
 	}
 }
 function definePropAccessors(element, store, defs) {
 	for (const def of defs) {
-		const key = def.key;
+		const key = def.name;
 		const hadOwnValue = Object.prototype.hasOwnProperty.call(element, key);
 		const ownValue = hadOwnValue ? element[key] : void 0;
 		if (hadOwnValue) delete element[key];
@@ -2224,44 +2361,6 @@ function definePropAccessors(element, store, defs) {
 		if (hadOwnValue) element._writePropFromProperty(key, ownValue);
 	}
 }
-function castAttributeValue(value, def) {
-	if (def.deserialize) return def.deserialize(value);
-	if (def.type === Boolean) return value !== null;
-	if (value === null) return;
-	if (def.type === Number) return Number(value);
-	if (def.type === Object || def.type === Array) try {
-		return JSON.parse(value);
-	} catch (_unused) {
-		console.warn(`[Zeus custom-element] Failed to parse JSON attribute "${def.attr}".`);
-		return def.type === Array ? [] : {};
-	}
-	if (def.type === Function) return;
-	return value;
-}
-function reflectPropToAttribute(element, def, value) {
-	if (def.attr === false) return;
-	if (def.serialize) {
-		const serialized = def.serialize(value);
-		if (serialized == null) element.removeAttribute(def.attr);
-		else element.setAttribute(def.attr, serialized);
-		return;
-	}
-	if (def.type === Boolean) {
-		if (value) element.setAttribute(def.attr, "");
-		else element.removeAttribute(def.attr);
-		return;
-	}
-	if (value == null) {
-		element.removeAttribute(def.attr);
-		return;
-	}
-	if (def.type === Object || def.type === Array) {
-		element.setAttribute(def.attr, JSON.stringify(value));
-		return;
-	}
-	if (def.type === Function) return;
-	element.setAttribute(def.attr, String(value));
-}
 function syncFormValue(props, context, form) {
 	const valueResolver = form === null || form === void 0 ? void 0 : form.value;
 	const stateResolver = form === null || form === void 0 ? void 0 : form.state;
@@ -2323,6 +2422,15 @@ function createExpose(host) {
 function isAttributeBackedConstructor(type) {
 	return type === String || type === Number || type === Boolean;
 }
+function normalizePropType(type) {
+	if (type === String) return "string";
+	if (type === Number) return "number";
+	if (type === Boolean) return "boolean";
+	if (type === Object) return "object";
+	if (type === Array) return "array";
+	if (type === Function) return "function";
+	return "unknown";
+}
 function mountStyles(target, styles) {
 	if (!styles) return;
 	const list = Array.isArray(styles) ? styles : [styles];
@@ -2360,38 +2468,6 @@ function bindRef(el, target) {
 	}, true);
 }
 //#endregion
-//#region packages/core/runtime-dom/src/slot.ts
-function createSlot(name, fallback) {
-	const context = getCurrentHostContext();
-	if (!context) return createNativeSlot(name, fallback);
-	if (context.mode === "shadow") return createNativeSlot(name, fallback);
-	const assigned = findLightSlotNodes(context.lightChildren, name);
-	if (assigned.length > 0) return Array.from(assigned);
-	return fallback ? fallback() : null;
-}
-function createNativeSlot(name, fallback) {
-	const slot = document.createElement("slot");
-	if (name) slot.setAttribute("name", name);
-	const fallbackValue = fallback === null || fallback === void 0 ? void 0 : fallback();
-	if (fallbackValue != null) insert(slot, fallbackValue);
-	return slot;
-}
-function findLightSlotNodes(nodes, name) {
-	if (name) return nodes.filter((node) => {
-		if (node.nodeType !== Node.ELEMENT_NODE) return false;
-		return node.getAttribute("slot") === name;
-	});
-	return nodes.filter((node) => {
-		if (node.nodeType === Node.ELEMENT_NODE) return !node.hasAttribute("slot");
-		return isMeaningfulTextNode(node);
-	});
-}
-function isMeaningfulTextNode(node) {
-	var _node$textContent;
-	if (node.nodeType !== Node.TEXT_NODE) return false;
-	return Boolean((_node$textContent = node.textContent) === null || _node$textContent === void 0 ? void 0 : _node$textContent.trim());
-}
-//#endregion
 //#region packages/core/runtime-dom/src/webComponents.ts
 const HOST_RESERVED_KEYS = /* @__PURE__ */ new Set([
 	"children",
@@ -2532,4 +2608,4 @@ function setFallbackRef(target, el) {
 	}
 }
 //#endregion
-export { For, Fragment, Host, Show, Slot, batch, computed, createContext, defineElement, effect, event, inject, jsx, jsxDEV, jsxs, nextTick, onCleanup, prop, provide, render, effectScope as scope, state, untrack, useContext, watch };
+export { For, Fragment, Host, Show, Slot, batch, createContext, createEffect, createMemo, createRoot, createSignal, defineElement, event, inject, jsx, jsxDEV, jsxs, onCleanup, prop, provide, render, useContext };