@vuer-ai/vuer-uikit 0.0.98 → 0.0.100

package/src/cli/dial-cli.ts

@@ -1,1133 +0,0 @@
-import { existsSync, mkdirSync, readFileSync, writeFileSync } from "node:fs";
-import { basename, dirname, join, resolve } from "node:path";
-import { parseArgs } from "node:util";
-import { fileURLToPath } from "node:url";
-import { execSync } from "node:child_process";
-import * as docgen from "react-docgen-typescript";
-import * as ts from "typescript";
-
-// Get package version and git hash
-function getVersionInfo(): { version: string; gitHash?: string } {
-  try {
-    // Get the directory of this CLI file
-    const __filename = fileURLToPath(import.meta.url);
-    const __dirname = dirname(__filename);
-    
-    // Try multiple possible locations for package.json
-    // When built, the CLI is in ./cli/dial-cli.js, so package.json is at ../package.json
-    // When running from source, it's in ./src/cli/, so package.json is at ../../package.json
-    const possiblePaths = [
-      resolve(__dirname, '../package.json'),  // Built version: cli/dial-cli.js -> package.json
-      resolve(__dirname, '../../package.json'), // Source version: src/cli/dial-cli.ts -> package.json
-    ];
-    
-    let packageJson: any = null;
-    for (const path of possiblePaths) {
-      try {
-        if (existsSync(path)) {
-          packageJson = JSON.parse(readFileSync(path, 'utf-8'));
-          break;
-        }
-      } catch {
-        // Continue to next path
-      }
-    }
-    
-    const version = packageJson?.version || 'unknown';
-    
-    // Try to get git hash
-    let gitHash: string | undefined;
-    try {
-      gitHash = execSync('git rev-parse --short HEAD', { encoding: 'utf-8', cwd: dirname(__dirname) }).trim();
-    } catch {
-      // Git not available or not a git repo
-      gitHash = undefined;
-    }
-    
-    return { version, gitHash };
-  } catch (error) {
-    // Fallback if we can't read package.json
-    return { version: 'unknown' };
-  }
-}
-
-interface DialTag {
-  grouping?: string;
-  min?: number;
-  max?: number;
-  step?: number;
-  options?: unknown;
-  icon?: string;
-  placeholders?: string[];
-  tooltips?: string[];
-  dtypes?: string[];
-  mins?: number[];
-  maxs?: number[];
-  steps?: number[];
-  column?: boolean;
-  rowCount?: number;
-  colCount?: number;
-  labelPosition?: string;
-  dtype?: string;
-  type?: string;
-  default?: unknown;
-  noWrap?: boolean;
-}
-
-interface ElementData {
-  index: number;
-  raw: string;
-  name?: string;
-  type?: string;
-  comment?: string;
-  min?: number;
-  max?: number;
-  step?: number;
-  dtype?: string;
-  dialTags?: DialTag;
-}
-
-interface TypeDefinition {
-  name: string;
-  kind: string;
-  raw: string;
-  dialTags?: DialTag;
-  jsDoc?: string;
-  type?: string;
-  elements?: ElementData[];
-  elementType?: string;
-  typeNode?: string;
-}
-
-interface PropertySchema {
-  name: string;
-  dtype: string;
-  min?: number;
-  max?: number;
-  step?: number;
-  icon?: string;
-  value?: unknown;
-  options?: unknown;
-  placeholders?: string[];
-  tooltips?: string[];
-  dtypes?: string[];
-  mins?: number[];
-  maxs?: number[];
-  steps?: number[];
-  tags?: Record<string, unknown>;
-  typeDefinition?: TypeDefinition;
-}
-
-// Parse type alias definition from TypeScript source
-function parseTypeAlias(sourceFile: ts.SourceFile, typeName: string): TypeDefinition | null {
-  let typeDefinition: TypeDefinition | null = null;
-
-  function visit(node: ts.Node): void {
-    if (ts.isTypeAliasDeclaration(node) && node.name.text === typeName) {
-      typeDefinition = {
-        name: typeName,
-        kind: "typeAlias",
-        raw: node.getFullText().trim(),
-      };
-
-      // Parse JSDoc comments for the type alias
-      const fullText = node.getFullText();
-      const jsDocMatch = fullText.match(/\/\*\*([\s\S]*?)\*\//);
-      if (jsDocMatch) {
-        const jsDocContent = jsDocMatch[1];
-        typeDefinition.dialTags = parseDialTags(jsDocContent);
-        typeDefinition.jsDoc = jsDocContent.trim();
-      }
-
-      if (ts.isTupleTypeNode(node.type)) {
-        typeDefinition.type = "tuple";
-        typeDefinition.elements = [];
-
-        node.type.elements.forEach((element, index) => {
-          const elementData: ElementData = {
-            index,
-            raw: element.getFullText().trim(),
-          };
-
-          if (ts.isNamedTupleMember(element)) {
-            elementData.name = element.name?.getText();
-            elementData.type = element.type?.getText();
-
-            // Extract inline comment with @dial annotations
-            const sourceText = element.getFullText();
-            const commentMatch = sourceText.match(/\/\/(.+)/);
-            if (commentMatch) {
-              elementData.comment = commentMatch[1].trim();
-
-              // Parse @dial annotations from the comment
-              const dialTags: DialTag = {};
-
-              // Parse @dial-min
-              const minMatch = commentMatch[1].match(/@dial-min\s+([\d.]+)/);
-              if (minMatch) {
-                dialTags.min = parseFloat(minMatch[1]);
-                elementData.min = dialTags.min;
-              }
-
-              // Parse @dial-max
-              const maxMatch = commentMatch[1].match(/@dial-max\s+([\d.]+)/);
-              if (maxMatch) {
-                dialTags.max = parseFloat(maxMatch[1]);
-                elementData.max = dialTags.max;
-              }
-
-              // Parse @dial-step
-              const stepMatch = commentMatch[1].match(/@dial-step\s+([\d.]+)/);
-              if (stepMatch) {
-                dialTags.step = parseFloat(stepMatch[1]);
-                elementData.step = dialTags.step;
-              }
-
-              // Parse @dial-dtype
-              const dtypeMatch = commentMatch[1].match(/@dial-dtype\s+(\w+)/);
-              if (dtypeMatch) {
-                dialTags.dtype = dtypeMatch[1];
-                elementData.dtype = dtypeMatch[1];
-              } else {
-                elementData.dtype = "number";
-              }
-
-              elementData.dialTags = dialTags;
-            }
-          }
-
-          typeDefinition.elements!.push(elementData);
-        });
-      } else if (ts.isArrayTypeNode(node.type)) {
-        typeDefinition!.type = "array";
-        typeDefinition!.elementType = node.type.elementType?.getText();
-      } else {
-        typeDefinition.type = "other";
-        typeDefinition.typeNode = node.type ? node.type.getText() : "unknown";
-      }
-    }
-
-    ts.forEachChild(node, visit);
-  }
-
-  visit(sourceFile);
-  return typeDefinition;
-}
-
-// Parse interface properties from TypeScript source
-function parseInterfaceProperties(
-  sourceFile: ts.SourceFile,
-  interfaceName: string,
-): PropertySchema[] {
-  const properties: PropertySchema[] = [];
-  let interfaceDialTags: DialTag = {};
-  const groupConfigs: Record<string, any> = {};
-
-  function visit(node: ts.Node) {
-    if (ts.isInterfaceDeclaration(node) && node.name.text === interfaceName) {
-      // First, get JSDoc comments for the interface itself
-      const interfaceJsDocNodes = ts.getJSDocCommentsAndTags(node);
-      if (interfaceJsDocNodes && interfaceJsDocNodes.length > 0) {
-        const interfaceFullText = interfaceJsDocNodes[0].getFullText();
-        interfaceDialTags = parseDialTags(interfaceFullText);
-
-        // Parse group-level configurations from interface JSDoc
-        const lines = interfaceFullText.split('\n');
-        lines.forEach(line => {
-          // Match patterns like "@dial transform @dial-no-wrap"
-          const groupMatch = line.match(/@dial\s+(\w+)(.*)/);
-          if (groupMatch) {
-            const groupName = groupMatch[1];
-            const configStr = groupMatch[2];
-            if (configStr.includes('@dial-no-wrap')) {
-              groupConfigs[groupName] = { noWrap: true };
-            }
-          }
-        });
-      }
-
-      node.members.forEach((member) => {
-        if (ts.isPropertySignature(member) && member.name && ts.isIdentifier(member.name)) {
-          const propName = member.name.text;
-
-          // Get JSDoc comments for the property
-          const jsDocNodes = ts.getJSDocCommentsAndTags(member);
-          let propertyDialTags: DialTag = {};
-
-          if (jsDocNodes && jsDocNodes.length > 0) {
-            const fullText = jsDocNodes[0].getFullText();
-            propertyDialTags = parseDialTags(fullText);
-          }
-
-          // Merge interface-level tags with property-level tags (property-level takes precedence)
-          const mergedDialTags = { ...interfaceDialTags, ...propertyDialTags };
-
-          // Build property schema
-          const prop: PropertySchema = {
-            name: propName,
-            dtype: mergedDialTags.dtype || "number",
-          };
-
-          // Add numeric constraints
-          if (mergedDialTags.min !== undefined) prop.min = mergedDialTags.min;
-          if (mergedDialTags.max !== undefined) prop.max = mergedDialTags.max;
-          if (mergedDialTags.step !== undefined) prop.step = mergedDialTags.step;
-          if (mergedDialTags.icon) prop.icon = mergedDialTags.icon;
-
-          // Add grouping and other tags
-          if (mergedDialTags.grouping || mergedDialTags.column || mergedDialTags.rowCount ||
-              mergedDialTags.colCount || mergedDialTags.labelPosition || mergedDialTags.noWrap) {
-            prop.tags = {};
-            if (mergedDialTags.grouping) {
-              prop.tags.grouping = mergedDialTags.grouping;
-              // Check if this group has noWrap configuration
-              if (groupConfigs[mergedDialTags.grouping]?.noWrap) {
-                prop.tags.noWrap = true;
-              }
-            }
-            if (mergedDialTags.column) prop.tags.layout = "column";
-            if (mergedDialTags.rowCount) prop.tags.row = mergedDialTags.rowCount;
-            if (mergedDialTags.colCount) prop.tags.col = mergedDialTags.colCount;
-            if (mergedDialTags.labelPosition) prop.tags.labelPosition = mergedDialTags.labelPosition;
-            if (mergedDialTags.noWrap) prop.tags.noWrap = true;
-          }
-
-          properties.push(prop);
-        }
-      });
-    }
-
-    ts.forEachChild(node, visit);
-  }
-
-  visit(sourceFile);
-  return properties;
-}
-
-// Parse @dial annotations from JSDoc comments
-function parseDialTags(description: string): DialTag & { ignore?: boolean } {
-  const dialTags: DialTag & { ignore?: boolean } = {};
-
-  if (!description) return dialTags;
-
-  // Check for @dial-ignore first
-  if (/@dial-ignore\b/i.test(description)) {
-    dialTags.ignore = true;
-    return dialTags; // Return early if ignore is set
-  }
-
-  // Extract @dial grouping tags (without hyphen)
-  const groupingPattern = /@dial\s+(transform|visibility|geometry|segments)\b/gm;
-  let match;
-
-  while ((match = groupingPattern.exec(description)) !== null) {
-    dialTags.grouping = match[1];
-  }
-
-  // Extract @dial-* property tags (with hyphen)
-  const propertyPattern = /@dial-([\w-]+)(?:\s+([^\n@]+?))?(?:\n|@|$)/gm;
-
-  while ((match = propertyPattern.exec(description)) !== null) {
-    const [, key, value] = match;
-
-    switch (key) {
-      case "options":
-        // Parse array-like values
-        if (value) {
-          try {
-            dialTags.options = JSON.parse(value);
-          } catch {
-            dialTags.options = value;
-          }
-        }
-        break;
-
-      case "min":
-      case "max":
-      case "step":
-        // Parse numeric values
-        if (value) {
-          dialTags[key] = parseFloat(value);
-        }
-        break;
-
-      case "col":
-      case "column":
-        // Boolean flag for column layout
-        dialTags.column = true;
-        break;
-
-      case "row":
-        // Parse row layout
-        if (value && /^\d+$/.test(value)) {
-          dialTags.rowCount = parseInt(value, 10);
-        }
-        break;
-
-      case "col-3":
-      case "col-2":
-      case "col-4": {
-        // Parse column layout with number
-        const colMatch = key.match(/col-(\d+)/);
-        if (colMatch) {
-          dialTags.colCount = parseInt(colMatch[1], 10);
-        }
-        break;
-      }
-
-      case "row-3":
-      case "row-2":
-      case "row-4": {
-        // Parse row layout with number
-        const rowMatch = key.match(/row-(\d+)/);
-        if (rowMatch) {
-          dialTags.rowCount = parseInt(rowMatch[1], 10);
-        }
-        break;
-      }
-
-      case "dtype":
-        // Data type
-        if (value) {
-          dialTags.dtype = value.trim();
-        }
-        break;
-
-      case "dtypes":
-        // Comma-separated data types for vectors
-        if (value) {
-          dialTags.dtypes = value.split(",").map((s) => s.trim());
-        }
-        break;
-
-      case "type":
-        // Type reference
-        if (value) {
-          dialTags.type = value.trim();
-        }
-        break;
-
-      case "icon":
-        // Lucide icon name
-        if (value) {
-          dialTags.icon = value.trim();
-        }
-        break;
-
-      case "default":
-        // Default value for the property
-        if (value) {
-          try {
-            // Try to parse as JSON first (for arrays, objects, booleans, numbers)
-            dialTags.default = JSON.parse(value);
-          } catch {
-            // If not valid JSON, use as string
-            dialTags.default = value.trim();
-          }
-        }
-        break;
-
-      case "placeholders":
-        // Comma-separated placeholders for vector types
-        if (value) {
-          dialTags.placeholders = value.split(",").map((s) => s.trim());
-        }
-        break;
-
-      case "tooltips":
-        // Comma-separated tooltips for vector types
-        if (value) {
-          dialTags.tooltips = value.split(",").map((s) => s.trim());
-        }
-        break;
-
-      case "mins":
-        // Comma-separated min values
-        if (value) {
-          dialTags.mins = value.split(",").map((s) => parseFloat(s.trim()));
-        }
-        break;
-
-      case "maxs":
-        // Comma-separated max values
-        if (value) {
-          dialTags.maxs = value.split(",").map((s) => parseFloat(s.trim()));
-        }
-        break;
-
-      case "steps":
-        // Comma-separated step values
-        if (value) {
-          dialTags.steps = value.split(",").map((s) => parseFloat(s.trim()));
-        }
-        break;
-
-      case "label-left":
-      case "left":
-        // Label position left
-        dialTags.labelPosition = "left";
-        break;
-
-      case "label-right":
-      case "right":
-        // Label position right
-        dialTags.labelPosition = "right";
-        break;
-
-      case "label-center":
-      case "label-middle":
-      case "center":
-      case "middle":
-        // Label position center
-        dialTags.labelPosition = "center";
-        break;
-
-      case "label-top":
-      case "top":
-        // Label position top
-        dialTags.labelPosition = "top";
-        break;
-
-      case "label-bottom":
-      case "bottom":
-        // Label position bottom
-        dialTags.labelPosition = "bottom";
-        break;
-
-      case "label-inline":
-      case "inline":
-        // Label position inline
-        dialTags.labelPosition = "inline";
-        break;
-
-      case "no-wrap":
-        // No wrap flag for preventing line wrapping
-        dialTags.noWrap = true;
-        break;
-
-      default:
-        // Other key-value pairs could be handled here
-        break;
-    }
-  }
-
-  return dialTags;
-}
-
-// Convert prop data to dial schema format
-function propToDialSchema(propName: string, propData: Record<string, unknown>, groupConfigs?: Record<string, any>): PropertySchema | null {
-  const description = (propData.description as string) || "";
-  const dialTags = parseDialTags(description);
-
-  // Skip properties with @dial-ignore
-  if (dialTags.ignore) {
-    return null;
-  }
-
-  // Determine dtype based on type or dial tags
-  let dtype = dialTags.dtype;
-  if (!dtype) {
-    const type = propData.type as { name?: string } | undefined;
-    const typeName = type?.name || "";
-    if (typeName === "boolean") {
-      dtype = "boolean";
-    } else if (typeName === "number") {
-      dtype = "number";
-    } else if (typeName.includes("[]")) {
-      dtype = "array";
-    } else {
-      dtype = "string";
-    }
-  }
-
-  // Build schema object
-  const schema: PropertySchema = {
-    name: propName,
-    dtype,
-  };
-
-  // Add default value
-  // Priority: @dial-default annotation > component default > undefined
-  if (dialTags.default !== undefined) {
-    schema.value = dialTags.default;
-  } else {
-    const defaultValue = propData.defaultValue as { value?: string } | undefined;
-    if (defaultValue?.value) {
-      try {
-        schema.value = JSON.parse(defaultValue.value);
-      } catch {
-        schema.value = defaultValue.value;
-      }
-    }
-  }
-
-  // Add dial tags
-  if (dialTags.min !== undefined) schema.min = dialTags.min;
-  if (dialTags.max !== undefined) schema.max = dialTags.max;
-  if (dialTags.step !== undefined) schema.step = dialTags.step;
-  if (dialTags.options) schema.options = dialTags.options;
-  if (dialTags.icon) schema.icon = dialTags.icon;
-
-  // Add vector-specific metadata
-  if (dialTags.placeholders) schema.placeholders = dialTags.placeholders;
-  if (dialTags.tooltips) schema.tooltips = dialTags.tooltips;
-  if (dialTags.dtypes) schema.dtypes = dialTags.dtypes;
-  if (dialTags.mins) schema.mins = dialTags.mins;
-  if (dialTags.maxs) schema.maxs = dialTags.maxs;
-  if (dialTags.steps) schema.steps = dialTags.steps;
-
-  // Add tags for grouping and layout
-  const tags: Record<string, unknown> = {};
-  if (dialTags.grouping) {
-    tags.grouping = dialTags.grouping;
-
-    // Check if this group has noWrap configuration
-    if (groupConfigs && groupConfigs[dialTags.grouping]?.noWrap) {
-      tags.noWrap = true;
-    }
-  }
-  if (dialTags.column) {
-    tags.col = true;
-  }
-  if (dialTags.rowCount) {
-    tags.row = dialTags.rowCount;
-    tags.layout = "row";
-  }
-  if (dialTags.colCount) {
-    tags.col = dialTags.colCount;
-    tags.layout = "column";
-  }
-  if (dialTags.labelPosition) {
-    tags.labelPosition = dialTags.labelPosition;
-  }
-
-  if (Object.keys(tags).length > 0) {
-    schema.tags = tags;
-  }
-
-  return schema;
-}
-
-// Process a single file
-async function processFile(
-  filePath: string,
-  outputDir: string,
-  options: docgen.ParserOptions,
-  flags: { verbose?: boolean; quiet?: boolean; ignoreList?: string[] } = {},
-): Promise<void> {
-  if (!flags.quiet) {
-    console.log(`\n📦 Processing ${filePath}...`);
-  }
-
-  // Parse with react-docgen-typescript
-  const docs = docgen.parse(filePath, options);
-
-  // Also parse the TypeScript source
-  const sourceCode = readFileSync(filePath, "utf-8");
-  const sourceFile = ts.createSourceFile(filePath, sourceCode, ts.ScriptTarget.Latest, true);
-
-  // Process each component
-  const enhancedMetadata = docs.map((doc) => {
-    const dialSchema: PropertySchema[] = [];
-
-    // Parse component-level dial configuration from description
-    const groupConfigs: Record<string, any> = {};
-    if (doc.description) {
-      const componentTags = parseDialTags(doc.description);
-      // Extract group-specific configuration
-      const descLines = doc.description.split('\n');
-      descLines.forEach(line => {
-        // Match patterns like "@dial transform @dial-no-wrap"
-        const groupMatch = line.match(/@dial\s+(\w+)(.*)/);
-        if (groupMatch) {
-          const groupName = groupMatch[1];
-          const configStr = groupMatch[2];
-          if (configStr.includes('@dial-no-wrap')) {
-            groupConfigs[groupName] = { noWrap: true };
-          }
-        }
-      });
-    }
-
-    // Also look for the Props interface and parse its JSDoc for group configurations
-    // The props interface is typically named [ComponentName]Props
-    const propsInterfaceName = doc.displayName + 'Props';
-    function findInterfaceJSDoc(node: ts.Node): void {
-      if (ts.isInterfaceDeclaration(node) && node.name.text === propsInterfaceName) {
-        const interfaceJsDocNodes = ts.getJSDocCommentsAndTags(node);
-        if (interfaceJsDocNodes && interfaceJsDocNodes.length > 0) {
-          const interfaceFullText = interfaceJsDocNodes[0].getFullText();
-          // Parse group-level configurations from interface JSDoc
-          const lines = interfaceFullText.split('\n');
-          lines.forEach(line => {
-            // Match patterns like "@dial transform @dial-no-wrap"
-            const groupMatch = line.match(/@dial\s+(\w+)(.*)/);
-            if (groupMatch) {
-              const groupName = groupMatch[1];
-              const configStr = groupMatch[2];
-              if (configStr.includes('@dial-no-wrap')) {
-                groupConfigs[groupName] = { noWrap: true };
-              }
-            }
-          });
-        }
-      }
-      ts.forEachChild(node, findInterfaceJSDoc);
-    }
-    findInterfaceJSDoc(sourceFile);
-
-    // Convert each prop to dial schema format
-    for (const [propName, propData] of Object.entries(doc.props || {})) {
-      const propDescription = (propData as { description?: string }).description || "";
-      const propDialTags = parseDialTags(propDescription);
-
-      // Skip properties with @dial-ignore
-      if (propDialTags.ignore) {
-        continue;
-      }
-
-      const propType = (propData as { type?: { name?: string } }).type;
-      const referencedType = propDialTags.type || propType?.name;
-
-      // Check if this prop references a type with dial annotations
-      if (referencedType) {
-        const typeDefinition = parseTypeAlias(sourceFile, referencedType);
-
-        if (typeDefinition) {
-          // Create schema with type definition
-          const schema = propToDialSchema(propName, propData as unknown as Record<string, unknown>, groupConfigs);
-
-          // Skip if the property is ignored
-          if (!schema) {
-            continue;
-          }
-
-          // Handle vector types with element annotations
-          if (typeDefinition.elements && typeDefinition.elements.length > 0) {
-            schema.dtype = "vector";
-
-            // Build arrays from individual element annotations
-            const mins: number[] = [];
-            const maxs: number[] = [];
-            const steps: number[] = [];
-            const dtypes: string[] = [];
-            const placeholders: string[] = [];
-            const tooltips: string[] = [];
-
-            typeDefinition.elements.forEach((element) => {
-              if (element.name) {
-                mins.push(element.min !== undefined ? element.min : 0);
-                maxs.push(element.max !== undefined ? element.max : 100);
-                steps.push(element.step !== undefined ? element.step : 1);
-                dtypes.push(element.dtype || "number");
-                placeholders.push(element.name);
-
-                // Create descriptive tooltips
-                const tooltip = element.name.includes("Segments")
-                  ? `${element.name.replace("Segments", " segments")}`
-                  : element.name.charAt(0).toUpperCase() + element.name.slice(1);
-                tooltips.push(tooltip);
-              }
-            });
-
-            if (mins.length > 0) schema.mins = mins;
-            if (maxs.length > 0) schema.maxs = maxs;
-            if (steps.length > 0) schema.steps = steps;
-            if (dtypes.length > 0) schema.dtypes = dtypes;
-            if (placeholders.length > 0) schema.placeholders = placeholders;
-            if (tooltips.length > 0) schema.tooltips = tooltips;
-
-            schema.typeDefinition = typeDefinition;
-          }
-
-          dialSchema.push(schema);
-
-          // Also parse interface properties if it's an interface
-          const interfaceProps = parseInterfaceProperties(sourceFile, referencedType);
-          interfaceProps.forEach((prop) => {
-            dialSchema.push({
-              ...prop,
-              name: `${propName}.${prop.name}`,
-              tags: {
-                grouping: "nested",
-                parent: propName,
-                hidden: true,
-                metadata: true,
-              },
-            });
-          });
-        } else {
-          // Regular prop without type definition
-          const schema = propToDialSchema(propName, propData as unknown as Record<string, unknown>, groupConfigs);
-          if (schema) {
-            dialSchema.push(schema);
-          }
-        }
-      } else {
-        // Regular prop without type reference
-        const schema = propToDialSchema(propName, propData as unknown as Record<string, unknown>, groupConfigs);
-        if (schema) {
-          dialSchema.push(schema);
-        }
-      }
-    }
-
-    return {
-      displayName: doc.displayName,
-      description: doc.description,
-      dialSchema,
-      groupConfigs,
-      props: doc.props,
-    };
-  });
-
-  // Create output directory if it doesn't exist
-  if (!existsSync(outputDir)) {
-    mkdirSync(outputDir, { recursive: true });
-  }
-
-  const baseName = basename(filePath, ".tsx").toLowerCase();
-
-  // Write raw docgen output
-  writeFileSync(join(outputDir, `${baseName}-raw.json`), JSON.stringify(docs, null, 2));
-  if (!flags.quiet) {
-    console.log(`📝 Wrote raw metadata to ${baseName}-raw.json`);
-  }
-
-  // Write enhanced metadata with dial schema
-  writeFileSync(
-    join(outputDir, `${baseName}-combined.json`),
-    JSON.stringify(enhancedMetadata, null, 2),
-  );
-  if (!flags.quiet) {
-    console.log(`📝 Wrote enhanced metadata to ${baseName}-combined.json`);
-  }
-
-  // Write just the dial schemas with groups
-  const schemas = enhancedMetadata.map((c) => {
-    // Convert groupConfigs to groups array
-    const groups = Object.entries(c.groupConfigs || {}).map(([name, config]) => ({
-      name,
-      ...config
-    }));
-
-    return {
-      component: c.displayName,
-      schemas: c.dialSchema,
-      groups: groups.length > 0 ? groups : undefined,
-      config: c.dialConfig,
-    };
-  });
-  writeFileSync(join(outputDir, `${baseName}-schemas.json`), JSON.stringify(schemas, null, 2));
-  if (!flags.quiet) {
-    console.log(`📝 Wrote dial schemas to ${baseName}-schemas.json`);
-  }
-
-  // Log sample output in verbose mode
-  if (flags.verbose && enhancedMetadata.length > 0) {
-    console.log("\n📊 Generated dial schemas:");
-    enhancedMetadata.forEach((meta) => {
-      console.log(`\n  Component: ${meta.displayName}`);
-      console.log(`  Properties: ${meta.dialSchema.length}`);
-      if (meta.dialSchema.length > 0) {
-        console.log(`  Sample schema:`);
-        console.log(JSON.stringify(meta.dialSchema[0], null, 4).split('\n').map(line => '    ' + line).join('\n'));
-      }
-    });
-  }
-}
-
-// Help text for the CLI (with dynamic version)
-function getHelpText(): string {
-  const { version, gitHash } = getVersionInfo();
-  const versionString = gitHash ? `v${version} (${gitHash})` : `v${version}`;
-  
-  return `
-dial-cli - Generate dial metadata from TypeScript/React components
-
-SYNOPSIS
-  dial-cli [options] <file.tsx> [file2.tsx ...]
-
-DESCRIPTION
-  The dial-cli tool parses TypeScript and React component files to extract
-  @dial annotations from JSDoc comments and generates JSON metadata files
-  that can be used to automatically create UI controls.
-
-  The tool generates three types of output files for each input:
-    • *-raw.json      - Raw output from react-docgen-typescript
-    • *-combined.json - Enhanced metadata with dial schema information
-    • *-schemas.json  - Just the dial schemas for UI generation
-
-OPTIONS
-  -o, --output <dir>
-      Output directory for generated metadata files (default: ./metadata)
-
-  -i, --ignore <prop>
-      Property names or patterns to exclude from dial schema generation
-      Can be specified multiple times: -i prop1 -i prop2
-      Or as a comma-separated list: -i prop1,prop2,prop3
-      Supports glob patterns: -i "*Style" -i "on*" -i "_*"
-
-  -h, --help
-      Display this help message and exit
-
-  -v, --version
-      Display version information and exit
-
-  --verbose
-      Enable verbose output with detailed processing information
-
-  --quiet
-      Suppress all output except errors
-
-DIAL ANNOTATIONS
-  The tool recognizes the following @dial annotations in JSDoc comments:
-
-  Grouping:
-    @dial <group>           Group related properties (transform, visibility, etc.)
-
-  Property Configuration:
-    @dial-dtype <type>      Data type (vector3, euler, boolean, int, etc.)
-    @dial-min <number>      Minimum value for numeric inputs
-    @dial-max <number>      Maximum value for numeric inputs
-    @dial-step <number>     Step increment for numeric inputs
-    @dial-default <value>   Default value (overrides component default)
-    @dial-options [...]     Array of preset values
-    @dial-icon <name>       Lucide icon name for the control
-    @dial-ignore            Exclude this property from dial schema generation
-
-  FormLayout:
-    @dial-col-<n>          Display in column layout with n columns
-    @dial-row-<n>          Display in row layout with n items per row
-    @dial-label-<pos>      Label position (left, right, top, bottom, inline)
-
-  Vector Types:
-    @dial-mins <n,n,n>     Comma-separated min values for vector elements
-    @dial-maxs <n,n,n>     Comma-separated max values for vector elements
-    @dial-steps <n,n,n>    Comma-separated step values for vector elements
-    @dial-dtypes <t,t,t>   Comma-separated data types for vector elements
-
-EXAMPLES
-  Generate metadata for a single component:
-    $ dial-cli MyComponent.tsx
-
-  Specify a custom output directory:
-    $ dial-cli -o ./docs/metadata MyComponent.tsx
-
-  Process multiple files:
-    $ dial-cli Component1.tsx Component2.tsx Component3.tsx
-
-  Process all components in a directory:
-    $ dial-cli src/components/*.tsx
-
-  Generate metadata with verbose output:
-    $ dial-cli --verbose MyComponent.tsx
-
-  Exclude specific properties from schema generation:
-    $ dial-cli -i className -i style -i children MyComponent.tsx
-    $ dial-cli --ignore ref,key,id MyComponent.tsx
-
-EXAMPLE COMPONENT
-  interface Props {
-    /**
-     * Position in 3D space
-     * @dial transform
-     * @dial-dtype vector3
-     * @dial-mins -10,-10,-10
-     * @dial-maxs 10,10,10
-     * @dial-steps 0.1,0.1,0.1
-     * @dial-icon Move3d
-     */
-    position: [number, number, number];
-
-    /**
-     * Visibility toggle
-     * @dial visibility
-     * @dial-dtype boolean
-     * @dial-icon Eye
-     */
-    visible: boolean;
-  }
-
-FILES
-  The tool generates the following files in the output directory:
-
-    <component>-raw.json
-        Raw docgen output with all prop information
-
-    <component>-combined.json
-        Enhanced metadata including dial schemas and type definitions
-
-    <component>-schemas.json
-        Extracted dial schemas ready for UI generation
-
-ENVIRONMENT
-  NODE_ENV
-      Set to 'development' for debug output
-
-SEE ALSO
-  Documentation: https://uikit.vuer.ai/dial
-  GitHub: https://github.com/vuer-ai/vuer-uikit
-
-VERSION
-  dial-cli ${versionString} (part of @vuer-ai/vuer-uikit)
-
-AUTHORS
-  Vuer AI Team <team@vuer.ai>
-`;
-}
-
-// Main CLI function
-async function main() {
-  const { values, positionals } = parseArgs({
-    args: process.argv.slice(2),
-    options: {
-      output: {
-        type: "string",
-        short: "o",
-        default: "./metadata",
-      },
-      ignore: {
-        type: "string",
-        short: "i",
-        multiple: true,
-        default: [],
-      },
-      help: {
-        type: "boolean",
-        short: "h",
-      },
-      version: {
-        type: "boolean",
-        short: "v",
-      },
-      verbose: {
-        type: "boolean",
-      },
-      quiet: {
-        type: "boolean",
-      },
-    },
-    allowPositionals: true,
-  });
-
-  // Handle version flag
-  if (values.version) {
-    const { version, gitHash } = getVersionInfo();
-    const versionString = gitHash ? `v${version} (${gitHash})` : `v${version}`;
-    console.log(`dial-cli ${versionString} (part of @vuer-ai/vuer-uikit)`);
-    process.exit(0);
-  }
-
-  // Handle help flag or no arguments
-  if (values.help || positionals.length === 0) {
-    console.log(getHelpText());
-    process.exit(0);
-  }
-
-  // Check for man page style help requests
-  if (positionals.length === 1 && (positionals[0] === "man" || positionals[0] === "help")) {
-    console.log(getHelpText());
-    process.exit(0);
-  }
-
-  const outputDir = resolve(process.cwd(), values.output as string);
-
-  // Process ignore list - handle both multiple -i flags and comma-separated values
-  const ignoreList: string[] = [];
-  const ignoreValues = values.ignore as string | string[] | undefined;
-  if (ignoreValues) {
-    if (Array.isArray(ignoreValues)) {
-      ignoreValues.forEach(val => {
-        // Split by comma in case user provided comma-separated list
-        ignoreList.push(...val.split(',').map(s => s.trim()));
-      });
-    } else if (typeof ignoreValues === 'string') {
-      ignoreList.push(...ignoreValues.split(',').map(s => s.trim()));
-    }
-  }
-
-  // Parser options for react-docgen-typescript
-  const options: docgen.ParserOptions = {
-    savePropValueAsString: true,
-    shouldExtractLiteralValuesFromEnum: true,
-    shouldRemoveUndefinedFromOptional: true,
-    propFilter: (prop) => {
-      // Include all props except React internals and ignored props
-      if (prop.name === "ref" || prop.name === "key") {
-        return false;
-      }
-      // Check if prop name matches any ignore pattern
-      // Support both exact matches and patterns with wildcards
-      for (const pattern of ignoreList) {
-        if (pattern.includes('*') || pattern.includes('?')) {
-          // Simple glob pattern matching
-          const regex = new RegExp('^' + pattern.replace(/\*/g, '.*').replace(/\?/g, '.') + '$');
-          if (regex.test(prop.name)) {
-            return false;
-          }
-        } else if (prop.name === pattern) {
-          // Exact match
-          return false;
-        }
-      }
-      return true;
-    },
-  };
-
-  const flags = {
-    verbose: values.verbose as boolean | undefined,
-    quiet: values.quiet as boolean | undefined,
-    ignoreList,
-  };
-
-  if (!flags.quiet) {
-    const { version, gitHash } = getVersionInfo();
-    const versionString = gitHash ? `v${version} (${gitHash})` : `v${version}`;
-    console.log(`🚀 Dial Documentation Generator ${versionString}`);
-    console.log(`📂 Output directory: ${outputDir}`);
-    if (flags.verbose && ignoreList.length > 0) {
-      console.log(`🚫 Ignoring properties: ${ignoreList.join(', ')}`);
-    }
-  }
-
-  // Process each file
-  let filesProcessed = 0;
-  let filesErrored = 0;
-
-  for (const file of positionals) {
-    const filePath = resolve(process.cwd(), file);
-
-    if (!existsSync(filePath)) {
-      console.error(`❌ File not found: ${filePath}`);
-      filesErrored++;
-      continue;
-    }
-
-    try {
-      await processFile(filePath, outputDir, options, flags);
-      filesProcessed++;
-    } catch (error) {
-      console.error(`❌ Error processing ${filePath}:`, error);
-      filesErrored++;
-    }
-  }
-
-  if (!flags.quiet) {
-    console.log("\n✅ Documentation generation complete!");
-    if (flags.verbose) {
-      console.log(`   Files processed: ${filesProcessed}`);
-      if (filesErrored > 0) {
-        console.log(`   Files with errors: ${filesErrored}`);
-      }
-    }
-  }
-}
-
-// Run the CLI - always run when this is the main module
-main().catch((error) => {
-  console.error("Fatal error:", error);
-  process.exit(1);
-});
-
-export { parseDialTags, propToDialSchema, parseTypeAlias, parseInterfaceProperties };