@tanstack/cta-engine 0.10.0-alpha.14 → 0.10.0-alpha.16

package/src/types.ts

@@ -1,59 +1,133 @@
 import type { CODE_ROUTER, FILE_ROUTER } from './constants.js'
 import type { PackageManager } from './package-manager.js'
-import type { ToolChain } from './toolchain.js'
-
-export type Framework = 'solid' | 'react'
 
 export type TemplateOptions = 'typescript' | 'javascript' | 'file-router'
 
+export type Mode = typeof CODE_ROUTER | typeof FILE_ROUTER
+
+export type FileBundleHandler = {
+  getFiles: () => Promise<Array<string>>
+  getFileContents: (path: string) => Promise<string>
+}
+
+export type AddOnDefinition = {
+  id: string
+  name: string
+  description: string
+  type: 'add-on' | 'example' | 'starter' | 'toolchain'
+  link: string
+  templates: Array<string>
+  routes?: Array<{
+    url: string
+    name: string
+    path: string
+    jsName: string
+  }>
+  packageAdditions: {
+    dependencies?: Record<string, string>
+    devDependencies?: Record<string, string>
+    scripts?: Record<string, string>
+  }
+  command?: {
+    command: string
+    args?: Array<string>
+  }
+  readme?: string
+  phase: 'setup' | 'add-on'
+  shadcnComponents?: Array<string>
+  warning?: string
+  dependsOn?: Array<string>
+  integrations?: Array<{
+    type: 'provider' | 'root-provider' | 'layout' | 'header-user'
+    path: string
+    jsName: string
+  }>
+  variables?: Array<Variable>
+
+  files?: Record<string, string>
+  deletedFiles?: Array<string>
+}
+
+export type StarterDefinition = AddOnDefinition & {
+  type: 'starter'
+  version: string
+  author: string
+  link: string
+  license: string
+  mode: Mode
+  framework: string
+  typescript: boolean
+  tailwind: boolean
+}
+
+export type AddOn = AddOnDefinition & FileBundleHandler
+export type Starter = StarterDefinition & FileBundleHandler
+
+export type FrameworkDefinition = {
+  id: string
+  name: string
+  description: string
+  version: string
+
+  baseDirectory: string
+  addOnsDirectories: Array<string>
+  examplesDirectory: string
+}
+
+export type Framework = FrameworkDefinition &
+  FileBundleHandler & {
+    basePackageJSON: Record<string, any>
+    optionalPackages: Record<string, any>
+
+    getAddOns: () => Array<AddOn>
+  }
+
 export interface Options {
   framework: Framework
   projectName: string
   typescript: boolean
   tailwind: boolean
   packageManager: PackageManager
-  toolchain: ToolChain
-  mode: typeof CODE_ROUTER | typeof FILE_ROUTER
+  mode: Mode
   addOns: boolean
   chosenAddOns: Array<AddOn>
   git: boolean
   variableValues: Record<string, string | number | boolean>
-  overlay?: AddOn | undefined
-}
-
-export interface CliOptions {
-  template?: TemplateOptions
-  framework?: Framework
-  tailwind?: boolean
-  packageManager?: PackageManager
-  toolchain?: ToolChain
-  projectName?: string
-  git?: boolean
-  addOns?: Array<string> | boolean
-  listAddOns?: boolean
-  mcp?: boolean
-  mcpSse?: boolean
-  overlay?: string
-  targetDir?: string
+  starter?: AddOn | undefined
 }
 
-export type Environment = {
+type ProjectEnvironment = {
   startRun: () => void
   finishRun: () => void
   getErrors: () => Array<string>
+}
 
+type FileEnvironment = {
   appendFile: (path: string, contents: string) => Promise<void>
   copyFile: (from: string, to: string) => Promise<void>
   writeFile: (path: string, contents: string) => Promise<void>
   execute: (command: string, args: Array<string>, cwd: string) => Promise<void>
   deleteFile: (path: string) => Promise<void>
-
-  readFile: (path: string, encoding?: BufferEncoding) => Promise<string>
   exists: (path: string) => boolean
-  readdir: (path: string) => Array<string>
-  isDirectory: (path: string) => boolean
 }
 
+type UIEnvironment = {
+  intro: (message: string) => void
+  outro: (message: string) => void
+
+  info: (title?: string, message?: string) => void
+  error: (title?: string, message?: string) => void
+  warn: (title?: string, message?: string) => void
+
+  spinner: () => {
+    start: (message: string) => void
+    stop: (message: string) => void
+  }
+  confirm: (message: string) => Promise<boolean>
+}
+
+export type Environment = ProjectEnvironment & FileEnvironment & UIEnvironment
+
 type BooleanVariable = {
   name: string
   default: boolean
@@ -76,46 +150,3 @@ type StringVariable = {
 }
 
 export type Variable = BooleanVariable | NumberVariable | StringVariable
-
-export type AddOn = {
-  id: string
-  name: string
-  description: string
-  type: 'add-on' | 'example' | 'overlay'
-  link: string
-  templates: Array<string>
-  routes: Array<{
-    url: string
-    name: string
-  }>
-  packageAdditions: {
-    dependencies?: Record<string, string>
-    devDependencies?: Record<string, string>
-    scripts?: Record<string, string>
-  }
-  command?: {
-    command: string
-    args?: Array<string>
-  }
-  readme?: string
-  phase: 'setup' | 'add-on'
-  shadcnComponents?: Array<string>
-  warning?: string
-  dependsOn?: Array<string>
-  variables?: Array<Variable>
-
-  files?: Record<string, string>
-  deletedFiles?: Array<string>
-}
-
-export type Overlay = AddOn & {
-  type: 'overlay'
-  version: string
-  author: string
-  link: string
-  license: string
-  mode: typeof CODE_ROUTER | typeof FILE_ROUTER
-  framework: Framework
-  typescript: boolean
-  tailwind: boolean
-}

package/src/utils.ts

@@ -8,3 +8,20 @@ export function sortObject(
       return acc
     }, {})
 }
+
+export function jsSafeName(name: string) {
+  return name
+    .split(/[^a-zA-Z0-9]/)
+    .map((part) => part.charAt(0).toUpperCase() + part.slice(1))
+    .join('')
+}
+
+export function formatCommand({
+  command,
+  args,
+}: {
+  command: string
+  args: Array<string>
+}) {
+  return `${command} ${args.join(' ')}`.trim()
+}

package/tests/file-helper.test.ts

@@ -0,0 +1,37 @@
+import { describe, expect, it } from 'vitest'
+
+import { relativePath } from '../src/file-helpers.js'
+
+describe('relativePath', () => {
+  it('relative path with the same directory', () => {
+    expect(relativePath('src/utils.ts', 'src/index.ts')).toBe('./index.ts')
+  })
+  it('relative from a subdirectory', () => {
+    expect(relativePath('src/something/utils.ts', 'src/index.ts')).toBe(
+      '../index.ts',
+    )
+  })
+  it('relative to a subdirectory', () => {
+    expect(relativePath('src/utils.ts', 'src/something/index.ts')).toBe(
+      './something/index.ts',
+    )
+  })
+  it('same deep directory', () => {
+    expect(
+      relativePath('src/foo/bar/baz/utils.ts', 'src/foo/bar/baz/index.ts'),
+    ).toBe('./index.ts')
+  })
+  it('up several levels and down several levels', () => {
+    expect(relativePath('src/bar/baz/utils.ts', 'src/foo/bar/index.ts')).toBe(
+      '../../foo/bar/index.ts',
+    )
+  })
+  it('relative path with a different directory', () => {
+    expect(
+      relativePath(
+        './src/routes/__root.tsx.ejs',
+        'src/integrations/tanstack-query/layout.tsx',
+      ),
+    ).toBe('../integrations/tanstack-query/layout.tsx')
+  })
+})

package/tests/package-manager.test.ts

@@ -0,0 +1,154 @@
+import { describe, expect, it } from 'vitest'
+
+import {
+  getPackageManagerExecuteCommand,
+  getPackageManagerInstallCommand,
+  getPackageManagerScriptCommand,
+} from '../src/package-manager.js'
+import { formatCommand } from '../src/utils.js'
+
+describe('getPackageManagerScriptCommand', () => {
+  it('yarn', () => {
+    expect(formatCommand(getPackageManagerScriptCommand('yarn', ['dev']))).toBe(
+      'yarn run dev',
+    )
+  })
+  it('pnpm', () => {
+    expect(formatCommand(getPackageManagerScriptCommand('pnpm', ['dev']))).toBe(
+      'pnpm dev',
+    )
+  })
+  it('bun', () => {
+    expect(formatCommand(getPackageManagerScriptCommand('bun', ['dev']))).toBe(
+      'bunx --bun run dev',
+    )
+  })
+  it('deno', () => {
+    expect(formatCommand(getPackageManagerScriptCommand('deno', ['dev']))).toBe(
+      'deno task dev',
+    )
+  })
+  it('npm', () => {
+    expect(formatCommand(getPackageManagerScriptCommand('npm', ['dev']))).toBe(
+      'npm run dev',
+    )
+  })
+})
+
+describe('getPackageManagerExecuteCommand', () => {
+  it('yarn', () => {
+    expect(
+      formatCommand(
+        getPackageManagerExecuteCommand('yarn', 'shadcn', ['add', 'button']),
+      ),
+    ).toBe('yarn dlx shadcn add button')
+  })
+  it('pnpm', () => {
+    expect(
+      formatCommand(
+        getPackageManagerExecuteCommand('pnpm', 'shadcn', ['add', 'button']),
+      ),
+    ).toBe('pnpx shadcn add button')
+  })
+  it('bun', () => {
+    expect(
+      formatCommand(
+        getPackageManagerExecuteCommand('bun', 'shadcn', ['add', 'button']),
+      ),
+    ).toBe('bunx --bun shadcn add button')
+  })
+  it('deno', () => {
+    expect(
+      formatCommand(
+        getPackageManagerExecuteCommand('deno', 'shadcn', ['add', 'button']),
+      ),
+    ).toBe('deno run npm:shadcn add button')
+  })
+  it('npm', () => {
+    expect(
+      formatCommand(
+        getPackageManagerExecuteCommand('npm', 'shadcn', ['add', 'button']),
+      ),
+    ).toBe('npx shadcn add button')
+  })
+})
+
+describe('getPackageManagerInstallCommand', () => {
+  it('yarn install', () => {
+    expect(formatCommand(getPackageManagerInstallCommand('yarn'))).toBe(
+      'yarn install',
+    )
+  })
+  it('pnpm install', () => {
+    expect(formatCommand(getPackageManagerInstallCommand('pnpm'))).toBe(
+      'pnpm install',
+    )
+  })
+  it('bun install', () => {
+    expect(formatCommand(getPackageManagerInstallCommand('bun'))).toBe(
+      'bun install',
+    )
+  })
+  it('deno install', () => {
+    expect(formatCommand(getPackageManagerInstallCommand('deno'))).toBe(
+      'deno install',
+    )
+  })
+  it('npm install', () => {
+    expect(formatCommand(getPackageManagerInstallCommand('npm'))).toBe(
+      'npm install',
+    )
+  })
+
+  it('yarn install radix-ui', () => {
+    expect(
+      formatCommand(getPackageManagerInstallCommand('yarn', 'radix-ui')),
+    ).toBe('yarn add radix-ui')
+  })
+  it('pnpm install radix-ui', () => {
+    expect(
+      formatCommand(getPackageManagerInstallCommand('pnpm', 'radix-ui')),
+    ).toBe('pnpm add radix-ui')
+  })
+  it('bun install radix-ui', () => {
+    expect(
+      formatCommand(getPackageManagerInstallCommand('bun', 'radix-ui')),
+    ).toBe('bun install radix-ui')
+  })
+  it('deno install radix-ui', () => {
+    expect(
+      formatCommand(getPackageManagerInstallCommand('deno', 'radix-ui')),
+    ).toBe('deno install radix-ui')
+  })
+  it('npm install radix-ui', () => {
+    expect(
+      formatCommand(getPackageManagerInstallCommand('npm', 'radix-ui')),
+    ).toBe('npm install radix-ui')
+  })
+
+  it('yarn install vitest in dev mode', () => {
+    expect(
+      formatCommand(getPackageManagerInstallCommand('yarn', 'vitest', true)),
+    ).toBe('yarn add vitest --dev')
+  })
+  it('pnpm install vitest in dev mode', () => {
+    expect(
+      formatCommand(getPackageManagerInstallCommand('pnpm', 'vitest', true)),
+    ).toBe('pnpm add vitest --dev')
+  })
+  it('bun install vitest in dev mode', () => {
+    expect(
+      formatCommand(getPackageManagerInstallCommand('bun', 'vitest', true)),
+    ).toBe('bun install vitest -D')
+  })
+  it('deno install vitest in dev mode', () => {
+    expect(
+      formatCommand(getPackageManagerInstallCommand('deno', 'vitest', true)),
+    ).toBe('deno install vitest -D')
+  })
+  it('npm install vitest in dev mode', () => {
+    expect(
+      formatCommand(getPackageManagerInstallCommand('npm', 'vitest', true)),
+    ).toBe('npm install vitest -D')
+  })
+})

package/dist/cli.js

@@ -1,126 +0,0 @@
-import { Command, InvalidArgumentError } from 'commander';
-import { intro, log } from '@clack/prompts';
-import { createApp } from './create-app.js';
-import { normalizeOptions, promptForOptions } from './options.js';
-import { SUPPORTED_PACKAGE_MANAGERS } from './package-manager.js';
-import { SUPPORTED_TOOLCHAINS } from './toolchain.js';
-import runServer from './mcp.js';
-import { listAddOns } from './add-ons.js';
-import { DEFAULT_FRAMEWORK, SUPPORTED_FRAMEWORKS } from './constants.js';
-import { initAddOn } from './custom-add-on.js';
-import { createDefaultEnvironment } from './environment.js';
-import { add } from './add.js';
-export function cli({ name, appName, forcedMode, forcedAddOns, }) {
-    const program = new Command();
-    program.name(name).description(`CLI to create a new ${appName} application`);
-    program
-        .command('add')
-        .argument('add-on', 'Name of the add-on (or add-ons separated by commas)')
-        .action(async (addOn) => {
-        await add(addOn.split(',').map((addon) => addon.trim()));
-    });
-    program
-        .command('update-add-on')
-        .description('Create or update an add-on from the current project')
-        .action(async () => {
-        await initAddOn('add-on');
-    });
-    program
-        .command('update-overlay')
-        .description('Create or update a project overlay from the current project')
-        .action(async () => {
-        await initAddOn('overlay');
-    });
-    program.argument('[project-name]', 'name of the project');
-    if (!forcedMode) {
-        program.option('--template <type>', 'project template (typescript, javascript, file-router)', (value) => {
-            if (value !== 'typescript' &&
-                value !== 'javascript' &&
-                value !== 'file-router') {
-                throw new InvalidArgumentError(`Invalid template: ${value}. Only the following are allowed: typescript, javascript, file-router`);
-            }
-            return value;
-        });
-    }
-    program
-        .option('--framework <type>', 'project framework (solid, react)', (value) => {
-        if (!SUPPORTED_FRAMEWORKS.includes(value)) {
-            throw new InvalidArgumentError(`Invalid framework: ${value}. Only the following are allowed: ${SUPPORTED_FRAMEWORKS.join(', ')}`);
-        }
-        return value;
-    }, DEFAULT_FRAMEWORK)
-        .option('--overlay [url]', 'add an overlay from a URL', false)
-        .option(`--package-manager <${SUPPORTED_PACKAGE_MANAGERS.join('|')}>`, `Explicitly tell the CLI to use this package manager`, (value) => {
-        if (!SUPPORTED_PACKAGE_MANAGERS.includes(value)) {
-            throw new InvalidArgumentError(`Invalid package manager: ${value}. The following are allowed: ${SUPPORTED_PACKAGE_MANAGERS.join(', ')}`);
-        }
-        return value;
-    })
-        .option(`--toolchain <${SUPPORTED_TOOLCHAINS.join('|')}>`, `Explicitly tell the CLI to use this toolchain`, (value) => {
-        if (!SUPPORTED_TOOLCHAINS.includes(value)) {
-            throw new InvalidArgumentError(`Invalid toolchain: ${value}. The following are allowed: ${SUPPORTED_TOOLCHAINS.join(', ')}`);
-        }
-        return value;
-    })
-        .option('--tailwind', 'add Tailwind CSS', false)
-        .option('--add-ons [...add-ons]', 'pick from a list of available add-ons (comma separated list)', (value) => {
-        let addOns = !!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('--no-git', 'do not create a git repository')
-        .option('--target-dir <path>', 'the directory to create the project in')
-        .option('--mcp', 'run the MCP server', false)
-        .option('--mcp-sse', 'run the MCP server in SSE mode', false);
-    program.action(async (projectName, options) => {
-        if (options.listAddOns) {
-            await listAddOns(options, {
-                forcedMode,
-                forcedAddOns,
-            });
-        }
-        else if (options.mcp || options.mcpSse) {
-            await runServer(!!options.mcpSse, {
-                forcedMode,
-                forcedAddOns,
-                appName,
-            });
-        }
-        else {
-            try {
-                const cliOptions = {
-                    projectName,
-                    ...options,
-                };
-                if (forcedMode) {
-                    cliOptions.template = forcedMode;
-                }
-                let finalOptions = await normalizeOptions(cliOptions, forcedAddOns);
-                if (finalOptions) {
-                    intro(`Creating a new ${appName} app in ${projectName}...`);
-                }
-                else {
-                    intro(`Let's configure your ${appName} application`);
-                    finalOptions = await promptForOptions(cliOptions, {
-                        forcedMode,
-                        forcedAddOns,
-                    });
-                }
-                await createApp(finalOptions, {
-                    environment: createDefaultEnvironment(),
-                    cwd: options.targetDir || undefined,
-                    name,
-                    appName,
-                });
-            }
-            catch (error) {
-                log.error(error instanceof Error ? error.message : 'An unknown error occurred');
-                process.exit(1);
-            }
-        }
-    });
-    program.parse();
-}