@zeus-js/zeus 0.0.2 → 0.1.0-beta.1

package/dist/zeus.esm-browser.js

@@ -1,9 +1,9 @@
 /**
-* zeus v0.0.2
+* zeus v0.1.0-beta.1
 * (c) 2026 baicie
 * Released under the MIT License.
 **/
-//#region packages/shared/src/makeMap.ts
+//#region packages/core/shared/src/makeMap.ts
 /**
 * Make a map and return a function for checking if a key
 * is in that map.
@@ -18,7 +18,7 @@ function makeMap(str) {
 	return (val) => val in map;
 }
 //#endregion
-//#region packages/shared/src/general.ts
+//#region packages/core/shared/src/general.ts
 const EMPTY_OBJ = Object.freeze({});
 Object.freeze([]);
 const NOOP = () => {};
@@ -57,12 +57,12 @@ const capitalize = cacheStringFunction((str) => {
 });
 const hasChanged = (value, oldValue) => !Object.is(value, oldValue);
 //#endregion
-//#region packages/signal/src/warning.ts
+//#region packages/core/signal/src/warning.ts
 function warn(msg, ...args) {
 	console.warn(`[Zeus warn] ${msg}`, ...args);
 }
 //#endregion
-//#region packages/signal/src/effectScope.ts
+//#region packages/core/signal/src/effectScope.ts
 let activeEffectScope;
 var EffectScope = class {
 	constructor(detached = false) {
@@ -202,7 +202,7 @@ function onScopeDispose(fn, failSilently = false) {
 	else if (!failSilently) warn("onScopeDispose() is called when there is no active effect scope to be associated with.");
 }
 //#endregion
-//#region packages/signal/src/effect.ts
+//#region packages/core/signal/src/effect.ts
 let activeSub;
 const pausedQueueEffects = /* @__PURE__ */ new WeakSet();
 var ReactiveEffect = class {
@@ -527,7 +527,7 @@ function getCurrentEffect() {
 	return activeSub instanceof ReactiveEffect ? activeSub : void 0;
 }
 //#endregion
-//#region packages/signal/src/dep.ts
+//#region packages/core/signal/src/dep.ts
 /**
 * Incremented every time a reactive change happens
 * This is used to give computed a fast path to avoid re-compute when nothing
@@ -718,7 +718,7 @@ function trigger(target, type, key, newValue, oldValue, oldTarget) {
 	endBatch();
 }
 //#endregion
-//#region packages/signal/src/arrayInstrumentations.ts
+//#region packages/core/signal/src/arrayInstrumentations.ts
 /**
 * Track array iteration and return:
 * - if input is reactive: a cloned raw array with reactive values
@@ -903,7 +903,7 @@ function noTracking(self, method, args = []) {
 	return res;
 }
 //#endregion
-//#region packages/signal/src/ref.ts
+//#region packages/core/signal/src/ref.ts
 let _ReactiveFlags$IS_REF, _ReactiveFlags$IS_SHA;
 /*@__NO_SIDE_EFFECTS__*/
 function isRef(r) {
@@ -957,7 +957,7 @@ var RefImpl = class {
 	}
 };
 //#endregion
-//#region packages/signal/src/baseHandlers.ts
+//#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));
 function hasOwnProperty(key) {
@@ -1061,7 +1061,7 @@ var ReadonlyReactiveHandler = class extends BaseReactiveHandler {
 const mutableHandlers = /*@__PURE__*/ new MutableReactiveHandler();
 const readonlyHandlers = /*@__PURE__*/ new ReadonlyReactiveHandler();
 //#endregion
-//#region packages/signal/src/collectionHandlers.ts
+//#region packages/core/signal/src/collectionHandlers.ts
 const toShallow = (value) => value;
 const getProto = (v) => Reflect.getPrototypeOf(v);
 function createIterableMethod(method, isReadonly, isShallow) {
@@ -1220,7 +1220,7 @@ function checkIdentityKeys(target, has, key) {
 	}
 }
 //#endregion
-//#region packages/signal/src/reactive.ts
+//#region packages/core/signal/src/reactive.ts
 const reactiveMap = /* @__PURE__ */ new WeakMap();
 const shallowReactiveMap = /* @__PURE__ */ new WeakMap();
 const readonlyMap = /* @__PURE__ */ new WeakMap();
@@ -1389,7 +1389,7 @@ const toReactive = (value) => isObject(value) ? /* @__PURE__ */ reactive(value)
 */
 const toReadonly = (value) => isObject(value) ? /* @__PURE__ */ readonly(value) : value;
 //#endregion
-//#region packages/signal/src/state.ts
+//#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);
@@ -1405,7 +1405,7 @@ function isPlainObject(value) {
 	return proto === Object.prototype || proto === null;
 }
 //#endregion
-//#region packages/signal/src/computed.ts
+//#region packages/core/signal/src/computed.ts
 /**
 * @private exported by @vue/reactivity for Vue core use, but not exported from
 * the main vue package
@@ -1468,12 +1468,12 @@ function computed(getterOrOptions, debugOptions, isSSR = false) {
 	return cRef;
 }
 //#endregion
-//#region packages/signal/src/scheduler.ts
+//#region packages/core/signal/src/scheduler.ts
 function nextTick() {
 	return Promise.resolve();
 }
 //#endregion
-//#region packages/signal/src/watch.ts
+//#region packages/core/signal/src/watch.ts
 const INITIAL_WATCHER_VALUE = {};
 const cleanupMap = /* @__PURE__ */ new WeakMap();
 let activeWatcher = void 0;
@@ -1629,7 +1629,7 @@ function traverse(value, depth = Infinity, seen) {
 	return value;
 }
 //#endregion
-//#region packages/signal/src/lifecycle.ts
+//#region packages/core/signal/src/lifecycle.ts
 function onCleanup(fn) {
 	if (getCurrentEffect()) {
 		onEffectCleanup(fn, true);
@@ -1642,7 +1642,7 @@ function onCleanup(fn) {
 	warn("onCleanup() was called without active effect or scope.");
 }
 //#endregion
-//#region packages/runtime-dom/src/hostContext.ts
+//#region packages/core/runtime-dom/src/hostContext.ts
 let currentHostContext;
 function getCurrentHostContext() {
 	return currentHostContext;
@@ -1657,8 +1657,8 @@ function withHostContext(context, fn) {
 	}
 }
 //#endregion
-//#region packages/runtime-dom/src/range.ts
-function insertTracked(parent, value, marker) {
+//#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 = [];
@@ -1670,7 +1670,7 @@ function insertTracked(parent, value, marker) {
 	return [node];
 }
 //#endregion
-//#region packages/runtime-dom/src/insert.ts
+//#region packages/core/runtime-dom/src/insert.ts
 function insert(parent, value, marker = null) {
 	if (value === void 0) {
 		console.warn("[Zeus runtime] insert received `undefined`, which is ignored. Use `null` or a fallback value explicitly if you want to suppress this warning.");
@@ -1679,7 +1679,7 @@ function insert(parent, value, marker = null) {
 	insertTracked(parent, value, marker);
 }
 //#endregion
-//#region packages/runtime-dom/src/context.ts
+//#region packages/core/runtime-dom/src/context.ts
 let currentOwner;
 function createOwner(parent = currentOwner) {
 	return {
@@ -1805,14 +1805,14 @@ function resolveValue$3(value) {
 	return typeof value === "function" ? value() : value !== null && value !== void 0 ? value : null;
 }
 //#endregion
-//#region packages/runtime-dom/src/devtools.ts
+//#region packages/core/runtime-dom/src/devtools.ts
 function emitDevtoolsEvent(event) {
 	var _window$__ZEUS_DEVTOO;
 	if (typeof window === "undefined") return;
 	(_window$__ZEUS_DEVTOO = window.__ZEUS_DEVTOOLS_HOOK__) === null || _window$__ZEUS_DEVTOO === void 0 || _window$__ZEUS_DEVTOO.emit(event);
 }
 //#endregion
-//#region packages/runtime-dom/src/render.ts
+//#region packages/core/runtime-dom/src/render.ts
 function render(value, container, options = {}) {
 	var _options$owner;
 	const renderScope = effectScope();
@@ -1839,12 +1839,153 @@ function resolveValue$2(value) {
 	return typeof value === "function" ? value() : value !== null && value !== void 0 ? value : null;
 }
 //#endregion
-//#region packages/runtime-dom/src/component.ts
+//#region packages/core/runtime-dom/src/bindings.ts
+function setAttr(el, name, value) {
+	const attrName = normalizeAttrName(name);
+	const propName = getBooleanDomPropertyName(name);
+	if (propName && el instanceof HTMLElement) {
+		el[propName] = Boolean(value);
+		if (value == null || value === false) el.removeAttribute(attrName);
+		else if (value === true) el.setAttribute(attrName, "");
+		else el.setAttribute(attrName, String(value));
+		return;
+	}
+	if (value == null || value === false) {
+		el.removeAttribute(attrName);
+		return;
+	}
+	if (value === true) {
+		el.setAttribute(attrName, "");
+		return;
+	}
+	el.setAttribute(attrName, String(value));
+}
+function getBooleanDomPropertyName(name) {
+	return BOOLEAN_DOM_PROPERTY_NAME[name];
+}
+const BOOLEAN_DOM_PROPERTY_NAME = {
+	hidden: "hidden",
+	disabled: "disabled",
+	readonly: "readOnly",
+	readOnly: "readOnly",
+	multiple: "multiple",
+	selected: "selected",
+	checked: "checked",
+	open: "open",
+	autofocus: "autofocus",
+	autoFocus: "autofocus",
+	indeterminate: "indeterminate",
+	noValidate: "noValidate",
+	novalidate: "noValidate"
+};
+function normalizeAttrName(name) {
+	return name === "className" ? "class" : name;
+}
+function bindAttr(el, name, value) {
+	effect(() => {
+		setAttr(el, name, value());
+	});
+}
+function bindProp(el, name, value) {
+	effect(() => {
+		el[name] = value();
+	});
+}
+function bindClass(el, value) {
+	effect(() => {
+		const next = normalizeClass(value());
+		if (next) el.setAttribute("class", next);
+		else el.removeAttribute("class");
+	});
+}
+function normalizeClass(value) {
+	if (!value) return "";
+	if (typeof value === "string") return value;
+	if (Array.isArray(value)) return value.map(normalizeClass).filter(Boolean).join(" ");
+	if (typeof value === "object") return Object.keys(value).filter((key) => value[key]).join(" ");
+	return "";
+}
+function bindStyle(el, value) {
+	let prev;
+	effect(() => {
+		const next = value();
+		if (next == null) {
+			el.removeAttribute("style");
+			prev = void 0;
+			return;
+		}
+		if (typeof next === "string") {
+			el.setAttribute("style", next);
+			prev = void 0;
+			return;
+		}
+		patchStyle(el, prev, next);
+		prev = next;
+	});
+}
+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 next) {
+		const value = next[key];
+		const name = toKebabCase$1(key);
+		if (value == null) style.setProperty(name, "");
+		else style.setProperty(name, normalizeStyleValue(key, value));
+	}
+}
+function normalizeStyleValue(key, value) {
+	if (typeof value === "number" && value !== 0 && !isUnitlessNumber(key)) return `${value}px`;
+	return String(value);
+}
+const unitlessNumbers = new Set([
+	"opacity",
+	"zIndex",
+	"fontWeight",
+	"lineHeight",
+	"flex",
+	"flexGrow",
+	"flexShrink",
+	"order"
+]);
+function isUnitlessNumber(key) {
+	return unitlessNumbers.has(key);
+}
+function toKebabCase$1(value) {
+	return value.replace(/[A-Z]/g, (match) => `-${match.toLowerCase()}`);
+}
+//#endregion
+//#region packages/core/runtime-dom/src/refs.ts
+function setRef(target, value) {
+	if (target == null) return;
+	if (typeof target === "function") {
+		target(value);
+		return;
+	}
+	if ("value" in target) {
+		target.value = value;
+		return;
+	}
+	if ("current" in target) {
+		target.current = value;
+		return;
+	}
+	console.warn("[Zeus runtime] Invalid ref target:", target);
+}
+function bindRef(el, target) {
+	setRef(target, el);
+	if (getCurrentScope()) onScopeDispose(() => {
+		setRef(target, null);
+	}, true);
+}
+//#endregion
+//#region packages/core/runtime-dom/src/component.ts
 function createComponent(component, props) {
 	return runWithOwner(createOwner(), () => component(props));
 }
 //#endregion
-//#region packages/runtime-dom/src/controlFlow.ts
+//#region packages/core/runtime-dom/src/controlFlow.ts
 function Show(props) {
 	return resolveValue$1(props.when ? props.children : props.fallback);
 }
@@ -1918,7 +2059,43 @@ function _objectSpread2(e) {
 	return e;
 }
 //#endregion
-//#region packages/runtime-dom/src/defineElement.ts
+//#region packages/core/runtime-dom/src/defineElement.ts
+function createPropStore(defs) {
+	const slots = /* @__PURE__ */ new Map();
+	const props = {};
+	for (const def of defs) {
+		const slot = state();
+		slots.set(def.key, slot);
+		Object.defineProperty(props, def.key, {
+			configurable: false,
+			enumerable: true,
+			get() {
+				return slot.value;
+			},
+			set(value) {
+				slot.value = value;
+			}
+		});
+	}
+	return {
+		props,
+		get(key) {
+			var _slots$get;
+			return (_slots$get = slots.get(key)) === null || _slots$get === void 0 ? void 0 : _slots$get.value;
+		},
+		set(key, value) {
+			const slot = slots.get(key);
+			if (!slot) {
+				console.warn(`[Zeus custom-element] Unknown prop "${key}" was written.`);
+				return;
+			}
+			slot.value = value;
+		},
+		has(key) {
+			return slots.has(key);
+		}
+	};
+}
 function defineElement(tagName, options, setup) {
 	var _options$props;
 	const propDefs = normalizePropDefinitions((_options$props = options.props) !== null && _options$props !== void 0 ? _options$props : {});
@@ -1929,12 +2106,13 @@ function defineElement(tagName, options, setup) {
 		}
 		constructor() {
 			super();
-			this.props = state({});
 			this.lightChildren = [];
 			this.capturedLightChildren = false;
 			this.reflecting = false;
-			applyPropDefaults(this.props, propDefs);
-			definePropAccessors(this, this.props, propDefs);
+			this.propStore = createPropStore(propDefs);
+			this.props = this.propStore.props;
+			applyPropDefaults(this.propStore, propDefs);
+			definePropAccessors(this, this.propStore, propDefs);
 		}
 		connectedCallback() {
 			var _options$shadow, _options$consumes;
@@ -1970,22 +2148,17 @@ function defineElement(tagName, options, setup) {
 			};
 			this.dispose = render(() => runWithOwner(owner, () => withHostContext(hostContext, () => setup(this.props, setupContext))), target, { owner });
 			mountStyles(target, options.styles);
-			onScopeDispose(() => {
-				var _this$dispose;
-				(_this$dispose = this.dispose) === null || _this$dispose === void 0 || _this$dispose.call(this);
-				this.dispose = void 0;
-			}, true);
 		}
 		disconnectedCallback() {
-			var _this$dispose2;
-			(_this$dispose2 = this.dispose) === null || _this$dispose2 === void 0 || _this$dispose2.call(this);
+			var _this$dispose;
+			(_this$dispose = this.dispose) === null || _this$dispose === void 0 || _this$dispose.call(this);
 			this.dispose = void 0;
 		}
 		attributeChangedCallback(name, oldValue, newValue) {
 			if (oldValue === newValue || this.reflecting) return;
 			const def = propDefs.find((item) => item.attr === name);
 			if (!def) return;
-			this.props[def.key] = castAttributeValue(newValue, def);
+			this.propStore.set(def.key, castAttributeValue(newValue, def));
 		}
 		resolveRenderTarget(shadow) {
 			if (this.target) return this.target;
@@ -2000,12 +2173,12 @@ function defineElement(tagName, options, setup) {
 			for (const def of defs) {
 				if (def.attr === false) continue;
 				const value = this.getAttribute(def.attr);
-				if (value !== null || def.type === Boolean) this.props[def.key] = castAttributeValue(value, def);
+				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);
-			this.props[key] = value;
+			this.propStore.set(key, value);
 			if ((def === null || def === void 0 ? void 0 : def.reflect) && def.attr !== false) {
 				this.reflecting = true;
 				try {
@@ -2037,26 +2210,35 @@ function normalizePropDefinitions(props) {
 		};
 	});
 }
-function applyPropDefaults(props, defs) {
+function applyPropDefaults(store, defs) {
 	for (const def of defs) {
 		if (!("default" in def)) continue;
 		const value = typeof def.default === "function" ? def.default() : def.default;
-		props[def.key] = value;
+		store.set(def.key, value);
 	}
 }
-function definePropAccessors(element, props, defs) {
+function definePropAccessors(element, store, defs) {
 	for (const def of defs) {
-		if (def.key in element) continue;
-		Object.defineProperty(element, def.key, {
+		const key = def.key;
+		const hadOwnValue = Object.prototype.hasOwnProperty.call(element, key);
+		const ownValue = hadOwnValue ? element[key] : void 0;
+		if (hadOwnValue) delete element[key];
+		const existing = Object.getOwnPropertyDescriptor(element, key);
+		if (existing && existing.configurable === false) {
+			console.warn(`[Zeus custom-element] Cannot define prop "${key}" because an own non-configurable property already exists.`);
+			continue;
+		}
+		Object.defineProperty(element, key, {
 			configurable: true,
 			enumerable: true,
 			get() {
-				return props[def.key];
+				return store.get(key);
 			},
 			set(value) {
-				element._writePropFromProperty(def.key, value);
+				element._writePropFromProperty(key, value);
 			}
 		});
+		if (hadOwnValue) element._writePropFromProperty(key, ownValue);
 	}
 }
 function castAttributeValue(value, def) {
@@ -2101,7 +2283,7 @@ function toKebabCase(value) {
 	return value.replace(/[A-Z]/g, (match) => `-${match.toLowerCase()}`);
 }
 //#endregion
-//#region packages/runtime-dom/src/slot.ts
+//#region packages/core/runtime-dom/src/slot.ts
 function createSlot(name, fallback) {
 	const context = getCurrentHostContext();
 	if (!context) return createNativeSlot(name, fallback);
@@ -2133,18 +2315,98 @@ function isMeaningfulTextNode(node) {
 	return Boolean((_node$textContent = node.textContent) === null || _node$textContent === void 0 ? void 0 : _node$textContent.trim());
 }
 //#endregion
-//#region packages/runtime-dom/src/webComponents.ts
+//#region packages/core/runtime-dom/src/webComponents.ts
+const HOST_RESERVED_KEYS = new Set([
+	"children",
+	"ref",
+	"class",
+	"className",
+	"style",
+	"_elements"
+]);
 function Host(props) {
+	const context = getCurrentHostContext();
+	if (context) bindHostProps(context.host, props);
 	return resolveValue(props.children);
 }
 function Slot(props) {
 	return createSlot(props.name, () => resolveValue(props.children));
 }
+function bindHostProps(host, props) {
+	bindHostRef(host, props);
+	bindHostClass(host, props);
+	bindHostStyle(host, props);
+	bindHostAttributes(host, props);
+	if ("_elements" in props) bindHostElementBindings(host, props);
+}
+function bindHostRef(host, props) {
+	if (!("ref" in props)) return;
+	bindRef(host, props.ref);
+}
+function bindHostClass(host, props) {
+	if (!("class" in props) && !("className" in props)) return;
+	const value = props.className !== void 0 ? props.className : props.class;
+	bindClass(host, () => {
+		return resolveHostValue(value);
+	});
+}
+function bindHostStyle(host, props) {
+	if (!("style" in props)) return;
+	bindStyle(host, () => {
+		return resolveHostValue(props.style);
+	});
+}
+function bindHostAttributes(host, props) {
+	for (const key of Object.keys(props)) {
+		if (HOST_RESERVED_KEYS.has(key)) continue;
+		if (isEventLikeProp(key)) continue;
+		const value = props[key];
+		bindAttr(host, normalizeHostAttrName(key), () => {
+			return resolveHostValue(value);
+		});
+	}
+}
+function bindHostElementBindings(host, props) {
+	const elements = props._elements;
+	for (const _key of Object.keys(elements)) {
+		const getEl = elements[_key];
+		const el = getEl();
+		if (!el) continue;
+		for (const attrKey of Object.keys(props)) {
+			if (HOST_RESERVED_KEYS.has(attrKey)) continue;
+			if (isEventLikeProp(attrKey)) continue;
+			const value = props[attrKey];
+			bindAttr(el, normalizeHostAttrName(attrKey), () => {
+				return resolveHostValue(value);
+			});
+		}
+	}
+}
+function resolveHostValue(value) {
+	if (typeof value === "function") return value();
+	return value;
+}
 function resolveValue(value) {
 	return typeof value === "function" ? value() : value;
 }
+function isEventLikeProp(key) {
+	/**
+	* Host Phase 1 does not bind event listeners.
+	* Keep event handling inside component template + emit().
+	*/
+	return /^on[A-Z]/.test(key) || key.startsWith("on:");
+}
+function normalizeHostAttrName(name) {
+	switch (name) {
+		case "className": return "class";
+		case "htmlFor": return "for";
+		case "tabIndex": return "tabindex";
+		case "readOnly": return "readonly";
+		default: return name;
+	}
+}
 //#endregion
-//#region packages/zeus/src/jsx-runtime.ts
+//#region packages/core/zeus/src/jsx-runtime.ts
 const Fragment = Symbol.for("zeus.fragment");
 function jsx(type, props) {
 	return createJSXNode(type, props);
@@ -2156,6 +2418,7 @@ function jsxDEV(type, props) {
 	return createJSXNode(type, props);
 }
 function createJSXNode(type, props) {
+	if (type === Fragment) return props === null || props === void 0 ? void 0 : props.children;
 	if (typeof type === "function") return createComponent(type, props !== null && props !== void 0 ? props : {});
 	if (typeof type !== "string") return null;
 	const el = document.createElement(type);
@@ -2166,6 +2429,11 @@ function createJSXNode(type, props) {
 			const value = props[key];
 			if (key.startsWith("on") && typeof value === "function") el.addEventListener(key.slice(2).toLowerCase(), value);
 			else if (key === "ref") setFallbackRef(value, el);
+			else if (key.startsWith("prop:")) {
+				const propName = key.slice(5);
+				if (typeof value === "function") bindProp(el, propName, value);
+				else el[propName] = value;
+			} else if (typeof value === "function") bindAttr(el, key, value);
 			else if (value != null && value !== false) el.setAttribute(key === "className" ? "class" : key, String(value));
 		}
 		if (children !== void 0) insert(el, children);