@fragments-sdk/cli 0.7.0 → 0.7.1

package/src/commands/enhance.ts

@@ -71,9 +71,9 @@ export interface EnhanceOptions {
 }
 
 /**
- * Enhanced segment data
+ * Enhanced fragment data
  */
-export interface EnhancedSegment {
+export interface EnhancedFragment {
   componentName: string;
   added: {
     when: string[];
@@ -90,7 +90,7 @@ export interface EnhancedSegment {
  */
 export interface EnhanceResult {
   success: boolean;
-  enhanced: EnhancedSegment[];
+  enhanced: EnhancedFragment[];
   totalTokens: number;
   estimatedCost: number;
   /** Context output for IDE AI mode */
@@ -211,9 +211,9 @@ export async function enhance(options: EnhanceOptions = {}): Promise<EnhanceResu
   }
 
   // Search entire root dir, not just src/
-  const segmentFiles = await findSegmentFiles(rootDir);
+  const fragmentFiles = await findFragmentFiles(rootDir);
 
-  if (segmentFiles.length === 0) {
+  if (fragmentFiles.length === 0) {
     const msg = 'No fragment files found';
     if (format === 'json') {
       console.log(JSON.stringify({ success: false, error: msg }));
@@ -224,7 +224,7 @@ export async function enhance(options: EnhanceOptions = {}): Promise<EnhanceResu
   }
 
   if (isInteractive) {
-    console.log(pc.green(`  Found ${segmentFiles.length} fragment files`));
+    console.log(pc.green(`  Found ${fragmentFiles.length} fragment files`));
   }
 
   // Filter components if specified
@@ -232,7 +232,7 @@ export async function enhance(options: EnhanceOptions = {}): Promise<EnhanceResu
   if (component && component !== 'all') {
     componentsToEnhance = [component];
   } else {
-    componentsToEnhance = segmentFiles.map(f => extractComponentName(f));
+    componentsToEnhance = fragmentFiles.map(f => extractComponentName(f));
   }
 
   // Phase 4: Extract props from TypeScript source files
@@ -242,16 +242,16 @@ export async function enhance(options: EnhanceOptions = {}): Promise<EnhanceResu
 
   const propsExtractions = new Map<string, PropsExtractionResult>();
   for (const compName of componentsToEnhance) {
-    const segmentFile = segmentFiles.find(f => extractComponentName(f) === compName);
-    if (!segmentFile) continue;
+    const fragmentFile = fragmentFiles.find(f => extractComponentName(f) === compName);
+    if (!fragmentFile) continue;
 
-    // Try to find the component source file relative to the segment file
-    const segmentDir = segmentFile.replace(/\.segment\.(tsx?|jsx?)$/, '');
+    // Try to find the component source file relative to the fragment file
+    const fragmentDir = fragmentFile.replace(/\.fragment\.(tsx?|jsx?)$/, '');
     const possiblePaths = [
-      `${segmentDir}.tsx`,
-      `${segmentDir}.ts`,
-      `${segmentDir}/index.tsx`,
-      `${segmentDir}/index.ts`,
+      `${fragmentDir}.tsx`,
+      `${fragmentDir}.ts`,
+      `${fragmentDir}/index.tsx`,
+      `${fragmentDir}/index.ts`,
       join(rootDir, 'src', 'components', `${compName}.tsx`),
       join(rootDir, 'src', 'components', compName, `${compName}.tsx`),
       join(rootDir, 'src', 'components', compName, 'index.tsx'),
@@ -332,14 +332,14 @@ export async function enhance(options: EnhanceOptions = {}): Promise<EnhanceResu
   }
 
   // Build contexts for all components
-  const contexts: Array<{ name: string; context: ComponentContext; segmentFile: string }> = [];
+  const contexts: Array<{ name: string; context: ComponentContext; fragmentFile: string }> = [];
   for (const compName of componentsToEnhance) {
     const analysis = usageAnalysis.components[compName];
     const stories = storyFiles.get(compName);
-    const segmentFile = segmentFiles.find(f => extractComponentName(f) === compName);
+    const fragmentFile = fragmentFiles.find(f => extractComponentName(f) === compName);
     const propsExtraction = propsExtractions.get(compName);
 
-    if (!segmentFile) continue;
+    if (!fragmentFile) continue;
 
     const context = generateComponentContext(
       compName,
@@ -348,7 +348,7 @@ export async function enhance(options: EnhanceOptions = {}): Promise<EnhanceResu
       stories,
       propsExtraction
     );
-    contexts.push({ name: compName, context, segmentFile });
+    contexts.push({ name: compName, context, fragmentFile });
   }
 
   // Context-only mode: output prompts for IDE AI
@@ -361,13 +361,13 @@ export async function enhance(options: EnhanceOptions = {}): Promise<EnhanceResu
     console.log(pc.dim(`\nPhase 6: Generating AI enhancements for ${componentsToEnhance.length} component(s)...\n`));
   }
 
-  const enhanced: EnhancedSegment[] = [];
+  const enhanced: EnhancedFragment[] = [];
   let totalTokens = 0;
 
   // Initialize AI client
   const aiClient = await createAIClient(provider, apiKey!);
 
-  for (const { name: compName, context, segmentFile } of contexts) {
+  for (const { name: compName, context, fragmentFile } of contexts) {
     // Check if we have enough data
     if (!context.usageAnalysis || context.usageAnalysis.totalUsages < 2) {
       enhanced.push({
@@ -426,7 +426,7 @@ export async function enhance(options: EnhanceOptions = {}): Promise<EnhanceResu
   // Phase 7: Apply changes
   if (!dryRun) {
     if (isInteractive) {
-      console.log(pc.dim('\nPhase 7: Updating segment files...'));
+      console.log(pc.dim('\nPhase 7: Updating fragment files...'));
     }
 
     for (const result of enhanced) {
@@ -434,17 +434,17 @@ export async function enhance(options: EnhanceOptions = {}): Promise<EnhanceResu
         continue;
       }
 
-      const segmentFile = segmentFiles.find(f => extractComponentName(f) === result.componentName);
-      if (!segmentFile) continue;
+      const fragmentFile = fragmentFiles.find(f => extractComponentName(f) === result.componentName);
+      if (!fragmentFile) continue;
 
       try {
-        await updateSegmentFile(segmentFile, result.added);
+        await updateFragmentFile(fragmentFile, result.added);
         if (isInteractive) {
-          console.log(pc.green(`  Updated: ${relative(rootDir, segmentFile)}`));
+          console.log(pc.green(`  Updated: ${relative(rootDir, fragmentFile)}`));
         }
       } catch {
         if (isInteractive) {
-          console.log(pc.red(`  Failed to update: ${relative(rootDir, segmentFile)}`));
+          console.log(pc.red(`  Failed to update: ${relative(rootDir, fragmentFile)}`));
         }
       }
     }
@@ -488,7 +488,7 @@ export async function enhance(options: EnhanceOptions = {}): Promise<EnhanceResu
  * Handle context-only mode for IDE AI
  */
 function handleContextOnlyMode(
-  contexts: Array<{ name: string; context: ComponentContext; segmentFile: string }>,
+  contexts: Array<{ name: string; context: ComponentContext; fragmentFile: string }>,
   format: string,
   isInteractive: boolean
 ): EnhanceResult {
@@ -544,7 +544,7 @@ For each component, provide your response in JSON format:
     console.log(pc.dim('─'.repeat(60)));
     console.log();
     console.log(pc.green('Tip: In Cursor, press Cmd+L to open chat and paste this prompt.'));
-    console.log(pc.dim('After getting suggestions, manually update your segment files.'));
+    console.log(pc.dim('After getting suggestions, manually update your fragment files.'));
     console.log();
   }
 
@@ -783,11 +783,11 @@ function calculateCost(provider: AIProvider, tokens: number): number {
 }
 
 /**
- * Find all segment files in a directory
+ * Find all fragment files in a directory
  */
-async function findSegmentFiles(dir: string): Promise<string[]> {
+async function findFragmentFiles(dir: string): Promise<string[]> {
   const fg = await import('fast-glob');
-  return fg.default(['**/*.segment.tsx', '**/*.segment.ts'], {
+  return fg.default(['**/*.fragment.tsx', '**/*.fragment.ts'], {
     cwd: dir,
     absolute: true,
     ignore: ['**/node_modules/**', '**/dist/**'],
@@ -795,17 +795,17 @@ async function findSegmentFiles(dir: string): Promise<string[]> {
 }
 
 /**
- * Extract component name from segment file path
+ * Extract component name from fragment file path
  */
 function extractComponentName(filePath: string): string {
-  const match = filePath.match(/([^/\\]+)\.segment\.(tsx?|jsx?)$/);
+  const match = filePath.match(/([^/\\]+)\.fragment\.(tsx?|jsx?)$/);
   return match ? match[1] : '';
 }
 
 /**
- * Update a segment file with new when/whenNot suggestions
+ * Update a fragment file with new when/whenNot suggestions
  */
-async function updateSegmentFile(
+async function updateFragmentFile(
   filePath: string,
   suggestions: { when: string[]; whenNot: string[] }
 ): Promise<void> {

package/src/commands/generate.ts

@@ -57,7 +57,7 @@ export async function generate(options: GenerateOptions = {}): Promise<GenerateR
     ignore: [
       "**/node_modules/**",
       "**/*.stories.*",
-      "**/*.segment.*",
+      "**/*.fragment.*",
       "**/*.test.*",
       "**/*.spec.*",
       "**/*.d.ts",

package/src/commands/graph.ts

@@ -8,7 +8,7 @@
 import pc from 'picocolors';
 import { readFile } from 'node:fs/promises';
 import { resolve } from 'node:path';
-import type { CompiledSegmentsFile } from '../core/index.js';
+import type { CompiledFragmentsFile } from '../core/index.js';
 import { BRAND } from '../core/index.js';
 import { loadConfig } from '../core/node.js';
 import {
@@ -33,10 +33,10 @@ export async function graph(
   const { config, configDir } = await loadConfig(options.config);
   const outputPath = resolve(configDir, config.outFile ?? BRAND.outFile);
 
-  let data: CompiledSegmentsFile;
+  let data: CompiledFragmentsFile;
   try {
     const content = await readFile(outputPath, 'utf-8');
-    data = JSON.parse(content) as CompiledSegmentsFile;
+    data = JSON.parse(content) as CompiledFragmentsFile;
   } catch {
     console.error(
       pc.red(`Error: Could not load ${BRAND.outFile}. Run \`${BRAND.cliCommand} build\` first.`),

package/src/commands/init.ts

@@ -428,7 +428,7 @@ export async function init(options: InitOptions = {}): Promise<InitResult> {
   // Note: Stories are loaded separately by the viewer, not via include patterns
   const includePaths: string[] = [
     `${componentPath}/**/*.fragment.tsx`,
-    `${componentPath}/**/*.segment.tsx`, // Legacy support
+    `${componentPath}/**/*.fragment.tsx`, // Legacy support
   ];
 
   // Create config file

package/src/commands/link/figma.ts

@@ -1,12 +1,12 @@
 /**
- * fragments link figma - Link Figma components to segments
+ * fragments link figma - Link Figma components to fragments
  */
 
 import { readFile, writeFile } from 'node:fs/promises';
 import { relative } from 'node:path';
 import pc from 'picocolors';
 import { BRAND } from '../../core/index.js';
-import { loadConfig, discoverSegmentFiles } from '../../core/node.js';
+import { loadConfig, discoverFragmentFiles } from '../../core/node.js';
 import { FigmaClient } from '../../service/index.js';
 
 /**
@@ -33,29 +33,29 @@ export interface LinkFigmaResult {
 }
 
 /**
- * Segment variant info
+ * Fragment variant info
  */
-interface SegmentVariantInfo {
+interface FragmentVariantInfo {
   name: string;
   hasFigma: boolean;
 }
 
 /**
- * Segment info
+ * Fragment info
  */
-interface SegmentInfo {
+interface FragmentInfo {
   name: string;
   filePath: string;
   relativePath: string;
   hasFigma: boolean;
-  variants: SegmentVariantInfo[];
+  variants: FragmentVariantInfo[];
 }
 
 /**
  * Match result
  */
 interface Match {
-  segment: SegmentInfo;
+  fragment: FragmentInfo;
   figmaComponent: {
     name: string;
     description: string;
@@ -145,20 +145,20 @@ export async function linkFigma(
     console.log();
   }
 
-  // Discover local segments
-  const segmentFiles = await discoverSegmentFiles(config, configDir);
+  // Discover local fragments
+  const fragmentFiles = await discoverFragmentFiles(config, configDir);
 
-  if (segmentFiles.length === 0) {
-    console.log(pc.yellow('No segment files found in codebase.'));
+  if (fragmentFiles.length === 0) {
+    console.log(pc.yellow('No fragment files found in codebase.'));
     console.log(pc.dim(`Looking for: ${config.include.join(', ')}`));
     process.exit(0);
   }
 
-  console.log(pc.dim(`Found ${segmentFiles.length} segment file(s)\n`));
+  console.log(pc.dim(`Found ${fragmentFiles.length} fragment file(s)\n`));
 
-  // Load segments to get names
-  const segments: SegmentInfo[] = [];
-  for (const file of segmentFiles) {
+  // Load fragments to get names
+  const fragments: FragmentInfo[] = [];
+  for (const file of fragmentFiles) {
     try {
       const content = await readFile(file.absolutePath, 'utf-8');
       // Extract name from meta.name in the file
@@ -167,15 +167,15 @@ export async function linkFigma(
       const hasFigma = /meta:\s*\{[^}]*figma:\s*['"]https?:/.test(content);
 
       // Extract variant names and their figma status
-      const segmentVariants = extractVariants(content, nameMatch?.[1]);
+      const fragmentVariants = extractVariants(content, nameMatch?.[1]);
 
       if (nameMatch) {
-        segments.push({
+        fragments.push({
           name: nameMatch[1],
           filePath: file.absolutePath,
           relativePath: file.relativePath,
           hasFigma,
-          variants: segmentVariants,
+          variants: fragmentVariants,
         });
       }
     } catch {
@@ -185,15 +185,15 @@ export async function linkFigma(
 
   // Find matches
   const matches: Match[] = [];
-  const unmatchedSegments: SegmentInfo[] = [];
+  const unmatchedFragments: FragmentInfo[] = [];
 
-  for (const segment of segments) {
+  for (const fragment of fragments) {
     // Find best matching Figma component
     let bestMatch: typeof allFigmaComponents[0] | null = null;
     let bestScore = 0;
 
     for (const figmaComp of allFigmaComponents) {
-      const score = calculateMatchScore(segment.name, figmaComp.name);
+      const score = calculateMatchScore(fragment.name, figmaComp.name);
 
       if (score > bestScore) {
         bestMatch = figmaComp;
@@ -206,19 +206,19 @@ export async function linkFigma(
 
     // Accept matches with 65%+ score
     if (bestMatch && bestScore >= 65) {
-      const alreadyLinked = segment.hasFigma;
+      const alreadyLinked = fragment.hasFigma;
       if (alreadyLinked && !auto) {
-        console.log(pc.dim(`⏭️  ${segment.name} (already linked)`));
+        console.log(pc.dim(`⏭️  ${fragment.name} (already linked)`));
       }
-      matches.push({ segment, figmaComponent: bestMatch, score: bestScore, alreadyLinked });
+      matches.push({ fragment, figmaComponent: bestMatch, score: bestScore, alreadyLinked });
     } else {
-      unmatchedSegments.push(segment);
+      unmatchedFragments.push(fragment);
     }
   }
 
-  if (unmatchedSegments.length > 0) {
-    console.log(pc.dim('Unmatched segments:'));
-    for (const seg of unmatchedSegments) {
+  if (unmatchedFragments.length > 0) {
+    console.log(pc.dim('Unmatched fragments:'));
+    for (const seg of unmatchedFragments) {
       console.log(`  ${pc.dim('•')} ${seg.name}`);
     }
     console.log();
@@ -230,7 +230,7 @@ export async function linkFigma(
 
   if (matches.length === 0) {
     console.log(pc.yellow('\nNo automatic matches found.'));
-    console.log(pc.dim('You can manually add figma URLs to your segment definitions.'));
+    console.log(pc.dim('You can manually add figma URLs to your fragment definitions.'));
     process.exit(0);
   }
 
@@ -241,7 +241,7 @@ export async function linkFigma(
       for (const match of newMatches) {
         const scoreColor = match.score === 100 ? pc.green : pc.yellow;
         console.log(
-          `  ${pc.green('✓')} ${pc.bold(match.segment.name)} → ${match.figmaComponent.name} ${scoreColor(`(${Math.round(match.score)}%)`)}`
+          `  ${pc.green('✓')} ${pc.bold(match.fragment.name)} → ${match.figmaComponent.name} ${scoreColor(`(${Math.round(match.score)}%)`)}`
         );
       }
     }
@@ -259,7 +259,7 @@ export async function linkFigma(
       for (const match of newMatches) {
         const scoreColor = match.score === 100 ? pc.green : pc.yellow;
         console.log(
-          `  ${pc.green('✓')} ${pc.bold(match.segment.name)} → ${match.figmaComponent.name} ${scoreColor(`(${Math.round(match.score)}%)`)}`
+          `  ${pc.green('✓')} ${pc.bold(match.fragment.name)} → ${match.figmaComponent.name} ${scoreColor(`(${Math.round(match.score)}%)`)}`
         );
       }
     } else {
@@ -272,7 +272,7 @@ export async function linkFigma(
       const choices = newMatches.map((match) => {
         const scoreColor = match.score === 100 ? pc.green : pc.yellow;
         return {
-          name: `${pc.bold(match.segment.name)} → ${match.figmaComponent.name} ${scoreColor(`(${Math.round(match.score)}%)`)}`,
+          name: `${pc.bold(match.fragment.name)} → ${match.figmaComponent.name} ${scoreColor(`(${Math.round(match.score)}%)`)}`,
           value: match,
           checked: true,
         };
@@ -295,13 +295,13 @@ export async function linkFigma(
   // Include already-linked matches for variant linking
   const allSelectedMatches = [...selectedMatches, ...alreadyLinkedMatches];
 
-  // Update segment files (only for new matches, not already-linked)
+  // Update fragment files (only for new matches, not already-linked)
   let updated = 0;
   for (const match of selectedMatches) {
     if (match.alreadyLinked) continue;
 
     try {
-      let content = await readFile(match.segment.filePath, 'utf-8');
+      let content = await readFile(match.fragment.filePath, 'utf-8');
       const figmaUrlToInsert = figmaClient.buildNodeUrl(
         match.figmaComponent.file_key,
         match.figmaComponent.node_id,
@@ -323,16 +323,16 @@ export async function linkFigma(
         );
       }
 
-      await writeFile(match.segment.filePath, content);
+      await writeFile(match.fragment.filePath, content);
       updated++;
-      console.log(`  ${pc.green('✓')} Updated ${match.segment.relativePath}`);
+      console.log(`  ${pc.green('✓')} Updated ${match.fragment.relativePath}`);
     } catch (error) {
-      console.log(`  ${pc.red('✗')} Failed to update ${match.segment.relativePath}: ${error instanceof Error ? error.message : 'Unknown error'}`);
+      console.log(`  ${pc.red('✗')} Failed to update ${match.fragment.relativePath}: ${error instanceof Error ? error.message : 'Unknown error'}`);
     }
   }
 
   if (updated > 0) {
-    console.log(pc.green(`\n✓ Updated ${updated} segment file(s)\n`));
+    console.log(pc.green(`\n✓ Updated ${updated} fragment file(s)\n`));
   }
 
   // Variant linking
@@ -357,10 +357,10 @@ export async function linkFigma(
 }
 
 /**
- * Extract variants from segment file content
+ * Extract variants from fragment file content
  */
-function extractVariants(content: string, componentName?: string): SegmentVariantInfo[] {
-  const variants: SegmentVariantInfo[] = [];
+function extractVariants(content: string, componentName?: string): FragmentVariantInfo[] {
+  const variants: FragmentVariantInfo[] = [];
 
   // Find variants: [ ... ] section
   const variantsArrayMatch = content.match(/variants:\s*\[/);
@@ -411,27 +411,27 @@ function extractVariants(content: string, componentName?: string): SegmentVarian
 /**
  * Calculate match score between two names
  */
-function calculateMatchScore(segmentName: string, figmaName: string): number {
+function calculateMatchScore(fragmentName: string, figmaName: string): number {
   const normalizeForMatch = (s: string) =>
     s.toLowerCase().replace(/[^a-z0-9]/g, '');
 
-  const normalizedSegment = normalizeForMatch(segmentName);
+  const normalizedFragment = normalizeForMatch(fragmentName);
   const normalizedFigma = normalizeForMatch(figmaName);
 
   // Exact match after normalization
-  if (normalizedSegment === normalizedFigma) {
+  if (normalizedFragment === normalizedFigma) {
     return 100;
   }
 
-  // Check if segment name appears at the START of figma name
-  if (normalizedFigma.startsWith(normalizedSegment)) {
-    const coverage = normalizedSegment.length / normalizedFigma.length;
+  // Check if fragment name appears at the START of figma name
+  if (normalizedFigma.startsWith(normalizedFragment)) {
+    const coverage = normalizedFragment.length / normalizedFigma.length;
     return Math.max(85, coverage * 100);
   }
 
-  // Check if figma name appears at the START of segment name
-  if (normalizedSegment.startsWith(normalizedFigma)) {
-    const coverage = normalizedFigma.length / normalizedSegment.length;
+  // Check if figma name appears at the START of fragment name
+  if (normalizedFragment.startsWith(normalizedFigma)) {
+    const coverage = normalizedFigma.length / normalizedFragment.length;
     return Math.max(80, coverage * 100);
   }
 
@@ -445,24 +445,24 @@ function calculateMatchScore(segmentName: string, figmaName: string): number {
       .filter((w) => w.length > 0);
   };
 
-  const segmentWords = getWords(segmentName);
+  const fragmentWords = getWords(fragmentName);
   const figmaWords = getWords(figmaName);
 
-  // Check if all segment words appear in figma words
-  const allSegmentWordsInFigma = segmentWords.every((sw) =>
+  // Check if all fragment words appear in figma words
+  const allFragmentWordsInFigma = fragmentWords.every((sw) =>
     figmaWords.some((fw) => fw === sw || fw.startsWith(sw) || sw.startsWith(fw))
   );
 
-  if (allSegmentWordsInFigma && segmentWords.length > 0) {
-    const wordOverlap = segmentWords.length / Math.max(segmentWords.length, figmaWords.length);
+  if (allFragmentWordsInFigma && fragmentWords.length > 0) {
+    const wordOverlap = fragmentWords.length / Math.max(fragmentWords.length, figmaWords.length);
     return Math.max(75, wordOverlap * 95);
   }
 
   // Partial containment
-  if (normalizedFigma.includes(normalizedSegment)) {
+  if (normalizedFigma.includes(normalizedFragment)) {
     return 70;
   }
-  if (normalizedSegment.includes(normalizedFigma)) {
+  if (normalizedFragment.includes(normalizedFigma)) {
     return 65;
   }
 
@@ -510,16 +510,16 @@ async function linkVariants(
       continue;
     }
 
-    // Match segment variants to Figma variants
-    const segmentVariants = match.segment.variants.filter((v) => !v.hasFigma);
-    if (segmentVariants.length === 0) {
-      console.log(pc.dim(`  ⏭️  ${match.segment.name}: all variants already linked`));
+    // Match fragment variants to Figma variants
+    const fragmentVariants = match.fragment.variants.filter((v) => !v.hasFigma);
+    if (fragmentVariants.length === 0) {
+      console.log(pc.dim(`  ⏭️  ${match.fragment.name}: all variants already linked`));
       continue;
     }
 
-    console.log(pc.dim(`  ${match.segment.name}: ${csWithVariants.variants.length} Figma variants`));
+    console.log(pc.dim(`  ${match.fragment.name}: ${csWithVariants.variants.length} Figma variants`));
 
-    for (const segmentVariant of segmentVariants) {
+    for (const fragmentVariant of fragmentVariants) {
       // Find matching Figma variants by score
       const variantMatches: Array<{
         figmaVariant: typeof csWithVariants.variants[0];
@@ -527,18 +527,18 @@ async function linkVariants(
       }> = [];
 
       for (const fv of csWithVariants.variants) {
-        // Check if any property value matches the segment variant name
-        const normalizedSegment = normalizeForMatch(segmentVariant.name);
+        // Check if any property value matches the fragment variant name
+        const normalizedFragment = normalizeForMatch(fragmentVariant.name);
 
         for (const value of fv.values) {
           const normalizedValue = normalizeForMatch(value);
 
-          if (normalizedSegment === normalizedValue) {
+          if (normalizedFragment === normalizedValue) {
             variantMatches.push({ figmaVariant: fv, score: 100 });
             break;
-          } else if (normalizedValue.includes(normalizedSegment)) {
+          } else if (normalizedValue.includes(normalizedFragment)) {
             variantMatches.push({ figmaVariant: fv, score: 85 });
-          } else if (normalizedSegment.includes(normalizedValue)) {
+          } else if (normalizedFragment.includes(normalizedValue)) {
             variantMatches.push({ figmaVariant: fv, score: 75 });
           }
         }
@@ -557,11 +557,11 @@ async function linkVariants(
         );
 
         try {
-          let content = await readFile(match.segment.filePath, 'utf-8');
+          let content = await readFile(match.fragment.filePath, 'utf-8');
 
           // Add figma URL after the variant's name field
           const namePattern = new RegExp(
-            `(name:\\s*['"]${escapeRegExp(segmentVariant.name)}['"],?)`,
+            `(name:\\s*['"]${escapeRegExp(fragmentVariant.name)}['"],?)`,
             'g'
           );
 
@@ -572,14 +572,14 @@ async function linkVariants(
             return `${matchedStr}\n      figma: '${variantUrl}',`;
           });
 
-          await writeFile(match.segment.filePath, content);
+          await writeFile(match.fragment.filePath, content);
           variantUpdates++;
           console.log(
-            `    ${pc.green('✓')} ${segmentVariant.name} → ${bestMatch.figmaVariant.name}`
+            `    ${pc.green('✓')} ${fragmentVariant.name} → ${bestMatch.figmaVariant.name}`
           );
         } catch (error) {
           console.log(
-            `    ${pc.red('✗')} ${segmentVariant.name}: ${error instanceof Error ? error.message : 'Unknown error'}`
+            `    ${pc.red('✗')} ${fragmentVariant.name}: ${error instanceof Error ? error.message : 'Unknown error'}`
           );
         }
       } else if (variantMatches.length > 0) {
@@ -594,7 +594,7 @@ async function linkVariants(
 
         try {
           const selectedVariant = await select({
-            message: `  Match for "${segmentVariant.name}":`,
+            message: `  Match for "${fragmentVariant.name}":`,
             choices,
           });
 
@@ -605,9 +605,9 @@ async function linkVariants(
               figmaData.fileName
             );
 
-            let content = await readFile(match.segment.filePath, 'utf-8');
+            let content = await readFile(match.fragment.filePath, 'utf-8');
             const namePattern = new RegExp(
-              `(name:\\s*['"]${escapeRegExp(segmentVariant.name)}['"],?)`,
+              `(name:\\s*['"]${escapeRegExp(fragmentVariant.name)}['"],?)`,
               'g'
             );
 
@@ -618,19 +618,19 @@ async function linkVariants(
               return `${matchedStr}\n      figma: '${variantUrl}',`;
             });
 
-            await writeFile(match.segment.filePath, content);
+            await writeFile(match.fragment.filePath, content);
             variantUpdates++;
             console.log(
-              `    ${pc.green('✓')} ${segmentVariant.name} → ${selectedVariant.name}`
+              `    ${pc.green('✓')} ${fragmentVariant.name} → ${selectedVariant.name}`
             );
           } else {
-            console.log(`    ${pc.dim('⏭️')} ${segmentVariant.name} (skipped)`);
+            console.log(`    ${pc.dim('⏭️')} ${fragmentVariant.name} (skipped)`);
           }
         } catch {
-          console.log(`    ${pc.dim('⏭️')} ${segmentVariant.name} (cancelled)`);
+          console.log(`    ${pc.dim('⏭️')} ${fragmentVariant.name} (cancelled)`);
         }
       } else {
-        console.log(`    ${pc.yellow('?')} ${segmentVariant.name}: no matching Figma variant`);
+        console.log(`    ${pc.yellow('?')} ${fragmentVariant.name}: no matching Figma variant`);
       }
     }
   }