@mandujs/core 0.18.7 → 0.18.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mandujs/core",
-  "version": "0.18.7",
+  "version": "0.18.9",
   "description": "Mandu Framework Core - Spec, Generator, Guard, Runtime",
   "type": "module",
   "main": "./src/index.ts",

package/src/bundler/build.ts

@@ -744,6 +744,72 @@ if (document.readyState === 'loading') {
 `;
 }
 
+/**
+ * DevTools 번들 빌드 (개발 모드 전용)
+ * devtools/init.ts를 브라우저용 번들로 컴파일하여 _devtools.js 생성
+ */
+async function buildDevtoolsBundle(
+  outDir: string,
+  options: BundlerOptions
+): Promise<{ success: boolean; outputPath: string; errors: string[] }> {
+  const srcPath = path.join(outDir, "_devtools.src.js");
+  const outputName = "_devtools.js";
+
+  // devtools/init.ts의 절대 경로 (build.ts → ../devtools/init.ts)
+  const devtoolsInitPath = path.resolve(
+    import.meta.dir, '..', 'devtools', 'init.ts'
+  ).replace(/\\/g, '/');
+
+  const source = `
+import { initManduKitchen } from "${devtoolsInitPath}";
+if (typeof window !== 'undefined') {
+  window.__MANDU_DEV_TOOLS__ = true;
+  initManduKitchen({ position: 'bottom-right' });
+}
+`;
+
+  try {
+    await Bun.write(srcPath, source);
+
+    const result = await Bun.build({
+      entrypoints: [srcPath],
+      outdir: outDir,
+      naming: outputName,
+      minify: false, // dev only
+      sourcemap: options.sourcemap ? "external" : "none",
+      target: "browser",
+      external: ["react", "react-dom", "react-dom/client"],
+      define: {
+        "process.env.NODE_ENV": JSON.stringify("development"),
+        ...options.define,
+      },
+    });
+
+    await fs.unlink(srcPath).catch(() => {});
+
+    if (!result.success) {
+      return {
+        success: false,
+        outputPath: "",
+        errors: result.logs.map((l) => l.message),
+      };
+    }
+
+    return {
+      success: true,
+      outputPath: `/.mandu/client/${outputName}`,
+      errors: [],
+    };
+  } catch (error) {
+    await fs.unlink(srcPath).catch(() => {});
+    return {
+      success: false,
+      outputPath: "",
+      errors: [String(error)],
+    };
+  }
+}
+
 /**
  * Router 런타임 번들 빌드
  */
@@ -1251,22 +1317,34 @@ export async function buildClientBundles(
     return { success: errors.length === 0, outputs, errors, manifest: existingManifest, stats };
   }
 
-  // 3-4. Runtime, Router, Vendor 번들 병렬 빌드 (서로 독립적)
-  const [runtimeResult, routerResult, vendorResult] = await Promise.all([
+  // 3-4. Runtime, Router, Vendor, DevTools 번들 병렬 빌드 (서로 독립적)
+  const buildPromises: Promise<any>[] = [
     buildRuntime(outDir, options),
     buildRouterRuntime(outDir, options),
     buildVendorShims(outDir, options),
-  ]);
+  ];
+
+  // DevTools 번들은 dev 모드에서만 빌드
+  const isDev = env === "development";
+  if (isDev) {
+    buildPromises.push(buildDevtoolsBundle(outDir, options));
+  }
+
+  const [runtimeResult, routerResult, vendorResult, devtoolsResult] = await Promise.all(buildPromises);
 
   if (!runtimeResult.success) {
-    errors.push(...runtimeResult.errors.map((e) => `[Runtime] ${e}`));
+    errors.push(...runtimeResult.errors.map((e: string) => `[Runtime] ${e}`));
   }
   if (!routerResult.success) {
-    errors.push(...routerResult.errors.map((e) => `[Router] ${e}`));
+    errors.push(...routerResult.errors.map((e: string) => `[Router] ${e}`));
   }
   if (!vendorResult.success) {
     errors.push(...vendorResult.errors);
   }
+  if (devtoolsResult && !devtoolsResult.success) {
+    // DevTools 빌드 실패는 경고만 (개발 중단시키지 않음)
+    console.warn("[Mandu] DevTools bundle build failed:", devtoolsResult.errors.join(", "));
+  }
 
   // 5. 각 Island 번들 빌드
   for (const route of hydratedRoutes) {

package/src/filling/filling.ts

@@ -375,6 +375,18 @@ export class ManduFilling<TLoaderData = unknown> {
     return Array.from(this.config.handlers.keys());
   }
 
+  /**
+   * Convert to named handler exports compatible with Mandu route.ts files.
+   * Usage: export const { GET, POST } = filling.toHandlers();
+   */
+  toHandlers(): Partial<Record<HttpMethod, (req: Request) => Promise<Response>>> {
+    const result: Partial<Record<HttpMethod, (req: Request) => Promise<Response>>> = {};
+    for (const method of this.config.handlers.keys()) {
+      result[method] = (req: Request) => this.handle(req, {}, undefined);
+    }
+    return result;
+  }
+
   hasMethod(method: HttpMethod): boolean {
     return this.config.handlers.has(method);
   }

package/src/runtime/ssr.ts

@@ -238,6 +238,12 @@ export function renderToHTML(element: ReactElement, options: SSROptions = {}): s
     hmrScript = generateHMRScript(hmrPort);
   }
 
+  // DevTools 번들 로드 (개발 모드)
+  let devtoolsScript = "";
+  if (isDev) {
+    devtoolsScript = generateDevtoolsScript();
+  }
+
   return `<!doctype html>
 <html lang="${escapeHtmlAttr(lang)}">
 <head>
@@ -255,6 +261,7 @@ export function renderToHTML(element: ReactElement, options: SSROptions = {}): s
   ${needsHydration ? REACT_INTERNALS_SHIM_SCRIPT : ""}
   ${routerScript}
   ${hmrScript}
+  ${devtoolsScript}
   ${bodyEndTags}
 </body>
 </html>`;
@@ -364,6 +371,14 @@ function generateHMRScript(port: number): string {
 </script>`;
 }
 
+/**
+ * DevTools 번들 로드 스크립트 생성 (개발 모드 전용)
+ * _devtools.js 번들이 자체적으로 initManduKitchen()을 호출
+ */
+function generateDevtoolsScript(): string {
+  return `<script type="module" src="/.mandu/client/_devtools.js"></script>`;
+}
+
 export function createHTMLResponse(html: string, status: number = 200): Response {
   return new Response(html, {
     status,

package/src/runtime/streaming-ssr.ts

@@ -530,6 +530,11 @@ function generateHTMLTailContent(options: StreamingSSROptions): string {
     scripts.push(generateHMRScript(hmrPort));
   }
 
+  // 10. DevTools 번들 로드 (개발 모드)
+  if (isDev) {
+    scripts.push(`<script type="module" src="/.mandu/client/_devtools.js"></script>`);
+  }
+
   // Island wrapper 닫기 (hydration이 필요한 경우)
   const needsHydration = hydration && hydration.strategy !== "none" && routeId && bundleManifest;
   const islandCloseTag = needsHydration ? "</div>" : "";