@liustack/pagepress 2.0.0 → 3.0.0

package/dist/main.js

@@ -3,12 +3,78 @@ import { Command } from "commander";
 import { chromium } from "playwright";
 import * as fs from "fs";
 import * as path from "path";
-import { pathToFileURL } from "url";
+import { fileURLToPath, pathToFileURL } from "url";
+import { createRequire } from "module";
+import { Renderer, marked } from "marked";
+import matter from "gray-matter";
+import hljs from "highlight.js";
+import { execFile } from "child_process";
+const pdfTemplates = {
+  default: {
+    name: "default",
+    description: "Clean minimalist design",
+    file: "default.html"
+  },
+  github: {
+    name: "github",
+    description: "GitHub-flavored markdown style",
+    file: "github.html"
+  },
+  magazine: {
+    name: "magazine",
+    description: "VOGUE/WIRED premium magazine style",
+    file: "magazine.html"
+  }
+};
+function getTemplate(name) {
+  const template = pdfTemplates[name];
+  if (!template) {
+    throw new Error(`Unknown PDF template: ${name}. Available: ${Object.keys(pdfTemplates).join(", ")}`);
+  }
+  return template;
+}
+const require$2 = createRequire(import.meta.url);
+const MAGAZINE_FONTS = [
+  "@fontsource/bebas-neue/400.css",
+  "@fontsource/cormorant-garamond/400.css",
+  "@fontsource/cormorant-garamond/400-italic.css",
+  "@fontsource/cormorant-garamond/600.css",
+  "@fontsource/inter/300.css",
+  "@fontsource/inter/400.css",
+  "@fontsource/inter/500.css"
+];
+function getFontCSS(template) {
+  if (template !== "magazine") {
+    return "";
+  }
+  const cssChunks = [];
+  for (const fontPath of MAGAZINE_FONTS) {
+    try {
+      const cssFilePath = require$2.resolve(fontPath);
+      let css = fs.readFileSync(cssFilePath, "utf-8");
+      const cssDir = path.dirname(cssFilePath);
+      css = css.replace(/url\(\.\/files\/([^)]+)\)/g, (match, filename) => {
+        const fontFilePath = path.join(cssDir, "files", filename);
+        if (fs.existsSync(fontFilePath)) {
+          const fontData = fs.readFileSync(fontFilePath);
+          const base64 = fontData.toString("base64");
+          const ext = path.extname(filename).slice(1);
+          const mimeType = ext === "woff2" ? "font/woff2" : `font/${ext}`;
+          return `url(data:${mimeType};base64,${base64})`;
+        }
+        return match;
+      });
+      cssChunks.push(css);
+    } catch (e) {
+      console.warn(`Warning: Could not load font ${fontPath}:`, e);
+    }
+  }
+  return cssChunks.join("\n");
+}
+const __filename$1 = fileURLToPath(import.meta.url);
+const __dirname$1 = path.dirname(__filename$1);
+const require$1 = createRequire(import.meta.url);
 const WAIT_UNTIL_STATES = /* @__PURE__ */ new Set(["load", "domcontentloaded", "networkidle"]);
-const MIN_SCALE = 1;
-const MAX_SCALE = 4;
-const DEFAULT_WIDTH = 1200;
-const DEFAULT_HEIGHT = 630;
 function normalizeWaitUntil(value) {
   if (!value) return "networkidle";
   if (WAIT_UNTIL_STATES.has(value)) {
@@ -23,40 +89,92 @@ function normalizeTimeout(value) {
   }
   return value;
 }
-function validateRange(name, value, min, max) {
-  if (!Number.isFinite(value)) {
-    throw new Error(`${name} must be a finite number.`);
-  }
-  if (value < min || value > max) {
-    throw new Error(`${name} must be between ${min} and ${max}. Received: ${value}.`);
+function findTemplatesDir() {
+  const candidates = [
+    // When running from project root (dev/installed)
+    path.resolve(process.cwd(), "src/templates"),
+    // Relative to dist/main.js
+    path.resolve(__dirname$1, "..", "src", "templates"),
+    // Relative to source file location
+    path.resolve(__dirname$1, "templates")
+  ];
+  for (const dir of candidates) {
+    if (fs.existsSync(dir)) return dir;
   }
+  throw new Error(`Templates directory not found. Searched: ${candidates.join(", ")}`);
 }
 async function render(options) {
-  const width = options.width ?? DEFAULT_WIDTH;
-  const height = options.height ?? DEFAULT_HEIGHT;
-  const scale = options.scale ?? 2;
+  const template = getTemplate(options.template ?? "default");
   const safeMode = options.safe ?? false;
   const waitUntil = normalizeWaitUntil(options.waitUntil);
   const timeout = normalizeTimeout(options.timeout);
-  validateRange("Width", width, 1, 1e4);
-  validateRange("Height", height, 1, 1e4);
-  validateRange("Scale", scale, MIN_SCALE, MAX_SCALE);
+  const templatesDir = findTemplatesDir();
+  const templatePath = path.join(templatesDir, template.file);
+  if (!fs.existsSync(templatePath)) {
+    throw new Error(`Template not found: ${templatePath}`);
+  }
+  const inputPath = path.resolve(options.input);
   if (options.input.startsWith("http://") || options.input.startsWith("https://")) {
-    throw new Error("Remote URL inputs are not supported. Please provide a local HTML file path.");
+    throw new Error("Remote URL inputs are not supported. Please provide a local Markdown file path.");
   }
-  if (!options.input.endsWith(".html")) {
-    throw new Error(`Unsupported input format: ${options.input}. Only HTML (.html) files are supported.`);
+  if (!options.input.endsWith(".md")) {
+    throw new Error(`Unsupported input format: ${options.input}. Only Markdown (.md) files are supported.`);
   }
-  const inputPath = path.resolve(options.input);
-  const htmlContent = fs.readFileSync(inputPath, "utf-8");
+  const raw = fs.readFileSync(inputPath, "utf-8");
+  const { data: frontmatter, content } = matter(raw);
+  const hasMermaid = /```mermaid/i.test(content);
+  const renderer = new Renderer();
+  renderer.code = function({ text, lang }) {
+    if (lang === "mermaid") {
+      return `<pre class="mermaid">${text}</pre>`;
+    }
+    const highlighted = lang && hljs.getLanguage(lang) ? hljs.highlight(text, { language: lang }).value : hljs.highlightAuto(text).value;
+    const langClass = lang ? `hljs language-${lang}` : "hljs";
+    return `<pre><code class="${langClass}">${highlighted}</code></pre>`;
+  };
+  marked.use({ renderer });
+  const bodyHtml = await marked.parse(content);
+  const title = frontmatter.title || "Document";
+  const isDarkTheme = template.name === "magazine";
+  const hljsLightStyles = `
+<style>
+/* highlight.js GitHub Light Theme */
+.hljs { color: #24292e; }
+.hljs-comment, .hljs-quote { color: #6a737d; font-style: italic; }
+.hljs-keyword, .hljs-selector-tag, .hljs-literal, .hljs-type { color: #d73a49; font-weight: 600; }
+.hljs-string, .hljs-attr, .hljs-symbol, .hljs-bullet, .hljs-addition { color: #032f62; }
+.hljs-number { color: #005cc5; }
+.hljs-title, .hljs-section, .hljs-function .hljs-title { color: #6f42c1; }
+.hljs-built_in, .hljs-name { color: #005cc5; }
+.hljs-class .hljs-title { color: #e36209; }
+.hljs-meta { color: #6f42c1; }
+.hljs-variable, .hljs-template-variable { color: #e36209; }
+.hljs-params { color: #24292e; }
+</style>
+`;
+  const hljsDarkStyles = `
+<style>
+/* highlight.js Dark Theme for Magazine */
+.hljs { color: #e8e8e8; }
+.hljs-comment, .hljs-quote { color: #6b7280; font-style: italic; }
+.hljs-keyword, .hljs-selector-tag, .hljs-literal, .hljs-type { color: #f0abfc; }
+.hljs-string, .hljs-attr, .hljs-symbol, .hljs-bullet, .hljs-addition { color: #86efac; }
+.hljs-number { color: #fcd34d; }
+.hljs-title, .hljs-section, .hljs-function .hljs-title { color: #93c5fd; }
+.hljs-built_in, .hljs-name { color: #93c5fd; }
+.hljs-class .hljs-title { color: #67e8f9; }
+.hljs-meta { color: #f0abfc; }
+.hljs-variable, .hljs-template-variable { color: #fcd34d; }
+.hljs-params { color: #e8e8e8; }
+</style>
+`;
+  const hljsStyles = isDarkTheme ? hljsDarkStyles : hljsLightStyles;
+  let templateHtml = fs.readFileSync(templatePath, "utf-8");
+  const htmlContent = templateHtml.replace(/\{\{title\}\}/g, title).replace(/\{\{body\}\}/g, bodyHtml).replace(/\{\{styles\}\}/g, hljsStyles);
   let browser = null;
   try {
     browser = await chromium.launch({ headless: true });
-    const context = await browser.newContext({
-      viewport: { width, height },
-      deviceScaleFactor: scale,
-      javaScriptEnabled: !safeMode
-    });
+    const context = await browser.newContext({ javaScriptEnabled: !safeMode });
     if (safeMode) {
       await context.route("**/*", (route) => {
         const url = route.request().url();
@@ -69,38 +187,124 @@ async function render(options) {
     const page = await context.newPage();
     await page.goto(pathToFileURL(inputPath).href, { waitUntil: "domcontentloaded", timeout });
     await page.setContent(htmlContent, { waitUntil, timeout });
-    await page.addStyleTag({
-      content: `
-                html, body {
-                    width: ${width}px;
-                    height: ${height}px;
-                    margin: 0;
-                    padding: 0;
-                    overflow: hidden;
-                }
-            `
-    });
-    await page.waitForTimeout(500);
-    const cardContainer = await page.$("#container");
-    if (!cardContainer) {
-      throw new Error('Missing #container element. PNG output requires a <div id="container"> wrapper.');
+    const fontCSS = getFontCSS(template.name);
+    if (fontCSS) {
+      await page.addStyleTag({ content: fontCSS });
     }
-    const box = await cardContainer.boundingBox();
-    if (!box || box.width <= 0 || box.height <= 0) {
-      throw new Error("Invalid #container size. Ensure it has a positive width and height.");
+    if (hasMermaid && !safeMode) {
+      const mermaidPath = require$1.resolve("mermaid/dist/mermaid.min.js");
+      await page.addScriptTag({ path: mermaidPath });
+      const templateName = template.name;
+      await page.evaluate((tpl) => {
+        const defaultTheme = {
+          primaryColor: "#f5f5f7",
+          primaryTextColor: "#1d1d1f",
+          primaryBorderColor: "#d2d2d7",
+          lineColor: "#86868b",
+          secondaryColor: "#f5f5f7",
+          tertiaryColor: "#ffffff",
+          background: "#ffffff",
+          mainBkg: "#f5f5f7",
+          nodeBorder: "#d2d2d7",
+          nodeTextColor: "#1d1d1f",
+          clusterBkg: "rgba(0, 0, 0, 0.02)",
+          clusterBorder: "rgba(0, 0, 0, 0.1)",
+          titleColor: "#1d1d1f"
+        };
+        const githubTheme = {
+          primaryColor: "#f6f8fa",
+          primaryTextColor: "#1f2328",
+          primaryBorderColor: "#d0d7de",
+          lineColor: "#656d76",
+          secondaryColor: "#f6f8fa",
+          tertiaryColor: "#ffffff",
+          background: "#ffffff",
+          mainBkg: "#f6f8fa",
+          nodeBorder: "#d0d7de",
+          nodeTextColor: "#1f2328",
+          clusterBkg: "rgba(208, 215, 222, 0.2)",
+          clusterBorder: "#d0d7de",
+          titleColor: "#1f2328"
+        };
+        const magazineTheme = {
+          primaryColor: "#2a2a2a",
+          primaryTextColor: "#ffffff",
+          primaryBorderColor: "#c41e3a",
+          lineColor: "#666666",
+          secondaryColor: "#1a1a1a",
+          tertiaryColor: "#0f0f0f",
+          background: "#0f0f0f",
+          mainBkg: "#2a2a2a",
+          nodeBorder: "#c41e3a",
+          nodeTextColor: "#ffffff",
+          clusterBkg: "rgba(196, 30, 58, 0.1)",
+          clusterBorder: "rgba(196, 30, 58, 0.4)",
+          titleColor: "#ffffff"
+        };
+        const themes = {
+          default: defaultTheme,
+          github: githubTheme,
+          magazine: magazineTheme
+        };
+        const activeTheme = themes[tpl] || defaultTheme;
+        window.mermaid.initialize({
+          startOnLoad: false,
+          theme: "base",
+          themeVariables: {
+            ...activeTheme,
+            fontFamily: '"SF Mono", "Fira Code", Menlo, monospace',
+            fontSize: "13px"
+          },
+          flowchart: {
+            curve: "basis",
+            nodeSpacing: 40,
+            rankSpacing: 50,
+            htmlLabels: true,
+            useMaxWidth: true,
+            subGraphTitleMargin: { top: 15, bottom: 15 },
+            padding: 20
+          }
+        });
+      }, templateName);
+      await page.evaluate(() => {
+        return window.mermaid.run();
+      });
+      await page.waitForSelector(".mermaid svg", { timeout: 5e3 });
+      await page.waitForTimeout(300);
+      await page.evaluate(() => {
+        document.querySelectorAll(".node rect").forEach((rect) => {
+          rect.setAttribute("rx", "12");
+          rect.setAttribute("ry", "12");
+        });
+        document.querySelectorAll(".cluster rect").forEach((rect) => {
+          rect.setAttribute("rx", "16");
+          rect.setAttribute("ry", "16");
+        });
+        document.querySelectorAll(".cluster-label").forEach((label) => {
+          const transform = label.getAttribute("transform");
+          if (transform) {
+            const match = transform.match(/translate\(([\d.]+),\s*([\d.]+)\)/);
+            if (match) {
+              const x = parseFloat(match[1]);
+              const y = parseFloat(match[2]) + 8;
+              label.setAttribute("transform", `translate(${x}, ${y})`);
+            }
+          }
+        });
+      });
     }
+    await page.waitForTimeout(200);
     const outputPath = path.resolve(options.output);
-    await page.screenshot({
+    await page.pdf({
       path: outputPath,
-      type: "png",
-      clip: { x: box.x, y: box.y, width: box.width, height: box.height }
+      format: "A4",
+      margin: { top: "0", right: "0", bottom: "0", left: "0" },
+      printBackground: true
     });
     return {
-      pngPath: outputPath,
+      pdfPath: outputPath,
       meta: {
-        width,
-        height,
-        deviceScaleFactor: scale,
+        template: template.name,
         generatedAt: (/* @__PURE__ */ new Date()).toISOString()
       }
     };
@@ -110,9 +314,107 @@ async function render(options) {
     }
   }
 }
-const program = new Command();
-program.name("pagepress").description("Generate one-page visual reports, dashboards, and infographics from HTML").version("2.0.0").requiredOption("-i, --input <path>", "Input HTML file path").requiredOption("-o, --output <path>", "Output PNG file path").option("-w, --width <pixels>", "Viewport width in pixels", "1200").option("-h, --height <pixels>", "Viewport height in pixels", "630").option("--scale <number>", "Device scale factor (1-4)", "2").option("--wait-until <state>", "Navigation waitUntil (load, domcontentloaded, networkidle)", "networkidle").option("--timeout <ms>", "Navigation timeout in milliseconds", "30000").option("--safe", "Disable external network requests and JavaScript execution").action(async (options) => {
+const PACKAGE_NAME = "@liustack/pagepress";
+function normalizeVersion(version) {
+  const normalized = version.trim().replace(/^v/i, "").split("-")[0];
+  if (!normalized) {
+    throw new Error(`Invalid version: ${version}`);
+  }
+  return normalized;
+}
+function parseVersion(version) {
+  return normalizeVersion(version).split(".").map((segment) => {
+    const value = Number.parseInt(segment, 10);
+    if (!Number.isFinite(value)) {
+      throw new Error(`Invalid version segment: ${segment}`);
+    }
+    return value;
+  });
+}
+function compareVersions(left, right) {
+  const leftParts = parseVersion(left);
+  const rightParts = parseVersion(right);
+  const length = Math.max(leftParts.length, rightParts.length);
+  for (let index = 0; index < length; index += 1) {
+    const leftValue = leftParts[index] ?? 0;
+    const rightValue = rightParts[index] ?? 0;
+    if (leftValue < rightValue) return -1;
+    if (leftValue > rightValue) return 1;
+  }
+  return 0;
+}
+const runCommand = (command, args) => new Promise((resolve, reject) => {
+  execFile(command, args, { encoding: "utf-8" }, (error, stdout, stderr) => {
+    if (error) {
+      const message = stderr.trim() || error.message;
+      reject(new Error(message));
+      return;
+    }
+    resolve(stdout.trim());
+  });
+});
+const resolvePlaywrightCliPath = () => {
+  const require2 = createRequire(import.meta.url);
+  const playwrightPackagePath = require2.resolve("playwright/package.json");
+  const playwrightPackage = JSON.parse(fs.readFileSync(playwrightPackagePath, "utf-8"));
+  const cliRelativePath = playwrightPackage.bin?.playwright;
+  if (!cliRelativePath) {
+    throw new Error("Unable to resolve Playwright CLI.");
+  }
+  return path.resolve(path.dirname(playwrightPackagePath), cliRelativePath);
+};
+async function checkForUpdate({
+  currentVersion,
+  packageName = PACKAGE_NAME,
+  run = runCommand
+}) {
+  const normalizedCurrentVersion = normalizeVersion(currentVersion);
   try {
+    const latestVersion = normalizeVersion(await run("npm", ["view", packageName, "version"]));
+    return {
+      packageName,
+      currentVersion: normalizedCurrentVersion,
+      latestVersion,
+      updateAvailable: compareVersions(normalizedCurrentVersion, latestVersion) < 0,
+      checked: true
+    };
+  } catch (error) {
+    return {
+      packageName,
+      currentVersion: normalizedCurrentVersion,
+      latestVersion: null,
+      updateAvailable: false,
+      checked: false,
+      error: error instanceof Error ? error.message : String(error)
+    };
+  }
+}
+function createSelfUpdater(run = runCommand, resolvePlaywrightCli = resolvePlaywrightCliPath) {
+  return async ({
+    currentVersion,
+    packageName = PACKAGE_NAME
+  }) => {
+    const updateInfo = await checkForUpdate({ currentVersion, packageName, run });
+    if (!updateInfo.checked) {
+      throw new Error(`Unable to check for updates: ${updateInfo.error ?? "unknown error"}`);
+    }
+    if (!updateInfo.updateAvailable) {
+      return {
+        ...updateInfo,
+        updated: false
+      };
+    }
+    await run("npm", ["install", "-g", `${packageName}@latest`]);
+    await run(process.execPath, [resolvePlaywrightCli(), "install", "chromium"]);
+    return {
+      ...updateInfo,
+      updated: true
+    };
+  };
+}
+async function runRenderCommand() {
+  const program = new Command();
+  program.name("pagepress").description("Render local Markdown files to PDF").version("3.0.0").requiredOption("-i, --input <path>", "Input Markdown file path").requiredOption("-o, --output <path>", "Output PDF file path").option("-t, --template <name>", "PDF template (default, github, magazine)", "default").option("--wait-until <state>", "Navigation waitUntil (load, domcontentloaded, networkidle)", "networkidle").option("--timeout <ms>", "Navigation timeout in milliseconds", "30000").option("--safe", "Disable external network requests and JavaScript execution").action(async (options) => {
     const timeout = Number.parseInt(options.timeout, 10);
     if (!Number.isFinite(timeout) || timeout < 0) {
       throw new Error("Invalid --timeout value. Use a non-negative integer in milliseconds.");
@@ -120,17 +422,37 @@ program.name("pagepress").description("Generate one-page visual reports, dashboa
     const result = await render({
       input: options.input,
       output: options.output,
-      width: Number.parseInt(options.width, 10),
-      height: Number.parseInt(options.height, 10),
-      scale: Number.parseFloat(options.scale),
+      template: options.template,
       waitUntil: options.waitUntil,
       timeout,
       safe: options.safe
     });
     console.log(JSON.stringify(result, null, 2));
-  } catch (error) {
-    console.error("Error:", error instanceof Error ? error.message : error);
-    process.exit(1);
+  });
+  await program.parseAsync(process.argv);
+}
+async function runCheckUpdateCommand() {
+  const result = await checkForUpdate({ currentVersion: "3.0.0" });
+  console.log(JSON.stringify(result, null, 2));
+}
+async function runSelfUpdateCommand() {
+  const selfUpdate = createSelfUpdater();
+  const result = await selfUpdate({ currentVersion: "3.0.0" });
+  console.log(JSON.stringify(result, null, 2));
+}
+async function main() {
+  const command = process.argv[2];
+  if (command === "check-update") {
+    await runCheckUpdateCommand();
+    return;
   }
+  if (command === "self-update") {
+    await runSelfUpdateCommand();
+    return;
+  }
+  await runRenderCommand();
+}
+main().catch((error) => {
+  console.error("Error:", error instanceof Error ? error.message : error);
+  process.exit(1);
 });
-program.parse();

package/package.json

@@ -1,32 +1,22 @@
 {
   "name": "@liustack/pagepress",
-  "version": "2.0.0",
-  "description": "CLI tool to generate one-page visual reports, dashboards, and infographics from HTML",
+  "version": "3.0.0",
+  "description": "CLI tool to render local Markdown files into polished PDF documents",
   "type": "module",
   "bin": {
     "pagepress": "./dist/main.js"
   },
-  "scripts": {
-    "dev": "vite build --watch",
-    "build": "vite build",
-    "typecheck": "tsc --noEmit",
-    "test": "vitest run",
-    "test:watch": "vitest",
-    "test:coverage": "vitest run --coverage",
-    "prepublishOnly": "pnpm build",
-    "docs:list": "node scripts/docs-list.js"
-  },
   "files": [
-    "dist"
+    "dist",
+    "src/templates"
   ],
   "keywords": [
-    "infographic",
-    "html-to-png",
-    "visual-report",
-    "dashboard",
-    "screenshot",
+    "pdf",
+    "markdown-to-pdf",
+    "pdf-report",
     "cli",
-    "playwright"
+    "playwright",
+    "mermaid"
   ],
   "author": "Leon Liu",
   "license": "MIT",
@@ -42,7 +32,15 @@
     "node": ">=18"
   },
   "dependencies": {
+    "@fontsource/bebas-neue": "^5.2.7",
+    "@fontsource/cormorant-garamond": "^5.2.11",
+    "@fontsource/inter": "^5.2.8",
     "commander": "^13.1.0",
+    "gray-matter": "^4.0.3",
+    "highlight.js": "^11.11.1",
+    "marked": "^15.0.12",
+    "marked-highlight": "^2.2.3",
+    "mermaid": "^11.12.2",
     "playwright": "^1.58.1"
   },
   "devDependencies": {
@@ -52,5 +50,14 @@
     "vite": "^6.4.1",
     "vite-plugin-node": "^5.0.1",
     "vitest": "^4.0.18"
+  },
+  "scripts": {
+    "dev": "vite build --watch",
+    "build": "vite build",
+    "typecheck": "tsc --noEmit",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "test:coverage": "vitest run --coverage",
+    "docs:list": "node scripts/docs-list.js"
   }
-}
+}