@idealyst/tooling 1.2.3

package/src/vite-plugin.ts

@@ -0,0 +1,264 @@
+/**
+ * Idealyst Docs Vite Plugin
+ *
+ * Generates a component registry at build time by analyzing TypeScript source.
+ * Replaces placeholder exports from @idealyst/tooling with actual generated values.
+ *
+ * Usage:
+ * ```ts
+ * // vite.config.ts
+ * import { idealystDocsPlugin } from '@idealyst/tooling/vite';
+ *
+ * export default defineConfig({
+ *   plugins: [
+ *     idealystDocsPlugin({
+ *       componentPaths: ['../../packages/components/src'],
+ *       themePath: '../../packages/theme/src/lightTheme.ts',
+ *     }),
+ *   ],
+ * });
+ * ```
+ *
+ * Then in your app (no virtual module setup needed!):
+ * ```ts
+ * import { componentRegistry, componentNames, getComponentsByCategory } from '@idealyst/tooling';
+ * ```
+ */
+
+import type { Plugin, ViteDevServer } from 'vite';
+import * as fs from 'fs';
+import * as path from 'path';
+import { analyzeComponents } from './analyzer';
+import type { IdealystDocsPluginOptions, ComponentRegistry } from './analyzer/types';
+
+// Virtual module for backwards compatibility
+const VIRTUAL_MODULE_ID = 'virtual:idealyst-docs';
+const RESOLVED_VIRTUAL_MODULE_ID = '\0' + VIRTUAL_MODULE_ID;
+
+// Marker for the tooling package that needs transformation
+const TOOLING_REGISTRY_MARKER = '@idealyst/tooling';
+
+/**
+ * Create the Idealyst Docs Vite plugin.
+ */
+export function idealystDocsPlugin(options: IdealystDocsPluginOptions): Plugin {
+  let registry: ComponentRegistry | null = null;
+  let server: ViteDevServer | null = null;
+
+  const { debug = false, output = 'virtual', outputPath } = options;
+
+  const log = (...args: any[]) => {
+    if (debug) console.log('[idealyst-docs]', ...args);
+  };
+
+  /**
+   * Generate the registry by analyzing components.
+   */
+  function generateRegistry(): ComponentRegistry {
+    log('Generating component registry...');
+
+    try {
+      registry = analyzeComponents(options);
+      log(`Generated registry with ${Object.keys(registry).length} components`);
+
+      // Optionally write to file
+      if (output === 'file' && outputPath) {
+        const outputDir = path.dirname(outputPath);
+        if (!fs.existsSync(outputDir)) {
+          fs.mkdirSync(outputDir, { recursive: true });
+        }
+        fs.writeFileSync(
+          outputPath,
+          `// Auto-generated by @idealyst/tooling - DO NOT EDIT\n` +
+          `export const componentRegistry = ${JSON.stringify(registry, null, 2)} as const;\n`
+        );
+        log(`Wrote registry to ${outputPath}`);
+      }
+
+      return registry;
+    } catch (error) {
+      console.error('[idealyst-docs] Error generating registry:', error);
+      return {};
+    }
+  }
+
+  /**
+   * Generate the virtual module code.
+   */
+  function generateModuleCode(): string {
+    if (!registry) {
+      registry = generateRegistry();
+    }
+
+    return `
+// Auto-generated by @idealyst/tooling
+// This module provides component metadata extracted from TypeScript source
+
+export const componentRegistry = ${JSON.stringify(registry, null, 2)};
+
+// Helper to get component names
+export const componentNames = Object.keys(componentRegistry);
+
+// Helper to get components by category
+export function getComponentsByCategory(category) {
+  return Object.entries(componentRegistry)
+    .filter(([_, def]) => def.category === category)
+    .map(([name]) => name);
+}
+
+// Helper to get prop config for playground
+export function getPropConfig(componentName) {
+  const def = componentRegistry[componentName];
+  if (!def) return {};
+
+  return Object.entries(def.props).reduce((acc, [key, prop]) => {
+    if (prop.values && prop.values.length > 0) {
+      acc[key] = { type: 'select', options: prop.values, default: prop.default };
+    } else if (prop.type === 'boolean') {
+      acc[key] = { type: 'boolean', default: prop.default ?? false };
+    } else if (prop.type === 'string') {
+      acc[key] = { type: 'text', default: prop.default ?? '' };
+    } else if (prop.type === 'number') {
+      acc[key] = { type: 'number', default: prop.default ?? 0 };
+    }
+    return acc;
+  }, {});
+}
+`;
+  }
+
+  return {
+    name: 'idealyst-docs',
+
+    configureServer(_server) {
+      server = _server;
+    },
+
+    resolveId(id) {
+      if (id === VIRTUAL_MODULE_ID) {
+        return RESOLVED_VIRTUAL_MODULE_ID;
+      }
+    },
+
+    load(id) {
+      if (id === RESOLVED_VIRTUAL_MODULE_ID) {
+        return generateModuleCode();
+      }
+    },
+
+    // Transform @idealyst/tooling to inject the actual registry
+    transform(code, id) {
+      // Check if this is the tooling package's index file
+      const isToolingIndex = id.includes('@idealyst/tooling') && id.endsWith('index.ts');
+      const isToolingSrc = id.includes('/packages/tooling/src/index.ts');
+
+      if (isToolingIndex || isToolingSrc) {
+        log(`Transforming tooling index: ${id}`);
+
+        if (!registry) {
+          registry = generateRegistry();
+        }
+
+        // Replace the placeholder exports with actual values
+        let transformed = code;
+
+        // Replace: export const componentRegistry: ComponentRegistry = {};
+        transformed = transformed.replace(
+          /export const componentRegistry:\s*ComponentRegistry\s*=\s*\{\};?/,
+          `export const componentRegistry = ${JSON.stringify(registry, null, 2)};`
+        );
+
+        // Replace: export const componentNames: string[] = [];
+        transformed = transformed.replace(
+          /export const componentNames:\s*string\[\]\s*=\s*\[\];?/,
+          `export const componentNames = ${JSON.stringify(Object.keys(registry))};`
+        );
+
+        // Replace getComponentsByCategory with actual implementation that uses the real registry
+        transformed = transformed.replace(
+          /export function getComponentsByCategory\(category: string\): string\[\] \{[\s\S]*?^\}/m,
+          `export function getComponentsByCategory(category) {
+  return Object.entries(componentRegistry)
+    .filter(([_, def]) => def.category === category)
+    .map(([name]) => name);
+}`
+        );
+
+        // Replace getPropConfig with actual implementation
+        transformed = transformed.replace(
+          /export function getPropConfig\(componentName: string\): Record<string, any> \{[\s\S]*?^\}/m,
+          `export function getPropConfig(componentName) {
+  const def = componentRegistry[componentName];
+  if (!def) return {};
+  return Object.entries(def.props).reduce((acc, [key, prop]) => {
+    if (prop.values && prop.values.length > 0) {
+      acc[key] = { type: 'select', options: prop.values, default: prop.default };
+    } else if (prop.type === 'boolean') {
+      acc[key] = { type: 'boolean', default: prop.default ?? false };
+    } else if (prop.type === 'string') {
+      acc[key] = { type: 'text', default: prop.default ?? '' };
+    } else if (prop.type === 'number') {
+      acc[key] = { type: 'number', default: prop.default ?? 0 };
+    }
+    return acc;
+  }, {});
+}`
+        );
+
+        return {
+          code: transformed,
+          map: null,
+        };
+      }
+
+      return null;
+    },
+
+    // Regenerate on component file changes
+    handleHotUpdate({ file, server }) {
+      // Check if the changed file is a component file
+      const isComponentFile =
+        options.componentPaths.some(p => file.includes(path.resolve(p))) &&
+        (file.endsWith('.ts') || file.endsWith('.tsx'));
+
+      // Check if the changed file is the theme file
+      const isThemeFile = file.includes(path.resolve(options.themePath));
+
+      if (isComponentFile || isThemeFile) {
+        log(`File changed: ${file}, regenerating registry...`);
+
+        // Clear cached registry
+        registry = null;
+
+        // Invalidate the virtual module (for backwards compatibility)
+        const mod = server.moduleGraph.getModuleById(RESOLVED_VIRTUAL_MODULE_ID);
+        if (mod) {
+          server.moduleGraph.invalidateModule(mod);
+        }
+
+        // Also invalidate the tooling module if it's loaded
+        const toolingMods = Array.from(server.moduleGraph.idToModuleMap.values())
+          .filter(m => m.id && (m.id.includes('@idealyst/tooling') || m.id.includes('/packages/tooling/src/index')));
+
+        const modsToInvalidate = mod ? [mod, ...toolingMods] : toolingMods;
+        modsToInvalidate.forEach(m => server.moduleGraph.invalidateModule(m));
+
+        if (modsToInvalidate.length > 0) {
+          return modsToInvalidate;
+        }
+      }
+    },
+
+    // Generate on build
+    buildStart() {
+      registry = generateRegistry();
+    },
+  };
+}
+
+/**
+ * Standalone function to generate registry (for MCP server or CLI).
+ */
+export function generateComponentRegistry(options: IdealystDocsPluginOptions): ComponentRegistry {
+  return analyzeComponents(options);
+}