@theseus.run/jsx-md 0.1.0 → 0.1.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@theseus.run/jsx-md",
-  "version": "0.1.0",
+  "version": "0.1.2",
   "description": "JSX/TSX renderer for Markdown. Write agent prompts and LLM instructions as typed, composable components. Zero runtime dependencies.",
   "type": "module",
   "author": "Roman Dubinin <romanonthego@gmail.com> (https://romanonthego.com)",
@@ -22,7 +22,8 @@
     "access": "public"
   },
   "scripts": {
-    "test": "bun test"
+    "test": "bun test",
+    "typecheck": "tsc"
   },
   "files": [
     "src/index.ts",

package/src/jsx-runtime.ts

@@ -36,7 +36,7 @@ export type VNode =
   | ReadonlyArray<VNode>;
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-type Component<P = any> = (props: P) => string;
+type Component<P = any> = (props: P) => VNode;
 
 // ---------------------------------------------------------------------------
 // JSX namespace
@@ -45,10 +45,10 @@ type Component<P = any> = (props: P) => string;
 // eslint-disable-next-line @typescript-eslint/no-namespace
 export namespace JSX {
   /**
-   * JSX.Element is VNode (not just VNodeElement) so that string-returning
-   * components pass TypeScript's component return-type check. The jsx() factory
-   * always produces VNodeElement at runtime; the wider union here is only needed
-   * to satisfy TypeScript's component-validity check.
+   * JSX.Element is VNode so that components returning any valid VNode
+   * (string, VNodeElement, Fragment, null, etc.) satisfy TypeScript's
+   * component return-type check. The jsx() factory always produces
+   * VNodeElement at runtime; the wider union is only for type-checking.
    */
   export type Element = VNode;
 

package/src/render.ts

@@ -50,8 +50,9 @@ export function render(node: VNode): string {
     return `<${el.type}${attrStr}>\n${inner.trimEnd()}\n</${el.type}>\n`;
   }
 
-  // Function component — call with its props (children still as VNode)
-  return el.type(el.props);
+  // Function component — call with its props (children still as VNode),
+  // then recurse in case the component returned a VNode (e.g. a Fragment).
+  return render(el.type(el.props));
 }
 
 // Register render with Fragment immediately on module init.