ilha 0.4.1 → 0.4.2

package/dist/index.js

@@ -4,6 +4,18 @@ const __DEV__ = typeof process !== "undefined" ? process.env?.["NODE_ENV"] !== "
 function warn(msg) {
 	if (__DEV__) console.warn(`[ilha] ${msg}`);
 }
+function shallowEqualInput(a, b) {
+	if (Object.is(a, b)) return true;
+	if (typeof a !== "object" || a === null || typeof b !== "object" || b === null) return false;
+	const ak = Object.keys(a);
+	const bk = Object.keys(b);
+	if (ak.length !== bk.length) return false;
+	for (const k of ak) {
+		if (!Object.prototype.hasOwnProperty.call(b, k)) return false;
+		if (!Object.is(a[k], b[k])) return false;
+	}
+	return true;
+}
 function syncAttributes(from, to) {
 	for (const { name, value } of to.attributes) if (from.getAttribute(name) !== value) from.setAttribute(name, value);
 	for (const { name } of Array.from(from.attributes)) if (!to.hasAttribute(name)) from.removeAttribute(name);
@@ -80,6 +92,7 @@ const RAW = Symbol("ilha.raw");
 const SIGNAL_ACCESSOR = Symbol("ilha.signalAccessor");
 const ISLAND = Symbol("ilha.island");
 const ISLAND_CALL = Symbol("ilha.islandCall");
+const ISLAND_MOUNT_INTERNAL = Symbol("ilha.islandMountInternal");
 const SLOT_ATTR = "data-ilha-slot";
 const PROPS_ATTR = "data-ilha-props";
 const STATE_ATTR = "data-ilha-state";
@@ -685,11 +698,18 @@ var IlhaBuilder = class IlhaBuilder {
 			});
 		}
 		function mountIsland(host, props) {
+			return mountIslandInternal(host, props).unmount;
+		}
+		function mountIslandInternal(host, props) {
+			const noop = {
+				unmount: () => {},
+				updateProps: () => {}
+			};
 			if (__DEV__ && _mountedHosts) {
 				if (_mountedHosts.has(host)) {
 					warn(`mount(): this element is already mounted. Call the previous unmount() first to avoid memory leaks and duplicate event listeners.
 Element: ${host.outerHTML.slice(0, 120)}`);
-					return () => {};
+					return noop;
 				}
 				_mountedHosts.add(host);
 			}
@@ -701,7 +721,31 @@ Element: ${host.outerHTML.slice(0, 120)}`);
 					warn("Failed to parse data-ilha-props — invalid JSON, falling back to empty props.");
 				}
 			}
-			const input = resolveInput(props);
+			const inputSignal = signal(resolveInput(props));
+			const input = new Proxy({}, {
+				get(_t, key) {
+					return inputSignal()[key];
+				},
+				has(_t, key) {
+					return key in inputSignal();
+				},
+				ownKeys() {
+					const prevSub = setActiveSub(void 0);
+					try {
+						return Reflect.ownKeys(inputSignal());
+					} finally {
+						setActiveSub(prevSub);
+					}
+				},
+				getOwnPropertyDescriptor(_t, key) {
+					const prevSub = setActiveSub(void 0);
+					try {
+						return Reflect.getOwnPropertyDescriptor(inputSignal(), key);
+					} finally {
+						setActiveSub(prevSub);
+					}
+				}
+			});
 			let snapshotRaw;
 			const rawState = host.getAttribute(STATE_ATTR);
 			if (rawState) try {
@@ -771,7 +815,11 @@ Element: ${host.outerHTML.slice(0, 120)}`);
 					mountedSlots.delete(id);
 				}
 				for (const [id, { island: childIsland, props }] of slotMap) {
-					if (mountedSlots.has(id)) continue;
+					const existing = mountedSlots.get(id);
+					if (existing) {
+						existing.updateProps(props);
+						continue;
+					}
 					const slotEl = findSlot(id);
 					if (!slotEl) continue;
 					let slotProps = props;
@@ -784,15 +832,19 @@ Element: ${host.outerHTML.slice(0, 120)}`);
 						}
 					}
 					const prevSub = setActiveSub(void 0);
-					let unmount;
+					let handle;
 					try {
-						unmount = childIsland.mount(slotEl, slotProps);
+						const internal = childIsland[ISLAND_MOUNT_INTERNAL];
+						handle = internal ? internal(slotEl, slotProps) : {
+							unmount: childIsland.mount(slotEl, slotProps),
+							updateProps: () => {}
+						};
 					} finally {
 						setActiveSub(prevSub);
 					}
 					mountedSlots.set(id, {
 						el: slotEl,
-						unmount
+						...handle
 					});
 				}
 			}
@@ -896,6 +948,7 @@ Element: ${host.outerHTML.slice(0, 120)}`);
 				if (userCleanup) cleanups.push(userCleanup);
 			}
 			let initialized = false;
+			const initialRenderedHtml = initial.html;
 			const stopRender = effect(() => {
 				const { html: rendered, slots: newSlotMap } = renderWithCtx(() => fn({
 					state,
@@ -905,7 +958,7 @@ Element: ${host.outerHTML.slice(0, 120)}`);
 				const html = stylePrefix + rendered;
 				if (!initialized) {
 					initialized = true;
-					return;
+					if (rendered === initialRenderedHtml) return;
 				}
 				detachListeners();
 				stopBindings();
@@ -976,7 +1029,7 @@ Element: ${host.outerHTML.slice(0, 120)}`);
 				});
 			}
 			let tornDown = false;
-			return () => {
+			const unmount = () => {
 				if (tornDown) return;
 				tornDown = true;
 				if (__DEV__ && _mountedHosts) _mountedHosts.delete(host);
@@ -989,6 +1042,16 @@ Element: ${host.outerHTML.slice(0, 120)}`);
 				}
 				cleanups.forEach((c) => c());
 			};
+			const updateProps = (nextProps) => {
+				if (tornDown) return;
+				const next = resolveInput(nextProps);
+				if (shallowEqualInput(inputSignal(), next)) return;
+				inputSignal(next);
+			};
+			return {
+				unmount,
+				updateProps
+			};
 		}
 		/**
 		* Dual-mode island invocation:
@@ -1012,6 +1075,7 @@ Element: ${host.outerHTML.slice(0, 120)}`);
 		};
 		island.toString = (props) => renderToString(props, true);
 		island.mount = (host, props) => mountIsland(host, props);
+		island[ISLAND_MOUNT_INTERNAL] = (host, props) => mountIslandInternal(host, props);
 		island.key = (key) => {
 			if (typeof key !== "string" || key.trim().length === 0) throw new Error("island.key() requires a non-empty string.");
 			if (key.includes(":")) throw new Error(`island.key() key cannot contain the slot separator ":" (got "${key}").`);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ilha",
-  "version": "0.4.1",
+  "version": "0.4.2",
   "description": "A tiny, framework-free island architecture library",
   "license": "MIT",
   "author": "Ryuz <ryuzer@proton.me>",