create-dev-to 1.3.0 → 1.3.1

package/dist/index.js

@@ -11,10 +11,10 @@ import { InstallLogger } from "./installLogger.js";
 import { displayInstallSummary } from "./visualComponents.js";
 const PACKAGE_MANAGERS = ["pnpm", "npm", "yarn", "bun"];
 const __BUILD_INFO__ = {
-  commit: "519bc16",
+  commit: "399e4ab",
   branch: "main",
-  buildTime: "2026-01-10 14:05",
-  version: "1.3.0"
+  buildTime: "2026-01-10 14:27",
+  version: "1.3.1"
 };
 const FRAMEWORKS = [
   {

package/dist/installLogger.js

@@ -0,0 +1,232 @@
+import fs from "node:fs";
+import path from "node:path";
+import { execSync } from "node:child_process";
+import { InstallRenderer } from "./visualComponents.js";
+import { createParser } from "./outputParsers.js";
+class InstallLogger {
+  packageManager;
+  parser;
+  renderer;
+  stats;
+  phases;
+  renderScheduled = false;
+  lastRenderTime = 0;
+  RENDER_INTERVAL = 50;
+  smoothProgressTimer = null;
+  constructor(packageManager) {
+    this.packageManager = packageManager;
+    this.parser = createParser(packageManager);
+    this.renderer = new InstallRenderer();
+    this.stats = {
+      packagesAdded: 0,
+      packagesUpdated: 0,
+      packagesRemoved: 0,
+      packagesTotal: 0,
+      downloadSpeed: 0,
+      downloadedBytes: 0,
+      nodeModulesSize: 0,
+      warnings: []
+    };
+    this.phases = [
+      { name: "resolving", progress: 0, active: true },
+      { name: "downloading", progress: 0, active: false },
+      { name: "installing", progress: 0, active: false }
+    ];
+  }
+  start() {
+    this.stats.startTime = performance.now();
+    this.render();
+    this.startSmoothProgress();
+  }
+  processLine(line, stream) {
+    if (!line || line.trim() === "") return;
+    try {
+      const parsed = this.parser.parse(line, stream);
+      this.handleParsedOutput(parsed);
+      this.scheduleRender();
+    } catch (error) {
+      if (process.env.DEBUG) {
+        console.error("Parse error:", error);
+      }
+    }
+  }
+  async finish(projectDir) {
+    this.stopSmoothProgress();
+    this.stats.endTime = performance.now();
+    this.stats.duration = this.stats.endTime - (this.stats.startTime || 0);
+    this.updatePhase("installing", 100);
+    this.render();
+    this.renderer.clear();
+    try {
+      this.stats.nodeModulesSize = await this.calculateNodeModulesSize(
+        projectDir
+      );
+    } catch {
+      this.stats.nodeModulesSize = 0;
+    }
+    return this.stats;
+  }
+  error() {
+    this.stopSmoothProgress();
+    this.renderer.clear();
+  }
+  startSmoothProgress() {
+    this.smoothProgressTimer = setInterval(() => {
+      const activePhase = this.phases.find((p) => p.active);
+      if (activePhase && activePhase.progress < 95) {
+        const increment = Math.max(0.5, (95 - activePhase.progress) / 20);
+        activePhase.progress = Math.min(95, activePhase.progress + increment);
+        this.render();
+      }
+    }, 200);
+  }
+  stopSmoothProgress() {
+    if (this.smoothProgressTimer) {
+      clearInterval(this.smoothProgressTimer);
+      this.smoothProgressTimer = null;
+    }
+  }
+  handleParsedOutput(parsed) {
+    switch (parsed.type) {
+      case "phase_change":
+        if (parsed.phase) {
+          this.activatePhase(parsed.phase);
+        }
+        break;
+      case "progress":
+        if (parsed.phase && parsed.progress !== void 0) {
+          this.updatePhase(parsed.phase, parsed.progress);
+        }
+        break;
+      case "package_info":
+        if (parsed.packageCount !== void 0) {
+          this.stats.packagesAdded = parsed.packageCount;
+        }
+        break;
+      case "warning":
+        if (parsed.message) {
+          this.stats.warnings = this.stats.warnings || [];
+          this.stats.warnings.push(parsed.message);
+        }
+        break;
+      case "error":
+        break;
+      case "ignore":
+        break;
+    }
+  }
+  activatePhase(phaseName) {
+    const phase = this.phases.find((p) => p.name === phaseName);
+    if (phase) {
+      if (phase.progress >= 100) {
+        return;
+      }
+      this.phases.forEach((p) => p.active = false);
+      phase.active = true;
+      if (phase.progress === 0) {
+        phase.progress = 1;
+      }
+      const phaseIndex = this.phases.findIndex((p) => p.name === phaseName);
+      for (let i = 0; i < phaseIndex; i++) {
+        const prevPhase = this.phases[i];
+        if (prevPhase.progress < 100) {
+          prevPhase.progress = 100;
+        }
+        prevPhase.active = false;
+      }
+    }
+  }
+  updatePhase(phaseName, progress) {
+    const phase = this.phases.find((p) => p.name === phaseName);
+    if (phase) {
+      phase.progress = Math.max(phase.progress, Math.min(100, progress));
+      const phaseIndex = this.phases.findIndex((p) => p.name === phaseName);
+      for (let i = 0; i < phaseIndex; i++) {
+        if (this.phases[i].progress < 100) {
+          this.phases[i].progress = 100;
+          this.phases[i].active = false;
+        }
+      }
+      if (phase.progress < 100) {
+        phase.active = true;
+      }
+      if (progress >= 100) {
+        phase.active = false;
+        if (phaseIndex < this.phases.length - 1) {
+          const nextPhase = this.phases[phaseIndex + 1];
+          if (nextPhase && nextPhase.progress === 0) {
+            nextPhase.active = true;
+            nextPhase.progress = 1;
+          }
+        }
+      }
+    }
+  }
+  scheduleRender() {
+    if (this.renderScheduled) return;
+    const now = performance.now();
+    const timeSinceLastRender = now - this.lastRenderTime;
+    if (timeSinceLastRender >= this.RENDER_INTERVAL) {
+      this.render();
+      this.lastRenderTime = now;
+    } else {
+      this.renderScheduled = true;
+      setTimeout(() => {
+        this.render();
+        this.renderScheduled = false;
+        this.lastRenderTime = performance.now();
+      }, this.RENDER_INTERVAL - timeSinceLastRender);
+    }
+  }
+  render() {
+    try {
+      this.renderer.render(this.phases, this.stats);
+    } catch (error) {
+      if (process.env.DEBUG) {
+        console.error("Render error:", error);
+      }
+    }
+  }
+  async calculateNodeModulesSize(projectDir) {
+    const nodeModulesPath = path.join(projectDir, "node_modules");
+    if (!fs.existsSync(nodeModulesPath)) {
+      return 0;
+    }
+    if (process.platform !== "win32") {
+      try {
+        const result = execSync(`du -sk "${nodeModulesPath}"`, {
+          encoding: "utf-8",
+          stdio: ["ignore", "pipe", "ignore"]
+        });
+        const sizeKB = parseInt(result.split("	")[0]);
+        return sizeKB * 1024;
+      } catch {
+      }
+    }
+    return this.getDirectorySize(nodeModulesPath);
+  }
+  getDirectorySize(dir) {
+    let size = 0;
+    try {
+      const files = fs.readdirSync(dir, { withFileTypes: true });
+      for (const file of files) {
+        const filePath = path.join(dir, file.name);
+        try {
+          if (file.isDirectory()) {
+            size += this.getDirectorySize(filePath);
+          } else {
+            const stats = fs.statSync(filePath);
+            size += stats.size;
+          }
+        } catch {
+          continue;
+        }
+      }
+    } catch {
+    }
+    return size;
+  }
+}
+export {
+  InstallLogger
+};

package/dist/outputParsers.js

@@ -0,0 +1,237 @@
+class OutputParser {
+}
+class PnpmParser extends OutputParser {
+  totalPackages = 0;
+  maxResolved = 0;
+  lastPhase = "resolving";
+  parse(line, stream) {
+    if (line.includes("Lockfile is up to date") || line.includes("Already up to date")) {
+      return {
+        type: "progress",
+        phase: "installing",
+        progress: 100,
+        packageCount: 0
+      };
+    }
+    const progressMatch = line.match(
+      /Progress: resolved (\d+)(?:, reused (\d+))?(?:, downloaded (\d+))?(?:, added (\d+))?/
+    );
+    if (progressMatch) {
+      const resolved = parseInt(progressMatch[1]);
+      const reused = parseInt(progressMatch[2] || "0");
+      const downloaded = parseInt(progressMatch[3] || "0");
+      const added = parseInt(progressMatch[4] || "0");
+      this.maxResolved = Math.max(this.maxResolved, resolved);
+      if (added > 0 && added >= resolved) {
+        this.lastPhase = "installing";
+        return {
+          type: "progress",
+          phase: "installing",
+          packageCount: added,
+          progress: 100
+        };
+      } else if (added > 0) {
+        this.lastPhase = "installing";
+        const installProgress = Math.min(99, Math.max(10, added / resolved * 100));
+        return {
+          type: "progress",
+          phase: "installing",
+          progress: installProgress
+        };
+      } else if (downloaded > 0 || reused > 0) {
+        const total = downloaded + reused;
+        if (this.lastPhase !== "downloading") {
+          this.lastPhase = "downloading";
+        }
+        const downloadProgress = Math.min(99, Math.max(10, total / resolved * 100));
+        return {
+          type: "progress",
+          phase: "downloading",
+          progress: downloadProgress
+        };
+      } else if (resolved > 0) {
+        if (this.lastPhase !== "resolving") {
+          this.lastPhase = "resolving";
+        }
+        const resolveProgress = Math.min(95, Math.max(10, resolved / Math.max(this.maxResolved, 200) * 100));
+        return {
+          type: "progress",
+          phase: "resolving",
+          progress: resolveProgress
+        };
+      }
+    }
+    const packagesMatch = line.match(/Packages:\s*\+(\d+)/);
+    if (packagesMatch) {
+      const count = parseInt(packagesMatch[1]);
+      this.totalPackages = count;
+      return {
+        type: "package_info",
+        packageCount: count
+      };
+    }
+    if (line.includes("warn") && stream === "stderr") {
+      return {
+        type: "warning",
+        message: line
+      };
+    }
+    if ((line.includes("error") || line.includes("Error")) && stream === "stderr") {
+      return {
+        type: "error",
+        message: line
+      };
+    }
+    return { type: "ignore" };
+  }
+}
+class NpmParser extends OutputParser {
+  isInstalling = false;
+  parse(line, stream) {
+    const completionMatch = line.match(
+      /added (\d+) packages?(?:, (?:and|)?(?:audited|updated) (\d+) packages)?/
+    );
+    if (completionMatch) {
+      this.isInstalling = true;
+      return {
+        type: "progress",
+        packageCount: parseInt(completionMatch[1]),
+        progress: 100,
+        phase: "installing"
+      };
+    }
+    if (line.includes("up to date")) {
+      this.isInstalling = true;
+      return {
+        type: "progress",
+        packageCount: 0,
+        progress: 100,
+        phase: "installing"
+      };
+    }
+    const progressMatch = line.match(/\|(.+?)\|/);
+    if (progressMatch) {
+      const progress = progressMatch[1].length / 50 * 100;
+      return {
+        type: "progress",
+        progress: Math.min(95, Math.max(1, progress)),
+        phase: "downloading"
+      };
+    }
+    if (line.includes("vulnerabilities") || line.includes("vulnerability")) {
+      return {
+        type: "warning",
+        message: line
+      };
+    }
+    if (line.includes("ERR!") || line.includes("error") && stream === "stderr") {
+      return {
+        type: "error",
+        message: line
+      };
+    }
+    return { type: "ignore" };
+  }
+}
+class YarnParser extends OutputParser {
+  parse(line, stream) {
+    const phaseMatch = line.match(/\[(\d+)\/4\]\s+(.+?)\.{3}/);
+    if (phaseMatch) {
+      const stepNum = parseInt(phaseMatch[1]);
+      const phaseNames = [
+        "resolving",
+        "fetching",
+        "linking",
+        "building"
+      ];
+      const phase = phaseNames[stepNum - 1] || "resolving";
+      const mappedPhase = phase === "fetching" ? "downloading" : phase;
+      return {
+        type: "phase_change",
+        phase: mappedPhase
+      };
+    }
+    const successMatch = line.match(/Done in ([\d.]+)s/);
+    if (successMatch) {
+      return {
+        type: "progress",
+        progress: 100,
+        phase: "installing"
+      };
+    }
+    const addedMatch = line.match(/(?:Yarn )?added (\d+) packages?/);
+    if (addedMatch) {
+      return {
+        type: "package_info",
+        packageCount: parseInt(addedMatch[1])
+      };
+    }
+    if (line.includes("warning") && stream === "stderr") {
+      return {
+        type: "warning",
+        message: line
+      };
+    }
+    if (line.includes("error") && stream === "stderr") {
+      return {
+        type: "error",
+        message: line
+      };
+    }
+    return { type: "ignore" };
+  }
+}
+class BunParser extends OutputParser {
+  parse(line, stream) {
+    const completionMatch = line.match(/^\s*\+\s*(\d+)\s+packages installed\s*\[([\d.]+)s\]/);
+    if (completionMatch) {
+      return {
+        type: "progress",
+        packageCount: parseInt(completionMatch[1]),
+        progress: 100,
+        phase: "installing"
+      };
+    }
+    const alreadyMatch = line.match(/^\s*(\d+)\s+packages already installed/);
+    if (alreadyMatch) {
+      return {
+        type: "progress",
+        packageCount: 0,
+        progress: 100,
+        phase: "installing"
+      };
+    }
+    if (line.includes("Downloading") || line.includes("downloading")) {
+      return { type: "phase_change", phase: "downloading" };
+    }
+    if (line.includes("error") || line.includes("Error") || line.includes("failed") && stream === "stderr") {
+      return {
+        type: "error",
+        message: line
+      };
+    }
+    return { type: "ignore" };
+  }
+}
+function createParser(pm) {
+  switch (pm) {
+    case "pnpm":
+      return new PnpmParser();
+    case "npm":
+      return new NpmParser();
+    case "yarn":
+      return new YarnParser();
+    case "bun":
+      return new BunParser();
+    default:
+      return new NpmParser();
+  }
+}
+export {
+  BunParser,
+  NpmParser,
+  OutputParser,
+  PnpmParser,
+  YarnParser,
+  createParser
+};

package/dist/visualComponents.js

@@ -0,0 +1,251 @@
+import { green, yellow, red, dim, bold } from "kolorist";
+const ANSI = {
+  cursorUp: (n) => `\x1B[${n}A`,
+  cursorDown: (n) => `\x1B[${n}B`,
+  cursorTo: (x, y) => y !== void 0 ? `\x1B[${y};${x}H` : `\x1B[${x}G`,
+  clearLine: () => "\x1B[2K",
+  clearScreen: () => "\x1B[2J",
+  hideCursor: () => "\x1B[?25l",
+  showCursor: () => "\x1B[?25h"
+};
+function trueColor(r, g, b, text) {
+  return `\x1B[38;2;${r};${g};${b}m${text}\x1B[0m`;
+}
+function createGradient(text, startColor, endColor) {
+  const chars = text.split("");
+  const length = chars.length;
+  if (length === 0) return text;
+  if (length === 1) return trueColor(startColor.r, startColor.g, startColor.b, text);
+  let result = "";
+  for (let i = 0; i < length; i++) {
+    const ratio = i / (length - 1);
+    const r = Math.round(startColor.r + (endColor.r - startColor.r) * ratio);
+    const g = Math.round(startColor.g + (endColor.g - startColor.g) * ratio);
+    const b = Math.round(startColor.b + (endColor.b - startColor.b) * ratio);
+    result += trueColor(r, g, b, chars[i]);
+  }
+  return result;
+}
+function renderProgressBar(options) {
+  const { width, progress, label, gradient, colors, showPercentage } = options;
+  const filledWidth = Math.floor(width * progress / 100);
+  const emptyWidth = width - filledWidth;
+  let bar = "";
+  if (gradient && colors && colors.length > 0) {
+    for (let i = 0; i < filledWidth; i++) {
+      const ratio = filledWidth > 1 ? i / (filledWidth - 1) : 0;
+      const colorIndex = Math.min(
+        Math.floor(ratio * (colors.length - 1)),
+        colors.length - 1
+      );
+      const nextColorIndex = Math.min(colorIndex + 1, colors.length - 1);
+      const color = colors[colorIndex];
+      const nextColor = colors[nextColorIndex];
+      const localRatio = ratio * (colors.length - 1) - Math.floor(ratio * (colors.length - 1));
+      const r = Math.round(color.r + (nextColor.r - color.r) * localRatio);
+      const g = Math.round(color.g + (nextColor.g - color.g) * localRatio);
+      const b = Math.round(color.b + (nextColor.b - color.b) * localRatio);
+      bar += trueColor(r, g, b, "\u2593");
+    }
+  } else {
+    bar = "\u2593".repeat(filledWidth);
+  }
+  bar += dim("\u2591".repeat(emptyWidth));
+  const percentage = showPercentage ? ` ${Math.round(progress)}%` : "";
+  return `${bar} ${label}${percentage}`;
+}
+function getPhaseIcon(phase) {
+  const icons = {
+    resolving: "\u{1F50D}",
+    downloading: "\u2B07\uFE0F",
+    installing: "\u{1F4E6}",
+    building: "\u{1F528}"
+  };
+  return icons[phase] || "\u25CF";
+}
+function getPhaseColors(phase) {
+  const colorSets = {
+    resolving: [
+      { r: 59, g: 130, b: 246 },
+      { r: 37, g: 99, b: 235 }
+    ],
+    downloading: [
+      { r: 34, g: 197, b: 94 },
+      { r: 22, g: 163, b: 74 }
+    ],
+    installing: [
+      { r: 168, g: 85, b: 247 },
+      { r: 147, g: 51, b: 234 }
+    ],
+    building: [
+      { r: 251, g: 146, b: 60 },
+      { r: 249, g: 115, b: 22 }
+    ]
+  };
+  return colorSets[phase] || [{ r: 156, g: 163, b: 175 }];
+}
+function formatSpeed(bytesPerSecond) {
+  if (bytesPerSecond < 1024) return `${bytesPerSecond.toFixed(0)} B/s`;
+  if (bytesPerSecond < 1024 * 1024)
+    return `${(bytesPerSecond / 1024).toFixed(1)} KB/s`;
+  return `${(bytesPerSecond / 1024 / 1024).toFixed(1)} MB/s`;
+}
+function formatSize(bytes) {
+  if (bytes < 1024) return `${bytes} B`;
+  if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;
+  if (bytes < 1024 * 1024 * 1024)
+    return `${(bytes / 1024 / 1024).toFixed(1)} MB`;
+  return `${(bytes / 1024 / 1024 / 1024).toFixed(2)} GB`;
+}
+function formatDuration(ms) {
+  const seconds = ms / 1e3;
+  if (seconds < 60) return `${seconds.toFixed(1)}s`;
+  const minutes = Math.floor(seconds / 60);
+  const remainingSeconds = Math.round(seconds % 60);
+  return `${minutes}m ${remainingSeconds}s`;
+}
+function detectColorSupport() {
+  if (process.env.NO_COLOR || process.env.TERM === "dumb") {
+    return false;
+  }
+  return true;
+}
+class InstallRenderer {
+  isTTY;
+  supportsColor;
+  lineCount = 0;
+  constructor() {
+    this.isTTY = process.stdout.isTTY ?? false;
+    this.supportsColor = detectColorSupport();
+  }
+  render(phases, stats) {
+    if (!this.isTTY) {
+      this.renderSimple(phases);
+      return;
+    }
+    const lines = this.buildEnhancedUI(phases, stats);
+    this.updateTerminal(lines);
+  }
+  buildEnhancedUI(phases, stats) {
+    const lines = [];
+    lines.push("");
+    if (this.supportsColor) {
+      const title = createGradient(
+        "\u25C6 Installing Dependencies",
+        { r: 99, g: 102, b: 241 },
+        { r: 236, g: 72, b: 153 }
+      );
+      lines.push(bold(title));
+    } else {
+      lines.push(bold("\u25C6 Installing Dependencies"));
+    }
+    lines.push("");
+    phases.forEach((phase) => {
+      const icon = getPhaseIcon(phase.name);
+      const bar = renderProgressBar({
+        width: 40,
+        progress: phase.progress,
+        label: this.getPhaseLabel(phase.name),
+        gradient: this.supportsColor,
+        colors: getPhaseColors(phase.name),
+        showPercentage: true
+      });
+      lines.push(`${icon} ${bar}`);
+    });
+    lines.push("");
+    const statsLine = this.buildStatsLine(stats);
+    if (statsLine) {
+      lines.push(dim(statsLine));
+      lines.push("");
+    }
+    return lines;
+  }
+  getPhaseLabel(phase) {
+    const labels = {
+      resolving: "Resolving packages  ",
+      downloading: "Downloading        ",
+      installing: "Installing         ",
+      building: "Building           "
+    };
+    return labels[phase] || phase;
+  }
+  buildStatsLine(stats) {
+    const parts = [];
+    if (stats.packagesAdded) {
+      parts.push(`Packages: ${green(`+${stats.packagesAdded}`)}`);
+    }
+    if (stats.packagesUpdated) {
+      parts.push(`Updated: ${yellow(stats.packagesUpdated.toString())}`);
+    }
+    if (stats.packagesRemoved) {
+      parts.push(`Removed: ${red(stats.packagesRemoved.toString())}`);
+    }
+    if (stats.startTime) {
+      const duration = performance.now() - stats.startTime;
+      parts.push(`Time: ${formatDuration(duration)}`);
+    }
+    if (stats.downloadSpeed && stats.downloadSpeed > 0) {
+      parts.push(`Speed: ${formatSpeed(stats.downloadSpeed)}`);
+    }
+    return parts.join("  ");
+  }
+  updateTerminal(lines) {
+    if (this.lineCount > 0) {
+      for (let i = 0; i < this.lineCount; i++) {
+        process.stdout.write(ANSI.cursorUp(1) + ANSI.clearLine());
+      }
+    }
+    lines.forEach((line) => process.stdout.write(line + "\n"));
+    this.lineCount = lines.length;
+  }
+  renderSimple(phases) {
+    const activePhase = phases.find((p) => p.active);
+    if (activePhase) {
+      const label = this.getPhaseLabel(activePhase.name).trim();
+      console.log(
+        `[${label.toUpperCase()}] ${Math.round(activePhase.progress)}%`
+      );
+    }
+  }
+  clear() {
+    if (this.isTTY && this.lineCount > 0) {
+      for (let i = 0; i < this.lineCount; i++) {
+        process.stdout.write(ANSI.cursorUp(1) + ANSI.clearLine());
+      }
+      this.lineCount = 0;
+    }
+  }
+}
+function displayInstallSummary(stats) {
+  const lines = [];
+  lines.push("");
+  lines.push(green("\u2728 Installation Complete!"));
+  lines.push("");
+  const pkgStats = [];
+  if (stats.packagesAdded > 0)
+    pkgStats.push(`${green(`+${stats.packagesAdded}`)} added`);
+  if (stats.packagesUpdated > 0)
+    pkgStats.push(`${yellow(`~${stats.packagesUpdated}`)} updated`);
+  if (stats.packagesRemoved > 0)
+    pkgStats.push(`${red(`-${stats.packagesRemoved}`)} removed`);
+  if (pkgStats.length > 0) {
+    lines.push(`  ${bold("Packages:")} ${pkgStats.join(", ")}`);
+  }
+  lines.push(`  ${bold("Duration:")} ${formatDuration(stats.duration)}`);
+  if (stats.downloadSpeed > 0) {
+    lines.push(`  ${bold("Avg Speed:")} ${formatSpeed(stats.downloadSpeed)}`);
+  }
+  if (stats.nodeModulesSize > 0) {
+    lines.push(`  ${bold("Disk Usage:")} ${formatSize(stats.nodeModulesSize)}`);
+  }
+  if (stats.warnings.length > 0) {
+    lines.push("");
+    lines.push(yellow(`  \u26A0\uFE0F  ${stats.warnings.length} warning(s)`));
+  }
+  lines.push("");
+  lines.forEach((line) => console.log(line));
+}
+export {
+  InstallRenderer,
+  displayInstallSummary
+};

package/package.json

@@ -1,8 +1,11 @@
 {
   "name": "create-dev-to",
-  "version": "1.3.0",
+  "version": "1.3.1",
   "private": false,
   "type": "module",
+  "engines": {
+    "node": ">=18.0.0"
+  },
   "bin": {
     "create-dev-to": "./dist/index.js"
   },