@ttsc/playground 0.22.0 → 0.24.0

package/lib/src/react/PlaygroundShell.js

@@ -5,6 +5,7 @@ exports.PlaygroundShell = PlaygroundShell;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const lz_string_1 = require("lz-string");
 const react_1 = require("react");
+const normalizeError_1 = require("../compiler/normalizeError");
 const BUILT_IN_PLAYGROUND_PACKAGES_1 = require("../npm/BUILT_IN_PLAYGROUND_PACKAGES");
 const collectExternalPackageNames_1 = require("../npm/collectExternalPackageNames");
 const installPlaygroundDependencies_1 = require("../npm/installPlaygroundDependencies");
@@ -18,6 +19,9 @@ const OptionsPanel_1 = require("./OptionsPanel");
 const ResultViewer_1 = require("./ResultViewer");
 const SourceEditor_1 = require("./SourceEditor");
 const createCompilerClient_1 = require("./createCompilerClient");
+const PlaygroundCompilerLifecycle_1 = require("./internal/PlaygroundCompilerLifecycle");
+const PlaygroundExecutionLifecycle_1 = require("./internal/PlaygroundExecutionLifecycle");
+const recoverTerminalCompilerWorker_1 = require("./internal/recoverTerminalCompilerWorker");
 const DEFAULT_OPTIONS = {
     typia: true,
     lint: true,
@@ -48,8 +52,9 @@ function PlaygroundShell({ workerUrl, defaultScript, examples = [], exampleGroup
     const debounce = (0, react_1.useRef)(null);
     const shareToastTimer = (0, react_1.useRef)(null);
     const dependencyProgressTimer = (0, react_1.useRef)(null);
-    const dependencyInstallChain = (0, react_1.useRef)(Promise.resolve());
     const dependencyAbort = (0, react_1.useRef)(null);
+    const compilerLifecycle = (0, react_1.useRef)(new PlaygroundCompilerLifecycle_1.PlaygroundCompilerLifecycle());
+    const executionLifecycle = (0, react_1.useRef)(new PlaygroundExecutionLifecycle_1.PlaygroundExecutionLifecycle());
     // Exact mounted identities and active requests. A name-only set cannot
     // validate a later transitive range or distinguish an npm alias target.
     const installedDependencies = (0, react_1.useRef)(new Map());
@@ -64,37 +69,80 @@ function PlaygroundShell({ workerUrl, defaultScript, examples = [], exampleGroup
     const runtimeDependencyFiles = (0, react_1.useRef)({});
     const sourceVersion = (0, react_1.useRef)(0);
     const latestSource = (0, react_1.useRef)(source);
-    // Race guards: each pipeline (compile/run vs Execute) owns its own epoch.
-    // Sharing one epoch would make a fresh Execute click invalidate an in-
-    // flight compile (and vice versa) and leave the spinner/button flags
-    // stuck because the older pipeline's finally would see a stale epoch.
-    // `updateSource` bumps the COMPILE epoch only — typing aborts a stale
-    // compile but does not interrupt a click-driven Execute.
+    // Compile/run uses an epoch, while Execute uses an abortable lifecycle.
+    // The boundaries stay separate so starting Execute does not invalidate an
+    // in-flight compile. Source and option changes explicitly invalidate both
+    // pipelines because either makes an older result obsolete.
     const compileEpoch = (0, react_1.useRef)(0);
-    const executeEpoch = (0, react_1.useRef)(0);
-    // Retry epoch: each Retry click bumps it; only the latest retry's
-    // async block is allowed to write boot state. Prior retries' bodies
-    // bail on epoch mismatch so a fast double-Retry can't leave a stale
-    // `setBootPhase("ready")` chasing a torn-down connection.
-    const retryEpoch = (0, react_1.useRef)(0);
     const mergedExtraLibs = (0, react_1.useMemo)(() => ({ ...staticEditorLibs, ...editorExtraLibs }), [staticEditorLibs, editorExtraLibs]);
+    const clearDependencyGraph = (0, react_1.useCallback)((publishEditorLibs = true) => {
+        installedDependencies.current = new Map();
+        dependencyRoots.current = new Set();
+        runtimeDependencyFiles.current = {};
+        if (publishEditorLibs)
+            setEditorExtraLibs({});
+    }, []);
+    const invalidateCompilerGeneration = (0, react_1.useCallback)((reason, expected, publishState = true) => {
+        const replacement = expected === undefined
+            ? compilerLifecycle.current.invalidate()
+            : compilerLifecycle.current.invalidateIfCurrent(expected);
+        if (replacement === undefined)
+            return undefined;
+        compileEpoch.current++;
+        executionLifecycle.current.invalidate(reason);
+        const abort = dependencyAbort.current;
+        dependencyAbort.current = null;
+        abort?.abort(createAbortError(reason));
+        if (dependencyProgressTimer.current !== null) {
+            window.clearTimeout(dependencyProgressTimer.current);
+            dependencyProgressTimer.current = null;
+        }
+        clearDependencyGraph(publishState);
+        if (publishState) {
+            setDependencyProgress(null);
+            setDependencyPackageNames([]);
+            setRunning(false);
+            setExecuting(false);
+            setBundleError(null);
+            setBootError(null);
+            setBootPhase("booting");
+        }
+        return replacement;
+    }, [clearDependencyGraph]);
+    const recoverTerminalWorker = (0, react_1.useCallback)((error, generation) => {
+        let replacement;
+        return (0, recoverTerminalCompilerWorker_1.recoverTerminalCompilerWorker)(error, {
+            claim: () => {
+                replacement = invalidateCompilerGeneration("compiler Worker replacement required", generation);
+                return replacement !== undefined;
+            },
+            reset: client.reset,
+            fail: (terminalError) => {
+                if (replacement?.isCurrent() !== true)
+                    return;
+                setBootError(terminalError);
+                setBootPhase("failed");
+            },
+        });
+    }, [client, invalidateCompilerGeneration]);
     const updateSource = (0, react_1.useCallback)((next) => {
         sourceVersion.current++;
         latestSource.current = next;
-        // Bump BOTH epochs: typing must abort an in-flight compile (the
-        // result would be stale) AND an in-flight Execute (the bundled code
-        // would not match what's on screen). Without bumping executeEpoch,
-        // an Execute whose dependency install was aborted by this typing
-        // would silently treat the abort as success and bundle against an
-        // incomplete MemFS — emitting JS for packages the user just edited
-        // away from, or failing in confusing ways.
+        // Typing invalidates both the compile result and any click-driven Execute.
         compileEpoch.current++;
-        executeEpoch.current++;
+        executionLifecycle.current.invalidate("source changed");
         dependencyAbort.current?.abort(createAbortError("source changed"));
+        setExecuting(false);
         setDependencyProgress(null);
         setDependencyPackageNames([]);
         setSource(next);
     }, []);
+    const updateOptions = (0, react_1.useCallback)((next) => {
+        compileEpoch.current++;
+        executionLifecycle.current.invalidate("compiler options changed");
+        setExecuting(false);
+        setOptions(next);
+    }, []);
     // ── Decode source from URL on mount ──
     (0, react_1.useEffect)(() => {
         const params = new URLSearchParams(window.location.search);
@@ -107,15 +155,27 @@ function PlaygroundShell({ workerUrl, defaultScript, examples = [], exampleGroup
             }
         }
     }, [updateSource]);
+    // Establish a generation boundary before any boot work starts. Cleanup
+    // fences every callback that captured the old client before resetting it.
+    (0, react_1.useEffect)(() => {
+        invalidateCompilerGeneration("compiler client changed");
+        return () => {
+            // Internal recovery may have replaced the generation captured at setup,
+            // but every such replacement still belongs to this client.
+            invalidateCompilerGeneration("compiler client disposed", undefined, false);
+            void client.reset();
+        };
+    }, [client, invalidateCompilerGeneration]);
     // ── Eagerly boot the worker so first compile is instant ──
     (0, react_1.useEffect)(() => {
         let cancelled = false;
+        const generation = compilerLifecycle.current.capture();
         setBootPhase("booting");
         createCompilerService().then(() => {
-            if (!cancelled)
+            if (!cancelled && generation.isCurrent())
                 setBootPhase("ready");
         }, (err) => {
-            if (!cancelled) {
+            if (!cancelled && generation.isCurrent()) {
                 setBootError(err);
                 setBootPhase("failed");
             }
@@ -125,13 +185,17 @@ function PlaygroundShell({ workerUrl, defaultScript, examples = [], exampleGroup
         };
     }, [createCompilerService]);
     const installDependenciesForSource = (0, react_1.useCallback)(async (input, version = sourceVersion.current) => {
-        const task = dependencyInstallChain.current.then(async () => {
+        const result = await compilerLifecycle.current.enqueue(async (generation) => {
+            const isCurrent = () => generation.isCurrent() && sourceVersion.current === version;
+            const resetWorker = () => compilerLifecycle.current.resetWorkerIfCurrent(generation, client.reset, clearDependencyGraph);
+            if (!isCurrent())
+                return null;
             const firstPassPackageNames = (0, collectExternalPackageNames_1.collectExternalPackageNames)(input, preinstalledPackages);
             if (dependencyRootDelta(firstPassPackageNames, dependencyRoots.current)
                 .changed === false)
                 return null;
             await wait(DEPENDENCY_INSTALL_QUIET_MS);
-            if (sourceVersion.current !== version)
+            if (!isCurrent())
                 return null;
             const packageNames = (0, collectExternalPackageNames_1.collectExternalPackageNames)(latestSource.current, preinstalledPackages);
             const delta = dependencyRootDelta(packageNames, dependencyRoots.current);
@@ -143,6 +207,8 @@ function PlaygroundShell({ workerUrl, defaultScript, examples = [], exampleGroup
                 window.clearTimeout(dependencyProgressTimer.current);
                 dependencyProgressTimer.current = null;
             }
+            if (!isCurrent())
+                return null;
             setDependencyPackageNames(requested);
             const abort = new AbortController();
             dependencyAbort.current = abort;
@@ -154,28 +220,36 @@ function PlaygroundShell({ workerUrl, defaultScript, examples = [], exampleGroup
                         : installedDependencies.current.values(),
                     ignoredPackages: preinstalledPackages,
                     signal: abort.signal,
-                    onProgress: setDependencyProgress,
+                    onProgress: (progress) => {
+                        if (isCurrent())
+                            setDependencyProgress(progress);
+                    },
                 });
-                if (sourceVersion.current !== version)
+                if (!isCurrent())
                     return null;
                 if (replacing) {
                     workerMutated = true;
-                    await client.reset();
-                    installedDependencies.current = new Map();
-                    dependencyRoots.current = new Set();
-                    runtimeDependencyFiles.current = {};
-                    setEditorExtraLibs({});
+                    if (!(await resetWorker()))
+                        return null;
+                    if (!isCurrent())
+                        return null;
                 }
                 if (Object.keys(installed.compilerFiles).length > 0) {
+                    if (!isCurrent())
+                        return null;
                     const service = await createCompilerService();
+                    if (!isCurrent())
+                        return null;
                     workerMutated = true;
-                    await service.installDependencies({
+                    const installedForSource = await compilerLifecycle.current.mutateWorkerIfCurrent(generation, () => sourceVersion.current === version, () => service.installDependencies({
                         files: installed.compilerFiles,
                         packages: installed.packages.map(({ name, version }) => ({
                             name,
                             version,
                         })),
-                    });
+                    }), client.reset, clearDependencyGraph);
+                    if (!installedForSource)
+                        return null;
                 }
                 installedDependencies.current = new Map(installed.resolvedDependencies.map((dependency) => [dependency.name, dependency]));
                 dependencyRoots.current = new Set(packageNames);
@@ -188,21 +262,26 @@ function PlaygroundShell({ workerUrl, defaultScript, examples = [], exampleGroup
                         ...runtimeDependencyFiles.current,
                         ...installed.runtimeFiles,
                     };
-                dependencyProgressTimer.current = window.setTimeout(() => {
-                    setDependencyProgress(null);
-                    setDependencyPackageNames([]);
-                    dependencyProgressTimer.current = null;
+                const progressTimer = window.setTimeout(() => {
+                    if (dependencyProgressTimer.current === progressTimer &&
+                        generation.isCurrent()) {
+                        setDependencyProgress(null);
+                        setDependencyPackageNames([]);
+                        dependencyProgressTimer.current = null;
+                    }
                 }, 350);
+                dependencyProgressTimer.current = progressTimer;
                 return null;
             }
             catch (error) {
+                if (!generation.isCurrent())
+                    return null;
                 if (workerMutated) {
-                    await client.reset();
-                    installedDependencies.current = new Map();
-                    dependencyRoots.current = new Set();
-                    runtimeDependencyFiles.current = {};
-                    setEditorExtraLibs({});
+                    if (!(await resetWorker()))
+                        return null;
                 }
+                if (!isCurrent())
+                    return null;
                 if (isAbortError(error)) {
                     setDependencyProgress(null);
                     setDependencyPackageNames([]);
@@ -215,11 +294,15 @@ function PlaygroundShell({ workerUrl, defaultScript, examples = [], exampleGroup
                     total: requested.length,
                     message: describeUnknownError(error),
                 });
-                dependencyProgressTimer.current = window.setTimeout(() => {
-                    setDependencyProgress(null);
-                    setDependencyPackageNames([]);
-                    dependencyProgressTimer.current = null;
+                const progressTimer = window.setTimeout(() => {
+                    if (dependencyProgressTimer.current === progressTimer &&
+                        generation.isCurrent()) {
+                        setDependencyProgress(null);
+                        setDependencyPackageNames([]);
+                        dependencyProgressTimer.current = null;
+                    }
                 }, 2400);
+                dependencyProgressTimer.current = progressTimer;
                 return error;
             }
             finally {
@@ -227,9 +310,13 @@ function PlaygroundShell({ workerUrl, defaultScript, examples = [], exampleGroup
                     dependencyAbort.current = null;
             }
         });
-        dependencyInstallChain.current = task.then(() => { });
-        return task;
-    }, [client, createCompilerService, preinstalledPackages]);
+        return result ?? null;
+    }, [
+        clearDependencyGraph,
+        client,
+        createCompilerService,
+        preinstalledPackages,
+    ]);
     // ── Run compile when source / options change ──
     //
     // `target` (the active tab) is intentionally NOT a trigger here: the
@@ -239,32 +326,40 @@ function PlaygroundShell({ workerUrl, defaultScript, examples = [], exampleGroup
     // click would burn multiple seconds of work per click.
     const run = (0, react_1.useCallback)(async (input, opts, version) => {
         const epoch = ++compileEpoch.current;
+        const generation = compilerLifecycle.current.capture();
         setRunning(true);
         try {
             const dependencyError = await installDependenciesForSource(input, version);
-            if (compileEpoch.current !== epoch)
+            if (compileEpoch.current !== epoch || !generation.isCurrent())
                 return;
             if (dependencyError) {
+                if (await recoverTerminalWorker(dependencyError, generation))
+                    return;
                 setResult({
                     type: "error",
                     target: "javascript",
-                    value: normalizeClientError(dependencyError),
+                    value: (0, normalizeError_1.normalizeError)(dependencyError),
                 });
                 // Keep prior lintDiagnostics intact — a dependency-install blip
                 // shouldn't wipe the user's most recent successful lint output.
                 return;
             }
             const service = await createCompilerService();
+            if (compileEpoch.current !== epoch || !generation.isCurrent())
+                return;
             const next = await service.compile({
                 source: input,
                 options: opts,
             });
-            if (compileEpoch.current !== epoch)
+            if (compileEpoch.current !== epoch || !generation.isCurrent())
+                return;
+            if (next.type === "error" &&
+                (await recoverTerminalWorker(next.value, generation)))
                 return;
             setResult(next);
             if (opts.lint !== false) {
                 const lint = await service.lint({ source: input, options: opts });
-                if (compileEpoch.current !== epoch)
+                if (compileEpoch.current !== epoch || !generation.isCurrent())
                     return;
                 setLintDiagnostics(lint.diagnostics);
             }
@@ -273,7 +368,9 @@ function PlaygroundShell({ workerUrl, defaultScript, examples = [], exampleGroup
             }
         }
         catch (err) {
-            if (compileEpoch.current !== epoch)
+            if (compileEpoch.current !== epoch || !generation.isCurrent())
+                return;
+            if (await recoverTerminalWorker(err, generation))
                 return;
             // Surface the error in the diagnostics pane via an error result —
             // a transient compile/lint/install rejection (tgrid timeout,
@@ -283,7 +380,7 @@ function PlaygroundShell({ workerUrl, defaultScript, examples = [], exampleGroup
             setResult({
                 type: "error",
                 target: "javascript",
-                value: normalizeClientError(err),
+                value: (0, normalizeError_1.normalizeError)(err),
             });
             // Leave lintDiagnostics alone — clearing them on a transient
             // compile blip would wipe the user's last good lint output.
@@ -292,13 +389,16 @@ function PlaygroundShell({ workerUrl, defaultScript, examples = [], exampleGroup
             // Only the winning epoch clears the flag. Older pipelines that
             // returned early on an epoch mismatch must NOT clear running, or
             // a fresh in-flight compile would show "ready" while it's still
-            // working. compileEpoch is bumped only by updateSource and by the
-            // next run() — Execute uses its own executeEpoch — so this guard
-            // does not stick the spinner across pipeline boundaries.
+            // working. Execute has its own lifecycle, so it cannot stick this
+            // spinner across pipeline boundaries.
             if (compileEpoch.current === epoch)
                 setRunning(false);
         }
-    }, [createCompilerService, installDependenciesForSource]);
+    }, [
+        createCompilerService,
+        installDependenciesForSource,
+        recoverTerminalWorker,
+    ]);
     (0, react_1.useEffect)(() => {
         if (bootPhase !== "ready")
             return;
@@ -342,24 +442,8 @@ function PlaygroundShell({ workerUrl, defaultScript, examples = [], exampleGroup
         if (dependencyProgressTimer.current !== null)
             window.clearTimeout(dependencyProgressTimer.current);
         dependencyAbort.current?.abort(createAbortError("playground unmounted"));
+        executionLifecycle.current.invalidate("playground unmounted");
     }, []);
-    // Tear down the Worker (+ its wasm instance) when the component
-    // unmounts or workerUrl changes. Without this an SPA navigation away
-    // from the playground leaks one Worker per mount; a workerUrl swap
-    // leaks the previous Worker forever.
-    //
-    // Reset the dependency graph too. Its exact versions, requests, roots, and
-    // runtime files describe only the worker generation that is being closed.
-    //
-    (0, react_1.useEffect)(() => {
-        setEditorExtraLibs({});
-        return () => {
-            void client.reset();
-            installedDependencies.current = new Map();
-            dependencyRoots.current = new Set();
-            runtimeDependencyFiles.current = {};
-        };
-    }, [client]);
     const onPickExample = (0, react_1.useCallback)((id) => {
         const example = examples.find((e) => e.id === id);
         if (example) {
@@ -374,10 +458,8 @@ function PlaygroundShell({ workerUrl, defaultScript, examples = [], exampleGroup
     const onExecute = (0, react_1.useCallback)(async () => {
         if (!executeBundle)
             return;
-        // Bump the executeEpoch so a second Execute click invalidates the
-        // in-flight Execute. compileEpoch is unaffected — the user can edit
-        // the source mid-Execute without the running compile being torn down.
-        const epoch = ++executeEpoch.current;
+        const attempt = executionLifecycle.current.begin();
+        const generation = compilerLifecycle.current.capture();
         setExecuting(true);
         setBundleError(null);
         // Clear the previous run's console output up front. Without this the
@@ -388,7 +470,7 @@ function PlaygroundShell({ workerUrl, defaultScript, examples = [], exampleGroup
         setConsoleMessages([]);
         const messages = [];
         const push = (type, args) => {
-            if (executeEpoch.current !== epoch)
+            if (!attempt.isCurrent() || !generation.isCurrent())
                 return;
             messages.push({ type, value: args });
             setConsoleMessages([...messages]);
@@ -403,20 +485,26 @@ function PlaygroundShell({ workerUrl, defaultScript, examples = [], exampleGroup
             const currentSource = latestSource.current;
             const currentVersion = sourceVersion.current;
             const dependencyError = await installDependenciesForSource(currentSource, currentVersion);
-            if (executeEpoch.current !== epoch)
+            if (!attempt.isCurrent() || !generation.isCurrent())
                 return;
             if (dependencyError) {
+                if (await recoverTerminalWorker(dependencyError, generation))
+                    return;
                 push("error", [dependencyError]);
                 return;
             }
             const service = await createCompilerService();
+            if (!attempt.isCurrent() || !generation.isCurrent())
+                return;
             const compiled = await service.bundle({
                 source: currentSource,
                 options,
             });
-            if (executeEpoch.current !== epoch)
+            if (!attempt.isCurrent() || !generation.isCurrent())
                 return;
             if (compiled.type === "error") {
+                if (await recoverTerminalWorker(compiled.value, generation))
+                    return;
                 const message = typeof compiled.value === "string"
                     ? compiled.value
                     : (compiled.value?.message ??
@@ -439,22 +527,24 @@ function PlaygroundShell({ workerUrl, defaultScript, examples = [], exampleGroup
                 await executeBundle(code, {
                     console: sandboxConsole,
                     runtimeFiles: runtimeDependencyFiles.current,
+                    signal: attempt.signal,
                 });
+                if (!generation.isCurrent())
+                    return;
             }
             catch (error) {
                 push("error", [error]);
             }
         }
         catch (error) {
-            if (executeEpoch.current !== epoch)
+            if (!attempt.isCurrent() || !generation.isCurrent())
+                return;
+            if (await recoverTerminalWorker(error, generation))
                 return;
             push("error", [error]);
         }
         finally {
-            // Only the winning epoch clears the flag — same rationale as
-            // compileEpoch above. With a separate executeEpoch this is robust
-            // against concurrent click + edit interleavings.
-            if (executeEpoch.current === epoch)
+            if (attempt.finish())
                 setExecuting(false);
         }
         // `source` is intentionally NOT a dep: the body snapshots
@@ -467,6 +557,7 @@ function PlaygroundShell({ workerUrl, defaultScript, examples = [], exampleGroup
         executeBundle,
         installDependenciesForSource,
         options,
+        recoverTerminalWorker,
     ]);
     const allDiagnostics = (0, react_1.useMemo)(() => {
         const fromCompile = [];
@@ -534,25 +625,22 @@ function PlaygroundShell({ workerUrl, defaultScript, examples = [], exampleGroup
                             return String(e);
                         }
                     })() }), (0, jsx_runtime_1.jsx)("button", { onClick: () => {
-                        // Each click bumps retryEpoch; only the latest retry's body
-                        // writes boot state. A double-click cancels the prior retry's
-                        // pending writes so it can't flip bootPhase to "ready"
-                        // against a connection the new retry has already torn down.
-                        const epoch = ++retryEpoch.current;
+                        const failedGeneration = compilerLifecycle.current.capture();
+                        const retryGeneration = invalidateCompilerGeneration("compiler retry requested", failedGeneration);
+                        if (retryGeneration === undefined)
+                            return;
                         void (async () => {
                             await client.reset();
-                            if (retryEpoch.current !== epoch)
+                            if (!retryGeneration.isCurrent())
                                 return;
-                            setBootError(null);
-                            setBootPhase("booting");
                             try {
                                 await createCompilerService();
-                                if (retryEpoch.current !== epoch)
+                                if (!retryGeneration.isCurrent())
                                     return;
                                 setBootPhase("ready");
                             }
                             catch (err) {
-                                if (retryEpoch.current !== epoch)
+                                if (!retryGeneration.isCurrent())
                                     return;
                                 setBootError(err);
                                 setBootPhase("failed");
@@ -572,7 +660,7 @@ function PlaygroundShell({ workerUrl, defaultScript, examples = [], exampleGroup
                                         : result.type === "error"
                                             ? (JSON.stringify(result.value, null, 2) ??
                                                 String(result.value))
-                                            : result.value })) })] })] }), bundleError && ((0, jsx_runtime_1.jsxs)("div", { className: "shrink-0 border-t border-red-300 bg-red-50 px-4 py-1.5 font-mono text-[11px] text-red-700", children: ["Bundle failed \u2014 ", bundleError] })), executeBundle && ((0, jsx_runtime_1.jsxs)("div", { className: "flex h-48 shrink-0 flex-col border-t border-[#c7dff4] bg-[#f7fbff]", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between border-b border-[#d8e7f4] px-4 py-1.5", children: [(0, jsx_runtime_1.jsx)("span", { className: "font-mono text-[11px] text-slate-500", children: "console output" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [consoleMessages.length > 0 && ((0, jsx_runtime_1.jsx)("button", { onClick: () => setConsoleMessages([]), className: "px-2 py-1 font-mono text-[10px] text-slate-500 transition-colors hover:text-[#235a97]", children: "Clear" })), (0, jsx_runtime_1.jsxs)("button", { onClick: onExecute, disabled: executing, className: "rounded-md bg-[#3178c6] px-3 py-1 font-mono text-[11px] text-white transition-colors hover:bg-[#235a97] disabled:opacity-50", title: "Cmd/Ctrl+Enter", children: ["\u25B6 ", executing ? "Executing…" : "Execute"] })] })] }), (0, jsx_runtime_1.jsx)("div", { className: "flex-1 min-h-0", children: (0, jsx_runtime_1.jsx)(ConsoleViewer_1.ConsoleViewer, { messages: consoleMessages }) })] })), (0, jsx_runtime_1.jsx)(DiagnosticsPanel_1.DiagnosticsPanel, { diagnostics: allDiagnostics }), optionsOpen && ((0, jsx_runtime_1.jsx)(OptionsPanel_1.OptionsPanel, { options: options, onChange: setOptions, onClose: () => setOptionsOpen(false), toggles: optionToggles })), (0, jsx_runtime_1.jsx)(DependencyProgressModal_1.DependencyProgressModal, { progress: dependencyProgress, packages: dependencyPackageNames })] }));
+                                            : result.value })) })] })] }), bundleError && ((0, jsx_runtime_1.jsxs)("div", { className: "shrink-0 border-t border-red-300 bg-red-50 px-4 py-1.5 font-mono text-[11px] text-red-700", children: ["Bundle failed \u2014 ", bundleError] })), executeBundle && ((0, jsx_runtime_1.jsxs)("div", { className: "flex h-48 shrink-0 flex-col border-t border-[#c7dff4] bg-[#f7fbff]", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between border-b border-[#d8e7f4] px-4 py-1.5", children: [(0, jsx_runtime_1.jsx)("span", { className: "font-mono text-[11px] text-slate-500", children: "console output" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [consoleMessages.length > 0 && ((0, jsx_runtime_1.jsx)("button", { onClick: () => setConsoleMessages([]), className: "px-2 py-1 font-mono text-[10px] text-slate-500 transition-colors hover:text-[#235a97]", children: "Clear" })), (0, jsx_runtime_1.jsxs)("button", { onClick: onExecute, disabled: executing, className: "rounded-md bg-[#3178c6] px-3 py-1 font-mono text-[11px] text-white transition-colors hover:bg-[#235a97] disabled:opacity-50", title: "Cmd/Ctrl+Enter", children: ["\u25B6 ", executing ? "Executing…" : "Execute"] })] })] }), (0, jsx_runtime_1.jsx)("div", { className: "flex-1 min-h-0", children: (0, jsx_runtime_1.jsx)(ConsoleViewer_1.ConsoleViewer, { messages: consoleMessages }) })] })), (0, jsx_runtime_1.jsx)(DiagnosticsPanel_1.DiagnosticsPanel, { diagnostics: allDiagnostics }), optionsOpen && ((0, jsx_runtime_1.jsx)(OptionsPanel_1.OptionsPanel, { options: options, onChange: updateOptions, onClose: () => setOptionsOpen(false), toggles: optionToggles })), (0, jsx_runtime_1.jsx)(DependencyProgressModal_1.DependencyProgressModal, { progress: dependencyProgress, packages: dependencyPackageNames })] }));
 }
 function defaultResultCaption(_options) {
     return "dist/playground.js";
@@ -587,12 +675,6 @@ function describeUnknownError(error) {
         return String(error);
     }
 }
-function normalizeClientError(error) {
-    if (error instanceof Error) {
-        return { name: error.name, message: error.message, stack: error.stack };
-    }
-    return { name: "Error", message: describeUnknownError(error) };
-}
 function wait(ms) {
     return new Promise((resolve) => window.setTimeout(resolve, ms));
 }