kaddidlehopper 0.4.0 → 0.6.0

package/src/cli.ts

@@ -1,29 +1,19 @@
-import { resolve, basename, join } from 'node:path'
-import { unlink } from 'node:fs/promises'
-import { Command, InvalidArgumentError } from 'commander'
+import { resolve, basename } from 'node:path'
+import { existsSync, readdirSync } from 'node:fs'
+import { cp, rm, mkdtemp, readFile, writeFile } from 'node:fs/promises'
+import { tmpdir } from 'node:os'
+import { join } from 'node:path'
+import { execSync } from 'node:child_process'
+import { Command } from 'commander'
 import chalk from 'chalk'
 import validatePackageName from 'validate-npm-package-name'
 
-import {
-  SUPPORTED_PACKAGE_MANAGERS,
-  createApp,
-  createDefaultEnvironment,
-  finalizeAddOns,
-  getAllAddOns,
-  getFrameworkByName,
-  getPackageManager,
-  DEFAULT_PACKAGE_MANAGER,
-  populateAddOnOptionsDefaults,
-} from '@tanstack/cta-engine'
-
-import { generateAgentsMd } from './agents-md.js'
 import type { CliOptions } from './types.js'
-import type {
-  Options,
-  PackageManager,
-} from '@tanstack/cta-engine'
 
-// Utility functions
+const GITHUB_REPO = 'https://github.com/jherr/kdh-templates.git'
+const MANIFEST_URL =
+  'https://raw.githubusercontent.com/jherr/kdh-templates/main/manifest.json'
+
 function sanitizePackageName(name: string): string {
   return name
     .toLowerCase()
@@ -52,302 +42,171 @@ function validateProjectName(name: string) {
   }
 }
 
-// Create environment with UI functions for console output
-function createEnvironment(appName: string) {
-  const env = createDefaultEnvironment()
-  env.appName = appName
-  env.intro = (message: string) => console.log(chalk.bold.cyan(message))
-  env.outro = (message: string) => console.log(chalk.bold.green(message))
-  env.info = (title?: string, message?: string) => {
-    if (title && message) {
-      console.log(chalk.blue(`${title}: ${message}`))
-    } else if (title) {
-      console.log(chalk.blue(title))
-    }
-  }
-  env.error = (title?: string, message?: string) => {
-    if (title && message) {
-      console.error(chalk.red(`${title}: ${message}`))
-    } else if (title) {
-      console.error(chalk.red(title))
-    }
-  }
-  env.warn = (title?: string, message?: string) => {
-    if (title && message) {
-      console.warn(chalk.yellow(`${title}: ${message}`))
-    } else if (title) {
-      console.warn(chalk.yellow(title))
-    }
-  }
-  env.spinner = () => ({
-    start: (message: string) => console.log(chalk.gray(`⟳ ${message}`)),
-    stop: (message: string) => console.log(chalk.green(`✓ ${message}`)),
-  })
-  return env
+function getPackageManagerFromUserAgent(): string | undefined {
+  const userAgent = process.env.npm_config_user_agent
+  if (!userAgent) return undefined
+  const pmSpec = userAgent.split(' ')[0]
+  const separatorPos = pmSpec.lastIndexOf('/')
+  return separatorPos !== -1 ? pmSpec.substring(0, separatorPos) : pmSpec
 }
 
-export interface CliConfig {
-  name: string
-  appName: string
-  defaultFramework: string
-  forcedMode?: string
-  forcedAddOns?: Array<string>
-}
-
-export function cli({
-  name,
-  appName,
-  defaultFramework,
-  forcedMode,
-  forcedAddOns = [],
-}: CliConfig) {
-  const environment = createEnvironment(appName)
+export function cli() {
   const program = new Command()
 
-  const defaultMode = forcedMode || 'file-router'
-
-  program.name(name).description(`CLI to create a new ${appName} application`)
+  program
+    .name('netlify-cta')
+    .description('CLI to create a new Netlify TanStack Start application')
 
   program.argument('[project-name]', 'name of the project')
 
   program
     .option('--no-install', 'skip installing dependencies')
-    .option<PackageManager>(
-      `--package-manager <${SUPPORTED_PACKAGE_MANAGERS.join('|')}>`,
-      `Explicitly tell the CLI to use this package manager`,
-      (value) => {
-        if (!SUPPORTED_PACKAGE_MANAGERS.includes(value as PackageManager)) {
-          throw new InvalidArgumentError(
-            `Invalid package manager: ${value}. The following are allowed: ${SUPPORTED_PACKAGE_MANAGERS.join(', ')}`,
-          )
-        }
-        return value as PackageManager
-      },
-    )
-    .option<Array<string> | boolean>(
-      '--add-ons [...add-ons]',
-      'pick from a list of available add-ons (comma separated list)',
-      (value: string) => {
-        let addOns: Array<string> | boolean = !!value
-        if (typeof value === 'string') {
-          addOns = value.split(',').map((addon) => addon.trim())
-        }
-        return addOns
-      },
-    )
-    .option('--list-add-ons', 'list all available add-ons', false)
-    .option('--list-addons-json', 'list all available add-ons as JSON', false)
     .option(
-      '--addon-details <addon-id>',
-      'show detailed information about a specific add-on',
+      '--package-manager <pm>',
+      'explicitly tell the CLI to use this package manager',
     )
+    .option('--add-ons [id]', 'starter ID to use from the template repo')
+    .option('--list-addons-json', 'list all available starters as JSON', false)
     .option('--no-git', 'do not create a git repository')
     .option(
       '--target-dir <path>',
       'the target directory for the application root',
-      '.',
     )
     .option(
       '-f, --force',
       'force project creation even if the target directory is not empty',
-      true,
     )
-    .option(
-      '--no-force',
-      'refuse to create if the target directory is not empty',
-    )
-    .option(
-      '--bare-bones',
-      'create minimal scaffolding for LLM modification',
-      true,
-    )
-    .option(
-      '--no-bare-bones',
-      'create full scaffolding (not minimal)',
-    )
-
-  program.action(async (projectName: string, options: CliOptions) => {
-    const framework = getFrameworkByName(defaultFramework)
-    if (!framework) {
-      console.error(`Framework '${defaultFramework}' not found`)
-      process.exit(1)
-    }
 
+  program.action(async (projectName: string | undefined, options: CliOptions) => {
     // Handle --list-addons-json
     if (options.listAddonsJson) {
-      const addOns = await getAllAddOns(framework, defaultMode)
-      const serialized = addOns
-        .filter((a) => !forcedAddOns.includes(a.id))
-        .map((addon) => ({
-          id: addon.id,
-          name: addon.name,
-          description: addon.description,
-          type: addon.type,
-          options: addon.options,
-        }))
-      console.log(JSON.stringify(serialized, null, 2))
-      return
+      const manifest = await fetch(MANIFEST_URL).then((r) => r.json()) as { starters: unknown }
+      console.log(JSON.stringify(manifest.starters, null, 2))
+      process.exit(0)
     }
 
-    // Handle --list-add-ons (text format)
-    if (options.listAddOns) {
-      const addOns = await getAllAddOns(framework, defaultMode)
-      let hasConfigurableAddOns = false
-      for (const addOn of addOns.filter((a) => !forcedAddOns.includes(a.id))) {
-        const hasOptions =
-          addOn.options && Object.keys(addOn.options).length > 0
-        const optionMarker = hasOptions ? '*' : ' '
-        if (hasOptions) hasConfigurableAddOns = true
-        console.log(
-          `${optionMarker} ${chalk.bold(addOn.id)}: ${addOn.description}`,
-        )
-      }
-      if (hasConfigurableAddOns) {
-        console.log('\n* = has configuration options')
-      }
-      return
-    }
+    // Resolve starter ID
+    const starterId =
+      typeof options.addOns === 'string' ? options.addOns : 'basic'
 
-    // Handle --addon-details
-    if (options.addonDetails) {
-      const addOns = await getAllAddOns(framework, defaultMode)
-      const addOn = addOns.find((a) => a.id === options.addonDetails)
-      if (!addOn) {
-        console.error(`Add-on '${options.addonDetails}' not found`)
-        process.exit(1)
-      }
-
-      console.log(
-        `${chalk.bold.cyan('Add-on Details:')} ${chalk.bold(addOn.name)}`,
-      )
-      console.log(`${chalk.bold('ID:')} ${addOn.id}`)
-      console.log(`${chalk.bold('Description:')} ${addOn.description}`)
-      console.log(`${chalk.bold('Type:')} ${addOn.type}`)
-      console.log(`${chalk.bold('Phase:')} ${addOn.phase}`)
-      console.log(`${chalk.bold('Supported Modes:')} ${addOn.modes.join(', ')}`)
-
-      if (addOn.dependsOn && addOn.dependsOn.length > 0) {
-        console.log(
-          `${chalk.bold('Dependencies:')} ${addOn.dependsOn.join(', ')}`,
-        )
-      }
-
-      if (addOn.options && Object.keys(addOn.options).length > 0) {
-        console.log(`\n${chalk.bold.yellow('Configuration Options:')}`)
-        for (const [optionName, option] of Object.entries(addOn.options)) {
-          if (option && typeof option === 'object' && 'type' in option) {
-            const opt = option as { label: string; description?: string; type: string; default: unknown; options?: Array<{ value: string; label: string }> }
-            console.log(`  ${chalk.bold(optionName)}:`)
-            console.log(`    Label: ${opt.label}`)
-            if (opt.description) {
-              console.log(`    Description: ${opt.description}`)
-            }
-            console.log(`    Type: ${opt.type}`)
-            console.log(`    Default: ${opt.default}`)
-            if (opt.type === 'select' && opt.options) {
-              console.log(`    Available values:`)
-              for (const choice of opt.options) {
-                console.log(`      - ${choice.value}: ${choice.label}`)
-              }
-            }
-          }
-        }
-      } else {
-        console.log(`\n${chalk.gray('No configuration options available')}`)
-      }
-
-      if (addOn.routes && addOn.routes.length > 0) {
-        console.log(`\n${chalk.bold.green('Routes:')}`)
-        for (const route of addOn.routes) {
-          console.log(`  ${chalk.bold(route.url)} (${route.name})`)
-          console.log(`    File: ${route.path}`)
-        }
-      }
-      return
-    }
-
-    // Handle project creation: target-dir defaults to current directory
-    const targetDir = resolve(options.targetDir ?? '.')
-    const isCurrentDir = targetDir === resolve(process.cwd())
+    // Resolve target directory — default to CWD
+    const targetDir = options.targetDir ? resolve(options.targetDir) : resolve(process.cwd())
 
+    // Resolve project name for package.json
     let resolvedProjectName: string
-    if (projectName) {
-      resolvedProjectName =
-        projectName === '.'
-          ? sanitizePackageName(getCurrentDirectoryName())
-          : sanitizePackageName(projectName)
-    } else if (isCurrentDir) {
-      resolvedProjectName = sanitizePackageName(getCurrentDirectoryName())
+    if (projectName && projectName !== '.') {
+      resolvedProjectName = sanitizePackageName(projectName)
     } else {
-      console.error('Project name is required when --target-dir is not the current directory')
-      program.help()
-      return
+      resolvedProjectName = sanitizePackageName(getCurrentDirectoryName())
     }
 
     const { valid, error } = validateProjectName(resolvedProjectName)
     if (!valid) {
-      console.error(error)
+      console.error(chalk.red(error))
       process.exit(1)
     }
 
-    // Determine selected add-ons
-    const selectedAddOns = new Set<string>([...forcedAddOns])
-    if (options.addOns && Array.isArray(options.addOns)) {
-      for (const a of options.addOns) {
-        selectedAddOns.add(a)
+    // Check if target directory exists and is non-empty
+    if (existsSync(targetDir)) {
+      const contents = readdirSync(targetDir)
+      if (contents.length > 0 && !options.force) {
+        console.error(
+          chalk.red(
+            `Target directory "${targetDir}" is not empty. Use --force to overwrite.`,
+          ),
+        )
+        process.exit(1)
       }
     }
 
-    const chosenAddOns = await finalizeAddOns(
-      framework,
-      defaultMode,
-      Array.from(selectedAddOns),
+    console.log(
+      chalk.bold.cyan(
+        `Creating a new Netlify TanStack Start app in ${chalk.white(targetDir)}...`,
+      ),
     )
+    console.log(chalk.gray(`Using starter: ${starterId}`))
+
+    // Sparse clone the template repo into a temp directory
+    const tmpDir = await mkdtemp(join(tmpdir(), 'netlify-cta-'))
+    try {
+      console.log(chalk.gray('⟳ Fetching template...'))
+      execSync(
+        `git clone --depth=1 --filter=blob:none --sparse ${GITHUB_REPO} ${tmpDir}`,
+        { stdio: 'pipe' },
+      )
+      execSync(
+        `git -C ${tmpDir} sparse-checkout set starters/${starterId}`,
+        { stdio: 'pipe' },
+      )
 
-    const finalOptions: Options = {
-      projectName: resolvedProjectName,
-      targetDir,
-      framework,
-      mode: defaultMode,
-      typescript: true,
-      tailwind: true,
-      packageManager:
-        options.packageManager ||
-        getPackageManager() ||
-        DEFAULT_PACKAGE_MANAGER,
-      git: options.git !== false,
-      install: options.install !== false,
-      chosenAddOns,
-      addOnOptions: {
-        ...populateAddOnOptionsDefaults(chosenAddOns),
-        project: { bareBones: options.bareBones ?? true },
-      },
-    }
+      const starterPath = join(tmpDir, 'starters', starterId)
+      if (!existsSync(starterPath)) {
+        console.error(
+          chalk.red(
+            `Starter "${starterId}" not found in the template repo. Run --list-addons-json to see available starters.`,
+          ),
+        )
+        process.exit(1)
+      }
 
-    environment.intro(`Creating a new ${appName} app in ${resolvedProjectName}...`)
-    await createApp(environment, finalOptions)
+      // Copy starter files to target directory
+      await cp(starterPath, targetDir, { recursive: true })
 
-    // Delete files specified in bareBones.deleteFiles for each add-on when in bare-bones mode
-    if (options.bareBones !== false) {
-      for (const addOn of chosenAddOns) {
-        const addOnWithBareBones = addOn as typeof addOn & {
-          bareBones?: { deleteFiles?: Array<string> }
-        }
-        if (addOnWithBareBones.bareBones?.deleteFiles) {
-          for (const file of addOnWithBareBones.bareBones.deleteFiles) {
-            const filePath = join(targetDir, file)
-            try {
-              await unlink(filePath)
-            } catch {
-              // File may not exist, ignore errors
-            }
-          }
+      // Update package.json name if a project name was provided
+      if (projectName && projectName !== '.') {
+        const pkgPath = join(targetDir, 'package.json')
+        if (existsSync(pkgPath)) {
+          const pkg = JSON.parse(await readFile(pkgPath, 'utf-8'))
+          pkg.name = resolvedProjectName
+          await writeFile(pkgPath, JSON.stringify(pkg, null, 2) + '\n')
         }
       }
+
+      console.log(chalk.green(`✓ Template copied`))
+    } finally {
+      await rm(tmpDir, { recursive: true, force: true })
+    }
+
+    // Initialize git repository
+    if (options.git !== false) {
+      try {
+        execSync('git init', { cwd: targetDir, stdio: 'pipe' })
+        console.log(chalk.green('✓ Initialized git repository'))
+      } catch {
+        console.warn(chalk.yellow('⚠ Could not initialize git repository'))
+      }
+    }
+
+    // Install dependencies
+    if (options.install !== false) {
+      const pm =
+        options.packageManager ??
+        getPackageManagerFromUserAgent() ??
+        'pnpm'
+      console.log(chalk.gray(`⟳ Installing dependencies with ${pm}...`))
+      try {
+        execSync(`${pm} install`, { cwd: targetDir, stdio: 'inherit' })
+        console.log(chalk.green('✓ Dependencies installed'))
+      } catch {
+        console.error(
+          chalk.red(
+            `Failed to install dependencies. Run \`${pm} install\` manually.`,
+          ),
+        )
+      }
     }
 
-    // Generate an AGENTS.md file in the root of the project
-    await generateAgentsMd(targetDir, resolvedProjectName, chosenAddOns as Array<{ packageFileDescriptions?: Record<string, string> }>)
+    console.log(chalk.bold.green('\nDone! Your project is ready.'))
+    console.log(chalk.white('\nNext steps:'))
+    console.log(chalk.cyan(`  cd ${basename(targetDir)}`))
+    if (options.install === false) {
+      const pm =
+        options.packageManager ??
+        getPackageManagerFromUserAgent() ??
+        'pnpm'
+      console.log(chalk.cyan(`  ${pm} install`))
+    }
+    console.log(chalk.cyan('  pnpm dev'))
   })
 
   program.parse()

package/src/index.ts

@@ -1,49 +1,3 @@
 #!/usr/bin/env node
-import { dirname, join } from 'node:path'
-import { fileURLToPath } from 'node:url'
-
-import {
-  registerFramework,
-  scanAddOnDirectories,
-  scanProjectDirectory,
-} from '@tanstack/cta-engine'
 import { cli } from './cli.js'
-
-const projectDirectory = join(
-  dirname(dirname(fileURLToPath(import.meta.url))),
-  'project',
-)
-
-const addOns = scanAddOnDirectories([
-  join(dirname(dirname(fileURLToPath(import.meta.url))), 'add-ons'),
-  join(dirname(dirname(fileURLToPath(import.meta.url))), 'examples'),
-])
-
-const { files, basePackageJSON, optionalPackages } = scanProjectDirectory(
-  projectDirectory,
-  join(dirname(dirname(fileURLToPath(import.meta.url))), 'project', 'base'),
-)
-
-registerFramework({
-  id: 'netlify-start',
-  name: 'Netlify TanStack Start',
-  description: 'TanStack Start applications for Netlify deployment',
-  version: '0.1.0',
-  base: files,
-  addOns,
-  basePackageJSON,
-  optionalPackages,
-  supportedModes: {
-    'file-router': {
-      displayName: 'File Router',
-      description: 'File-based routing with TanStack Start',
-      forceTypescript: true,
-    },
-  },
-})
-
-cli({
-  name: 'netlify-cta',
-  appName: 'Netlify TanStack Start',
-  defaultFramework: 'Netlify TanStack Start',
-})
+cli()

package/src/types.ts

@@ -1,15 +1,9 @@
-import type { PackageManager } from '@tanstack/cta-engine'
-
 export interface CliOptions {
-  projectName?: string
-  packageManager?: PackageManager
-  git?: boolean
-  addOns?: Array<string> | boolean
-  listAddOns?: boolean
-  listAddonsJson?: boolean
-  addonDetails?: string
-  targetDir?: string
-  install?: boolean
-  force?: boolean
-  bareBones?: boolean
+  install: boolean
+  packageManager: string | undefined
+  addOns: string | boolean | undefined
+  listAddonsJson: boolean
+  git: boolean
+  force: boolean | undefined
+  targetDir: string | undefined
 }

package/CONTEXT.md

@@ -1,139 +0,0 @@
-# Netlify CTA - Project Context
-
-## Overview
-
-`netlify-cta` is a custom CLI application that creates TanStack Start applications pre-configured for Netlify deployment. It's based on the `create-rwsdk` example pattern but builds TanStack Start apps instead of Redwood SDK apps.
-
-## What Was Built
-
-### CLI Structure
-
-```
-./
-├── package.json              # CLI package (workspace:* deps)
-├── tsconfig.json             # TypeScript config
-├── src/
-│   └── index.ts              # CLI entry point
-├── project/
-│   ├── packages.json         # Conditional dependencies
-│   └── base/
-│       ├── package.json      # Base project dependencies
-│       ├── vite.config.ts    # Vite + Start + Netlify + Tailwind
-│       ├── tsconfig.json     # TypeScript config
-│       ├── netlify.toml      # Netlify deployment config
-│       ├── _dot_gitignore    # Git ignore (becomes .gitignore)
-│       ├── public/
-│       │   └── favicon.ico
-│       └── src/
-│           ├── styles.css    # Tailwind CSS imports
-│           ├── router.tsx    # TanStack Router config
-│           └── routes/
-│               ├── __root.tsx   # Root layout with SSR shell
-│               └── index.tsx    # Home page - "Hello from Netlify"
-└── add-ons/
-    └── _dot_gitkeep          # Placeholder for future add-ons
-```
-
-### Key Features
-
-1. **TanStack Start**: Full SSR support with `@tanstack/react-start`
-2. **Netlify Deployment**: Pre-configured with `@netlify/vite-plugin-tanstack-start`
-3. **Tailwind CSS**: Installed and configured out of the box
-4. **File-based Routing**: Uses TanStack Router's file-based routing (TypeScript enforced)
-5. **Minimal Setup**: Just a home route saying "Hello from Netlify" - no demo routes
-
-### Framework Registration
-
-The CLI registers a framework called "Netlify TanStack Start" with:
-- ID: `netlify-start`
-- Single mode: `file-router` (TypeScript enforced)
-- No customized UI (uses default CTA UI)
-
-## Usage
-
-## Dependencies
-
-### CLI Dependencies
-- `@tanstack/cta-cli`: workspace:*
-- `@tanstack/cta-engine`: workspace:*
-
-### Generated Project Dependencies
-- `@tanstack/react-start`: ^1.132.0
-- `@tanstack/react-router`: ^1.132.0
-- `@netlify/vite-plugin-tanstack-start`: ^1.2.3
-- `tailwindcss`: ^4.0.6
-- `react`: ^19.2.0
-- `vite`: ^7.1.7
-
-## Files Reference
-
-### src/index.ts
-Registers the framework and starts the CLI. Key points:
-- Scans `project/` directory for base files
-- Scans `add-ons/` directory for add-ons (currently empty)
-- Registers single "file-router" mode with forced TypeScript
-
-### project/base/vite.config.ts
-Configures Vite with:
-- `@tanstack/devtools-vite` - TanStack devtools
-- `vite-tsconfig-paths` - Path alias support
-- `@tailwindcss/vite` - Tailwind CSS
-- `@netlify/vite-plugin-tanstack-start` - Netlify deployment
-- `@tanstack/react-start/plugin/vite` - TanStack Start
-- `@vitejs/plugin-react` - React support
-
-### project/base/src/routes/__root.tsx
-Root layout using TanStack Start's `shellComponent` for SSR:
-- Sets up HTML document structure
-- Configures head meta tags
-- Includes TanStack devtools
-- Renders children with Scripts for hydration
-
-### project/base/src/routes/index.tsx
-Simple home page with:
-- Teal/cyan gradient background
-- "Hello from Netlify" heading
-- Links to TanStack Start and Netlify docs
-- Edit instruction pointing to the file
-
-## Examples
-
-Four example applications are included:
-
-### Blog Example (`examples/blog/`)
-A Hawaii adventures travel blog built with content-collections and shadcn UI components.
-- Content-collections for markdown blog posts
-- Category-based navigation
-- Postcard-style blog cards with beautiful UI
-- Routes: `/`, `/posts/$slug`, `/category/$category`
-
-### Events Example (`examples/events/`)
-A pastry conference website ("Haute Pâtisserie 2026") with speakers, sessions, schedule, and AI assistant.
-- Content-collections for speakers and talks markdown content
-- Conference schedule with day-by-day timeline
-- AI-powered chat assistant (Remy) for conference navigation
-- Beautiful dark theme with Playfair Display font and copper/gold accents
-- Routes: `/`, `/schedule`, `/speakers`, `/speakers/$slug`, `/talks`, `/talks/$slug`, `/api/remy-chat`
-
-### Marketing Example (`examples/marketing/`)
-An AI-powered motorcycle marketing site with TanStack AI chat assistant.
-- TanStack AI for intelligent chat
-- TanStack Store for state management
-- Motorcycle product catalog
-- AI-powered product recommendations
-- Routes: `/`, `/motorcycles/$motorcycleId`, `/api/motorcycle-chat`
-
-### Resume Example (`examples/resume/`)
-A professional resume template with content-collections and shadcn UI components.
-- Content-collections for jobs and education
-- Interactive skills filter sidebar
-- Multiple shadcn UI components (badge, card, checkbox, hover-card, separator)
-- Routes: `/`
-
-## Future Enhancements
-
-Potential additions:
-- Add-ons for common Netlify features (Functions, Edge Functions, Blobs)
-- Authentication add-ons (Netlify Identity)
-- Database add-ons (Netlify DB, Supabase, etc.)
-- Customized UI with Netlify branding