@nikkory/vibe-cli 2.3.2 → 2.4.1

package/dist/index.js

@@ -1065,7 +1065,209 @@ var import_commander4 = require("commander");
 var import_chalk3 = __toESM(require("chalk"));
 var import_ora3 = __toESM(require("ora"));
 
-// src/generators/section-generator.ts
+// src/generators/page-section-generator.ts
+var import_promises2 = require("fs/promises");
+var import_path2 = require("path");
+var PageSectionGenerator = class {
+  /**
+   * Generate section code
+   *
+   * @param options - Generation options
+   * @returns Generation result
+   */
+  async generate(options) {
+    try {
+      const { sectionId, designSystem, tier } = options;
+      const placeholderCode = this.generatePlaceholder(sectionId, designSystem, tier);
+      return {
+        success: true,
+        composedCode: placeholderCode,
+        metadata: {
+          sectionId,
+          sectionType: this.extractSectionType(sectionId),
+          tier,
+          designSystem,
+          componentsGenerated: 3,
+          totalLinesOfCode: placeholderCode.split("\n").length
+        },
+        errors: []
+      };
+    } catch (error) {
+      const errorMessage = error instanceof Error ? error.message : String(error);
+      return {
+        success: false,
+        composedCode: "",
+        metadata: {
+          sectionId: options.sectionId,
+          sectionType: this.extractSectionType(options.sectionId),
+          tier: options.tier,
+          designSystem: options.designSystem,
+          componentsGenerated: 0,
+          totalLinesOfCode: 0
+        },
+        errors: [errorMessage]
+      };
+    }
+  }
+  /**
+   * Write generated code to file
+   *
+   * @param filePath - Absolute file path
+   * @param code - Generated code content
+   * @returns Promise<void>
+   */
+  async writeToFile(filePath, code) {
+    await (0, import_promises2.mkdir)((0, import_path2.dirname)(filePath), { recursive: true });
+    await (0, import_promises2.writeFile)(filePath, code, "utf-8");
+  }
+  /**
+   * Extract section type from sectionId
+   *
+   * @param sectionId - Section ID (e.g., hero-centered, pricing-cards)
+   * @returns Section type (e.g., hero, pricing)
+   *
+   * @example
+   * ```typescript
+   * extractSectionType('hero-centered') // 'hero'
+   * extractSectionType('pricing-cards') // 'pricing'
+   * ```
+   */
+  extractSectionType(sectionId) {
+    return sectionId.split("-")[0];
+  }
+  /**
+   * Generate placeholder code
+   * (Will be replaced with actual SectionOrchestrator integration)
+   *
+   * @param sectionId - Section ID
+   * @param designSystem - Design system
+   * @param tier - Quality tier
+   * @returns Placeholder React component code
+   */
+  generatePlaceholder(sectionId, designSystem, tier) {
+    const componentName = this.toPascalCase(sectionId);
+    const sectionType = this.extractSectionType(sectionId);
+    return `/**
+ * ${componentName} Section
+ *
+ * Generated by Nikkory Vibe Section Orchestrator
+ *
+ * @packageDocumentation
+ * @since 1.0.0
+ *
+ * Powered by Nikkory
+ */
+
+import * as React from 'react';
+
+export interface ${componentName}Props {
+  /** Section title */
+  title?: string;
+  /** Section subtitle */
+  subtitle?: string;
+  /** Children elements */
+  children?: React.ReactNode;
+}
+
+/**
+ * ${componentName} Section (${sectionType})
+ *
+ * Design System: ${designSystem}
+ * Quality Tier: ${tier}
+ */
+export const ${componentName}: React.FC<${componentName}Props> = ({
+  title = 'Welcome',
+  subtitle,
+  children,
+}) => {
+  return (
+    <section className="section-${sectionId}">
+      <div className="container">
+        <div className="content">
+          <h1>{title}</h1>
+          {subtitle && <p>{subtitle}</p>}
+          {children}
+        </div>
+      </div>
+    </section>
+  );
+};
+
+export default ${componentName};
+`;
+  }
+  /**
+   * Convert kebab-case to PascalCase
+   *
+   * @param str - kebab-case string
+   * @returns PascalCase string
+   *
+   * @example
+   * ```typescript
+   * toPascalCase('hero-centered') // 'HeroCentered'
+   * toPascalCase('pricing-cards') // 'PricingCards'
+   * ```
+   */
+  toPascalCase(str) {
+    return str.split("-").map((word) => word.charAt(0).toUpperCase() + word.slice(1)).join("");
+  }
+};
+
+// src/commands/section-generate.ts
+var sectionGenerateCommand = new import_commander4.Command("add:section").alias("section").description("Add/Generate section using Orchestrator (50 sections, composition-based)").argument("<section>", "Section ID (e.g., hero-centered, pricing-cards)").option(
+  "-s, --design-system <system>",
+  "Design system (material-design, ios-hig, glassmorphism, neumorphism, brutalism, minimalism, fluent, carbon, ant-design, chakra, atlassian, blueprint)",
+  "material-design"
+).option(
+  "-t, --tier <tier>",
+  "Quality tier (basic, standard, enterprise)",
+  "standard"
+).option(
+  "-o, --output <path>",
+  "Output file path"
+).action(async (sectionId, options) => {
+  const spinner = (0, import_ora3.default)("Generating section...").start();
+  try {
+    const generator = new PageSectionGenerator();
+    const result = await generator.generate({
+      sectionId,
+      designSystem: options.designSystem,
+      tier: options.tier
+    });
+    if (!result.success) {
+      spinner.fail(import_chalk3.default.red("Section generation failed"));
+      result.errors.forEach((error) => {
+        console.error(import_chalk3.default.gray(`  \u2022 ${error}`));
+      });
+      process.exit(1);
+    }
+    if (options.output) {
+      await generator.writeToFile(options.output, result.composedCode);
+      spinner.succeed(import_chalk3.default.green(`Generated ${result.metadata.sectionId} \u2192 ${options.output}`));
+    } else {
+      spinner.succeed(import_chalk3.default.green(`Generated ${result.metadata.sectionId}`));
+      console.log(result.composedCode);
+    }
+    console.log(import_chalk3.default.cyan("\nSection Info:"));
+    console.log(`  ${import_chalk3.default.gray("ID:")} ${result.metadata.sectionId}`);
+    console.log(`  ${import_chalk3.default.gray("Type:")} ${result.metadata.sectionType}`);
+    console.log(`  ${import_chalk3.default.gray("Tier:")} ${result.metadata.tier}`);
+    console.log(`  ${import_chalk3.default.gray("Design System:")} ${result.metadata.designSystem}`);
+    console.log(`  ${import_chalk3.default.gray("Components:")} ${result.metadata.componentsGenerated}`);
+    console.log(`  ${import_chalk3.default.gray("Lines of Code:")} ${result.metadata.totalLinesOfCode}`);
+    console.log("");
+  } catch (error) {
+    spinner.fail(import_chalk3.default.red(`Error: ${error.message}`));
+    process.exit(1);
+  }
+});
+
+// src/commands/page-generate.ts
+var import_commander5 = require("commander");
+var import_chalk4 = __toESM(require("chalk"));
+var import_ora4 = __toESM(require("ora"));
+
+// src/generators/page-generator.ts
 var path3 = __toESM(require("path"));
 
 // src/generators/matrix-engine.ts
@@ -1337,133 +1539,13 @@ var MatrixEngine = class {
   }
 };
 
-// src/generators/section-generator.ts
-var SectionGenerator = class {
-  engine;
-  templateDir;
-  constructor(templateDir) {
-    this.engine = new MatrixEngine();
-    this.templateDir = templateDir || path3.join(process.cwd(), ".claude", "templates", "settings-section");
-  }
-  /**
-   * Generate settings section component
-   *
-   * @param options - Section generation options
-   * @returns Generation result
-   */
-  async generate(options) {
-    const dimensions = {
-      sectionType: options.sectionType,
-      dataPattern: options.dataPattern || "global-inheritance",
-      uiComplexity: options.uiComplexity || "medium",
-      qualityTier: options.qualityTier || "enterprise",
-      framework: options.framework || "react"
-    };
-    const variables = {
-      SectionName: options.sectionName,
-      SectionTitle: options.sectionTitle,
-      Icon: options.icon,
-      DataType: options.dataType,
-      apiMethod: options.apiMethod,
-      saveMethod: options.saveMethod,
-      sectionName: this.toKebabCase(options.sectionName),
-      ...options.additionalVariables
-    };
-    const genConfig = {
-      templateDir: this.templateDir,
-      dimensions,
-      variables,
-      outputDir: options.outputDir
-    };
-    return await this.engine.generate(genConfig);
-  }
-  /**
-   * Write generated files to disk
-   *
-   * @param result - Generation result
-   * @returns Array of written file paths
-   */
-  async write(result) {
-    return await this.engine.writeFiles(result);
-  }
-  /**
-   * Convert PascalCase to kebab-case
-   *
-   * @param str - PascalCase string
-   * @returns kebab-case string
-   *
-   * @example
-   * ```typescript
-   * toKebabCase('AIProviderSettings') // 'ai-provider-settings'
-   * ```
-   */
-  toKebabCase(str) {
-    return str.replace(/([a-z0-9])([A-Z])/g, "$1-$2").replace(/([A-Z])([A-Z][a-z])/g, "$1-$2").toLowerCase();
-  }
-};
-
-// src/commands/section-generate.ts
-var sectionGenerateCommand = new import_commander4.Command("add:section").alias("section").description("Add/Generate section using Orchestrator (50 sections, composition-based)").argument("<section>", "Section ID (e.g., hero-centered, pricing-cards)").option(
-  "-s, --design-system <system>",
-  "Design system (material-design, ios-hig, glassmorphism, neumorphism, brutalism, minimalism, fluent, carbon, ant-design, chakra, atlassian, blueprint)",
-  "material-design"
-).option(
-  "-t, --tier <tier>",
-  "Quality tier (basic, standard, enterprise)",
-  "standard"
-).option(
-  "-o, --output <path>",
-  "Output file path"
-).action(async (sectionId, options) => {
-  const spinner = (0, import_ora3.default)("Generating section...").start();
-  try {
-    const generator = new SectionGenerator();
-    const result = await generator.generate({
-      sectionId,
-      designSystem: options.designSystem,
-      tier: options.tier
-    });
-    if (!result.success) {
-      spinner.fail(import_chalk3.default.red("Section generation failed"));
-      result.errors.forEach((error) => {
-        console.error(import_chalk3.default.gray(`  \u2022 ${error}`));
-      });
-      process.exit(1);
-    }
-    if (options.output) {
-      await generator.writeToFile(options.output, result.composedCode);
-      spinner.succeed(import_chalk3.default.green(`Generated ${result.metadata.sectionId} \u2192 ${options.output}`));
-    } else {
-      spinner.succeed(import_chalk3.default.green(`Generated ${result.metadata.sectionId}`));
-      console.log(result.composedCode);
-    }
-    console.log(import_chalk3.default.cyan("\nSection Info:"));
-    console.log(`  ${import_chalk3.default.gray("ID:")} ${result.metadata.sectionId}`);
-    console.log(`  ${import_chalk3.default.gray("Type:")} ${result.metadata.sectionType}`);
-    console.log(`  ${import_chalk3.default.gray("Tier:")} ${result.metadata.tier}`);
-    console.log(`  ${import_chalk3.default.gray("Design System:")} ${result.metadata.designSystem}`);
-    console.log(`  ${import_chalk3.default.gray("Components:")} ${result.metadata.componentsGenerated}`);
-    console.log(`  ${import_chalk3.default.gray("Lines of Code:")} ${result.metadata.totalLinesOfCode}`);
-    console.log("");
-  } catch (error) {
-    spinner.fail(import_chalk3.default.red(`Error: ${error.message}`));
-    process.exit(1);
-  }
-});
-
-// src/commands/page-generate.ts
-var import_commander5 = require("commander");
-var import_chalk4 = __toESM(require("chalk"));
-var import_ora4 = __toESM(require("ora"));
-
 // src/generators/page-generator.ts
-var path4 = __toESM(require("path"));
 var PageGenerator = class {
   engine;
   templateDir;
   constructor(templateDir) {
     this.engine = new MatrixEngine();
-    this.templateDir = templateDir || path4.join(process.cwd(), ".claude", "templates", "page");
+    this.templateDir = templateDir || path3.join(process.cwd(), ".claude", "templates", "page");
   }
   /**
    * Generate page component
@@ -1584,7 +1666,7 @@ ${y.bold("             \u255A\u2588\u2588\u2557 \u2588\u2588\u2554\u255D\u2588\u
 ${y.bold("              \u255A\u2588\u2588\u2588\u2588\u2554\u255D \u2588\u2588\u2551\u2588\u2588\u2588\u2588\u2588\u2588\u2554\u255D\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2557              ")}
 ${y.bold("               \u255A\u2550\u2550\u2550\u255D  \u255A\u2550\u255D\u255A\u2550\u2550\u2550\u2550\u2550\u255D \u255A\u2550\u2550\u2550\u2550\u2550\u2550\u255D              ")}
 
-${y("                 happy together")} ${import_chalk5.default.white("\u2022 v2.3.2")}
+${y("                 happy together")} ${import_chalk5.default.white("\u2022 v2.4.1")}
 
 ${import_chalk5.default.gray("    Production-ready code in seconds")}
 ${import_chalk5.default.gray("           https://nikkory.com")}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nikkory/vibe-cli",
-  "version": "2.3.2",
+  "version": "2.4.1",
   "description": "CLI tool for Nikkory Vibe - Generate production-ready code in seconds",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",