@ikas/code-components-mcp 1.4.0-beta.2 → 1.4.0-beta.4

package/dist/index.js

@@ -584,7 +584,7 @@ function generateMigrationPlan(theme, projectName, oldSourceDir) {
     // Sections queue
     parts.push(`## Sections`);
     parts.push("");
-    parts.push(`Canonical component IDs are listed below — **use these exactly** when running \`config add-component\` and in \`filteredComponentIds\`. Do not change them mid-migration.`);
+    parts.push(`Component **names** are listed below. The CLI auto-generates opaque \`componentId\`s when you run \`config add-component\` — capture each id from the JSON response and use it (or look it up later with \`config list\`) when wiring \`filteredComponentIds\`.`);
     parts.push("");
     const buckets = {
         simple: [],
@@ -621,10 +621,8 @@ function generateMigrationPlan(theme, projectName, oldSourceDir) {
                         const itemObj = cd.nestedData?.[0];
                         if (itemObj) {
                             const childName = itemObj.typescriptName || (itemObj.name ? itemObj.name.replace(/[^a-zA-Z0-9]/g, "") : `${oldName}Item`);
-                            const childKebab = toKebabCase(childName);
-                            const childId = `${projectName}-${childKebab}`;
                             const fields = (itemObj.nestedData || []).map((f) => f.key || f.name || "?").slice(0, 8);
-                            children.push({ propName: p.name || "?", childId, childName, fields });
+                            children.push({ propName: p.name || "?", childName, fields });
                         }
                     }
                 }
@@ -634,7 +632,7 @@ function generateMigrationPlan(theme, projectName, oldSourceDir) {
             if (children.length > 0) {
                 parts.push(`  - Children:`);
                 for (const ch of children) {
-                    parts.push(`    - [ ] \`${ch.childId}\` (\`${ch.childName}\`) — for prop \`${ch.propName}\` — fields: ${ch.fields.join(", ")}`);
+                    parts.push(`    - [ ] \`${ch.childName}\` — for prop \`${ch.propName}\` — fields: ${ch.fields.join(", ")}`);
                 }
             }
         }
@@ -855,8 +853,8 @@ function generateSectionMigrationPlan(theme, sectionName, projectName, oldSource
     parts.push(`# Section Migration Plan: ${oldName}`);
     parts.push("");
     parts.push(`**Old name:** \`${oldName}\` (dir: \`${target.dir || "?"}\`)`);
-    parts.push(`**New section ID:** \`${sectionId}\``);
-    parts.push(`**New section name:** \`${sectionPascal}\``);
+    parts.push(`**New section name:** \`${sectionPascal}\` (the CLI will assign an opaque \`componentId\` at write-time — capture it from \`config add-component\`'s JSON response)`);
+    parts.push(`**Migration checkbox label:** \`${sectionId}\` (tracking identifier in \`MIGRATION.md\` only — not the runtime component id)`);
     if (target.isHeader)
         parts.push(`**Flags:** HEADER (\`isHeader: true\`)`);
     if (target.isFooter)
@@ -961,8 +959,6 @@ function generateSectionMigrationPlan(theme, sectionName, projectName, oldSource
                     // Child component needed
                     const itemObj = cd.nestedData?.[0];
                     const childName = itemObj?.typescriptName || (itemObj?.name ? itemObj.name.replace(/[^a-zA-Z0-9]/g, "") : `${sectionPascal}Item`);
-                    const childKebab = toKebabCase(childName);
-                    const childId = `${projectName}-${childKebab}`;
                     const childProps = [];
                     const nestedWarnings = [];
                     for (const f of (itemObj?.nestedData || [])) {
@@ -997,18 +993,17 @@ function generateSectionMigrationPlan(theme, sectionName, projectName, oldSource
                     }
                     children.push({
                         propName: oldName,
-                        childId,
                         childName,
                         childPropsJson: childProps,
                         customDataName: cd.name || "unnamed",
                     });
                     newType = "COMPONENT_LIST";
-                    notes = `Was CUSTOM → ${cd.type} of ${itemObj?.typescriptName || "object"}. Create child component \`${childId}\`.`;
+                    notes = `Was CUSTOM → ${cd.type} of ${itemObj?.typescriptName || "object"}. Create child component \`${childName}\`; the CLI returns the opaque \`componentId\` in its JSON response — substitute it for the \`<id-of-${childName}>\` placeholder below.`;
                     const prop = {
                         name: newName,
                         displayName: p.displayName || newName,
                         type: "COMPONENT_LIST",
-                        filteredComponentIds: [childId],
+                        filteredComponentIds: [`<id-of-${childName}>`],
                     };
                     parentPropsJson.push(prop);
                 }
@@ -1074,15 +1069,15 @@ function generateSectionMigrationPlan(theme, sectionName, projectName, oldSource
         parts.push(`Save the returned \`enumId\` values and substitute them in the parent config JSON below.`);
         parts.push("");
     }
-    // Child CLI commands — dedupe by childId (same shape may be referenced by multiple parent props)
+    // Child CLI commands — dedupe by childName (same shape may be referenced by multiple parent props)
     const uniqueChildren = new Map();
     for (const ch of children) {
-        const existing = uniqueChildren.get(ch.childId);
+        const existing = uniqueChildren.get(ch.childName);
         if (existing) {
             existing.usedByProps.push(ch.propName);
         }
         else {
-            uniqueChildren.set(ch.childId, { child: ch, usedByProps: [ch.propName] });
+            uniqueChildren.set(ch.childName, { child: ch, usedByProps: [ch.propName] });
         }
     }
     if (uniqueChildren.size > 0) {
@@ -1090,9 +1085,10 @@ function generateSectionMigrationPlan(theme, sectionName, projectName, oldSource
         parts.push("");
         parts.push(`These children are referenced by the parent's COMPONENT_LIST props. Create them before the parent.`);
         parts.push(`**Deduped:** run each \`add-component\` command ONCE even if multiple parent props reference the same child.`);
+        parts.push(`**Capture each \`componentId\` from the CLI's JSON response** — you'll substitute these ids for the \`<id-of-{ChildName}>\` placeholders in the parent's \`filteredComponentIds\` below.`);
         parts.push("");
         for (const { child: ch, usedByProps } of uniqueChildren.values()) {
-            parts.push(`### \`${ch.childId}\` (\`${ch.childName}\`)`);
+            parts.push(`### \`${ch.childName}\``);
             const propsLabel = usedByProps.length > 1
                 ? `Used by parent props: ${usedByProps.map(p => `\`${p}\``).join(", ")} (${usedByProps.length}×)`
                 : `For parent prop: \`${usedByProps[0]}\``;
@@ -1101,6 +1097,7 @@ function generateSectionMigrationPlan(theme, sectionName, projectName, oldSource
             parts.push("");
             parts.push(`\`\`\`bash`);
             parts.push(`npx ikas-component config add-component --name "${ch.childName}" --type component --props '${JSON.stringify(ch.childPropsJson)}'`);
+            parts.push(`# → { "success": true, "componentId": "<capture-this>", ... }`);
             parts.push(`\`\`\``);
             parts.push("");
         }
@@ -1116,6 +1113,10 @@ function generateSectionMigrationPlan(theme, sectionName, projectName, oldSource
     parts.push(`\`\`\``);
     parts.push("");
     parts.push(`**IMPORTANT:** The CLI auto-generates \`types.ts\`. DO NOT manually create or edit \`types.ts\`.`);
+    if (children.length > 0) {
+        parts.push("");
+        parts.push(`**Before running the command above:** replace each \`<id-of-{ChildName}>\` placeholder in the \`--props\` JSON with the real \`componentId\` captured from the corresponding child's \`add-component\` response (or from \`npx ikas-component config list\`). Component ids are opaque random strings — the CLI will reject any unknown id with a structured error.`);
+    }
     parts.push("");
     // Implementation guidance
     const nextStep = parentStep + 1;
@@ -1132,7 +1133,7 @@ function generateSectionMigrationPlan(theme, sectionName, projectName, oldSource
     if (children.length > 0) {
         parts.push(`- For COMPONENT_LIST props, use \`<IkasComponentRenderer id="..." components={list as any[]} parentProps={props} />\``);
         parts.push(`- **Remember: the parent cannot read child prop values.** Any per-item logic must live in the child component.`);
-        parts.push(`- **Every COMPONENT_LIST slot needs a child component to render individual items.** A product list needs a ProductCard child, a blog list needs a BlogCard child, etc. Check if the child already exists from a previous migration (reuse its ID in \`filteredComponentIds\`). If not, create it as a registered component.`);
+        parts.push(`- **Every COMPONENT_LIST slot needs a child component to render individual items.** A product list needs a ProductCard child, a blog list needs a BlogCard child, etc. Check if the child already exists (run \`config list\` to see all components and their opaque ids; reuse the existing id in \`filteredComponentIds\`). If not, create it as a registered component and use the \`componentId\` from the CLI's response.`);
     }
     // Check if the section itself has data-driven list props (PRODUCT_LIST, BLOG_LIST, CATEGORY_LIST)
     const dataListProps = (target.props || []).filter(p => p.type === "PRODUCT_LIST" || p.type === "BLOG_LIST" || p.type === "CATEGORY_LIST" || p.type === "BRAND_LIST");
@@ -1274,6 +1275,7 @@ function searchFunctions(query) {
     const scored = storefrontData.functions
         .map((fn) => {
         const nameScore = matchScore(fn.name, query) * 3;
+        const displayNameScore = fn.displayName ? matchScore(fn.displayName, query) * 3 : 0;
         const descScore = matchScore(fn.description, query);
         const catScore = fn.categories.some((c) => matchScore(c, query) > 0) ? 5 : 0;
         const paramScore = fn.params.some((p) => matchScore(p.name, query) > 0 || matchScore(p.description, query) > 0)
@@ -1281,7 +1283,10 @@ function searchFunctions(query) {
             : 0;
         const sigScore = matchScore(fn.signature, query) * 2;
         const typeScore = fn.parameterTypes?.some((t) => matchScore(t, query) > 0) ? 8 : 0;
-        return { fn, score: nameScore + descScore + catScore + paramScore + sigScore + typeScore };
+        return {
+            fn,
+            score: nameScore + displayNameScore + descScore + catScore + paramScore + sigScore + typeScore,
+        };
     })
         .filter((item) => item.score > 0)
         .sort((a, b) => b.score - a.score);
@@ -1469,31 +1474,53 @@ server.tool("search_docs", "Search across all ikas storefront API docs, framewor
 // Tool: get_function_doc
 server.tool("get_function_doc", "Get full documentation for a specific storefront API function including signature, parameters, return type, and example.", { name: z.string().describe("Function name (e.g. 'addItemToCart', 'Router.navigate')") }, async ({ name }) => {
     const nameLower = name.toLowerCase();
-    const fn = storefrontData.functions.find((f) => f.name.toLowerCase() === nameLower ||
-        (f.displayName && f.displayName.toLowerCase() === nameLower));
-    if (!fn) {
-        // Try fuzzy match
-        const matches = storefrontData.functions.filter((f) => f.name.toLowerCase().includes(nameLower) ||
-            (f.displayName && f.displayName.toLowerCase().includes(nameLower)));
-        if (matches.length > 0) {
-            const suggestions = matches.slice(0, 5).map((f) => {
-                const alias = f.displayName && f.displayName !== f.name ? ` (alias: ${f.displayName})` : "";
-                return `  - ${f.name}${alias}`;
-            });
-            return {
-                content: [
-                    {
-                        type: "text",
-                        text: `Function "${name}" not found. Did you mean:\n${suggestions.join("\n")}`,
-                    },
-                ],
-            };
+    // Phase 1: canonical-name match wins. A real function name always outranks
+    // any displayName alias so aliases can never shadow the function they're
+    // named after (e.g. `hasCustomer` the function vs. `hasIkasOrderCustomer`'s
+    // [BP-DISPLAY-NAME: hasCustomer] alias).
+    const byName = storefrontData.functions.find((f) => f.name.toLowerCase() === nameLower);
+    if (byName) {
+        return { content: [{ type: "text", text: formatFunctionDoc(byName) }] };
+    }
+    // Phase 2: fall back to displayName aliases.
+    const byAlias = storefrontData.functions.filter((f) => f.displayName && f.displayName.toLowerCase() === nameLower);
+    if (byAlias.length === 1) {
+        const fn = byAlias[0];
+        const note = `> Note: "${name}" is a display alias for \`${fn.name}\`.\n\n`;
+        return {
+            content: [{ type: "text", text: note + formatFunctionDoc(fn) }],
+        };
+    }
+    if (byAlias.length > 1) {
+        const lines = [];
+        lines.push(`"${name}" is an ambiguous display alias used by ${byAlias.length} functions. Call \`get_function_doc\` again with the canonical name of the one you want:`);
+        lines.push("");
+        for (const fn of byAlias) {
+            lines.push(formatFunctionSummary(fn));
+            lines.push(`  \`${fn.signature}\``);
         }
+        return { content: [{ type: "text", text: lines.join("\n") }] };
+    }
+    // No exact match. Try fuzzy substring match across name + displayName.
+    const matches = storefrontData.functions.filter((f) => f.name.toLowerCase().includes(nameLower) ||
+        (f.displayName && f.displayName.toLowerCase().includes(nameLower)));
+    if (matches.length > 0) {
+        const suggestions = matches.slice(0, 5).map((f) => {
+            const alias = f.displayName && f.displayName !== f.name ? ` (alias: ${f.displayName})` : "";
+            return `  - ${f.name}${alias}`;
+        });
         return {
-            content: [{ type: "text", text: `Function "${name}" not found. Use \`list_functions()\` to see all available functions.` }],
+            content: [
+                {
+                    type: "text",
+                    text: `Function "${name}" not found. Did you mean:\n${suggestions.join("\n")}`,
+                },
+            ],
         };
     }
-    return { content: [{ type: "text", text: formatFunctionDoc(fn) }] };
+    return {
+        content: [{ type: "text", text: `Function "${name}" not found. Use \`list_functions()\` to see all available functions.` }],
+    };
 });
 // Tool: list_functions
 server.tool("list_functions", "List storefront API functions. Without a `category`, returns category names + counts so you can drill in. With a `category`, returns one-line summaries for that category. Use `limit`/`offset` to paginate.", {
@@ -2072,7 +2099,7 @@ server.tool("get_prop_types", "Get all available ikas.config.json prop types wit
 const sectionTemplateKeys = sectionTemplateNames.length > 0
     ? sectionTemplateNames
     : null;
-server.tool("get_section_template", "Get the root files of a starter section template (index.tsx, types.ts, styles.css, ikas-config-snippet.json). Returns ONLY the section's root files plus the NAMES of any children, components, sub-components, utilities, and hooks — their files are NOT included by default. To view one item's full implementation, call `get_section_child(section, name, kind)` where kind is 'children' (default), 'components', or 'sub-components'. To bundle subtrees inline, pass `include`. Call `list_section_types()` for available section types. Use the API patterns shown — create your own JSX structure, CSS class names, and visual design.", {
+server.tool("get_section_template", "Get the root files of a starter section template (index.tsx, types.ts, styles.css, ikas-config-snippet.json). Returns ONLY the section's root files plus the NAMES of any children, components, sub-components, utilities, and hooks — their files are NOT included by default. To view one item's full implementation, call `get_section_child(section, name, kind)` where kind is 'children' (default), 'components', or 'sub-components'. To bundle subtrees inline, pass `include`. Call `list_section_types()` for available section types. Use the API patterns shown — create your own JSX structure, CSS class names, and visual design. **Container sections** (Header, Footer, ProductDetail, etc.) host child components via a `COMPONENT_LIST` slot — the response emits a complete multi-step Setup Recipe (create children → capture ids → wire `filteredComponentIds` via `config update-prop`). Follow all steps; the parent alone produces an empty section.", {
     sectionType: z
         .string()
         .describe("The section type (call `list_section_types()` for valid values)"),
@@ -2147,6 +2174,18 @@ server.tool("get_section_template", "Get the root files of a starter section tem
         `## ${bundle.title} — API Integration Pattern Reference`,
         "",
     ];
+    // Detect container-section pattern (COMPONENT_LIST with `<id-of-X>` placeholders).
+    // Surface this BEFORE every other warning so the LLM cannot miss the wiring requirement.
+    // The full recipe (commands, captured-id placeholders, update-prop call) is appended near
+    // the end of the response in the existing recipe-builder block.
+    {
+        const snippetStrForBanner = bundle.rootFiles["ikas-config-snippet.json"];
+        if (snippetStrForBanner && /<id-of-[A-Za-z0-9_]+>/.test(snippetStrForBanner)) {
+            const childMatches = Array.from(snippetStrForBanner.matchAll(/<id-of-([A-Za-z0-9_]+)>/g));
+            const uniqueChildren = Array.from(new Set(childMatches.map((m) => m[1])));
+            parts.push(`> 🔧 **CONTAINER SECTION — required wiring.** This template hosts ${uniqueChildren.length} child component${uniqueChildren.length === 1 ? "" : "s"} (${uniqueChildren.map((n) => `\`${n}\``).join(", ")}) via a \`COMPONENT_LIST\` slot. Creating the parent alone produces an empty, unusable section. **You MUST follow the full Setup Recipe below**: create each child → capture its \`componentId\` → wire them into the parent's \`filteredComponentIds\` with \`config update-prop\`. Component ids are opaque random strings (e.g. \`7ojrigep-Eml9n5sN3i\`) — they cannot be derived from names, and the CLI rejects unknown ids.`, "");
+        }
+    }
     if (anyOutstandingSubtree) {
         parts.push("> **PARTIAL TEMPLATE — NOT A COMPLETE IMPLEMENTATION.** The files below are the section's root files only. The section also ships with child components, local components, and/or shared sub-components whose files are **not included** in this response. To view one's full implementation, call `get_section_child(section, name, kind)` for each item you need (kind = `children`, `components`, or `sub-components`). The root `index.tsx` alone is not a complete reference — its imports resolve to files that live in those subtrees.", "");
     }
@@ -2215,7 +2254,10 @@ server.tool("get_section_template", "Get the root files of a starter section tem
     renderInlineSubtree("children", bundle.childContents);
     renderInlineSubtree("components", bundle.componentContents);
     renderInlineSubtree("sub-components", bundle.subComponentContents);
-    // Generate a ready-to-run CLI command from the config snippet
+    // Generate a ready-to-run CLI recipe from the config snippet. If the parent's
+    // filteredComponentIds reference `<id-of-X>` placeholders, expand into a
+    // multi-step recipe (create children → create parent → wire filteredComponentIds)
+    // so the LLM cannot skip the wiring step.
     const configSnippetStr = bundle.rootFiles["ikas-config-snippet.json"];
     if (configSnippetStr) {
         try {
@@ -2223,26 +2265,102 @@ server.tool("get_section_template", "Get the root files of a starter section tem
             const compName = configSnippet.name || normalizedType;
             const compType = configSnippet.type || "section";
             const propsArr = configSnippet.props || [];
-            let cliCommand = `npx ikas-component config add-component --name "${compName}" --type ${compType}`;
-            if (configSnippet.isHeader)
-                cliCommand += " --isHeader";
-            if (configSnippet.isFooter)
-                cliCommand += " --isFooter";
-            if (propsArr.length > 0) {
-                const propsJson = JSON.stringify(propsArr.map((p) => {
-                    const prop = {
-                        name: p.name,
-                        type: p.type,
-                    };
-                    if (p.displayName)
-                        prop.displayName = p.displayName;
-                    if (p.required)
-                        prop.required = true;
-                    return prop;
-                }));
-                cliCommand += ` --props '${propsJson}'`;
+            // Strip filteredComponentIds for the parent's add-component call (wired
+            // separately below). Preserve name/type/displayName/required so the LLM gets the prop shape.
+            const parentPropsForAdd = propsArr.map((p) => {
+                const out = { name: p.name, type: p.type };
+                if (p.displayName)
+                    out.displayName = p.displayName;
+                if (p.required)
+                    out.required = true;
+                return out;
+            });
+            const placeholderRe = /^<id-of-(.+)>$/;
+            const slotPlans = [];
+            const allChildNames = new Set();
+            for (const p of propsArr) {
+                if ((p.type === "COMPONENT_LIST" || p.type === "COMPONENT") &&
+                    Array.isArray(p.filteredComponentIds)) {
+                    const childNames = [];
+                    for (const entry of p.filteredComponentIds) {
+                        const m = typeof entry === "string" && entry.match(placeholderRe);
+                        if (m) {
+                            childNames.push(m[1]);
+                            allChildNames.add(m[1]);
+                        }
+                    }
+                    if (childNames.length > 0) {
+                        slotPlans.push({ propName: p.name, childNames });
+                    }
+                }
+            }
+            const childPlans = [];
+            for (const childName of allChildNames) {
+                const childSnippetPath = path.join(SECTION_TEMPLATES_DIR, normalizedType, "children", childName, "ikas-config-snippet.json");
+                let propsJson = "[]";
+                let hasTemplate = false;
+                if (fs.existsSync(childSnippetPath)) {
+                    hasTemplate = true;
+                    try {
+                        const childSnippet = JSON.parse(fs.readFileSync(childSnippetPath, "utf-8"));
+                        const childProps = (childSnippet.props || []).map((p) => {
+                            const out = { name: p.name, type: p.type };
+                            if (p.displayName)
+                                out.displayName = p.displayName;
+                            if (p.required)
+                                out.required = true;
+                            return out;
+                        });
+                        propsJson = JSON.stringify(childProps);
+                    }
+                    catch {
+                        // fall through with []
+                    }
+                }
+                childPlans.push({ name: childName, propsJson, hasTemplate });
+            }
+            const baseFlags = (configSnippet.isHeader ? " --isHeader" : "") +
+                (configSnippet.isFooter ? " --isFooter" : "");
+            const parentPropsJsonStr = parentPropsForAdd.length > 0
+                ? ` --props '${JSON.stringify(parentPropsForAdd)}'`
+                : "";
+            if (slotPlans.length > 0) {
+                parts.push("---", "");
+                parts.push(`### Setup Recipe (run in order — ${childPlans.length} child component${childPlans.length === 1 ? "" : "s"} + 1 parent + wiring)`);
+                parts.push("");
+                parts.push(`> ⚠️ **This section is a CONTAINER.** It hosts child components via ${slotPlans.length === 1 ? "a COMPONENT_LIST slot" : "COMPONENT_LIST slots"} (\`${slotPlans.map((s) => s.propName).join("`, `")}\`). Creating the parent alone is **not enough** — you MUST also create the child components and wire their opaque ids into the parent's \`filteredComponentIds\`. Skipping the wiring leaves the slot empty and the section unusable.`, "");
+                parts.push("**Step 1 — Create each child component, and capture its `componentId` from the JSON response:**");
+                parts.push("", "```bash");
+                for (const ch of childPlans) {
+                    parts.push(`npx ikas-component config add-component --name "${ch.name}" --type component --props '${ch.propsJson}'`);
+                    parts.push(`# → { "success": true, "componentId": "<capture as ${ch.name.toUpperCase()}_ID>", ... }`);
+                    if (!ch.hasTemplate) {
+                        parts.push(`# (no children/${ch.name}/ template in this section bundle — \`--props '[]'\` is a stub; add real props for ${ch.name} as needed)`);
+                    }
+                }
+                parts.push("```", "");
+                parts.push("**Step 2 — Create the parent section (without `filteredComponentIds` yet — those are wired in Step 3):**");
+                parts.push("", "```bash");
+                parts.push(`npx ikas-component config add-component --name "${compName}" --type ${compType}${baseFlags}${parentPropsJsonStr}`);
+                parts.push("```", "");
+                parts.push("**Step 3 — Wire each slot to its allowed children using the ids captured in Step 1:**");
+                parts.push("", "```bash");
+                for (const slot of slotPlans) {
+                    const idsArr = slot.childNames.map((n) => `<${n.toUpperCase()}_ID>`);
+                    parts.push(`npx ikas-component config update-prop --component "${compName}" --prop ${slot.propName} \\`);
+                    parts.push(`  --filteredComponentIds '${JSON.stringify(idsArr)}'`);
+                }
+                parts.push("```", "");
+                parts.push("Replace each `<X_ID>` placeholder above with the real `componentId` from the corresponding Step 1 response (or look ids up with `config list`). The CLI rejects unknown ids with a structured error — there is no silent failure mode.");
+                parts.push("");
+                parts.push("**Do NOT manually create or edit `types.ts`** — the CLI commands above regenerate it automatically.");
+                parts.push("");
+            }
+            else {
+                // No child slots — single-step parent command (preserves previous behaviour)
+                const cliCommand = `npx ikas-component config add-component --name "${compName}" --type ${compType}${baseFlags}${parentPropsJsonStr}`;
+                parts.push("---", "", "### CLI Command (run this first)", "", "```bash", cliCommand, "```", "", "**Do NOT manually create or edit `types.ts`** — the CLI command above generates it automatically.", "");
             }
-            parts.push("---", "", "### CLI Command (run this first)", "", "```bash", cliCommand, "```", "", "**Do NOT manually create or edit `types.ts`** — the CLI command above generates it automatically.", "");
         }
         catch {
             // ignore parse errors