vibe-design-system 2.8.30 → 2.8.31

package/package.json

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

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

@@ -1291,6 +1291,9 @@ function buildStoryFileContent(comp) {
   const usageFromPages = findComponentUsageInPages(componentName, PROJECT_ROOT);
   const { argLines: defaultArgLines, lucideImports, iconPropNames, needReact } = buildDefaultArgsForRequiredProps(effectiveProps, usageFromPages, componentName, source);
   const useReactNodeChildrenRender = !omitChildren && hasChildrenPropReactNode(effectiveProps);
+  // Any component with no extractable props: suppress children arg + simplify render.
+  // Covers feature, page, and section-type components regardless of tier classification (e.g. HeroSection, Footer)
+  const isNoPropsFeature = effectiveProps.length === 0;
 
   // Skip story only if not a page and no export found
   if (exportStyle === "unknown" && !isPage && (!source.includes("export") || !new RegExp(`\\b${componentName}\\b`).test(source))) {
@@ -1366,16 +1369,25 @@ function buildStoryFileContent(comp) {
   const propsArg = argsFallback ? `{ ...args${argsFallback} }` : (useSafeWrapper ? "args" : "args");
   const renderLine = useReactNodeChildrenRender
     ? `  render: (args) => React.createElement(React.Suspense, { fallback: null }, React.createElement(${RenderTarget}, { ...args, children: args.children || React.createElement('span', null, 'Example') })),`
-    : `  render: ${argsParam} => React.createElement(React.Suspense, { fallback: null }, React.createElement(${RenderTarget}, ${propsArg})),`;
-  const childrenArgLine = (label) => (!omitChildren && !useReactNodeChildrenRender ? `    children: ${JSON.stringify(label)},` : null);
+    : isNoPropsFeature
+      ? `  render: () => React.createElement(React.Suspense, { fallback: null }, React.createElement(${RenderTarget})),`
+      : `  render: ${argsParam} => React.createElement(React.Suspense, { fallback: null }, React.createElement(${RenderTarget}, ${propsArg})),`;
+  const childrenArgLine = (label) => {
+    if (isNoPropsFeature) return null; // Feature/page with no props: no children arg
+    return !omitChildren && !useReactNodeChildrenRender ? `    children: ${JSON.stringify(label)},` : null;
+  };
 
   if (!variants.length) {
     lines.push(`export const Default: Story = {`);
     lines.push(renderLine);
-    lines.push(`  args: {`);
-    if (childrenArgLine(componentName)) lines.push(childrenArgLine(componentName));
-    for (const line of defaultArgLines) lines.push(line);
-    lines.push(`  },`);
+    const storyArgLines = [];
+    if (childrenArgLine(componentName)) storyArgLines.push(childrenArgLine(componentName));
+    for (const line of defaultArgLines) storyArgLines.push(line);
+    if (storyArgLines.length > 0) {
+      lines.push(`  args: {`);
+      for (const line of storyArgLines) lines.push(line);
+      lines.push(`  },`);
+    }
     lines.push(`};`);
   } else {
     const defaultVariant = variants[0];