pdfn 0.1.0 → 0.2.0

package/README.md

@@ -56,7 +56,8 @@ npx pdfn serve --max-concurrent 10      # Concurrency limit
 Add starter templates to your project.
 
 ```bash
-npx pdfn add invoice            # Add invoice template
+npx pdfn add invoice            # Add invoice template (inline styles)
+npx pdfn add invoice --tailwind # Add with Tailwind classes
 npx pdfn add letter             # Add business letter
 npx pdfn add contract           # Add contract template
 npx pdfn add ticket             # Add event ticket
@@ -65,6 +66,13 @@ npx pdfn add --list             # Show all templates
 npx pdfn add invoice --output ./src/templates
 ```
 
+| Option | Default | Description |
+|--------|---------|-------------|
+| `--inline` | ✓ | Use inline styles (default, no extra dependencies) |
+| `--tailwind` | | Use Tailwind CSS classes (requires `@pdfn/tailwind`) |
+| `--output` | `./pdf-templates` | Output directory |
+| `--force` | | Overwrite existing files |
+
 | Template | Description | Page Size |
 |----------|-------------|-----------|
 | `invoice` | Professional invoice with itemized billing | A4 |

package/dist/cli.js

@@ -5,8 +5,8 @@ import { Command as Command4 } from "commander";
 
 // src/commands/dev.ts
 import { Command } from "commander";
-import { existsSync, readdirSync, readFileSync } from "fs";
-import { join, resolve } from "path";
+import { existsSync as existsSync2, readdirSync, readFileSync } from "fs";
+import { join, resolve as resolve2 } from "path";
 import { createServer as createViteServer } from "vite";
 import { WebSocketServer, WebSocket } from "ws";
 import chokidar from "chokidar";
@@ -411,9 +411,32 @@ function createBaseServer(options = {}) {
 
 // src/commands/dev.ts
 import { injectDebugSupport } from "@pdfn/react/debug";
+import { pdfnTailwind } from "@pdfn/vite";
 import chalk from "chalk";
+
+// src/utils/env.ts
+import { existsSync } from "fs";
+import { resolve } from "path";
+import { config } from "dotenv";
+function loadEnv(mode) {
+  const cwd = process.cwd();
+  const envFiles = [
+    ".env",
+    ".env.local",
+    `.env.${mode}`,
+    `.env.${mode}.local`
+  ];
+  for (const file of envFiles) {
+    const filePath = resolve(cwd, file);
+    if (existsSync(filePath)) {
+      config({ path: filePath, override: true, quiet: true });
+    }
+  }
+}
+
+// src/commands/dev.ts
 async function scanTemplates(templatesDir) {
-  if (!existsSync(templatesDir)) {
+  if (!existsSync2(templatesDir)) {
     return [];
   }
   let configData = {};
@@ -423,11 +446,11 @@ async function scanTemplates(templatesDir) {
     join(templatesDir, "templates.json")
   ];
   for (const configPath of configPaths) {
-    if (existsSync(configPath)) {
+    if (existsSync2(configPath)) {
       try {
-        const config = JSON.parse(readFileSync(configPath, "utf-8"));
-        if (config.templates && Array.isArray(config.templates)) {
-          for (const t of config.templates) {
+        const config2 = JSON.parse(readFileSync(configPath, "utf-8"));
+        if (config2.templates && Array.isArray(config2.templates)) {
+          for (const t of config2.templates) {
             if (t.id && t.sampleData) {
               configData[t.id] = t.sampleData;
             }
@@ -1440,8 +1463,8 @@ function createPreviewHTML(templates, activeTemplate) {
 </html>`;
 }
 async function startDevServer(options) {
-  const { port, templatesDir, open } = options;
-  const absoluteTemplatesDir = resolve(process.cwd(), templatesDir);
+  const { port, templatesDir, open, mode } = options;
+  const absoluteTemplatesDir = resolve2(process.cwd(), templatesDir);
   console.log(chalk.bold("\n  pdfn dev\n"));
   console.log(chalk.dim("  Initializing..."));
   let templates = await scanTemplates(absoluteTemplatesDir);
@@ -1473,6 +1496,12 @@ async function startDevServer(options) {
     clients.add(ws);
     ws.on("close", () => clients.delete(ws));
   });
+  wss.on("error", (err) => {
+    if (err.code === "EADDRINUSE") {
+      return;
+    }
+    console.error(chalk.red("  \u2717 WebSocket error:"), err.message);
+  });
   function broadcast(message) {
     const data = JSON.stringify(message);
     clients.forEach((client) => {
@@ -1496,7 +1525,12 @@ async function startDevServer(options) {
   };
   const vite = await createViteServer({
     root: process.cwd(),
-    server: { middlewareMode: true },
+    mode,
+    server: {
+      middlewareMode: true,
+      hmr: { server }
+      // Use our HTTP server for Vite's WebSocket
+    },
     appType: "custom",
     customLogger: viteLogger,
     optimizeDeps: {
@@ -1510,6 +1544,12 @@ async function startDevServer(options) {
       noExternal: ["@pdfn/react", "@pdfn/tailwind", "server-only"]
     },
     plugins: [
+      // Pre-compile Tailwind CSS for edge compatibility
+      pdfnTailwind({
+        templates: [
+          join(templatesDir, "**/*.tsx")
+        ]
+      }),
       {
         name: "mock-server-only",
         enforce: "pre",
@@ -1549,6 +1589,17 @@ async function startDevServer(options) {
     const fileName = filePath.split("/").pop() || filePath;
     if (isCodeFile(filePath)) {
       console.log(chalk.blue("  \u21BB"), fileName, chalk.dim("changed"));
+      const mod = vite.moduleGraph.getModuleById(filePath);
+      if (mod) {
+        vite.moduleGraph.invalidateModule(mod);
+      }
+      const virtualMod = vite.moduleGraph.getModuleById("\0virtual:pdfn-tailwind-css");
+      if (virtualMod) {
+        vite.moduleGraph.invalidateModule(virtualMod);
+        for (const importer of virtualMod.importers) {
+          vite.moduleGraph.invalidateModule(importer);
+        }
+      }
     }
     templates = await scanTemplates(absoluteTemplatesDir);
     broadcast({ type: "reload" });
@@ -1738,8 +1789,20 @@ async function startDevServer(options) {
       res.status(500).json({ error: `Error generating PDF: ${error}` });
     }
   });
-  await new Promise((resolve2) => {
-    server.listen(port, () => resolve2());
+  await new Promise((resolve3, reject) => {
+    server.on("error", (err) => {
+      if (err.code === "EADDRINUSE") {
+        console.error(chalk.red(`
+  \u2717 Port ${port} is already in use.
+`));
+        console.error(chalk.dim(`  Either stop the existing server or use a different port:`));
+        console.error(chalk.dim(`  npx pdfn dev --port ${port + 1}
+`));
+        process.exit(1);
+      }
+      reject(err);
+    });
+    server.listen(port, () => resolve3());
   });
   await browserManager.getBrowser();
   console.log(chalk.dim(`  Templates: ${displayPath} (${templateCount})`));
@@ -1762,12 +1825,14 @@ async function startDevServer(options) {
   process.on("SIGTERM", shutdown);
   process.on("SIGINT", shutdown);
 }
-var devCommand = new Command("dev").description("Start development server with live preview").option("--port <number>", "Server port (env: PDFN_PORT)", process.env.PDFN_PORT ?? "3456").option("--templates <path>", "Templates directory", "./pdf-templates").option("--open", "Open browser automatically").action(async (options) => {
+var devCommand = new Command("dev").description("Start development server with live preview").option("--port <number>", "Server port (env: PDFN_PORT)", process.env.PDFN_PORT ?? "3456").option("--templates <path>", "Templates directory", "./pdf-templates").option("--open", "Open browser automatically").option("--mode <mode>", "Environment mode (loads .env.[mode])", "development").action(async (options) => {
+  loadEnv(options.mode);
   const port = parseInt(options.port, 10);
   await startDevServer({
     port,
     templatesDir: options.templates,
-    open: options.open ?? false
+    open: options.open ?? false,
+    mode: options.mode
   });
 });
 
@@ -1978,10 +2043,18 @@ For development with live preview, use:
       logger.browser("launching");
       await browserManager.getBrowser();
       logger.browser("ready");
-      return new Promise((resolve2) => {
+      return new Promise((resolve3, reject) => {
         server = app.listen(port, () => {
           logger.banner(port, maxConcurrent, timeout);
-          resolve2();
+          resolve3();
+        });
+        server.on("error", (err) => {
+          if (err.code === "EADDRINUSE") {
+            logger.error(`Port ${port} is already in use`);
+            logger.info(`Either stop the existing server or use a different port`);
+            process.exit(1);
+          }
+          reject(err);
         });
       });
     },
@@ -1989,8 +2062,8 @@ For development with live preview, use:
       await browserManager.close();
       logger.browser("closed");
       if (server) {
-        await new Promise((resolve2) => {
-          server.close(() => resolve2());
+        await new Promise((resolve3) => {
+          server.close(() => resolve3());
         });
         server = null;
       }
@@ -2000,7 +2073,8 @@ For development with live preview, use:
 }
 
 // src/commands/serve.ts
-var serveCommand = new Command2("serve").description("Start production server (headless, no UI)").option("--port <number>", "Server port (env: PDFN_PORT)", "3456").option("--max-concurrent <number>", "Max concurrent pages (env: PDFN_MAX_CONCURRENT)", "5").option("--timeout <ms>", "Request timeout in ms (env: PDFN_TIMEOUT)", "30000").action(async (options) => {
+var serveCommand = new Command2("serve").description("Start production server (headless, no UI)").option("--port <number>", "Server port (env: PDFN_PORT)", "3456").option("--max-concurrent <number>", "Max concurrent pages (env: PDFN_MAX_CONCURRENT)", "5").option("--timeout <ms>", "Request timeout in ms (env: PDFN_TIMEOUT)", "30000").option("--mode <mode>", "Environment mode (loads .env.[mode])", "production").action(async (options) => {
+  loadEnv(options.mode);
   const port = parseInt(options.port, 10);
   const maxConcurrent = parseInt(options.maxConcurrent, 10);
   const timeout = parseInt(options.timeout, 10);
@@ -2017,7 +2091,7 @@ var serveCommand = new Command2("serve").description("Start production server (h
 
 // src/commands/add.ts
 import { Command as Command3 } from "commander";
-import { existsSync as existsSync2, mkdirSync, copyFileSync } from "fs";
+import { existsSync as existsSync3, mkdirSync, copyFileSync } from "fs";
 import { join as join2, dirname } from "path";
 import { fileURLToPath } from "url";
 import chalk2 from "chalk";
@@ -2049,17 +2123,30 @@ var TEMPLATES = {
     pageSize: "Tabloid"
   }
 };
-function getTemplatesDir() {
-  return join2(__dirname, "..", "templates");
+function getTemplatesDir(style) {
+  return join2(__dirname, "..", "templates", style);
+}
+function isTailwindInstalled(cwd) {
+  try {
+    const tailwindPath = join2(cwd, "node_modules", "@pdfn", "tailwind");
+    return existsSync3(tailwindPath);
+  } catch {
+    return false;
+  }
 }
-var addCommand = new Command3("add").description("Add a starter template to your project").argument("[template]", "Template name (e.g., invoice, letter, contract)").option("--list", "List available templates").option("--output <path>", "Output directory", "./pdf-templates").option("--force", "Overwrite existing files").action(async (template, options) => {
+var addCommand = new Command3("add").description("Add a starter template to your project").argument("[template]", "Template name (e.g., invoice, letter, contract)").option("--list", "List available templates").option("--tailwind", "Use Tailwind CSS styling (requires @pdfn/tailwind)").option("--inline", "Use inline styles (default)").option("--output <path>", "Output directory", "./pdf-templates").option("--force", "Overwrite existing files").action(async (template, options) => {
+  const cwd = process.cwd();
   if (options.list || !template) {
     console.log(chalk2.bold("\nAvailable templates:\n"));
     for (const [id, info] of Object.entries(TEMPLATES)) {
       console.log(`  ${chalk2.cyan(id.padEnd(12))} ${info.description} ${chalk2.dim(`(${info.pageSize})`)}`);
     }
-    console.log(chalk2.dim("\nUsage: pdfn add <template>"));
-    console.log(chalk2.dim("Example: pdfn add invoice\n"));
+    console.log(chalk2.dim("\nUsage: pdfn add <template> [--tailwind]"));
+    console.log(chalk2.dim("Example: pdfn add invoice"));
+    console.log(chalk2.dim("Example: pdfn add invoice --tailwind\n"));
+    console.log(chalk2.bold("Options:"));
+    console.log(chalk2.dim("  --inline     Use inline styles (default)"));
+    console.log(chalk2.dim("  --tailwind   Use Tailwind CSS (requires @pdfn/tailwind)\n"));
     return;
   }
   if (!TEMPLATES[template]) {
@@ -2068,21 +2155,32 @@ Error: Unknown template "${template}"`));
     console.log(chalk2.dim("Run 'pdfn add --list' to see available templates\n"));
     process.exit(1);
   }
-  const templatesDir = getTemplatesDir();
+  const style = options.tailwind ? "tailwind" : "inline";
+  if (style === "tailwind" && !isTailwindInstalled(cwd)) {
+    console.error(chalk2.yellow(`
+\u26A0 @pdfn/tailwind is not installed.`));
+    console.log(chalk2.dim("Install it first to use Tailwind templates:\n"));
+    console.log(chalk2.cyan("  npm install @pdfn/tailwind\n"));
+    console.log(chalk2.dim("Or use inline styles (default):\n"));
+    console.log(chalk2.cyan(`  pdfn add ${template}
+`));
+    process.exit(1);
+  }
+  const templatesDir = getTemplatesDir(style);
   const sourceFile = join2(templatesDir, `${template}.tsx`);
   const outputDir = options.output;
   const outputFile = join2(outputDir, `${template}.tsx`);
-  if (!existsSync2(sourceFile)) {
+  if (!existsSync3(sourceFile)) {
     console.error(chalk2.red(`
 Error: Template file not found: ${sourceFile}`));
     console.log(chalk2.dim("This may be a package installation issue.\n"));
     process.exit(1);
   }
-  if (!existsSync2(outputDir)) {
+  if (!existsSync3(outputDir)) {
     mkdirSync(outputDir, { recursive: true });
     console.log(chalk2.dim(`Created ${outputDir}/`));
   }
-  if (existsSync2(outputFile) && !options.force) {
+  if (existsSync3(outputFile) && !options.force) {
     console.error(chalk2.yellow(`
 File already exists: ${outputFile}`));
     console.log(chalk2.dim("Use --force to overwrite\n"));
@@ -2091,14 +2189,18 @@ File already exists: ${outputFile}`));
   try {
     copyFileSync(sourceFile, outputFile);
     const info = TEMPLATES[template];
+    const styleLabel = style === "tailwind" ? chalk2.cyan(" (Tailwind)") : chalk2.dim(" (inline styles)");
     console.log(chalk2.green(`
-\u2713 Added ${info.name} template`));
+\u2713 Added ${info.name} template`) + styleLabel);
     console.log(chalk2.dim(`  ${outputFile}
 `));
     console.log(chalk2.bold("Next steps:"));
     console.log(chalk2.dim(`  1. Edit ${outputFile} to customize`));
     console.log(chalk2.dim(`  2. Run 'npx pdfn dev' to preview
 `));
+    if (style === "tailwind") {
+      console.log(chalk2.dim("Note: Tailwind templates require @pdfn/tailwind to be installed.\n"));
+    }
   } catch (error) {
     console.error(chalk2.red(`
 Error copying template: ${error}`));