create-krispya 0.2.0 → 0.4.0

package/dist/cli.mjs

@@ -0,0 +1,531 @@
+#!/usr/bin/env node
+import { cwd } from 'process';
+import { getBaseTemplate, getLatestPnpmVersion, getLatestNodeVersion, getLatestNpmVersion, generate, generateRandomName, getLanguageFromTemplate } from './index.mjs';
+import { join, dirname } from 'path';
+import { mkdir, writeFile } from 'fs/promises';
+import { Command } from 'commander';
+import * as p from '@clack/prompts';
+import color from 'chalk';
+import { fetch } from 'undici';
+
+function getDefaultProjectName(template) {
+  const base = getBaseTemplate(template);
+  switch (base) {
+    case "vanilla":
+      return `vanilla-${generateRandomName()}`;
+    case "react":
+      return `react-${generateRandomName()}`;
+    case "r3f":
+      return `react-three-${generateRandomName()}`;
+  }
+}
+function getDefaultOptions(template, name, projectType = "app", libraryBundler) {
+  const baseTemplate = getBaseTemplate(template);
+  const base = {
+    name,
+    template,
+    projectType,
+    libraryBundler: projectType === "library" ? libraryBundler ?? "unbuild" : void 0,
+    packageManager: "pnpm",
+    pnpmManageVersions: true,
+    nodeVersion: "latest",
+    linter: "oxlint",
+    formatter: "oxfmt"
+  };
+  if (baseTemplate === "r3f") {
+    return {
+      ...base,
+      drei: {},
+      handle: {},
+      leva: {},
+      postprocessing: {},
+      rapier: {},
+      xr: {},
+      uikit: {},
+      offscreen: {},
+      zustand: {},
+      koota: {},
+      triplex: {},
+      viverse: {}
+    };
+  }
+  return base;
+}
+function formatConfigSummary(options) {
+  const lines = [];
+  const VALUE_COL = 27;
+  const formatRow = (label, value, indent = "") => {
+    const fullLabel = indent + label;
+    const dotCount = Math.max(1, VALUE_COL - fullLabel.length - 1);
+    const dots = color.gray(".".repeat(dotCount));
+    return `${indent}${label} ${dots} ${value}`;
+  };
+  const formatLanguage = (lang) => {
+    return lang === "typescript" ? "TypeScript" : lang === "javascript" ? "JavaScript" : lang;
+  };
+  const projectType = options.projectType ?? "app";
+  const language = options.template ? getLanguageFromTemplate(options.template) : "typescript";
+  lines.push(formatRow("Language", formatLanguage(language)));
+  if (projectType === "library") {
+    lines.push(formatRow("Bundler", options.libraryBundler ?? "unbuild"));
+  } else {
+    lines.push(formatRow("Bundler", "vite"));
+  }
+  lines.push(formatRow("Node version", options.nodeVersion || "latest"));
+  lines.push(formatRow("Package manager", options.packageManager || "pnpm"));
+  if (options.packageManager === "pnpm") {
+    const versionManaged = options.pnpmManageVersions ? "yes" : "no";
+    lines.push(formatRow("\u21B3 Version managed", versionManaged, ""));
+  }
+  if (options.linter) {
+    lines.push(formatRow("Linter", options.linter));
+  }
+  if (options.formatter) {
+    lines.push(formatRow("Formatter", options.formatter));
+  }
+  lines.push(formatRow("Testing", "vitest"));
+  if (options.template && getBaseTemplate(options.template) === "r3f") {
+    const integrationNames = [
+      options.drei && "drei",
+      options.handle && "handle",
+      options.leva && "leva",
+      options.postprocessing && "postproc",
+      options.rapier && "rapier",
+      options.xr && "xr",
+      options.uikit && "uikit",
+      options.offscreen && "offscreen",
+      options.zustand && "zustand",
+      options.koota && "koota",
+      options.triplex && "triplex",
+      options.viverse && "viverse"
+    ].filter(Boolean);
+    lines.push("");
+    lines.push(color.dim("Integrations"));
+    for (let i = 0; i < integrationNames.length; i += 2) {
+      const left = `${color.green("\u25CF")} ${integrationNames[i]}`;
+      const right = integrationNames[i + 1] ? `${color.green("\u25CF")} ${integrationNames[i + 1]}` : "";
+      const spacing = " ".repeat(Math.max(1, 16 - integrationNames[i].length));
+      lines.push(`  ${left}${spacing}${right}`);
+    }
+  }
+  return lines.join("\n");
+}
+async function promptForCustomization(template, name, projectType) {
+  let libraryBundler;
+  if (projectType === "library") {
+    const bundler = await p.select({
+      message: "Library bundler",
+      options: [
+        { value: "unbuild", label: "unbuild", hint: "unjs, simple config" },
+        { value: "tsdown", label: "tsdown", hint: "fast, esbuild-based" }
+      ],
+      initialValue: "unbuild"
+    });
+    if (p.isCancel(bundler)) {
+      p.cancel("Operation cancelled.");
+      process.exit(0);
+    }
+    libraryBundler = bundler;
+  }
+  const nodeVersion = await p.text({
+    message: "Node.js version",
+    placeholder: "latest",
+    defaultValue: "latest",
+    validate: (value) => {
+      if (!value.length) return "Required";
+      if (value !== "latest" && !/^\d+(\.\d+(\.\d+)?)?$/.test(value)) {
+        return 'Must be "latest" or a valid semver (e.g., "22" or "22.13.0")';
+      }
+    }
+  });
+  if (p.isCancel(nodeVersion)) {
+    p.cancel("Operation cancelled.");
+    process.exit(0);
+  }
+  const packageManager = await p.select({
+    message: "Package manager",
+    options: [
+      { value: "pnpm", label: "pnpm" },
+      { value: "npm", label: "npm" },
+      { value: "yarn", label: "yarn" },
+      { value: "custom", label: "Other (custom)" }
+    ],
+    initialValue: "pnpm"
+  });
+  if (p.isCancel(packageManager)) {
+    p.cancel("Operation cancelled.");
+    process.exit(0);
+  }
+  let finalPackageManager = packageManager;
+  if (packageManager === "custom") {
+    const customPm = await p.text({
+      message: "Enter package manager command",
+      validate: (value) => {
+        if (!value.length) return "Required";
+      }
+    });
+    if (p.isCancel(customPm)) {
+      p.cancel("Operation cancelled.");
+      process.exit(0);
+    }
+    finalPackageManager = customPm;
+  }
+  let pnpmManageVersions = true;
+  if (packageManager === "pnpm") {
+    const managePnpm = await p.confirm({
+      message: "Enable manage-package-manager-versions?",
+      initialValue: true
+    });
+    if (p.isCancel(managePnpm)) {
+      p.cancel("Operation cancelled.");
+      process.exit(0);
+    }
+    pnpmManageVersions = managePnpm;
+  }
+  const linter = await p.select({
+    message: "Linter",
+    options: [
+      { value: "oxlint", label: "Oxlint", hint: "fast, from OXC" },
+      { value: "eslint", label: "ESLint", hint: "classic" },
+      { value: "biome", label: "Biome", hint: "all-in-one" }
+    ],
+    initialValue: "oxlint"
+  });
+  if (p.isCancel(linter)) {
+    p.cancel("Operation cancelled.");
+    process.exit(0);
+  }
+  const formatter = await p.select({
+    message: "Formatter",
+    options: [
+      { value: "oxfmt", label: "Oxfmt", hint: "fast, Prettier-compatible" },
+      { value: "prettier", label: "Prettier", hint: "classic" },
+      { value: "biome", label: "Biome", hint: "all-in-one" }
+    ],
+    initialValue: "oxfmt"
+  });
+  if (p.isCancel(formatter)) {
+    p.cancel("Operation cancelled.");
+    process.exit(0);
+  }
+  const language = await p.select({
+    message: "Language",
+    options: [
+      { value: "typescript", label: "TypeScript" },
+      { value: "javascript", label: "JavaScript" }
+    ],
+    initialValue: "typescript"
+  });
+  if (p.isCancel(language)) {
+    p.cancel("Operation cancelled.");
+    process.exit(0);
+  }
+  const baseTemplate = getBaseTemplate(template);
+  const finalTemplate = language === "javascript" ? `${baseTemplate}-js` : baseTemplate;
+  let integrations = [];
+  if (baseTemplate === "r3f") {
+    const selected = await p.multiselect({
+      message: "R3F integrations",
+      options: [
+        { value: "drei", label: "Drei" },
+        { value: "handle", label: "Handle" },
+        { value: "leva", label: "Leva" },
+        { value: "postprocessing", label: "Postprocessing" },
+        { value: "rapier", label: "Rapier" },
+        { value: "xr", label: "XR" },
+        { value: "uikit", label: "UIKit" },
+        { value: "offscreen", label: "Offscreen" },
+        { value: "zustand", label: "Zustand" },
+        { value: "koota", label: "Koota" },
+        { value: "triplex", label: "Triplex" },
+        { value: "viverse", label: "Viverse" }
+      ],
+      initialValues: [
+        "drei",
+        "handle",
+        "leva",
+        "postprocessing",
+        "rapier",
+        "xr",
+        "uikit",
+        "offscreen",
+        "zustand",
+        "koota",
+        "triplex",
+        "viverse"
+      ],
+      required: false
+    });
+    if (p.isCancel(selected)) {
+      p.cancel("Operation cancelled.");
+      process.exit(0);
+    }
+    integrations = selected;
+  }
+  return {
+    name,
+    template: finalTemplate,
+    projectType,
+    libraryBundler: projectType === "library" ? libraryBundler : void 0,
+    nodeVersion,
+    packageManager: finalPackageManager,
+    pnpmManageVersions,
+    linter,
+    formatter,
+    ...baseTemplate === "r3f" && {
+      drei: integrations.includes("drei") ? {} : void 0,
+      handle: integrations.includes("handle") ? {} : void 0,
+      leva: integrations.includes("leva") ? {} : void 0,
+      postprocessing: integrations.includes("postprocessing") ? {} : void 0,
+      rapier: integrations.includes("rapier") ? {} : void 0,
+      xr: integrations.includes("xr") ? {} : void 0,
+      uikit: integrations.includes("uikit") ? {} : void 0,
+      offscreen: integrations.includes("offscreen") ? {} : void 0,
+      zustand: integrations.includes("zustand") ? {} : void 0,
+      koota: integrations.includes("koota") ? {} : void 0,
+      triplex: integrations.includes("triplex") ? {} : void 0,
+      viverse: integrations.includes("viverse") ? {} : void 0
+    }
+  };
+}
+async function promptForOptions(name) {
+  let projectName = name;
+  if (!projectName) {
+    const nameResult = await p.text({
+      message: "What is your project named?",
+      placeholder: generateRandomName(),
+      defaultValue: generateRandomName(),
+      validate: (value) => {
+        if (!value.length) return "Project name is required";
+      }
+    });
+    if (p.isCancel(nameResult)) {
+      p.cancel("Operation cancelled.");
+      process.exit(0);
+    }
+    projectName = nameResult;
+  }
+  const projectType = await p.select({
+    message: "Project type",
+    options: [
+      { value: "app", label: "Application" },
+      { value: "library", label: "Library" }
+    ],
+    initialValue: "app"
+  });
+  if (p.isCancel(projectType)) {
+    p.cancel("Operation cancelled.");
+    process.exit(0);
+  }
+  const template = await p.select({
+    message: "Select a template",
+    options: [
+      { value: "vanilla", label: "Vanilla" },
+      { value: "react", label: "React" },
+      { value: "r3f", label: "React Three Fiber" }
+    ],
+    initialValue: "vanilla"
+  });
+  if (p.isCancel(template)) {
+    p.cancel("Operation cancelled.");
+    process.exit(0);
+  }
+  const defaultOptions = getDefaultOptions(
+    template,
+    projectName,
+    projectType
+  );
+  p.note(formatConfigSummary(defaultOptions), "Template Configuration");
+  const action = await p.select({
+    message: "Proceed with these settings?",
+    options: [
+      { value: "confirm", label: "Yes, create project" },
+      { value: "customize", label: "No, let me customize" }
+    ],
+    initialValue: "confirm"
+  });
+  if (p.isCancel(action)) {
+    p.cancel("Operation cancelled.");
+    process.exit(0);
+  }
+  if (action === "confirm") {
+    return defaultOptions;
+  }
+  return promptForCustomization(
+    template,
+    projectName,
+    projectType
+  );
+}
+async function main() {
+  const program = new Command().name("create-krispya").description(
+    "CLI for creating Vanilla, React, and React Three Fiber projects"
+  ).argument("[name]", "name for the project").option(
+    "--type <type>",
+    "project type: app or library (default: app)"
+  ).option(
+    "--bundler <bundler>",
+    "library bundler: unbuild or tsdown (default: unbuild, only for libraries)"
+  ).option(
+    "--template <type>",
+    "project template: vanilla, vanilla-js, react, react-js, r3f, r3f-js (default: vanilla)"
+  ).option(
+    "--linter <type>",
+    "linter: eslint, oxlint, or biome (default: oxlint)"
+  ).option(
+    "--formatter <type>",
+    "formatter: prettier, oxfmt, or biome (default: oxfmt)"
+  ).option("--drei", "add @react-three/drei (r3f only)").option("--handle", "add @react-three/handle (r3f only)").option("--leva", "add leva (r3f only)").option("--postprocessing", "add @react-three/postprocessing (r3f only)").option("--rapier", "add @react-three/rapier (r3f only)").option("--xr", "add @react-three/xr (r3f only)").option("--uikit", "add @react-three/uikit (r3f only)").option("--offscreen", "add @react-three/offscreen (r3f only)").option("--zustand", "add zustand (r3f only)").option("--koota", "add koota (r3f only)").option("--triplex", "set up triplex development environment (r3f only)").option("--viverse", "set up viverse deployment (r3f only)").option(
+    "--package-manager <manager>",
+    "specify package manager (e.g. npm, yarn, pnpm)"
+  ).option(
+    "--pnpm-manage-versions",
+    "enable manage-package-manager-versions in pnpm-workspace.yaml (default: true)"
+  ).option(
+    "--no-pnpm-manage-versions",
+    "disable manage-package-manager-versions in pnpm-workspace.yaml"
+  ).option(
+    "--node-version <version>",
+    'set Node.js version for engines.node field (default: "latest")'
+  ).option("-y, --yes", "Skip prompts and use default values").action(async (name, options) => {
+    console.clear();
+    p.intro(color.bgCyan(color.black(" create-krispya ")));
+    let generateOptions;
+    if (Object.keys(options).length > 0) {
+      const template = options.template ?? "vanilla";
+      const baseTemplate = getBaseTemplate(template);
+      const defaultName = getDefaultProjectName(template);
+      const projectType = options.type ?? "app";
+      generateOptions = {
+        name: name || defaultName,
+        projectType,
+        libraryBundler: projectType === "library" ? options.bundler ?? "unbuild" : void 0,
+        template,
+        linter: options.linter ?? "oxlint",
+        formatter: options.formatter ?? "oxfmt",
+        ...baseTemplate === "r3f" && {
+          drei: options.drei ? {} : void 0,
+          handle: options.handle ? {} : void 0,
+          leva: options.leva ? {} : void 0,
+          postprocessing: options.postprocessing ? {} : void 0,
+          rapier: options.rapier ? {} : void 0,
+          xr: options.xr ? {} : void 0,
+          uikit: options.uikit ? {} : void 0,
+          offscreen: options.offscreen ? {} : void 0,
+          zustand: options.zustand ? {} : void 0,
+          koota: options.koota ? {} : void 0,
+          viverse: options.viverse ? {} : void 0,
+          triplex: options.triplex ? {} : void 0
+        },
+        packageManager: options.packageManager,
+        pnpmManageVersions: options.pnpmManageVersions,
+        nodeVersion: options.nodeVersion ?? "latest"
+      };
+    } else {
+      generateOptions = await promptForOptions(name);
+    }
+    const base = generateOptions.template ? getBaseTemplate(generateOptions.template) : "vanilla";
+    const defaultFallbackName = base === "vanilla" ? "vanilla-app" : base === "react" ? "react-app" : "react-three-app";
+    generateOptions.name ??= defaultFallbackName;
+    const packageManager = generateOptions.packageManager || "pnpm";
+    if (packageManager === "pnpm") {
+      generateOptions.pnpmVersion = await getLatestPnpmVersion();
+    }
+    const nodeVersion = generateOptions.nodeVersion ?? "latest";
+    if (nodeVersion === "latest") {
+      generateOptions.nodeVersion = await getLatestNodeVersion();
+    }
+    const versions = {};
+    const versionPromises = [
+      getLatestNpmVersion("vitest", "4.0.0").then((v) => {
+        versions.vitest = v;
+      })
+    ];
+    if (generateOptions.projectType !== "library") {
+      versionPromises.push(
+        getLatestNpmVersion("vite", "6.3.4").then((v) => {
+          versions.vite = v;
+        })
+      );
+    }
+    const linter = generateOptions.linter ?? "oxlint";
+    if (linter === "eslint") {
+      versionPromises.push(
+        getLatestNpmVersion("eslint", "9.17.0").then((v) => {
+          versions.eslint = v;
+        })
+      );
+    } else if (linter === "oxlint") {
+      versionPromises.push(
+        getLatestNpmVersion("oxlint", "0.16.0").then((v) => {
+          versions.oxlint = v;
+        })
+      );
+    } else if (linter === "biome") {
+      versionPromises.push(
+        getLatestNpmVersion("@biomejs/biome", "1.9.4").then((v) => {
+          versions.biome = v;
+        })
+      );
+    }
+    const formatter = generateOptions.formatter ?? "oxfmt";
+    if (formatter === "prettier") {
+      versionPromises.push(
+        getLatestNpmVersion("prettier", "3.4.2").then((v) => {
+          versions.prettier = v;
+        })
+      );
+    } else if (formatter === "oxfmt") {
+      versionPromises.push(
+        getLatestNpmVersion("oxfmt", "0.1.0").then((v) => {
+          versions.oxfmt = v;
+        })
+      );
+    } else if (formatter === "biome" && linter !== "biome") {
+      versionPromises.push(
+        getLatestNpmVersion("@biomejs/biome", "1.9.4").then((v) => {
+          versions.biome = v;
+        })
+      );
+    }
+    await Promise.all(versionPromises);
+    generateOptions.versions = versions;
+    const basePath = join(cwd(), generateOptions.name);
+    const s = p.spinner();
+    s.start("Creating project...");
+    try {
+      const files = generate(generateOptions);
+      const filePaths = Object.keys(files).sort();
+      for (const filePath of filePaths) {
+        const fullFilePath = join(basePath, filePath);
+        await mkdir(dirname(fullFilePath), { recursive: true });
+        const file = files[filePath];
+        if (file.type === "text") {
+          await writeFile(fullFilePath, file.content);
+        } else {
+          const response = await fetch(file.url);
+          await writeFile(fullFilePath, response.body);
+        }
+      }
+      s.stop("Project created!");
+      const isLibrary = generateOptions.projectType === "library";
+      const nextSteps = isLibrary ? [
+        `cd ${generateOptions.name}`,
+        `${packageManager} install`,
+        `${packageManager} run build`
+      ].join("\n") : [
+        `cd ${generateOptions.name}`,
+        `${packageManager} install`,
+        `${packageManager} run dev`
+      ].join("\n");
+      p.note(nextSteps, "Next steps");
+      p.outro(color.green("Happy coding! \u2728"));
+    } catch (error) {
+      s.stop("Failed to create project");
+      p.log.error(String(error));
+      process.exit(1);
+    }
+  });
+  await program.parseAsync();
+}
+main().catch(console.error);