@tanstack/create 0.49.1

package/src/attribution.ts

@@ -0,0 +1,245 @@
+import type {
+  AddOn,
+  AttributedFile,
+  DependencyAttribution,
+  FileProvenance,
+  Framework,
+  Integration,
+  IntegrationWithSource,
+  LineAttribution,
+  Starter,
+} from './types.js'
+
+export interface AttributionInput {
+  framework: Framework
+  chosenAddOns: Array<AddOn>
+  starter?: Starter
+  files: Record<string, string>
+}
+
+export interface AttributionOutput {
+  attributedFiles: Record<string, AttributedFile>
+  dependencies: Array<DependencyAttribution>
+}
+
+type Source = { sourceId: string; sourceName: string }
+
+// A pattern to search for in file content, with its source add-on
+interface Injection {
+  matches: (line: string) => boolean
+  appliesTo: (filePath: string) => boolean
+  source: Source
+}
+
+function normalizePath(path: string): string {
+  let p = path.startsWith('./') ? path.slice(2) : path
+  p = p.replace(/\.ejs$/, '').replace(/_dot_/g, '.')
+  const match = p.match(/^(.+\/)?__([^_]+)__(.+)$/)
+  return match ? (match[1] || '') + match[3] : p
+}
+
+async function getFileProvenance(
+  filePath: string,
+  framework: Framework,
+  addOns: Array<AddOn>,
+  starter?: Starter,
+): Promise<FileProvenance | null> {
+  const target = filePath.startsWith('./') ? filePath.slice(2) : filePath
+
+  if (starter) {
+    const files = await starter.getFiles()
+    if (files.some((f: string) => normalizePath(f) === target)) {
+      return {
+        source: 'starter',
+        sourceId: starter.id,
+        sourceName: starter.name,
+      }
+    }
+  }
+
+  // Order add-ons by type then phase (matches writeFiles order), check in reverse
+  const typeOrder = ['add-on', 'example', 'toolchain', 'deployment']
+  const phaseOrder = ['setup', 'add-on', 'example']
+  const ordered = typeOrder.flatMap((type) =>
+    phaseOrder.flatMap((phase) =>
+      addOns.filter((a) => a.phase === phase && a.type === type),
+    ),
+  )
+
+  for (let i = ordered.length - 1; i >= 0; i--) {
+    const files = await ordered[i].getFiles()
+    if (files.some((f: string) => normalizePath(f) === target)) {
+      return {
+        source: 'add-on',
+        sourceId: ordered[i].id,
+        sourceName: ordered[i].name,
+      }
+    }
+  }
+
+  const frameworkFiles = await framework.getFiles()
+  if (frameworkFiles.some((f: string) => normalizePath(f) === target)) {
+    return {
+      source: 'framework',
+      sourceId: framework.id,
+      sourceName: framework.name,
+    }
+  }
+
+  return null
+}
+
+// Build injection patterns from integrations (for source files)
+function integrationInjections(int: IntegrationWithSource): Array<Injection> {
+  const source = { sourceId: int._sourceId, sourceName: int._sourceName }
+  const injections: Array<Injection> = []
+
+  const appliesTo = (path: string) => {
+    if (int.type === 'vite-plugin') return path.includes('vite.config')
+    if (
+      int.type === 'provider' ||
+      int.type === 'root-provider' ||
+      int.type === 'devtools'
+    ) {
+      return path.includes('__root') || path.includes('root.tsx')
+    }
+    return false
+  }
+
+  if (int.import) {
+    const prefix = int.import.split(' from ')[0]
+    injections.push({
+      matches: (line) => line.includes(prefix),
+      appliesTo,
+      source,
+    })
+  }
+
+  const code = int.code || int.jsName
+  if (code) {
+    injections.push({
+      matches: (line) => line.includes(code),
+      appliesTo,
+      source,
+    })
+  }
+
+  return injections
+}
+
+// Build injection pattern from a dependency (for package.json)
+function dependencyInjection(dep: DependencyAttribution): Injection {
+  return {
+    matches: (line) => line.includes(`"${dep.name}"`),
+    appliesTo: (path) => path.endsWith('package.json'),
+    source: { sourceId: dep.sourceId, sourceName: dep.sourceName },
+  }
+}
+
+export async function computeAttribution(
+  input: AttributionInput,
+): Promise<AttributionOutput> {
+  const { framework, chosenAddOns, starter, files } = input
+
+  // Collect integrations tagged with source
+  const integrations: Array<IntegrationWithSource> = chosenAddOns.flatMap(
+    (addOn) =>
+      (addOn.integrations || []).map((int: Integration) => ({
+        ...int,
+        _sourceId: addOn.id,
+        _sourceName: addOn.name,
+      })),
+  )
+
+  // Collect dependencies from add-ons (from packageAdditions or packageTemplate)
+  const dependencies: Array<DependencyAttribution> = chosenAddOns.flatMap(
+    (addOn) => {
+      const result: Array<DependencyAttribution> = []
+      const source = { sourceId: addOn.id, sourceName: addOn.name }
+
+      const addDeps = (
+        deps: Record<string, unknown> | undefined,
+        type: 'dependency' | 'devDependency',
+      ) => {
+        if (!deps) return
+        for (const [name, version] of Object.entries(deps)) {
+          if (typeof version === 'string') {
+            result.push({ name, version, type, ...source })
+          }
+        }
+      }
+
+      // From static package.json
+      addDeps(addOn.packageAdditions?.dependencies, 'dependency')
+      addDeps(addOn.packageAdditions?.devDependencies, 'devDependency')
+
+      // From package.json.ejs template (strip EJS tags and parse)
+      if (addOn.packageTemplate) {
+        try {
+          const tmpl = JSON.parse(
+            addOn.packageTemplate.replace(/"[^"]*<%[^%]*%>[^"]*"/g, '""'),
+          )
+          addDeps(tmpl.dependencies, 'dependency')
+          addDeps(tmpl.devDependencies, 'devDependency')
+        } catch {}
+      }
+
+      return result
+    },
+  )
+
+  // Build unified injection patterns from both integrations and dependencies
+  const injections: Array<Injection> = [
+    ...integrations.flatMap(integrationInjections),
+    ...dependencies.map(dependencyInjection),
+  ]
+
+  const attributedFiles: Record<string, AttributedFile> = {}
+
+  for (const [filePath, content] of Object.entries(files)) {
+    const provenance = await getFileProvenance(
+      filePath,
+      framework,
+      chosenAddOns,
+      starter,
+    )
+    if (!provenance) continue
+
+    const lines = content.split('\n')
+    const relevant = injections.filter((inj) => inj.appliesTo(filePath))
+
+    // Find injected lines
+    const injectedLines = new Map<number, Source>()
+    for (const inj of relevant) {
+      lines.forEach((line, i) => {
+        if (inj.matches(line) && !injectedLines.has(i + 1)) {
+          injectedLines.set(i + 1, inj.source)
+        }
+      })
+    }
+
+    attributedFiles[filePath] = {
+      content,
+      provenance,
+      lineAttributions: lines.map((_, i): LineAttribution => {
+        const lineNum = i + 1
+        const inj = injectedLines.get(lineNum)
+        return inj
+          ? {
+              line: lineNum,
+              sourceId: inj.sourceId,
+              sourceName: inj.sourceName,
+              type: 'injected',
+            }
+          : {
+              line: lineNum,
+              sourceId: provenance.sourceId,
+              sourceName: provenance.sourceName,
+              type: 'original',
+            }
+      }),
+    }
+  }
+
+  return { attributedFiles, dependencies }
+}

package/src/config-file.ts

@@ -0,0 +1,76 @@
+import { resolve } from 'node:path'
+
+import { CONFIG_FILE } from './constants.js'
+import { createDefaultEnvironment } from './environment.js'
+
+import type { Environment, Options } from './types.js'
+
+export type PersistedOptions = Omit<
+  Partial<Options>,
+  'addOns' | 'chosenAddOns' | 'framework' | 'starter' | 'targetDir'
+> & {
+  framework: string
+  version: number
+  chosenAddOns: Array<string>
+  starter?: string
+}
+
+function createPersistedOptions(options: Options): PersistedOptions {
+  /* eslint-disable unused-imports/no-unused-vars */
+  const { chosenAddOns, framework, targetDir, ...rest } = options
+  /* eslint-enable unused-imports/no-unused-vars */
+  return {
+    ...rest,
+    version: 1,
+    framework: options.framework.id,
+    chosenAddOns: options.chosenAddOns.map((addOn) => addOn.id),
+    starter: options.starter?.id ?? undefined,
+  }
+}
+
+export async function writeConfigFileToEnvironment(
+  environment: Environment,
+  options: Options,
+) {
+  await environment.writeFile(
+    resolve(options.targetDir, CONFIG_FILE),
+    JSON.stringify(createPersistedOptions(options), null, 2),
+  )
+}
+
+export async function readConfigFileFromEnvironment(
+  environment: Environment,
+  targetDir: string,
+): Promise<PersistedOptions | null> {
+  try {
+    const configFile = resolve(targetDir, CONFIG_FILE)
+    const config = await environment.readFile(configFile)
+
+    const originalJSON = JSON.parse(config)
+
+    // Look for markers out outdated config files and upgrade the format on the fly (it will be written in the updated version after we add add-ons)
+    if (originalJSON.existingAddOns) {
+      if (originalJSON.framework === 'react') {
+        originalJSON.framework = 'react-cra'
+      }
+      originalJSON.chosenAddOns = originalJSON.existingAddOns
+      delete originalJSON.existingAddOns
+      delete originalJSON.addOns
+      if (originalJSON.toolchain && originalJSON.toolchain !== 'none') {
+        originalJSON.chosenAddOns.push(originalJSON.toolchain)
+      }
+      delete originalJSON.toolchain
+      delete originalJSON.variableValues
+    }
+
+    return originalJSON
+  } catch {
+    return null
+  }
+}
+
+export async function readConfigFile(
+  targetDir: string,
+): Promise<PersistedOptions | null> {
+  return readConfigFileFromEnvironment(createDefaultEnvironment(), targetDir)
+}

package/src/constants.ts

@@ -0,0 +1 @@
+export const CONFIG_FILE = '.cta.json'

package/src/create-app.ts

@@ -0,0 +1,288 @@
+import { basename, resolve } from 'node:path'
+
+import { isBase64 } from './file-helpers.js'
+import { formatCommand } from './utils.js'
+import { writeConfigFileToEnvironment } from './config-file.js'
+import {
+  getPackageManagerScriptCommand,
+  packageManagerInstall,
+} from './package-manager.js'
+import { createPackageJSON } from './package-json.js'
+import { createTemplateFile } from './template-file.js'
+import { installShadcnComponents } from './integrations/shadcn.js'
+import { setupGit } from './integrations/git.js'
+import { runSpecialSteps } from './special-steps/index.js'
+
+import type { Environment, FileBundleHandler, Options } from './types.js'
+
+async function writeFiles(environment: Environment, options: Options) {
+  const templateFileFromContent = createTemplateFile(environment, options)
+
+  async function writeFileBundle(bundle: FileBundleHandler) {
+    const files = await bundle.getFiles()
+
+    for (const file of files) {
+      const contents = await bundle.getFileContents(file)
+
+      const isBinaryFile = isBase64(contents)
+      if (isBinaryFile) {
+        await environment.writeFileBase64(
+          resolve(options.targetDir, file),
+          contents,
+        )
+      } else {
+        await templateFileFromContent(file, contents)
+      }
+    }
+
+    const deletedFiles = await bundle.getDeletedFiles()
+    for (const file of deletedFiles) {
+      await environment.deleteFile(resolve(options.targetDir, file))
+    }
+  }
+
+  environment.startStep({
+    id: 'write-framework-files',
+    type: 'file',
+    message: 'Writing framework files...',
+  })
+  await writeFileBundle(options.framework)
+  environment.finishStep('write-framework-files', 'Framework files written')
+
+  let wroteAddonFiles = false
+  for (const type of ['add-on', 'example', 'toolchain', 'deployment']) {
+    for (const phase of ['setup', 'add-on', 'example']) {
+      for (const addOn of options.chosenAddOns.filter(
+        (addOn) => addOn.phase === phase && addOn.type === type,
+      )) {
+        environment.startStep({
+          id: 'write-addon-files',
+          type: 'file',
+          message: `Writing ${addOn.name} files...`,
+        })
+        await writeFileBundle(addOn)
+        wroteAddonFiles = true
+      }
+    }
+  }
+  if (wroteAddonFiles) {
+    environment.finishStep('write-addon-files', 'Add-on files written')
+  }
+
+  if (options.starter) {
+    environment.startStep({
+      id: 'write-starter-files',
+      type: 'file',
+      message: 'Writing starter files...',
+    })
+    await writeFileBundle(options.starter)
+    environment.finishStep('write-starter-files', 'Starter files written')
+  }
+
+  environment.startStep({
+    id: 'write-package-json',
+    type: 'file',
+    message: 'Writing package.json...',
+  })
+  await environment.writeFile(
+    resolve(options.targetDir, './package.json'),
+    JSON.stringify(createPackageJSON(options), null, 2),
+  )
+  environment.finishStep('write-package-json', 'Package.json written')
+
+  environment.startStep({
+    id: 'write-config-file',
+    type: 'file',
+    message: 'Writing config file...',
+  })
+  await writeConfigFileToEnvironment(environment, options)
+  environment.finishStep('write-config-file', 'Config file written')
+}
+
+async function runCommandsAndInstallDependencies(
+  environment: Environment,
+  options: Options,
+) {
+  const s = environment.spinner()
+
+  // Setup git
+  if (options.git) {
+    s.start(`Initializing git repository...`)
+    environment.startStep({
+      id: 'initialize-git-repository',
+      type: 'command',
+      message: 'Initializing git repository...',
+    })
+
+    await setupGit(environment, options.targetDir)
+
+    environment.finishStep(
+      'initialize-git-repository',
+      'Initialized git repository',
+    )
+    s.stop(`Initialized git repository`)
+  }
+
+  // Run any special steps for the new add-ons
+  const specialSteps = new Set<string>([])
+  for (const addOn of options.chosenAddOns) {
+    for (const step of addOn.createSpecialSteps || []) {
+      specialSteps.add(step)
+    }
+  }
+  if (specialSteps.size) {
+    await runSpecialSteps(environment, options, Array.from(specialSteps))
+  }
+
+  // Install dependencies
+  if (options.install !== false) {
+    s.start(`Installing dependencies via ${options.packageManager}...`)
+    environment.startStep({
+      id: 'install-dependencies',
+      type: 'package-manager',
+      message: `Installing dependencies via ${options.packageManager}...`,
+    })
+    await packageManagerInstall(
+      environment,
+      options.targetDir,
+      options.packageManager,
+    )
+    environment.finishStep('install-dependencies', 'Installed dependencies')
+    s.stop(`Installed dependencies`)
+  } else {
+    s.start(`Skipping dependency installation...`)
+    environment.startStep({
+      id: 'skip-dependencies',
+      type: 'info',
+      message: `Skipping dependency installation...`,
+    })
+    environment.finishStep('skip-dependencies', 'Dependency installation skipped')
+    s.stop(`Dependency installation skipped`)
+  }
+
+  // Run any post-init special steps for the new add-ons
+  const postInitSpecialSteps = new Set<string>([])
+  for (const addOn of options.chosenAddOns) {
+    for (const step of addOn.postInitSpecialSteps || []) {
+      postInitSpecialSteps.add(step)
+    }
+  }
+  if (postInitSpecialSteps.size) {
+    await runSpecialSteps(
+      environment,
+      options,
+      Array.from(postInitSpecialSteps),
+    )
+  }
+
+  for (const phase of ['setup', 'add-on', 'example']) {
+    for (const addOn of options.chosenAddOns.filter(
+      (addOn) =>
+        addOn.phase === phase && addOn.command && addOn.command.command,
+    )) {
+      s.start(`Running commands for ${addOn.name}...`)
+      const cmd = formatCommand({
+        command: addOn.command!.command,
+        args: addOn.command!.args || [],
+      })
+      environment.startStep({
+        id: 'run-commands',
+        type: 'command',
+        message: cmd,
+      })
+      await environment.execute(
+        addOn.command!.command,
+        addOn.command!.args || [],
+        options.targetDir,
+        { inherit: true },
+      )
+      environment.finishStep('run-commands', 'Setup commands complete')
+      s.stop(`${addOn.name} commands complete`)
+    }
+  }
+
+  // Adding starter
+  if (
+    options.starter &&
+    options.starter.command &&
+    options.starter.command.command
+  ) {
+    s.start(`Setting up starter ${options.starter.name}...`)
+    const cmd = formatCommand({
+      command: options.starter.command.command,
+      args: options.starter.command.args || [],
+    })
+    environment.startStep({
+      id: 'run-starter-command',
+      type: 'command',
+      message: cmd,
+    })
+
+    await environment.execute(
+      options.starter.command.command,
+      options.starter.command.args || [],
+      options.targetDir,
+      { inherit: true },
+    )
+
+    environment.finishStep('run-starter-command', 'Starter command complete')
+    s.stop(`${options.starter.name} commands complete`)
+  }
+
+  await installShadcnComponents(environment, options.targetDir, options)
+}
+
+function report(environment: Environment, options: Options) {
+  const warnings: Array<string> = []
+  for (const addOn of options.chosenAddOns) {
+    if (addOn.warning) {
+      warnings.push(addOn.warning)
+    }
+  }
+
+  if (warnings.length > 0) {
+    environment.warn('Warnings', warnings.join('\n'))
+  }
+
+  // Format errors
+  let errorStatement = ''
+  if (environment.getErrors().length) {
+    errorStatement = `
+
+Errors were encountered during the creation of your app:
+
+${environment.getErrors().join('\n')}`
+  }
+
+  // Check if we created in current directory (user specified ".")
+  const isCurrentDirectory =
+    resolve(options.targetDir) === resolve(process.cwd())
+  const locationMessage = isCurrentDirectory
+    ? `Your ${environment.appName} app is ready.`
+    : `Your ${environment.appName} app is ready in '${basename(options.targetDir)}'.`
+  const cdInstruction = isCurrentDirectory
+    ? ''
+    : `% cd ${options.projectName}
+`
+
+  // Use the force luke! :)
+  environment.outro(
+    `${locationMessage}
+
+Use the following commands to start your app:
+${cdInstruction}% ${formatCommand(
+      getPackageManagerScriptCommand(options.packageManager, ['dev']),
+    )}
+
+Please read the README.md file for information on testing, styling, adding routes, etc.${errorStatement}`,
+  )
+}
+
+export async function createApp(environment: Environment, options: Options) {
+  environment.startRun()
+  await writeFiles(environment, options)
+  await runCommandsAndInstallDependencies(environment, options)
+  environment.finishRun()
+
+  report(environment, options)
+}