@vobs/cli 0.3.0 → 1.2.0

package/dist/utils/pm.d.ts

@@ -0,0 +1,9 @@
+type PackageManager = 'pnpm' | 'npm' | 'yarn';
+/** Detect the package manager to use */
+declare function detectPackageManager(targetDir?: string): PackageManager;
+/** Install dependencies in a directory */
+declare function installDependencies(targetDir: string, pm: PackageManager): void;
+/** Add a package as a dependency */
+declare function addPackage(targetDir: string, pm: PackageManager, pkg: string, dev: boolean): void;
+
+export { type PackageManager, addPackage, detectPackageManager, installDependencies };

package/dist/utils/pm.js

@@ -0,0 +1,34 @@
+import { existsSync } from 'fs';
+import { resolve } from 'path';
+import { execSync } from 'child_process';
+
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+function detectPackageManager(targetDir) {
+  if (targetDir) {
+    if (existsSync(resolve(targetDir, "pnpm-lock.yaml"))) return "pnpm";
+    if (existsSync(resolve(targetDir, "yarn.lock"))) return "yarn";
+    if (existsSync(resolve(targetDir, "package-lock.json"))) return "npm";
+  }
+  const userAgent = process.env.npm_config_user_agent || "";
+  if (userAgent.startsWith("pnpm")) return "pnpm";
+  if (userAgent.startsWith("yarn")) return "yarn";
+  if (userAgent.startsWith("npm")) return "npm";
+  return "pnpm";
+}
+__name(detectPackageManager, "detectPackageManager");
+function installDependencies(targetDir, pm) {
+  const cmd = pm === "yarn" ? "yarn" : `${pm} install`;
+  execSync(cmd, { cwd: targetDir, stdio: "inherit" });
+}
+__name(installDependencies, "installDependencies");
+function addPackage(targetDir, pm, pkg, dev) {
+  const installFlag = dev ? "-D" : "";
+  const cmd = pm === "npm" ? `npm install ${installFlag} ${pkg}` : pm === "yarn" ? `yarn add ${installFlag} ${pkg}` : `pnpm add ${installFlag} ${pkg}`;
+  execSync(cmd, { cwd: targetDir, stdio: "inherit" });
+}
+__name(addPackage, "addPackage");
+
+export { addPackage, detectPackageManager, installDependencies };
+//# sourceMappingURL=pm.js.map
+//# sourceMappingURL=pm.js.map

package/dist/utils/pm.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/utils/pm.ts"],"names":[],"mappings":";;;;;;AAOO,SAAS,qBAAqB,SAAA,EAAoC;AAEvE,EAAA,IAAI,SAAA,EAAW;AACb,IAAA,IAAI,WAAW,OAAA,CAAQ,SAAA,EAAW,gBAAgB,CAAC,GAAG,OAAO,MAAA;AAC7D,IAAA,IAAI,WAAW,OAAA,CAAQ,SAAA,EAAW,WAAW,CAAC,GAAG,OAAO,MAAA;AACxD,IAAA,IAAI,WAAW,OAAA,CAAQ,SAAA,EAAW,mBAAmB,CAAC,GAAG,OAAO,KAAA;AAAA,EAClE;AAGA,EAAA,MAAM,SAAA,GAAY,OAAA,CAAQ,GAAA,CAAI,qBAAA,IAAyB,EAAA;AACvD,EAAA,IAAI,SAAA,CAAU,UAAA,CAAW,MAAM,CAAA,EAAG,OAAO,MAAA;AACzC,EAAA,IAAI,SAAA,CAAU,UAAA,CAAW,MAAM,CAAA,EAAG,OAAO,MAAA;AACzC,EAAA,IAAI,SAAA,CAAU,UAAA,CAAW,KAAK,CAAA,EAAG,OAAO,KAAA;AAGxC,EAAA,OAAO,MAAA;AACT;AAhBgB,MAAA,CAAA,oBAAA,EAAA,sBAAA,CAAA;AAmBT,SAAS,mBAAA,CAAoB,WAAmB,EAAA,EAA0B;AAC/E,EAAA,MAAM,GAAA,GAAM,EAAA,KAAO,MAAA,GAAS,MAAA,GAAS,GAAG,EAAE,CAAA,QAAA,CAAA;AAC1C,EAAA,QAAA,CAAS,KAAK,EAAE,GAAA,EAAK,SAAA,EAAW,KAAA,EAAO,WAAW,CAAA;AACpD;AAHgB,MAAA,CAAA,mBAAA,EAAA,qBAAA,CAAA;AAMT,SAAS,UAAA,CAAW,SAAA,EAAmB,EAAA,EAAoB,GAAA,EAAa,GAAA,EAAoB;AACjG,EAAA,MAAM,WAAA,GAAc,MAAM,IAAA,GAAO,EAAA;AACjC,EAAA,MAAM,MAAM,EAAA,KAAO,KAAA,GACf,eAAe,WAAW,CAAA,CAAA,EAAI,GAAG,CAAA,CAAA,GACjC,EAAA,KAAO,MAAA,GACL,CAAA,SAAA,EAAY,WAAW,CAAA,CAAA,EAAI,GAAG,KAC9B,CAAA,SAAA,EAAY,WAAW,IAAI,GAAG,CAAA,CAAA;AAEpC,EAAA,QAAA,CAAS,KAAK,EAAE,GAAA,EAAK,SAAA,EAAW,KAAA,EAAO,WAAW,CAAA;AACpD;AATgB,MAAA,CAAA,UAAA,EAAA,YAAA,CAAA","file":"pm.js","sourcesContent":["import { existsSync } from 'node:fs'\nimport { resolve } from 'node:path'\nimport { execSync } from 'node:child_process'\n\nexport type PackageManager = 'pnpm' | 'npm' | 'yarn'\n\n/** Detect the package manager to use */\nexport function detectPackageManager(targetDir?: string): PackageManager {\n  // Check if a specific package manager is locked\n  if (targetDir) {\n    if (existsSync(resolve(targetDir, 'pnpm-lock.yaml'))) return 'pnpm'\n    if (existsSync(resolve(targetDir, 'yarn.lock'))) return 'yarn'\n    if (existsSync(resolve(targetDir, 'package-lock.json'))) return 'npm'\n  }\n\n  // Check for global preference\n  const userAgent = process.env.npm_config_user_agent || ''\n  if (userAgent.startsWith('pnpm')) return 'pnpm'\n  if (userAgent.startsWith('yarn')) return 'yarn'\n  if (userAgent.startsWith('npm')) return 'npm'\n\n  // Default to pnpm\n  return 'pnpm'\n}\n\n/** Install dependencies in a directory */\nexport function installDependencies(targetDir: string, pm: PackageManager): void {\n  const cmd = pm === 'yarn' ? 'yarn' : `${pm} install`\n  execSync(cmd, { cwd: targetDir, stdio: 'inherit' })\n}\n\n/** Add a package as a dependency */\nexport function addPackage(targetDir: string, pm: PackageManager, pkg: string, dev: boolean): void {\n  const installFlag = dev ? '-D' : ''\n  const cmd = pm === 'npm'\n    ? `npm install ${installFlag} ${pkg}`\n    : pm === 'yarn'\n      ? `yarn add ${installFlag} ${pkg}`\n      : `pnpm add ${installFlag} ${pkg}`\n\n  execSync(cmd, { cwd: targetDir, stdio: 'inherit' })\n}"]}

package/package.json

@@ -1,54 +1,44 @@
 {
   "name": "@vobs/cli",
-  "version": "0.3.0",
-  "description": "Command line diagnostics for vobs projects.",
-  "type": "module",
+  "version": "1.2.0",
   "publishConfig": {
     "access": "public"
   },
+  "type": "module",
   "license": "MIT",
-  "author": "vobsjs",
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/vobsjs/vobs.git",
-    "directory": "packages/tools/cli"
-  },
-  "bugs": {
-    "url": "https://github.com/vobsjs/vobs/issues"
-  },
-  "homepage": "https://github.com/vobsjs/vobs#readme",
-  "dependencies": {
-    "chalk": "^5.3.0",
-    "typescript": "^5.7.0",
-    "@vobs/ai-contracts": "0.3.0",
-    "@vobs/ui": "0.3.0",
-    "@vobs/vite-plugin": "0.3.0",
-    "@vobs/compiler-dom": "0.3.0",
-    "@vobs/server-renderer": "0.3.0",
-    "@vobs/runtime-dom": "0.3.0",
-    "@vobs/reactivity": "0.3.0",
-    "@vobs/router": "0.3.0",
-    "@vobs/di": "0.3.0",
-    "@vobs/forms": "0.3.0"
-  },
+  "description": "Vobs framework CLI - project scaffolding, code generation, and dev/build tools",
   "bin": {
-    "vobs": "./dist/index.js"
+    "vobs": "./bin/vobs.js"
   },
-  "files": [
-    "dist"
-  ],
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
-      "import": "./dist/index.js"
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs",
+      "default": "./dist/index.js"
+    },
+    "./source": {
+      "types": "./src/index.ts",
+      "default": "./src/index.ts"
     },
-    "./package.json": "./package.json"
+    "./source/*": "./src/*"
   },
-  "types": "./dist/index.d.ts",
-  "module": "./dist/index.js",
-  "main": "./dist/index.js",
-  "sideEffects": false,
-  "engines": {
-    "node": ">=22.12.0"
-  }
+  "dependencies": {
+    "@clack/prompts": "^0.7.0",
+    "cac": "^6.7.14",
+    "handlebars": "^4.7.8",
+    "picocolors": "^1.0.0",
+    "tsx": "^4.19.0"
+  },
+  "peerDependencies": {
+    "vite": "^5.0.0 || ^6.0.0 || ^7.0.0"
+  },
+  "files": [
+    "bin",
+    "dist",
+    "src"
+  ]
 }

package/src/banner.ts

@@ -0,0 +1,41 @@
+/**
+ * VOBS CLI Banner — Mathematical Bold Sans-Serif
+ * 𝗩𝗢𝗕𝗦 𝗖𝗟𝗜 𝘃𝟭.𝟬
+ * Signals First · Zero Re-renders · Ultra Lightweight
+ *
+ * The banner is left-aligned with a fixed indent rather than horizontally
+ * centered. Centering depends on the terminal column width and per-glyph
+ * render width, neither of which is reliably knowable, so it drifts as the
+ * window resizes. Fixed indent is stable across any terminal size.
+ */
+
+const BANNER_LINE1 = '𝗩𝗢𝗕𝗦 𝗖𝗟𝗜 𝘃𝟭.𝟬'
+const BANNER_TAGLINE = 'Signals First · Zero Re-renders · Ultra Lightweight'
+
+/** Fixed left indent applied to every banner line (2 spaces). */
+const INDENT = '  '
+const DIM = '\x1b[2m'
+const RESET = '\x1b[0m'
+
+/** Show full banner (used for logo command, --help) */
+export function showLogo(): void {
+  console.log()
+  console.log()
+  console.log(`${INDENT}${BANNER_LINE1}`)
+  console.log()
+  console.log(`${INDENT}${DIM}${BANNER_TAGLINE}${RESET}`)
+  console.log()
+  console.log()
+}
+
+/** Show single-line version banner (used for --version) */
+export function showBanner(): void {
+  console.log(`${INDENT}${BANNER_LINE1}`)
+}
+
+/** Show the dev server start banner */
+export function showDevBanner(): void {
+  console.log()
+  console.log(`${INDENT}${BANNER_LINE1}`)
+  console.log()
+}

package/src/cli.ts

@@ -0,0 +1,108 @@
+import { cac } from 'cac'
+import { initCommand } from './commands/init.js'
+import { devCommand } from './commands/dev.js'
+import { buildCommand } from './commands/build.js'
+import { generateCommand } from './commands/generate.js'
+import { addCommand } from './commands/add.js'
+import { showBanner, showLogo, showDevBanner } from './banner.js'
+
+export function createCLI(): ReturnType<typeof cac> {
+  const cli = cac('vobs')
+
+  cli
+    .command('init [name]', 'Create a new vobs project')
+    .option('--dir <dir>', 'Target directory')
+    .option('--pm <pm>', 'Package manager (pnpm/npm/yarn)')
+    .option('--no-typescript', 'Do not use TypeScript')
+    .option('--no-git', 'Do not initialize git')
+    .action(async (name: string, options: Record<string, unknown>) => {
+      await initCommand({
+        name,
+        targetDir: options.dir as string | undefined,
+        packageManager: options.pm as 'pnpm' | 'npm' | 'yarn' | undefined,
+        typescript: options.typescript !== false,
+        git: options.git !== false
+      })
+    })
+
+  cli
+    .command('create [name]', 'Alias for init')
+    .option('--dir <dir>', 'Target directory')
+    .option('--pm <pm>', 'Package manager (pnpm/npm/yarn)')
+    .option('--no-typescript', 'Do not use TypeScript')
+    .option('--no-git', 'Do not initialize git')
+    .action(async (name: string, options: Record<string, unknown>) => {
+      await initCommand({
+        name,
+        targetDir: options.dir as string | undefined,
+        packageManager: options.pm as 'pnpm' | 'npm' | 'yarn' | undefined,
+        typescript: options.typescript !== false,
+        git: options.git !== false
+      })
+    })
+
+  cli
+    .command('dev', 'Start the dev server')
+    .option('--config <path>', 'Vite config file')
+    .option('--port <port>', 'Port to listen on')
+    .option('--open', 'Open browser on start')
+    .action(async (options: Record<string, unknown>) => {
+      showDevBanner()
+      await devCommand({
+        config: options.config as string | undefined,
+        port: options.port as number | undefined,
+        open: options.open as boolean | undefined
+      })
+    })
+
+  cli
+    .command('build', 'Build for production')
+    .option('--config <path>', 'Vite config file')
+    .option('--outDir <dir>', 'Output directory')
+    .option('--mode <mode>', 'Build mode')
+    .action(async (options: Record<string, unknown>) => {
+      await buildCommand({
+        config: options.config as string | undefined,
+        outDir: options.outDir as string | undefined,
+        mode: options.mode as string | undefined
+      })
+    })
+
+  cli
+    .command('generate [name]', 'Generate code (component/page)')
+    .alias('g')
+    .option('--type <type>', 'Type: component or page')
+    .option('--dir <dir>', 'Target directory')
+    .action(async (name: string, options: Record<string, unknown>) => {
+      await generateCommand({
+        name,
+        type: (options.type as 'component' | 'page') || undefined,
+        targetDir: options.dir as string | undefined
+      })
+    })
+
+  cli
+    .command('add [package]', 'Add a package')
+    .option('-D, --dev', 'Save as dev dependency')
+    .action(async (pkg: string, options: Record<string, unknown>) => {
+      await addCommand({
+        package: pkg,
+        dev: options.dev as boolean | undefined
+      })
+    })
+
+  cli
+    .command('logo', 'Show the vobs CLI logo and version info')
+    .action(() => {
+      showLogo()
+    })
+
+  cli.on('--help', () => {
+    showBanner()
+  })
+
+  cli.help()
+  cli.version('1.0.0')
+
+  return cli
+}

package/src/commands/add.ts

@@ -0,0 +1,37 @@
+import * as p from '@clack/prompts'
+import { logger } from '../utils/logger.js'
+import { detectPackageManager, addPackage } from '../utils/pm.js'
+import type { AddOptions } from '../types.js'
+
+export async function addCommand(options: Partial<AddOptions>): Promise<void> {
+  const pkg = options.package || (await p.text({
+    message: 'Package to add:',
+    placeholder: '@vobs/ui',
+    validate: (v) => !v ? 'Package name is required' : undefined
+  })) as string
+
+  if (p.isCancel(pkg)) {
+    p.cancel('Cancelled')
+    return
+  }
+
+  const isDev = options.dev ?? (await p.confirm({
+    message: 'Save as dev dependency?',
+    initialValue: false
+  })) as boolean
+
+  if (p.isCancel(isDev)) {
+    p.cancel('Cancelled')
+    return
+  }
+
+  const pm = detectPackageManager(process.cwd())
+
+  logger.step(`Installing ${pkg}...`)
+  addPackage(process.cwd(), pm, pkg, isDev)
+
+  logger.success(`Installed ${pkg}`)
+  console.log(`\n  Import it in your code:\n`)
+  console.log(`    import { ... } from '${pkg}'`)
+  console.log()
+}

package/src/commands/build.ts

@@ -0,0 +1,17 @@
+import { build } from 'vite'
+import { logger } from '../utils/logger.js'
+import type { BuildOptions } from '../types.js'
+
+export async function buildCommand(options: BuildOptions): Promise<void> {
+  logger.info('Building for production...')
+
+  await build({
+    configFile: options.config,
+    build: {
+      outDir: options.outDir
+    },
+    mode: options.mode || 'production'
+  })
+
+  logger.success('Build complete')
+}

package/src/commands/dev.ts

@@ -0,0 +1,19 @@
+import { createServer } from 'vite'
+import { logger } from '../utils/logger.js'
+import type { DevOptions } from '../types.js'
+
+export async function devCommand(options: DevOptions): Promise<void> {
+  logger.info('Starting dev server...')
+
+  const server = await createServer({
+    configFile: options.config,
+    server: {
+      port: options.port,
+      open: options.open
+    }
+  })
+
+  await server.listen()
+  server.printUrls()
+  logger.success('Dev server is running')
+}

package/src/commands/generate.ts

@@ -0,0 +1,87 @@
+import { resolve } from 'node:path'
+import * as p from '@clack/prompts'
+import { logger } from '../utils/logger.js'
+import { renderTemplate, writeFile, getTemplatesDir, ensureDir } from '../utils/file.js'
+import type { GenerateOptions, ComponentTemplateContext, PageTemplateContext } from '../types.js'
+
+export async function generateCommand(options: Partial<GenerateOptions>): Promise<void> {
+  const type = options.type || (await p.select({
+    message: 'What to generate?',
+    options: [
+      { value: 'component', label: 'Component' },
+      { value: 'page', label: 'Page' }
+    ]
+  })) as 'component' | 'page'
+
+  if (p.isCancel(type)) {
+    p.cancel('Cancelled')
+    return
+  }
+
+  const name = options.name || (await p.text({
+    message: 'Name:',
+    placeholder: type === 'component' ? 'Button' : 'AboutPage',
+    validate: (v) => !v ? 'Name is required' : undefined
+  })) as string
+
+  if (p.isCancel(name)) {
+    p.cancel('Cancelled')
+    return
+  }
+
+  const templatesDir = getTemplatesDir()
+
+  if (type === 'component') {
+    const targetDir = options.targetDir || resolve(process.cwd(), 'src/components')
+    ensureDir(targetDir)
+
+    const context: ComponentTemplateContext = {
+      name: toPascalCase(name),
+      kebabName: toKebabCase(name)
+    }
+
+    const content = renderTemplate(
+      resolve(templatesDir, 'component.hbs'),
+      context as unknown as Record<string, unknown>
+    )
+
+    const filename = `${context.name}.tsx`
+    writeFile(targetDir, filename, content)
+    logger.success(`Created ${type} at ${resolve(targetDir, filename)}`)
+  } else {
+    const targetDir = options.targetDir || resolve(process.cwd(), 'src/pages')
+    ensureDir(targetDir)
+
+    const context: PageTemplateContext = {
+      name: toPascalCase(name),
+      path: `/${toKebabCase(name)}`
+    }
+
+    const content = renderTemplate(
+      resolve(templatesDir, 'page.hbs'),
+      context as unknown as Record<string, unknown>
+    )
+
+    const filename = `${context.name}.tsx`
+    writeFile(targetDir, filename, content)
+    logger.success(`Created ${type} at ${resolve(targetDir, filename)}`)
+  }
+}
+
+function toPascalCase(str: string): string {
+  return str
+    .replace(/[^a-zA-Z0-9]/g, ' ')
+    .split(/\s+/)
+    .map(word => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase())
+    .join('')
+}
+
+function toKebabCase(str: string): string {
+  return str
+    .replace(/([A-Z])/g, '-$1')
+    .toLowerCase()
+    .replace(/^-/, '')
+    .replace(/[^a-z0-9-]/g, '-')
+    .replace(/--+/g, '-')
+    .replace(/^-|-$/g, '')
+}

package/src/commands/index.ts

@@ -0,0 +1,5 @@
+export { initCommand } from './init.js'
+export { devCommand } from './dev.js'
+export { buildCommand } from './build.js'
+export { generateCommand } from './generate.js'
+export { addCommand } from './add.js'

package/src/commands/init.ts

@@ -0,0 +1,84 @@
+import { resolve } from 'node:path'
+import { execSync } from 'node:child_process'
+import * as p from '@clack/prompts'
+import { logger } from '../utils/logger.js'
+import { scaffoldProject } from '../utils/file.js'
+import { installDependencies } from '../utils/pm.js'
+import type { InitOptions } from '../types.js'
+
+export async function initCommand(options: Partial<InitOptions>): Promise<void> {
+  const projectName = options.name || (await p.text({
+    message: 'Project name:',
+    placeholder: 'my-vobs-app',
+    validate: (v) => !v ? 'Project name is required' : undefined
+  })) as string
+
+  if (p.isCancel(projectName)) {
+    p.cancel('Cancelled')
+    return
+  }
+
+  const targetDir = options.targetDir || resolve(process.cwd(), projectName)
+
+  const packageManager = options.packageManager || (await p.select({
+    message: 'Package manager:',
+    options: [
+      { value: 'pnpm', label: 'pnpm' },
+      { value: 'npm', label: 'npm' },
+      { value: 'yarn', label: 'yarn' }
+    ]
+  })) as 'pnpm' | 'npm' | 'yarn'
+
+  if (p.isCancel(packageManager)) {
+    p.cancel('Cancelled')
+    return
+  }
+
+  const useTypescript = options.typescript ?? (await p.confirm({
+    message: 'Use TypeScript?',
+    initialValue: true
+  })) as boolean
+
+  if (p.isCancel(useTypescript)) {
+    p.cancel('Cancelled')
+    return
+  }
+
+  const initGit = options.git ?? (await p.confirm({
+    message: 'Initialize a git repository?',
+    initialValue: true
+  })) as boolean
+
+  if (p.isCancel(initGit)) {
+    p.cancel('Cancelled')
+    return
+  }
+
+  logger.step(`Creating project ${projectName}...`)
+
+  await scaffoldProject(targetDir, {
+    name: projectName,
+    packageName: projectName.toLowerCase().replace(/\s+/g, '-'),
+    typescript: useTypescript,
+    vobsVersion: '1.0.0'
+  })
+
+  logger.success('Project scaffolded')
+
+  logger.step('Installing dependencies...')
+  installDependencies(targetDir, packageManager)
+  logger.success('Dependencies installed')
+
+  if (initGit) {
+    logger.step('Initializing git repository...')
+    try {
+      execSync('git init', { cwd: targetDir, stdio: 'ignore' })
+      logger.success('Git repository initialized')
+    } catch {
+      logger.warn('Git not found, skipping git init')
+    }
+  }
+
+  logger.step('Done!')
+  console.log(`\n  ${packageManager === 'pnpm' ? 'pnpm' : packageManager === 'yarn' ? 'yarn' : 'npm run'} dev\n`)
+}

package/src/index.ts

@@ -0,0 +1,13 @@
+export { createCLI } from './cli.js'
+export { initCommand } from './commands/init.js'
+export { devCommand } from './commands/dev.js'
+export { buildCommand } from './commands/build.js'
+export { generateCommand } from './commands/generate.js'
+export { addCommand } from './commands/add.js'
+export { showBanner, showLogo, showDevBanner } from './banner.js'
+export { startRepl } from './repl.js'
+export { start } from './start.js'
+export { logger } from './utils/logger.js'
+export { detectPackageManager, installDependencies, addPackage } from './utils/pm.js'
+export { renderTemplate, writeFile, ensureDir, scaffoldProject } from './utils/file.js'
+export type * from './types.js'