@flightdev/ui 2.0.0

package/dist/chunk-V34XPVGK.js

@@ -0,0 +1,103 @@
+import { BaseUIAdapter } from './chunk-2SNQ6PTM.js';
+
+// src/adapters/tier-2/mithril.ts
+var MithrilAdapter = class extends BaseUIAdapter {
+  constructor(options = {}) {
+    super();
+    this.options = options;
+  }
+  id = "mithril";
+  name = "Mithril";
+  framework = "mithril";
+  frameworkVersion = "2+";
+  tier = "tier-2";
+  capabilities = {
+    streaming: false,
+    partialHydration: false,
+    islands: false,
+    resumable: false,
+    ssg: true,
+    csr: true,
+    serverComponents: false
+  };
+  async renderToString(component, _context) {
+    const startTime = performance.now();
+    try {
+      const render = await import('mithril-node-render').then((m2) => m2.default || m2);
+      const m = await import('mithril').then((mod) => mod.default || mod);
+      const MithrilComponent = component.component;
+      const vnode = m(MithrilComponent, component.props ?? {});
+      const html = await render(vnode);
+      return {
+        html,
+        hydrationData: {
+          props: component.props,
+          componentId: component.id ?? this.generateId()
+        },
+        timing: this.createTiming(startTime)
+      };
+    } catch (error) {
+      const message = error instanceof Error ? error.message : String(error);
+      if (message.includes("Cannot find module 'mithril-node-render'")) {
+        throw new Error(
+          "[Flight/Mithril] Mithril SSR package not found.\nInstall required packages:\n  npm install mithril mithril-node-render\n  npm install -D @types/mithril"
+        );
+      }
+      throw error;
+    }
+  }
+  getHydrationScript(result) {
+    const data = this.serializeProps(result.hydrationData);
+    return `
+<script type="module">
+window.__FLIGHT_DATA__ = ${data};
+window.__FLIGHT_ADAPTER__ = 'mithril';
+
+import m from 'mithril';
+
+const App = window.__FLIGHT_APP__;
+const container = document.getElementById('app');
+
+if (App && container) {
+    // Mithril mounts and diffs against existing DOM
+    m.mount(container, {
+        view: () => m(App, window.__FLIGHT_DATA__.props)
+    });
+}
+</script>
+        `.trim();
+  }
+  getClientEntry() {
+    return `
+import m from 'mithril';
+
+export function hydrate() {
+    const container = document.getElementById('app');
+    const App = window.__FLIGHT_APP__;
+    const data = window.__FLIGHT_DATA__ ?? {};
+
+    if (!container || !App) {
+        console.warn('[Flight/Mithril] Missing container or App');
+        return;
+    }
+
+    // Mithril automatically diffs against existing DOM
+    m.mount(container, {
+        view: () => m(App, data.props)
+    });
+}
+
+export function render(App, container, props = {}) {
+    m.mount(container, {
+        view: () => m(App, props)
+    });
+}
+        `.trim();
+  }
+};
+function mithril(options) {
+  return new MithrilAdapter(options);
+}
+var mithril_default = mithril;
+
+export { MithrilAdapter, mithril, mithril_default };

package/dist/chunk-VK7ZPMO7.js

@@ -0,0 +1,221 @@
+import { BaseUIAdapter } from './chunk-2SNQ6PTM.js';
+
+// src/adapters/tier-1/react.ts
+var ReactAdapter = class extends BaseUIAdapter {
+  constructor(options = {}) {
+    super();
+    this.options = options;
+  }
+  id = "react";
+  name = "React";
+  framework = "react";
+  frameworkVersion = "18+";
+  tier = "tier-1";
+  capabilities = {
+    streaming: true,
+    partialHydration: true,
+    islands: true,
+    resumable: false,
+    // React 19 has some resumability features
+    ssg: true,
+    csr: true,
+    serverComponents: true
+  };
+  async renderToString(component, _context) {
+    const startTime = performance.now();
+    const { renderToString } = await import('react-dom/server');
+    const { createElement } = await import('react');
+    const element = createElement(
+      component.component,
+      component.props ?? {},
+      component.children
+    );
+    const html = renderToString(element);
+    return {
+      html,
+      hydrationData: {
+        props: component.props,
+        componentId: component.id ?? this.generateId()
+      },
+      timing: this.createTiming(startTime)
+    };
+  }
+  /**
+   * Render to stream using React 18+ streaming SSR.
+   * 
+   * Uses `renderToReadableStream` (Web Streams API) which works in:
+   * - Node.js 18+ (with Web Streams support)
+   * - Deno
+   * - Cloudflare Workers
+   * - Vercel Edge Runtime
+   * - Other edge runtimes
+   * 
+   * Falls back to `renderToPipeableStream` for Node.js environments
+   * that require traditional streams.
+   */
+  renderToStream(component, _context, options) {
+    let aborted = false;
+    let abortController = null;
+    let resolvePromise;
+    let rejectPromise;
+    const done = new Promise((resolve, reject) => {
+      resolvePromise = resolve;
+      rejectPromise = reject;
+    });
+    const stream = new ReadableStream({
+      start: async (controller) => {
+        try {
+          const { renderToReadableStream } = await import('react-dom/server');
+          const { createElement } = await import('react');
+          const element = createElement(
+            component.component,
+            component.props ?? {},
+            component.children
+          );
+          abortController = new AbortController();
+          const reactStream = await renderToReadableStream(element, {
+            signal: abortController.signal,
+            onError(error) {
+              const err = error instanceof Error ? error : new Error(String(error));
+              options?.onError?.(err);
+            }
+          });
+          options?.onShellReady?.();
+          const reader = reactStream.getReader();
+          const pump = async () => {
+            try {
+              while (true) {
+                if (aborted) {
+                  await reader.cancel();
+                  controller.close();
+                  resolvePromise();
+                  return;
+                }
+                const { done: readerDone, value } = await reader.read();
+                if (readerDone) {
+                  controller.close();
+                  options?.onAllReady?.();
+                  resolvePromise();
+                  return;
+                }
+                if (value) {
+                  controller.enqueue(value);
+                }
+              }
+            } catch (error) {
+              const err = error instanceof Error ? error : new Error(String(error));
+              options?.onError?.(err);
+              controller.error(err);
+              rejectPromise(err);
+            }
+          };
+          await pump();
+        } catch (error) {
+          const err = error instanceof Error ? error : new Error(String(error));
+          if (err.message.includes("renderToReadableStream")) {
+            await this.fallbackStreamRender(component, controller, options, resolvePromise, rejectPromise);
+            return;
+          }
+          options?.onShellError?.(err);
+          options?.onError?.(err);
+          controller.error(err);
+          rejectPromise(err);
+        }
+      }
+    });
+    return {
+      stream,
+      done,
+      abort: () => {
+        aborted = true;
+        abortController?.abort();
+        resolvePromise();
+      }
+    };
+  }
+  /**
+   * Fallback render for environments without Web Streams support.
+   * Uses renderToString and emits as a single chunk.
+   */
+  async fallbackStreamRender(component, controller, options, resolvePromise, rejectPromise) {
+    try {
+      const { renderToString } = await import('react-dom/server');
+      const { createElement } = await import('react');
+      const element = createElement(
+        component.component,
+        component.props ?? {},
+        component.children
+      );
+      options?.onShellReady?.();
+      const html = renderToString(element);
+      const encoded = new TextEncoder().encode(html);
+      controller.enqueue(encoded);
+      controller.close();
+      options?.onAllReady?.();
+      resolvePromise();
+    } catch (error) {
+      const err = error instanceof Error ? error : new Error(String(error));
+      options?.onError?.(err);
+      controller.error(err);
+      rejectPromise(err);
+    }
+  }
+  getHydrationScript(result) {
+    const data = this.serializeProps(result.hydrationData);
+    return `
+<script type="module">
+window.__FLIGHT_DATA__ = ${data};
+window.__FLIGHT_ADAPTER__ = 'react';
+
+import { hydrateRoot } from 'react-dom/client';
+
+const container = document.getElementById('app');
+const App = window.__FLIGHT_APP__;
+
+if (container && App) {
+    const { props } = window.__FLIGHT_DATA__;
+    import('react').then(({ createElement }) => {
+        hydrateRoot(container, createElement(App, props));
+    });
+}
+</script>
+        `.trim();
+  }
+  getClientEntry() {
+    return `
+import { hydrateRoot, createRoot } from 'react-dom/client';
+import { createElement } from 'react';
+
+export function hydrate() {
+    const container = document.getElementById('app');
+    const App = window.__FLIGHT_APP__;
+    const data = window.__FLIGHT_DATA__ ?? {};
+
+    if (!container || !App) {
+        console.warn('[Flight/React] Missing container or App');
+        return;
+    }
+
+    // Check if we have SSR content to hydrate
+    if (container.innerHTML.trim()) {
+        hydrateRoot(container, createElement(App, data.props));
+    } else {
+        // Fallback to client-side render
+        createRoot(container).render(createElement(App, data.props));
+    }
+}
+
+export function render(App, container, props = {}) {
+    const root = createRoot(container);
+    root.render(createElement(App, props));
+    return root;
+}
+        `.trim();
+  }
+};
+function react(options) {
+  return new ReactAdapter(options);
+}
+var react_default = react;
+
+export { ReactAdapter, react, react_default };

package/dist/chunk-X6CNUW6T.js

@@ -0,0 +1,136 @@
+import { BaseUIAdapter } from './chunk-2SNQ6PTM.js';
+
+// src/adapters/tier-1/svelte.ts
+var SvelteAdapter = class extends BaseUIAdapter {
+  constructor(options = {}) {
+    super();
+    this.options = options;
+  }
+  id = "svelte";
+  name = "Svelte";
+  framework = "svelte";
+  frameworkVersion = "5+";
+  tier = "tier-1";
+  capabilities = {
+    streaming: false,
+    // Svelte 5 doesn't have streaming SSR yet
+    partialHydration: true,
+    islands: true,
+    resumable: false,
+    ssg: true,
+    csr: true,
+    serverComponents: false
+  };
+  async renderToString(component, _context) {
+    const startTime = performance.now();
+    try {
+      const { render } = await import('svelte/server');
+      const SvelteComponent = component.component;
+      const { body, head } = render(SvelteComponent, {
+        props: component.props ?? {}
+      });
+      return {
+        html: body,
+        head,
+        hydrationData: {
+          props: component.props,
+          componentId: component.id ?? this.generateId()
+        },
+        css: this.options.extractCss ? void 0 : void 0,
+        // CSS handled by bundler
+        timing: this.createTiming(startTime)
+      };
+    } catch (error) {
+      const message = error instanceof Error ? error.message : String(error);
+      if (message.includes("Cannot find module 'svelte/server'")) {
+        return this.renderSvelte4(component, startTime);
+      }
+      throw error;
+    }
+  }
+  /**
+   * Fallback render for Svelte 4
+   */
+  async renderSvelte4(component, startTime) {
+    const SvelteComponent = component.component;
+    const result = SvelteComponent.render(component.props ?? {});
+    return {
+      html: result.html,
+      head: result.head,
+      css: result.css?.code,
+      hydrationData: {
+        props: component.props,
+        componentId: component.id ?? this.generateId()
+      },
+      timing: this.createTiming(startTime)
+    };
+  }
+  getHydrationScript(result) {
+    const data = this.serializeProps(result.hydrationData);
+    return `
+<script type="module">
+window.__FLIGHT_DATA__ = ${data};
+window.__FLIGHT_ADAPTER__ = 'svelte';
+
+const App = window.__FLIGHT_APP__;
+const container = document.getElementById('app');
+
+if (App && container) {
+    const { props } = window.__FLIGHT_DATA__;
+    // Svelte 5 mount
+    import('svelte').then(({ mount, hydrate }) => {
+        if (container.innerHTML.trim()) {
+            hydrate(App, { target: container, props });
+        } else {
+            mount(App, { target: container, props });
+        }
+    });
+}
+</script>
+        `.trim();
+  }
+  getClientEntry() {
+    return `
+// Svelte 5 client entry
+import { mount, hydrate } from 'svelte';
+
+export function hydrateApp() {
+    const container = document.getElementById('app');
+    const App = window.__FLIGHT_APP__;
+    const data = window.__FLIGHT_DATA__ ?? {};
+
+    if (!container || !App) {
+        console.warn('[Flight/Svelte] Missing container or App');
+        return;
+    }
+
+    // Check if we have SSR content to hydrate
+    if (container.innerHTML.trim()) {
+        return hydrate(App, {
+            target: container,
+            props: data.props ?? {},
+        });
+    } else {
+        // Fallback to client-side render
+        return mount(App, {
+            target: container,
+            props: data.props ?? {},
+        });
+    }
+}
+
+export function render(App, container, props = {}) {
+    return mount(App, { target: container, props });
+}
+
+// Export for Flight
+export { hydrateApp as hydrate };
+        `.trim();
+  }
+};
+function svelte(options) {
+  return new SvelteAdapter(options);
+}
+var svelte_default = svelte;
+
+export { SvelteAdapter, svelte, svelte_default };