@catchdrift/cli 0.1.20 → 0.1.22

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@catchdrift/cli",
-  "version": "0.1.20",
+  "version": "0.1.22",
   "description": "CLI for Drift — install, check, and manage design system coverage for any React app.",
   "keywords": [
     "design-system",

package/src/commands/init.mjs

@@ -31,6 +31,7 @@ import {
 } from '../lib/storybook.mjs'
 import {
   writeDriftConfig,
+  writeEnvLocal,
   writeAIRulesFiles,
   writeClaudeSkills,
   patchAppEntry,
@@ -339,7 +340,9 @@ export async function init(argv) {
     dsPackages,
     threshold:     Number(threshold) || 80,
     components,
+    framework,
   })
+  if (figmaToken) writeEnvLocal(cwd, { figmaToken })
   spinner.stop('drift.config.ts written')
 
   // ── Step 7: Write AI rules files ─────────────────────────────────────────────

package/src/lib/writers.mjs

@@ -13,7 +13,7 @@ const __dirname = dirname(fileURLToPath(import.meta.url))
 
 // ── drift.config.ts ───────────────────────────────────────────────────────────
 
-export function writeDriftConfig(cwd, { storybookUrl, chromaticUrl, figmaFiles, dsPackages, threshold, components }) {
+export function writeDriftConfig(cwd, { storybookUrl, chromaticUrl, figmaFiles, dsPackages, threshold, components, framework }) {
   const registry = buildComponentRegistry(components)
 
   const dsPackagesLine = dsPackages?.length
@@ -22,6 +22,7 @@ export function writeDriftConfig(cwd, { storybookUrl, chromaticUrl, figmaFiles,
 
   // Build figmaFiles block — single file gets a compact shape, multiple get an array
   let figmaFilesBlock = null
+  const hasFigma = figmaFiles?.length > 0
   if (figmaFiles?.length === 1) {
     const f = figmaFiles[0]
     figmaFilesBlock = `  figmaFileKey: '${f.key}',`
@@ -38,6 +39,16 @@ export function writeDriftConfig(cwd, { storybookUrl, chromaticUrl, figmaFiles,
     figmaFilesBlock = `  figmaFiles: [\n${entries}\n  ],`
   }
 
+  // Figma token — read from env at runtime via a Record cast to avoid TS errors
+  // for undeclared env vars. The actual value comes from .env.local (gitignored).
+  let figmaTokenLine = null
+  if (hasFigma) {
+    const envExpr = framework === 'nextjs'
+      ? `(process.env as Record<string,string|undefined>)['NEXT_PUBLIC_FIGMA_TOKEN']`
+      : `(import.meta.env as Record<string,string|undefined>)['VITE_FIGMA_TOKEN']`
+    figmaTokenLine = `  figmaToken: ${envExpr}, // set VITE_FIGMA_TOKEN in .env.local — never commit your token`
+  }
+
   const lines = [
     `import type { DriftConfig } from '@catchdrift/overlay'`,
     ``,
@@ -45,6 +56,7 @@ export function writeDriftConfig(cwd, { storybookUrl, chromaticUrl, figmaFiles,
     storybookUrl ? `  storybookUrl: '${storybookUrl}',` : null,
     chromaticUrl ? `  chromaticUrl: '${chromaticUrl}',` : null,
     figmaFilesBlock,
+    figmaTokenLine,
     `  threshold: ${threshold},`,
     dsPackagesLine,
     `  components: {`,
@@ -60,6 +72,21 @@ export function writeDriftConfig(cwd, { storybookUrl, chromaticUrl, figmaFiles,
   writeFileSync(join(cwd, 'drift.config.ts'), lines, 'utf8')
 }
 
+export function writeEnvLocal(cwd, { figmaToken }) {
+  if (!figmaToken) return
+  const envPath = join(cwd, '.env.local')
+  const line = `VITE_FIGMA_TOKEN=${figmaToken}\nNEXT_PUBLIC_FIGMA_TOKEN=${figmaToken}\n`
+
+  if (existsSync(envPath)) {
+    const existing = readFileSync(envPath, 'utf8')
+    // Don't duplicate if already set
+    if (existing.includes('FIGMA_TOKEN=')) return
+    writeFileSync(envPath, existing.trimEnd() + '\n' + line, 'utf8')
+  } else {
+    writeFileSync(envPath, `# Drift — Figma token (auto-generated by npx catchdrift init)\n${line}`, 'utf8')
+  }
+}
+
 // ── AI rules files ────────────────────────────────────────────────────────────
 
 const COMPONENT_TABLE_START = '<!-- drift:components-start -->'