vibe-design-system 2.5.41 → 2.5.42

package/package.json

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

package/vds-core-template/scan.mjs

@@ -542,6 +542,7 @@ function extractComponentSuggestions() {
   const pageDirs = [
     { dir: PAGES_DIR, prefix: "src/pages/" },
     { dir: APP_DIR, prefix: "src/app/" },
+    { dir: COMPONENTS_DIR, prefix: "src/components/" },
   ];
   const allPageFiles = [];
   for (const { dir, prefix } of pageDirs) {
@@ -1195,6 +1196,64 @@ function extractFoundations() {
   };
 }
 
+function extractButtonUsage() {
+  if (!fs.existsSync(SRC_DIR)) return null;
+  const files = getAllTsxJsxInDir(SRC_DIR);
+  if (!Array.isArray(files) || files.length === 0) return null;
+
+  const combos = new Map();
+  let total = 0;
+
+  const extractPropLiteral = (attrs, name) => {
+    if (!attrs) return null;
+    // variant="primary"
+    let re = new RegExp(name + '\\\\s*=\\\\s*["\']([^"\']+)["\']');
+    let m = attrs.match(re);
+    if (m) return m[1];
+    // variant={"primary"}
+    re = new RegExp(name + '\\\\s*=\\\\s*\\\\{\\\\s*["\']([^"\']+)["\']\\\\s*\\\\}');
+    m = attrs.match(re);
+    if (m) return m[1];
+    return null;
+  };
+
+  for (const rel of files) {
+    const fullPath = path.join(SRC_DIR, rel);
+    let content;
+    try {
+      content = fs.readFileSync(fullPath, "utf-8");
+    } catch (_) {
+      continue;
+    }
+    const re = /<Button\\b([^>]*)>/g;
+    let m;
+    while ((m = re.exec(content)) !== null) {
+      total += 1;
+      const attrs = m[1] || "";
+      const variant = extractPropLiteral(attrs, "variant") || "default";
+      const size = extractPropLiteral(attrs, "size") || "default";
+      const asChild = /\\basChild\\b/.test(attrs);
+      const key = `${variant}__${size}__${asChild ? "1" : "0"}`;
+      if (!combos.has(key)) {
+        combos.set(key, {
+          key,
+          variant,
+          size,
+          asChild,
+          count: 0,
+        });
+      }
+      combos.get(key).count += 1;
+    }
+  }
+
+  if (total === 0 || combos.size === 0) return null;
+  return {
+    total,
+    combos: Array.from(combos.values()),
+  };
+}
+
 function scan() {
   if (!fs.existsSync(COMPONENTS_DIR)) {
     console.error(CLI_LOCALES[CLI_LOCALE].componentsNotFound);
@@ -1242,6 +1301,10 @@ function scan() {
   const foundations = extractFoundations();
   foundations.icons = extractLucideIconsUsed(SRC_DIR);
   foundations.brand = { assets: extractBrandAssets() };
+  const buttonUsage = extractButtonUsage();
+  if (buttonUsage) {
+    foundations.buttonUsage = buttonUsage;
+  }
   const componentSuggestions = extractComponentSuggestions();
   const unreleasedSectionCandidates = extractUnreleasedSectionCandidates();
   const output = {

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

@@ -478,7 +478,7 @@ const REACTNODE_PLACEHOLDER_TEXT = {
   children: "Example content",
 };
 
-/** Component adına göre ekstra args (toString/undefined hatalarını önlemek için; her prop güvenli değer alır). */
+/** Component adına göre ekstra args (toString/dateRange/toFixed hatalarını önlemek için; her prop güvenli değer alır). */
 const COMPONENT_EXTRA_ARGS = {
   TaskEstimateInput: [
     "    task: { id: \"1\", title: \"Example\", estimate: 0, description: \"\" },",
@@ -491,6 +491,22 @@ const COMPONENT_EXTRA_ARGS = {
     "    step: 1,",
     "    taskId: \"1\",",
   ],
+  TimeFilterPanel: [
+    "    filter: { dateRange: {}, userIds: [], tags: [], billable: \"all\" },",
+    "    onFilterChange: () => {},",
+    "    onSaveFilter: () => {},",
+    "    onDeleteFilter: () => {},",
+    "    filteredCount: 0,",
+    "    savedFilters: [],",
+  ],
+  TimeStats: [
+    "    totalLogged: 0,",
+    "    totalBillable: 0,",
+    "    totalNonBillable: 0,",
+    "    totalBilled: 0,",
+    "    totalEstimated: 0,",
+    "    projectTotalEstimated: 0,",
+  ],
 };
 
 /** Render'da args'a uygulanacak fallback (useState(estimate.toString()) gibi kullanımlar için; args/Controls undefined yapsa bile). */
@@ -501,6 +517,8 @@ const RENDER_ARGS_FALLBACKS = {
 /** Kalıcı çözüm: Storybook Docs/Controls args'ı geçmezse bile component'a güvenli props veren wrapper. Önce safeDefaults uygulanır, sonra gelen props. */
 const SAFE_WRAPPER_DEFAULTS = {
   TaskEstimateInput: `{ estimate: 0, onUpdate: () => {}, value: 0, task: { id: "1", title: "Example", estimate: 0 }, compact: false }`,
+  TimeFilterPanel: `{ filter: { dateRange: {}, userIds: [], tags: [], billable: "all" }, onFilterChange: () => {}, onSaveFilter: () => {}, onDeleteFilter: () => {}, filteredCount: 0, savedFilters: [] }`,
+  TimeStats: `{ totalLogged: 0, totalBillable: 0, totalNonBillable: 0, totalBilled: 0, totalEstimated: 0, projectTotalEstimated: 0 }`,
 };
 
 /** Recursive list of .tsx/.jsx file paths under dir (relative to dir). Index.tsx / index.tsx first for deterministic "first usage". */
@@ -1295,6 +1313,58 @@ function writeFoundationsStories(foundations) {
     fs.writeFileSync(path.join(foundationsDir, "Icons.stories.tsx"), iconsContent, "utf-8");
     console.log("[VDS] Wrote " + path.relative(PROJECT_ROOT, path.join(foundationsDir, "Icons.stories.tsx")));
   }
+
+  const buttonUsage = foundations?.buttonUsage;
+  if (buttonUsage && Array.isArray(buttonUsage.combos) && buttonUsage.combos.length > 0) {
+    const combos = buttonUsage.combos.map((c) => ({
+      key: c.key,
+      variant: c.variant,
+      size: c.size,
+      asChild: !!c.asChild,
+      count: c.count ?? 0,
+    }));
+    const buttonsContent =
+      [
+        "import type { Meta, StoryObj } from \"@storybook/react\";",
+        "",
+        "const meta = { title: \"Foundations/Button Usage\" } satisfies Meta;",
+        "export default meta;",
+        "type Story = StoryObj;",
+        "",
+        `const combos = ${JSON.stringify(combos)};`,
+        "",
+        "export const Default: Story = {",
+        "  render: () => (",
+        "    <div style={{ padding: 24, fontFamily: \"system-ui, sans-serif\" }}>",
+        "      <h2 style={{ marginBottom: 8 }}>Used Button variants in app code</h2>",
+        "      <p style={{ marginBottom: 16, color: \"#888\", fontSize: 13 }}>Based on &lt;Button ... /&gt; usages in src/ (ignores lowercase &lt;button&gt;).</p>",
+        "      <table style={{ borderCollapse: \"collapse\", width: \"100%\", fontSize: 13 }}>",
+        "        <thead>",
+        "          <tr>",
+        "            <th style={{ textAlign: \"left\", padding: \"4px 8px\", borderBottom: \"1px solid #333\" }}>Variant</th>",
+        "            <th style={{ textAlign: \"left\", padding: \"4px 8px\", borderBottom: \"1px solid #333\" }}>Size</th>",
+        "            <th style={{ textAlign: \"left\", padding: \"4px 8px\", borderBottom: \"1px solid #333\" }}>asChild</th>",
+        "            <th style={{ textAlign: \"right\", padding: \"4px 8px\", borderBottom: \"1px solid #333\" }}>Count</th>",
+        "          </tr>",
+        "        </thead>",
+        "        <tbody>",
+        "          {combos.map((c) => (",
+        "            <tr key={c.key}>",
+        "              <td style={{ padding: \"4px 8px\", borderBottom: \"1px solid #222\" }}>{c.variant}</td>",
+        "              <td style={{ padding: \"4px 8px\", borderBottom: \"1px solid #222\" }}>{c.size}</td>",
+        "              <td style={{ padding: \"4px 8px\", borderBottom: \"1px solid #222\" }}>{c.asChild ? \"yes\" : \"no\"}</td>",
+        "              <td style={{ padding: \"4px 8px\", borderBottom: \"1px solid #222\", textAlign: \"right\" }}>{c.count}</td>",
+        "            </tr>",
+        "          ))}",
+        "        </tbody>",
+        "      </table>",
+        "    </div>",
+        "  ),",
+        "};",
+      ].join("\n");
+    fs.writeFileSync(path.join(foundationsDir, "Buttons.stories.tsx"), buttonsContent, "utf-8");
+    console.log("[VDS] Wrote " + path.relative(PROJECT_ROOT, path.join(foundationsDir, "Buttons.stories.tsx")));
+  }
 }
 
 function writeComponentSuggestionsStory(componentSuggestions) {
@@ -1323,7 +1393,7 @@ function writeComponentSuggestionsStory(componentSuggestions) {
       "  render: () => (",
       "    <div style={{ padding: 24, fontFamily: \"system-ui, sans-serif\" }}>",
       "      <h2 style={{ marginBottom: 16 }}>Visual section candidates (component suggestions)</h2>",
-      "      <p style={{ color: \"#888\", marginBottom: 24 }}>From src/pages and src/app: own className, 2+ child elements, pattern repeated 2+ times. Not yet in src/components. Consider extracting as components.</p>",
+      "      <p style={{ color: \"#888\", marginBottom: 24 }}>From src/pages, src/app ve src/components: kendi className kümeleri, 2+ child element, 2+ tekrar. Aynı yapı birden fazla dosyada geçiyorsa ayrı component olarak düşünün.</p>",
       "      <div style={{ display: \"flex\", flexDirection: \"column\", gap: 24 }}>",
       "        {suggestions.map((s, i) => (",
       "          <div key={i} style={{ border: \"1px solid #333\", borderRadius: 8, padding: 16, background: \"#111\" }}>",