@xyd-js/source-react-runtime 0.0.0-build-23166ce-20260423151359

package/__fixtures__/3.vite-lib.sample-real-app/input/src/components/StatsPanel.tsx

@@ -0,0 +1,44 @@
+import type { TodoStats } from "../types/todo";
+
+interface StatCardProps {
+    /** Stat label displayed above the value */
+    label: string;
+    /** Numeric value to display */
+    value: number;
+    /** Color accent for the value */
+    color?: string;
+}
+
+interface StatsPanelProps {
+    /** Todo statistics to display */
+    stats: TodoStats;
+    /** Render in compact horizontal mode */
+    compact?: boolean;
+}
+
+function StatCard({ label, value, color }: StatCardProps) {
+    return (
+        <div className="stat-card">
+            <span className="stat-label">{label}</span>
+            <span className="stat-value" style={{ color }}>{value}</span>
+        </div>
+    );
+}
+
+export function StatsPanel({ stats, compact }: StatsPanelProps) {
+    const cards = [
+        { label: "Total", value: stats.total },
+        { label: "Active", value: stats.active, color: "#3b82f6" },
+        { label: "Done", value: stats.completed, color: "#22c55e" },
+        { label: "Overdue", value: stats.overdue, color: stats.overdue > 0 ? "#ef4444" : undefined },
+    ];
+
+    return (
+        <div className={`stats-panel ${compact ? "compact" : ""}`}>
+            {cards.map((c) => (
+                <StatCard key={c.label} label={c.label} value={c.value} color={c.color} />
+            ))}
+        </div>
+    );
+}
+

package/__fixtures__/3.vite-lib.sample-real-app/input/src/components/TodoItem.tsx

@@ -0,0 +1,54 @@
+import { useState } from "react";
+import type { Todo, Priority } from "../types/todo";
+
+interface TodoItemProps {
+    /** The todo data to render */
+    todo: Todo;
+
+    /** Called when the checkbox is toggled */
+    onToggle: (id: string) => void;
+
+    /** Called when the delete button is clicked */
+    onDelete: (id: string) => void;
+
+    /** Called when the todo is updated */
+    onUpdate: (id: string, updates: Partial<Pick<Todo, "title" | "description" | "priority" | "tags">>) => void;
+
+    /** Enable inline editing mode on mount */
+    autoEdit?: boolean;
+}
+
+export function TodoItem({ todo, onToggle, onDelete, onUpdate, autoEdit = false }: TodoItemProps) {
+    const [editing, setEditing] = useState(autoEdit);
+    const [editTitle, setEditTitle] = useState(todo.title);
+    const isOverdue = !todo.completed && todo.dueDate && new Date(todo.dueDate) < new Date();
+
+    const handleSave = () => {
+        if (editTitle.trim()) {
+            onUpdate(todo.id, { title: editTitle.trim() });
+        }
+        setEditing(false);
+    };
+
+    return (
+        <div className={`todo-item ${todo.completed ? "completed" : ""} ${isOverdue ? "overdue" : ""}`}>
+            <input type="checkbox" checked={todo.completed} onChange={() => onToggle(todo.id)} />
+            {editing ? (
+                <input value={editTitle} onChange={(e) => setEditTitle(e.target.value)} onBlur={handleSave} autoFocus />
+            ) : (
+                <span onDoubleClick={() => setEditing(true)}>{todo.title}</span>
+            )}
+            {todo.description && <p className="description">{todo.description}</p>}
+            <div className="tags">
+                <span className={`priority priority-${todo.priority}`}>{todo.priority}</span>
+                {todo.tags.map((tag) => <span key={tag} className="tag">{tag}</span>)}
+                {isOverdue && <span className="overdue-badge">overdue</span>}
+            </div>
+            <div className="actions">
+                <button type="button" onClick={() => setEditing(true)}>Edit</button>
+                <button type="button" onClick={() => onDelete(todo.id)}>Delete</button>
+            </div>
+        </div>
+    );
+}
+

package/__fixtures__/3.vite-lib.sample-real-app/input/src/index.ts

@@ -0,0 +1,6 @@
+export { TodoItem } from "./components/TodoItem";
+export { AddTodoForm } from "./components/AddTodoForm";
+export { FilterBar } from "./components/FilterBar";
+export { StatsPanel } from "./components/StatsPanel";
+
+export type { Todo, TodoStats, Priority, FilterStatus } from "./types/todo";

package/__fixtures__/3.vite-lib.sample-real-app/input/src/types/todo.ts

@@ -0,0 +1,23 @@
+export type Priority = "low" | "medium" | "high" | "urgent";
+
+export type FilterStatus = "all" | "active" | "completed";
+
+export interface Todo {
+    id: string;
+    title: string;
+    description?: string;
+    completed: boolean;
+    priority: Priority;
+    tags: string[];
+    createdAt: string;
+    completedAt?: string;
+    dueDate?: string;
+}
+
+export interface TodoStats {
+    total: number;
+    active: number;
+    completed: number;
+    overdue: number;
+    byPriority: Record<Priority, number>;
+}

package/__fixtures__/3.vite-lib.sample-real-app/input/tsconfig.json

@@ -0,0 +1,12 @@
+{
+  "compilerOptions": {
+    "outDir": "./dist",
+    "jsx": "react-jsx",
+    "skipLibCheck": true,
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "target": "ES2020",
+    "strict": true
+  },
+  "include": ["src/**/*.ts", "src/**/*.tsx"]
+}

package/__fixtures__/3.vite-lib.sample-real-app/input/vite.config.ts

@@ -0,0 +1,22 @@
+import {defineConfig} from 'vite';
+import {resolve} from 'node:path';
+import react from '@vitejs/plugin-react';
+import {xydSourceReactRuntime} from '@xyd-js/source-react-runtime';
+
+export default defineConfig({
+    plugins: [
+        xydSourceReactRuntime(),
+        react(),
+    ],
+    build: {
+        lib: {
+            entry: 'src/index.ts',
+            formats: ['es'],
+            fileName: 'index',
+        },
+        rollupOptions: {
+            external: ['react', 'react/jsx-runtime', 'react/jsx-dev-runtime', 'react-dom'],
+        },
+        minify: false,
+    },
+});

package/__fixtures__/3.vite-lib.sample-real-app/output.js

@@ -0,0 +1,63 @@
+// === index.js ===
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useState } from "react";
+function TodoItem({ todo, onToggle, onDelete, onUpdate, autoEdit = false }) {
+  const [editing, setEditing] = useState(autoEdit);
+  const [editTitle, setEditTitle] = useState(todo.title);
+  const isOverdue = !todo.completed && todo.dueDate && new Date(todo.dueDate) < /* @__PURE__ */ new Date();
+  const handleSave = () => {
+    if (editTitle.trim()) {
+      onUpdate(todo.id, { title: editTitle.trim() });
+    }
+    setEditing(false);
+  };
+  return jsxs("div", { className: `todo-item ${todo.completed ? "completed" : ""} ${isOverdue ? "overdue" : ""}`, children: [jsx("input", { type: "checkbox", checked: todo.completed, onChange: () => onToggle(todo.id) }), editing ? jsx("input", { value: editTitle, onChange: (e) => setEditTitle(e.target.value), onBlur: handleSave, autoFocus: true }) : jsx("span", { onDoubleClick: () => setEditing(true), children: todo.title }), todo.description && jsx("p", { className: "description", children: todo.description }), jsxs("div", { className: "tags", children: [jsx("span", { className: `priority priority-${todo.priority}`, children: todo.priority }), todo.tags.map((tag) => jsx("span", { className: "tag", children: tag }, tag)), isOverdue && jsx("span", { className: "overdue-badge", children: "overdue" })] }), jsxs("div", { className: "actions", children: [jsx("button", { type: "button", onClick: () => setEditing(true), children: "Edit" }), jsx("button", { type: "button", onClick: () => onDelete(todo.id), children: "Delete" })] })] });
+}
+TodoItem.__xydUniform = JSON.parse('{"title":"TodoItem","canonical":"","description":"","definitions":[{"title":"Props","properties":[{"name":"todo","type":"object","description":"","meta":[{"name":"required","value":"true"}],"properties":[{"name":"id","type":"string","description":"","meta":[{"name":"required","value":"true"}]},{"name":"title","type":"string","description":"","meta":[{"name":"required","value":"true"}]},{"name":"description","type":"string","description":"","meta":[]},{"name":"completed","type":"boolean","description":"","meta":[{"name":"required","value":"true"}]},{"name":"priority","type":"$xor","description":"","properties":[{"name":"priority","type":"object","description":"","meta":[{"name":"required","value":"true"}]},{"name":"priority","type":"object","description":"","meta":[{"name":"required","value":"true"}]},{"name":"priority","type":"object","description":"","meta":[{"name":"required","value":"true"}]},{"name":"priority","type":"object","description":"","meta":[{"name":"required","value":"true"}]}],"meta":[{"name":"required","value":"true"}]},{"name":"tags","type":"$array","description":"","meta":[{"name":"required","value":"true"}],"properties":[],"ofProperty":{"name":"","type":"string","properties":[],"description":"","meta":[{"name":"required","value":"true"}]}},{"name":"createdAt","type":"string","description":"","meta":[{"name":"required","value":"true"}]},{"name":"completedAt","type":"string","description":"","meta":[]},{"name":"dueDate","type":"string","description":"","meta":[]}]},{"name":"autoEdit","type":"boolean","description":"Enable inline editing mode on mount","meta":[]}],"meta":[{"name":"type","value":"parameters"}]}],"examples":{"groups":[]}}');
+function AddTodoForm({ onAdd, defaultPriority = "medium", placeholder = "What needs to be done?" }) {
+  const [title, setTitle] = useState("");
+  const [priority, setPriority] = useState(defaultPriority);
+  const [description, setDescription] = useState("");
+  const [tags, setTags] = useState("");
+  const handleSubmit = (e) => {
+    e.preventDefault();
+    if (!title.trim())
+      return;
+    onAdd(title.trim(), priority, description.trim() || void 0, tags.split(",").map((t) => t.trim()).filter(Boolean));
+    setTitle("");
+    setDescription("");
+    setTags("");
+    setPriority(defaultPriority);
+  };
+  return jsxs("form", { onSubmit: handleSubmit, className: "add-todo-form", children: [jsx("input", { type: "text", value: title, onChange: (e) => setTitle(e.target.value), placeholder }), jsxs("select", { value: priority, onChange: (e) => setPriority(e.target.value), children: [jsx("option", { value: "low", children: "Low" }), jsx("option", { value: "medium", children: "Medium" }), jsx("option", { value: "high", children: "High" }), jsx("option", { value: "urgent", children: "Urgent" })] }), jsx("textarea", { value: description, onChange: (e) => setDescription(e.target.value), placeholder: "Description (optional)" }), jsx("input", { type: "text", value: tags, onChange: (e) => setTags(e.target.value), placeholder: "Tags (comma separated)" }), jsx("button", { type: "submit", disabled: !title.trim(), children: "Add" })] });
+}
+AddTodoForm.__xydUniform = JSON.parse('{"title":"AddTodoForm","canonical":"","description":"","definitions":[{"title":"Props","properties":[{"name":"defaultPriority","type":"$xor","description":"Default priority for new todos","properties":[{"name":"defaultPriority","type":"object","description":"","meta":[]},{"name":"defaultPriority","type":"object","description":"","meta":[]},{"name":"defaultPriority","type":"object","description":"","meta":[]},{"name":"defaultPriority","type":"object","description":"","meta":[]}],"meta":[]},{"name":"placeholder","type":"string","description":"Placeholder text for the title input","meta":[]}],"meta":[{"name":"type","value":"parameters"}]}],"examples":{"groups":[]}}');
+function FilterBar({ filter, onFilterChange, searchQuery, onSearchChange, stats, onClearCompleted, className }) {
+  const tabs = [
+    { value: "all", label: `All (${stats.total})` },
+    { value: "active", label: `Active (${stats.active})` },
+    { value: "completed", label: `Done (${stats.completed})` }
+  ];
+  return jsxs("div", { className: `filter-bar ${className || ""}`, children: [jsx("div", { className: "tabs", children: tabs.map((tab) => jsx("button", { type: "button", className: filter === tab.value ? "active" : "", onClick: () => onFilterChange(tab.value), children: tab.label }, tab.value)) }), jsx("input", { type: "search", value: searchQuery, onChange: (e) => onSearchChange(e.target.value), placeholder: "Search..." }), stats.completed > 0 && jsx("button", { type: "button", onClick: onClearCompleted, className: "clear-btn", children: "Clear completed" })] });
+}
+FilterBar.__xydUniform = JSON.parse('{"title":"FilterBar","canonical":"","description":"","definitions":[{"title":"Props","properties":[{"name":"filter","type":"$xor","description":"","properties":[{"name":"filter","type":"object","description":"","meta":[{"name":"required","value":"true"}]},{"name":"filter","type":"object","description":"","meta":[{"name":"required","value":"true"}]},{"name":"filter","type":"object","description":"","meta":[{"name":"required","value":"true"}]}],"meta":[{"name":"required","value":"true"}]},{"name":"searchQuery","type":"string","description":"Current search query","meta":[{"name":"required","value":"true"}]},{"name":"stats","type":"object","description":"","meta":[{"name":"required","value":"true"}],"properties":[{"name":"total","type":"number","description":"","meta":[{"name":"required","value":"true"}]},{"name":"active","type":"number","description":"","meta":[{"name":"required","value":"true"}]},{"name":"completed","type":"number","description":"","meta":[{"name":"required","value":"true"}]},{"name":"overdue","type":"number","description":"","meta":[{"name":"required","value":"true"}]},{"name":"byPriority","type":"object","description":"Construct a type with a set of properties K of type T","meta":[{"name":"required","value":"true"}],"properties":[{"name":"low","type":"number","description":"","meta":[{"name":"required","value":"true"}]},{"name":"medium","type":"number","description":"","meta":[{"name":"required","value":"true"}]},{"name":"high","type":"number","description":"","meta":[{"name":"required","value":"true"}]},{"name":"urgent","type":"number","description":"","meta":[{"name":"required","value":"true"}]}]}]},{"name":"className","type":"string","description":"Additional CSS classes","meta":[]}],"meta":[{"name":"type","value":"parameters"}]}],"examples":{"groups":[]}}');
+function StatCard({ label, value, color }) {
+  return jsxs("div", { className: "stat-card", children: [jsx("span", { className: "stat-label", children: label }), jsx("span", { className: "stat-value", style: { color }, children: value })] });
+}
+function StatsPanel({ stats, compact }) {
+  const cards = [
+    { label: "Total", value: stats.total },
+    { label: "Active", value: stats.active, color: "#3b82f6" },
+    { label: "Done", value: stats.completed, color: "#22c55e" },
+    { label: "Overdue", value: stats.overdue, color: stats.overdue > 0 ? "#ef4444" : void 0 }
+  ];
+  return jsx("div", { className: `stats-panel ${compact ? "compact" : ""}`, children: cards.map((c) => jsx(StatCard, { label: c.label, value: c.value, color: c.color }, c.label)) });
+}
+StatsPanel.__xydUniform = JSON.parse('{"title":"StatsPanel","canonical":"","description":"","definitions":[{"title":"Props","properties":[{"name":"stats","type":"object","description":"","meta":[{"name":"required","value":"true"}],"properties":[{"name":"total","type":"number","description":"","meta":[{"name":"required","value":"true"}]},{"name":"active","type":"number","description":"","meta":[{"name":"required","value":"true"}]},{"name":"completed","type":"number","description":"","meta":[{"name":"required","value":"true"}]},{"name":"overdue","type":"number","description":"","meta":[{"name":"required","value":"true"}]},{"name":"byPriority","type":"object","description":"Construct a type with a set of properties K of type T","meta":[{"name":"required","value":"true"}],"properties":[{"name":"low","type":"number","description":"","meta":[{"name":"required","value":"true"}]},{"name":"medium","type":"number","description":"","meta":[{"name":"required","value":"true"}]},{"name":"high","type":"number","description":"","meta":[{"name":"required","value":"true"}]},{"name":"urgent","type":"number","description":"","meta":[{"name":"required","value":"true"}]}]}]},{"name":"compact","type":"boolean","description":"Render in compact horizontal mode","meta":[]}],"meta":[{"name":"type","value":"parameters"}]}],"examples":{"groups":[]}}');
+export {
+  AddTodoForm,
+  FilterBar,
+  StatsPanel,
+  TodoItem
+};
+

package/__fixtures__/4.vite-app.user-card/input/package.json

@@ -0,0 +1,8 @@
+{
+  "name": "xyd-fixture-rt-4-vite-app-user-card",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "build": "vite build"
+  }
+}

package/__fixtures__/4.vite-app.user-card/input/src/UserCard.tsx

@@ -0,0 +1,27 @@
+interface UserCardProps {
+    /** Full name of the user */
+    name: string;
+
+    /** Email address of the user */
+    email: string;
+
+    /** URL to the user's avatar image */
+    avatarUrl?: string;
+
+    /** Role or title of the user */
+    role?: "admin" | "editor" | "viewer";
+
+    /** Whether the card is in a loading state */
+    loading?: boolean;
+}
+
+export function UserCard(props: UserCardProps) {
+    return (
+        <div>
+            {props.avatarUrl && <img src={props.avatarUrl} alt={props.name} />}
+            <h3>{props.name}</h3>
+            <p>{props.email}</p>
+            {props.role && <span>{props.role}</span>}
+        </div>
+    );
+}

package/__fixtures__/4.vite-app.user-card/input/src/index.ts

@@ -0,0 +1 @@
+export {UserCard} from './UserCard';

package/__fixtures__/4.vite-app.user-card/input/tsconfig.json

@@ -0,0 +1,12 @@
+{
+  "compilerOptions": {
+    "outDir": "./dist",
+    "jsx": "react-jsx",
+    "skipLibCheck": true,
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "target": "ES2020",
+    "strict": true
+  },
+  "include": ["src/**/*.ts", "src/**/*.tsx"]
+}

package/__fixtures__/4.vite-app.user-card/input/vite.config.ts

@@ -0,0 +1,23 @@
+import {defineConfig} from 'vite';
+import {resolve} from 'node:path';
+import react from '@vitejs/plugin-react';
+import {xydSourceReactRuntime} from '@xyd-js/source-react-runtime';
+
+export default defineConfig({
+    plugins: [
+        xydSourceReactRuntime(),
+        react({jsxRuntime: 'automatic'}),
+    ],
+    build: {
+        lib: {
+            entry: 'src/index.ts',
+            formats: ['es'],
+            fileName: 'index',
+        },
+        rollupOptions: {
+            external: ['react', 'react/jsx-runtime', 'react/jsx-dev-runtime', 'react-dom'],
+        },
+        minify: false,
+        sourcemap: false,
+    },
+});

package/__fixtures__/4.vite-app.user-card/output.js

@@ -0,0 +1,10 @@
+// === index.js ===
+import { jsxs, jsx } from "react/jsx-runtime";
+function UserCard(props) {
+  return jsxs("div", { children: [props.avatarUrl && jsx("img", { src: props.avatarUrl, alt: props.name }), jsx("h3", { children: props.name }), jsx("p", { children: props.email }), props.role && jsx("span", { children: props.role })] });
+}
+UserCard.__xydUniform = JSON.parse(`{"title":"UserCard","canonical":"","description":"","definitions":[{"title":"Props","properties":[{"name":"name","type":"string","description":"Full name of the user","meta":[{"name":"required","value":"true"}]},{"name":"email","type":"string","description":"Email address of the user","meta":[{"name":"required","value":"true"}]},{"name":"avatarUrl","type":"string","description":"URL to the user's avatar image","meta":[]},{"name":"role","type":"$xor","description":"Role or title of the user","properties":[{"name":"role","type":"object","description":"","meta":[]},{"name":"role","type":"object","description":"","meta":[]},{"name":"role","type":"object","description":"","meta":[]}],"meta":[]},{"name":"loading","type":"boolean","description":"Whether the card is in a loading state","meta":[]}],"meta":[{"name":"type","value":"parameters"}]}],"examples":{"groups":[]}}`);
+export {
+  UserCard
+};
+

package/__fixtures__/5.rollup.user-card/input/package.json

@@ -0,0 +1,8 @@
+{
+  "name": "xyd-fixture-rt-5-rollup-user-card",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "build": "rollup -c rollup.config.mjs"
+  }
+}

package/__fixtures__/5.rollup.user-card/input/rollup.config.mjs

@@ -0,0 +1,20 @@
+import {resolve, dirname} from 'node:path';
+import {fileURLToPath} from 'node:url';
+import typescript from '@rollup/plugin-typescript';
+import {xydSourceReactRuntime} from '@xyd-js/source-react-runtime';
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+
+export default {
+    input: 'src/index.ts',
+    external: ['react', 'react/jsx-runtime', 'react/jsx-dev-runtime', 'react-dom'],
+    output: {
+        dir: 'dist',
+        format: 'es',
+        entryFileNames: 'index.js',
+    },
+    plugins: [
+        xydSourceReactRuntime(),
+        typescript({tsconfig: resolve(__dirname, 'tsconfig.json'), compilerOptions: {declaration: false}}),
+    ],
+};

package/__fixtures__/5.rollup.user-card/input/src/UserCard.tsx

@@ -0,0 +1,27 @@
+interface UserCardProps {
+    /** Full name of the user */
+    name: string;
+
+    /** Email address of the user */
+    email: string;
+
+    /** URL to the user's avatar image */
+    avatarUrl?: string;
+
+    /** Role or title of the user */
+    role?: "admin" | "editor" | "viewer";
+
+    /** Whether the card is in a loading state */
+    loading?: boolean;
+}
+
+export function UserCard(props: UserCardProps) {
+    return (
+        <div>
+            {props.avatarUrl && <img src={props.avatarUrl} alt={props.name} />}
+            <h3>{props.name}</h3>
+            <p>{props.email}</p>
+            {props.role && <span>{props.role}</span>}
+        </div>
+    );
+}

package/__fixtures__/5.rollup.user-card/input/src/index.ts

@@ -0,0 +1 @@
+export {UserCard} from './UserCard';

package/__fixtures__/5.rollup.user-card/input/tsconfig.json

@@ -0,0 +1,12 @@
+{
+  "compilerOptions": {
+    "outDir": "./dist",
+    "jsx": "react-jsx",
+    "skipLibCheck": true,
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "target": "ES2020",
+    "strict": true
+  },
+  "include": ["src/**/*.ts", "src/**/*.tsx"]
+}

package/__fixtures__/5.rollup.user-card/output.js

@@ -0,0 +1,11 @@
+// === index.js ===
+import { jsxs, jsx } from 'react/jsx-runtime';
+import 'typia';
+
+function UserCard(props) {
+    return (jsxs("div", { children: [props.avatarUrl && jsx("img", { src: props.avatarUrl, alt: props.name }), jsx("h3", { children: props.name }), jsx("p", { children: props.email }), props.role && jsx("span", { children: props.role })] }));
+}
+UserCard.__xydUniform = JSON.parse('{"title":"UserCard","canonical":"","description":"","definitions":[{"title":"Props","properties":[{"name":"name","type":"string","description":"Full name of the user","meta":[{"name":"required","value":"true"}]},{"name":"email","type":"string","description":"Email address of the user","meta":[{"name":"required","value":"true"}]},{"name":"avatarUrl","type":"string","description":"URL to the user\'s avatar image","meta":[]},{"name":"role","type":"$xor","description":"Role or title of the user","properties":[{"name":"role","type":"object","description":"","meta":[]},{"name":"role","type":"object","description":"","meta":[]},{"name":"role","type":"object","description":"","meta":[]}],"meta":[]},{"name":"loading","type":"boolean","description":"Whether the card is in a loading state","meta":[]}],"meta":[{"name":"type","value":"parameters"}]}],"examples":{"groups":[]}}');
+
+export { UserCard };
+

package/__fixtures__/6.esbuild.user-card/input/esbuild.config.mjs

@@ -0,0 +1,19 @@
+import {resolve, dirname} from 'node:path';
+import {fileURLToPath} from 'node:url';
+import * as esbuild from 'esbuild';
+import {xydSourceReactRuntimeEsbuild} from '@xyd-js/source-react-runtime/esbuild';
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+
+await esbuild.build({
+    entryPoints: [resolve(__dirname, 'src/index.ts')],
+    outfile: resolve(__dirname, 'dist/index.js'),
+    bundle: true,
+    format: 'esm',
+    platform: 'browser',
+    external: ['react', 'react/jsx-runtime', 'react/jsx-dev-runtime', 'react-dom'],
+    minify: false,
+    plugins: [
+        xydSourceReactRuntimeEsbuild(),
+    ],
+});

package/__fixtures__/6.esbuild.user-card/input/package.json

@@ -0,0 +1,8 @@
+{
+  "name": "xyd-fixture-rt-6-esbuild-user-card",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "build": "node esbuild.config.mjs"
+  }
+}

package/__fixtures__/6.esbuild.user-card/input/src/UserCard.tsx

@@ -0,0 +1,27 @@
+interface UserCardProps {
+    /** Full name of the user */
+    name: string;
+
+    /** Email address of the user */
+    email: string;
+
+    /** URL to the user's avatar image */
+    avatarUrl?: string;
+
+    /** Role or title of the user */
+    role?: "admin" | "editor" | "viewer";
+
+    /** Whether the card is in a loading state */
+    loading?: boolean;
+}
+
+export function UserCard(props: UserCardProps) {
+    return (
+        <div>
+            {props.avatarUrl && <img src={props.avatarUrl} alt={props.name} />}
+            <h3>{props.name}</h3>
+            <p>{props.email}</p>
+            {props.role && <span>{props.role}</span>}
+        </div>
+    );
+}

package/__fixtures__/6.esbuild.user-card/input/src/index.ts

@@ -0,0 +1 @@
+export {UserCard} from './UserCard';

package/__fixtures__/6.esbuild.user-card/input/tsconfig.json

@@ -0,0 +1,12 @@
+{
+  "compilerOptions": {
+    "outDir": "./dist",
+    "jsx": "react-jsx",
+    "skipLibCheck": true,
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "target": "ES2020",
+    "strict": true
+  },
+  "include": ["src/**/*.ts", "src/**/*.tsx"]
+}

package/__fixtures__/6.esbuild.user-card/output.js

@@ -0,0 +1,11 @@
+// === index.js ===
+// src/UserCard.tsx
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+function UserCard(props) {
+  return _jsxs("div", { children: [props.avatarUrl && _jsx("img", { src: props.avatarUrl, alt: props.name }), _jsx("h3", { children: props.name }), _jsx("p", { children: props.email }), props.role && _jsx("span", { children: props.role })] });
+}
+UserCard.__xydUniform = JSON.parse(`{"title":"UserCard","canonical":"","description":"","definitions":[{"title":"Props","properties":[{"name":"name","type":"string","description":"Full name of the user","meta":[{"name":"required","value":"true"}]},{"name":"email","type":"string","description":"Email address of the user","meta":[{"name":"required","value":"true"}]},{"name":"avatarUrl","type":"string","description":"URL to the user's avatar image","meta":[]},{"name":"role","type":"$xor","description":"Role or title of the user","properties":[{"name":"role","type":"object","description":"","meta":[]},{"name":"role","type":"object","description":"","meta":[]},{"name":"role","type":"object","description":"","meta":[]}],"meta":[]},{"name":"loading","type":"boolean","description":"Whether the card is in a loading state","meta":[]}],"meta":[{"name":"type","value":"parameters"}]}],"examples":{"groups":[]}}`);
+export {
+  UserCard
+};
+

package/__fixtures__/7.react-router.app/input/app/components/ProductCard.tsx

@@ -0,0 +1,26 @@
+import { Link } from "react-router";
+import type { Product } from "../types/product";
+
+interface ProductCardProps {
+    product: Product;
+    onAddToCart: (productId: string) => void;
+    layout?: "grid" | "list";
+}
+
+export function ProductCard({ product, onAddToCart, layout = "grid" }: ProductCardProps) {
+    return (
+        <div className={`product-card product-card--${layout}`}>
+            <Link to={`/products/${product.id}`}>
+                <h3>{product.name}</h3>
+            </Link>
+            <span>${product.price}</span>
+            <button
+                type="button"
+                disabled={!product.inStock}
+                onClick={() => onAddToCart(product.id)}
+            >
+                {product.inStock ? "Add to Cart" : "Out of Stock"}
+            </button>
+        </div>
+    );
+}

package/__fixtures__/7.react-router.app/input/app/entry.server.tsx

@@ -0,0 +1,36 @@
+import { PassThrough } from "node:stream";
+import { createReadableStreamFromReadable } from "@react-router/node";
+import { ServerRouter } from "react-router";
+import { renderToPipeableStream } from "react-dom/server";
+import type { EntryContext } from "react-router";
+
+export default function handleRequest(
+    request: Request,
+    responseStatusCode: number,
+    responseHeaders: Headers,
+    routerContext: EntryContext,
+) {
+    return new Promise((resolve, reject) => {
+        const { pipe } = renderToPipeableStream(
+            <ServerRouter context={routerContext} url={request.url} />,
+            {
+                onShellReady() {
+                    const body = new PassThrough();
+                    const stream = createReadableStreamFromReadable(body);
+
+                    responseHeaders.set("Content-Type", "text/html");
+                    resolve(
+                        new Response(stream, {
+                            headers: responseHeaders,
+                            status: responseStatusCode,
+                        }),
+                    );
+                    pipe(body);
+                },
+                onShellError(error: unknown) {
+                    reject(error);
+                },
+            },
+        );
+    });
+}

package/__fixtures__/7.react-router.app/input/app/root.tsx

@@ -0,0 +1,23 @@
+import { Links, Meta, Outlet, Scripts, ScrollRestoration } from "react-router";
+
+export function Layout({ children }: { children: React.ReactNode }) {
+    return (
+        <html lang="en">
+            <head>
+                <meta charSet="utf-8" />
+                <meta name="viewport" content="width=device-width, initial-scale=1" />
+                <Meta />
+                <Links />
+            </head>
+            <body>
+                {children}
+                <ScrollRestoration />
+                <Scripts />
+            </body>
+        </html>
+    );
+}
+
+export default function Root() {
+    return <Outlet />;
+}

package/__fixtures__/7.react-router.app/input/app/routes/cart.tsx

@@ -0,0 +1,16 @@
+import { Link } from "react-router";
+import type { CartItem } from "../types/product";
+
+interface CartRouteProps {
+    items: CartItem[];
+    onRemove: (productId: string) => void;
+}
+
+export default function CartRoute() {
+    return (
+        <div>
+            <h1>Cart</h1>
+            <Link to="/">Continue Shopping</Link>
+        </div>
+    );
+}