@noego/forge 0.0.27 → 0.1.1

package/dist-ssr/static.d.ts

@@ -0,0 +1,151 @@
+import { SvelteComponent } from 'svelte';
+import { SvelteImport as SvelteImport_2 } from '../base';
+import { SvelteModuleComponent as SvelteModuleComponent_2 } from '../base';
+
+declare interface Body_2 {
+    description: string;
+    required?: boolean;
+    content: any;
+}
+
+declare class ComponentManager {
+    private componentLoader;
+    constructor(componentLoader: IComponentLoader);
+    getLayoutComponents(route: IRoute): Promise<(SvelteImport_2<SvelteComponent<Record<string, any>, any, any>> & SvelteModuleComponent_2)[]>;
+    getLayouts(route: IRoute): Promise<SvelteComponent<Record<string, any>, any, any>[]>;
+    getLayoutLoaders(route: IRoute): Promise<(((...args: any[]) => any) | null)[]>;
+    getViewComponent(route: IRoute): Promise<SvelteImport_2<SvelteComponent<Record<string, any>, any, any>> & SvelteModuleComponent_2>;
+    hasLoaders(route: IRoute): Promise<boolean>;
+    getLoaders(route: IRoute): Promise<{
+        layouts: (((...args: any[]) => any) | null)[];
+        view: ((...args: any[]) => any) | null;
+    }>;
+    private getLoaderFilePath;
+    private resolveLoader;
+    getView(route: IRoute): Promise<SvelteComponent<Record<string, any>, any, any>>;
+}
+
+export declare function createStaticRenderer(config: StaticRendererConfig): Promise<StaticRenderer>;
+
+declare interface IComponentLoader {
+    load(component: string, options?: any): Promise<SvelteResource<SvelteComponent>>;
+    getComponentFullPath(component: string, options?: any): string;
+}
+
+declare interface IRoute {
+    path: string;
+    summary?: string;
+    description?: string;
+    method: string;
+    layout?: string[];
+    middleware?: string[];
+    view: string;
+    responses?: Response_2;
+    parameters?: Parameter[];
+    query?: Parameter[];
+    body?: Body_2;
+}
+
+declare type Middleware = (req: any, reply: any, next: any) => void;
+
+declare type Parameter = any;
+
+export declare interface RenderOptions {
+    /** The URL to render (e.g., '/admin/clients/42?tab=invoices') */
+    route: string;
+    /** HTTP method (default: 'get') */
+    method?: string;
+    /** Mock data for layouts and view */
+    data?: {
+        layout?: any[];
+        view?: any;
+    };
+    /** Override: manually specify view component */
+    view?: any;
+    /** Override: manually specify layout components */
+    layouts?: any[];
+}
+
+export declare interface RenderResult {
+    /** Rendered component HTML */
+    html: string;
+    /** Content from <svelte:head> tags */
+    head: string;
+    /** Component CSS */
+    css: string;
+    /** Parsed path parameters */
+    params: Record<string, string>;
+    /** Parsed query parameters */
+    query: Record<string, string | string[]>;
+    /** The matched route (if auto-resolved) */
+    route: IRoute | null;
+}
+
+export declare interface RenderToPageOptions extends RenderOptions {
+    /** Custom HTML template. Use {{{HEAD}}}, {{{CSS}}}, {{{APP}}} placeholders */
+    template?: string;
+}
+
+declare type Response_2 = Record<number, ResponseData>;
+
+declare type ResponseData = {
+    description: string;
+};
+
+export declare class StaticRenderer {
+    private routes;
+    private matchers;
+    private componentManager;
+    constructor(routes: IRoute[], componentManager: ComponentManager);
+    render(options: RenderOptions): Promise<RenderResult>;
+    /**
+     * Render to a full HTML document.
+     * Uses default template or custom template with {{{HEAD}}}, {{{CSS}}}, {{{APP}}} placeholders.
+     */
+    renderToPage(options: RenderToPageOptions): Promise<string>;
+}
+
+export declare interface StaticRendererConfig {
+    /** Path to stitch.yaml (e.g., './ui/stitch.yaml') */
+    stitchConfig: string;
+    /** Base directory for components (e.g., './ui') */
+    componentDir: string;
+    /** Use production loader with pre-compiled components (default: false) */
+    production?: boolean;
+}
+
+declare type SvelteImport<K> = {
+    default: K;
+};
+
+declare type SvelteModuleComponent = {
+    load?: (data: any) => any;
+    middleware?: Middleware[];
+    middlewares?: Middleware[];
+};
+
+declare type SvelteResource<K> = SvelteImport<K> & SvelteModuleComponent;
+
+export { }
+
+/// <reference types="vite/client" />
+
+declare module '@noego/stitch/browser' {
+  export function stitchFromViteImports(modules: Record<string, string>): Promise<{
+    success: boolean;
+    data?: any;
+    error?: string;
+  }>;
+}
+
+
+
+declare module '@noego/stitch' {
+  export class StitchEngine {
+    buildSync(filePath: string, options?: { format?: string }): {
+      success: boolean;
+      data?: any;
+      error?: string;
+    };
+  }
+}

package/dist-ssr/static.js

@@ -0,0 +1,107 @@
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+import { render } from "svelte/server";
+import { i as initialize_route_matchers, f as findRoute, p as parse_openapi_config, P as ProdComponentLoader, B as BasicComponentLoader, C as ComponentManager } from "./url_parser-DRWHePkU.js";
+import RecursiveRender from "../src/components/RecursiveRender.svelte";
+class StaticRenderer {
+  constructor(routes, componentManager) {
+    __publicField(this, "routes");
+    __publicField(this, "matchers");
+    __publicField(this, "componentManager");
+    this.routes = routes;
+    this.matchers = initialize_route_matchers(routes);
+    this.componentManager = componentManager;
+  }
+  async render(options) {
+    var _a;
+    const { route: url, method = "get", data = {} } = options;
+    const urlObj = new URL(url, "http://localhost");
+    const pathname = urlObj.pathname;
+    const query = {};
+    urlObj.searchParams.forEach((value, key) => {
+      const existing = query[key];
+      if (existing) {
+        query[key] = Array.isArray(existing) ? [...existing, value] : [existing, value];
+      } else {
+        query[key] = value;
+      }
+    });
+    let params = {};
+    let matchedRoute = null;
+    let view;
+    let layouts = [];
+    if (options.view) {
+      view = options.view;
+      layouts = options.layouts || [];
+    } else {
+      const match = findRoute(pathname, this.matchers);
+      if (!match) {
+        throw new Error(`No route found for: ${pathname}`);
+      }
+      matchedRoute = this.routes.find(
+        (r) => r.path === match.pattern && r.method.toLowerCase() === method.toLowerCase()
+      ) || null;
+      if (!matchedRoute) {
+        throw new Error(`No ${method.toUpperCase()} route for: ${pathname}`);
+      }
+      params = match.params;
+      view = await this.componentManager.getView(matchedRoute);
+      layouts = await this.componentManager.getLayouts(matchedRoute);
+    }
+    const page = { url, pathname, params, query };
+    const serverData = {
+      layout: data.layout || [],
+      view: data.view || {}
+    };
+    const result = render(RecursiveRender, {
+      props: {
+        layouts,
+        view,
+        data: serverData,
+        params,
+        urlParams: params,
+        query,
+        page
+      }
+    });
+    return {
+      html: result.html,
+      head: result.head,
+      css: ((_a = result.css) == null ? void 0 : _a.code) || "",
+      params,
+      query,
+      route: matchedRoute
+    };
+  }
+  /**
+   * Render to a full HTML document.
+   * Uses default template or custom template with {{{HEAD}}}, {{{CSS}}}, {{{APP}}} placeholders.
+   */
+  async renderToPage(options) {
+    const { html, head, css } = await this.render(options);
+    const defaultTemplate = `<!DOCTYPE html>
+<html>
+<head>
+    {{{HEAD}}}
+    <style>{{{CSS}}}</style>
+</head>
+<body>
+    <div id="app">{{{APP}}}</div>
+</body>
+</html>`;
+    const template = options.template || defaultTemplate;
+    return template.replace("{{{HEAD}}}", head).replace("{{{CSS}}}", css).replace("{{{APP}}}", html);
+  }
+}
+async function createStaticRenderer(config) {
+  const serverConfig = await parse_openapi_config(config.stitchConfig);
+  const loader = config.production ? new ProdComponentLoader(config.componentDir) : new BasicComponentLoader(config.componentDir);
+  const componentManager = new ComponentManager(loader);
+  return new StaticRenderer(serverConfig.routes, componentManager);
+}
+export {
+  StaticRenderer,
+  createStaticRenderer
+};
+//# sourceMappingURL=static.js.map

package/dist-ssr/static.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"static.js","sources":["../src/static/index.ts"],"sourcesContent":["import { render } from 'svelte/server';\nimport { parse_openapi_config } from '../parser/openapi';\nimport { initialize_route_matchers, findRoute } from '../routing/url_parser';\nimport { ComponentManager } from '../routing/component_loader/component_manager';\nimport { BasicComponentLoader, ProdComponentLoader } from '../routing/component_loader/component_loader';\nimport RecursiveRender from '../components/RecursiveRender.svelte';\nimport type { IRoute } from '../parser/IRoute';\n\n// ─────────────────────────────────────────────────────────────\n// Types\n// ─────────────────────────────────────────────────────────────\n\nexport interface StaticRendererConfig {\n    /** Path to stitch.yaml (e.g., './ui/stitch.yaml') */\n    stitchConfig: string;\n    /** Base directory for components (e.g., './ui') */\n    componentDir: string;\n    /** Use production loader with pre-compiled components (default: false) */\n    production?: boolean;\n}\n\nexport interface RenderOptions {\n    /** The URL to render (e.g., '/admin/clients/42?tab=invoices') */\n    route: string;\n    /** HTTP method (default: 'get') */\n    method?: string;\n    /** Mock data for layouts and view */\n    data?: {\n        layout?: any[];  // One object per layout\n        view?: any;      // View component data\n    };\n    /** Override: manually specify view component */\n    view?: any;\n    /** Override: manually specify layout components */\n    layouts?: any[];\n}\n\nexport interface RenderToPageOptions extends RenderOptions {\n    /** Custom HTML template. Use {{{HEAD}}}, {{{CSS}}}, {{{APP}}} placeholders */\n    template?: string;\n}\n\nexport interface RenderResult {\n    /** Rendered component HTML */\n    html: string;\n    /** Content from <svelte:head> tags */\n    head: string;\n    /** Component CSS */\n    css: string;\n    /** Parsed path parameters */\n    params: Record<string, string>;\n    /** Parsed query parameters */\n    query: Record<string, string | string[]>;\n    /** The matched route (if auto-resolved) */\n    route: IRoute | null;\n}\n\n// ─────────────────────────────────────────────────────────────\n// StaticRenderer Class\n// ─────────────────────────────────────────────────────────────\n\nexport class StaticRenderer {\n    private routes: IRoute[];\n    private matchers: any[];\n    private componentManager: ComponentManager;\n\n    constructor(routes: IRoute[], componentManager: ComponentManager) {\n        this.routes = routes;\n        this.matchers = initialize_route_matchers(routes);\n        this.componentManager = componentManager;\n    }\n\n    async render(options: RenderOptions): Promise<RenderResult> {\n        const { route: url, method = 'get', data = {} } = options;\n\n        // Parse URL\n        const urlObj = new URL(url, 'http://localhost');\n        const pathname = urlObj.pathname;\n\n        // Parse query params\n        const query: Record<string, string | string[]> = {};\n        urlObj.searchParams.forEach((value, key) => {\n            const existing = query[key];\n            if (existing) {\n                query[key] = Array.isArray(existing)\n                    ? [...existing, value]\n                    : [existing, value];\n            } else {\n                query[key] = value;\n            }\n        });\n\n        // Find matching route and extract params\n        let params: Record<string, string> = {};\n        let matchedRoute: IRoute | null = null;\n        let view: any;\n        let layouts: any[] = [];\n\n        // If view/layouts provided, use those (manual override)\n        if (options.view) {\n            view = options.view;\n            layouts = options.layouts || [];\n        } else {\n            // Auto-resolve from stitch config\n            const match = findRoute(pathname, this.matchers);\n            if (!match) {\n                throw new Error(`No route found for: ${pathname}`);\n            }\n\n            matchedRoute = this.routes.find(r =>\n                r.path === match.pattern &&\n                r.method.toLowerCase() === method.toLowerCase()\n            ) || null;\n\n            if (!matchedRoute) {\n                throw new Error(`No ${method.toUpperCase()} route for: ${pathname}`);\n            }\n\n            params = match.params as Record<string, string>;\n\n            // Load components\n            view = await this.componentManager.getView(matchedRoute);\n            layouts = await this.componentManager.getLayouts(matchedRoute);\n        }\n\n        // Build page object\n        const page = { url, pathname, params, query };\n\n        // Build server data\n        const serverData = {\n            layout: data.layout || [],\n            view: data.view || {}\n        };\n\n        // Render using RecursiveRender (same as production)\n        const result = render(RecursiveRender, {\n            props: {\n                layouts,\n                view,\n                data: serverData,\n                params,\n                urlParams: params,\n                query,\n                page\n            }\n        });\n\n        return {\n            html: result.html,\n            head: result.head,\n            css: (result as any).css?.code || '',\n            params,\n            query,\n            route: matchedRoute\n        };\n    }\n\n    /**\n     * Render to a full HTML document.\n     * Uses default template or custom template with {{{HEAD}}}, {{{CSS}}}, {{{APP}}} placeholders.\n     */\n    async renderToPage(options: RenderToPageOptions): Promise<string> {\n        const { html, head, css } = await this.render(options);\n\n        const defaultTemplate = `<!DOCTYPE html>\n<html>\n<head>\n    {{{HEAD}}}\n    <style>{{{CSS}}}</style>\n</head>\n<body>\n    <div id=\"app\">{{{APP}}}</div>\n</body>\n</html>`;\n\n        const template = options.template || defaultTemplate;\n\n        return template\n            .replace('{{{HEAD}}}', head)\n            .replace('{{{CSS}}}', css)\n            .replace('{{{APP}}}', html);\n    }\n}\n\n// ─────────────────────────────────────────────────────────────\n// Factory Function\n// ─────────────────────────────────────────────────────────────\n\nexport async function createStaticRenderer(\n    config: StaticRendererConfig\n): Promise<StaticRenderer> {\n    // Parse stitch config to get routes\n    const serverConfig = await parse_openapi_config(config.stitchConfig);\n\n    // Create component loader based on mode\n    const loader = config.production\n        ? new ProdComponentLoader(config.componentDir)  // Pre-compiled, production perf\n        : new BasicComponentLoader(config.componentDir); // On-demand compilation\n\n    const componentManager = new ComponentManager(loader);\n\n    return new StaticRenderer(serverConfig.routes, componentManager);\n}\n"],"names":[],"mappings":";;;;;;AA6DO,MAAM,eAAe;AAAA,EAKxB,YAAY,QAAkB,kBAAoC;AAJ1D;AACA;AACA;AAGJ,SAAK,SAAS;AACT,SAAA,WAAW,0BAA0B,MAAM;AAChD,SAAK,mBAAmB;AAAA,EAAA;AAAA,EAG5B,MAAM,OAAO,SAA+C;;AAClD,UAAA,EAAE,OAAO,KAAK,SAAS,OAAO,OAAO,OAAO;AAGlD,UAAM,SAAS,IAAI,IAAI,KAAK,kBAAkB;AAC9C,UAAM,WAAW,OAAO;AAGxB,UAAM,QAA2C,CAAC;AAClD,WAAO,aAAa,QAAQ,CAAC,OAAO,QAAQ;AAClC,YAAA,WAAW,MAAM,GAAG;AAC1B,UAAI,UAAU;AACV,cAAM,GAAG,IAAI,MAAM,QAAQ,QAAQ,IAC7B,CAAC,GAAG,UAAU,KAAK,IACnB,CAAC,UAAU,KAAK;AAAA,MAAA,OACnB;AACH,cAAM,GAAG,IAAI;AAAA,MAAA;AAAA,IACjB,CACH;AAGD,QAAI,SAAiC,CAAC;AACtC,QAAI,eAA8B;AAC9B,QAAA;AACJ,QAAI,UAAiB,CAAC;AAGtB,QAAI,QAAQ,MAAM;AACd,aAAO,QAAQ;AACL,gBAAA,QAAQ,WAAW,CAAC;AAAA,IAAA,OAC3B;AAEH,YAAM,QAAQ,UAAU,UAAU,KAAK,QAAQ;AAC/C,UAAI,CAAC,OAAO;AACR,cAAM,IAAI,MAAM,uBAAuB,QAAQ,EAAE;AAAA,MAAA;AAGrD,qBAAe,KAAK,OAAO;AAAA,QAAK,CAAA,MAC5B,EAAE,SAAS,MAAM,WACjB,EAAE,OAAO,kBAAkB,OAAO,YAAY;AAAA,MAAA,KAC7C;AAEL,UAAI,CAAC,cAAc;AACT,cAAA,IAAI,MAAM,MAAM,OAAO,aAAa,eAAe,QAAQ,EAAE;AAAA,MAAA;AAGvE,eAAS,MAAM;AAGf,aAAO,MAAM,KAAK,iBAAiB,QAAQ,YAAY;AACvD,gBAAU,MAAM,KAAK,iBAAiB,WAAW,YAAY;AAAA,IAAA;AAIjE,UAAM,OAAO,EAAE,KAAK,UAAU,QAAQ,MAAM;AAG5C,UAAM,aAAa;AAAA,MACf,QAAQ,KAAK,UAAU,CAAC;AAAA,MACxB,MAAM,KAAK,QAAQ,CAAA;AAAA,IACvB;AAGM,UAAA,SAAS,OAAO,iBAAiB;AAAA,MACnC,OAAO;AAAA,QACH;AAAA,QACA;AAAA,QACA,MAAM;AAAA,QACN;AAAA,QACA,WAAW;AAAA,QACX;AAAA,QACA;AAAA,MAAA;AAAA,IACJ,CACH;AAEM,WAAA;AAAA,MACH,MAAM,OAAO;AAAA,MACb,MAAM,OAAO;AAAA,MACb,OAAM,YAAe,QAAf,mBAAoB,SAAQ;AAAA,MAClC;AAAA,MACA;AAAA,MACA,OAAO;AAAA,IACX;AAAA,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOJ,MAAM,aAAa,SAA+C;AACxD,UAAA,EAAE,MAAM,MAAM,QAAQ,MAAM,KAAK,OAAO,OAAO;AAErD,UAAM,kBAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWlB,UAAA,WAAW,QAAQ,YAAY;AAE9B,WAAA,SACF,QAAQ,cAAc,IAAI,EAC1B,QAAQ,aAAa,GAAG,EACxB,QAAQ,aAAa,IAAI;AAAA,EAAA;AAEtC;AAMA,eAAsB,qBAClB,QACuB;AAEvB,QAAM,eAAe,MAAM,qBAAqB,OAAO,YAAY;AAG7D,QAAA,SAAS,OAAO,aAChB,IAAI,oBAAoB,OAAO,YAAY,IAC3C,IAAI,qBAAqB,OAAO,YAAY;AAE5C,QAAA,mBAAmB,IAAI,iBAAiB,MAAM;AAEpD,SAAO,IAAI,eAAe,aAAa,QAAQ,gBAAgB;AACnE;"}

package/dist-ssr/test.cjs

@@ -0,0 +1,235 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const _static = require("./static.cjs");
+const fs = require("fs");
+const path = require("path");
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const fs__namespace = /* @__PURE__ */ _interopNamespaceDefault(fs);
+const path__namespace = /* @__PURE__ */ _interopNamespaceDefault(path);
+class PlaywrightNotInstalledError extends Error {
+  constructor() {
+    super(
+      "ImageRenderer requires Playwright. Install it with:\n  npm install playwright\n  npx playwright install chromium"
+    );
+    __publicField(this, "name", "PlaywrightNotInstalledError");
+  }
+}
+class BrowserLaunchError extends Error {
+  constructor(message, cause) {
+    super(message);
+    __publicField(this, "name", "BrowserLaunchError");
+    this.cause = cause;
+  }
+}
+class RenderTimeoutError extends Error {
+  constructor(timeoutMs) {
+    super(`Render timed out after ${timeoutMs}ms`);
+    __publicField(this, "name", "RenderTimeoutError");
+  }
+}
+class RenderError extends Error {
+  constructor(message, cause) {
+    super(message);
+    __publicField(this, "name", "RenderError");
+    this.cause = cause;
+  }
+}
+class ForgeCLIRequiredError extends Error {
+  constructor() {
+    super(
+      'This file must be run with the forge CLI, not directly with tsx/node.\n\nUsage:\n  npx forge test/ui/your-test.ts\n  npx forge "test/ui/**/*.test.ts"\n\nThe forge CLI provides the necessary Svelte loader for rendering components.'
+    );
+    __publicField(this, "name", "ForgeCLIRequiredError");
+  }
+}
+async function loadPlaywright() {
+  try {
+    const playwright = await import("playwright");
+    return playwright;
+  } catch {
+    throw new PlaywrightNotInstalledError();
+  }
+}
+class ImageRenderer {
+  constructor(browser, staticRenderer, config) {
+    __publicField(this, "browser");
+    __publicField(this, "staticRenderer");
+    __publicField(this, "config");
+    this.browser = browser;
+    this.staticRenderer = staticRenderer;
+    this.config = {
+      outputDir: config.outputDir,
+      width: config.width ?? 1920,
+      height: config.height ?? 1080,
+      deviceScaleFactor: config.deviceScaleFactor ?? 1,
+      format: config.format ?? "png",
+      quality: config.quality ?? 80,
+      waitUntil: config.waitUntil ?? "networkidle",
+      timeoutMs: config.timeoutMs ?? 1e4,
+      template: config.template
+    };
+  }
+  /**
+   * Capture a route and save to outputDir
+   */
+  async capture(name, route, options) {
+    const { view, layout } = options ?? {};
+    const renderResult = await this.staticRenderer.renderToPage({
+      route,
+      data: { view, layout },
+      template: this.config.template
+    });
+    return this.captureHtmlInternal(name, renderResult, options);
+  }
+  /**
+   * Capture raw HTML and save to outputDir
+   */
+  async captureHtml(name, html, options) {
+    return this.captureHtmlInternal(name, html, options);
+  }
+  /**
+   * Internal method to capture HTML to image
+   */
+  async captureHtmlInternal(name, html, options) {
+    const width = (options == null ? void 0 : options.width) ?? this.config.width;
+    const height = (options == null ? void 0 : options.height) ?? this.config.height;
+    let context;
+    let page;
+    try {
+      context = await this.browser.newContext({
+        viewport: { width, height },
+        deviceScaleFactor: this.config.deviceScaleFactor
+      });
+      page = await context.newPage();
+      const waitUntilMapping = {
+        "load": "load",
+        "domcontentloaded": "domcontentloaded",
+        "networkidle": "networkidle"
+      };
+      try {
+        await page.setContent(html, {
+          waitUntil: waitUntilMapping[this.config.waitUntil],
+          timeout: this.config.timeoutMs
+        });
+      } catch (error) {
+        if (error instanceof Error && error.message.includes("timeout")) {
+          throw new RenderTimeoutError(this.config.timeoutMs);
+        }
+        throw new RenderError(
+          "Failed to render HTML content",
+          error instanceof Error ? error : void 0
+        );
+      }
+      const screenshotOptions = {
+        type: this.config.format,
+        fullPage: false
+      };
+      if (this.config.format === "jpeg") {
+        screenshotOptions.quality = this.config.quality;
+      }
+      const screenshot = await page.screenshot(screenshotOptions);
+      const buffer = Buffer.from(screenshot);
+      const filename = `${name}@${width}x${height}.${this.config.format}`;
+      const outputPath = path__namespace.join(this.config.outputDir, filename);
+      await fs__namespace.promises.mkdir(this.config.outputDir, { recursive: true });
+      await fs__namespace.promises.writeFile(outputPath, buffer);
+      return { buffer, path: outputPath };
+    } finally {
+      if (page) {
+        await page.close().catch(() => {
+        });
+      }
+      if (context) {
+        await context.close().catch(() => {
+        });
+      }
+    }
+  }
+  /**
+   * Close browser and clean up resources
+   */
+  async close() {
+    if (this.browser) {
+      await this.browser.close().catch(() => {
+      });
+    }
+  }
+}
+async function createImageRenderer(config) {
+  if (!process.env.FORGE_CLI) {
+    throw new ForgeCLIRequiredError();
+  }
+  const playwright = await loadPlaywright();
+  let browser;
+  try {
+    browser = await playwright.chromium.launch({
+      headless: true
+    });
+  } catch (error) {
+    throw new BrowserLaunchError(
+      "Failed to launch Chromium. Ensure it is installed with: npx playwright install chromium",
+      error instanceof Error ? error : void 0
+    );
+  }
+  let staticRenderer;
+  if (config.staticRenderer) {
+    staticRenderer = config.staticRenderer;
+  } else if (config.stitchConfig && config.componentDir) {
+    staticRenderer = await _static.createStaticRenderer({
+      stitchConfig: config.stitchConfig,
+      componentDir: config.componentDir
+    });
+  } else {
+    throw new Error(
+      "ImageRendererConfig requires either staticRenderer or both stitchConfig and componentDir"
+    );
+  }
+  return new ImageRenderer(browser, staticRenderer, config);
+}
+exports.BrowserLaunchError = BrowserLaunchError;
+exports.ForgeCLIRequiredError = ForgeCLIRequiredError;
+exports.ImageRenderer = ImageRenderer;
+exports.PlaywrightNotInstalledError = PlaywrightNotInstalledError;
+exports.RenderError = RenderError;
+exports.RenderTimeoutError = RenderTimeoutError;
+exports.createImageRenderer = createImageRenderer;
+//# sourceMappingURL=test.cjs.map

package/dist-ssr/test.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"test.cjs","sources":["../src/test/index.ts"],"sourcesContent":["import { createStaticRenderer, type StaticRenderer } from '../static/index';\nimport * as fs from 'fs';\nimport * as path from 'path';\n\n// ─────────────────────────────────────────────────────────────\n// Error Classes\n// ─────────────────────────────────────────────────────────────\n\nexport class PlaywrightNotInstalledError extends Error {\n  name = 'PlaywrightNotInstalledError' as const;\n  constructor() {\n    super(\n      'ImageRenderer requires Playwright. Install it with:\\n' +\n      '  npm install playwright\\n' +\n      '  npx playwright install chromium'\n    );\n  }\n}\n\nexport class BrowserLaunchError extends Error {\n  name = 'BrowserLaunchError' as const;\n  constructor(message: string, public cause?: Error) {\n    super(message);\n  }\n}\n\nexport class RenderTimeoutError extends Error {\n  name = 'RenderTimeoutError' as const;\n  constructor(timeoutMs: number) {\n    super(`Render timed out after ${timeoutMs}ms`);\n  }\n}\n\nexport class RenderError extends Error {\n  name = 'RenderError' as const;\n  constructor(message: string, public cause?: Error) {\n    super(message);\n  }\n}\n\nexport class ForgeCLIRequiredError extends Error {\n  name = 'ForgeCLIRequiredError' as const;\n  constructor() {\n    super(\n      'This file must be run with the forge CLI, not directly with tsx/node.\\n\\n' +\n      'Usage:\\n' +\n      '  npx forge test/ui/your-test.ts\\n' +\n      '  npx forge \"test/ui/**/*.test.ts\"\\n\\n' +\n      'The forge CLI provides the necessary Svelte loader for rendering components.'\n    );\n  }\n}\n\n// ─────────────────────────────────────────────────────────────\n// Types\n// ─────────────────────────────────────────────────────────────\n\nexport interface ImageRendererConfig {\n  /** Output directory for screenshots */\n  outputDir: string;\n  /** Default width (default: 1920) */\n  width?: number;\n  /** Default height (default: 1080) */\n  height?: number;\n  /** Device scale factor for retina (default: 1) */\n  deviceScaleFactor?: number;\n  /** Image format (default: 'png') */\n  format?: 'png' | 'jpeg';\n  /** JPEG quality 0-100 (default: 80) */\n  quality?: number;\n  /** Wait condition (default: 'networkidle') */\n  waitUntil?: 'load' | 'domcontentloaded' | 'networkidle';\n  /** Timeout in ms (default: 10000) */\n  timeoutMs?: number;\n  /** Custom HTML template with {{{HEAD}}}, {{{CSS}}}, {{{APP}}} placeholders */\n  template?: string;\n\n  // Static renderer config (one of these)\n  /** Pre-created StaticRenderer instance */\n  staticRenderer?: StaticRenderer;\n  /** OR: Path to stitch.yaml */\n  stitchConfig?: string;\n  /** Component directory (required if stitchConfig provided) */\n  componentDir?: string;\n}\n\nexport interface CaptureOptions {\n  /** View component data */\n  view?: any;\n  /** Layout data (one object per layout) */\n  layout?: any[];\n  /** Override width */\n  width?: number;\n  /** Override height */\n  height?: number;\n}\n\nexport interface CaptureHtmlOptions {\n  /** Override width */\n  width?: number;\n  /** Override height */\n  height?: number;\n}\n\ninterface CaptureResult {\n  /** Raw image buffer */\n  buffer: Buffer;\n  /** Path where image was saved */\n  path: string;\n}\n\n// ─────────────────────────────────────────────────────────────\n// Playwright Loader\n// ─────────────────────────────────────────────────────────────\n\ntype PlaywrightModule = typeof import('playwright');\n\nasync function loadPlaywright(): Promise<PlaywrightModule> {\n  try {\n    const playwright = await import('playwright');\n    return playwright;\n  } catch {\n    throw new PlaywrightNotInstalledError();\n  }\n}\n\n// ─────────────────────────────────────────────────────────────\n// ImageRenderer Class\n// ─────────────────────────────────────────────────────────────\n\nexport class ImageRenderer {\n  private browser: any;\n  private staticRenderer: StaticRenderer;\n  private config: Required<Omit<ImageRendererConfig, 'staticRenderer' | 'stitchConfig' | 'componentDir' | 'template'>> & {\n    outputDir: string;\n    template?: string;\n  };\n\n  constructor(\n    browser: any,\n    staticRenderer: StaticRenderer,\n    config: ImageRendererConfig\n  ) {\n    this.browser = browser;\n    this.staticRenderer = staticRenderer;\n    this.config = {\n      outputDir: config.outputDir,\n      width: config.width ?? 1920,\n      height: config.height ?? 1080,\n      deviceScaleFactor: config.deviceScaleFactor ?? 1,\n      format: config.format ?? 'png',\n      quality: config.quality ?? 80,\n      waitUntil: config.waitUntil ?? 'networkidle',\n      timeoutMs: config.timeoutMs ?? 10000,\n      template: config.template,\n    };\n  }\n\n  /**\n   * Capture a route and save to outputDir\n   */\n  async capture(\n    name: string,\n    route: string,\n    options?: CaptureOptions\n  ): Promise<CaptureResult> {\n    // Render route to HTML using StaticRenderer\n    const { view, layout } = options ?? {};\n    const renderResult = await this.staticRenderer.renderToPage({\n      route,\n      data: { view, layout },\n      template: this.config.template,\n    });\n\n    // Capture the HTML\n    return this.captureHtmlInternal(name, renderResult, options);\n  }\n\n  /**\n   * Capture raw HTML and save to outputDir\n   */\n  async captureHtml(\n    name: string,\n    html: string,\n    options?: CaptureHtmlOptions\n  ): Promise<CaptureResult> {\n    return this.captureHtmlInternal(name, html, options);\n  }\n\n  /**\n   * Internal method to capture HTML to image\n   */\n  private async captureHtmlInternal(\n    name: string,\n    html: string,\n    options?: CaptureHtmlOptions\n  ): Promise<CaptureResult> {\n    const width = options?.width ?? this.config.width;\n    const height = options?.height ?? this.config.height;\n\n    let context: any;\n    let page: any;\n\n    try {\n      // Create new context with viewport\n      context = await this.browser.newContext({\n        viewport: { width, height },\n        deviceScaleFactor: this.config.deviceScaleFactor,\n      });\n\n      // Create page\n      page = await context.newPage();\n\n      // Set content with timeout\n      const waitUntilMapping = {\n        'load': 'load',\n        'domcontentloaded': 'domcontentloaded',\n        'networkidle': 'networkidle',\n      } as const;\n\n      try {\n        await page.setContent(html, {\n          waitUntil: waitUntilMapping[this.config.waitUntil],\n          timeout: this.config.timeoutMs,\n        });\n      } catch (error) {\n        if (error instanceof Error && error.message.includes('timeout')) {\n          throw new RenderTimeoutError(this.config.timeoutMs);\n        }\n        throw new RenderError(\n          'Failed to render HTML content',\n          error instanceof Error ? error : undefined\n        );\n      }\n\n      // Take screenshot\n      const screenshotOptions: {\n        type: 'png' | 'jpeg';\n        quality?: number;\n        fullPage: boolean;\n      } = {\n        type: this.config.format,\n        fullPage: false,\n      };\n\n      // Quality only applies to JPEG\n      if (this.config.format === 'jpeg') {\n        screenshotOptions.quality = this.config.quality;\n      }\n\n      const screenshot = await page.screenshot(screenshotOptions);\n      const buffer = Buffer.from(screenshot);\n\n      // Generate filename: {name}@{width}x{height}.{format}\n      const filename = `${name}@${width}x${height}.${this.config.format}`;\n      const outputPath = path.join(this.config.outputDir, filename);\n\n      // Ensure output directory exists\n      await fs.promises.mkdir(this.config.outputDir, { recursive: true });\n\n      // Write file\n      await fs.promises.writeFile(outputPath, buffer);\n\n      return { buffer, path: outputPath };\n\n    } finally {\n      // Cleanup context and page (browser stays open)\n      if (page) {\n        await page.close().catch(() => {});\n      }\n      if (context) {\n        await context.close().catch(() => {});\n      }\n    }\n  }\n\n  /**\n   * Close browser and clean up resources\n   */\n  async close(): Promise<void> {\n    if (this.browser) {\n      await this.browser.close().catch(() => {});\n    }\n  }\n}\n\n// ─────────────────────────────────────────────────────────────\n// Factory Function\n// ─────────────────────────────────────────────────────────────\n\nexport async function createImageRenderer(\n  config: ImageRendererConfig\n): Promise<ImageRenderer> {\n  // Check if running via forge CLI\n  if (!process.env.FORGE_CLI) {\n    throw new ForgeCLIRequiredError();\n  }\n\n  // Load Playwright dynamically\n  const playwright = await loadPlaywright();\n\n  // Launch browser\n  let browser: any;\n  try {\n    browser = await playwright.chromium.launch({\n      headless: true,\n    });\n  } catch (error) {\n    throw new BrowserLaunchError(\n      'Failed to launch Chromium. Ensure it is installed with: npx playwright install chromium',\n      error instanceof Error ? error : undefined\n    );\n  }\n\n  // Get or create StaticRenderer\n  let staticRenderer: StaticRenderer;\n  if (config.staticRenderer) {\n    staticRenderer = config.staticRenderer;\n  } else if (config.stitchConfig && config.componentDir) {\n    staticRenderer = await createStaticRenderer({\n      stitchConfig: config.stitchConfig,\n      componentDir: config.componentDir,\n    });\n  } else {\n    throw new Error(\n      'ImageRendererConfig requires either staticRenderer or both stitchConfig and componentDir'\n    );\n  }\n\n  return new ImageRenderer(browser, staticRenderer, config);\n}\n"],"names":["path","fs","createStaticRenderer"],"mappings":"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"}