synthesisui 0.4.5 → 0.4.6

package/dist/claude-md.js

@@ -26,23 +26,83 @@ async function readInstalled(projectRoot) {
     }
     return locks;
 }
-function renderRegion(installed) {
+/** First sentence of a description, capped - the manifest must stay lean. */
+function summarize(desc) {
+    if (typeof desc !== "string" || !desc.trim())
+        return "";
+    const first = desc.trim().split(/(?<=\.)\s/)[0] ?? desc.trim();
+    return first.length > 90 ? `${first.slice(0, 87)}…` : first;
+}
+/** One manifest line per recipe: name, what it is, and its variant axes. */
+function catalogLines(recipes) {
+    return Object.entries(recipes)
+        .sort(([a], [b]) => a.localeCompare(b))
+        .map(([name, recipe]) => {
+        const r = recipe;
+        const axes = Object.entries(r.variants ?? {})
+            .map(([axis, options]) => {
+            const keys = Object.keys(options);
+            return keys.length <= 4 ? `${axis}: ${keys.join("|")}` : axis;
+        })
+            .join("; ");
+        const desc = summarize(r.description);
+        return {
+            name,
+            line: `  - \`ds-${name}\`${desc ? ` - ${desc}` : ""}${axes ? ` [${axes}]` : ""}`,
+        };
+    });
+}
+/**
+ * The COMPONENT MANIFEST for one installed system, read from its versioned
+ * design-system.json. This is what lets the app's agent know what it already
+ * HAS - "use these before creating new ones" - instead of re-inventing
+ * buttons. Returns null when the document isn't readable (older installs).
+ */
+async function readManifest(projectRoot, ds) {
+    try {
+        const raw = await readFile(join(projectRoot, "_synthesisui", "ds", ds.slug, `v${ds.version}`, "design-system.json"), "utf8");
+        const doc = JSON.parse(raw);
+        const components = catalogLines(doc.components ?? {});
+        const blocks = catalogLines(doc.blocks ?? {});
+        if (components.length === 0 && blocks.length === 0)
+            return null;
+        const lines = [];
+        if (components.length > 0) {
+            lines.push(`  Components (${components.length}) - USE these before creating new ones:`);
+            lines.push(...components.map((c) => c.line));
+        }
+        if (blocks.length > 0) {
+            lines.push(`  Engagement blocks (${blocks.length}):`);
+            lines.push(...blocks.map((c) => c.line));
+        }
+        return lines.join("\n");
+    }
+    catch {
+        return null;
+    }
+}
+async function renderRegion(projectRoot, installed) {
     if (installed.length === 0) {
         return `${START}\n${END}`;
     }
-    const lines = installed
-        .map((ds) => `- **${ds.name}** (\`${ds.slug}\`, v${ds.version}) - guide: \`_synthesisui/ds/${ds.slug}/v${ds.version}/GUIDE.md\``)
-        .join("\n");
+    const sections = [];
+    for (const ds of installed) {
+        const head = `- **${ds.name}** (\`${ds.slug}\`, v${ds.version}) - guide: \`_synthesisui/ds/${ds.slug}/v${ds.version}/GUIDE.md\``;
+        const manifest = await readManifest(projectRoot, ds);
+        sections.push(manifest ? `${head}\n${manifest}` : head);
+    }
     const body = `## Design Systems (via SynthesisUI)
 
 This project uses design system(s) brought in by the \`synthesisui\` CLI. **When creating or editing
 components, read the system's GUIDE.md and follow it:** use only semantic tokens
 (\`var(--ds-color-semantic-*)\`, \`--ds-spacing-*\`, etc.), scope the UI with \`data-ds="<slug>"\`,
-and reuse the \`.ds-*\` classes. Do not use raw values outside the system's scale. **To review a
+and reuse the \`.ds-*\` classes. Do not use raw values outside the system's scale. **Before
+creating any UI element, check the component manifest below - if it exists, use or extend
+it (\`synthesisui component <slug> <name>\` materializes it as your code).** To review a
 component, create an isolated sample page (e.g. \`app/synthesisui-samples/<component>/\`) - do not
-apply it to real production pages unless asked.**
+apply it to real production pages unless asked.
 
-${lines}
+${sections.join("\n")}
 
 _Block managed by the CLI - do not edit by hand; run \`synthesisui add <slug>\` to update._`;
     return `${START}\n${body}\n${END}`;
@@ -54,7 +114,7 @@ _Block managed by the CLI - do not edit by hand; run \`synthesisui add <slug>\`
  */
 export async function syncClaudeMd(projectRoot) {
     const installed = await readInstalled(projectRoot);
-    const region = renderRegion(installed);
+    const region = await renderRegion(projectRoot, installed);
     const path = join(projectRoot, "CLAUDE.md");
     let existing = null;
     try {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "synthesisui",
-  "version": "0.4.5",
+  "version": "0.4.6",
   "description": "Traz design systems do SynthesisUI para qualquer projeto (materializa em _local/ds/).",
   "type": "module",
   "bin": {