@fragments-sdk/cli 0.5.2 → 0.7.0

package/dist/viewer-SUFOISZM.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/viewer/server.ts","../src/viewer/vite-plugin.ts","../src/viewer/render-utils.ts","../src/viewer/style-utils.ts"],"sourcesContent":["/**\n * Segments Dev Server\n *\n * Runs a Vite dev server that:\n * 1. Uses the project's existing Vite/build configuration\n * 2. Has access to all project dependencies\n * 3. Can render actual components with proper styling\n * 4. Supports HMR for segment file changes\n *\n * This is the \"Storybook-like\" experience for Segments.\n */\n\nimport {\n  createServer,\n  mergeConfig,\n  loadConfigFromFile,\n  type ViteDevServer,\n  type InlineConfig,\n} from \"vite\";\nimport react from \"@vitejs/plugin-react\";\nimport { resolve, dirname, join } from \"node:path\";\nimport { existsSync, realpathSync } from \"node:fs\";\nimport { fileURLToPath } from \"node:url\";\nimport { loadConfig, discoverSegmentFiles, discoverInstalledFragments } from \"../core/node.js\";\nimport { segmentsPlugin } from \"./vite-plugin.js\";\n\nconst __dirname = dirname(fileURLToPath(import.meta.url));\n// At runtime, __dirname is dist/. Viewer assets live in src/viewer/.\nconst cliPackageRoot = resolve(__dirname, \"..\");\nconst viewerRoot = resolve(cliPackageRoot, \"src/viewer\");\nconst packagesRoot = resolve(cliPackageRoot, \"..\");\nconst uiLibRoot = resolve(packagesRoot, \"../libs/ui/src\");\n\nexport interface DevServerOptions {\n  /** Port to run the server on */\n  port?: number;\n  /** Path to segments config file */\n  configPath?: string;\n  /** Open browser on start */\n  open?: boolean;\n  /** Project root (defaults to cwd) */\n  projectRoot?: string;\n}\n\n/**\n * Create and start the Segments dev server.\n *\n * The server runs WITHIN the project's context, meaning:\n * - All project dependencies are available\n * - SCSS, CSS modules, etc. work automatically\n * - Path aliases from tsconfig.json work\n * - Components render exactly as they would in the app\n */\nexport async function createDevServer(\n  options: DevServerOptions = {}\n): Promise<ViteDevServer> {\n  const startTime = performance.now();\n  const {\n    port = 6006,\n    configPath,\n    open = true,\n    projectRoot = process.cwd(),\n  } = options;\n\n  console.log(\"\\n🔧 Loading configuration...\");\n\n  // Load segments config\n  const { config, configDir } = await loadConfig(configPath);\n\n  // Discover segment files (local + installed packages)\n  const segmentFiles = await discoverSegmentFiles(config, configDir);\n  const installedFiles = await discoverInstalledFragments(projectRoot);\n  const allSegmentFiles = [...segmentFiles, ...installedFiles];\n  console.log(`📦 Found ${segmentFiles.length} local + ${installedFiles.length} installed fragment file(s)`);\n\n  // Try to load project's Vite config\n  let projectViteConfig: InlineConfig = {};\n  const viteConfigPath = findViteConfig(projectRoot);\n\n  if (viteConfigPath) {\n    console.log(`📄 Using project Vite config: ${viteConfigPath}`);\n    try {\n      const loaded = await loadConfigFromFile(\n        { command: \"serve\", mode: \"development\" },\n        viteConfigPath,\n        projectRoot\n      );\n      if (loaded) {\n        projectViteConfig = loaded.config;\n      }\n    } catch (error) {\n      console.warn(\"⚠️  Could not load project Vite config:\", error);\n    }\n  } else {\n    console.log(\"ℹ️  No project Vite config found, using defaults\");\n  }\n\n  // Find node_modules (handles monorepo setups)\n  const nodeModulesPath = findNodeModules(projectRoot);\n  console.log(`📁 Using node_modules: ${nodeModulesPath}`);\n\n  // Collect installed package roots so Vite can serve files from node_modules\n  const installedPkgRoots = [...new Set(\n    installedFiles.map(f => {\n      const idx = f.absolutePath.indexOf('/node_modules/');\n      if (idx === -1) return dirname(f.absolutePath);\n      const afterNm = f.absolutePath.slice(idx + '/node_modules/'.length);\n      const pkgName = afterNm.startsWith('@')\n        ? afterNm.split('/').slice(0, 2).join('/')\n        : afterNm.split('/')[0];\n      return resolve(projectRoot, 'node_modules', pkgName);\n    })\n  )];\n\n  // Our Segments-specific configuration\n  const segmentsConfig: InlineConfig = {\n    configFile: false, // Don't load config again\n    root: projectRoot, // Run from PROJECT root\n    base: \"/\",\n\n    server: {\n      port,\n      open: open ? \"/fragments/\" : false,\n      fs: {\n        // Allow serving files from viewer package, project, UI library, and node_modules root\n        allow: [viewerRoot, uiLibRoot, projectRoot, configDir, dirname(nodeModulesPath), ...installedPkgRoots],\n      },\n    },\n\n    plugins: [\n      // React support (if not already in project config)\n      ...(hasReactPlugin(projectViteConfig) ? [] : [react()]),\n\n      // Segments plugins (array including SVGR)\n      ...segmentsPlugin({\n        segmentFiles: allSegmentFiles,\n        config,\n        projectRoot,\n      }),\n    ],\n\n    // CSS configuration\n    css: {},\n\n    optimizeDeps: {\n      // Include common dependencies for faster startup\n      include: [\"react\", \"react-dom\", \"react/jsx-runtime\", \"react/jsx-dev-runtime\"],\n    },\n\n    // Ensure we can resolve viewer's dependencies\n    resolve: {\n      // Dedupe ensures all imports of these packages resolve to the same copy\n      dedupe: [\"react\", \"react-dom\"],\n      alias: {\n        // Allow importing from viewer package\n        \"@fragments/viewer\": viewerRoot,\n        // Resolve @fragments/ui to the UI library source for dogfooding\n        \"@fragments/ui\": resolve(uiLibRoot, \"index.ts\"),\n        // Resolve @fragments/core to the consolidated core source\n        \"@fragments/core\": resolve(cliPackageRoot, \"src/core/index.ts\"),\n        // Ensure ALL react imports resolve to project's node_modules\n        // This is critical for viewer files loaded from outside project root\n        \"react\": safeRealpath(join(nodeModulesPath, \"react\")),\n        \"react-dom\": safeRealpath(join(nodeModulesPath, \"react-dom\")),\n        \"react/jsx-runtime\": safeRealpath(join(nodeModulesPath, \"react/jsx-runtime\")),\n        \"react/jsx-dev-runtime\": safeRealpath(join(nodeModulesPath, \"react/jsx-dev-runtime\")),\n      },\n    },\n  };\n\n  // Merge project config with our config\n  // Project config takes precedence for most things\n  const mergedConfig = mergeConfig(projectViteConfig, segmentsConfig);\n\n  console.log(\"🚀 Starting dev server...\\n\");\n\n  // Create and start the server\n  const server = await createServer(mergedConfig);\n  await server.listen();\n\n  // Log startup time\n  const startupTime = ((performance.now() - startTime) / 1000).toFixed(2);\n  console.log(`⚡ Server ready in ${startupTime}s`);\n\n  return server;\n}\n\n/**\n * Resolve symlinks to real paths, with fallback.\n */\nfunction safeRealpath(p: string): string {\n  try {\n    return realpathSync(p);\n  } catch {\n    return p;\n  }\n}\n\n/**\n * Resolve @fragments packages with fallback to monorepo packages.\n * This handles the case where the viewer is served from the fragments monorepo\n * but the user's project doesn't have @fragments packages installed.\n */\nfunction resolveFragmentsPackage(packageName: string, nodeModulesPath: string): string {\n  // Try project's node_modules first\n  const projectPath = join(nodeModulesPath, `@fragments/${packageName}/dist/index.js`);\n  if (existsSync(projectPath)) {\n    return safeRealpath(projectPath);\n  }\n\n  // Fall back to monorepo packages (sibling to viewer)\n  const monorepoPath = resolve(packagesRoot, packageName, \"dist/index.js\");\n  if (existsSync(monorepoPath)) {\n    return safeRealpath(monorepoPath);\n  }\n\n  // Return project path anyway (will error with helpful message)\n  return projectPath;\n}\n\n/**\n * Find node_modules directory by walking up from projectRoot.\n * This handles monorepo setups where node_modules is at the root.\n */\nfunction findNodeModules(startDir: string): string {\n  let current = startDir;\n  while (current !== dirname(current)) {\n    const nodeModulesPath = join(current, \"node_modules\");\n    if (existsSync(join(nodeModulesPath, \"react\"))) {\n      return nodeModulesPath;\n    }\n    current = dirname(current);\n  }\n  // Fallback to projectRoot/node_modules\n  return join(startDir, \"node_modules\");\n}\n\n/**\n * Find Vite config file in project.\n */\nfunction findViteConfig(projectRoot: string): string | null {\n  const configFiles = [\n    \"vite.config.ts\",\n    \"vite.config.js\",\n    \"vite.config.mts\",\n    \"vite.config.mjs\",\n  ];\n\n  for (const file of configFiles) {\n    const path = join(projectRoot, file);\n    if (existsSync(path)) {\n      return path;\n    }\n  }\n\n  return null;\n}\n\n/**\n * Check if project config already has React plugin.\n */\nfunction hasReactPlugin(config: InlineConfig): boolean {\n  if (!config.plugins) return false;\n\n  const plugins = Array.isArray(config.plugins)\n    ? config.plugins\n    : [config.plugins];\n\n  return plugins.some((plugin) => {\n    if (!plugin) return false;\n    if (Array.isArray(plugin)) {\n      return plugin.some(\n        (p) =>\n          p && typeof p === \"object\" && \"name\" in p && p.name?.includes(\"react\")\n      );\n    }\n    return (\n      typeof plugin === \"object\" &&\n      \"name\" in plugin &&\n      plugin.name?.includes(\"react\")\n    );\n  });\n}\n","/**\n * Segments Vite Plugin\n *\n * This plugin runs WITHIN the project's Vite context, giving it access to:\n * - All project dependencies (React, UI libraries, etc.)\n * - Project's loaders (SCSS, CSS modules, etc.)\n * - Project's path aliases (@/components, etc.)\n * - Project's tsconfig paths\n *\n * It provides:\n * - Virtual module for segment imports\n * - Viewer UI served at /fragments/\n * - HMR support for segment file changes\n */\n\nimport type { Plugin, ViteDevServer, ResolvedConfig } from \"vite\";\nimport { resolve, dirname } from \"node:path\";\nimport { fileURLToPath } from \"node:url\";\nimport { readFile } from \"node:fs/promises\";\nimport { transform } from \"esbuild\";\nimport type { SegmentsConfig, CompiledSegment } from \"../core/index.js\";\nimport { generateContext, BRAND } from \"../core/index.js\";\nimport {\n  findStorybookDir,\n  findPreviewConfigPath,\n  generatePreviewModule,\n} from \"../core/node.js\";\nimport svgr from \"vite-plugin-svgr\";\nimport {\n  generateRenderScript,\n  findSegmentByName,\n  getAvailableComponents,\n  type RenderRequest,\n} from \"./render-utils.js\";\nimport {\n  compareStyles,\n  type StyleDiffItem,\n} from \"./style-utils.js\";\n\n/**\n * Request body for /fragments/compare endpoint\n */\ninterface CompareRequest {\n  /** Component name */\n  component: string;\n  /** Variant name (optional, uses first variant if not specified) */\n  variant?: string;\n  /** Props to render with */\n  props?: Record<string, unknown>;\n  /** Figma URL (optional if segment has figma link) */\n  figmaUrl?: string;\n  /** Viewport dimensions */\n  viewport?: { width: number; height: number };\n  /** Figma access token (can be passed from CLI) */\n  figmaToken?: string;\n  /** Diff threshold percentage (default: 1.0) */\n  threshold?: number;\n  /** Include style comparison from Figma design properties */\n  includeStyleDiff?: boolean;\n}\n\n/**\n * Response from /fragments/compare endpoint\n */\ninterface CompareResponse {\n  /** Whether diff is within threshold */\n  match: boolean;\n  /** Diff percentage (0-100) */\n  diffPercentage: number;\n  /** Threshold that was used */\n  threshold: number;\n  /** Rendered component screenshot (base64 PNG) */\n  rendered: string;\n  /** Figma design image (base64 PNG) */\n  figma: string;\n  /** Diff image highlighting differences (base64 PNG) */\n  diff: string;\n  /** The Figma URL that was used */\n  figmaUrl: string;\n  /** Regions that changed */\n  changedRegions: Array<{\n    x: number;\n    y: number;\n    width: number;\n    height: number;\n  }>;\n  /** Style comparison results (when includeStyleDiff is true) */\n  styleDiff?: {\n    /** Whether all styles match */\n    match: boolean;\n    /** Individual property comparisons */\n    properties: StyleDiffItem[];\n    /** CSS properties from Figma design */\n    figmaStyles: Record<string, string>;\n    /** Computed CSS properties from rendered component */\n    renderedStyles: Record<string, string>;\n  };\n}\n\nconst __dirname = dirname(fileURLToPath(import.meta.url));\n// At runtime, __dirname is dist/. Viewer assets live in src/viewer/.\nconst viewerAssetsRoot = resolve(__dirname, \"..\", \"src/viewer\");\n\n// Store pending render requests (for internal render page to pick up)\nconst pendingRenders = new Map<\n  string,\n  { script: string; viewport?: { width: number; height: number } }\n>();\n\n// Shared browser pool for render captures (lazy initialized)\nlet sharedRenderPool: any = null;\nlet browserPoolModule: any = null;\n\n/**\n * Get or create the shared browser pool for render captures.\n * The pool is lazily initialized on first use and reused across requests.\n */\nasync function getSharedRenderPool() {\n  if (!browserPoolModule) {\n    browserPoolModule = await import(\"../service/index.js\");\n  }\n\n  if (!sharedRenderPool) {\n    sharedRenderPool = new browserPoolModule.BrowserPool({\n      viewport: { width: 800, height: 600 }, // Default viewport, will be overridden per page\n      poolSize: 2, // Keep 2 contexts warm for parallel requests\n      idleTimeoutMs: 60000, // Keep warm for 60 seconds\n    });\n  }\n\n  return { pool: sharedRenderPool, bufferToBase64Url: browserPoolModule.bufferToBase64Url };\n}\n\nexport interface SegmentsPluginOptions {\n  /** Discovered segment files */\n  segmentFiles: Array<{\n    absolutePath: string;\n    relativePath: string;\n  }>;\n\n  /** Segments configuration */\n  config: SegmentsConfig;\n\n  /** Project root directory */\n  projectRoot: string;\n}\n\n/**\n * Create the Segments Vite plugin.\n * Returns an array of plugins to support SVGR and other transforms.\n */\nexport function segmentsPlugin(options: SegmentsPluginOptions): Plugin[] {\n  const { segmentFiles, config, projectRoot } = options;\n\n  // Virtual module IDs\n  const VIRTUAL_SEGMENTS = `virtual:${BRAND.nameLower}`;\n  const VIRTUAL_SEGMENTS_RESOLVED = `\\0virtual:${BRAND.nameLower}`;\n\n  const VIRTUAL_VIEWER_ENTRY = `virtual:${BRAND.nameLower}-viewer-entry`;\n  const VIRTUAL_VIEWER_ENTRY_RESOLVED = `\\0virtual:${BRAND.nameLower}-viewer-entry`;\n\n  const VIRTUAL_PREVIEW = `virtual:${BRAND.nameLower}-preview`;\n  const VIRTUAL_PREVIEW_RESOLVED = `\\0virtual:${BRAND.nameLower}-preview`;\n\n  let server: ViteDevServer | null = null;\n  let resolvedConfig: ResolvedConfig | null = null;\n\n  // Detect Storybook preview config path\n  const storybookDir = findStorybookDir(projectRoot);\n  const previewConfigPath = storybookDir\n    ? findPreviewConfigPath(storybookDir)\n    : null;\n\n  // Track segment files for HMR\n  const segmentFileSet = new Set(segmentFiles.map((f) => f.absolutePath));\n\n  const mainPlugin: Plugin = {\n    name: \"segments\",\n\n    // Add process.env shim and esbuild config for Storybook compatibility\n    config() {\n      return {\n        define: {\n          // Shim process.env for story files that use it (e.g., process.env.STORYBOOK_*)\n          \"process.env\": \"{}\",\n        },\n        esbuild: {\n          // Handle JSX in .js files (common in Storybook preview.js files)\n          loader: \"tsx\",\n          include: /\\.(tsx?|jsx?)$/,\n        },\n        optimizeDeps: {\n          // Force esbuild to handle .js files with JSX\n          esbuildOptions: {\n            loader: {\n              \".js\": \"jsx\",\n            },\n          },\n        },\n      };\n    },\n\n    // Store resolved config\n    configResolved(config) {\n      resolvedConfig = config;\n    },\n\n    // Store server reference for HMR\n    configureServer(_server) {\n      server = _server;\n\n      // Serve the viewer UI at /fragments/\n      _server.middlewares.use(async (req, res, next) => {\n        // Handle /fragments/render endpoint for AI preview\n        if (req.url === \"/fragments/render\" && req.method === \"POST\") {\n          try {\n            // Parse JSON body\n            const body = await parseJsonBody(req);\n            const { component, props = {}, viewport } = body as RenderRequest;\n\n            if (!component) {\n              res.writeHead(400, { \"Content-Type\": \"application/json\" });\n              res.end(\n                JSON.stringify({ error: \"Missing required field: component\" })\n              );\n              return;\n            }\n\n            // Load segments to find the component\n            const loadedSegments = await loadSegmentsForRender(\n              segmentFiles,\n              projectRoot\n            );\n            const segmentInfo = findSegmentByName(component, loadedSegments);\n\n            if (!segmentInfo) {\n              const available = getAvailableComponents(loadedSegments);\n              res.writeHead(400, { \"Content-Type\": \"application/json\" });\n              res.end(\n                JSON.stringify({\n                  error: `Component '${component}' not found. Available: ${available.join(\n                    \", \"\n                  )}`,\n                })\n              );\n              return;\n            }\n\n            // Find the absolute path for the segment\n            const segmentFile = segmentFiles.find(\n              (f) => f.relativePath === segmentInfo.path\n            );\n            if (!segmentFile) {\n              res.writeHead(500, { \"Content-Type\": \"application/json\" });\n              res.end(\n                JSON.stringify({ error: \"Could not resolve segment file path\" })\n              );\n              return;\n            }\n\n            // Generate render script\n            const renderScript = generateRenderScript(\n              segmentFile.absolutePath,\n              segmentInfo.name,\n              props\n            );\n\n            // Store the render request for the render page to pick up\n            const requestId =\n              Date.now().toString(36) + Math.random().toString(36).slice(2);\n            pendingRenders.set(requestId, { script: renderScript, viewport });\n\n            // Get server address\n            const address = _server.httpServer?.address();\n            const port =\n              typeof address === \"object\" && address ? address.port : 6006;\n\n            // Use Playwright to render and capture\n            const screenshot = await captureRender(\n              `http://localhost:${port}/fragments/__render__/${requestId}`,\n              viewport || { width: 800, height: 600 }\n            );\n\n            // Clean up\n            pendingRenders.delete(requestId);\n\n            res.setHeader(\"Content-Type\", \"application/json\");\n            res.end(JSON.stringify({ screenshot }));\n          } catch (error) {\n            console.error(\"[Fragments] Error rendering:\", error);\n            res.writeHead(500, { \"Content-Type\": \"application/json\" });\n            res.end(\n              JSON.stringify({\n                error: error instanceof Error ? error.message : \"Render failed\",\n              })\n            );\n          }\n          return;\n        }\n\n        // Serve render page for AI preview (internal use)\n        if (req.url?.startsWith(\"/fragments/__render__/\")) {\n          const requestId = req.url\n            .split(\"/fragments/__render__/\")[1]\n            ?.split(\"?\")[0];\n          const renderData = pendingRenders.get(requestId || \"\");\n\n          if (!renderData) {\n            res.writeHead(404, { \"Content-Type\": \"text/plain\" });\n            res.end(\"Render request not found or expired\");\n            return;\n          }\n\n          await serveRenderHTML(res, _server, renderData.script);\n          return;\n        }\n\n        // Handle /fragments/compare endpoint for Figma design verification\n        if (req.url === \"/fragments/compare\" && req.method === \"POST\") {\n          try {\n            const body = (await parseJsonBody(req)) as CompareRequest;\n            const {\n              component,\n              variant,\n              props = {},\n              figmaUrl,\n              viewport,\n              threshold = 1.0,\n              includeStyleDiff = false,\n            } = body;\n\n            if (!component) {\n              res.writeHead(400, { \"Content-Type\": \"application/json\" });\n              res.end(\n                JSON.stringify({ error: \"Missing required field: component\" })\n              );\n              return;\n            }\n\n            // Check for Figma access token (request body > env var > config)\n            const figmaToken =\n              body.figmaToken ||\n              process.env.FIGMA_ACCESS_TOKEN ||\n              config.figmaToken;\n            if (!figmaToken && !figmaUrl) {\n              res.writeHead(400, { \"Content-Type\": \"application/json\" });\n              res.end(\n                JSON.stringify({\n                  error: `No Figma access token configured. Figma token: ${figmaToken}`,\n                  suggestion:\n                    \"Set FIGMA_ACCESS_TOKEN env var, add figmaToken to fragments.config.ts, or provide in request\",\n                })\n              );\n              return;\n            }\n\n            // Debug: Log segment files\n            console.log(\"[Fragments] Compare request for:\", component);\n            console.log(\"[Fragments] segmentFiles count:\", segmentFiles.length);\n            console.log(\"[Fragments] First 3 segment files:\", segmentFiles.slice(0, 3).map(f => f.relativePath));\n            console.log(\"[Fragments] projectRoot:\", projectRoot);\n\n            // Load segments to find the component and its figma URL\n            const loadedSegments = await loadSegmentsForRender(\n              segmentFiles,\n              projectRoot\n            );\n            console.log(\"[Fragments] loadedSegments count:\", loadedSegments.length);\n            console.log(\"[Fragments] First 3 loaded:\", loadedSegments.slice(0, 3).map(s => s.segment.meta.name));\n            const segmentInfo = findSegmentByName(component, loadedSegments);\n\n            if (!segmentInfo) {\n              const available = getAvailableComponents(loadedSegments);\n              res.writeHead(400, { \"Content-Type\": \"application/json\" });\n              res.end(\n                JSON.stringify({\n                  error: `Component '${component}' not found. Available: ${available.join(\n                    \", \"\n                  )}`,\n                })\n              );\n              return;\n            }\n\n            // Find full segment data to get figma URL\n            const fullSegmentData = await loadFullSegmentForCompare(\n              _server,\n              segmentFiles,\n              component,\n              variant,\n              projectRoot\n            );\n\n            // Determine which Figma URL to use (request > variant > meta)\n            const effectiveFigmaUrl = figmaUrl || fullSegmentData?.figmaUrl;\n\n            if (!effectiveFigmaUrl) {\n              res.writeHead(400, { \"Content-Type\": \"application/json\" });\n              res.end(\n                JSON.stringify({\n                  error: `No Figma URL for component '${component}'`,\n                  suggestion:\n                    \"Add 'figma' field to segment definition or provide figmaUrl in request\",\n                })\n              );\n              return;\n            }\n\n            if (!figmaToken) {\n              res.writeHead(400, { \"Content-Type\": \"application/json\" });\n              res.end(\n                JSON.stringify({\n                  error: \"Figma access token required for comparison\",\n                  suggestion:\n                    \"Set FIGMA_ACCESS_TOKEN env var or add figmaToken to fragments.config.ts\",\n                })\n              );\n              return;\n            }\n\n            // Find segment file for rendering\n            const segmentFile = segmentFiles.find(\n              (f) => f.relativePath === segmentInfo.path\n            );\n            if (!segmentFile) {\n              res.writeHead(500, { \"Content-Type\": \"application/json\" });\n              res.end(\n                JSON.stringify({ error: \"Could not resolve segment file path\" })\n              );\n              return;\n            }\n\n            // Get server port\n            const address = _server.httpServer?.address();\n            const port =\n              typeof address === \"object\" && address ? address.port : 6006;\n            const renderViewport = viewport || { width: 800, height: 600 };\n\n            // Import Figma service\n            const { FigmaClient, bufferToBase64Url } = await import(\n              \"../service/index.js\"\n            );\n            const figmaClient = new FigmaClient({\n              accessToken: figmaToken,\n            });\n\n            // Parse Figma URL to get file key and node ID for style diff\n            const { fileKey, nodeId } = figmaClient.parseUrl(effectiveFigmaUrl);\n\n            // Generate render script and request ID for component capture\n            const renderScript = generateRenderScript(\n              segmentFile.absolutePath,\n              segmentInfo.name,\n              props\n            );\n            const requestId =\n              Date.now().toString(36) + Math.random().toString(36).slice(2);\n            pendingRenders.set(requestId, {\n              script: renderScript,\n              viewport: renderViewport,\n            });\n\n            try {\n              // Execute render, Figma fetch, and optionally style fetch in parallel\n              const [captureResult, figmaImageResult, figmaDesignProps] = await Promise.all([\n                // Render and capture the component (with optional computed styles)\n                captureRenderWithStyles(\n                  `http://localhost:${port}/fragments/__render__/${requestId}`,\n                  renderViewport,\n                  includeStyleDiff\n                ),\n                // Fetch Figma image\n                figmaClient.getImageFromUrl(effectiveFigmaUrl),\n                // Fetch Figma design properties (only if includeStyleDiff is true)\n                includeStyleDiff\n                  ? figmaClient.getNodeProperties(fileKey, nodeId)\n                  : Promise.resolve(null),\n              ]);\n\n              const renderedImage = captureResult.screenshot;\n              const renderedStyles = captureResult.computedStyles;\n              const figmaImage = bufferToBase64Url(figmaImageResult.data);\n\n              // Compare the images\n              const compareResult = await compareImages(\n                renderedImage,\n                figmaImage,\n                threshold\n              );\n\n              // Build response\n              const response: CompareResponse = {\n                match: compareResult.matches,\n                diffPercentage: compareResult.diffPercentage,\n                threshold,\n                rendered: renderedImage,\n                figma: figmaImage,\n                diff: compareResult.diffImage || renderedImage,\n                figmaUrl: effectiveFigmaUrl,\n                changedRegions: compareResult.changedRegions,\n              };\n\n              // Add style diff if requested\n              if (includeStyleDiff && figmaDesignProps && renderedStyles) {\n                const figmaStyles = figmaClient.convertToCSS(figmaDesignProps);\n                // Convert CSSDesignProperties to Record<string, string | undefined>\n                const figmaStylesRecord: Record<string, string | undefined> = { ...figmaStyles };\n                const styleDiffResult = compareStyles(figmaStylesRecord, renderedStyles);\n                response.styleDiff = styleDiffResult;\n\n                // Update overall match to include style match\n                if (!styleDiffResult.match) {\n                  response.match = false;\n                }\n              }\n\n              res.setHeader(\"Content-Type\", \"application/json\");\n              res.end(JSON.stringify(response));\n            } finally {\n              pendingRenders.delete(requestId);\n            }\n          } catch (error) {\n            console.error(\"[Fragments] Error comparing:\", error);\n            res.writeHead(500, { \"Content-Type\": \"application/json\" });\n            res.end(\n              JSON.stringify({\n                error:\n                  error instanceof Error ? error.message : \"Compare failed\",\n              })\n            );\n          }\n          return;\n        }\n\n        // Handle /fragments/figma-styles endpoint for lightweight style fetching\n        // This avoids the heavy Playwright rendering just to get styles\n        if (req.url === \"/fragments/figma-styles\" && req.method === \"POST\") {\n          try {\n            const body = (await parseJsonBody(req)) as {\n              figmaUrl: string;\n            };\n\n            const { figmaUrl } = body;\n\n            if (!figmaUrl) {\n              res.writeHead(400, { \"Content-Type\": \"application/json\" });\n              res.end(JSON.stringify({ error: \"Missing figmaUrl\" }));\n              return;\n            }\n\n            // Check for Figma access token\n            const figmaToken =\n              process.env.FIGMA_ACCESS_TOKEN || config.figmaToken;\n            if (!figmaToken) {\n              res.writeHead(400, { \"Content-Type\": \"application/json\" });\n              res.end(\n                JSON.stringify({\n                  error: \"No Figma access token configured\",\n                  suggestion:\n                    \"Set FIGMA_ACCESS_TOKEN env var or add figmaToken to fragments.config.ts\",\n                })\n              );\n              return;\n            }\n\n            // Import Figma service\n            const { FigmaClient } = await import(\"../service/index.js\");\n            const figmaClient = new FigmaClient({ accessToken: figmaToken });\n\n            // Parse Figma URL\n            const { fileKey, nodeId } = figmaClient.parseUrl(figmaUrl);\n\n            // Fetch design properties\n            const figmaDesignProps = await figmaClient.getNodeProperties(\n              fileKey,\n              nodeId\n            );\n            const figmaStyles = figmaClient.convertToCSS(figmaDesignProps);\n\n            res.setHeader(\"Content-Type\", \"application/json\");\n            res.end(JSON.stringify({ styles: figmaStyles }));\n          } catch (error) {\n            console.error(\"[Fragments] Error fetching Figma styles:\", error);\n            res.writeHead(500, { \"Content-Type\": \"application/json\" });\n            res.end(\n              JSON.stringify({\n                error:\n                  error instanceof Error\n                    ? error.message\n                    : \"Failed to fetch Figma styles\",\n              })\n            );\n          }\n          return;\n        }\n\n        // Handle /fragments/tokens endpoint for token registry\n        if (req.url?.startsWith(\"/fragments/tokens\")) {\n          try {\n            const url = new URL(req.url, \"http://localhost\");\n            const format = url.searchParams.get(\"format\") || \"json\";\n            const category = url.searchParams.get(\"category\");\n            const theme = url.searchParams.get(\"theme\");\n\n            // Check if tokens are configured\n            if (!config.tokens || !config.tokens.include || config.tokens.include.length === 0) {\n              res.writeHead(400, { \"Content-Type\": \"application/json\" });\n              res.end(JSON.stringify({\n                error: \"No token configuration found\",\n                suggestion: \"Add 'tokens' config to fragments.config.ts with 'include' patterns for CSS/SCSS files\",\n                example: {\n                  tokens: {\n                    include: [\"src/styles/theme.scss\", \"src/styles/variables.css\"],\n                    themeSelectors: { \":root\": \"default\", \"[data-theme='dark']\": \"dark\" },\n                  },\n                },\n              }));\n              return;\n            }\n\n            // Import token registry\n            const { getSharedTokenRegistry } = await import(\"../service/index.js\");\n            const registry = getSharedTokenRegistry();\n\n            // Initialize if not already\n            if (!registry.isInitialized()) {\n              await registry.initialize(config.tokens, projectRoot);\n            }\n\n            let tokens = registry.getAllTokens();\n\n            // Filter by category if specified\n            if (category) {\n              tokens = tokens.filter(t => t.category === category);\n            }\n\n            // Filter by theme if specified\n            if (theme) {\n              tokens = tokens.filter(t => t.theme === theme || t.theme === \"default\");\n            }\n\n            const meta = registry.getMeta();\n\n            if (format === \"summary\") {\n              // Return summary only\n              const summary = {\n                totalTokens: meta?.totalTokens || 0,\n                byCategory: {} as Record<string, number>,\n                byTheme: {} as Record<string, number>,\n                parseTimeMs: meta?.parseTimeMs || 0,\n                sourceFiles: meta?.sourceFiles || [],\n              };\n\n              for (const token of registry.getAllTokens()) {\n                summary.byCategory[token.category] = (summary.byCategory[token.category] || 0) + 1;\n                summary.byTheme[token.theme] = (summary.byTheme[token.theme] || 0) + 1;\n              }\n\n              res.setHeader(\"Content-Type\", \"application/json\");\n              res.end(JSON.stringify(summary, null, 2));\n            } else {\n              // Return full token list\n              res.setHeader(\"Content-Type\", \"application/json\");\n              res.end(JSON.stringify({\n                tokens,\n                meta,\n              }, null, 2));\n            }\n          } catch (error) {\n            console.error(\"[Fragments] Error fetching tokens:\", error);\n            res.writeHead(500, { \"Content-Type\": \"application/json\" });\n            res.end(JSON.stringify({\n              error: error instanceof Error ? error.message : \"Failed to fetch tokens\",\n            }));\n          }\n          return;\n        }\n\n        // Handle /fragments/token-match endpoint for reverse token lookup\n        if (req.url === \"/fragments/token-match\" && req.method === \"POST\") {\n          try {\n            const body = (await parseJsonBody(req)) as {\n              value: string;\n              propertyType?: \"color\" | \"spacing\" | \"typography\" | \"other\";\n              theme?: string;\n            };\n\n            const { value, propertyType, theme } = body;\n\n            if (!value) {\n              res.writeHead(400, { \"Content-Type\": \"application/json\" });\n              res.end(JSON.stringify({ error: \"Missing required field: value\" }));\n              return;\n            }\n\n            // Check if tokens are configured\n            if (!config.tokens || !config.tokens.include || config.tokens.include.length === 0) {\n              res.writeHead(400, { \"Content-Type\": \"application/json\" });\n              res.end(JSON.stringify({\n                error: \"No token configuration found\",\n                suggestion: \"Add 'tokens' config to fragments.config.ts\",\n              }));\n              return;\n            }\n\n            // Import token registry\n            const { getSharedTokenRegistry } = await import(\"../service/index.js\");\n            const registry = getSharedTokenRegistry();\n\n            // Initialize if not already\n            if (!registry.isInitialized()) {\n              await registry.initialize(config.tokens, projectRoot);\n            }\n\n            // Match the value\n            const result = registry.matchValue({\n              value,\n              propertyType,\n              theme,\n            });\n\n            res.setHeader(\"Content-Type\", \"application/json\");\n            res.end(JSON.stringify(result));\n          } catch (error) {\n            console.error(\"[Fragments] Error matching token:\", error);\n            res.writeHead(500, { \"Content-Type\": \"application/json\" });\n            res.end(JSON.stringify({\n              error: error instanceof Error ? error.message : \"Failed to match token\",\n            }));\n          }\n          return;\n        }\n\n        // Handle /fragments/compliance endpoint for token compliance checking\n        if (req.url === \"/fragments/compliance\" && req.method === \"POST\") {\n          try {\n            const body = (await parseJsonBody(req)) as {\n              component: string;\n              variant?: string;\n              theme?: string;\n            };\n\n            const { component, variant, theme = \"default\" } = body;\n\n            if (!component) {\n              res.writeHead(400, { \"Content-Type\": \"application/json\" });\n              res.end(JSON.stringify({ error: \"Missing required field: component\" }));\n              return;\n            }\n\n            // Check if tokens are configured\n            if (!config.tokens || !config.tokens.include || config.tokens.include.length === 0) {\n              // Return 100% compliance if no tokens configured (can't check)\n              res.setHeader(\"Content-Type\", \"application/json\");\n              res.end(JSON.stringify({\n                component,\n                variant,\n                compliance: 100,\n                totalProperties: 0,\n                hardcoded: 0,\n                usingTokens: 0,\n                violations: [],\n                note: \"No token configuration found - token compliance checking disabled\",\n              }));\n              return;\n            }\n\n            // Load segment data\n            const loadedSegments = await loadSegmentsForRender(segmentFiles, projectRoot);\n            const segmentInfo = findSegmentByName(component, loadedSegments);\n\n            if (!segmentInfo) {\n              const available = getAvailableComponents(loadedSegments);\n              res.writeHead(400, { \"Content-Type\": \"application/json\" });\n              res.end(JSON.stringify({\n                error: `Component '${component}' not found. Available: ${available.join(\", \")}`,\n              }));\n              return;\n            }\n\n            // Find segment file for rendering\n            const segmentFile = segmentFiles.find(\n              (f) => f.relativePath === segmentInfo.path\n            );\n            if (!segmentFile) {\n              res.writeHead(500, { \"Content-Type\": \"application/json\" });\n              res.end(JSON.stringify({ error: \"Could not resolve segment file path\" }));\n              return;\n            }\n\n            // Import token registry\n            const { getSharedTokenRegistry } = await import(\"../service/index.js\");\n            const registry = getSharedTokenRegistry();\n\n            // Initialize if not already\n            if (!registry.isInitialized()) {\n              await registry.initialize(config.tokens, projectRoot);\n            }\n\n            // Get server port\n            const address = _server.httpServer?.address();\n            const port = typeof address === \"object\" && address ? address.port : 6006;\n            const renderViewport = { width: 800, height: 600 };\n\n            // Generate render script and capture with styles\n            const renderScript = generateRenderScript(\n              segmentFile.absolutePath,\n              segmentInfo.name,\n              {}\n            );\n            const requestId = Date.now().toString(36) + Math.random().toString(36).slice(2);\n            pendingRenders.set(requestId, { script: renderScript, viewport: renderViewport });\n\n            try {\n              // Render the component and extract computed styles\n              const captureResult = await captureRenderWithStyles(\n                `http://localhost:${port}/fragments/__render__/${requestId}`,\n                renderViewport,\n                true // extractStyles = true\n              );\n\n              const computedStyles = captureResult.computedStyles || {};\n\n              // Convert computed styles to style diff format for calculateUsageSummary\n              const styleDiffs: Array<{\n                property: string;\n                figma: string;\n                rendered: string;\n                match: boolean;\n              }> = [];\n\n              // Check each computed style property\n              for (const [property, value] of Object.entries(computedStyles)) {\n                if (!value) continue;\n\n                // Try to find a matching token\n                const matchResult = registry.matchValue({\n                  value,\n                  propertyType: property.toLowerCase().includes(\"color\") ? \"color\" :\n                               property.toLowerCase().includes(\"font\") ? \"typography\" :\n                               property.toLowerCase().includes(\"spacing\") || property.toLowerCase().includes(\"padding\") || property.toLowerCase().includes(\"margin\") ? \"spacing\" : undefined,\n                  theme,\n                });\n\n                // If we found an exact match, the value is using a token\n                const isUsingToken = matchResult.exactMatches.length > 0;\n\n                styleDiffs.push({\n                  property,\n                  figma: value, // Use the value as both figma and rendered for self-comparison\n                  rendered: value,\n                  match: isUsingToken,\n                });\n              }\n\n              // Calculate compliance using token registry\n              const usageSummary = registry.calculateUsageSummary(styleDiffs, theme);\n\n              // Build violations list from hardcoded properties\n              interface ViolationItem {\n                property: string;\n                issue: string;\n                severity: \"error\" | \"warning\";\n                suggestion?: string;\n                expected?: string;\n                actual?: string;\n              }\n\n              const violations: ViolationItem[] = usageSummary.hardcodedProperties.map(hp => {\n                const suggestion = hp.suggestedFix\n                  ? `Use ${hp.suggestedFix.tokenName} (${hp.suggestedFix.tokenValue})`\n                  : undefined;\n\n                return {\n                  property: hp.property,\n                  issue: `Hardcoded value \"${hp.rendered}\" should use a design token`,\n                  severity: \"warning\" as const,\n                  suggestion,\n                  expected: hp.figmaToken,\n                  actual: hp.rendered,\n                };\n              });\n\n              res.setHeader(\"Content-Type\", \"application/json\");\n              res.end(JSON.stringify({\n                component,\n                variant,\n                compliance: usageSummary.compliancePercent,\n                totalProperties: usageSummary.totalProperties,\n                hardcoded: usageSummary.hardcoded,\n                usingTokens: usageSummary.usingTokens,\n                violations,\n              }));\n            } finally {\n              pendingRenders.delete(requestId);\n            }\n          } catch (error) {\n            console.error(\"[Fragments] Error checking compliance:\", error);\n            res.writeHead(500, { \"Content-Type\": \"application/json\" });\n            res.end(JSON.stringify({\n              error: error instanceof Error ? error.message : \"Compliance check failed\",\n            }));\n          }\n          return;\n        }\n\n        // Handle /fragments/context endpoint for AI context generation\n        if (req.url?.startsWith(\"/fragments/context\")) {\n          try {\n            const url = new URL(req.url, \"http://localhost\");\n            const format = (url.searchParams.get(\"format\") || \"markdown\") as\n              | \"markdown\"\n              | \"json\";\n            const compact = url.searchParams.get(\"compact\") === \"true\";\n\n            // Load all segments from BRAND.outFile\n            const compiledSegments = await loadSegmentsForContext(\n              _server,\n              segmentFiles,\n              config,\n              projectRoot\n            );\n\n            const { content, tokenEstimate } = generateContext(\n              compiledSegments,\n              {\n                format,\n                compact,\n                include: {\n                  code: url.searchParams.get(\"code\") === \"true\",\n                  relations: url.searchParams.get(\"relations\") === \"true\",\n                },\n              }\n            );\n\n            res.setHeader(\"X-Token-Estimate\", String(tokenEstimate));\n            res.setHeader(\n              \"Content-Type\",\n              format === \"json\"\n                ? \"application/json\"\n                : \"text/markdown; charset=utf-8\"\n            );\n            res.end(content);\n          } catch (error) {\n            console.error(\"[Fragments] Error generating context:\", error);\n            res.writeHead(500, { \"Content-Type\": \"text/plain\" });\n            res.end(\n              \"Error generating context: \" +\n                (error instanceof Error ? error.message : error)\n            );\n          }\n          return;\n        }\n\n        // Handle /fragments/save endpoint for saving fragment metadata\n        if (req.url === \"/fragments/save\" && req.method === \"POST\") {\n          try {\n            const body = await parseJsonBody(req);\n            const { componentName, fragment } = body as {\n              componentName: string;\n              fragment: Record<string, unknown>;\n            };\n\n            if (!componentName || !fragment) {\n              res.writeHead(400, { \"Content-Type\": \"application/json\" });\n              res.end(\n                JSON.stringify({\n                  error: \"Missing required fields: componentName, fragment\",\n                })\n              );\n              return;\n            }\n\n            // Import writeFile for saving\n            const { writeFile, mkdir } = await import(\"node:fs/promises\");\n            const { join } = await import(\"node:path\");\n            const { BRAND } = await import(\"../core/index.js\");\n\n            // Ensure .fragments/components directory exists\n            const fragmentsDir = join(projectRoot, BRAND.dataDir, BRAND.componentsDir);\n            await mkdir(fragmentsDir, { recursive: true });\n\n            // Write fragment file\n            const fragmentPath = join(\n              fragmentsDir,\n              `${componentName}${BRAND.fileExtension}`\n            );\n            await writeFile(\n              fragmentPath,\n              JSON.stringify(fragment, null, 2),\n              \"utf-8\"\n            );\n\n            res.setHeader(\"Content-Type\", \"application/json\");\n            res.end(JSON.stringify({ success: true, path: fragmentPath }));\n          } catch (error) {\n            console.error(\"[Fragments] Error saving fragment:\", error);\n            res.writeHead(500, { \"Content-Type\": \"application/json\" });\n            res.end(\n              JSON.stringify({\n                error: error instanceof Error ? error.message : \"Save failed\",\n              })\n            );\n          }\n          return;\n        }\n\n        // Handle /fragments/fix endpoint for generating token fix patches\n        if (req.url === \"/fragments/fix\" && req.method === \"POST\") {\n          try {\n            const body = (await parseJsonBody(req)) as {\n              component: string;\n              variant?: string;\n              fixType?: \"token\" | \"all\";\n            };\n\n            const { component, variant, fixType = \"all\" } = body;\n\n            if (!component) {\n              res.writeHead(400, { \"Content-Type\": \"application/json\" });\n              res.end(JSON.stringify({ error: \"Missing required field: component\" }));\n              return;\n            }\n\n            // Check if tokens are configured\n            if (!config.tokens || !config.tokens.include || config.tokens.include.length === 0) {\n              res.writeHead(400, { \"Content-Type\": \"application/json\" });\n              res.end(JSON.stringify({\n                error: \"No token configuration found\",\n                suggestion: \"Add 'tokens' config to fragments.config.ts to enable fix generation\",\n              }));\n              return;\n            }\n\n            // Load segment data\n            const loadedSegments = await loadSegmentsForRender(segmentFiles, projectRoot);\n            const segmentInfo = findSegmentByName(component, loadedSegments);\n\n            if (!segmentInfo) {\n              const available = getAvailableComponents(loadedSegments);\n              res.writeHead(400, { \"Content-Type\": \"application/json\" });\n              res.end(JSON.stringify({\n                error: `Component '${component}' not found. Available: ${available.join(\", \")}`,\n              }));\n              return;\n            }\n\n            // Import services\n            const {\n              getSharedTokenRegistry,\n              generateTokenPatches,\n            } = await import(\"../service/index.js\");\n            const registry = getSharedTokenRegistry();\n\n            // Initialize token registry if not already\n            if (!registry.isInitialized()) {\n              await registry.initialize(config.tokens, projectRoot);\n            }\n\n            // For now, we generate patches based on style diff data\n            // In a full implementation, we would:\n            // 1. Render the component and get computed styles\n            // 2. Compare with Figma styles to find hardcoded values\n            // 3. Generate patches for each hardcoded value\n\n            // Get source file path from segment\n            const segmentFile = segmentFiles.find(\n              (f) => f.relativePath === segmentInfo.path\n            );\n            const sourceFile = segmentFile?.relativePath || `${component}.tsx`;\n\n            // For demonstration, we'll create a placeholder response\n            // In production, this would use style comparison + AST patching\n            const result = generateTokenPatches(\n              component,\n              [], // Would be populated by actual style diffs\n              registry,\n              { sourceFile }\n            );\n\n            res.setHeader(\"Content-Type\", \"application/json\");\n            res.end(JSON.stringify({\n              patches: result.patches,\n              summary: result.summary,\n              fixableCount: result.fixableCount,\n              unfixableCount: result.unfixableCount,\n            }));\n          } catch (error) {\n            console.error(\"[Fragments] Error generating fixes:\", error);\n            res.writeHead(500, { \"Content-Type\": \"application/json\" });\n            res.end(JSON.stringify({\n              error: error instanceof Error ? error.message : \"Fix generation failed\",\n            }));\n          }\n          return;\n        }\n\n        // Handle /fragments/preview/ - isolated iframe for component previews\n        if (req.url?.startsWith(\"/fragments/preview\")) {\n          // Redirect to trailing slash\n          if (req.url === \"/fragments/preview\") {\n            res.writeHead(302, { Location: \"/fragments/preview/\" });\n            res.end();\n            return;\n          }\n\n          // Serve the preview frame HTML\n          await servePreviewFrameHTML(res, _server);\n          return;\n        }\n\n        if (req.url === \"/segments\" || req.url === \"/fragments/\") {\n          // Redirect to /fragments/\n          if (!req.url.endsWith(\"/\")) {\n            res.writeHead(302, { Location: \"/fragments/\" });\n            res.end();\n            return;\n          }\n\n          // Serve the viewer HTML\n          serveViewerHTML(res, _server);\n          return;\n        }\n\n        next();\n      });\n\n      // Log startup message\n      _server.httpServer?.once(\"listening\", () => {\n        const address = _server.httpServer?.address();\n        const port =\n          typeof address === \"object\" && address ? address.port : 6006;\n        console.log(\n          `\\n  📦 Fragments Viewer: http://localhost:${port}/fragments/\\n`\n        );\n      });\n    },\n\n    // Resolve virtual modules\n    resolveId(id) {\n      if (id === VIRTUAL_SEGMENTS) {\n        return VIRTUAL_SEGMENTS_RESOLVED;\n      }\n      if (id === VIRTUAL_VIEWER_ENTRY) {\n        return VIRTUAL_VIEWER_ENTRY_RESOLVED;\n      }\n      if (id === VIRTUAL_PREVIEW) {\n        return VIRTUAL_PREVIEW_RESOLVED;\n      }\n      return null;\n    },\n\n    // Load virtual modules\n    load(id) {\n      if (id === VIRTUAL_SEGMENTS_RESOLVED) {\n        return generateSegmentsModule(segmentFiles, config, previewConfigPath);\n      }\n      if (id === VIRTUAL_VIEWER_ENTRY_RESOLVED) {\n        return generateViewerEntry();\n      }\n      if (id === VIRTUAL_PREVIEW_RESOLVED) {\n        return generatePreviewModule(previewConfigPath);\n      }\n      return null;\n    },\n\n    // Handle HMR for segment files\n    handleHotUpdate({ file, server }) {\n      if (segmentFileSet.has(file)) {\n        // Invalidate the virtual segments module\n        const mod = server.moduleGraph.getModuleById(VIRTUAL_SEGMENTS_RESOLVED);\n        if (mod) {\n          server.moduleGraph.invalidateModule(mod);\n        }\n\n        // Send HMR update\n        server.ws.send({\n          type: \"custom\",\n          event: \"segments:update\",\n          data: { file },\n        });\n\n        // Return empty array to prevent full reload\n        // The component HMR will handle the actual update\n        return [];\n      }\n    },\n  };\n\n  // Plugin to transform JSX in .js files (common in Storybook preview.js)\n  // Uses the `load` hook instead of `transform` because we need to intercept\n  // the file BEFORE Vite's import-analysis tries to parse it\n  const jsxTransformPlugin: Plugin = {\n    name: \"segments-jsx-transform\",\n    enforce: \"pre\",\n    async load(id) {\n      // Only handle .js files that might contain JSX (like preview.js)\n      if (!id.endsWith(\".js\")) return null;\n\n      // Only handle .storybook directory files (most common case for JSX in .js)\n      if (!id.includes(\".storybook\")) return null;\n\n      // Read the file content\n      const fs = await import(\"node:fs/promises\");\n      let code: string;\n      try {\n        code = await fs.readFile(id, \"utf-8\");\n      } catch {\n        return null;\n      }\n\n      // Check if the file contains JSX syntax\n      const hasOpeningTag = code.includes(\"<\");\n      const hasSelfClosingTag = code.includes(\"/>\");\n      const hasClosingTag = code.includes(\"</\");\n\n      // Skip if no JSX detected\n      if (!hasOpeningTag || (!hasSelfClosingTag && !hasClosingTag)) return null;\n\n      try {\n        const result = await transform(code, {\n          loader: \"jsx\",\n          jsx: \"automatic\",\n          sourcefile: id,\n          sourcemap: true,\n        });\n        return {\n          code: result.code,\n          map: result.map,\n        };\n      } catch (error) {\n        // Log error for debugging but don't block\n        console.warn(`[Fragments] JSX transform failed for ${id}:`, error instanceof Error ? error.message : error);\n        return null;\n      }\n    },\n  };\n\n  // Return array of plugins including SVGR for SVG imports\n  return [\n    // JSX transform for .js files (must run first)\n    jsxTransformPlugin,\n    // SVGR plugin to handle `import { ReactComponent } from \"*.svg\"` pattern\n    svgr({\n      svgrOptions: {\n        exportType: \"named\", // Export as { ReactComponent }\n      },\n      include: \"**/*.svg\",\n    }),\n    // Main segments plugin\n    mainPlugin,\n  ];\n}\n\n/**\n * Check if a file path is a Storybook story file\n */\nfunction isStoryFile(filePath: string): boolean {\n  return /\\.stories\\.(tsx?|jsx?)$/.test(filePath);\n}\n\n/**\n * Get the base component path from a segment or story file path.\n * e.g., \"src/components/Button/Button.segment.tsx\" -> \"src/components/Button/Button\"\n * e.g., \"src/components/Button/Button.stories.tsx\" -> \"src/components/Button/Button\"\n */\nfunction getBaseComponentPath(filePath: string): string {\n  return filePath.replace(/\\.(segment|stories)\\.(tsx?|jsx?)$/, \"\");\n}\n\n/**\n * Generate the virtual segments module.\n * Uses dynamic imports for lazy loading - segments are loaded on demand.\n * Supports both native .segment.tsx files and Storybook .stories.tsx files.\n * Integrates Storybook preview config for global decorators, parameters, etc.\n *\n * MERGE STRATEGY: When both .segment.tsx and .stories.tsx exist for the same component:\n * - Use .stories.tsx for RENDERING (variants, props, etc.) - it's the source of truth\n * - Merge METADATA from .segment.tsx (Figma URLs, AI descriptions, usage guidelines)\n * - This gives us the best of both worlds: working renders + rich metadata\n */\nfunction generateSegmentsModule(\n  segmentFiles: Array<{ absolutePath: string; relativePath: string }>,\n  config: SegmentsConfig,\n  previewConfigPath: string | null\n): string {\n  // Group files by base component path to identify pairs\n  const filesByBasePath = new Map<string, {\n    storyFile?: { absolutePath: string; relativePath: string };\n    segmentFile?: { absolutePath: string; relativePath: string };\n  }>();\n\n  for (const file of segmentFiles) {\n    const basePath = getBaseComponentPath(file.relativePath);\n    const isStory = isStoryFile(file.relativePath);\n\n    const existing = filesByBasePath.get(basePath) || {};\n\n    if (isStory) {\n      existing.storyFile = file;\n    } else {\n      existing.segmentFile = file;\n    }\n\n    filesByBasePath.set(basePath, existing);\n  }\n\n  // Generate loaders with metadata merge support\n  // Priority: stories for rendering, segment for metadata (Figma URLs, etc.)\n  const loaders = Array.from(filesByBasePath.values())\n    .map((files) => {\n      // Determine which file to use for rendering\n      const primaryFile = files.storyFile || files.segmentFile;\n      if (!primaryFile) return null;\n\n      const isStory = !!files.storyFile;\n\n      // If we have both, include the segment file path for metadata merge\n      const metadataPath = (files.storyFile && files.segmentFile)\n        ? files.segmentFile.absolutePath\n        : null;\n\n      return `  {\n    path: \"${primaryFile.relativePath}\",\n    isStory: ${isStory},\n    loader: () => import(\"${primaryFile.absolutePath}\"),\n    metadataLoader: ${metadataPath ? `() => import(\"${metadataPath}\")` : 'null'}\n  }`;\n    })\n    .filter(Boolean)\n    .join(\",\\n\");\n\n  // Generate preview config import if available\n  const previewImport = previewConfigPath\n    ? `import * as previewConfig from \"virtual:segments-preview\";`\n    : \"\";\n  const previewSetup = previewConfigPath\n    ? `\n// Set global preview config before loading segments\nsetPreviewConfig({\n  decorators: previewConfig.decorators,\n  parameters: previewConfig.parameters,\n  globalTypes: previewConfig.globalTypes,\n  args: previewConfig.args,\n  argTypes: previewConfig.argTypes,\n  loaders: previewConfig.loaders,\n});\n`\n    : \"\";\n\n  return `\nimport { storyModuleToSegment, setPreviewConfig } from \"@fragments/core\";\n${previewImport}\n${previewSetup}\n// Lazy segment loaders (supports both .segment.tsx and .stories.tsx)\nconst segmentLoaders = [\n${loaders}\n];\n\n// Cache for loaded segments\nconst loadedSegments = new Map();\n\n/**\n * Merge metadata from a segment file into a story-based segment.\n * This preserves Figma URLs and other AI-agent focused data.\n */\nfunction mergeMetadata(segment, metadataModule) {\n  if (!metadataModule?.default) return segment;\n\n  const metadata = metadataModule.default;\n\n  // Merge meta-level Figma URL\n  if (metadata.meta?.figma && !segment.meta.figma) {\n    segment.meta.figma = metadata.meta.figma;\n  }\n\n  // Merge description if not present\n  if (metadata.meta?.description && !segment.meta.description) {\n    segment.meta.description = metadata.meta.description;\n  }\n\n  // Merge variant-level Figma URLs\n  if (metadata.variants && segment.variants) {\n    for (const metaVariant of metadata.variants) {\n      const segmentVariant = segment.variants.find(v => v.name === metaVariant.name);\n      if (segmentVariant && metaVariant.figma && !segmentVariant.figma) {\n        segmentVariant.figma = metaVariant.figma;\n      }\n    }\n  }\n\n  return segment;\n}\n\n// Load all segments (for initial render)\n// Gracefully handles individual failures - one bad story won't break all segments\nexport async function loadAllSegments() {\n  const results = await Promise.all(\n    segmentLoaders.map(async (loader) => {\n      try {\n        if (loadedSegments.has(loader.path)) {\n          const cached = loadedSegments.get(loader.path);\n          return cached ? { path: loader.path, segment: cached } : null;\n        }\n\n        const module = await loader.loader();\n\n        // Convert story modules to segments at runtime\n        let segment;\n        if (loader.isStory) {\n          segment = storyModuleToSegment(module, loader.path);\n          // storyModuleToSegment returns null for stories without a component\n          if (!segment) {\n            loadedSegments.set(loader.path, null);\n            return null;\n          }\n        } else {\n          segment = module.default;\n        }\n\n        // Merge metadata from corresponding segment file if available\n        if (loader.metadataLoader) {\n          try {\n            const metadataModule = await loader.metadataLoader();\n            segment = mergeMetadata(segment, metadataModule);\n          } catch (metaError) {\n            // Metadata loading is optional - don't fail if it errors\n            console.warn(\"[Fragments] Could not load metadata for \" + loader.path + \":\", metaError.message);\n          }\n        }\n\n        loadedSegments.set(loader.path, segment);\n        return { path: loader.path, segment };\n      } catch (error) {\n        console.warn(\"[Fragments] Failed to load \" + loader.path + \":\", error.message);\n        return null;\n      }\n    })\n  );\n  // Filter out failed loads\n  return results.filter(r => r !== null);\n}\n\n// Load a single segment by path\nexport async function loadSegment(path) {\n  const loader = segmentLoaders.find(l => l.path === path);\n  if (!loader) return null;\n\n  if (loadedSegments.has(path)) {\n    return loadedSegments.get(path);\n  }\n\n  const module = await loader.loader();\n\n  // Convert story modules to segments at runtime\n  let segment;\n  if (loader.isStory) {\n    segment = storyModuleToSegment(module, path);\n  } else {\n    segment = module.default;\n  }\n\n  // Merge metadata from corresponding segment file if available\n  if (loader.metadataLoader && segment) {\n    try {\n      const metadataModule = await loader.metadataLoader();\n      segment = mergeMetadata(segment, metadataModule);\n    } catch (metaError) {\n      console.warn(\"[Fragments] Could not load metadata for \" + path + \":\", metaError.message);\n    }\n  }\n\n  loadedSegments.set(path, segment);\n  return segment;\n}\n\n// For backwards compatibility, load all segments synchronously on import\n// This is still lazy per-file but awaited at module load\nlet segments = [];\nconst segmentsPromise = loadAllSegments().then(s => { segments = s; return s; });\n\nexport { segments, segmentsPromise };\nexport const config = ${JSON.stringify(config)};\n\n// HMR support\nif (import.meta.hot) {\n  import.meta.hot.accept();\n\n  import.meta.hot.on(\"segments:update\", (data) => {\n    console.log(\"[Fragments] File updated:\", data.file);\n    // Clear cache for the updated file (handles both .segment and .stories)\n    for (const [path, _] of loadedSegments) {\n      const basePath = path.replace(/\\\\.(segment|stories)\\\\.tsx?$/, '');\n      if (data.file.includes(basePath)) {\n        loadedSegments.delete(path);\n      }\n    }\n    // Trigger re-render in viewer\n    window.dispatchEvent(new CustomEvent(\"segments:update\"));\n  });\n}\n`;\n}\n\n/**\n * Generate the viewer entry point.\n */\nfunction generateViewerEntry(): string {\n  return `\nimport { segments, config } from \"virtual:segments\";\n\n// Re-export for viewer\nexport { segments, config };\n\n// Initialize viewer\nconsole.log(\"[Fragments] Loaded\", segments.length, \"segment(s)\");\n`;\n}\n\n/**\n * Load segments for context generation.\n * Uses BRAND.outFile to avoid SSR module loading issues with React CJS modules.\n */\nasync function loadSegmentsForContext(\n  _server: ViteDevServer,\n  _segmentFiles: Array<{ absolutePath: string; relativePath: string }>,\n  _config: SegmentsConfig,\n  configDir?: string\n): Promise<CompiledSegment[]> {\n  const { join } = await import(\"node:path\");\n\n  // Read from outFile (avoids SSR issues with React CJS)\n  const segmentsJsonPath = join(configDir || process.cwd(), BRAND.outFile);\n\n  try {\n    const content = await readFile(segmentsJsonPath, \"utf-8\");\n    const data = JSON.parse(content) as {\n      segments: Record<string, CompiledSegment>;\n    };\n\n    return Object.values(data.segments || {});\n  } catch (error) {\n    console.warn(\n      `[${BRAND.name}] Failed to load ${BRAND.outFile} for context:`,\n      error\n    );\n    console.warn(`[${BRAND.name}] Run '${BRAND.cliCommand} build' to generate ${BRAND.outFile}`);\n    return [];\n  }\n}\n\n/**\n * Serve the viewer HTML page.\n */\nasync function serveViewerHTML(res: any, server: ViteDevServer): Promise<void> {\n  const viewerRoot = viewerAssetsRoot;\n  const entryPath = resolve(viewerRoot, \"entry.tsx\");\n\n  try {\n    // Read the viewer HTML template\n    let html = await readFile(resolve(viewerRoot, \"index.html\"), \"utf-8\");\n\n    // Rewrite the entry.tsx path to use absolute path to viewer package\n    html = html.replace(\"/src/entry.tsx\", entryPath);\n\n    // Transform HTML through Vite's pipeline\n    html = await server.transformIndexHtml(\"/fragments/\", html);\n\n    res.writeHead(200, { \"Content-Type\": \"text/html\" });\n    res.end(html);\n  } catch (error) {\n    console.error(\"[Fragments] Error serving viewer:\", error);\n    res.writeHead(500, { \"Content-Type\": \"text/plain\" });\n    res.end(\"Error loading Segments viewer\");\n  }\n}\n\n/**\n * Serve the isolated preview frame HTML page.\n * This is used for iframe-based component preview with CSS isolation.\n */\nasync function servePreviewFrameHTML(res: any, server: ViteDevServer): Promise<void> {\n  const viewerRoot = viewerAssetsRoot;\n  const entryPath = resolve(viewerRoot, \"preview-frame-entry.tsx\");\n\n  try {\n    // Read the preview frame HTML template\n    let html = await readFile(resolve(viewerRoot, \"preview-frame.html\"), \"utf-8\");\n\n    // Rewrite the entry path to use absolute path to viewer package\n    html = html.replace(\"/src/preview-frame-entry.tsx\", entryPath);\n\n    // Transform HTML through Vite's pipeline\n    html = await server.transformIndexHtml(\"/fragments/preview/\", html);\n\n    res.writeHead(200, { \"Content-Type\": \"text/html\" });\n    res.end(html);\n  } catch (error) {\n    console.error(\"[Fragments] Error serving preview frame:\", error);\n    res.writeHead(500, { \"Content-Type\": \"text/plain\" });\n    res.end(\"Error loading preview frame\");\n  }\n}\n\n/**\n * Parse JSON body from an HTTP request.\n */\nasync function parseJsonBody(req: any): Promise<unknown> {\n  return new Promise((resolve, reject) => {\n    let body = \"\";\n    req.on(\"data\", (chunk: Buffer) => {\n      body += chunk.toString();\n    });\n    req.on(\"end\", () => {\n      try {\n        resolve(JSON.parse(body));\n      } catch (error) {\n        reject(new Error(\"Invalid JSON body\"));\n      }\n    });\n    req.on(\"error\", reject);\n  });\n}\n\n/**\n * Load segments for render from BRAND.outFile or by building on-the-fly.\n * This avoids SSR issues with React components.\n */\nasync function loadSegmentsForRender(\n  segmentFiles: Array<{ absolutePath: string; relativePath: string }>,\n  configDir: string\n): Promise<Array<{ path: string; segment: { meta: { name: string } } }>> {\n  const { join } = await import(\"node:path\");\n\n  // Try to read from the project directory\n  const segmentsJsonPath = join(configDir, BRAND.outFile);\n\n  try {\n    const content = await readFile(segmentsJsonPath, \"utf-8\");\n    const data = JSON.parse(content) as {\n      segments: Record<string, { filePath: string; meta: { name: string } }>;\n    };\n\n    // Convert to the expected format if we have entries\n    const segmentEntries = Object.values(data.segments || {});\n    if (segmentEntries.length > 0) {\n      return segmentEntries.map((segment) => ({\n        path: segment.filePath,\n        segment: { meta: { name: segment.meta.name } },\n      }));\n    }\n    // Fall through to file-based extraction if outFile is empty\n  } catch {\n    // outFile doesn't exist or is invalid - fall through to file-based extraction\n  }\n\n  // Extract component names from file paths (fallback)\n  return segmentFiles.map((f) => {\n    let name: string;\n    if (isStoryFile(f.relativePath)) {\n      // Extract name from path like \"src/components/Button/Button.stories.tsx\"\n      const match = f.relativePath.match(/\\/([^/]+)\\.stories\\./);\n      name = match ? match[1] : f.relativePath;\n    } else {\n      // Extract name from path like \"src/components/Button/Button.segment.tsx\"\n      const match = f.relativePath.match(/\\/([^/]+)\\.segment\\./);\n      name = match ? match[1] : f.relativePath;\n    }\n    return {\n      path: f.relativePath,\n      segment: { meta: { name } },\n    };\n  });\n}\n\n/**\n * Serve the render HTML page for AI preview.\n */\nasync function serveRenderHTML(\n  res: any,\n  server: ViteDevServer,\n  renderScript: string\n): Promise<void> {\n  const viewerRoot = viewerAssetsRoot;\n\n  try {\n    // Read the render template\n    let html = await readFile(\n      resolve(viewerRoot, \"render-template.html\"),\n      \"utf-8\"\n    );\n\n    // Inject the render script\n    html = html.replace(\n      \"<!-- RENDER_SCRIPT_PLACEHOLDER -->\",\n      `<script type=\"module\">${renderScript}</script>`\n    );\n\n    // Transform HTML through Vite's pipeline to process imports\n    // Use a unique URL to prevent Vite from caching the transformed HTML\n    const uniqueUrl = `/fragments/__render__/${Date.now()}`;\n    html = await server.transformIndexHtml(uniqueUrl, html);\n\n    res.writeHead(200, { \"Content-Type\": \"text/html\" });\n    res.end(html);\n  } catch (error) {\n    console.error(\"[Fragments] Error serving render page:\", error);\n    res.writeHead(500, { \"Content-Type\": \"text/plain\" });\n    res.end(\"Error loading render page\");\n  }\n}\n\n/**\n * Capture a render using the shared browser pool from @fragments/service.\n * Uses a shared pool for efficiency - browser stays warm across requests.\n */\nasync function captureRender(\n  url: string,\n  viewport: { width: number; height: number }\n): Promise<string> {\n  const { pool, bufferToBase64Url } = await getSharedRenderPool();\n\n  const ctx = await pool.acquire();\n  const page = await ctx.newPage();\n\n  try {\n    // Set viewport for this specific render\n    await page.setViewportSize(viewport);\n\n    // Navigate to the render page\n    await page.goto(url, { waitUntil: \"networkidle\" });\n\n    // Wait for render to complete (indicated by ready class or timeout)\n    await page.waitForFunction(\n      () => (window as any).__RENDER_READY__ === true,\n      { timeout: 10000 }\n    );\n\n    // Check for render error\n    const error = await page.evaluate(() => (window as any).__RENDER_ERROR__);\n    if (error) {\n      throw new Error(`Render error: ${error}`);\n    }\n\n    // Screenshot the render root element\n    const element = await page.$(\"#render-root\");\n    if (!element) {\n      throw new Error(\"Render root element not found\");\n    }\n\n    const screenshot = await element.screenshot({ type: \"png\" });\n\n    return bufferToBase64Url(screenshot);\n  } finally {\n    await page.close();\n    pool.release(ctx);\n  }\n}\n\n/**\n * Capture a render with optional computed styles extraction.\n * Uses the shared browser pool for efficiency.\n */\nasync function captureRenderWithStyles(\n  url: string,\n  viewport: { width: number; height: number },\n  extractStyles: boolean\n): Promise<{ screenshot: string; computedStyles: Record<string, string> | null }> {\n  const { pool, bufferToBase64Url } = await getSharedRenderPool();\n\n  const ctx = await pool.acquire();\n  const page = await ctx.newPage();\n\n  try {\n    // Set viewport for this specific render\n    await page.setViewportSize(viewport);\n\n    await page.goto(url, { waitUntil: \"networkidle\" });\n\n      await page.waitForFunction(\n        () => (window as any).__RENDER_READY__ === true,\n        { timeout: 10000 }\n      );\n\n      const error = await page.evaluate(() => (window as any).__RENDER_ERROR__);\n      if (error) {\n        throw new Error(`Render error: ${error}`);\n      }\n\n      const element = await page.$(\"#render-root\");\n      if (!element) {\n        throw new Error(\"Render root element not found\");\n      }\n\n      // Extract computed styles if requested\n      let computedStyles: Record<string, string> | null = null;\n      if (extractStyles) {\n        computedStyles = await page.evaluate(() => {\n          const root = document.getElementById(\"render-root\");\n          if (!root) return null;\n\n          // Helper function to check if a color is visible (not transparent)\n          const isVisibleColor = (color: string | undefined): boolean => {\n            if (!color) return false;\n            if (color === \"transparent\") return false;\n            if (color === \"rgba(0, 0, 0, 0)\") return false;\n            if (color.includes(\"rgba\") && color.includes(\", 0)\")) return false;\n            return true;\n          };\n\n          // Helper to extract styles from an element\n          const extractStylesFromElement = (el: HTMLElement): Record<string, string> => {\n            const styles = window.getComputedStyle(el);\n            const relevantProps = [\n              \"backgroundColor\",\n              \"borderColor\",\n              \"borderWidth\",\n              \"borderRadius\",\n              \"fontFamily\",\n              \"fontSize\",\n              \"fontWeight\",\n              \"lineHeight\",\n              \"letterSpacing\",\n              \"textAlign\",\n              \"boxShadow\",\n              \"padding\",\n              \"paddingTop\",\n              \"paddingRight\",\n              \"paddingBottom\",\n              \"paddingLeft\",\n              \"gap\",\n              \"opacity\",\n              \"width\",\n              \"height\",\n            ];\n\n            const result: Record<string, string> = {};\n            for (const prop of relevantProps) {\n              const value = styles.getPropertyValue(\n                prop.replace(/([A-Z])/g, \"-$1\").toLowerCase()\n              );\n              if (value) {\n                result[prop] = value;\n              }\n            }\n            return result;\n          };\n\n          // Strategy: Find the element with the most visible styles\n          // Start by looking at all elements and score them based on visual presence\n          const candidates = root.querySelectorAll(\"*\");\n          let bestElement: HTMLElement | null = null;\n          let bestScore = -1;\n\n          for (const el of candidates) {\n            const htmlEl = el as HTMLElement;\n            const styles = window.getComputedStyle(htmlEl);\n            let score = 0;\n\n            // Score based on visual properties\n            const bg = styles.backgroundColor;\n            if (isVisibleColor(bg)) {\n              score += 10; // Visible background is a strong signal\n            }\n\n            const border = styles.borderWidth;\n            if (border && border !== \"0px\") {\n              score += 3;\n            }\n\n            const boxShadow = styles.boxShadow;\n            if (boxShadow && boxShadow !== \"none\") {\n              score += 3;\n            }\n\n            // Bonus for being an interactive element\n            const tagName = htmlEl.tagName.toLowerCase();\n            if ([\"button\", \"a\", \"input\", \"select\", \"textarea\"].includes(tagName)) {\n              score += 5;\n            }\n\n            // Bonus for having role=\"button\"\n            if (htmlEl.getAttribute(\"role\") === \"button\") {\n              score += 5;\n            }\n\n            // Penalty for being too small (likely not the main component)\n            const rect = htmlEl.getBoundingClientRect();\n            if (rect.width < 10 || rect.height < 10) {\n              score -= 10;\n            }\n\n            // Penalty for very large elements (likely containers)\n            if (rect.width > 500 || rect.height > 500) {\n              score -= 3;\n            }\n\n            if (score > bestScore) {\n              bestScore = score;\n              bestElement = htmlEl;\n            }\n          }\n\n          // If we still have no good element, fall back to first child\n          if (!bestElement) {\n            bestElement = root.firstElementChild as HTMLElement | null;\n          }\n\n          if (!bestElement) return null;\n\n          const result = extractStylesFromElement(bestElement);\n\n          // Normalize padding into shorthand if individual values exist\n          if (result.paddingTop && result.paddingRight && result.paddingBottom && result.paddingLeft) {\n            const t = result.paddingTop;\n            const r = result.paddingRight;\n            const b = result.paddingBottom;\n            const l = result.paddingLeft;\n            if (t === r && r === b && b === l) {\n              result.padding = t;\n            } else if (t === b && r === l) {\n              result.padding = `${t} ${r}`;\n            } else {\n              result.padding = `${t} ${r} ${b} ${l}`;\n            }\n          }\n\n          return result;\n        });\n      }\n\n      const screenshot = await element.screenshot({ type: \"png\" });\n\n      return {\n        screenshot: bufferToBase64Url(screenshot),\n        computedStyles,\n      };\n  } finally {\n    await page.close();\n    pool.release(ctx);\n  }\n}\n\n/**\n * Load full segment data to get figma URL from segment or variant.\n * Uses BRAND.outFile to avoid SSR module loading issues with React CJS modules.\n */\nasync function loadFullSegmentForCompare(\n  _server: ViteDevServer,\n  _segmentFiles: Array<{ absolutePath: string; relativePath: string }>,\n  componentName: string,\n  variantName?: string,\n  configDir?: string\n): Promise<{ figmaUrl?: string } | null> {\n  const { join } = await import(\"node:path\");\n\n  // Try to read from outFile (avoids SSR issues with React CJS)\n  const segmentsJsonPath = join(configDir || process.cwd(), BRAND.outFile);\n\n  try {\n    const content = await readFile(segmentsJsonPath, \"utf-8\");\n    const data = JSON.parse(content) as {\n      segments: Record<\n        string,\n        {\n          meta: { name: string; figma?: string };\n          variants?: Array<{ name: string; figma?: string }>;\n        }\n      >;\n    };\n\n    const segment = data.segments[componentName];\n    if (!segment) {\n      return null;\n    }\n\n    // Priority: variant.figma > meta.figma\n    if (variantName && segment.variants) {\n      const variant = segment.variants.find((v) => v.name === variantName);\n      if (variant?.figma) {\n        return { figmaUrl: variant.figma };\n      }\n    }\n\n    // Fall back to meta.figma\n    if (segment.meta.figma) {\n      return { figmaUrl: segment.meta.figma };\n    }\n\n    return null;\n  } catch {\n    // outFile not found or invalid\n    console.warn(\n      `[${BRAND.name}] ${BRAND.outFile} not found, run '${BRAND.cliCommand} build' first`\n    );\n    return null;\n  }\n}\n\n/**\n * Compare two base64 images and return diff result.\n */\nasync function compareImages(\n  image1Base64: string,\n  image2Base64: string,\n  threshold: number\n): Promise<{\n  matches: boolean;\n  diffPercentage: number;\n  diffImage?: string;\n  changedRegions: Array<{\n    x: number;\n    y: number;\n    width: number;\n    height: number;\n  }>;\n}> {\n  const { DiffEngine, base64UrlToBuffer, bufferToBase64Url } = await import(\n    \"../service/index.js\"\n  );\n  const { PNG } = await import(\"pngjs\");\n\n  // Convert base64 to buffers\n  const buffer1 = base64UrlToBuffer(image1Base64);\n  const buffer2 = base64UrlToBuffer(image2Base64);\n\n  // Parse PNGs to get dimensions\n  const png1 = PNG.sync.read(buffer1);\n  const png2 = PNG.sync.read(buffer2);\n\n  // If dimensions don't match, resize the smaller one to match the larger\n  let finalBuffer1 = buffer1;\n  let finalBuffer2 = buffer2;\n\n  if (png1.width !== png2.width || png1.height !== png2.height) {\n    // Resize to the larger dimensions by padding the smaller image\n    const targetWidth = Math.max(png1.width, png2.width);\n    const targetHeight = Math.max(png1.height, png2.height);\n\n    if (png1.width !== targetWidth || png1.height !== targetHeight) {\n      finalBuffer1 = await resizePng(\n        buffer1,\n        png1.width,\n        png1.height,\n        targetWidth,\n        targetHeight\n      );\n    }\n    if (png2.width !== targetWidth || png2.height !== targetHeight) {\n      finalBuffer2 = await resizePng(\n        buffer2,\n        png2.width,\n        png2.height,\n        targetWidth,\n        targetHeight\n      );\n    }\n  }\n\n  // Create Screenshot-like objects for DiffEngine\n  const screenshot1 = {\n    data: finalBuffer1,\n    hash: \"\",\n    viewport: { width: png1.width, height: png1.height },\n    capturedAt: new Date(),\n    metadata: {\n      component: \"\",\n      variant: \"\",\n      theme: \"light\" as const,\n      renderTimeMs: 0,\n      captureTimeMs: 0,\n    },\n  };\n\n  const screenshot2 = {\n    data: finalBuffer2,\n    hash: \"\",\n    viewport: { width: png2.width, height: png2.height },\n    capturedAt: new Date(),\n    metadata: {\n      component: \"\",\n      variant: \"\",\n      theme: \"light\" as const,\n      renderTimeMs: 0,\n      captureTimeMs: 0,\n    },\n  };\n\n  const diffEngine = new DiffEngine(threshold);\n  const result = diffEngine.compare(screenshot1, screenshot2, { threshold });\n\n  return {\n    matches: result.matches,\n    diffPercentage: result.diffPercentage,\n    diffImage: result.diffImage\n      ? bufferToBase64Url(result.diffImage)\n      : undefined,\n    changedRegions: result.changedRegions,\n  };\n}\n\n/**\n * Resize a PNG by padding with transparent pixels to match target dimensions.\n */\nasync function resizePng(\n  buffer: Buffer,\n  srcWidth: number,\n  srcHeight: number,\n  targetWidth: number,\n  targetHeight: number\n): Promise<Buffer> {\n  const { PNG } = await import(\"pngjs\");\n\n  const srcPng = PNG.sync.read(buffer);\n  const dstPng = new PNG({\n    width: targetWidth,\n    height: targetHeight,\n    fill: true,\n  });\n\n  // Fill with transparent white\n  for (let y = 0; y < targetHeight; y++) {\n    for (let x = 0; x < targetWidth; x++) {\n      const idx = (y * targetWidth + x) * 4;\n      dstPng.data[idx] = 255; // R\n      dstPng.data[idx + 1] = 255; // G\n      dstPng.data[idx + 2] = 255; // B\n      dstPng.data[idx + 3] = 255; // A (opaque white background)\n    }\n  }\n\n  // Copy source image data\n  for (let y = 0; y < srcHeight; y++) {\n    for (let x = 0; x < srcWidth; x++) {\n      const srcIdx = (y * srcWidth + x) * 4;\n      const dstIdx = (y * targetWidth + x) * 4;\n      dstPng.data[dstIdx] = srcPng.data[srcIdx];\n      dstPng.data[dstIdx + 1] = srcPng.data[srcIdx + 1];\n      dstPng.data[dstIdx + 2] = srcPng.data[srcIdx + 2];\n      dstPng.data[dstIdx + 3] = srcPng.data[srcIdx + 3];\n    }\n  }\n\n  return PNG.sync.write(dstPng);\n}\n","/**\n * Render utilities for AI preview endpoint.\n * Generates code to render design system components in isolation.\n */\n\nexport interface RenderRequest {\n  /** Component name (e.g., \"Button\", \"Card\") */\n  component: string;\n  /** Props to pass to the component */\n  props?: Record<string, unknown>;\n  /** Viewport dimensions */\n  viewport?: {\n    width: number;\n    height: number;\n  };\n}\n\nexport interface SegmentInfo {\n  name: string;\n  path: string;\n}\n\n/**\n * Serialize a value to JavaScript code string.\n * Handles strings, numbers, booleans, null, undefined, arrays, and objects.\n */\nexport function serializeValue(value: unknown): string {\n  if (value === null) return \"null\";\n  if (value === undefined) return \"undefined\";\n  if (typeof value === \"string\") return JSON.stringify(value);\n  if (typeof value === \"number\") return String(value);\n  if (typeof value === \"boolean\") return String(value);\n  if (Array.isArray(value)) {\n    return `[${value.map(serializeValue).join(\", \")}]`;\n  }\n  if (typeof value === \"object\") {\n    const entries = Object.entries(value)\n      .map(([k, v]) => `${JSON.stringify(k)}: ${serializeValue(v)}`)\n      .join(\", \");\n    return `{${entries}}`;\n  }\n  // Functions and other types - skip\n  return \"undefined\";\n}\n\n/**\n * Serialize props object to JSX attribute string.\n * Example: { variant: \"primary\", disabled: true } -> variant=\"primary\" disabled={true}\n */\nexport function serializePropsToJsx(props: Record<string, unknown>): string {\n  return Object.entries(props)\n    .filter(([_, v]) => v !== undefined)\n    .map(([key, value]) => {\n      if (typeof value === \"string\") {\n        return `${key}=${JSON.stringify(value)}`;\n      }\n      return `${key}={${serializeValue(value)}}`;\n    })\n    .join(\" \");\n}\n\n/**\n * Find a segment by component name.\n * Returns the segment info if found, null otherwise.\n */\nexport function findSegmentByName(\n  componentName: string,\n  segments: Array<{ path: string; segment: { meta: { name: string } } }>\n): SegmentInfo | null {\n  const match = segments.find(\n    (s) => s.segment.meta.name.toLowerCase() === componentName.toLowerCase()\n  );\n\n  if (!match) return null;\n\n  return {\n    name: match.segment.meta.name,\n    path: match.path,\n  };\n}\n\n/**\n * Get list of available component names from loaded segments.\n */\nexport function getAvailableComponents(\n  segments: Array<{ segment: { meta: { name: string } } }>\n): string[] {\n  return segments.map((s) => s.segment.meta.name).sort();\n}\n\n/**\n * Generate the render script that will be injected into the template.\n * This script imports the component and renders it with the given props.\n */\nexport function generateRenderScript(\n  segmentPath: string,\n  componentName: string,\n  props: Record<string, unknown> = {}\n): string {\n  const propsJsx = serializePropsToJsx(props);\n  const propsString = propsJsx ? ` ${propsJsx}` : \"\";\n\n  // Handle children prop specially - render as content between tags\n  const hasChildren = \"children\" in props && props.children !== undefined;\n  const childrenContent = hasChildren ? String(props.children) : \"\";\n  const propsWithoutChildren = { ...props };\n  delete propsWithoutChildren.children;\n  const propsJsxNoChildren = serializePropsToJsx(propsWithoutChildren);\n  const propsStringNoChildren = propsJsxNoChildren ? ` ${propsJsxNoChildren}` : \"\";\n\n  return `\nimport React from \"react\";\nimport { createRoot } from \"react-dom/client\";\n\n// Import the segment to get the component\nasync function render() {\n  const root = document.getElementById(\"render-root\");\n\n  try {\n    // Dynamic import of the segment file\n    const segmentModule = await import(\"${segmentPath}\");\n    const segment = segmentModule.default;\n\n    if (!segment || !segment.component) {\n      throw new Error(\"Segment does not export a component\");\n    }\n\n    const Component = segment.component;\n\n    // Create React root and render\n    const reactRoot = createRoot(root);\n    ${\n      hasChildren\n        ? `reactRoot.render(React.createElement(Component, ${JSON.stringify(propsWithoutChildren)}, ${JSON.stringify(childrenContent)}));`\n        : `reactRoot.render(React.createElement(Component, ${JSON.stringify(props)}));`\n    }\n\n    // Signal that rendering is complete\n    // Wait a frame for React to flush\n    requestAnimationFrame(() => {\n      requestAnimationFrame(() => {\n        root.classList.add(\"ready\");\n        window.__RENDER_READY__ = true;\n      });\n    });\n  } catch (error) {\n    console.error(\"Render error:\", error);\n    root.innerHTML = \\`\n      <div class=\"render-error\">\n        <strong>Render Error</strong>\n        <pre>\\${error.message}</pre>\n      </div>\n    \\`;\n    root.classList.add(\"ready\");\n    window.__RENDER_READY__ = true;\n    window.__RENDER_ERROR__ = error.message;\n  }\n}\n\nrender();\n`;\n}\n\n/**\n * Generate a virtual module ID for a render request.\n * This creates a unique ID that Vite can resolve.\n */\nexport function generateRenderModuleId(componentName: string, requestId: string): string {\n  return `virtual:segments-render-${componentName}-${requestId}`;\n}\n","/**\n * Style comparison utilities for comparing Figma design properties\n * with rendered component computed styles.\n */\n\n/**\n * Style diff result for a single CSS property\n */\nexport interface StyleDiffItem {\n  /** CSS property name */\n  property: string;\n  /** Expected value from Figma */\n  figma: string;\n  /** Actual value from rendered component */\n  rendered: string;\n  /** Whether values match (within tolerance) */\n  match: boolean;\n}\n\n/**\n * Result of comparing styles\n */\nexport interface StyleComparisonResult {\n  /** Whether all styles match */\n  match: boolean;\n  /** Individual property comparisons */\n  properties: StyleDiffItem[];\n  /** CSS properties from Figma design */\n  figmaStyles: Record<string, string>;\n  /** Computed CSS properties from rendered component */\n  renderedStyles: Record<string, string>;\n}\n\n/**\n * Compare Figma CSS properties with rendered computed styles.\n */\nexport function compareStyles(\n  figmaStyles: Record<string, string | undefined>,\n  renderedStyles: Record<string, string>\n): StyleComparisonResult {\n  const properties: StyleDiffItem[] = [];\n  const cleanFigmaStyles: Record<string, string> = {};\n\n  // Properties to compare\n  const propsToCompare = [\n    \"backgroundColor\",\n    \"borderColor\",\n    \"borderWidth\",\n    \"borderRadius\",\n    \"fontFamily\",\n    \"fontSize\",\n    \"fontWeight\",\n    \"lineHeight\",\n    \"letterSpacing\",\n    \"textAlign\",\n    \"boxShadow\",\n    \"padding\",\n    \"gap\",\n    \"opacity\",\n  ];\n\n  for (const prop of propsToCompare) {\n    const figmaValue = figmaStyles[prop];\n    const renderedValue = renderedStyles[prop];\n\n    if (figmaValue !== undefined) {\n      cleanFigmaStyles[prop] = figmaValue;\n\n      const match = compareStyleValue(prop, figmaValue, renderedValue || \"\");\n      properties.push({\n        property: prop,\n        figma: figmaValue,\n        rendered: renderedValue || \"(not set)\",\n        match,\n      });\n    }\n  }\n\n  const allMatch = properties.every((p) => p.match);\n\n  return {\n    match: allMatch,\n    properties,\n    figmaStyles: cleanFigmaStyles,\n    renderedStyles,\n  };\n}\n\n/**\n * Compare a single style value with tolerance for color and numeric differences.\n */\nexport function compareStyleValue(\n  prop: string,\n  figma: string,\n  rendered: string\n): boolean {\n  // Normalize values for comparison\n  const normalizedFigma = normalizeStyleValue(prop, figma);\n  const normalizedRendered = normalizeStyleValue(prop, rendered);\n\n  // Direct match\n  if (normalizedFigma === normalizedRendered) {\n    return true;\n  }\n\n  // Color comparison with tolerance\n  if (prop === \"backgroundColor\" || prop === \"borderColor\") {\n    return compareColors(normalizedFigma, normalizedRendered, 5);\n  }\n\n  // Numeric comparison with tolerance (for pixels)\n  if (\n    [\"borderWidth\", \"borderRadius\", \"fontSize\", \"padding\", \"gap\"].includes(prop)\n  ) {\n    return compareNumericValues(normalizedFigma, normalizedRendered, 1);\n  }\n\n  return false;\n}\n\n/**\n * Normalize a style value for comparison.\n */\nexport function normalizeStyleValue(prop: string, value: string): string {\n  // Remove extra whitespace\n  let normalized = value.trim().replace(/\\s+/g, \" \");\n\n  // Normalize \"none\" shadow to empty\n  if (prop === \"boxShadow\" && normalized === \"none\") {\n    normalized = \"\";\n  }\n\n  // Normalize rgba(0, 0, 0, 0) to \"transparent\"\n  if (normalized.match(/rgba\\(\\s*0\\s*,\\s*0\\s*,\\s*0\\s*,\\s*0\\s*\\)/)) {\n    normalized = \"transparent\";\n  }\n\n  return normalized;\n}\n\n/**\n * Compare two color values with tolerance.\n */\nexport function compareColors(\n  color1: string,\n  color2: string,\n  tolerance: number\n): boolean {\n  const rgb1 = parseColor(color1);\n  const rgb2 = parseColor(color2);\n\n  if (!rgb1 || !rgb2) {\n    return color1 === color2;\n  }\n\n  return (\n    Math.abs(rgb1.r - rgb2.r) <= tolerance &&\n    Math.abs(rgb1.g - rgb2.g) <= tolerance &&\n    Math.abs(rgb1.b - rgb2.b) <= tolerance &&\n    Math.abs((rgb1.a ?? 1) - (rgb2.a ?? 1)) <= 0.05\n  );\n}\n\n/**\n * Parse a color string to RGB values.\n */\nexport function parseColor(\n  color: string\n): { r: number; g: number; b: number; a?: number } | null {\n  // Handle hex colors\n  const hexMatch = color.match(/^#([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2})$/i);\n  if (hexMatch) {\n    return {\n      r: parseInt(hexMatch[1], 16),\n      g: parseInt(hexMatch[2], 16),\n      b: parseInt(hexMatch[3], 16),\n    };\n  }\n\n  // Handle rgb/rgba\n  const rgbaMatch = color.match(\n    /rgba?\\(\\s*(\\d+)\\s*,\\s*(\\d+)\\s*,\\s*(\\d+)\\s*(?:,\\s*([\\d.]+))?\\s*\\)/\n  );\n  if (rgbaMatch) {\n    return {\n      r: parseInt(rgbaMatch[1], 10),\n      g: parseInt(rgbaMatch[2], 10),\n      b: parseInt(rgbaMatch[3], 10),\n      a: rgbaMatch[4] ? parseFloat(rgbaMatch[4]) : 1,\n    };\n  }\n\n  return null;\n}\n\n/**\n * Compare numeric values (e.g., \"10px\" vs \"11px\") with tolerance.\n */\nexport function compareNumericValues(\n  value1: string,\n  value2: string,\n  tolerance: number\n): boolean {\n  const num1 = parseFloat(value1);\n  const num2 = parseFloat(value2);\n\n  if (isNaN(num1) || isNaN(num2)) {\n    return value1 === value2;\n  }\n\n  return Math.abs(num1 - num2) <= tolerance;\n}\n\n// ----- Enhanced Token-Aware Style Comparison -----\n\nimport type {\n  EnhancedStyleDiffItem,\n  TokenFix,\n  TokenUsageSummary,\n  DesignToken,\n} from \"../core/index.js\";\n\n/**\n * Enhanced style diff result with token information\n */\nexport interface EnhancedStyleComparisonResult extends StyleComparisonResult {\n  /** Individual property comparisons with token info */\n  properties: EnhancedStyleDiffItem[];\n  /** Token usage summary */\n  tokenSummary?: TokenUsageSummary;\n}\n\n/**\n * Token registry interface for style comparison\n * (subset of TokenRegistryManager methods needed here)\n */\nexport interface TokenLookup {\n  findByValue(value: string, theme?: string): string[];\n  getToken(name: string): DesignToken | undefined;\n  calculateUsageSummary(\n    styleDiffs: Array<{\n      property: string;\n      figma: string;\n      rendered: string;\n      match: boolean;\n    }>,\n    theme?: string\n  ): TokenUsageSummary;\n}\n\n/**\n * Compare styles with token awareness.\n *\n * This enhanced version:\n * 1. Performs normal style comparison\n * 2. Identifies which values match design tokens\n * 3. Flags hardcoded values that should use tokens\n * 4. Generates fix suggestions\n */\nexport function compareStylesWithTokens(\n  figmaStyles: Record<string, string | undefined>,\n  renderedStyles: Record<string, string>,\n  tokenLookup?: TokenLookup,\n  theme = \"default\"\n): EnhancedStyleComparisonResult {\n  const properties: EnhancedStyleDiffItem[] = [];\n  const cleanFigmaStyles: Record<string, string> = {};\n\n  // Properties to compare\n  const propsToCompare = [\n    \"backgroundColor\",\n    \"borderColor\",\n    \"borderWidth\",\n    \"borderRadius\",\n    \"fontFamily\",\n    \"fontSize\",\n    \"fontWeight\",\n    \"lineHeight\",\n    \"letterSpacing\",\n    \"textAlign\",\n    \"boxShadow\",\n    \"padding\",\n    \"gap\",\n    \"opacity\",\n    \"color\",\n  ];\n\n  for (const prop of propsToCompare) {\n    const figmaValue = figmaStyles[prop];\n    const renderedValue = renderedStyles[prop];\n\n    if (figmaValue !== undefined) {\n      cleanFigmaStyles[prop] = figmaValue;\n\n      const match = compareStyleValue(prop, figmaValue, renderedValue || \"\");\n\n      // Build enhanced diff item\n      const item: EnhancedStyleDiffItem = {\n        property: prop,\n        figma: figmaValue,\n        rendered: renderedValue || \"(not set)\",\n        match,\n        isHardcoded: false,\n      };\n\n      // Add token information if registry is available\n      if (tokenLookup) {\n        const figmaTokens = tokenLookup.findByValue(figmaValue, theme);\n        const renderedTokens = renderedValue\n          ? tokenLookup.findByValue(renderedValue, theme)\n          : [];\n\n        if (figmaTokens.length > 0) {\n          item.figmaToken = figmaTokens[0];\n        }\n\n        if (renderedTokens.length > 0) {\n          item.renderedToken = renderedTokens[0];\n        }\n\n        // Determine if this is a hardcoded value\n        // Hardcoded = Figma matches a token, but rendered doesn't use a token\n        item.isHardcoded = !!item.figmaToken && !item.renderedToken;\n\n        // Generate fix suggestion if hardcoded\n        if (item.isHardcoded && item.figmaToken) {\n          const token = tokenLookup.getToken(item.figmaToken);\n          if (token) {\n            const cssProperty = toCssProperty(prop);\n            item.suggestedFix = {\n              tokenName: item.figmaToken,\n              tokenValue: token.resolvedValue,\n              codeFix: `${cssProperty}: var(${item.figmaToken});`,\n              confidence: 0.9,\n              reason: `Figma uses token ${item.figmaToken} (${token.resolvedValue}). Replace hardcoded value with token for consistency.`,\n            };\n          }\n        }\n      }\n\n      properties.push(item);\n    }\n  }\n\n  const allMatch = properties.every((p) => p.match);\n\n  // Calculate token summary if registry available\n  let tokenSummary: TokenUsageSummary | undefined;\n  if (tokenLookup) {\n    tokenSummary = tokenLookup.calculateUsageSummary(\n      properties.map((p) => ({\n        property: p.property,\n        figma: p.figma,\n        rendered: p.rendered,\n        match: p.match,\n      })),\n      theme\n    );\n  }\n\n  return {\n    match: allMatch,\n    properties,\n    figmaStyles: cleanFigmaStyles,\n    renderedStyles,\n    tokenSummary,\n  };\n}\n\n/**\n * Convert camelCase to kebab-case CSS property\n */\nfunction toCssProperty(prop: string): string {\n  return prop.replace(/([A-Z])/g, \"-$1\").toLowerCase();\n}\n\n/**\n * Format token summary for display\n */\nexport function formatTokenSummary(summary: TokenUsageSummary): string {\n  const lines: string[] = [];\n\n  lines.push(`Token Compliance: ${summary.compliancePercent}%`);\n  lines.push(\n    `${summary.usingTokens}/${summary.totalProperties} properties using tokens`\n  );\n\n  if (summary.hardcoded > 0) {\n    lines.push(`${summary.hardcoded} hardcoded value(s) detected`);\n  }\n\n  if (summary.implicitMatches > 0) {\n    lines.push(`${summary.implicitMatches} implicit match(es)`);\n  }\n\n  return lines.join(\"\\n\");\n}\n\n/**\n * Get status badge for token compliance\n */\nexport function getComplianceBadge(\n  compliancePercent: number\n): { label: string; color: string } {\n  if (compliancePercent >= 100) {\n    return { label: \"Excellent\", color: \"green\" };\n  } else if (compliancePercent >= 80) {\n    return { label: \"Good\", color: \"blue\" };\n  } else if (compliancePercent >= 50) {\n    return { label: \"Fair\", color: \"yellow\" };\n  } else {\n    return { label: \"Poor\", color: \"red\" };\n  }\n}\n"],"mappings":"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","names":["resolve","dirname","fileURLToPath","config","join","BRAND","server","viewerRoot","resolve","result","__dirname","dirname","fileURLToPath","resolve","dirname"]}

package/package.json

@@ -1,7 +1,11 @@
 {
   "name": "@fragments-sdk/cli",
-  "version": "0.5.2",
+  "version": "0.7.0",
   "description": "CLI, MCP server, and dev tools for Fragments design system",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/ConanMcN/fragments"
+  },
   "type": "module",
   "bin": {
     "fragments": "./dist/bin.js",
@@ -41,10 +45,8 @@
     "@storybook/csf": "^0.1.12",
     "@tanstack/react-virtual": "^3.13.18",
     "@vitejs/plugin-react": "^4.3.0",
-    "autoprefixer": "^10.4.20",
     "axe-core": "^4.11.1",
     "chokidar": "^4.0.3",
-    "clsx": "^2.1.1",
     "commander": "^12.1.0",
     "esbuild": "^0.24.0",
     "fast-glob": "^3.3.3",
@@ -60,11 +62,10 @@
     "react-hook-form": "^7.71.0",
     "react-live": "^4.1.6",
     "shiki": "^3.21.0",
-    "tailwindcss": "^3.4.17",
     "vite": "^6.0.0",
     "vite-plugin-svgr": "^4.5.0",
     "zod": "^3.24.1",
-    "@fragments-sdk/context": "0.2.0"
+    "@fragments-sdk/context": "0.3.0"
   },
   "devDependencies": {
     "@types/babel__generator": "^7.6.8",

package/src/bin.ts

@@ -35,6 +35,7 @@ import { add } from './commands/add.js';
 import { linkFigma, linkStorybook } from './commands/link/index.js';
 import { enhance } from './commands/enhance.js';
 import { scan } from './commands/scan.js';
+import { graph } from './commands/graph.js';
 
 // Import existing commands that were already extracted
 import { runScreenshotCommand } from './screenshot.js';
@@ -501,6 +502,10 @@ program
   .option('--ci', 'CI mode (exit code 1 if any critical/serious violations)')
   .option('--component <name>', 'Check specific component only')
   .option('-p, --port <port>', 'Dev server port', '6006')
+  .option('--format <format>', 'Output format (table, json, github)', 'table')
+  .option('--standard <level>', 'WCAG level (AA or AAA)', 'AA')
+  .option('--report', 'Generate standalone HTML compliance report')
+  .option('-o, --output <path>', 'Output path for report', 'a11y-report.html')
   .action(async (options) => {
     try {
       await a11y({
@@ -509,6 +514,10 @@ program
         ci: options.ci,
         component: options.component,
         port: options.port,
+        format: options.format,
+        standard: options.standard,
+        report: options.report,
+        output: options.output,
       });
     } catch (error) {
       if (options.json) {
@@ -836,6 +845,28 @@ program
     }
   });
 
+// ============================================================================
+// GRAPH COMMAND
+// ============================================================================
+program
+  .command('graph')
+  .description('Query the component relationship graph')
+  .argument('[component]', 'Component name (optional)')
+  .option('-c, --config <path>', 'Path to config file')
+  .option('-m, --mode <mode>', 'Query mode: health, dependencies, dependents, impact, path, composition, alternatives, islands')
+  .option('-t, --target <component>', 'Target component for path mode')
+  .option('--edge-types <types>', 'Comma-separated edge types to filter by')
+  .option('--depth <number>', 'Max traversal depth for impact mode', parseInt)
+  .option('--format <format>', 'Output format: table, json, dot', 'table')
+  .action(async (component, options) => {
+    try {
+      await graph(component, options);
+    } catch (error) {
+      console.error(pc.red('Error:'), error instanceof Error ? error.message : error);
+      process.exit(1);
+    }
+  });
+
 // ============================================================================
 // TEST COMMAND
 // ============================================================================

package/src/build.ts

@@ -19,6 +19,57 @@ import {
   generateRegistry,
   generateContextMd,
 } from "./core/node.js";
+import {
+  extractCustomPropsFromComponentFile,
+  resolveComponentSourcePath,
+  type AutoDetectedPropDefinition,
+} from "./core/auto-props.js";
+import { buildComponentGraph } from "./core/graph-extractor.js";
+import { serializeGraph } from "@fragments-sdk/context/graph";
+
+type CompiledProp = CompiledSegment["props"][string];
+
+function normalizeParsedProps(
+  parsedProps: Record<string, Partial<CompiledProp>>
+): Record<string, CompiledProp> {
+  return Object.fromEntries(
+    Object.entries(parsedProps).map(([name, prop]) => [
+      name,
+      {
+        type: prop.type ?? "custom",
+        description: prop.description ?? "",
+        default: prop.default,
+        required: prop.required,
+        values: prop.values,
+        constraints: prop.constraints,
+      },
+    ])
+  );
+}
+
+function mergeDocumentedAndAutoProps(
+  documentedProps: Record<string, CompiledProp>,
+  autoProps: Record<string, AutoDetectedPropDefinition>
+): Record<string, CompiledProp> {
+  return Object.fromEntries(
+    Object.keys(autoProps).map((name) => {
+      const documented = documentedProps[name];
+      const auto = autoProps[name];
+
+      return [
+        name,
+        {
+          type: auto.type,
+          description: documented?.description ?? auto.description ?? "",
+          default: auto.default !== undefined ? auto.default : documented?.default,
+          required: auto.required,
+          values: auto.values ?? documented?.values,
+          constraints: documented?.constraints,
+        },
+      ];
+    })
+  );
+}
 
 export interface BuildResult {
   success: boolean;
@@ -65,6 +116,60 @@ export async function buildSegments(
         continue;
       }
 
+      const documentedProps = normalizeParsedProps(parsed.props);
+      let mergedProps = documentedProps;
+
+      const componentExportName = parsed.componentName ?? parsed.meta.name;
+      const componentSourcePath = resolveComponentSourcePath(
+        file.absolutePath,
+        parsed.componentImport
+      );
+
+      if (componentExportName && componentSourcePath) {
+        const autoPropsResult = extractCustomPropsFromComponentFile(
+          componentSourcePath,
+          componentExportName
+        );
+
+        for (const warning of autoPropsResult.warnings) {
+          warnings.push({ file: file.relativePath, warning });
+        }
+
+        const hasAutoProps = Object.keys(autoPropsResult.props).length > 0;
+        if (autoPropsResult.resolved && hasAutoProps) {
+          const removedDocumentedProps = Object.keys(documentedProps).filter(
+            (propName) => !(propName in autoPropsResult.props)
+          );
+
+          if (removedDocumentedProps.length > 0) {
+            warnings.push({
+              file: file.relativePath,
+              warning: `Removed ${removedDocumentedProps.length} documented props not present in source API: ${removedDocumentedProps.join(", ")}`,
+            });
+          }
+
+          mergedProps = mergeDocumentedAndAutoProps(
+            documentedProps,
+            autoPropsResult.props
+          );
+        } else if (autoPropsResult.resolved && !hasAutoProps && Object.keys(documentedProps).length > 0) {
+          warnings.push({
+            file: file.relativePath,
+            warning: "Auto-props extraction returned no custom props; falling back to documented props",
+          });
+        }
+      } else if (!componentExportName) {
+        warnings.push({
+          file: file.relativePath,
+          warning: "Unable to resolve component export name for auto-props extraction",
+        });
+      } else if (!componentSourcePath) {
+        warnings.push({
+          file: file.relativePath,
+          warning: `Unable to resolve component source path from import: ${parsed.componentImport ?? "unknown"}`,
+        });
+      }
+
       // Build compiled fragment from parsed metadata
       const compiled: CompiledSegment = {
         filePath: file.relativePath,
@@ -83,19 +188,7 @@ export async function buildSegments(
           guidelines: parsed.usage.guidelines,
           accessibility: parsed.usage.accessibility,
         },
-        props: Object.fromEntries(
-          Object.entries(parsed.props).map(([name, prop]) => [
-            name,
-            {
-              type: prop.type ?? "custom",
-              description: prop.description ?? "",
-              default: prop.default,
-              required: prop.required,
-              values: prop.values,
-              constraints: prop.constraints,
-            },
-          ])
-        ),
+        props: mergedProps,
         relations: parsed.relations.map((rel) => ({
           component: rel.component,
           relationship: rel.relationship as
@@ -204,6 +297,46 @@ export async function buildSegments(
     }
   }
 
+  // Build component graph for AI structural queries
+  // Derive component directory from configDir (typically src/components/)
+  const componentDir = resolve(configDir, "src", "components");
+  let graphData: ReturnType<typeof serializeGraph> | undefined;
+  try {
+    const graphResult = await buildComponentGraph(segments, blocks, componentDir);
+
+    // Auto-enrich segments with detected metadata
+    for (const [name, segment] of Object.entries(segments)) {
+      const detected = graphResult.autoDetected.get(name);
+      if (!detected) continue;
+
+      if (!segment.ai) segment.ai = {};
+      if (!segment.ai.subComponents && detected.subComponents) {
+        segment.ai.subComponents = detected.subComponents;
+      }
+      if (!segment.ai.compositionPattern && detected.compositionPattern) {
+        segment.ai.compositionPattern = detected.compositionPattern;
+      }
+      if (!segment.ai.commonPatterns && detected.commonPatterns) {
+        segment.ai.commonPatterns = detected.commonPatterns;
+      }
+      if (!segment.ai.requiredChildren && detected.requiredChildren) {
+        segment.ai.requiredChildren = detected.requiredChildren;
+      }
+    }
+
+    // Report drift warnings
+    for (const w of graphResult.warnings) {
+      warnings.push({ file: "graph", warning: w });
+    }
+
+    graphData = serializeGraph(graphResult.graph);
+  } catch (error) {
+    warnings.push({
+      file: "graph",
+      warning: `Graph extraction failed: ${error instanceof Error ? error.message : String(error)}`,
+    });
+  }
+
   const output: CompiledSegmentsFile = {
     version: "1.0.0",
     generatedAt: new Date().toISOString(),
@@ -211,6 +344,7 @@ export async function buildSegments(
     segments,
     ...(Object.keys(blocks).length > 0 && { blocks }),
     ...(tokens && { tokens }),
+    ...(graphData && { graph: graphData }),
   };
 
   const outputPath = resolve(configDir, config.outFile ?? BRAND.outFile);