banhaten 0.1.1 → 0.1.3

package/src/cli/index.js

@@ -12,6 +12,8 @@ const packageRoot = path.resolve(
 )
 const registryRoot = path.join(packageRoot, "registry")
 const registryIndexPath = path.join(registryRoot, "index.json")
+const packageJsonPath = path.join(packageRoot, "package.json")
+const schemaRoot = path.join(packageRoot, "schema")
 
 const CONFIG_FILE = "banhaten.config.json"
 const FONT_IMPORTS = [
@@ -30,9 +32,14 @@ const VITE_DEV_DEPENDENCIES = {
 const CSS_START = "/* Banhaten design system tokens:"
 const CSS_END = "/* End Banhaten design system tokens. */"
 const syncExistsCache = new Map()
+const VALUE_FLAGS = new Set(["cwd", "file", "format"])
+let runtimeOptions = {
+  json: false,
+  silent: false,
+}
 
 const DEFAULT_CONFIG = {
-  $schema: "https://banhaten.dev/schema.json",
+  $schema: ".banhaten/schema/config.schema.json",
   style: "default",
   tsx: true,
   tailwind: {
@@ -46,6 +53,7 @@ const DEFAULT_CONFIG = {
 }
 
 const registry = await readJson(registryIndexPath)
+const packageManifest = await readJson(packageJsonPath)
 
 main().catch((error) => {
   console.error(`banhaten: ${error.message}`)
@@ -54,6 +62,15 @@ main().catch((error) => {
 
 async function main() {
   const { command, positionals, flags } = parseArgs(process.argv.slice(2))
+  runtimeOptions = {
+    json: Boolean(flags.json),
+    silent: Boolean(flags.silent || flags.s),
+  }
+
+  if (command === "version" || flags.version || flags.v) {
+    console.log(packageManifest.version)
+    return
+  }
 
   if (!command || command === "help" || flags.help || flags.h) {
     printHelp()
@@ -61,7 +78,22 @@ async function main() {
   }
 
   if (command === "list") {
-    listComponents()
+    listComponents(flags)
+    return
+  }
+
+  if (command === "search") {
+    searchComponents(positionals, flags)
+    return
+  }
+
+  if (command === "docs") {
+    showComponentDocs(positionals, flags)
+    return
+  }
+
+  if (command === "view") {
+    await viewComponent(positionals, flags)
     return
   }
 
@@ -100,6 +132,21 @@ function parseArgs(argv) {
       continue
     }
 
+    if (arg === "-s") {
+      flags.s = true
+      continue
+    }
+
+    if (arg === "-v") {
+      flags.v = true
+      continue
+    }
+
+    if (arg === "-y") {
+      flags.yes = true
+      continue
+    }
+
     if (!arg.startsWith("--")) {
       positionals.push(arg)
       continue
@@ -114,7 +161,7 @@ function parseArgs(argv) {
     }
 
     const next = argv[index + 1]
-    if ((key === "cwd" || key === "out") && next && !next.startsWith("-")) {
+    if (VALUE_FLAGS.has(key) && next && !next.startsWith("-")) {
       flags[key] = next
       index += 1
       continue
@@ -135,24 +182,196 @@ Usage:
   banhaten add <component...> [--cwd <path>] [--force] [--dry-run]
   banhaten diff [component...] [--cwd <path>] [--force]
   banhaten update [component...] [--cwd <path>] [--force] [--dry-run]
-  banhaten list
+  banhaten list [--json]
+  banhaten search <query> [--json]
+  banhaten docs <component> [--json]
+  banhaten view <component> [--file <registry-source>] [--json]
+  banhaten version
 
 Examples:
   npx banhaten init
   npx banhaten add button
   npx banhaten diff
   npx banhaten update button
+  npx banhaten search input
+  npx banhaten docs button
+  npx banhaten view button
+
+Global flags:
+  --cwd <path>     Run against a project directory.
+  --dry-run        Preview writes without changing files.
+  --force          Rewrite generated files even when already current.
+  --json           Print machine-readable output where supported.
+  --silent, -s     Suppress normal command output.
+  --yes, -y        Accepted for non-interactive scripts.
+  --version, -v    Print the installed CLI version.
 `)
 }
 
 function listComponents() {
-  const names = Object.keys(registry.components)
+  const components = Object.entries(registry.components).map(([name, component]) => ({
+    name,
+    description: component.description || "",
+    dependencies: Object.keys(component.dependencies || {}),
+    registryDependencies: component.registryDependencies || [],
+  }))
+
+  if (runtimeOptions.json) {
+    writeJson({ components })
+    return
+  }
+
+  if (runtimeOptions.silent) return
 
   console.log("Available Banhaten design system components:")
-  for (const name of names) {
-    const component = registry.components[name]
-    console.log(`- ${name}: ${component.description}`)
+  for (const { name, description } of components) {
+    console.log(`- ${name}: ${description}`)
+  }
+}
+
+function searchComponents(positionals) {
+  const query = positionals.join(" ").trim().toLowerCase()
+  if (!query) {
+    throw new Error("missing search query. Try `banhaten search input`.")
+  }
+
+  const matches = Object.entries(registry.components)
+    .filter(([name, component]) => {
+      const haystack = [
+        name,
+        component.description,
+        ...(component.parts || []),
+        ...(component.registryDependencies || []),
+      ]
+        .filter(Boolean)
+        .join(" ")
+        .toLowerCase()
+
+      return haystack.includes(query)
+    })
+    .map(([name, component]) => ({
+      name,
+      description: component.description || "",
+      parts: component.parts || [],
+    }))
+
+  if (runtimeOptions.json) {
+    writeJson({ query, matches })
+    return
+  }
+
+  if (runtimeOptions.silent) return
+
+  if (matches.length === 0) {
+    console.log(`No Banhaten components matched "${query}".`)
+    return
+  }
+
+  console.log(`Banhaten components matching "${query}":`)
+  for (const match of matches) {
+    console.log(`- ${match.name}: ${match.description}`)
+  }
+}
+
+function showComponentDocs(positionals) {
+  const [name] = positionals
+  const component = getComponentOrThrow(name)
+  const docsPath = getComponentDocPath(name)
+  const result = {
+    name,
+    description: component.description || "",
+    install: `npx banhaten add ${name}`,
+    docsPath,
+    files: component.files || [],
+    examples: component.examples || [],
+  }
+
+  if (runtimeOptions.json) {
+    writeJson(result)
+    return
+  }
+
+  if (runtimeOptions.silent) return
+
+  console.log(`${name}: ${result.description}`)
+  console.log(`Install: ${result.install}`)
+  console.log(`Docs: ${docsPath}`)
+
+  if (result.files.length > 0) {
+    console.log("Files:")
+    for (const file of result.files) {
+      console.log(`- ${file.source} -> ${file.target}`)
+    }
+  }
+
+  if (result.examples.length > 0) {
+    console.log("Examples:")
+    for (const example of result.examples) {
+      console.log(`- ${example}`)
+    }
+  }
+}
+
+async function viewComponent(positionals, flags) {
+  const [name] = positionals
+  const component = getComponentOrThrow(name)
+  const files = component.files || []
+  const requestedFile = typeof flags.file === "string" ? flags.file : null
+  const file =
+    (requestedFile
+      ? files.find((entry) => entry.source === requestedFile)
+      : files.find((entry) => /\.(ts|tsx|css)$/.test(entry.source)) || files[0]) ||
+    null
+
+  if (!file) {
+    throw new Error(`component "${name}" has no viewable registry files.`)
+  }
+
+  const sourcePath = path.join(registryRoot, file.source)
+  const content = await fs.readFile(
+    sourcePath,
+    isTextRegistryFile(file.source) ? "utf8" : undefined
+  )
+
+  if (runtimeOptions.json) {
+    writeJson({
+      name,
+      file,
+      content: Buffer.isBuffer(content) ? content.toString("base64") : content,
+      encoding: Buffer.isBuffer(content) ? "base64" : "utf8",
+    })
+    return
   }
+
+  if (runtimeOptions.silent) return
+
+  console.log(Buffer.isBuffer(content) ? content.toString("base64") : content)
+}
+
+function getComponentOrThrow(name) {
+  if (!name) {
+    throw new Error("missing component name. Try `banhaten docs button`.")
+  }
+
+  const component = registry.components[name]
+  if (!component) {
+    throw new Error(`unknown component "${name}". Run \`banhaten list\`.`)
+  }
+
+  return component
+}
+
+function getComponentDocPath(name) {
+  const docAliases = {
+    "onboarding-step": "onboarding-step-list-item",
+  }
+  const docId = docAliases[name] || name
+
+  return `docs/design-system/components/${docId}.md`
+}
+
+function writeJson(value) {
+  console.log(JSON.stringify(value, null, 2))
 }
 
 async function initProject(flags) {
@@ -165,6 +384,7 @@ async function initProject(flags) {
 
   writes.push(
     ...(await writeConfig(cwd, config, { dryRun, force })),
+    ...(await writeProjectSchemaFiles(cwd, { dryRun, force })),
     ...(await writeBaseFiles(cwd, config, { dryRun, force })),
     ...(await writeGlobalCss(cwd, config, { dryRun, force })),
     ...(await writeAliasConfig(cwd, config, { dryRun, force }))
@@ -178,7 +398,7 @@ async function initProject(flags) {
   writes.push(...dependencyWrites)
 
   printResult("Initialized Banhaten design system", writes, dryRun)
-  printInstallHint(writes, dryRun)
+  await printInstallHint(cwd, writes, dryRun)
 }
 
 async function addComponents(names, flags) {
@@ -236,7 +456,9 @@ async function writeComponents(requestedNames, flags, options) {
 
   writes.push(
     ...(await writeConfig(cwd, config, { dryRun, force })),
+    ...(await writeProjectSchemaFiles(cwd, { dryRun, force })),
     ...(await writeBaseFiles(cwd, config, { dryRun, force })),
+    ...(await writeGlobalCss(cwd, config, { dryRun, force })),
     ...(await writeAliasConfig(cwd, config, { dryRun, force }))
   )
 
@@ -262,7 +484,7 @@ async function writeComponents(requestedNames, flags, options) {
   )))
 
   printResult(options.title, writes, dryRun)
-  printInstallHint(writes, dryRun)
+  await printInstallHint(cwd, writes, dryRun)
 }
 
 async function findInstalledComponents(cwd, config) {
@@ -371,6 +593,24 @@ async function detectCssPath(cwd, fallback) {
 async function writeConfig(cwd, config, options) {
   const configPath = path.join(cwd, CONFIG_FILE)
   if ((await exists(configPath)) && !options.force) {
+    const current = await fs.readFile(configPath, "utf8")
+    const currentConfig = JSON.parse(current)
+
+    if (currentConfig.$schema !== DEFAULT_CONFIG.$schema) {
+      const nextConfig = {
+        $schema: DEFAULT_CONFIG.$schema,
+        ...currentConfig,
+      }
+      nextConfig.$schema = DEFAULT_CONFIG.$schema
+      const status = await writeFile(
+        configPath,
+        `${JSON.stringify(nextConfig, null, 2)}\n`,
+        { dryRun: options.dryRun }
+      )
+
+      return [`${status} ${relative(cwd, configPath)}`]
+    }
+
     return [`kept ${relative(cwd, configPath)}`]
   }
 
@@ -382,6 +622,26 @@ async function writeConfig(cwd, config, options) {
   return [`${status} ${relative(cwd, configPath)}`]
 }
 
+async function writeProjectSchemaFiles(cwd, options) {
+  const schemaFiles = [
+    "config.schema.json",
+    "registry.schema.json",
+    "tokens.schema.json",
+  ]
+  const writes = []
+
+  for (const schemaFile of schemaFiles) {
+    const sourcePath = path.join(schemaRoot, schemaFile)
+    const targetPath = path.join(cwd, ".banhaten", "schema", schemaFile)
+    const source = await fs.readFile(sourcePath, "utf8")
+    const status = await writeFile(targetPath, source, options)
+
+    writes.push(`${status} ${relative(cwd, targetPath)}`)
+  }
+
+  return writes
+}
+
 async function writeBaseFiles(cwd, config, options) {
   return writeRegistryFiles(cwd, config, registry.base.files || [], options)
 }
@@ -409,17 +669,16 @@ async function writeGlobalCss(cwd, config, options) {
   const sourcePath = path.join(registryRoot, "styles", "globals.css")
   const tokenCss = await fs.readFile(sourcePath, "utf8")
   const current = await readTextIfExists(cssPath)
-
-  if (current?.includes(CSS_START) && !options.force) {
-    return [`kept ${relative(cwd, cssPath)}`]
-  }
+  const tokenBlock = current
+    ? removeExistingTokenBlock(current, relative(cwd, cssPath))
+    : { content: "", found: false }
 
   const nextCss = current
-    ? `${removeExistingTokenBlock(current).trimEnd()}\n\n${tokenCss}\n`
+    ? `${tokenBlock.content.trimEnd()}\n\n${tokenCss}\n`
     : `${tokenCss}\n`
   const next = ensureGlobalCssImports(nextCss)
 
-  const status = await writeFile(cssPath, next, { ...options, force: true })
+  const status = await writeFile(cssPath, next, options)
   return [`${status} ${relative(cwd, cssPath)}`]
 }
 
@@ -489,20 +748,17 @@ async function writeViteAliasConfig(cwd, aliasRoot, options) {
 
   const current = await fs.readFile(viteConfigPath, "utf8")
   const sourceRoot = shouldUseSrcDirectory(cwd) ? "./src" : "."
-  const aliasLine = `"${aliasRoot}": fileURLToPath(new URL("${sourceRoot}", import.meta.url))`
+  let next
 
-  if (
-    current.includes(aliasLine) &&
-    current.includes("@tailwindcss/vite") &&
-    current.includes("tailwindcss()")
-  ) {
-    return [`kept ${relative(cwd, viteConfigPath)}`]
+  try {
+    next = updateViteConfigSource(current, { aliasRoot, sourceRoot })
+  } catch (error) {
+    throw new Error(`${relative(cwd, viteConfigPath)}: ${error.message}`)
   }
 
-  let next = ensureNodeUrlImport(current)
-  next = ensureTailwindViteImport(next)
-  next = addViteResolveAlias(next, aliasRoot, sourceRoot)
-  next = addVitePluginCall(next, "tailwindcss()")
+  if (next === current) {
+    return [`kept ${relative(cwd, viteConfigPath)}`]
+  }
 
   const status = await writeFile(viteConfigPath, next, {
     dryRun: options.dryRun,
@@ -528,198 +784,957 @@ async function findViteConfigPath(cwd) {
 }
 
 function ensureNodeUrlImport(source) {
-  if (source.includes("fileURLToPath") && source.includes("node:url")) return source
+  const imports = parseImportDeclarations(source)
+  const nodeUrlImports = imports.filter((entry) => entry.moduleSpecifier === "node:url")
+  const importedLocals = new Set(nodeUrlImports.flatMap((entry) => entry.namedLocals))
+  const missing = ["fileURLToPath", "URL"].filter((name) => !importedLocals.has(name))
 
-  return `import { fileURLToPath, URL } from "node:url"\n${source}`
+  if (missing.length === 0) return source
+
+  return prependImportLines(
+    source,
+    [`import { ${missing.join(", ")} } from "node:url"`]
+  )
 }
 
-function ensureTailwindViteImport(source) {
-  if (source.includes("@tailwindcss/vite")) return source
+function ensureTailwindViteImport(source, localName) {
+  const imports = parseImportDeclarations(source)
+  const tailwindImport = imports.find(
+    (entry) => entry.moduleSpecifier === "@tailwindcss/vite"
+  )
 
-  return `import tailwindcss from "@tailwindcss/vite"\n${source}`
-}
+  if (!tailwindImport) {
+    return prependImportLines(
+      source,
+      [`import ${localName} from "@tailwindcss/vite"`]
+    )
+  }
 
-function addViteResolveAlias(source, aliasRoot, sourceRoot) {
-  const aliasLine = `"${aliasRoot}": fileURLToPath(new URL("${sourceRoot}", import.meta.url))`
-  if (source.includes(aliasLine)) return source
-  if (!source.includes("defineConfig({")) return source
-
-  const resolveBlock = [
-    "  resolve: {",
-    "    alias: {",
-    `      "${aliasRoot}": fileURLToPath(new URL("${sourceRoot}", import.meta.url)),`,
-    "    },",
-    "  },",
-  ].join("\n")
-
-  return source.replace("defineConfig({", `defineConfig({\n${resolveBlock}`)
-}
-
-function addVitePluginCall(source, pluginCall) {
-  if (source.includes(pluginCall)) return source
-
-  const pluginsPattern = /plugins:\s*\[([\s\S]*?)\]/
-  if (pluginsPattern.test(source)) {
-    return source.replace(pluginsPattern, (_match, plugins) => {
-      const currentPlugins = plugins.trim().replace(/,\s*$/, "")
-      const nextPlugins = currentPlugins
-        ? `${currentPlugins}, ${pluginCall}`
-        : pluginCall
-      return `plugins: [${nextPlugins}]`
-    })
+  if (!tailwindImport.defaultLocal) {
+    throw new Error(
+      "unsupported Vite config: @tailwindcss/vite must be imported with a default binding."
+    )
   }
 
-  if (!source.includes("defineConfig({")) return source
+  return source
+}
 
-  return source.replace("defineConfig({", `defineConfig({\n  plugins: [${pluginCall}],`)
+function updateViteConfigSource(source, { aliasRoot, sourceRoot }) {
+  const tailwindLocalName = getTailwindViteLocalName(source)
+  let next = addViteResolveAlias(source, aliasRoot, sourceRoot)
+  next = addVitePluginCall(next, `${tailwindLocalName}()`, tailwindLocalName)
+  next = ensureTailwindViteImport(next, tailwindLocalName)
+  next = ensureNodeUrlImport(next)
+  return next
 }
 
-async function getPackageChanges(cwd, dependencies) {
-  const devDependencies = { ...SETUP_DEV_DEPENDENCIES }
-  if (await findViteConfigPath(cwd)) {
-    Object.assign(devDependencies, VITE_DEV_DEPENDENCIES)
-  }
+function getTailwindViteLocalName(source) {
+  const tailwindImport = parseImportDeclarations(source).find(
+    (entry) => entry.moduleSpecifier === "@tailwindcss/vite"
+  )
 
-  return {
-    dependencies,
-    devDependencies,
-  }
+  if (!tailwindImport) return "tailwindcss"
+  if (tailwindImport.defaultLocal) return tailwindImport.defaultLocal
+
+  throw new Error(
+    "unsupported Vite config: @tailwindcss/vite must be imported with a default binding."
+  )
 }
 
-async function updatePackageJson(cwd, changes, options) {
-  const packagePath = path.join(cwd, "package.json")
-  const dependencies = changes.dependencies || {}
-  const devDependencies = changes.devDependencies || {}
-  const packageJson = (await readJsonIfExists(packagePath)) || {
-    name: path.basename(cwd).toLowerCase(),
-    version: "0.0.0",
-    private: true,
+function addViteResolveAlias(source, aliasRoot, sourceRoot) {
+  const configObject = findViteConfigObject(source)
+  const resolveProperty = findObjectProperty(source, configObject, "resolve")
+  const aliasEntry = `${JSON.stringify(aliasRoot)}: fileURLToPath(new URL(${JSON.stringify(
+    sourceRoot
+  )}, import.meta.url))`
+
+  if (!resolveProperty) {
+    return insertObjectProperty(
+      source,
+      configObject,
+      [
+        "resolve: {",
+        "  alias: {",
+        `    ${aliasEntry},`,
+        "  },",
+        "},",
+      ].join("\n")
+    )
   }
-  const added = [
-    ...addPackageSection(packageJson, "dependencies", dependencies),
-    ...addPackageSection(packageJson, "devDependencies", devDependencies),
-  ]
 
-  if (added.length === 0 && (await exists(packagePath))) {
-    return [`kept ${relative(cwd, packagePath)}`]
+  const resolveObject = expectObjectLiteralValue(
+    source,
+    resolveProperty,
+    "unsupported Vite config: resolve must be an object literal."
+  )
+  const aliasProperty = findObjectProperty(source, resolveObject, "alias")
+
+  if (!aliasProperty) {
+    return insertObjectProperty(
+      source,
+      resolveObject,
+      [
+        "alias: {",
+        `  ${aliasEntry},`,
+        "},",
+      ].join("\n")
+    )
   }
 
-  const status = await writeFile(packagePath, `${JSON.stringify(packageJson, null, 2)}\n`, {
-    dryRun: options.dryRun,
-    force: true,
-  })
+  const aliasObject = expectObjectLiteralValue(
+    source,
+    aliasProperty,
+    "unsupported Vite config: resolve.alias must be an object literal."
+  )
 
-  return [
-    `${status} ${relative(cwd, packagePath)}`,
-  ]
-}
+  if (findObjectProperty(source, aliasObject, aliasRoot)) {
+    return source
+  }
 
-function addPackageSection(packageJson, section, dependencies) {
-  const added = []
-  const existing = packageJson[section] || {}
+  return insertObjectProperty(source, aliasObject, `${aliasEntry},`)
+}
 
-  for (const [name, version] of Object.entries(dependencies)) {
-    if (hasPackageDependency(packageJson, name)) continue
+function addVitePluginCall(source, pluginCall, pluginLocalName) {
+  const configObject = findViteConfigObject(source)
+  const pluginsProperty = findObjectProperty(source, configObject, "plugins")
 
-    existing[name] = version
-    added.push(name)
+  if (!pluginsProperty) {
+    return insertObjectProperty(source, configObject, `plugins: [${pluginCall}],`)
   }
 
-  if (added.length > 0 || packageJson[section]) {
-    packageJson[section] = sortObject(existing)
+  const pluginsArray = expectArrayLiteralValue(
+    source,
+    pluginsProperty,
+    "unsupported Vite config: plugins must be an array literal."
+  )
+
+  if (arrayHasCallExpression(source, pluginsArray, pluginLocalName)) {
+    return source
   }
 
-  return added
+  return appendArrayElement(source, pluginsArray, pluginCall)
 }
 
-function hasPackageDependency(packageJson, name) {
-  return Boolean(
-    packageJson.dependencies?.[name] ||
-    packageJson.devDependencies?.[name] ||
-    packageJson.peerDependencies?.[name] ||
-    packageJson.optionalDependencies?.[name]
-  )
-}
+function findViteConfigObject(source) {
+  const expressionStart = findExportDefaultExpressionStart(source)
 
-function applyTemplate(source, config) {
-  return source
-    .replaceAll("@/lib/utils", config.aliases.utils)
-    .replaceAll("@/hooks", config.aliases.hooks)
-}
+  if (expressionStart === -1) {
+    throw new Error(
+      "unsupported Vite config: expected `export default defineConfig({ ... })` or `export default { ... }`."
+    )
+  }
 
-function isTextRegistryFile(source) {
-  return !/\.(avif|eot|gif|ico|jpe?g|otf|png|ttf|webp|woff2?)$/i.test(source)
-}
+  if (source[expressionStart] === "{") {
+    return createBracketRange(source, expressionStart, "{")
+  }
 
-function resolveTarget(cwd, config, target) {
-  const replacements = {
-    "{{ui}}": aliasToPath(cwd, config.aliases.ui),
-    "{{utils}}": stripExtension(aliasToPath(cwd, config.aliases.utils)),
-    "{{hooks}}": aliasToPath(cwd, config.aliases.hooks),
+  const callee = readIdentifierAt(source, expressionStart)
+  if (callee?.name !== "defineConfig") {
+    throw new Error(
+      "unsupported Vite config: default export must be `defineConfig({ ... })` or an object literal."
+    )
   }
 
-  let resolved = target
-  for (const [placeholder, value] of Object.entries(replacements)) {
-    resolved = resolved.replaceAll(placeholder, value)
+  let index = skipWhitespaceAndComments(source, callee.end)
+  if (source[index] !== "(") {
+    throw new Error("unsupported Vite config: malformed defineConfig call.")
   }
 
-  return resolved
+  index = skipWhitespaceAndComments(source, index + 1)
+  if (source[index] !== "{") {
+    throw new Error(
+      "unsupported Vite config: defineConfig must receive a config object literal."
+    )
+  }
+
+  return createBracketRange(source, index, "{")
 }
 
-function aliasToPath(cwd, alias) {
-  if (!alias) return ""
-  if (path.isAbsolute(alias)) return alias
-  if (alias.startsWith("./")) return alias.slice(2)
-  if (alias.startsWith("../")) return alias
+function findExportDefaultExpressionStart(source) {
+  let index = 0
 
-  if (alias.startsWith("@/") || alias.startsWith("~/")) {
-    const rest = alias.slice(2)
-    return path.join(shouldUseSrcDirectory(cwd) ? "src" : "", rest)
+  while (index < source.length) {
+    const next = skipIgnoredSyntax(source, index)
+    if (next !== index) {
+      index = next
+      continue
+    }
+
+    if (!matchIdentifier(source, index, "export")) {
+      index += 1
+      continue
+    }
+
+    const defaultStart = skipWhitespaceAndComments(source, index + "export".length)
+    if (!matchIdentifier(source, defaultStart, "default")) {
+      index += "export".length
+      continue
+    }
+
+    return skipWhitespaceAndComments(source, defaultStart + "default".length)
   }
 
-  return alias
+  return -1
 }
 
-function shouldUseSrcDirectory(cwd) {
-  return pathExistsSyncHint(cwd, "src/app") || pathExistsSyncHint(cwd, "src")
+function createBracketRange(source, start, open) {
+  const close = open === "{" ? "}" : open === "[" ? "]" : ")"
+  const end = findMatchingBracket(source, start, open, close)
+  return { start, end: end + 1 }
 }
 
-function pathExistsSyncHint(cwd, segment) {
-  return Boolean(syncExistsCache.get(path.join(cwd, segment)))
+function expectObjectLiteralValue(source, property, message) {
+  const valueStart = skipWhitespaceAndComments(source, property.valueStart)
+  if (source[valueStart] !== "{") throw new Error(message)
+  return createBracketRange(source, valueStart, "{")
 }
 
-async function warmPathHints(cwd) {
-  for (const segment of ["src", "src/app"]) {
-    const target = path.join(cwd, segment)
-    syncExistsCache.set(target, await exists(target))
-  }
+function expectArrayLiteralValue(source, property, message) {
+  const valueStart = skipWhitespaceAndComments(source, property.valueStart)
+  if (source[valueStart] !== "[") throw new Error(message)
+  return createBracketRange(source, valueStart, "[")
 }
 
-async function writeFile(targetPath, content, options) {
-  const alreadyExists = await exists(targetPath)
-  const isBinary = Buffer.isBuffer(content)
+function findObjectProperty(source, objectRange, propertyName) {
+  const bodyEnd = objectRange.end - 1
+  let index = objectRange.start + 1
 
-  if (options.dryRun) {
-    if (!alreadyExists) return "would write"
+  while (index < bodyEnd) {
+    index = skipWhitespaceCommentsAndCommas(source, index, bodyEnd)
+    if (index >= bodyEnd) return null
 
-    const current = await fs.readFile(targetPath)
-    const isEqual = isBinary
-      ? current.equals(content)
-      : current.toString("utf8") === content
-    if (isEqual) return "would keep"
+    const propertyStart = index
+    const name = readPropertyName(source, index)
+    const propertyEnd = findTopLevelCommaOrEnd(source, propertyStart, bodyEnd)
 
-    return "would update"
-  }
+    if (!name) {
+      index = propertyEnd + 1
+      continue
+    }
 
-  if (alreadyExists && !options.force) {
-    const current = await fs.readFile(targetPath)
-    const isEqual = isBinary
-      ? current.equals(content)
-      : current.toString("utf8") === content
-    if (isEqual) return "kept"
+    index = skipWhitespaceAndComments(source, name.end)
+    if (source[index] !== ":") {
+      if (name.name === propertyName) {
+        throw new Error(
+          `unsupported Vite config: ${propertyName} must be a normal object property.`
+        )
+      }
+      index = propertyEnd + 1
+      continue
+    }
+
+    if (name.name === propertyName) {
+      return {
+        name: name.name,
+        start: propertyStart,
+        end: propertyEnd,
+        valueStart: skipWhitespaceAndComments(source, index + 1),
+        valueEnd: propertyEnd,
+      }
+    }
+
+    index = propertyEnd + 1
   }
 
-  await fs.mkdir(path.dirname(targetPath), { recursive: true })
+  return null
+}
+
+function readPropertyName(source, index) {
+  if (source[index] === "\"" || source[index] === "'") {
+    const literal = readStringLiteral(source, index)
+    return literal ? { name: literal.value, end: literal.end } : null
+  }
+
+  return readIdentifierAt(source, index)
+}
+
+function insertObjectProperty(source, objectRange, propertyText) {
+  const insertAt = objectRange.start + 1
+  const bodyEnd = objectRange.end - 1
+  const body = source.slice(insertAt, bodyEnd)
+  const hasContent = body.trim().length > 0
+  const propertyIndent = detectObjectChildIndent(source, objectRange)
+  const closeIndent = getLineIndent(source, bodyEnd)
+  const indentedProperty = indentMultiline(propertyText, propertyIndent)
+
+  if (!hasContent) {
+    return `${source.slice(0, insertAt)}\n${indentedProperty}\n${closeIndent}${source.slice(insertAt)}`
+  }
+
+  const needsTrailingNewline = source[insertAt] !== "\n" && source[insertAt] !== "\r"
+  const insertion = `\n${indentedProperty}${needsTrailingNewline ? "\n" : ""}`
+  return `${source.slice(0, insertAt)}${insertion}${source.slice(insertAt)}`
+}
+
+function detectObjectChildIndent(source, objectRange) {
+  const bodyEnd = objectRange.end - 1
+  let index = objectRange.start + 1
+
+  while (index < bodyEnd) {
+    if (source[index] === "\n") {
+      const next = skipHorizontalWhitespace(source, index + 1)
+      if (next < bodyEnd && source[next] !== "\n" && source[next] !== "\r") {
+        return source.slice(index + 1, next)
+      }
+    }
+    index += 1
+  }
+
+  return `${getLineIndent(source, objectRange.start)}  `
+}
+
+function appendArrayElement(source, arrayRange, elementText) {
+  const bodyStart = arrayRange.start + 1
+  const bodyEnd = arrayRange.end - 1
+  const body = source.slice(bodyStart, bodyEnd)
+
+  if (body.trim().length === 0) {
+    return `${source.slice(0, bodyStart)}${elementText}${source.slice(bodyStart)}`
+  }
+
+  const contentEnd = trimEndIndex(source, bodyStart, bodyEnd)
+  const hasNewline = bodyIncludesNewline(source, bodyStart, bodyEnd)
+  const hasTrailingComma = previousCodeChar(source, contentEnd) === ","
+
+  if (!hasNewline) {
+    const separator = hasTrailingComma ? " " : ", "
+    return `${source.slice(0, contentEnd)}${separator}${elementText}${source.slice(contentEnd)}`
+  }
+
+  const closeIndent = getLineIndent(source, bodyEnd)
+  const elementIndent = `${closeIndent}  `
+  const separator = hasTrailingComma ? "\n" : ",\n"
+  return `${source.slice(0, contentEnd)}${separator}${elementIndent}${elementText},${source.slice(contentEnd)}`
+}
+
+function arrayHasCallExpression(source, arrayRange, localName) {
+  const bodyEnd = arrayRange.end - 1
+  let index = arrayRange.start + 1
+
+  while (index < bodyEnd) {
+    index = skipWhitespaceCommentsAndCommas(source, index, bodyEnd)
+    if (index >= bodyEnd) return false
+
+    const elementEnd = findTopLevelCommaOrEnd(source, index, bodyEnd)
+    if (startsWithCallExpression(source, index, elementEnd, localName)) {
+      return true
+    }
+    index = elementEnd + 1
+  }
+
+  return false
+}
+
+function startsWithCallExpression(source, start, end, localName) {
+  const index = skipWhitespaceAndComments(source, start)
+  if (!matchIdentifier(source, index, localName)) return false
+
+  const callStart = skipWhitespaceAndComments(source, index + localName.length)
+  if (source[callStart] !== "(") return false
+
+  const callEnd = createBracketRange(source, callStart, "(").end
+  const next = skipWhitespaceAndComments(source, callEnd)
+  return next <= end
+}
+
+function parseImportDeclarations(source) {
+  const declarations = []
+  let index = 0
+
+  while (index < source.length) {
+    const next = skipIgnoredSyntax(source, index)
+    if (next !== index) {
+      index = next
+      continue
+    }
+
+    if (!matchIdentifier(source, index, "import")) {
+      index += 1
+      continue
+    }
+
+    const clauseStart = skipWhitespaceAndComments(source, index + "import".length)
+    if (source[clauseStart] === ".") {
+      index = clauseStart + 1
+      continue
+    }
+    if (source[clauseStart] === "(") {
+      index = clauseStart + 1
+      continue
+    }
+
+    const end = findImportDeclarationEnd(source, index)
+    const declaration = source.slice(index, end)
+    const moduleSpecifier = getImportModuleSpecifier(declaration)
+
+    if (moduleSpecifier) {
+      declarations.push({
+        start: index,
+        end,
+        moduleSpecifier,
+        defaultLocal: getDefaultImportLocal(declaration),
+        namedLocals: getNamedImportLocals(declaration),
+      })
+    }
+
+    index = end
+  }
+
+  return declarations
+}
+
+function findImportDeclarationEnd(source, start) {
+  const stack = []
+  let sawModuleSpecifier = false
+  let index = start
+
+  while (index < source.length) {
+    const skipped = skipComment(source, index)
+    if (skipped !== index) {
+      index = skipped
+      continue
+    }
+
+    if (source[index] === "\"" || source[index] === "'") {
+      const literal = readStringLiteral(source, index)
+      if (!literal) return source.length
+      sawModuleSpecifier = true
+      index = literal.end
+      continue
+    }
+
+    if (isOpeningBracket(source[index])) {
+      stack.push(expectedClosingBracket(source[index]))
+      index += 1
+      continue
+    }
+
+    if (isClosingBracket(source[index])) {
+      if (stack.at(-1) === source[index]) stack.pop()
+      index += 1
+      continue
+    }
+
+    if (stack.length === 0 && source[index] === ";") return index + 1
+    if (
+      stack.length === 0 &&
+      sawModuleSpecifier &&
+      (source[index] === "\n" || source[index] === "\r")
+    ) {
+      return index + 1
+    }
+
+    index += 1
+  }
+
+  return source.length
+}
+
+function getImportModuleSpecifier(declaration) {
+  let moduleSpecifier = null
+  let index = 0
+
+  while (index < declaration.length) {
+    const skipped = skipComment(declaration, index)
+    if (skipped !== index) {
+      index = skipped
+      continue
+    }
+
+    if (declaration[index] === "\"" || declaration[index] === "'") {
+      const literal = readStringLiteral(declaration, index)
+      if (!literal) break
+      moduleSpecifier = literal.value
+      index = literal.end
+      continue
+    }
+
+    index += 1
+  }
+
+  return moduleSpecifier
+}
+
+function getDefaultImportLocal(declaration) {
+  let index = skipWhitespaceAndComments(declaration, "import".length)
+
+  if (matchIdentifier(declaration, index, "type")) {
+    index = skipWhitespaceAndComments(declaration, index + "type".length)
+  }
+
+  if (declaration[index] === "\"" || declaration[index] === "{" || declaration[index] === "*") {
+    return null
+  }
+
+  const local = readIdentifierAt(declaration, index)
+  return local?.name ?? null
+}
+
+function getNamedImportLocals(declaration) {
+  const open = declaration.indexOf("{")
+  if (open === -1) return []
+
+  const close = findMatchingBracket(declaration, open, "{", "}")
+  const namedImportBody = declaration.slice(open + 1, close)
+  const locals = []
+
+  for (const specifier of splitTopLevelList(namedImportBody)) {
+    const trimmed = specifier.trim()
+    if (!trimmed) continue
+
+    const withoutType = trimmed.startsWith("type ")
+      ? trimmed.slice("type ".length).trim()
+      : trimmed
+    const asIndex = withoutType.toLowerCase().lastIndexOf(" as ")
+    const localName = asIndex === -1
+      ? withoutType
+      : withoutType.slice(asIndex + " as ".length).trim()
+    const local = readIdentifierAt(localName, 0)
+
+    if (local) locals.push(local.name)
+  }
+
+  return locals
+}
+
+function splitTopLevelList(source) {
+  const items = []
+  let start = 0
+  let index = 0
+
+  while (index < source.length) {
+    const skipped = skipIgnoredSyntax(source, index)
+    if (skipped !== index) {
+      index = skipped
+      continue
+    }
+
+    if (source[index] === ",") {
+      items.push(source.slice(start, index))
+      start = index + 1
+    }
+    index += 1
+  }
+
+  items.push(source.slice(start))
+  return items
+}
+
+function prependImportLines(source, lines) {
+  if (lines.length === 0) return source
+
+  let insertAt = 0
+  if (source.startsWith("#!")) {
+    const lineEnd = source.indexOf("\n")
+    insertAt = lineEnd === -1 ? source.length : lineEnd + 1
+  }
+
+  const prefix = `${lines.join("\n")}\n`
+  return `${source.slice(0, insertAt)}${prefix}${source.slice(insertAt)}`
+}
+
+function findTopLevelCommaOrEnd(source, start, end) {
+  const stack = []
+  let index = start
+
+  while (index < end) {
+    const next = skipIgnoredSyntax(source, index)
+    if (next !== index) {
+      index = next
+      continue
+    }
+
+    if (isOpeningBracket(source[index])) {
+      stack.push(expectedClosingBracket(source[index]))
+      index += 1
+      continue
+    }
+
+    if (isClosingBracket(source[index])) {
+      if (stack.at(-1) === source[index]) stack.pop()
+      index += 1
+      continue
+    }
+
+    if (stack.length === 0 && source[index] === ",") return index
+    index += 1
+  }
+
+  return end
+}
+
+function findMatchingBracket(source, start, open, close) {
+  if (source[start] !== open) {
+    throw new Error("unsupported Vite config: malformed JavaScript object.")
+  }
+
+  const stack = []
+  let index = start
+
+  while (index < source.length) {
+    const next = skipIgnoredSyntax(source, index)
+    if (next !== index) {
+      index = next
+      continue
+    }
+
+    if (isOpeningBracket(source[index])) {
+      stack.push(expectedClosingBracket(source[index]))
+      index += 1
+      continue
+    }
+
+    if (isClosingBracket(source[index])) {
+      const expected = stack.pop()
+      if (expected !== source[index]) {
+        throw new Error("unsupported Vite config: malformed JavaScript brackets.")
+      }
+      if (stack.length === 0) return index
+      index += 1
+      continue
+    }
+
+    index += 1
+  }
+
+  throw new Error(`unsupported Vite config: missing closing ${close}.`)
+}
+
+function skipIgnoredSyntax(source, index) {
+  const commentEnd = skipComment(source, index)
+  if (commentEnd !== index) return commentEnd
+
+  if (source[index] === "\"" || source[index] === "'" || source[index] === "`") {
+    return skipQuotedText(source, index)
+  }
+
+  return index
+}
+
+function skipComment(source, index) {
+  if (source[index] !== "/") return index
+
+  if (source[index + 1] === "/") {
+    const lineEnd = source.indexOf("\n", index + 2)
+    return lineEnd === -1 ? source.length : lineEnd + 1
+  }
+
+  if (source[index + 1] === "*") {
+    const blockEnd = source.indexOf("*/", index + 2)
+    return blockEnd === -1 ? source.length : blockEnd + 2
+  }
+
+  return index
+}
+
+function skipQuotedText(source, index) {
+  const quote = source[index]
+  index += 1
+
+  while (index < source.length) {
+    if (source[index] === "\\") {
+      index += 2
+      continue
+    }
+
+    if (source[index] === quote) return index + 1
+    index += 1
+  }
+
+  return source.length
+}
+
+function readStringLiteral(source, index) {
+  const quote = source[index]
+  if (quote !== "\"" && quote !== "'") return null
+
+  let value = ""
+  index += 1
+
+  while (index < source.length) {
+    if (source[index] === "\\") {
+      value += source[index + 1] ?? ""
+      index += 2
+      continue
+    }
+
+    if (source[index] === quote) {
+      return { value, end: index + 1 }
+    }
+
+    value += source[index]
+    index += 1
+  }
+
+  return null
+}
+
+function readIdentifierAt(source, index) {
+  if (!isIdentifierStart(source[index])) return null
+
+  let end = index + 1
+  while (end < source.length && isIdentifierPart(source[end])) {
+    end += 1
+  }
+
+  return { name: source.slice(index, end), end }
+}
+
+function matchIdentifier(source, index, name) {
+  if (source.slice(index, index + name.length) !== name) return false
+
+  const before = source[index - 1]
+  const after = source[index + name.length]
+  return !isIdentifierPart(before) && !isIdentifierPart(after)
+}
+
+function isIdentifierStart(char) {
+  return Boolean(char && /[A-Za-z_$]/.test(char))
+}
+
+function isIdentifierPart(char) {
+  return Boolean(char && /[A-Za-z0-9_$]/.test(char))
+}
+
+function isOpeningBracket(char) {
+  return char === "{" || char === "[" || char === "("
+}
+
+function isClosingBracket(char) {
+  return char === "}" || char === "]" || char === ")"
+}
+
+function expectedClosingBracket(char) {
+  if (char === "{") return "}"
+  if (char === "[") return "]"
+  return ")"
+}
+
+function skipWhitespaceAndComments(source, index) {
+  while (index < source.length) {
+    const next = skipComment(source, index)
+    if (next !== index) {
+      index = next
+      continue
+    }
+
+    if (!isWhitespace(source[index])) return index
+    index += 1
+  }
+
+  return index
+}
+
+function skipWhitespaceCommentsAndCommas(source, index, end) {
+  while (index < end) {
+    const next = skipWhitespaceAndComments(source, index)
+    if (next !== index) {
+      index = next
+      continue
+    }
+
+    if (source[index] !== ",") return index
+    index += 1
+  }
+
+  return index
+}
+
+function skipHorizontalWhitespace(source, index) {
+  while (source[index] === " " || source[index] === "\t") {
+    index += 1
+  }
+  return index
+}
+
+function isWhitespace(char) {
+  return char === " " || char === "\t" || char === "\n" || char === "\r"
+}
+
+function indentMultiline(text, indent) {
+  return text
+    .split("\n")
+    .map((line) => `${indent}${line}`)
+    .join("\n")
+}
+
+function getLineIndent(source, index) {
+  let lineStart = index
+  while (lineStart > 0 && source[lineStart - 1] !== "\n") {
+    lineStart -= 1
+  }
+
+  return source.slice(lineStart, skipHorizontalWhitespace(source, lineStart))
+}
+
+function trimEndIndex(source, start, end) {
+  while (end > start && isWhitespace(source[end - 1])) {
+    end -= 1
+  }
+  return end
+}
+
+function previousCodeChar(source, index) {
+  index -= 1
+  while (index >= 0 && isWhitespace(source[index])) {
+    index -= 1
+  }
+  return source[index]
+}
+
+function bodyIncludesNewline(source, start, end) {
+  for (let index = start; index < end; index += 1) {
+    if (source[index] === "\n" || source[index] === "\r") return true
+  }
+  return false
+}
+
+async function getPackageChanges(cwd, dependencies) {
+  const devDependencies = { ...SETUP_DEV_DEPENDENCIES }
+  if (await findViteConfigPath(cwd)) {
+    Object.assign(devDependencies, VITE_DEV_DEPENDENCIES)
+  }
+
+  return {
+    dependencies,
+    devDependencies,
+  }
+}
+
+async function updatePackageJson(cwd, changes, options) {
+  const packagePath = path.join(cwd, "package.json")
+  const dependencies = changes.dependencies || {}
+  const devDependencies = changes.devDependencies || {}
+  const packageJson = (await readJsonIfExists(packagePath)) || {
+    name: path.basename(cwd).toLowerCase(),
+    version: "0.0.0",
+    private: true,
+  }
+  const added = [
+    ...addPackageSection(packageJson, "dependencies", dependencies),
+    ...addPackageSection(packageJson, "devDependencies", devDependencies),
+  ]
+
+  if (added.length === 0 && (await exists(packagePath))) {
+    return [`kept ${relative(cwd, packagePath)}`]
+  }
+
+  const status = await writeFile(packagePath, `${JSON.stringify(packageJson, null, 2)}\n`, {
+    dryRun: options.dryRun,
+    force: true,
+  })
+
+  return [
+    `${status} ${relative(cwd, packagePath)}`,
+  ]
+}
+
+function addPackageSection(packageJson, section, dependencies) {
+  const added = []
+  const existing = packageJson[section] || {}
+
+  for (const [name, version] of Object.entries(dependencies)) {
+    if (hasPackageDependency(packageJson, name)) continue
+
+    existing[name] = version
+    added.push(name)
+  }
+
+  if (added.length > 0 || packageJson[section]) {
+    packageJson[section] = sortObject(existing)
+  }
+
+  return added
+}
+
+function hasPackageDependency(packageJson, name) {
+  return Boolean(
+    packageJson.dependencies?.[name] ||
+    packageJson.devDependencies?.[name] ||
+    packageJson.peerDependencies?.[name] ||
+    packageJson.optionalDependencies?.[name]
+  )
+}
+
+function applyTemplate(source, config) {
+  return source
+    .replaceAll("@/lib/utils", config.aliases.utils)
+    .replaceAll("@/hooks", config.aliases.hooks)
+}
+
+function isTextRegistryFile(source) {
+  return !/\.(avif|eot|gif|ico|jpe?g|otf|png|ttf|webp|woff2?)$/i.test(source)
+}
+
+function resolveTarget(cwd, config, target) {
+  const replacements = {
+    "{{ui}}": aliasToPath(cwd, config.aliases.ui),
+    "{{utils}}": stripExtension(aliasToPath(cwd, config.aliases.utils)),
+    "{{hooks}}": aliasToPath(cwd, config.aliases.hooks),
+  }
+
+  let resolved = target
+  for (const [placeholder, value] of Object.entries(replacements)) {
+    resolved = resolved.replaceAll(placeholder, value)
+  }
+
+  return resolved
+}
+
+function aliasToPath(cwd, alias) {
+  if (!alias) return ""
+  if (path.isAbsolute(alias)) return alias
+  if (alias.startsWith("./")) return alias.slice(2)
+  if (alias.startsWith("../")) return alias
+
+  if (alias.startsWith("@/") || alias.startsWith("~/")) {
+    const rest = alias.slice(2)
+    return path.join(shouldUseSrcDirectory(cwd) ? "src" : "", rest)
+  }
+
+  return alias
+}
+
+function shouldUseSrcDirectory(cwd) {
+  return pathExistsSyncHint(cwd, "src/app") || pathExistsSyncHint(cwd, "src")
+}
+
+function pathExistsSyncHint(cwd, segment) {
+  return Boolean(syncExistsCache.get(path.join(cwd, segment)))
+}
+
+async function warmPathHints(cwd) {
+  for (const segment of ["src", "src/app"]) {
+    const target = path.join(cwd, segment)
+    syncExistsCache.set(target, await exists(target))
+  }
+}
+
+async function writeFile(targetPath, content, options) {
+  const alreadyExists = await exists(targetPath)
+  const isBinary = Buffer.isBuffer(content)
+
+  if (options.dryRun) {
+    if (!alreadyExists) return "would write"
+
+    const current = await fs.readFile(targetPath)
+    const isEqual = isBinary
+      ? current.equals(content)
+      : current.toString("utf8") === content
+    if (isEqual) return "would keep"
+
+    return "would update"
+  }
+
+  if (alreadyExists && !options.force) {
+    const current = await fs.readFile(targetPath)
+    const isEqual = isBinary
+      ? current.equals(content)
+      : current.toString("utf8") === content
+    if (isEqual) return "kept"
+  }
+
+  await fs.mkdir(path.dirname(targetPath), { recursive: true })
   await fs.writeFile(targetPath, content, isBinary ? undefined : "utf8")
   return alreadyExists ? "updated" : "wrote"
 }
@@ -734,9 +1749,76 @@ async function readJsonc(filePath) {
 }
 
 function stripJsonComments(content) {
-  return content
-    .replace(/\/\*[\s\S]*?\*\//g, "")
-    .replace(/(^|[^:])\/\/.*$/gm, "$1")
+  let output = ""
+  let inString = false
+  let escaped = false
+
+  for (let index = 0; index < content.length; index += 1) {
+    const char = content[index]
+    const next = content[index + 1]
+
+    if (inString) {
+      output += char
+
+      if (escaped) {
+        escaped = false
+      } else if (char === "\\") {
+        escaped = true
+      } else if (char === "\"") {
+        inString = false
+      }
+
+      continue
+    }
+
+    if (char === "\"") {
+      inString = true
+      output += char
+      continue
+    }
+
+    if (char === "/" && next === "/") {
+      output += "  "
+      index += 2
+
+      while (index < content.length && content[index] !== "\n" && content[index] !== "\r") {
+        output += " "
+        index += 1
+      }
+
+      if (index < content.length) {
+        output += content[index]
+        if (content[index] === "\r" && content[index + 1] === "\n") {
+          index += 1
+          output += content[index]
+        }
+      }
+
+      continue
+    }
+
+    if (char === "/" && next === "*") {
+      output += "  "
+      index += 2
+
+      while (index < content.length) {
+        if (content[index] === "*" && content[index + 1] === "/") {
+          output += "  "
+          index += 1
+          break
+        }
+
+        output += content[index] === "\n" || content[index] === "\r" ? content[index] : " "
+        index += 1
+      }
+
+      continue
+    }
+
+    output += char
+  }
+
+  return output
 }
 
 async function readJsonIfExists(filePath) {
@@ -766,27 +1848,136 @@ async function exists(filePath) {
   }
 }
 
-function removeExistingTokenBlock(content) {
-  const start = content.indexOf(CSS_START)
-  if (start === -1) return content
+function removeExistingTokenBlock(content, fileLabel = "CSS file") {
+  const lines = splitLinesPreservingEndings(content)
+  const kept = []
+  let found = false
+  let inTokenBlock = false
 
-  const end = content.indexOf(CSS_END, start)
-  if (end === -1) return content
+  for (const line of lines) {
+    const trimmed = line.trimStart()
 
-  return `${content.slice(0, start)}${content.slice(end + CSS_END.length)}`
+    if (trimmed.startsWith(CSS_START)) {
+      if (found || inTokenBlock) {
+        throw new Error(`${fileLabel}: multiple Banhaten token blocks found.`)
+      }
+      found = true
+      inTokenBlock = true
+      continue
+    }
+
+    if (trimmed.startsWith(CSS_END)) {
+      if (!inTokenBlock) {
+        throw new Error(`${fileLabel}: Banhaten token end marker has no start marker.`)
+      }
+      inTokenBlock = false
+      continue
+    }
+
+    if (!inTokenBlock) {
+      kept.push(line)
+    }
+  }
+
+  if (inTokenBlock) {
+    throw new Error(`${fileLabel}: Banhaten token block is missing its end marker.`)
+  }
+
+  return { content: kept.join(""), found }
 }
 
 function ensureGlobalCssImports(content) {
-  const fontImportPattern =
-    /^\s*@import\s+["']@fontsource(?:-variable)?\/inter(?:\/(?:400|500|600|700)\.css)?["'];\s*/gm
-  const tailwindImportPattern = /^\s*@import\s+["']tailwindcss["'];\s*/gm
-  const cleaned = content
-    .replace(fontImportPattern, "")
-    .replace(tailwindImportPattern, "")
+  const cleaned = splitLinesPreservingEndings(content)
+    .filter((line) => {
+      const importSpecifier = readCssImportSpecifier(line)
+      return (
+        importSpecifier !== "tailwindcss" &&
+        !isManagedInterFontImport(importSpecifier)
+      )
+    })
+    .join("")
     .trimStart()
   return `${TAILWIND_IMPORT}\n${FONT_IMPORTS.join("\n")}\n${cleaned}`
 }
 
+function splitLinesPreservingEndings(content) {
+  const lines = []
+  let lineStart = 0
+  let index = 0
+
+  while (index < content.length) {
+    if (content[index] === "\r" && content[index + 1] === "\n") {
+      lines.push(content.slice(lineStart, index + 2))
+      index += 2
+      lineStart = index
+      continue
+    }
+
+    if (content[index] === "\n") {
+      lines.push(content.slice(lineStart, index + 1))
+      index += 1
+      lineStart = index
+      continue
+    }
+
+    index += 1
+  }
+
+  if (lineStart < content.length) {
+    lines.push(content.slice(lineStart))
+  }
+
+  return lines
+}
+
+function readCssImportSpecifier(line) {
+  const trimmed = line.trim()
+  const importPrefix = "@import"
+  if (!trimmed.startsWith(importPrefix)) return null
+
+  let index = importPrefix.length
+  while (trimmed[index] === " " || trimmed[index] === "\t") {
+    index += 1
+  }
+
+  const quote = trimmed[index]
+  if (quote !== "\"" && quote !== "'") return null
+
+  const start = index + 1
+  index = start
+  while (index < trimmed.length && trimmed[index] !== quote) {
+    index += 1
+  }
+
+  if (index >= trimmed.length) return null
+  const specifier = trimmed.slice(start, index)
+  index += 1
+
+  while (trimmed[index] === " " || trimmed[index] === "\t") {
+    index += 1
+  }
+
+  if (trimmed[index] === ";") index += 1
+
+  while (trimmed[index] === " " || trimmed[index] === "\t") {
+    index += 1
+  }
+
+  return index === trimmed.length ? specifier : null
+}
+
+function isManagedInterFontImport(specifier) {
+  if (!specifier) return false
+  if (specifier === "@fontsource/inter") return true
+  if (specifier === "@fontsource-variable/inter") return true
+
+  for (const weight of ["400", "500", "600", "700"]) {
+    if (specifier === `@fontsource/inter/${weight}.css`) return true
+  }
+
+  return false
+}
+
 function appendAliasSegment(alias, segment) {
   if (!alias) return null
   return `${alias.replace(/\/$/, "")}/${segment}`
@@ -807,20 +1998,58 @@ function relative(cwd, targetPath) {
 }
 
 function printResult(title, writes, dryRun) {
+  if (runtimeOptions.json) {
+    writeJson({ dryRun, title, writes })
+    return
+  }
+
+  if (runtimeOptions.silent) return
+
   console.log(`${dryRun ? "Dry run: " : ""}${title}`)
   for (const write of writes) {
     console.log(`- ${write}`)
   }
 }
 
-function printInstallHint(writes, dryRun) {
-  if (dryRun) return
+async function printInstallHint(cwd, writes, dryRun) {
+  if (dryRun || runtimeOptions.json || runtimeOptions.silent) return
 
   const packageJsonChanged = writes.some((write) =>
     /^(wrote|updated) package\.json$/.test(write)
   )
 
   if (packageJsonChanged) {
-    console.log("\nNext: run npm install to install the added dependencies.")
+    console.log(`\nNext: run ${await getInstallCommand(cwd)} to install the added dependencies.`)
+  }
+}
+
+async function getInstallCommand(cwd) {
+  const packageJson = await readJsonIfExists(path.join(cwd, "package.json"))
+  const declaredPackageManager = parsePackageManager(packageJson?.packageManager)
+
+  if (declaredPackageManager) return `${declaredPackageManager} install`
+
+  const lockfileManagers = [
+    ["pnpm-lock.yaml", "pnpm"],
+    ["yarn.lock", "yarn"],
+    ["bun.lockb", "bun"],
+    ["bun.lock", "bun"],
+    ["package-lock.json", "npm"],
+    ["npm-shrinkwrap.json", "npm"],
+  ]
+
+  for (const [lockfile, manager] of lockfileManagers) {
+    if (await exists(path.join(cwd, lockfile))) return `${manager} install`
   }
+
+  return "npm install"
+}
+
+function parsePackageManager(packageManager) {
+  if (typeof packageManager !== "string") return null
+
+  const name = packageManager.split("@")[0]
+  if (["npm", "pnpm", "yarn", "bun"].includes(name)) return name
+
+  return null
 }