vibe-design-system 2.5.1 → 2.5.2

package/package.json

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

package/vds-core-template/scan.mjs

@@ -620,7 +620,7 @@ function extractComponentSuggestions() {
     if (count < 2) continue;
     const suggestedName = suggestNameFromContent(innerText) || suggestNameFromPattern(pattern);
     suggestions.push({
-      suggestedName: suggestedName.replace(/\s+/g, ""),
+      suggestedName: sanitizeComponentName(suggestedName.replace(/\s+/g, "")),
       tagName: tagName || "div",
       pattern,
       fullJsx,
@@ -635,6 +635,15 @@ function extractComponentSuggestions() {
 
 const VDS_GENERATED_DIR = path.join(COMPONENTS_DIR, "vds-generated");
 
+/** Ensure component name is valid JS: no leading digits/special chars, PascalCase. */
+function sanitizeComponentName(name) {
+  if (!name || typeof name !== "string") return "Extracted";
+  let s = name.replace(/\s+/g, "").replace(/^[0-9\W_]+/, "");
+  if (!s) return "Extracted";
+  s = s.charAt(0).toUpperCase() + s.slice(1);
+  return s;
+}
+
 function toKebab(str) {
   return str.replace(/([A-Z])/g, "-$1").toLowerCase().replace(/^-/, "");
 }
@@ -659,7 +668,7 @@ function writeVdsGeneratedComponents(suggestions) {
   const entries = [];
   for (let i = 0; i < suggestions.length; i++) {
     const s = suggestions[i];
-    let baseName = (s.suggestedName || "Extracted").replace(/\s+/g, "");
+    let baseName = sanitizeComponentName(s.suggestedName || "Extracted");
     let fileName = baseName + ".tsx";
     if (usedNames.has(fileName)) fileName = baseName + String(i + 1) + ".tsx";
     usedNames.add(fileName);