@sigx/runtime-terminal 0.1.4 → 0.1.5

package/dist/index.d.ts

@@ -13,8 +13,8 @@ export interface TerminalNode {
     children: TerminalNode[];
     parentNode?: TerminalNode | null;
 }
-export declare const render: (element: import("@sigx/runtime-core").JSXElement, container: TerminalNode, appContext?: import("@sigx/runtime-core").AppContext) => void, createApp: (rootComponent: any) => {
-    mount(selectorOrContainer: string | TerminalNode): void;
+export declare const render: import("@sigx/runtime-core").RootRenderFunction<TerminalNode, TerminalNode>, createApp: (rootComponent: any) => {
+    mount: (selectorOrContainer: string | TerminalNode) => void;
 };
 export declare function renderNodeToLines(node: TerminalNode): string[];
 type KeyHandler = (key: string) => void;

package/dist/index.js

@@ -6,6 +6,14 @@ const plugins$1 = [];
 function getComponentPlugins$1() {
 	return plugins$1;
 }
+const contextExtensions = [];
+/**
+* Apply all registered context extensions to a context object.
+* Called internally by the renderer when creating component contexts.
+*/
+function applyContextExtensions(ctx) {
+	for (const extension of contextExtensions) extension(ctx);
+}
 
 //#endregion
 //#region ../runtime-core/src/app.ts
@@ -429,6 +437,195 @@ const Suspense$1 = defineComponent((ctx) => {
 	};
 }, { name: "Suspense" });
 
+//#endregion
+//#region ../runtime-core/src/utils/props-accessor.ts
+/**
+* Creates a props accessor that can be called with defaults or accessed directly.
+* After calling with defaults, direct property access uses those defaults.
+* 
+* @example
+* ```ts
+* // In component setup:
+* const props = createPropsAccessor(reactiveProps);
+* 
+* // Set defaults
+* props({ count: 0, label: 'Default' });
+* 
+* // Access props (falls back to defaults if not provided)
+* const count = props.count;
+* ```
+*/
+function createPropsAccessor(reactiveProps) {
+	let defaults = {};
+	const proxy = new Proxy(function propsAccessor() {}, {
+		get(_, key) {
+			if (typeof key === "symbol") return void 0;
+			const value = reactiveProps[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 reactiveProps || key in defaults;
+		},
+		ownKeys() {
+			return [...new Set([...Object.keys(reactiveProps), ...Object.keys(defaults)])];
+		},
+		getOwnPropertyDescriptor(_, key) {
+			if (typeof key === "symbol") return void 0;
+			if (key in reactiveProps || key in defaults) return {
+				enumerable: true,
+				configurable: true,
+				writable: false
+			};
+		}
+	});
+	return proxy;
+}
+
+//#endregion
+//#region ../runtime-core/src/utils/slots.ts
+/**
+* Slots system for component children.
+* Supports default and named slots with reactivity.
+*/
+/**
+* Create slots object from children and slots prop.
+* Uses a version signal to trigger re-renders when children change.
+* 
+* Supports named slots via:
+* - `slots` prop object (e.g., `slots={{ header: () => <div>...</div> }}`)
+* - `slot` prop on children (e.g., `<div slot="header">...</div>`)
+* 
+* @example
+* ```tsx
+* // Parent component
+* <Card slots={{ header: () => <h1>Title</h1> }}>
+*   <p>Default content</p>
+*   <span slot="footer">Footer text</span>
+* </Card>
+* 
+* // Card component setup
+* const slots = createSlots(children, slotsFromProps);
+* return () => (
+*   <div>
+*     {slots.header()}
+*     {slots.default()}
+*     {slots.footer()}
+*   </div>
+* );
+* ```
+*/
+function createSlots(children, slotsFromProps) {
+	const versionSignal = signal({ v: 0 });
+	function extractNamedSlotsFromChildren(c) {
+		const defaultChildren = [];
+		const namedSlots = {};
+		if (c == null) return {
+			defaultChildren,
+			namedSlots
+		};
+		const items = Array.isArray(c) ? c : [c];
+		for (const child of items) if (child && typeof child === "object" && child.props && child.props.slot) {
+			const slotName = child.props.slot;
+			if (!namedSlots[slotName]) namedSlots[slotName] = [];
+			namedSlots[slotName].push(child);
+		} else defaultChildren.push(child);
+		return {
+			defaultChildren,
+			namedSlots
+		};
+	}
+	const slotsObj = {
+		_children: children,
+		_slotsFromProps: slotsFromProps || {},
+		_version: versionSignal,
+		_isPatching: false,
+		default: function() {
+			this._version.v;
+			const c = this._children;
+			const { defaultChildren } = extractNamedSlotsFromChildren(c);
+			return defaultChildren.filter((child) => child != null && child !== false && child !== true);
+		}
+	};
+	return new Proxy(slotsObj, { get(target, prop) {
+		if (prop in target) return target[prop];
+		if (typeof prop === "string") return function(scopedProps) {
+			target._version.v;
+			if (target._slotsFromProps && typeof target._slotsFromProps[prop] === "function") {
+				const result = target._slotsFromProps[prop](scopedProps);
+				if (result == null) return [];
+				return Array.isArray(result) ? result : [result];
+			}
+			const { namedSlots } = extractNamedSlotsFromChildren(target._children);
+			return namedSlots[prop] || [];
+		};
+	} });
+}
+
+//#endregion
+//#region ../runtime-core/src/utils/normalize.ts
+/**
+* VNode normalization utilities.
+* Converts render results into proper VNode structures.
+*/
+/**
+* Normalize render result to a VNode (wrapping arrays in Fragment).
+* Handles null, undefined, false, true by returning an empty Text node.
+* 
+* This is used to normalize the return value of component render functions
+* into a consistent VNode structure for the renderer to process.
+* 
+* @example
+* ```ts
+* // Conditional rendering returns null/false
+* normalizeSubTree(null)     // → empty Text node
+* normalizeSubTree(false)    // → empty Text node
+* 
+* // Arrays become Fragments
+* normalizeSubTree([<A/>, <B/>])  // → Fragment with children
+* 
+* // Primitives become Text nodes
+* normalizeSubTree("hello")  // → Text node
+* normalizeSubTree(42)       // → Text node
+* 
+* // VNodes pass through
+* normalizeSubTree(<div/>)   // → same VNode
+* ```
+*/
+function normalizeSubTree(result) {
+	if (result == null || result === false || result === true) return {
+		type: Text$1,
+		props: {},
+		key: null,
+		children: [],
+		dom: null,
+		text: ""
+	};
+	if (Array.isArray(result)) return {
+		type: Fragment$1,
+		props: {},
+		key: null,
+		children: result,
+		dom: null
+	};
+	if (typeof result === "string" || typeof result === "number") return {
+		type: Text$1,
+		props: {},
+		key: null,
+		children: [],
+		dom: null,
+		text: result
+	};
+	return result;
+}
+
 //#endregion
 //#region ../runtime-core/src/renderer.ts
 /**
@@ -676,43 +873,6 @@ function createRenderer(options) {
 		for (let i = beginIdx; i <= endIdx; i++) if (children[i] && isSameVNode(children[i], newChild)) return i;
 		return null;
 	}
-	/**
-	* Creates a props accessor that can be called with defaults or accessed directly.
-	* After calling with defaults, direct property access uses those defaults.
-	*/
-	function createPropsAccessor(reactiveProps) {
-		let defaults = {};
-		const proxy = new Proxy(function propsAccessor() {}, {
-			get(_, key) {
-				if (typeof key === "symbol") return void 0;
-				const value = reactiveProps[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 reactiveProps || key in defaults;
-			},
-			ownKeys() {
-				return [...new Set([...Object.keys(reactiveProps), ...Object.keys(defaults)])];
-			},
-			getOwnPropertyDescriptor(_, key) {
-				if (typeof key === "symbol") return void 0;
-				if (key in reactiveProps || key in defaults) return {
-					enumerable: true,
-					configurable: true,
-					writable: false
-				};
-			}
-		});
-		return proxy;
-	}
 	function mountComponent(vnode, container, before, setup) {
 		const anchor = hostCreateComment("");
 		vnode.dom = anchor;
@@ -753,6 +913,7 @@ function createRenderer(options) {
 			renderFn: null,
 			update: () => {}
 		};
+		applyContextExtensions(ctx);
 		ctx.__name = componentName;
 		if (currentAppContext) ctx._appContext = currentAppContext;
 		const componentInstance = {
@@ -763,7 +924,9 @@ function createRenderer(options) {
 		const prev = setCurrentInstance(ctx);
 		let renderFn;
 		try {
-			renderFn = setup(ctx);
+			const setupResult = setup(ctx);
+			if (setupResult && typeof setupResult.then === "function") throw new Error(`Async setup in component "${componentName}" is only supported during SSR. On the client, use pre-loaded data from hydration or fetch in onMount.`);
+			renderFn = setupResult;
 			notifyComponentCreated(currentAppContext, componentInstance);
 		} catch (err) {
 			if (!handleComponentError(currentAppContext, err, componentInstance, "setup")) throw err;
@@ -808,84 +971,12 @@ function createRenderer(options) {
 			cleanupHooks.forEach((hook) => hook(mountCtx));
 		};
 	}
-	/**
-	* Create slots object from children and slots prop.
-	* Uses a version signal to trigger re-renders when children change.
-	* Supports named slots via:
-	* - `slots` prop object (e.g., slots={{ header: () => <div>...</div> }})
-	* - `slot` prop on children (e.g., <div slot="header">...</div>)
-	*/
-	function createSlots(children, slotsFromProps) {
-		const versionSignal = signal({ v: 0 });
-		function extractNamedSlotsFromChildren(c) {
-			const defaultChildren = [];
-			const namedSlots = {};
-			if (c == null) return {
-				defaultChildren,
-				namedSlots
-			};
-			const items = Array.isArray(c) ? c : [c];
-			for (const child of items) if (child && typeof child === "object" && child.props && child.props.slot) {
-				const slotName = child.props.slot;
-				if (!namedSlots[slotName]) namedSlots[slotName] = [];
-				namedSlots[slotName].push(child);
-			} else defaultChildren.push(child);
-			return {
-				defaultChildren,
-				namedSlots
-			};
-		}
-		const slotsObj = {
-			_children: children,
-			_slotsFromProps: slotsFromProps || {},
-			_version: versionSignal,
-			_isPatching: false,
-			default: function() {
-				this._version.v;
-				const c = this._children;
-				const { defaultChildren } = extractNamedSlotsFromChildren(c);
-				return defaultChildren.filter((child) => child != null && child !== false && child !== true);
-			}
-		};
-		return new Proxy(slotsObj, { get(target, prop) {
-			if (prop in target) return target[prop];
-			if (typeof prop === "string") return function(scopedProps) {
-				target._version.v;
-				if (target._slotsFromProps && typeof target._slotsFromProps[prop] === "function") {
-					const result = target._slotsFromProps[prop](scopedProps);
-					if (result == null) return [];
-					return Array.isArray(result) ? result : [result];
-				}
-				const { namedSlots } = extractNamedSlotsFromChildren(target._children);
-				return namedSlots[prop] || [];
-			};
-		} });
-	}
-	/**
-	* Normalize render result to a VNode (wrapping arrays in Fragment)
-	* Note: Falsy values (null, undefined, false, true) from conditional rendering
-	* are handled by mount() which guards against them, so no filtering needed here.
-	*/
-	function normalizeSubTree(result) {
-		if (Array.isArray(result)) return {
-			type: Fragment$1,
-			props: {},
-			key: null,
-			children: result,
-			dom: null
-		};
-		if (typeof result === "string" || typeof result === "number") return {
-			type: Text$1,
-			props: {},
-			key: null,
-			children: [],
-			dom: null,
-			text: result
-		};
-		return result;
-	}
 	return {
 		render: render$1,
+		patch,
+		mount,
+		unmount,
+		mountComponent,
 		createApp: (rootComponent) => {
 			return { mount(selectorOrContainer) {
 				let container = null;