@sigx/server-renderer 0.1.5 → 0.1.6

package/dist/index.js

@@ -1,1172 +1,3 @@
-import { Fragment, Text, createPropsAccessor, createSlots, getCurrentInstance, normalizeSubTree, registerContextExtension, setCurrentInstance, signal } from "@sigx/runtime-core";
-import { effect } from "@sigx/reactivity";
-import { patchProp, render } from "@sigx/runtime-dom";
-
-//#region src/server/context.ts
-/**
-* Create a new SSR context for rendering
-*/
-function createSSRContext(options = {}) {
-	let componentId = 0;
-	const componentStack = [];
-	const islands = /* @__PURE__ */ new Map();
-	const head = [];
-	const pendingAsync = [];
-	return {
-		_componentId: componentId,
-		_componentStack: componentStack,
-		_islands: islands,
-		_head: head,
-		_pendingAsync: pendingAsync,
-		nextId() {
-			return ++componentId;
-		},
-		pushComponent(id) {
-			componentStack.push(id);
-		},
-		popComponent() {
-			return componentStack.pop();
-		},
-		registerIsland(id, info) {
-			islands.set(id, info);
-		},
-		getIslands() {
-			return islands;
-		},
-		addHead(html) {
-			head.push(html);
-		},
-		getHead() {
-			return head.join("\n");
-		},
-		addPendingAsync(pending) {
-			pendingAsync.push(pending);
-		},
-		getPendingAsync() {
-			return pendingAsync;
-		}
-	};
-}
-
-//#endregion
-//#region src/server/stream.ts
-/**
-* Streaming SSR renderer with hydration markers
-*/
-/**
-* Creates a tracking signal function that records signal names and values.
-* Used during async setup to capture state for client hydration.
-*/
-function createTrackingSignal(signalMap) {
-	let signalIndex = 0;
-	return function trackingSignal(initial, name) {
-		const key = name ?? `$${signalIndex++}`;
-		const sig = signal(initial);
-		signalMap.set(key, initial);
-		return new Proxy(sig, {
-			get(target, prop) {
-				if (prop === "value") return target.value;
-				return target[prop];
-			},
-			set(target, prop, newValue) {
-				if (prop === "value") {
-					target.value = newValue;
-					signalMap.set(key, newValue);
-					return true;
-				}
-				target[prop] = newValue;
-				return true;
-			}
-		});
-	};
-}
-/**
-* Serialize captured signal state for client hydration
-*/
-function serializeSignalState(signalMap) {
-	if (signalMap.size === 0) return void 0;
-	const state = {};
-	for (const [key, value] of signalMap) try {
-		JSON.stringify(value);
-		state[key] = value;
-	} catch {
-		console.warn(`SSR: Signal "${key}" has non-serializable value, skipping`);
-	}
-	return Object.keys(state).length > 0 ? state : void 0;
-}
-/**
-* Check if a vnode type is a component (has __setup)
-*/
-function isComponent$2(type) {
-	return typeof type === "function" && "__setup" in type;
-}
-/**
-* Creates a simple props accessor for SSR (no reactivity needed)
-*/
-function createSSRPropsAccessor(rawProps) {
-	let defaults = {};
-	const proxy = new Proxy(function propsAccessor() {}, {
-		get(_, key) {
-			if (typeof key === "symbol") return void 0;
-			const value = rawProps[key];
-			return value != null ? value : defaults[key];
-		},
-		apply(_, __, args) {
-			if (args[0] && typeof args[0] === "object") defaults = {
-				...defaults,
-				...args[0]
-			};
-			return proxy;
-		},
-		has(_, key) {
-			if (typeof key === "symbol") return false;
-			return key in rawProps || key in defaults;
-		},
-		ownKeys() {
-			return [...new Set([...Object.keys(rawProps), ...Object.keys(defaults)])];
-		},
-		getOwnPropertyDescriptor(_, key) {
-			if (typeof key === "symbol") return void 0;
-			if (key in rawProps || key in defaults) return {
-				enumerable: true,
-				configurable: true,
-				writable: false
-			};
-		}
-	});
-	return proxy;
-}
-/**
-* Detect hydration directive from props
-*/
-function getHydrationDirective(props) {
-	if (props["client:load"] !== void 0) return { strategy: "load" };
-	if (props["client:idle"] !== void 0) return { strategy: "idle" };
-	if (props["client:visible"] !== void 0) return { strategy: "visible" };
-	if (props["client:only"] !== void 0) return { strategy: "only" };
-	if (props["client:media"] !== void 0) return {
-		strategy: "media",
-		media: props["client:media"]
-	};
-	return null;
-}
-/**
-* Filter out client directives from props
-*/
-function filterClientDirectives$1(props) {
-	const filtered = {};
-	for (const key in props) if (!key.startsWith("client:")) filtered[key] = props[key];
-	return filtered;
-}
-/**
-* Serialize props for client hydration (must be JSON-safe)
-*/
-function serializeProps(props) {
-	const serialized = {};
-	for (const key in props) {
-		const value = props[key];
-		if (typeof value === "function" || typeof value === "symbol") continue;
-		if (key === "children" || key === "key" || key === "ref" || key === "slots") continue;
-		if (key.startsWith("on")) continue;
-		try {
-			JSON.stringify(value);
-			serialized[key] = value;
-		} catch {}
-	}
-	return serialized;
-}
-/**
-* Render element to string chunks (generator for streaming)
-*/
-async function* renderToChunks(element, ctx) {
-	if (element == null || element === false || element === true) return;
-	if (typeof element === "string" || typeof element === "number") {
-		yield escapeHtml(String(element));
-		return;
-	}
-	const vnode = element;
-	if (vnode.type === Text) {
-		yield escapeHtml(String(vnode.text));
-		return;
-	}
-	if (vnode.type === Fragment) {
-		for (const child of vnode.children) yield* renderToChunks(child, ctx);
-		return;
-	}
-	if (isComponent$2(vnode.type)) {
-		const setup = vnode.type.__setup;
-		const componentName = vnode.type.__name || "Anonymous";
-		const allProps = vnode.props || {};
-		const hydration = getHydrationDirective(allProps);
-		const { children, slots: slotsFromProps, ...propsData } = filterClientDirectives$1(allProps);
-		const id = ctx.nextId();
-		ctx.pushComponent(id);
-		yield `<!--$c:${id}-->`;
-		const signalMap = /* @__PURE__ */ new Map();
-		const shouldTrackState = !!hydration;
-		if (hydration) {
-			const islandInfo = {
-				strategy: hydration.strategy,
-				media: hydration.media,
-				props: serializeProps(propsData),
-				componentId: componentName
-			};
-			ctx.registerIsland(id, islandInfo);
-			yield `<!--$island:${hydration.strategy}:${id}${hydration.media ? `:${hydration.media}` : ""}-->`;
-		}
-		if (hydration?.strategy === "only") {
-			yield `<div data-island="${id}"></div>`;
-			yield `<!--/$c:${id}-->`;
-			ctx.popComponent();
-			return;
-		}
-		const slots = {
-			default: () => children ? Array.isArray(children) ? children : [children] : [],
-			...slotsFromProps
-		};
-		const signalFn = shouldTrackState ? createTrackingSignal(signalMap) : signal;
-		const ssrLoads = [];
-		const componentCtx = {
-			el: null,
-			signal: signalFn,
-			props: createSSRPropsAccessor(propsData),
-			slots,
-			emit: () => {},
-			parent: null,
-			onMount: () => {},
-			onCleanup: () => {},
-			expose: () => {},
-			renderFn: null,
-			update: () => {},
-			ssr: {
-				load(fn) {
-					ssrLoads.push(fn());
-				},
-				isServer: true,
-				isHydrating: false
-			},
-			_signals: shouldTrackState ? signalMap : void 0,
-			_ssrLoads: ssrLoads
-		};
-		const prev = setCurrentInstance(componentCtx);
-		try {
-			let renderFn = setup(componentCtx);
-			if (renderFn && typeof renderFn.then === "function") renderFn = await renderFn;
-			if (ssrLoads.length > 0 && hydration) {
-				const deferredRender = (async () => {
-					await Promise.all(ssrLoads);
-					let html = "";
-					if (renderFn) {
-						const result = renderFn();
-						if (result) html = await renderVNodeToString(result, ctx);
-					}
-					if (signalMap.size > 0) {
-						const state = serializeSignalState(signalMap);
-						if (state) {
-							const islandInfo$1 = ctx.getIslands().get(id);
-							if (islandInfo$1) islandInfo$1.state = state;
-						}
-					}
-					return html;
-				})();
-				const islandInfo = ctx.getIslands().get(id);
-				ctx.addPendingAsync({
-					id,
-					promise: deferredRender,
-					signalMap,
-					islandInfo
-				});
-				yield `<div data-async-placeholder="${id}" style="display:contents;">`;
-				if (renderFn) {
-					const result = renderFn();
-					if (result) if (Array.isArray(result)) for (const item of result) yield* renderToChunks(item, ctx);
-					else yield* renderToChunks(result, ctx);
-				}
-				yield `</div>`;
-			} else {
-				if (ssrLoads.length > 0) await Promise.all(ssrLoads);
-				if (shouldTrackState && signalMap.size > 0) {
-					const state = serializeSignalState(signalMap);
-					if (state) {
-						const islandInfo = ctx.getIslands().get(id);
-						if (islandInfo) islandInfo.state = state;
-					}
-				}
-				if (renderFn) {
-					const result = renderFn();
-					if (result) if (Array.isArray(result)) for (const item of result) yield* renderToChunks(item, ctx);
-					else yield* renderToChunks(result, ctx);
-				}
-			}
-		} catch (e) {
-			console.error(`Error rendering component ${componentName}:`, e);
-		} finally {
-			setCurrentInstance(prev || null);
-		}
-		yield `<!--/$c:${id}-->`;
-		ctx.popComponent();
-		return;
-	}
-	if (typeof vnode.type === "string") {
-		const tagName = vnode.type;
-		let props = "";
-		for (const key in vnode.props) {
-			const value = vnode.props[key];
-			if (key === "children" || key === "key" || key === "ref") continue;
-			if (key.startsWith("client:")) continue;
-			if (key === "style") {
-				const styleString = typeof value === "object" ? Object.entries(value).map(([k, v]) => `${camelToKebab(k)}:${v}`).join(";") : String(value);
-				props += ` style="${escapeHtml(styleString)}"`;
-			} else if (key === "className") props += ` class="${escapeHtml(String(value))}"`;
-			else if (key.startsWith("on")) {} else if (value === true) props += ` ${key}`;
-			else if (value !== false && value != null) props += ` ${key}="${escapeHtml(String(value))}"`;
-		}
-		if ([
-			"area",
-			"base",
-			"br",
-			"col",
-			"embed",
-			"hr",
-			"img",
-			"input",
-			"link",
-			"meta",
-			"param",
-			"source",
-			"track",
-			"wbr"
-		].includes(tagName)) {
-			yield `<${tagName}${props}>`;
-			return;
-		}
-		yield `<${tagName}${props}>`;
-		let prevWasText = false;
-		for (const child of vnode.children) {
-			const isText = isTextContent(child);
-			if (isText && prevWasText) yield "<!--t-->";
-			yield* renderToChunks(child, ctx);
-			prevWasText = isText;
-		}
-		yield `</${tagName}>`;
-	}
-}
-/**
-* Check if element will render as text content
-*/
-function isTextContent(element) {
-	if (element == null || element === false || element === true) return false;
-	if (typeof element === "string" || typeof element === "number") return true;
-	return element.type === Text;
-}
-/**
-* Helper to render a VNode to string (for deferred async content)
-*/
-async function renderVNodeToString(element, ctx) {
-	let result = "";
-	for await (const chunk of renderToChunks(element, ctx)) result += chunk;
-	return result;
-}
-/**
-* Render JSX element to a ReadableStream with streaming async support
-*/
-function renderToStream(element, context) {
-	const ctx = context || createSSRContext();
-	return new ReadableStream({ async start(controller) {
-		try {
-			for await (const chunk of renderToChunks(element, ctx)) controller.enqueue(chunk);
-			const pendingAsync = ctx.getPendingAsync();
-			if (pendingAsync.length > 0) {
-				controller.enqueue(generateStreamingScript());
-				await Promise.all(pendingAsync.map(async (pending) => {
-					try {
-						const html = await pending.promise;
-						const state = serializeSignalState(pending.signalMap);
-						if (state) pending.islandInfo.state = state;
-						controller.enqueue(generateReplacementScript(pending.id, html, state));
-					} catch (error) {
-						console.error(`Error streaming async component ${pending.id}:`, error);
-						controller.enqueue(generateReplacementScript(pending.id, `<div style="color:red;">Error loading component</div>`, void 0));
-					}
-				}));
-			}
-			if (ctx.getIslands().size > 0) controller.enqueue(generateHydrationScript(ctx));
-			controller.enqueue(`<script>window.__SIGX_STREAMING_COMPLETE__ = true; window.dispatchEvent(new Event('sigx:ready'));<\/script>`);
-			controller.close();
-		} catch (error) {
-			controller.error(error);
-		}
-	} });
-}
-/**
-* Render JSX element to string (convenience wrapper around stream)
-* For renderToString, we wait for all async components to complete,
-* then include the replacement scripts inline so the final HTML is complete.
-*/
-async function renderToString(element, context) {
-	const ctx = context || createSSRContext();
-	let result = "";
-	for await (const chunk of renderToChunks(element, ctx)) result += chunk;
-	const pendingAsync = ctx.getPendingAsync();
-	if (pendingAsync.length > 0) {
-		result += generateStreamingScript();
-		await Promise.all(pendingAsync.map(async (pending) => {
-			try {
-				const html = await pending.promise;
-				const state = serializeSignalState(pending.signalMap);
-				if (state) pending.islandInfo.state = state;
-				result += generateReplacementScript(pending.id, html, state);
-			} catch (error) {
-				console.error(`Error rendering async component ${pending.id}:`, error);
-				result += generateReplacementScript(pending.id, `<div style="color:red;">Error loading component</div>`, void 0);
-			}
-		}));
-	}
-	if (ctx.getIslands().size > 0) result += generateHydrationScript(ctx);
-	return result;
-}
-/**
-* Generate the streaming replacement script (injected once before any replacements)
-* This script provides the $SIGX_REPLACE function used by replacement chunks
-*/
-function generateStreamingScript() {
-	return `
-<script>
-window.$SIGX_REPLACE = function(id, html, state) {
-    var placeholder = document.querySelector('[data-async-placeholder="' + id + '"]');
-    if (placeholder) {
-        // Create a template to parse the HTML
-        var template = document.createElement('template');
-        template.innerHTML = html;
-        
-        // Replace placeholder content
-        placeholder.innerHTML = '';
-        while (template.content.firstChild) {
-            placeholder.appendChild(template.content.firstChild);
-        }
-        
-        // Update island state in the hydration data
-        if (state) {
-            var dataScript = document.getElementById('__SIGX_ISLANDS__');
-            if (dataScript) {
-                try {
-                    var data = JSON.parse(dataScript.textContent || '{}');
-                    if (data[id]) {
-                        data[id].state = state;
-                        dataScript.textContent = JSON.stringify(data);
-                    }
-                } catch(e) {}
-            }
-        }
-        
-        // Dispatch event for hydration to pick up
-        placeholder.dispatchEvent(new CustomEvent('sigx:async-ready', { bubbles: true, detail: { id: id, state: state } }));
-    }
-};
-<\/script>`;
-}
-/**
-* Generate a replacement script for a specific async component
-*/
-function generateReplacementScript(id, html, state) {
-	return `<script>$SIGX_REPLACE(${id}, ${JSON.stringify(html)}, ${state ? JSON.stringify(state) : "null"});<\/script>`;
-}
-/**
-* Generate the hydration bootstrap script
-*/
-function generateHydrationScript(ctx) {
-	const islands = ctx.getIslands();
-	if (islands.size === 0) return "";
-	const islandData = {};
-	islands.forEach((info, id) => {
-		islandData[id] = info;
-	});
-	return `
-<script type="application/json" id="__SIGX_ISLANDS__">${JSON.stringify(islandData)}<\/script>`;
-}
-const ESCAPE = {
-	"&": "&amp;",
-	"<": "&lt;",
-	">": "&gt;",
-	"\"": "&quot;",
-	"'": "&#39;"
-};
-function escapeHtml(s) {
-	return s.replace(/[&<>"']/g, (c) => ESCAPE[c]);
-}
-function camelToKebab(str) {
-	return str.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase();
-}
-
-//#endregion
-//#region src/client/registry.ts
-/**
-* Registry mapping component names to component factories
-*/
-const componentRegistry = /* @__PURE__ */ new Map();
-/**
-* Register a component for island hydration.
-* Components must be registered before hydrateIslands() is called.
-* 
-* @example
-* ```ts
-* import { registerComponent } from '@sigx/server-renderer/client';
-* import { Counter } from './components/Counter';
-* 
-* registerComponent('Counter', Counter);
-* ```
-*/
-function registerComponent(name, component) {
-	componentRegistry.set(name, component);
-}
-/**
-* Register multiple components at once
-* 
-* @example
-* ```ts
-* import { registerComponents } from '@sigx/server-renderer/client';
-* import * as Components from './components';
-* 
-* registerComponents(Components);
-* ```
-*/
-function registerComponents(components) {
-	for (const [name, component] of Object.entries(components)) if (isComponent$1(component)) registerComponent(name, component);
-}
-/**
-* Get a registered component by name
-*/
-function getComponent(name) {
-	return componentRegistry.get(name);
-}
-/**
-* Check if a value is a component factory
-*/
-function isComponent$1(value) {
-	return typeof value === "function" && "__setup" in value;
-}
-/**
-* Hydration Registry class for more advanced use cases
-*/
-var HydrationRegistry = class {
-	components = /* @__PURE__ */ new Map();
-	register(name, component) {
-		this.components.set(name, component);
-		return this;
-	}
-	registerAll(components) {
-		for (const [name, component] of Object.entries(components)) if (isComponent$1(component)) this.register(name, component);
-		return this;
-	}
-	get(name) {
-		return this.components.get(name);
-	}
-	has(name) {
-		return this.components.has(name);
-	}
-};
-
-//#endregion
-//#region src/client/hydrate.ts
-/**
-* Client-side hydration for SSR'd content
-* 
-* Hydration attaches the app to existing server-rendered DOM,
-* then delegates all updates to the runtime-dom renderer.
-*/
-let _pendingServerState = null;
-/**
-* Set server state that should be used for the next component mount.
-* Used internally when mounting async components after streaming.
-*/
-function setPendingServerState(state) {
-	_pendingServerState = state;
-}
-/**
-* Register the SSR context extension for all components.
-* This provides the `ssr` object with a no-op `load()` for client-side rendering.
-* Also handles server state restoration for async streamed components.
-*/
-registerContextExtension((ctx) => {
-	const serverState = _pendingServerState;
-	if (serverState) {
-		ctx._serverState = serverState;
-		_pendingServerState = null;
-		ctx.signal = createRestoringSignal(serverState);
-		ctx.ssr = {
-			load: (_fn) => {},
-			isServer: false,
-			isHydrating: true
-		};
-	} else if (ctx._serverState) ctx.ssr = {
-		load: (_fn) => {},
-		isServer: false,
-		isHydrating: true
-	};
-	else ctx.ssr = {
-		load: (fn) => {
-			fn().catch((err) => console.error("[SSR] load error:", err));
-		},
-		isServer: false,
-		isHydrating: false
-	};
-});
-/**
-* Creates a signal function that restores state from server-captured values.
-* Used during hydration of async components to avoid re-fetching data.
-*/
-function createRestoringSignal(serverState) {
-	let signalIndex = 0;
-	return function restoringSignal(initial, name) {
-		const key = name ?? `$${signalIndex++}`;
-		if (key in serverState) {
-			console.log(`[Hydrate] Restoring signal "${key}" from server state:`, serverState[key]);
-			return signal(serverState[key]);
-		}
-		return signal(initial);
-	};
-}
-/**
-* Hydrate a server-rendered app.
-* 
-* This walks the existing DOM to attach event handlers, runs component
-* setup functions to establish reactivity, then uses runtime-dom for updates.
-*/
-function hydrate(element, container) {
-	const vnode = normalizeElement(element);
-	if (!vnode) return;
-	hydrateNode(vnode, container.firstChild, container);
-	container._vnode = vnode;
-}
-let _cachedIslandData = null;
-/**
-* Invalidate the island data cache (called when async components stream in)
-*/
-function invalidateIslandCache() {
-	_cachedIslandData = null;
-}
-/**
-* Get island data from the __SIGX_ISLANDS__ script tag
-*/
-function getIslandData() {
-	if (_cachedIslandData !== null) return _cachedIslandData;
-	const dataScript = document.getElementById("__SIGX_ISLANDS__");
-	if (!dataScript) {
-		_cachedIslandData = {};
-		return _cachedIslandData;
-	}
-	try {
-		_cachedIslandData = JSON.parse(dataScript.textContent || "{}");
-	} catch {
-		console.error("Failed to parse island data");
-		_cachedIslandData = {};
-	}
-	return _cachedIslandData;
-}
-/**
-* Get server state for a specific island/component by ID
-*/
-function getIslandServerState(componentId) {
-	return getIslandData()[String(componentId)]?.state;
-}
-/**
-* Normalize any element to VNode
-*/
-function normalizeElement(element) {
-	if (element == null || element === true || element === false) return null;
-	if (typeof element === "string" || typeof element === "number") return {
-		type: Text,
-		props: {},
-		key: null,
-		children: [],
-		dom: null,
-		text: element
-	};
-	return element;
-}
-/**
-* Check if type is a component
-*/
-function isComponent(type) {
-	return typeof type === "function" && "__setup" in type;
-}
-/**
-* Get hydration strategy from vnode props
-*/
-function getHydrationStrategy(props) {
-	if (props["client:load"] !== void 0) return { strategy: "load" };
-	if (props["client:idle"] !== void 0) return { strategy: "idle" };
-	if (props["client:visible"] !== void 0) return { strategy: "visible" };
-	if (props["client:only"] !== void 0) return { strategy: "only" };
-	if (props["client:media"] !== void 0) return {
-		strategy: "media",
-		media: props["client:media"]
-	};
-	return null;
-}
-/**
-* Hydrate a VNode against existing DOM
-* This only attaches event handlers and refs - no DOM creation
-*/
-function hydrateNode(vnode, dom, parent) {
-	if (!vnode) return dom;
-	while (dom && dom.nodeType === Node.COMMENT_NODE) {
-		const commentText = dom.data;
-		if (commentText.startsWith("$c:") || commentText.startsWith("/$c:") || commentText.startsWith("$island:")) break;
-		dom = dom.nextSibling;
-	}
-	if (vnode.type === Text) {
-		if (dom && dom.nodeType === Node.TEXT_NODE) {
-			vnode.dom = dom;
-			return dom.nextSibling;
-		}
-		return dom;
-	}
-	if (vnode.type === Fragment) {
-		let current = dom;
-		for (const child of vnode.children) current = hydrateNode(child, current, parent);
-		return current;
-	}
-	if (isComponent(vnode.type)) {
-		const strategy = vnode.props ? getHydrationStrategy(vnode.props) : null;
-		if (strategy) return scheduleComponentHydration(vnode, dom, parent, strategy);
-		return hydrateComponent(vnode, dom, parent);
-	}
-	if (typeof vnode.type === "string") {
-		if (!dom || dom.nodeType !== Node.ELEMENT_NODE) {
-			console.warn("[Hydrate] Expected element but got:", dom);
-			return dom;
-		}
-		const el = dom;
-		vnode.dom = el;
-		if (vnode.props) for (const key in vnode.props) {
-			if (key === "children" || key === "key") continue;
-			if (key.startsWith("client:")) continue;
-			patchProp(el, key, null, vnode.props[key]);
-		}
-		let childDom = el.firstChild;
-		for (const child of vnode.children) childDom = hydrateNode(child, childDom, el);
-		if (vnode.type === "select" && vnode.props) fixSelectValue(el, vnode.props);
-		return el.nextSibling;
-	}
-	return dom;
-}
-/**
-* Schedule component hydration based on strategy.
-* Returns the next DOM node after this component's content.
-*/
-function scheduleComponentHydration(vnode, dom, parent, strategy) {
-	const { startNode, endNode } = findComponentBoundaries(dom);
-	const doHydrate = () => {
-		hydrateComponent(vnode, startNode, parent);
-	};
-	switch (strategy.strategy) {
-		case "load":
-			console.log("[Hydrate] client:load - hydrating immediately");
-			doHydrate();
-			break;
-		case "idle":
-			console.log("[Hydrate] client:idle - scheduling for idle time");
-			if ("requestIdleCallback" in window) requestIdleCallback(() => {
-				console.log("[Hydrate] client:idle - idle callback fired");
-				doHydrate();
-			});
-			else setTimeout(() => {
-				console.log("[Hydrate] client:idle - timeout fallback fired");
-				doHydrate();
-			}, 200);
-			break;
-		case "visible":
-			console.log("[Hydrate] client:visible - observing visibility");
-			observeComponentVisibility(startNode, endNode, doHydrate);
-			break;
-		case "media":
-			if (strategy.media) {
-				const mql = window.matchMedia(strategy.media);
-				if (mql.matches) doHydrate();
-				else {
-					const handler = (e) => {
-						if (e.matches) {
-							mql.removeEventListener("change", handler);
-							doHydrate();
-						}
-					};
-					mql.addEventListener("change", handler);
-				}
-			}
-			break;
-		case "only":
-			doHydrate();
-			break;
-	}
-	return endNode ? endNode.nextSibling : dom;
-}
-/**
-* Find component start/end markers in DOM
-*/
-function findComponentBoundaries(dom) {
-	let startNode = dom;
-	let endNode = null;
-	if (dom && dom.nodeType === Node.COMMENT_NODE) {
-		const text = dom.data;
-		if (text.startsWith("$c:")) {
-			const id = text.slice(3);
-			startNode = dom;
-			let current = dom.nextSibling;
-			while (current) {
-				if (current.nodeType === Node.COMMENT_NODE) {
-					if (current.data === `/$c:${id}`) {
-						endNode = current;
-						break;
-					}
-				}
-				current = current.nextSibling;
-			}
-		}
-	}
-	return {
-		startNode,
-		endNode
-	};
-}
-/**
-* Observe when a component's DOM becomes visible
-*/
-function observeComponentVisibility(startNode, endNode, callback) {
-	let targetElement = null;
-	let current = startNode?.nextSibling || null;
-	while (current && current !== endNode) {
-		if (current.nodeType === Node.ELEMENT_NODE) {
-			targetElement = current;
-			break;
-		}
-		current = current.nextSibling;
-	}
-	if (!targetElement) {
-		callback();
-		return;
-	}
-	const observer = new IntersectionObserver((entries) => {
-		for (const entry of entries) if (entry.isIntersecting) {
-			observer.disconnect();
-			callback();
-			break;
-		}
-	}, { rootMargin: "50px" });
-	observer.observe(targetElement);
-}
-/**
-* Hydrate a component - run setup and create reactive effect
-* @param vnode - The VNode to hydrate
-* @param dom - The DOM node to start from
-* @param parent - The parent node
-* @param serverState - Optional state captured from server for async components
-*/
-function hydrateComponent(vnode, dom, parent, serverState) {
-	const componentFactory = vnode.type;
-	const setup = componentFactory.__setup;
-	const componentName = componentFactory.__name || "Anonymous";
-	if (componentName && componentName !== "Anonymous") registerComponent(componentName, componentFactory);
-	let anchor = null;
-	let componentId = null;
-	if (dom && dom.nodeType === Node.COMMENT_NODE) {
-		const commentText = dom.data;
-		if (commentText.startsWith("$c:")) {
-			anchor = dom;
-			componentId = parseInt(commentText.slice(3), 10);
-			dom = dom.nextSibling;
-			while (dom && dom.nodeType === Node.COMMENT_NODE) if (dom.data.startsWith("$island:")) dom = dom.nextSibling;
-			else break;
-		}
-	}
-	if (!serverState && componentId !== null) serverState = getIslandServerState(componentId);
-	const internalVNode = vnode;
-	const { children, slots: slotsFromProps, ...propsData } = filterClientDirectives(vnode.props || {});
-	const reactiveProps = signal(propsData);
-	internalVNode._componentProps = reactiveProps;
-	const slots = createSlots(children, slotsFromProps);
-	internalVNode._slots = slots;
-	const mountHooks = [];
-	const cleanupHooks = [];
-	const parentInstance = getCurrentInstance();
-	const signalFn = serverState ? createRestoringSignal(serverState) : signal;
-	const hasServerState = !!serverState;
-	const ssrHelper = {
-		load(_fn) {
-			if (hasServerState) console.log(`[Hydrate] Skipping ssr.load() - using restored server state`);
-		},
-		isServer: false,
-		isHydrating: hasServerState
-	};
-	const componentCtx = {
-		el: parent,
-		signal: signalFn,
-		props: createPropsAccessor(reactiveProps),
-		slots,
-		emit: (event, ...args) => {
-			const handler = reactiveProps[`on${event[0].toUpperCase() + event.slice(1)}`];
-			if (handler && typeof handler === "function") handler(...args);
-		},
-		parent: parentInstance,
-		onMount: (fn) => {
-			mountHooks.push(fn);
-		},
-		onCleanup: (fn) => {
-			cleanupHooks.push(fn);
-		},
-		expose: () => {},
-		renderFn: null,
-		update: () => {},
-		ssr: ssrHelper,
-		_serverState: serverState
-	};
-	const prev = setCurrentInstance(componentCtx);
-	let renderFn;
-	try {
-		renderFn = setup(componentCtx);
-	} catch (err) {
-		console.error(`Error hydrating component ${componentName}:`, err);
-	} finally {
-		setCurrentInstance(prev);
-	}
-	const startDom = anchor || dom;
-	let endDom = dom;
-	if (renderFn) {
-		componentCtx.renderFn = renderFn;
-		let isFirstRender = true;
-		const componentEffect = effect(() => {
-			const prevInstance = setCurrentInstance(componentCtx);
-			try {
-				const subTreeResult = componentCtx.renderFn();
-				if (subTreeResult == null) return;
-				const subTree = normalizeSubTree(subTreeResult);
-				const prevSubTree = internalVNode._subTree;
-				if (isFirstRender) {
-					isFirstRender = false;
-					endDom = hydrateNode(subTree, dom, parent);
-					internalVNode._subTree = subTree;
-				} else {
-					if (prevSubTree && prevSubTree.dom) {
-						const container = prevSubTree.dom.parentNode;
-						if (container) {
-							container._vnode = prevSubTree;
-							render(subTree, container);
-						}
-					}
-					internalVNode._subTree = subTree;
-				}
-			} finally {
-				setCurrentInstance(prevInstance);
-			}
-		});
-		internalVNode._effect = componentEffect;
-		componentCtx.update = () => componentEffect();
-	}
-	vnode.dom = anchor || startDom;
-	const mountCtx = { el: parent };
-	mountHooks.forEach((hook) => hook(mountCtx));
-	vnode.cleanup = () => {
-		cleanupHooks.forEach((hook) => hook(mountCtx));
-	};
-	let result = endDom;
-	while (result && result.nodeType === Node.COMMENT_NODE) {
-		if (result.data.startsWith("/$c:")) {
-			result = result.nextSibling;
-			break;
-		}
-		result = result.nextSibling;
-	}
-	return result;
-}
-function filterClientDirectives(props) {
-	const filtered = {};
-	for (const key in props) if (!key.startsWith("client:")) filtered[key] = props[key];
-	return filtered;
-}
-/**
-* Fix select element value after hydrating children.
-* This is needed because <select>.value only works after <option> children exist in DOM.
-*/
-function fixSelectValue(dom, props) {
-	if (dom.tagName === "SELECT" && "value" in props) {
-		const val = props.value;
-		if (dom.multiple) {
-			const options = dom.options;
-			const valArray = Array.isArray(val) ? val : [val];
-			for (let i = 0; i < options.length; i++) options[i].selected = valArray.includes(options[i].value);
-		} else dom.value = String(val);
-	}
-}
-/**
-* Hydrate islands based on their strategies (selective hydration)
-*/
-function hydrateIslands() {
-	const dataScript = document.getElementById("__SIGX_ISLANDS__");
-	if (!dataScript) return;
-	let islandData;
-	try {
-		islandData = JSON.parse(dataScript.textContent || "{}");
-	} catch {
-		console.error("Failed to parse island data");
-		return;
-	}
-	for (const [idStr, info] of Object.entries(islandData)) scheduleHydration(parseInt(idStr, 10), info);
-}
-/**
-* Schedule hydration based on strategy
-*/
-function scheduleHydration(id, info) {
-	const marker = findIslandMarker(id);
-	if (!marker) {
-		console.warn(`Island marker not found for id ${id}`);
-		return;
-	}
-	const component = info.componentId ? getComponent(info.componentId) : null;
-	if (!component && info.strategy !== "only") {
-		console.warn(`Component "${info.componentId}" not registered for hydration`);
-		return;
-	}
-	switch (info.strategy) {
-		case "load":
-			hydrateIsland(marker, component, info);
-			break;
-		case "idle":
-			if ("requestIdleCallback" in window) requestIdleCallback(() => hydrateIsland(marker, component, info));
-			else setTimeout(() => hydrateIsland(marker, component, info), 200);
-			break;
-		case "visible":
-			observeVisibility(marker, () => hydrateIsland(marker, component, info));
-			break;
-		case "media":
-			if (info.media) {
-				const mql = window.matchMedia(info.media);
-				if (mql.matches) hydrateIsland(marker, component, info);
-				else mql.addEventListener("change", function handler(e) {
-					if (e.matches) {
-						mql.removeEventListener("change", handler);
-						hydrateIsland(marker, component, info);
-					}
-				});
-			}
-			break;
-		case "only":
-			if (component) mountClientOnly(marker, component, info);
-			break;
-	}
-}
-function findIslandMarker(id) {
-	const walker = document.createTreeWalker(document.body, NodeFilter.SHOW_COMMENT, null);
-	let node;
-	while (node = walker.nextNode()) if (node.data === `$c:${id}`) return node;
-	return null;
-}
-function observeVisibility(marker, callback) {
-	let node = marker.nextSibling;
-	while (node && node.nodeType !== Node.ELEMENT_NODE) node = node.nextSibling;
-	if (!node) return;
-	const observer = new IntersectionObserver((entries) => {
-		for (const entry of entries) if (entry.isIntersecting) {
-			observer.disconnect();
-			callback();
-			break;
-		}
-	});
-	observer.observe(node);
-}
-function hydrateIsland(marker, component, info) {
-	let container = marker.nextSibling;
-	while (container && container.nodeType === Node.COMMENT_NODE) container = container.nextSibling;
-	if (!container || container.nodeType !== Node.ELEMENT_NODE) {
-		console.warn("No element found for island hydration");
-		return;
-	}
-	const props = info.props || {};
-	if (info.state) setPendingServerState(info.state);
-	const vnode = {
-		type: component,
-		props,
-		key: null,
-		children: [],
-		dom: null
-	};
-	const wrapper = document.createElement("div");
-	wrapper.style.display = "contents";
-	const parent = container.parentNode;
-	parent.insertBefore(wrapper, container);
-	parent.removeChild(container);
-	render(vnode, wrapper);
-}
-function mountClientOnly(marker, component, info) {
-	let placeholder = marker.nextSibling;
-	while (placeholder && placeholder.nodeType === Node.COMMENT_NODE) placeholder = placeholder.nextSibling;
-	if (!placeholder || !placeholder.hasAttribute?.("data-island")) return;
-	const props = info.props || {};
-	const container = placeholder;
-	container.innerHTML = "";
-	render({
-		type: component,
-		props,
-		key: null,
-		children: [],
-		dom: null
-	}, container);
-}
-/**
-* Set up listener for async components streaming in.
-* This is set up at module load time to catch events early.
-*/
-let _asyncListenerSetup = false;
-function ensureAsyncHydrationListener() {
-	if (_asyncListenerSetup) return;
-	_asyncListenerSetup = true;
-	document.addEventListener("sigx:async-ready", (event) => {
-		const { id, state } = event.detail || {};
-		console.log(`[Hydrate] Async component ${id} ready, hydrating...`);
-		invalidateIslandCache();
-		const placeholder = document.querySelector(`[data-async-placeholder="${id}"]`);
-		if (!placeholder) {
-			console.warn(`[Hydrate] Could not find placeholder for async component ${id}`);
-			return;
-		}
-		const info = getIslandData()[String(id)];
-		if (!info) {
-			console.warn(`[Hydrate] No island data for async component ${id}`);
-			return;
-		}
-		hydrateAsyncComponent(placeholder, info);
-	});
-}
-if (typeof document !== "undefined") ensureAsyncHydrationListener();
-/**
-* Hydrate an async component that just streamed in.
-* The DOM has already been replaced with server-rendered content by $SIGX_REPLACE.
-* Since the streamed content doesn't include component markers, we mount fresh
-* with the server state restored via the context extension.
-*/
-function hydrateAsyncComponent(container, info) {
-	if (!info.componentId) {
-		console.error(`[Hydrate] No componentId in island info`);
-		return;
-	}
-	const component = getComponent(info.componentId);
-	if (!component) {
-		console.error(`[Hydrate] Component "${info.componentId}" not registered`);
-		return;
-	}
-	const props = info.props || {};
-	const serverState = info.state;
-	container.innerHTML = "";
-	if (serverState) setPendingServerState(serverState);
-	render({
-		type: component,
-		props,
-		key: null,
-		children: [],
-		dom: null
-	}, container);
-	console.log(`[Hydrate] Async component "${info.componentId}" mounted with server state`);
-}
-
-//#endregion
-export { HydrationRegistry, createSSRContext, hydrate, hydrateIslands, registerComponent, registerComponents, renderToStream, renderToString };
-//# sourceMappingURL=index.js.map
+import { i as createSSRContext, r as renderToString, t as renderToStream } from "./server-BCOJt2Bi.js";
+import { a as registerComponents, i as registerComponent, n as hydrateIslands, r as HydrationRegistry, t as ssrClientPlugin } from "./client-DiLwBAD-.js";
+export { HydrationRegistry, createSSRContext, hydrateIslands, registerComponent, registerComponents, renderToStream, renderToString, ssrClientPlugin };