vibe-design-system 2.8.40 → 2.8.41

package/bin/init.js

@@ -95,12 +95,14 @@ Storybook stilleri sayfalardan farklıysa: .storybook/preview.ts içinde uygulam
 `;
 
 const WATCH_MJS = `#!/usr/bin/env node
-import { watch } from 'fs';
+import { watch, existsSync } from 'fs';
 import { execSync } from 'child_process';
 import { resolve } from 'path';
 
 const ROOT = resolve(process.cwd());
-const SRC = resolve(ROOT, 'src');
+// Auto-detect frontend src dir (supports fullstack projects)
+const SRC_CANDIDATES = ['src', 'client/src', 'frontend/src', 'web/src'];
+const SRC = resolve(ROOT, SRC_CANDIDATES.find((p) => existsSync(resolve(ROOT, p, 'components'))) || SRC_CANDIDATES.find((p) => existsSync(resolve(ROOT, p))) || 'src');
 let timeout = null;
 
 function run() {
@@ -145,6 +147,25 @@ function getProjectRoot() {
   return process.cwd();
 }
 
+/**
+ * Fullstack proje desteği: client/src, frontend/src, web/src varsa onu döndür.
+ * Yoksa standart "src" döndür.
+ */
+function detectFrontendSrcDir(projectRoot) {
+  // Check fullstack prefixes FIRST — they take priority over bare src/
+  // e.g. crypto project has empty src/ (only stories/) but real code in client/src/
+  for (const prefix of ["client/src", "frontend/src", "web/src"]) {
+    const full = path.join(projectRoot, prefix);
+    if (fs.existsSync(full) && fs.statSync(full).isDirectory()) {
+      const hasComponents = fs.existsSync(path.join(full, "components"));
+      const hasAppFiles = fs.readdirSync(full).some((f) => /\.(tsx|jsx)$/i.test(f));
+      if (hasComponents || hasAppFiles) return prefix;
+    }
+  }
+  // Fallback: standard src/
+  return "src";
+}
+
 function readPackageJson(projectRoot) {
   const pkgPath = path.join(projectRoot, "package.json");
   if (!fs.existsSync(pkgPath)) return null;
@@ -223,51 +244,20 @@ function detectFramework(pkg) {
   return "vite";
 }
 
-/** Vite 7+ kullanılıyorsa Storybook 8 peer dep çakışır.
- *  .npmrc'ye legacy-peer-deps=true ekleyerek tüm npm komutlarını bağışık hale getirir. */
-function ensureLegacyPeerDepsIfNeeded(projectRoot, pkg) {
-  const allDeps = { ...pkg.dependencies, ...pkg.devDependencies };
-  const viteVersion = allDeps["vite"] || "";
-  // "^7.x", "~7.x", "7.x" gibi tüm Vite 7+ versiyonlarını yakala
-  const isVite7Plus = /^\^?~?[7-9]\d*\./.test(viteVersion) || /^\^?~?[1-9]\d+\./.test(viteVersion);
-  if (!isVite7Plus) return;
-  const npmrcPath = path.join(projectRoot, ".npmrc");
-  let content = fs.existsSync(npmrcPath) ? fs.readFileSync(npmrcPath, "utf-8") : "";
-  if (content.includes("legacy-peer-deps")) return; // idempotent
-  content = content ? content.trimEnd() + "\nlegacy-peer-deps=true\n" : "legacy-peer-deps=true\n";
-  fs.writeFileSync(npmrcPath, content, "utf-8");
-  console.log("📝 .npmrc: legacy-peer-deps=true eklendi (Vite 7+ / Storybook 8 uyumluluk).");
-}
-
 /** Framework'e göre Storybook framework paket adı */
 function storybookFrameworkPackage(framework) {
   if (framework === "nextjs") return "@storybook/nextjs";
   return "@storybook/react-vite"; // vite & remix
 }
 
-/** Projenin gerçek frontend src dizinini tespit eder.
- *  Fullstack projelerde (client/, frontend/, web/) doğru alias için gerekli. */
-function detectFrontendSrcDir(projectRoot) {
-  // Fullstack / monorepo: frontend ayrı bir klasörde olabilir
-  const candidates = [
-    "client/src",
-    "frontend/src",
-    "web/src",
-  ];
-  for (const c of candidates) {
-    if (fs.existsSync(path.join(projectRoot, c))) return c;
-  }
-  return "src"; // varsayılan
-}
-
 /** Framework'e göre .storybook/main.ts içeriği */
-function buildStorybookMainTs(framework, projectRoot) {
+function buildStorybookMainTs(framework, srcPrefix) {
   if (framework === "nextjs") {
     return `import type { StorybookConfig } from "@storybook/nextjs";
 
 const config: StorybookConfig = {
   stories: [
-    "../src/**/*.stories.@(js|jsx|mjs|ts|tsx)",
+    "../${srcPrefix}/**/*.stories.@(js|jsx|mjs|ts|tsx)",
     "../app/**/*.stories.@(js|jsx|mjs|ts|tsx)",
   ],
   addons: ["@storybook/addon-essentials", "@storybook/addon-a11y"],
@@ -281,13 +271,12 @@ export default config;
 `;
   }
   // vite (default) & remix
-  const srcDir = detectFrontendSrcDir(projectRoot || process.cwd());
   return `import type { StorybookConfig } from "@storybook/react-vite";
 import { mergeConfig } from "vite";
 import path from "path";
 
 const config: StorybookConfig = {
-  stories: ["../src/**/*.stories.@(js|jsx|mjs|ts|tsx)"],
+  stories: ["../${srcPrefix}/**/*.stories.@(js|jsx|mjs|ts|tsx)"],
   addons: ["@storybook/addon-essentials", "@storybook/addon-a11y"],
   framework: {
     name: "@storybook/react-vite",
@@ -297,7 +286,7 @@ const config: StorybookConfig = {
     return mergeConfig(config, {
       resolve: {
         alias: {
-          "@": path.resolve(process.cwd(), "${srcDir}"),
+          "@": path.resolve(process.cwd(), "${srcPrefix}"),
         },
       },
     });
@@ -310,18 +299,14 @@ export default config;
 
 /** Framework'e göre CSS import path'i */
 function buildStorybookPreviewTs(framework, projectRoot) {
-  // CSS dosyasını bul
+  // CSS dosyasını bul — fullstack projeler (client/src, frontend/src, web/src) dahil
+  const frontendPrefixes = ["src", "client/src", "frontend/src", "web/src"];
   const cssCandidates = [
-    ["src/index.css", "../src/index.css"],
-    ["src/globals.css", "../src/globals.css"],
-    ["src/styles/globals.css", "../src/styles/globals.css"],
+    ...frontendPrefixes.map((p) => [p + "/index.css", "../" + p + "/index.css"]),
+    ...frontendPrefixes.map((p) => [p + "/globals.css", "../" + p + "/globals.css"]),
+    ...frontendPrefixes.map((p) => [p + "/styles/globals.css", "../" + p + "/styles/globals.css"]),
+    ...frontendPrefixes.map((p) => [p + "/App.css", "../" + p + "/App.css"]),
     ["app/globals.css", "../app/globals.css"],
-    // Fullstack / monorepo patterns (client/, frontend/, web/)
-    ["client/src/index.css", "../client/src/index.css"],
-    ["client/src/globals.css", "../client/src/globals.css"],
-    ["frontend/src/index.css", "../frontend/src/index.css"],
-    ["frontend/src/globals.css", "../frontend/src/globals.css"],
-    ["web/src/index.css", "../web/src/index.css"],
   ];
   let cssImport = '// CSS bulunamadı — projenizin global CSS dosyasını buraya ekleyin';
   for (const [rel, importPath] of cssCandidates) {
@@ -361,10 +346,10 @@ export default preview;
 // ADIM 1 — Bağımlılık kontrolü
 function needsStorybook(projectRoot, framework) {
   const pkg = readPackageJson(projectRoot);
-  if (!pkg) return true; // package.json yok → yükle (main guard zaten önce hata verecek)
-  const allDeps = { ...pkg.dependencies, ...pkg.devDependencies };
+  if (!pkg) return false;
+  const dev = pkg.devDependencies || {};
   const fwPkg = storybookFrameworkPackage(framework);
-  return !(allDeps.storybook && allDeps[fwPkg]);
+  return !(dev.storybook && dev[fwPkg]);
 }
 
 // Storybook 8.6.x — aynı minor sürümde tutarak addon uyumluluk uyarısını önler
@@ -373,41 +358,62 @@ const STORYBOOK_VERSION = "8.6.17";
 function installStorybook(projectRoot, framework) {
   const fwPkg = storybookFrameworkPackage(framework);
   console.log(`📚 Storybook v8 (${fwPkg}) kuruluyor...`);
-  const r = spawnSync(
-    "npm",
-    [
-      "install",
-      "--save-dev",
-      "--save-exact",
-      "--legacy-peer-deps",
-      `storybook@${STORYBOOK_VERSION}`,
-      `${fwPkg}@${STORYBOOK_VERSION}`,
-      `@storybook/react@${STORYBOOK_VERSION}`,
-      `@storybook/addon-essentials@${STORYBOOK_VERSION}`,
-      `@storybook/addon-a11y@${STORYBOOK_VERSION}`,
-      `@storybook/blocks@${STORYBOOK_VERSION}`,
-    ],
-    { cwd: projectRoot, stdio: "inherit", shell: true }
-  );
+  // No extra deps — @tailwindcss/vite removed (causes ERESOLVE in non-Tailwind projects)
+
+  // Vite 7+ peer dependency conflict: Storybook 8 requires vite ^4/5/6 but project has vite 7+
+  // Detect Vite version and add --legacy-peer-deps if needed
+  const pkg = readPackageJson(projectRoot);
+  const deps = { ...pkg?.dependencies, ...pkg?.devDependencies };
+  const viteVer = deps?.vite || "";
+  const viteIsMajor7Plus = /^[\^~]?[7-9]/.test(viteVer) || /^\d+/.test(viteVer) && parseInt(viteVer) >= 7;
+  const needsLegacyPeers = viteIsMajor7Plus;
+
+  if (needsLegacyPeers) {
+    console.log("⚠️ Vite 7+ algılandı — --legacy-peer-deps ile kurulum yapılıyor...");
+    // Ensure .npmrc has legacy-peer-deps for future installs too
+    const npmrcPath = path.join(projectRoot, ".npmrc");
+    const npmrcContent = fs.existsSync(npmrcPath) ? fs.readFileSync(npmrcPath, "utf-8") : "";
+    if (!npmrcContent.includes("legacy-peer-deps")) {
+      fs.appendFileSync(npmrcPath, "\nlegacy-peer-deps=true\n", "utf-8");
+    }
+  }
+
+  const installArgs = [
+    "install",
+    "--save-dev",
+    "--save-exact",
+    ...(needsLegacyPeers ? ["--legacy-peer-deps"] : []),
+    `storybook@${STORYBOOK_VERSION}`,
+    `${fwPkg}@${STORYBOOK_VERSION}`,
+    `@storybook/react@${STORYBOOK_VERSION}`,
+    `@storybook/addon-essentials@${STORYBOOK_VERSION}`,
+    `@storybook/addon-a11y@${STORYBOOK_VERSION}`,
+    `@storybook/blocks@${STORYBOOK_VERSION}`,
+  ];
+
+  const r = spawnSync("npm", installArgs, {
+    cwd: projectRoot,
+    stdio: "inherit",
+    shell: true,
+  });
   if (r.status !== 0) {
-    console.error("❌ npm install storybook başarısız oldu. VDS kurulumu durduruluyor.");
+    console.error("❌ npm install storybook başarısız oldu.");
     process.exit(1);
   }
 }
 
 // ADIM 2 — .storybook/
-function ensureStorybook(projectRoot, framework) {
+function ensureStorybook(projectRoot, framework, srcPrefix) {
   const storybookDir = path.join(projectRoot, ".storybook");
   if (!fs.existsSync(storybookDir)) {
     fs.mkdirSync(storybookDir, { recursive: true });
     console.log("📁 .storybook/ oluşturuldu.");
   }
 
-  const mainTs = buildStorybookMainTs(framework, projectRoot);
+  const mainTs = buildStorybookMainTs(framework, srcPrefix);
   const mainPath = path.join(storybookDir, "main.ts");
   fs.writeFileSync(mainPath, mainTs, "utf-8");
-  const detectedSrc = detectFrontendSrcDir(projectRoot);
-  console.log(`📝 .storybook/main.ts yazıldı (framework: ${framework}, @ alias: ${detectedSrc}).`);
+  console.log(`📝 .storybook/main.ts yazıldı (framework: ${framework}).`);
 
   const previewTs = buildStorybookPreviewTs(framework, projectRoot);
 
@@ -525,17 +531,15 @@ function ensureCursorrules(projectRoot) {
   console.log("📄 .cursorrules yazıldı.");
 }
 
-// ADIM 6 — src/stories/ oluştur (scan artık klasörü kendisi buluyor; zorla yaratmaya gerek yok)
-function ensureStoriesDir(projectRoot) {
-  const srcDir = path.join(projectRoot, "src");
+// ADIM 6 — stories/ oluştur (scan artık klasörü kendisi buluyor; zorla yaratmaya gerek yok)
+function ensureStoriesDir(projectRoot, srcPrefix) {
+  const srcDir = path.join(projectRoot, srcPrefix);
   if (!fs.existsSync(srcDir)) fs.mkdirSync(srcDir, { recursive: true });
   const storiesDir = path.join(srcDir, "stories");
   if (!fs.existsSync(storiesDir)) {
     fs.mkdirSync(storiesDir, { recursive: true });
-    console.log("📁 src/stories/ oluşturuldu.");
+    console.log(`📁 ${srcPrefix}/stories/ oluşturuldu.`);
   }
-  // scan.mjs artık klasörü kendisi buluyor (src/components → components → app/components → ...)
-  // Klasör yoksa oluşturma — projeye ait mevcut yapıyı koruyalım.
 }
 
 // ADIM 7 — İlk tarama
@@ -607,15 +611,15 @@ module.exports = {
 }
 
 // ADIM 9 — Storybook örnek dosyalarını sil
-function removeStorybookExamples(projectRoot) {
-  const storiesDir = path.join(projectRoot, "src", "stories");
+function removeStorybookExamples(projectRoot, srcPrefix) {
+  const storiesDir = path.join(projectRoot, srcPrefix, "stories");
   if (!fs.existsSync(storiesDir)) return;
   for (const name of STORYBOOK_EXAMPLE_FILES) {
     const filePath = path.join(storiesDir, name);
     if (fs.existsSync(filePath)) {
       try {
         fs.unlinkSync(filePath);
-        console.log("🗑️ Silindi: src/stories/" + name);
+        console.log(`🗑️ Silindi: ${srcPrefix}/stories/${name}`);
       } catch (_) {}
     }
   }
@@ -649,10 +653,10 @@ if (monorepoPackages.length > 0 && pkg.workspaces) {
 }
 
 const framework = detectFramework(pkg);
-console.log(`🔍 Framework tespit edildi: ${framework}\n`);
-
-// Vite 7+ projelerinde Storybook 8 peer dep çakışmasını önle
-ensureLegacyPeerDepsIfNeeded(projectRoot, pkg);
+const srcPrefix = detectFrontendSrcDir(projectRoot);
+console.log(`🔍 Framework tespit edildi: ${framework}`);
+if (srcPrefix !== "src") console.log(`📂 Fullstack proje algılandı: kaynak dizin → ${srcPrefix}`);
+console.log("");
 
 // ADIM 1
 if (needsStorybook(projectRoot, framework)) {
@@ -662,7 +666,7 @@ if (needsStorybook(projectRoot, framework)) {
 }
 
 // ADIM 2
-ensureStorybook(projectRoot, framework);
+ensureStorybook(projectRoot, framework, srcPrefix);
 
 // ADIM 3
 ensureVdsCore(projectRoot);
@@ -674,10 +678,10 @@ addScripts(projectRoot);
 ensureCursorrules(projectRoot);
 
 // ADIM 6
-ensureStoriesDir(projectRoot);
+ensureStoriesDir(projectRoot, srcPrefix);
 
 // ADIM 9 (örnek dosyaları taramadan önce silebiliriz; scan src/components ve src/pages tarar, src/stories değil)
-removeStorybookExamples(projectRoot);
+removeStorybookExamples(projectRoot, srcPrefix);
 
 // ADIM 9b
 ensureVdsConfig(projectRoot);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vibe-design-system",
-  "version": "2.8.40",
+  "version": "2.8.41",
   "description": "Auto-generate design systems for vibe coding projects",
   "homepage": "https://vibedesign.tech",
   "repository": {