novaui-cli 1.1.1 → 1.1.3

package/src/themes/ocean.js

@@ -0,0 +1,51 @@
+export const OCEAN_THEME_CSS = `@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+@layer base {
+  :root {
+    --background: 210 40% 98%;
+    --foreground: 210 30% 16%;
+    --card: 0 0% 100%;
+    --card-foreground: 210 30% 16%;
+    --popover: 0 0% 100%;
+    --popover-foreground: 210 30% 16%;
+    --primary: 200 95% 46%;
+    --primary-foreground: 0 0% 100%;
+    --secondary: 197 46% 92%;
+    --secondary-foreground: 210 25% 24%;
+    --muted: 197 46% 92%;
+    --muted-foreground: 210 16% 42%;
+    --accent: 189 70% 88%;
+    --accent-foreground: 210 28% 20%;
+    --destructive: 0 75% 55%;
+    --destructive-foreground: 0 0% 100%;
+    --border: 197 30% 84%;
+    --input: 197 30% 84%;
+    --ring: 200 95% 46%;
+    --radius: 0.75rem;
+  }
+
+  .dark {
+    --background: 212 48% 10%;
+    --foreground: 210 20% 94%;
+    --card: 212 45% 13%;
+    --card-foreground: 210 20% 94%;
+    --popover: 212 45% 13%;
+    --popover-foreground: 210 20% 94%;
+    --primary: 196 100% 60%;
+    --primary-foreground: 210 50% 12%;
+    --secondary: 212 30% 20%;
+    --secondary-foreground: 210 20% 94%;
+    --muted: 212 30% 20%;
+    --muted-foreground: 209 15% 68%;
+    --accent: 202 45% 24%;
+    --accent-foreground: 210 20% 94%;
+    --destructive: 0 65% 45%;
+    --destructive-foreground: 0 0% 100%;
+    --border: 212 28% 24%;
+    --input: 212 28% 24%;
+    --ring: 196 100% 60%;
+  }
+}
+`

package/src/themes/sunset.js

@@ -0,0 +1,51 @@
+export const SUNSET_THEME_CSS = `@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+@layer base {
+  :root {
+    --background: 24 100% 98%;
+    --foreground: 12 30% 18%;
+    --card: 0 0% 100%;
+    --card-foreground: 12 30% 18%;
+    --popover: 0 0% 100%;
+    --popover-foreground: 12 30% 18%;
+    --primary: 18 95% 53%;
+    --primary-foreground: 0 0% 100%;
+    --secondary: 22 78% 92%;
+    --secondary-foreground: 16 32% 26%;
+    --muted: 22 78% 92%;
+    --muted-foreground: 18 20% 46%;
+    --accent: 340 84% 93%;
+    --accent-foreground: 336 32% 28%;
+    --destructive: 0 73% 54%;
+    --destructive-foreground: 0 0% 100%;
+    --border: 20 58% 84%;
+    --input: 20 58% 84%;
+    --ring: 18 95% 53%;
+    --radius: 0.75rem;
+  }
+
+  .dark {
+    --background: 16 46% 12%;
+    --foreground: 24 60% 95%;
+    --card: 15 42% 16%;
+    --card-foreground: 24 60% 95%;
+    --popover: 15 42% 16%;
+    --popover-foreground: 24 60% 95%;
+    --primary: 24 100% 64%;
+    --primary-foreground: 16 46% 12%;
+    --secondary: 11 28% 24%;
+    --secondary-foreground: 24 60% 95%;
+    --muted: 11 28% 24%;
+    --muted-foreground: 20 24% 72%;
+    --accent: 332 42% 30%;
+    --accent-foreground: 24 60% 95%;
+    --destructive: 0 62% 45%;
+    --destructive-foreground: 0 0% 100%;
+    --border: 14 24% 28%;
+    --input: 14 24% 28%;
+    --ring: 24 100% 64%;
+  }
+}
+`

package/src/utils/config.js

@@ -0,0 +1,22 @@
+import fs from 'node:fs';
+import path from 'node:path';
+import { CONFIG_FILENAME, DEFAULT_CONFIG } from '../constants.js';
+
+/** Load components.json from cwd; returns null if missing or invalid. */
+export function loadConfig(cwd) {
+  const configPath = path.join(cwd, CONFIG_FILENAME);
+  if (!fs.existsSync(configPath)) return null;
+  try {
+    const raw = JSON.parse(fs.readFileSync(configPath, 'utf8'));
+    if (!raw || typeof raw !== 'object' || Array.isArray(raw)) return null;
+    return { ...DEFAULT_CONFIG, ...raw };
+  } catch {
+    return null;
+  }
+}
+
+/** Write components.json to cwd. */
+export function writeConfig(cwd, config) {
+  const configPath = path.join(cwd, CONFIG_FILENAME);
+  fs.writeFileSync(configPath, JSON.stringify(config, null, 2), 'utf8');
+}

package/src/utils/deps.js

@@ -0,0 +1,40 @@
+import { execFileSync } from 'node:child_process';
+import fs from 'node:fs';
+import path from 'node:path';
+
+export function detectPackageManager() {
+  const userAgent = process.env.npm_config_user_agent || '';
+  if (userAgent.startsWith('yarn')) return { command: 'yarn', baseArgs: ['add'], devFlag: '--dev' };
+  if (userAgent.startsWith('pnpm')) return { command: 'pnpm', baseArgs: ['add'], devFlag: '--save-dev' };
+  if (userAgent.startsWith('bun')) return { command: 'bun', baseArgs: ['add'], devFlag: '--dev' };
+  return { command: 'npm', baseArgs: ['install'], devFlag: '--save-dev' };
+}
+
+export function installPackages(packages, options = {}) {
+  if (!Array.isArray(packages) || packages.length === 0) return;
+  const { dev = false } = options;
+  const { command, baseArgs, devFlag } = detectPackageManager();
+  const args = dev ? [...baseArgs, devFlag, ...packages] : [...baseArgs, ...packages];
+  execFileSync(command, args, { stdio: 'inherit' });
+}
+
+export function getInstallHint(packages, options = {}) {
+  const { dev = false } = options;
+  const { command, baseArgs, devFlag } = detectPackageManager();
+  const args = dev ? [...baseArgs, devFlag, ...packages] : [...baseArgs, ...packages];
+  return `${command} ${args.join(' ')}`;
+}
+
+/** Returns which of the requested deps are not listed in package.json (dependencies or devDependencies). */
+export function getMissingDeps(cwd, deps) {
+  const pkgPath = path.join(cwd, 'package.json');
+  if (!fs.existsSync(pkgPath)) {
+    return [...deps];
+  }
+  const pkg = JSON.parse(fs.readFileSync(pkgPath, 'utf8'));
+  const installed = new Set([
+    ...Object.keys(pkg.dependencies || {}),
+    ...Object.keys(pkg.devDependencies || {}),
+  ]);
+  return deps.filter((d) => !installed.has(d));
+}

package/src/utils/fetch.js

@@ -0,0 +1,21 @@
+import { FETCH_TIMEOUT_MS } from '../constants.js';
+
+export async function fetchWithTimeout(url) {
+  const controller = new AbortController();
+  const timeout = setTimeout(() => controller.abort(), FETCH_TIMEOUT_MS);
+  try {
+    return await fetch(url, { signal: controller.signal });
+  } catch (error) {
+    if (error && error.name === 'AbortError') {
+      throw new Error(`Request timed out after ${FETCH_TIMEOUT_MS}ms: ${url}`);
+    }
+    throw error;
+  } finally {
+    clearTimeout(timeout);
+  }
+}
+
+export function formatError(error) {
+  if (error instanceof Error && error.message) return error.message;
+  return String(error);
+}

package/src/utils/fs-helpers.js

@@ -0,0 +1,18 @@
+import fs from 'node:fs';
+import pc from 'picocolors';
+
+export function ensureDir(dir) {
+  if (!fs.existsSync(dir)) {
+    fs.mkdirSync(dir, { recursive: true });
+  }
+}
+
+export function writeIfNotExists(filePath, content, label) {
+  if (fs.existsSync(filePath)) {
+    console.log(pc.dim(`   ℹ  ${label} already exists, skipping.`));
+    return false;
+  }
+  fs.writeFileSync(filePath, content, 'utf8');
+  console.log(pc.green(`   ✓  Created ${label}`));
+  return true;
+}

package/src/utils/fuzzy.js

@@ -0,0 +1,99 @@
+/**
+ * Fuzzy matching utilities for better error messages
+ * Helps users find components when they mistype names
+ */
+
+/**
+ * Calculate Levenshtein distance between two strings
+ * Used for finding similar component names
+ */
+function levenshteinDistance(str1, str2) {
+  const len1 = str1.length
+  const len2 = str2.length
+  const matrix = []
+
+  for (let i = 0; i <= len1; i++) {
+    matrix[i] = [i]
+  }
+
+  for (let j = 0; j <= len2; j++) {
+    matrix[0][j] = j
+  }
+
+  for (let i = 1; i <= len1; i++) {
+    for (let j = 1; j <= len2; j++) {
+      const cost = str1[i - 1] === str2[j - 1] ? 0 : 1
+      matrix[i][j] = Math.min(
+        matrix[i - 1][j] + 1,
+        matrix[i][j - 1] + 1,
+        matrix[i - 1][j - 1] + cost
+      )
+    }
+  }
+
+  return matrix[len1][len2]
+}
+
+/**
+ * Find similar component names based on typo distance
+ * Returns up to maxResults similar names, sorted by similarity
+ */
+export function findSimilarComponents(input, availableComponents, maxResults = 5) {
+  const normalizedInput = input.toLowerCase().trim()
+  
+  const scored = availableComponents
+    .map(name => ({
+      name,
+      distance: levenshteinDistance(normalizedInput, name.toLowerCase()),
+      startsWithSame: name.toLowerCase().startsWith(normalizedInput[0]),
+    }))
+    .filter(item => item.distance <= 4) // Only suggest if reasonably close
+    .sort((a, b) => {
+      if (a.distance !== b.distance) {
+        return a.distance - b.distance
+      }
+      if (a.startsWithSame !== b.startsWithSame) {
+        return a.startsWithSame ? -1 : 1
+      }
+      return a.name.localeCompare(b.name)
+    })
+    .slice(0, maxResults)
+    .map(item => item.name)
+  
+  return scored
+}
+
+/**
+ * Format a helpful error message for missing components
+ */
+export function formatComponentNotFoundError(componentName, availableComponents) {
+  const similar = findSimilarComponents(componentName, availableComponents)
+  
+  let message = `Component "${componentName}" not found in registry.`
+  
+  if (similar.length > 0) {
+    message += '\n\n  Did you mean one of these?'
+    similar.forEach(name => {
+      message += `\n    • ${name}`
+    })
+  }
+  
+  message += '\n\n  Available components:'
+  
+  const sorted = [...availableComponents].sort()
+  const columns = 3
+  const itemsPerColumn = Math.ceil(sorted.length / columns)
+  
+  for (let i = 0; i < itemsPerColumn; i++) {
+    let row = '    '
+    for (let col = 0; col < columns; col++) {
+      const idx = i + col * itemsPerColumn
+      if (idx < sorted.length) {
+        row += sorted[idx].padEnd(20)
+      }
+    }
+    message += '\n' + row.trimEnd()
+  }
+  
+  return message
+}

package/src/utils/preflight.js

@@ -0,0 +1,172 @@
+import fs from 'node:fs'
+import path from 'node:path'
+import pc from 'picocolors'
+
+/**
+ * Pre-flight checks to ensure the project environment is ready for NovaUI
+ */
+
+export function checkPackageJson(cwd) {
+  const pkgPath = path.join(cwd, 'package.json')
+  if (!fs.existsSync(pkgPath)) {
+    throw new Error('package.json not found. Please run this command in a valid Node.js project.')
+  }
+  
+  try {
+    const pkg = JSON.parse(fs.readFileSync(pkgPath, 'utf-8'))
+    return pkg
+  } catch (error) {
+    throw new Error('package.json is invalid or cannot be parsed.')
+  }
+}
+
+export function checkReactNativeProject(pkg) {
+  const deps = {
+    ...pkg.dependencies,
+    ...pkg.devDependencies,
+  }
+  
+  if (!deps['react-native'] && !deps['expo']) {
+    console.log('')
+    console.log(pc.yellow('  ⚠  Warning: react-native or expo not found in dependencies.'))
+    console.log(pc.dim('     NovaUI is designed for React Native projects.'))
+    console.log('')
+  }
+}
+
+export function checkBabelConfig(cwd) {
+  const babelPaths = [
+    path.join(cwd, 'babel.config.js'),
+    path.join(cwd, 'babel.config.json'),
+    path.join(cwd, '.babelrc'),
+    path.join(cwd, '.babelrc.js'),
+  ]
+  
+  for (const babelPath of babelPaths) {
+    if (fs.existsSync(babelPath)) {
+      return babelPath
+    }
+  }
+  
+  return null
+}
+
+export function checkNativeWindInBabel(cwd) {
+  const babelPath = checkBabelConfig(cwd)
+  
+  if (!babelPath) {
+    console.log('')
+    console.log(pc.yellow('  ⚠  Warning: babel.config.js not found.'))
+    console.log(pc.dim('     NativeWind requires Babel configuration.'))
+    console.log('')
+    return false
+  }
+  
+  try {
+    const content = fs.readFileSync(babelPath, 'utf-8')
+    const hasNativeWind = content.includes('nativewind/babel') || content.includes('"nativewind/babel"')
+    
+    if (!hasNativeWind) {
+      console.log('')
+      console.log(pc.yellow('  ⚠  Warning: NativeWind not detected in Babel config.'))
+      console.log(pc.dim('     Add "nativewind/babel" to your Babel plugins:'))
+      console.log('')
+      console.log(pc.cyan('     module.exports = {'))
+      console.log(pc.cyan('       plugins: ["nativewind/babel"],'))
+      console.log(pc.cyan('     }'))
+      console.log('')
+      console.log(pc.dim('     See: https://www.nativewind.dev/docs/getting-started/installation'))
+      console.log('')
+      return false
+    }
+    
+    return true
+  } catch (error) {
+    console.log('')
+    console.log(pc.yellow('  ⚠  Warning: Could not read babel.config.js'))
+    console.log('')
+    return false
+  }
+}
+
+export function checkReactNativeVersion(pkg) {
+  const deps = {
+    ...pkg.dependencies,
+    ...pkg.devDependencies,
+  }
+  
+  const rnVersion = deps['react-native']
+  if (rnVersion) {
+    const versionMatch = rnVersion.match(/(\d+)\.(\d+)/)
+    if (versionMatch) {
+      const [, major, minor] = versionMatch
+      const majorNum = parseInt(major, 10)
+      const minorNum = parseInt(minor, 10)
+      
+      if (majorNum < 0 || (majorNum === 0 && minorNum < 72)) {
+        console.log('')
+        console.log(pc.yellow('  ⚠  Warning: React Native version is below 0.72'))
+        console.log(pc.dim('     NovaUI requires React Native >= 0.72'))
+        console.log('')
+        return false
+      }
+    }
+  }
+  
+  return true
+}
+
+export function checkNativeWindVersion(pkg) {
+  const deps = {
+    ...pkg.dependencies,
+    ...pkg.devDependencies,
+  }
+  
+  const nwVersion = deps['nativewind']
+  if (!nwVersion) {
+    console.log('')
+    console.log(pc.yellow('  ⚠  Warning: NativeWind not found in package.json'))
+    console.log(pc.dim('     NovaUI requires NativeWind >= 4.0'))
+    console.log(pc.dim('     Install: npm install nativewind'))
+    console.log(pc.dim('     See: https://www.nativewind.dev/docs/getting-started/installation'))
+    console.log('')
+    return false
+  }
+  
+  // Check if version 4 or higher
+  const versionMatch = nwVersion.match(/(\d+)/)
+  if (versionMatch) {
+    const [, major] = versionMatch
+    const majorNum = parseInt(major, 10)
+    
+    if (majorNum < 4) {
+      console.log('')
+      console.log(pc.yellow('  ⚠  Warning: NativeWind version is below 4.0'))
+      console.log(pc.dim('     NovaUI requires NativeWind >= 4.0'))
+      console.log(pc.dim('     Upgrade: npm install nativewind@latest'))
+      console.log('')
+      return false
+    }
+  }
+  
+  return true
+}
+
+/**
+ * Run all pre-flight checks before init command
+ */
+export function runInitPreflightChecks(cwd) {
+  const pkg = checkPackageJson(cwd)
+  checkReactNativeProject(pkg)
+  checkNativeWindVersion(pkg)
+  checkNativeWindInBabel(cwd)
+  checkReactNativeVersion(pkg)
+}
+
+/**
+ * Run minimal pre-flight checks before add command
+ */
+export function runAddPreflightChecks(cwd) {
+  const pkg = checkPackageJson(cwd)
+  return pkg
+}

package/src/utils/tailwind.js

@@ -0,0 +1,60 @@
+export function getTailwindConfigContent(config) {
+  const normalized = config.componentsUi.replace(/^\.\//, '')
+  const contentPaths = ['"./App.{js,jsx,ts,tsx}"', '"./src/**/*.{js,jsx,ts,tsx}"']
+  if (!normalized.startsWith('src/')) {
+    contentPaths.push(`"./${normalized}/**/*.{js,jsx,ts,tsx}"`)
+  }
+  return `/** @type {import('tailwindcss').Config} */
+module.exports = {
+  content: [
+    ${contentPaths.join(',\n    ')},
+  ],
+  presets: [require("nativewind/preset")],
+  theme: {
+    extend: {
+      colors: {
+        border: "hsl(var(--border))",
+        input: "hsl(var(--input))",
+        ring: "hsl(var(--ring))",
+        background: "hsl(var(--background))",
+        foreground: "hsl(var(--foreground))",
+        primary: {
+          DEFAULT: "hsl(var(--primary))",
+          foreground: "hsl(var(--primary-foreground))",
+        },
+        secondary: {
+          DEFAULT: "hsl(var(--secondary))",
+          foreground: "hsl(var(--secondary-foreground))",
+        },
+        destructive: {
+          DEFAULT: "hsl(var(--destructive))",
+          foreground: "hsl(var(--destructive-foreground))",
+        },
+        muted: {
+          DEFAULT: "hsl(var(--muted))",
+          foreground: "hsl(var(--muted-foreground))",
+        },
+        accent: {
+          DEFAULT: "hsl(var(--accent))",
+          foreground: "hsl(var(--accent-foreground))",
+        },
+        popover: {
+          DEFAULT: "hsl(var(--popover))",
+          foreground: "hsl(var(--popover-foreground))",
+        },
+        card: {
+          DEFAULT: "hsl(var(--card))",
+          foreground: "hsl(var(--card-foreground))",
+        },
+      },
+      borderRadius: {
+        lg: "var(--radius)",
+        md: "calc(var(--radius) - 2px)",
+        sm: "calc(var(--radius) - 4px)",
+      },
+    },
+  },
+  plugins: [],
+};
+`
+}

package/src/utils/validate.js

@@ -0,0 +1,17 @@
+export function assertValidComponentConfig(componentName, componentConfig) {
+  if (!componentConfig || typeof componentConfig !== 'object') {
+    throw new Error(`Registry entry for "${componentName}" is invalid.`)
+  }
+
+  const { files, dependencies } = componentConfig
+  if (!Array.isArray(files) || files.some(file => typeof file !== 'string' || file.trim() === '')) {
+    throw new Error(`Registry entry for "${componentName}" must include a valid "files" array.`)
+  }
+
+  if (
+    dependencies !== undefined &&
+    (!Array.isArray(dependencies) || dependencies.some(dep => typeof dep !== 'string' || dep.trim() === ''))
+  ) {
+    throw new Error(`Registry entry for "${componentName}" has an invalid "dependencies" array.`)
+  }
+}

package/src/utils/version-check.js

@@ -0,0 +1,136 @@
+import pc from 'picocolors'
+import { getCliVersion } from './version.js'
+import { fetchWithTimeout } from './fetch.js'
+
+const NPM_REGISTRY_URL = 'https://registry.npmjs.org/novaui-cli/latest'
+const CHECK_INTERVAL_MS = 24 * 60 * 60 * 1000 // 24 hours
+const CACHE_FILE = '.novaui-version-check'
+
+/**
+ * Compare two semantic versions
+ * Returns: 1 if v1 > v2, -1 if v1 < v2, 0 if equal
+ */
+function compareVersions(v1, v2) {
+  const parts1 = v1.split('.').map(Number)
+  const parts2 = v2.split('.').map(Number)
+  
+  for (let i = 0; i < Math.max(parts1.length, parts2.length); i++) {
+    const part1 = parts1[i] || 0
+    const part2 = parts2[i] || 0
+    
+    if (part1 > part2) return 1
+    if (part1 < part2) return -1
+  }
+  
+  return 0
+}
+
+/**
+ * Fetch the latest version from npm registry
+ */
+async function getLatestVersion() {
+  try {
+    const response = await fetchWithTimeout(NPM_REGISTRY_URL)
+    if (!response.ok) return null
+    
+    const data = await response.json()
+    return data.version || null
+  } catch {
+    return null
+  }
+}
+
+/**
+ * Check if we should run the version check based on cache
+ */
+function shouldCheckVersion(cwd) {
+  const fs = require('node:fs')
+  const path = require('node:path')
+  const os = require('node:os')
+  
+  const cacheDir = path.join(os.homedir(), '.novaui')
+  const cachePath = path.join(cacheDir, CACHE_FILE)
+  
+  if (!fs.existsSync(cachePath)) {
+    return true
+  }
+  
+  try {
+    const cache = JSON.parse(fs.readFileSync(cachePath, 'utf-8'))
+    const lastCheck = new Date(cache.lastCheck).getTime()
+    const now = Date.now()
+    
+    return (now - lastCheck) > CHECK_INTERVAL_MS
+  } catch {
+    return true
+  }
+}
+
+/**
+ * Update the version check cache
+ */
+function updateCache(latestVersion) {
+  const fs = require('node:fs')
+  const path = require('node:path')
+  const os = require('node:os')
+  
+  const cacheDir = path.join(os.homedir(), '.novaui')
+  if (!fs.existsSync(cacheDir)) {
+    fs.mkdirSync(cacheDir, { recursive: true })
+  }
+  
+  const cachePath = path.join(cacheDir, CACHE_FILE)
+  const cache = {
+    lastCheck: new Date().toISOString(),
+    latestVersion,
+  }
+  
+  fs.writeFileSync(cachePath, JSON.stringify(cache, null, 2), 'utf-8')
+}
+
+/**
+ * Check for CLI updates and warn user if outdated
+ * Runs once per day to avoid slowing down commands
+ */
+export async function checkForUpdates() {
+  const currentVersion = getCliVersion()
+  
+  if (currentVersion === 'unknown') {
+    return
+  }
+  
+  // Only check once per day
+  const cwd = process.cwd()
+  if (!shouldCheckVersion(cwd)) {
+    return
+  }
+  
+  const latestVersion = await getLatestVersion()
+  
+  if (!latestVersion) {
+    return
+  }
+  
+  updateCache(latestVersion)
+  
+  if (compareVersions(latestVersion, currentVersion) > 0) {
+    console.log('')
+    console.log(pc.yellow(`  ⚠  A new version of novaui-cli is available!`))
+    console.log(pc.dim(`     Current: ${currentVersion}`))
+    console.log(pc.dim(`     Latest:  ${latestVersion}`))
+    console.log('')
+    console.log(pc.cyan(`     Update with: npm install -g novaui-cli@latest`))
+    console.log('')
+  }
+}
+
+/**
+ * Get version info for error reporting
+ */
+export function getVersionInfo() {
+  const currentVersion = getCliVersion()
+  return {
+    cli: currentVersion,
+    node: process.version,
+  }
+}