html2pptx-local-mcp 1.1.24 → 1.1.26

package/cli/dist/commands/edit.d.ts

@@ -1,3 +1,4 @@
+import { type IncomingMessage, type ServerResponse } from "node:http";
 export interface EditOptions {
     port?: string;
     baseUrl?: string;
@@ -17,7 +18,7 @@ declare function normalizeBaseUrl(raw: string): URL;
 declare function readRegisteredEditorBaseUrl(root: string): Promise<string | null>;
 declare function resolveEditorBaseUrl(root: string, explicitBaseUrl: string | undefined): Promise<URL>;
 declare function buildEditorUrl(baseUrl: URL, rel: string, bridgeUrl: string, sessionToken: string): URL;
-declare function createBridgeServer(ctx: BridgeContext): any;
+declare function createBridgeServer(ctx: BridgeContext): import("node:http").Server<typeof IncomingMessage, typeof ServerResponse>;
 declare function listen(server: ReturnType<typeof createBridgeServer>, requestedPort: number): Promise<number>;
 export declare function editCommand(input: string | undefined, options?: EditOptions): Promise<void>;
 export declare const editCommandInternalsForTest: {

package/lib/local-editor-server.js

@@ -64,10 +64,14 @@ export function createLocalEditorServerManager(options = {}) {
     const baseUrl = `http://localhost:${port}`;
     const invocation = await resolveNextInvocation(appRoot, options);
 
+    // Issue #78: do not pass `--webpack`. Next.js 16.2.x webpack mode fails
+    // to compile App Router `.jsx` files (next-swc-loader emits JSX that the
+    // webpack default parser then chokes on with "Unexpected token"). Use
+    // Next.js's default compiler (turbopack in 16+) — App Router `.jsx` is
+    // handled correctly there.
     const child = spawn(invocation.command, [
       ...invocation.baseArgs,
       'dev',
-      '--webpack',
       '-p',
       String(port),
     ], {

package/lib/pptx-studio-mcp-core.js

@@ -1454,14 +1454,22 @@ function renderAnimationCatalogText(catalog) {
 }
 
 function renderLocalSlideEditorText(data) {
+  const editorUrl = data.editorUrl || 'unavailable';
   const lines = [
     data.reused ? '# Local slide editor reused' : '# Local slide editor started',
     '',
+    '⚠️ IMPORTANT: Open the Editor URL below EXACTLY as written.',
+    '   - Do NOT change the origin. The hosted https://html2pptx.app/edit-slide',
+    '     page cannot reach a localhost bridge from a user\'s browser (mixed-',
+    '     content + CORS) and will return an error page (Issue #71).',
+    '   - Do NOT strip the URL fragment (#bridgeToken=...). The localhost',
+    '     bridge requires that token to accept requests.',
+    '',
     `File: ${data.file || 'unknown'}`,
     `Bridge: ${data.bridgeUrl || 'unknown'}`,
     `Session: ${data.sessionId || 'unknown'}`,
     '',
-    `Editor URL: ${data.editorUrl || 'unavailable'}`,
+    `Editor URL: ${editorUrl}`,
     '',
     'Keep this MCP server running while editing. Use html2pptx_stop_local_slide_editor with the sessionId when you are done.',
   ];

package/local-editor-app/package.json

@@ -2,6 +2,6 @@
   "private": true,
   "type": "module",
   "scripts": {
-    "dev": "next dev --webpack"
+    "dev": "next dev"
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "html2pptx-local-mcp",
-  "version": "1.1.24",
+  "version": "1.1.26",
   "type": "module",
   "description": "Local stdio MCP server for opening html2pptx slide HTML in the local edit-slide editor.",
   "bin": {
@@ -31,6 +31,7 @@
     "@clack/prompts": "^0.10.1",
     "commander": "^13.1.0",
     "framer-motion": "^12.38.0",
+    "html2canvas": "^1.4.1",
     "jsdom": "^26.1.0",
     "lucide-react": "^1.7.0",
     "next": "^16.2.2",

package/cli/dist/dist/commands/config-show.d.ts

@@ -1 +0,0 @@
-export declare function configShowCommand(): Promise<void>;

package/cli/dist/dist/commands/config-show.js

@@ -1,16 +0,0 @@
-import * as p from "@clack/prompts";
-import pc from "picocolors";
-import { loadConfig, getConfigPath } from "../config.js";
-export async function configShowCommand() {
-    const config = await loadConfig();
-    const configPath = getConfigPath();
-    p.log.info(pc.bold("Config file: ") + pc.dim(configPath));
-    if (!config.apiKey) {
-        p.log.warn("No configuration found. Run " + pc.cyan("html2pptx login") + " to set up.");
-        return;
-    }
-    p.log.info(pc.bold("API Key: ") +
-        pc.dim(config.apiKey.slice(0, 12) + "..." + config.apiKey.slice(-4)));
-    p.log.info(pc.bold("API Base URL: ") +
-        (config.baseUrl ?? "https://html2pptx.app") + pc.dim(" (default)"));
-}

package/cli/dist/dist/commands/convert.d.ts

@@ -1,10 +0,0 @@
-interface ConvertOptions {
-    output?: string;
-    size?: string;
-    css?: string;
-    json?: boolean;
-    open?: boolean;
-    baseUrl?: string;
-}
-export declare function convertCommand(input?: string, options?: ConvertOptions): Promise<void>;
-export {};

package/cli/dist/dist/commands/convert.js

@@ -1,311 +0,0 @@
-import { readFile, writeFile } from "node:fs/promises";
-import { exec } from "node:child_process";
-import { platform } from "node:os";
-import { basename, resolve } from "node:path";
-import * as p from "@clack/prompts";
-import pc from "picocolors";
-import { loadConfig } from "../config.js";
-function parseSize(size) {
-    if (size === "16:9")
-        return { layout: "LAYOUT_16x9" };
-    if (size === "4:3")
-        return { layout: "LAYOUT_4x3" };
-    const match = size.match(/^(\d+)x(\d+)$/);
-    if (match)
-        return { width: parseInt(match[1]), height: parseInt(match[2]) };
-    return { layout: "LAYOUT_16x9" };
-}
-function formatDuration(ms) {
-    if (ms < 1000)
-        return `${ms}ms`;
-    return `${(ms / 1000).toFixed(1)}s`;
-}
-function openFile(filePath) {
-    const os = platform();
-    const cmd = os === "darwin" ? "open" : os === "win32" ? "start" : "xdg-open";
-    exec(`${cmd} "${filePath}"`);
-}
-async function interactivePrompt() {
-    p.intro(pc.bgCyan(pc.black(" html2pptx convert ")));
-    const result = await p.group({
-        input: () => p.text({
-            message: "HTML file to convert",
-            placeholder: "./slides.html",
-            validate(value) {
-                if (!value)
-                    return "HTML file path is required";
-                if (!value.endsWith(".html") && !value.endsWith(".htm"))
-                    return "File must be .html or .htm";
-            },
-        }),
-        size: () => p.select({
-            message: "Slide size",
-            options: [
-                { value: "16:9", label: "16:9 (1600x900)", hint: "default" },
-                { value: "4:3", label: "4:3 (1024x768)" },
-                { value: "custom", label: "Custom size" },
-            ],
-        }),
-        customSize: ({ results }) => {
-            if (results.size !== "custom")
-                return;
-            return p.text({
-                message: "Enter custom size (WxH)",
-                placeholder: "1920x1080",
-                validate(value) {
-                    if (!value?.match(/^\d+x\d+$/))
-                        return 'Format: WIDTHxHEIGHT (e.g. 1920x1080)';
-                },
-            });
-        },
-        css: () => p.text({
-            message: "External CSS file (optional)",
-            placeholder: "Press Enter to skip",
-        }),
-        output: ({ results }) => {
-            const defaultName = basename(results.input).replace(/\.html?$/, "") + ".pptx";
-            return p.text({
-                message: "Output filename",
-                placeholder: defaultName,
-                initialValue: defaultName,
-            });
-        },
-    }, {
-        onCancel() {
-            p.cancel("Conversion cancelled.");
-            process.exit(0);
-        },
-    });
-    return {
-        input: result.input,
-        output: result.output,
-        size: result.customSize ?? result.size,
-        css: result.css || undefined,
-    };
-}
-async function runExport(html, css, size, fileName, baseUrl, apiKey) {
-    const sizeParams = parseSize(size);
-    const body = {
-        html,
-        fileName,
-        responseFormat: "url",
-        ...sizeParams,
-    };
-    if (css)
-        body.css = css;
-    const res = await fetch(`${baseUrl}/api/v1/export/jobs`, {
-        method: "POST",
-        headers: {
-            "Content-Type": "application/json",
-            Authorization: `Bearer ${apiKey}`,
-        },
-        body: JSON.stringify(body),
-    });
-    if (res.status === 401) {
-        throw new Error("Invalid API key. Run `html2pptx login` to update your key.");
-    }
-    if (res.status === 403) {
-        throw new Error("Access denied. Your API key may be expired or your plan may have changed. Visit https://html2pptx.app/dashboard to check.");
-    }
-    if (res.status === 413) {
-        throw new Error("HTML payload too large for your plan. Try reducing the HTML size or upgrading your plan.");
-    }
-    if (res.status === 429) {
-        throw new Error("Rate limit exceeded. Please wait a moment and try again, or upgrade your plan for higher limits.");
-    }
-    if (!res.ok) {
-        const text = await res.text();
-        throw new Error(`API error ${res.status}: ${text}`);
-    }
-    return (await res.json());
-}
-async function pollJob(statusUrl, apiKey, baseUrl) {
-    if (!statusUrl.startsWith(baseUrl)) {
-        throw new Error("Unexpected status URL from server");
-    }
-    const maxAttempts = 60;
-    for (let i = 0; i < maxAttempts; i++) {
-        await new Promise((r) => setTimeout(r, 2000));
-        const res = await fetch(statusUrl, {
-            headers: { Authorization: `Bearer ${apiKey}` },
-        });
-        if (!res.ok) {
-            const text = await res.text();
-            throw new Error(`Poll error ${res.status}: ${text}`);
-        }
-        const data = (await res.json());
-        if (data.status === "completed")
-            return data;
-        if (data.status === "failed")
-            throw new Error(data.error ?? "Export failed");
-    }
-    throw new Error("Export timed out after 2 minutes");
-}
-async function downloadFile(url, outputPath) {
-    const res = await fetch(url);
-    if (!res.ok)
-        throw new Error(`Download failed: ${res.status}`);
-    const buffer = Buffer.from(await res.arrayBuffer());
-    await writeFile(outputPath, buffer);
-    return buffer.byteLength;
-}
-function formatBytes(bytes) {
-    if (bytes < 1024)
-        return `${bytes} B`;
-    if (bytes < 1024 * 1024)
-        return `${(bytes / 1024).toFixed(1)} KB`;
-    return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
-}
-export async function convertCommand(input, options = {}) {
-    const config = await loadConfig();
-    const apiKey = config.apiKey;
-    const baseUrl = options.baseUrl ?? config.baseUrl ?? "https://html2pptx.app";
-    const jsonMode = options.json ?? false;
-    if (!apiKey) {
-        if (jsonMode) {
-            console.log(JSON.stringify({ success: false, error: "No API key found. Run html2pptx login first." }));
-            process.exit(1);
-        }
-        p.log.error("No API key found. Run " + pc.cyan("html2pptx login") + " first.");
-        process.exit(1);
-    }
-    let htmlPath;
-    let outputFile;
-    let size;
-    let cssPath;
-    // If args provided -> direct mode, else -> interactive mode
-    if (input) {
-        htmlPath = resolve(input);
-        outputFile =
-            options.output ?? basename(htmlPath).replace(/\.html?$/, "") + ".pptx";
-        size = options.size ?? "16:9";
-        cssPath = options.css;
-    }
-    else {
-        const answers = await interactivePrompt();
-        htmlPath = resolve(answers.input);
-        outputFile = answers.output;
-        size = answers.size;
-        cssPath = answers.css;
-    }
-    const startTime = Date.now();
-    const spinner = jsonMode ? null : p.spinner();
-    spinner?.start("Reading HTML file...");
-    let html;
-    try {
-        html = await readFile(htmlPath, "utf-8");
-    }
-    catch {
-        if (jsonMode) {
-            console.log(JSON.stringify({ success: false, error: `Could not read file: ${htmlPath}` }));
-        }
-        else {
-            spinner?.stop("Failed");
-            p.log.error(`Could not read file: ${pc.dim(htmlPath)}`);
-        }
-        process.exit(1);
-    }
-    let css;
-    if (cssPath) {
-        try {
-            css = await readFile(resolve(cssPath), "utf-8");
-        }
-        catch {
-            if (jsonMode) {
-                console.log(JSON.stringify({ success: false, error: `Could not read CSS file: ${cssPath}` }));
-            }
-            else {
-                spinner?.stop("Failed");
-                p.log.error(`Could not read CSS file: ${pc.dim(cssPath)}`);
-            }
-            process.exit(1);
-        }
-    }
-    spinner?.message("Sending to html2pptx API...");
-    let job;
-    try {
-        job = await runExport(html, css, size, outputFile, baseUrl, apiKey);
-    }
-    catch (e) {
-        const errMsg = e.message;
-        if (jsonMode) {
-            console.log(JSON.stringify({ success: false, error: errMsg }));
-        }
-        else {
-            spinner?.stop("Failed");
-            p.log.error(errMsg);
-        }
-        process.exit(1);
-    }
-    const finishConversion = async (downloadUrl) => {
-        spinner?.message("Downloading PPTX...");
-        const fileSize = await downloadFile(downloadUrl, resolve(outputFile));
-        const duration = Date.now() - startTime;
-        if (jsonMode) {
-            const result = {
-                success: true,
-                file: outputFile,
-                size: formatBytes(fileSize),
-                duration: formatDuration(duration),
-            };
-            console.log(JSON.stringify(result));
-        }
-        else {
-            spinner?.stop(pc.green("Done!"));
-            p.log.success(`Saved to ${pc.cyan(outputFile)} ${pc.dim(`(${formatBytes(fileSize)}, ${formatDuration(duration)})`)}`);
-            // Next steps guidance
-            p.log.info(pc.dim("Next: ") +
-                `Open the file or run ${pc.cyan("html2pptx status")} to check your usage.`);
-        }
-        if (options.open) {
-            openFile(resolve(outputFile));
-        }
-    };
-    // If job completed immediately
-    if (job.status === "completed" && job.downloadUrl) {
-        try {
-            await finishConversion(job.downloadUrl);
-            return;
-        }
-        catch (e) {
-            const errMsg = e.message;
-            if (jsonMode) {
-                console.log(JSON.stringify({ success: false, error: errMsg }));
-            }
-            else {
-                spinner?.stop("Failed");
-                p.log.error(errMsg);
-            }
-            process.exit(1);
-        }
-    }
-    // Poll for completion
-    spinner?.message("Converting... this may take a moment");
-    try {
-        const result = await pollJob(job.statusUrl, apiKey, baseUrl);
-        if (result.downloadUrl) {
-            await finishConversion(result.downloadUrl);
-        }
-        else {
-            if (jsonMode) {
-                console.log(JSON.stringify({ success: false, error: "No download URL returned" }));
-            }
-            else {
-                spinner?.stop("Failed");
-                p.log.error("No download URL returned");
-            }
-            process.exit(1);
-        }
-    }
-    catch (e) {
-        const errMsg = e.message;
-        if (jsonMode) {
-            console.log(JSON.stringify({ success: false, error: errMsg }));
-        }
-        else {
-            spinner?.stop("Failed");
-            p.log.error(errMsg);
-        }
-        process.exit(1);
-    }
-}

package/cli/dist/dist/commands/edit.d.ts

@@ -1,34 +0,0 @@
-import { type IncomingMessage, type ServerResponse } from "node:http";
-export interface EditOptions {
-    port?: string;
-    baseUrl?: string;
-    noOpen?: boolean;
-    open?: boolean;
-    json?: boolean;
-}
-interface BridgeContext {
-    root: string;
-    editorOrigin: string;
-    localStateDir: string;
-    sessionToken: string;
-}
-declare function generateSessionToken(): string;
-declare function parsePort(value: string | undefined): number;
-declare function normalizeBaseUrl(raw: string): URL;
-declare function readRegisteredEditorBaseUrl(root: string): Promise<string | null>;
-declare function resolveEditorBaseUrl(root: string, explicitBaseUrl: string | undefined): Promise<URL>;
-declare function buildEditorUrl(baseUrl: URL, rel: string, bridgeUrl: string, sessionToken: string): URL;
-declare function createBridgeServer(ctx: BridgeContext): import("http").Server<typeof IncomingMessage, typeof ServerResponse>;
-declare function listen(server: ReturnType<typeof createBridgeServer>, requestedPort: number): Promise<number>;
-export declare function editCommand(input: string | undefined, options?: EditOptions): Promise<void>;
-export declare const editCommandInternalsForTest: {
-    buildEditorUrl: typeof buildEditorUrl;
-    createBridgeServer: typeof createBridgeServer;
-    generateSessionToken: typeof generateSessionToken;
-    listen: typeof listen;
-    normalizeBaseUrl: typeof normalizeBaseUrl;
-    parsePort: typeof parsePort;
-    readRegisteredEditorBaseUrl: typeof readRegisteredEditorBaseUrl;
-    resolveEditorBaseUrl: typeof resolveEditorBaseUrl;
-};
-export {};