vibe-design-system 2.5.15 → 2.5.17

package/bin/init.js

@@ -165,6 +165,9 @@ function needsStorybook(projectRoot) {
   return !(dev.storybook && dev["@storybook/react-vite"] && dev["@tailwindcss/vite"]);
 }
 
+// Storybook 8.6.x — aynı minor sürümde tutarak addon uyumluluk uyarısını önler
+const STORYBOOK_VERSION = "8.6.17";
+
 function installStorybook(projectRoot) {
   console.log("📚 Storybook v8 ve @tailwindcss/vite kuruluyor...");
   const r = spawnSync(
@@ -172,14 +175,15 @@ function installStorybook(projectRoot) {
     [
       "install",
       "--save-dev",
-      "storybook@8",
-      "@storybook/react-vite@8",
-      "@storybook/react@8",
-      "@storybook/addon-essentials@8",
-      "@storybook/blocks@8",
+      "--save-exact",
+      `storybook@${STORYBOOK_VERSION}`,
+      `@storybook/react-vite@${STORYBOOK_VERSION}`,
+      `@storybook/react@${STORYBOOK_VERSION}`,
+      `@storybook/addon-essentials@${STORYBOOK_VERSION}`,
+      `@storybook/blocks@${STORYBOOK_VERSION}`,
       "@tailwindcss/vite",
     ],
-    { cwd: projectRoot, stdio: "inherit" }
+    { cwd: projectRoot, stdio: "inherit", shell: false }
   );
   if (r.status !== 0) {
     console.warn("⚠️ npm install storybook tamamlanamadı.");
@@ -374,4 +378,5 @@ runStoryGenerator(projectRoot);
 // ADIM 8
 console.log("\n✅ VDS kuruldu!");
 console.log("→ npm run storybook ile design system'ını aç");
-console.log("→ npm run vds:watch ile otomatik güncellemeyi başlat\n");
+console.log("→ npm run vds:watch ile otomatik güncellemeyi başlat");
+console.log("\nNot: Storybook başlarken (Node 24+) DEP0190 uyarısı çıkarsa Storybook kaynaklıdır, güvenle yok sayabilirsiniz.\n");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vibe-design-system",
-  "version": "2.5.15",
+  "version": "2.5.17",
   "description": "Auto-generate design systems for vibe coding projects",
   "type": "module",
   "bin": {

package/vds-core-template/story-generator.mjs

@@ -459,10 +459,12 @@ function buildDefaultArgsForRequiredProps(props) {
       lucideImports.add(iconName);
       argLines.push(`    ${name}: ${iconName},`);
     } else if (/\[\]/.test(type)) {
-      const itemTypeMatch = type.match(/([A-Za-z0-9_]+)(?=\s*\[\])/);
-      const itemType = itemTypeMatch ? itemTypeMatch[1] : "Item";
-      const example = getExampleItemForArrayType(itemType);
-      argLines.push(`    ${name}: ${JSON.stringify(example)},`);
+      if (/string\s*\[\]/.test(type)) {
+        argLines.push(`    ${name}: ["Example"],`);
+      } else {
+        // Object arrays ({ label, value } vb.) birçok component'te doğrudan child olarak render edilince hata verir; güvenli varsayılan boş dizi.
+        argLines.push(`    ${name}: [],`);
+      }
     }
   }
   return { argLines, lucideImports: [...lucideImports] };
@@ -591,19 +593,15 @@ function buildRecipeStoryContent(comp, componentName, importPath, title, source,
     lines.push(`import { ${lucideImports.join(", ")} } from "lucide-react";`);
   }
 
-  const isCardWithoutNamedExports = componentName === "Card" && !hasNamedExports(source, ["CardHeader", "CardTitle", "CardDescription", "CardContent", "CardFooter"]);
+  // Card: compound component (Header/Content) bazı projelerde yok; displayName hatasını önlemek için her zaman basit fallback kullanıyoruz.
+  const isCard = componentName === "Card";
   let effectiveRecipe = recipe;
-  if (isCardWithoutNamedExports) {
+  if (isCard) {
     effectiveRecipe = {
       imports: [],
       render: `(args) => (
       <ComponentRef className="w-[340px]" {...args}>
-        <ComponentRef.Header>
-          <ComponentRef.Title>Card title</ComponentRef.Title>
-          <ComponentRef.Description>Short description.</ComponentRef.Description>
-        </ComponentRef.Header>
-        <ComponentRef.Content><p>Card body content here.</p></ComponentRef.Content>
-        <ComponentRef.Footer>Footer</ComponentRef.Footer>
+        <p>Card content</p>
       </ComponentRef>
     )`,
     };
@@ -630,18 +628,11 @@ function buildRecipeStoryContent(comp, componentName, importPath, title, source,
     lines.push(`import { ${ext.names.join(", ")} } from "${ext.from}";`);
   }
 
-  const needsRouterDecorator = hasToOrHrefProp(comp, source);
-  if (needsRouterDecorator) {
-    lines.push(`import { MemoryRouter } from "react-router-dom";`);
-  }
   lines.push("");
   lines.push(`const meta = {`);
   lines.push(`  title: ${JSON.stringify(title)},`);
   lines.push(`  component: ComponentRef,`);
   lines.push(`  tags: ["autodocs"],`);
-  if (needsRouterDecorator) {
-    lines.push(`  decorators: [(Story) => <MemoryRouter><Story /></MemoryRouter>],`);
-  }
   lines.push(`} satisfies Meta<typeof ComponentRef>;`);
   lines.push("");
   lines.push(`export default meta;`);
@@ -757,18 +748,11 @@ function buildStoryFileContent(comp) {
     lines.push(`const ComponentRef = ${namedAlias} ?? ${defaultAlias};`);
   }
 
-  const needsRouterDecorator = hasToOrHrefProp(comp, source);
-  if (needsRouterDecorator) {
-    lines.push(`import { MemoryRouter } from "react-router-dom";`);
-  }
   lines.push("");
   lines.push(`const meta = {`);
   lines.push(`  title: ${JSON.stringify(title)},`);
   lines.push(`  component: ComponentRef,`);
   lines.push(`  tags: ["autodocs"],`);
-  if (needsRouterDecorator) {
-    lines.push(`  decorators: [(Story) => <MemoryRouter><Story /></MemoryRouter>],`);
-  }
   lines.push(`} satisfies Meta<typeof ComponentRef>;`);
   lines.push("");
   lines.push(`export default meta;`);