vibe-design-system 2.8.68 → 2.8.69

package/package.json

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

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

@@ -4200,7 +4200,7 @@ function writeComponentInventoryStory(components, foundations) {
     `const uniqueTokens = ${uniqueTokens};`,
     ``,
     // CardPreview: renders the actual component at the right scale, falls back to shape HTML
-    `const CardPreview = ({ comp }: { comp: any }) => {`,
+    `const _InvPreview = ({ comp }: { comp: any }) => {`,
     `  const s: number = comp.previewScale || 0.4;`,
     `  const centered = s >= 0.9;`,
     `  const fn = PREVIEWS[comp.name];`,
@@ -4224,10 +4224,10 @@ function writeComponentInventoryStory(components, foundations) {
     `    </div>`,
     `  );`,
     `};`,
-    `const Card = ({ comp }: { comp: any }) => (`,
+    `const InventoryCard = ({ comp }: { comp: any }) => (`,
     `  <div style={{ border: "1px solid " + (comp.active ? "#e5e7eb" : "#f0f0f0"), borderRadius: 10, overflow: "hidden", background: comp.active ? "#fff" : "#fafafa", display: "flex", flexDirection: "column" as any, boxShadow: comp.active ? "0 1px 3px rgba(0,0,0,0.05)" : "none", opacity: comp.active ? 1 : 0.55 }}>`,
     `    <div style={{ background: comp.active ? "#f8f9fa" : "#f5f5f5", borderBottom: "1px solid #f0f0f0" }}>`,
-    `      <CardPreview comp={comp} />`,
+    `      <_InvPreview comp={comp} />`,
     `    </div>`,
     `    <div style={{ padding: "10px 12px" }}>`,
     `      <div style={{ display: "flex", alignItems: "center", gap: 5, marginBottom: 5 }}>`,
@@ -4279,8 +4279,8 @@ function writeComponentInventoryStory(components, foundations) {
     `              {inactive.length > 0 && <span style={{ fontSize: 12, background: "#f3f4f6", color: "#9ca3af", padding: "2px 9px", borderRadius: 12 }}>{inactive.length} installed</span>}`,
     `            </div>`,
     `            <div style={{ display: "grid", gridTemplateColumns: "repeat(auto-fill, minmax(200px, 1fr))", gap: 12 }}>`,
-    `              {active.map((comp: any) => <Card key={comp.name} comp={comp} />)}`,
-    `              {expanded && inactive.map((comp: any) => <Card key={comp.name} comp={comp} />)}`,
+    `              {active.map((comp: any) => <InventoryCard key={comp.name} comp={comp} />)}`,
+    `              {expanded && inactive.map((comp: any) => <InventoryCard key={comp.name} comp={comp} />)}`,
     `            </div>`,
     `          </div>`,
     `        );`,