npm - @dryui/mcp - Versions diffs - 0.1.3 → 0.2.0 - Mend

@dryui/mcp 0.1.3 → 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (13) hide show

package/dist/architecture.d.ts +0 -1
package/dist/architecture.js +0 -3
package/dist/architecture.json +12 -8
package/dist/composition-search.d.ts +15 -0
package/dist/composition-search.js +202 -0
package/dist/contract.v1.json +29 -11
package/dist/index.js +628 -278
package/dist/project-planner.js +4 -3
package/dist/spec.json +29 -11
package/dist/toon.d.ts +43 -0
package/dist/toon.js +480 -0
package/dist/workspace-audit.js +4 -3
package/package.json +15 -2

package/dist/index.js CHANGED Viewed

@@ -3243,8 +3243,8 @@ var require_utils = __commonJS((exports, module) => {
     }
     return output.join("");
   }
-  function normalizeComponentEncoding(component, esc2) {
-    const func = esc2 !== true ? escape : unescape;
+  function normalizeComponentEncoding(component, esc3) {
+    const func = esc3 !== true ? escape : unescape;
     if (component.scheme !== undefined) {
       component.scheme = func(component.scheme);
     }
@@ -8146,7 +8146,8 @@ function detectProject(spec, inputPath) {
   const themeImportFiles = rootLayout && importsAppCss(rootLayout) ? [rootLayout, appCss] : [rootLayout];
   const defaultImported = hasAnyImport(themeImportFiles, spec.themeImports.default);
   const darkImported = hasAnyImport(themeImportFiles, spec.themeImports.dark);
-  const stepsNeeded = Number(!dependencyNames.has("@dryui/ui")) + Number(!defaultImported) + Number(!darkImported) + Number(!(appHtml && hasThemeAuto(appHtml)));
+  const themeAuto = appHtml ? hasThemeAuto(appHtml) : false;
+  const stepsNeeded = Number(!dependencyNames.has("@dryui/ui")) + Number(!defaultImported) + Number(!darkImported) + Number(!themeAuto);
   const warnings = [];
   if (!packageJsonPath)
     warnings.push("No package.json found above the provided path.");
@@ -8172,7 +8173,7 @@ function detectProject(spec, inputPath) {
     theme: {
       defaultImported,
       darkImported,
-      themeAuto: hasThemeAuto(appHtml)
+      themeAuto
     },
     warnings
   };
@@ -8243,7 +8244,7 @@ function planInstall(spec, inputPath) {
       title: "Set html theme mode to auto",
       description: 'In src/app.html, find the opening <html> tag (e.g. <html lang="en">) and add class="theme-auto" to it, preserving any existing attributes. Result should be like <html lang="en" class="theme-auto">. Do NOT add a second <html> element.',
       path: detection.files.appHtml,
-      snippet: '<html lang="en" class="theme-auto">'
+      snippet: 'class="theme-auto"'
     });
   }
   if (steps.length === 0) {
@@ -8773,6 +8774,582 @@ function formatSimple(name, def) {
 `);
 }
+// src/composition-search.ts
+var STOP_WORDS = new Set([
+  "a",
+  "an",
+  "the",
+  "and",
+  "or",
+  "but",
+  "in",
+  "on",
+  "at",
+  "to",
+  "for",
+  "of",
+  "with",
+  "by",
+  "from",
+  "is",
+  "it",
+  "that",
+  "this",
+  "as",
+  "be",
+  "are",
+  "was",
+  "were",
+  "been",
+  "has",
+  "have",
+  "had",
+  "do",
+  "does",
+  "did",
+  "will",
+  "would",
+  "could",
+  "should",
+  "may",
+  "might",
+  "can",
+  "i",
+  "me",
+  "my",
+  "we",
+  "our",
+  "you",
+  "your",
+  "need",
+  "want",
+  "like",
+  "create",
+  "make",
+  "build",
+  "add",
+  "using",
+  "use",
+  "show",
+  "display"
+]);
+function tokenize(text) {
+  return text.toLowerCase().replace(/[^a-z0-9]+/g, " ").split(/\s+/).filter((w) => w.length > 1 && !STOP_WORDS.has(w));
+}
+function scoreText(tokens, text) {
+  const lower = text.toLowerCase();
+  return tokens.reduce((score, t) => score + (lower.includes(t) ? 1 : 0), 0);
+}
+function searchComposition(composition, query) {
+  const q = query.toLowerCase();
+  const tokens = tokenize(query);
+  const exactComponentMatches = [];
+  const exactRecipeMatches = [];
+  for (const comp of Object.values(composition.components)) {
+    if (comp.component.toLowerCase().includes(q) || comp.useWhen.toLowerCase().includes(q) || comp.alternatives.some((a) => a.component.toLowerCase().includes(q) || a.useWhen.toLowerCase().includes(q)) || comp.antiPatterns.some((ap) => ap.pattern.toLowerCase().includes(q))) {
+      exactComponentMatches.push(comp);
+    }
+  }
+  for (const recipe of Object.values(composition.recipes)) {
+    if (recipe.name.toLowerCase().includes(q) || recipe.description.toLowerCase().includes(q) || recipe.tags.some((t) => t.toLowerCase().includes(q)) || recipe.components.some((c) => c.toLowerCase().includes(q))) {
+      exactRecipeMatches.push(recipe);
+    }
+  }
+  if (exactComponentMatches.length || exactRecipeMatches.length) {
+    return { componentMatches: exactComponentMatches, recipeMatches: exactRecipeMatches };
+  }
+  if (!tokens.length) {
+    return { componentMatches: [], recipeMatches: [] };
+  }
+  const scoredComponents = [];
+  for (const comp of Object.values(composition.components)) {
+    const corpus = [
+      comp.component,
+      comp.useWhen,
+      ...comp.alternatives.flatMap((a) => [a.component, a.useWhen]),
+      ...comp.antiPatterns.map((ap) => ap.pattern),
+      ...comp.combinesWith
+    ].join(" ");
+    const score = scoreText(tokens, corpus);
+    if (score > 0)
+      scoredComponents.push({ comp, score });
+  }
+  const scoredRecipes = [];
+  for (const recipe of Object.values(composition.recipes)) {
+    const corpus = [recipe.name, recipe.description, ...recipe.tags, ...recipe.components].join(" ");
+    const score = scoreText(tokens, corpus);
+    if (score > 0)
+      scoredRecipes.push({ recipe, score });
+  }
+  scoredComponents.sort((a, b) => b.score - a.score);
+  scoredRecipes.sort((a, b) => b.score - a.score);
+  const minScore = Math.max(1, Math.floor(tokens.length * 0.3));
+  return {
+    componentMatches: scoredComponents.filter((s) => s.score >= minScore).slice(0, 10).map((s) => s.comp),
+    recipeMatches: scoredRecipes.filter((s) => s.score >= minScore).slice(0, 5).map((s) => s.recipe)
+  };
+}
+function formatCompositionResult(results) {
+  const lines = [];
+  for (const comp of results.componentMatches) {
+    lines.push(`── ${comp.component} ──────────────────────────────`);
+    lines.push(`[DEV GUIDANCE — do not render as page content]`);
+    lines.push(`Use: ${comp.component} — ${comp.useWhen}`);
+    lines.push("");
+    for (const alt of comp.alternatives) {
+      lines.push(`  ${alt.rank}. ${alt.component} (${alt.useWhen})`);
+      lines.push(alt.snippet.split(`
+`).map((l) => `     ${l}`).join(`
+`));
+      lines.push("");
+    }
+    for (const ap of comp.antiPatterns) {
+      lines.push(`⚠ Anti-pattern: ${ap.pattern}`);
+      lines.push(`  Why: ${ap.reason}`);
+      lines.push(`  Use ${ap.fix} instead`);
+      lines.push("");
+    }
+    if (comp.combinesWith.length) {
+      lines.push(`Combines with: ${comp.combinesWith.join(", ")}`);
+    }
+    lines.push("");
+  }
+  for (const recipe of results.recipeMatches) {
+    lines.push(`── Recipe: ${recipe.name} ──────────────────────────────`);
+    lines.push(`[DEV GUIDANCE — do not render as page content]`);
+    lines.push(recipe.description);
+    lines.push(`Components: ${recipe.components.join(", ")}`);
+    lines.push("");
+    lines.push(`[CODE — use this in your Svelte file]`);
+    lines.push(recipe.snippet);
+    lines.push("");
+  }
+  return lines.join(`
+`);
+}
+// src/toon.ts
+function esc(value) {
+  if (value.includes(",") || value.includes(`
+`)) {
+    return `"${value.replace(/"/g, '""')}"`;
+  }
+  return value;
+}
+function header(resource, count, fields) {
+  return `${resource}[${count}]{${fields.join(",")}}:`;
+}
+function row(...values) {
+  return "  " + values.map((v) => esc(String(v))).join(",");
+}
+function truncate(text, maxLen, hint) {
+  if (text.length <= maxLen)
+    return text;
+  return `(truncated, ${text.length} chars -- ${hint})`;
+}
+function buildContextualHelp(ctx) {
+  const hints = [];
+  switch (ctx.command) {
+    case "info":
+      if (ctx.componentName) {
+        hints.push(`compose "${ctx.componentName.toLowerCase()}" -- see composition patterns`);
+        hints.push(`add ${ctx.componentName} -- get starter snippet`);
+      }
+      break;
+    case "list":
+      hints.push("info <Component> -- see full API reference");
+      break;
+    case "compose":
+      if (ctx.componentName) {
+        hints.push(`info ${ctx.componentName} -- full API reference`);
+        hints.push(`add ${ctx.componentName} -- starter snippet`);
+      }
+      break;
+    case "review":
+      if (ctx.hasErrors) {
+        hints.push("info <Component> -- check API for errored component");
+        hints.push("diagnose <file.css> -- check theme if theme warnings present");
+      } else if (ctx.isEmpty) {
+        hints.push("lint . -- check entire workspace");
+      }
+      break;
+    case "diagnose":
+      if (ctx.hasErrors) {
+        hints.push('compose "app shell" -- get correct theme setup');
+      } else if (ctx.isEmpty) {
+        hints.push("review <file.svelte> -- validate component usage");
+      }
+      break;
+    case "doctor":
+    case "lint":
+      if (ctx.hasFindings) {
+        hints.push("lint --max-severity error -- focus on errors only");
+        hints.push("review <file.svelte> -- check specific file");
+      } else if (ctx.isEmpty) {
+        hints.push("detect -- verify project setup");
+      }
+      break;
+    case "detect":
+      if (ctx.status === "partial" || ctx.status === "unsupported") {
+        hints.push("install -- see step-by-step setup plan");
+      } else if (ctx.status === "ready") {
+        hints.push("list -- see available components");
+        hints.push('compose "app shell" -- get root layout template');
+      }
+      break;
+    case "install":
+      hints.push("detect -- verify project after completing steps");
+      break;
+  }
+  return hints;
+}
+function formatHelp(hints) {
+  if (hints.length === 0)
+    return "";
+  const lines = [`next[${hints.length}]:`];
+  for (const hint of hints) {
+    lines.push("  " + hint);
+  }
+  return lines.join(`
+`);
+}
+function toonComponent(name, def, opts) {
+  const full = opts?.full ?? false;
+  const lines = [];
+  lines.push(`${name} -- ${def.description}`, `category: ${def.category} | tags: ${def.tags.join(",")}`, `import: import { ${name} } from '${def.import}'`, `compound: ${def.compound}`);
+  if (def.compound && def.structure?.tree.length) {
+    lines.push("", header("structure", def.structure.tree.length, ["node"]));
+    for (const node of def.structure.tree) {
+      lines.push("  " + node);
+    }
+    if (def.structure.note)
+      lines.push(`  note: ${def.structure.note}`);
+  }
+  if (def.compound && def.parts) {
+    const partEntries = Object.entries(def.parts);
+    lines.push("", header("parts", partEntries.length, ["part"]));
+    for (const [partName, partDef] of partEntries) {
+      lines.push(`  ${name}.${partName}`);
+      const props = Object.entries(partDef.props ?? {});
+      if (props.length > 0) {
+        for (const [propName, propDef] of props) {
+          const flags = [propDef.type];
+          if (propDef.required)
+            flags.push("required");
+          if (propDef.default !== undefined)
+            flags.push(`default:${propDef.default}`);
+          if (propDef.acceptedValues?.length)
+            flags.push(`values:${propDef.acceptedValues.join("|")}`);
+          lines.push(`    ${propName}: ${flags.join(" | ")}`);
+        }
+      }
+    }
+  } else if (def.props) {
+    const propEntries = Object.entries(def.props);
+    if (propEntries.length > 0) {
+      lines.push("", header("props", propEntries.length, ["name", "type", "required", "default"]));
+      for (const [propName, propDef] of propEntries) {
+        lines.push(row(propName, propDef.type, propDef.required ? "yes" : "no", propDef.default ?? "-"));
+      }
+    }
+  }
+  const cssEntries = Object.entries(def.cssVars);
+  if (cssEntries.length > 0) {
+    lines.push("", header("css-vars", cssEntries.length, ["name", "description"]));
+    for (const [varName, desc] of cssEntries) {
+      lines.push(row(varName, desc));
+    }
+  }
+  if (def.dataAttributes.length > 0) {
+    lines.push("", header("data-attrs", def.dataAttributes.length, ["name", "values"]));
+    for (const attr of def.dataAttributes) {
+      lines.push(row(attr.name, attr.values?.join("|") ?? "-"));
+    }
+  }
+  if (def.example) {
+    const example = full ? def.example : truncate(def.example, 400, `use add ${name} for full snippet`);
+    lines.push("", "example:", example);
+  }
+  const help = buildContextualHelp({ command: "info", componentName: name });
+  if (help.length > 0) {
+    lines.push("", formatHelp(help));
+  }
+  return lines.join(`
+`);
+}
+function toonComponentList(components, category) {
+  const entries = Object.entries(components);
+  const filtered = category ? entries.filter(([, def]) => def.category.toLowerCase() === category.toLowerCase()) : entries;
+  if (filtered.length === 0) {
+    const cats = [...new Set(entries.map(([, d]) => d.category))].sort();
+    return `components[0]: no matches
+available categories: ${cats.join(", ")}`;
+  }
+  const groups = {};
+  for (const entry of filtered) {
+    const cat = entry[1].category;
+    (groups[cat] ??= []).push(entry);
+  }
+  const lines = [header("components", filtered.length, ["name", "category", "compound", "description"])];
+  const sortedCats = Object.keys(groups).sort();
+  for (const cat of sortedCats) {
+    const items = groups[cat] ?? [];
+    for (const [name, def] of items) {
+      lines.push(row(name, cat, def.compound, def.description));
+    }
+  }
+  const help = buildContextualHelp({ command: "list" });
+  if (help.length > 0) {
+    lines.push("", formatHelp(help));
+  }
+  return lines.join(`
+`);
+}
+function toonComposition(results, opts) {
+  const full = opts?.full ?? false;
+  const lines = [];
+  const totalMatches = results.componentMatches.length + results.recipeMatches.length;
+  if (totalMatches === 0) {
+    return "matches[0]: none";
+  }
+  for (const comp of results.componentMatches) {
+    lines.push(`-- ${comp.component}: ${comp.useWhen}`);
+    for (const alt of comp.alternatives) {
+      const snippet = full ? alt.snippet : truncate(alt.snippet, 500, `use info ${alt.component} for full snippet`);
+      lines.push(`  ${alt.rank}. ${alt.component} (${alt.useWhen})`);
+      lines.push(snippet.split(`
+`).map((l) => "     " + l).join(`
+`));
+    }
+    for (const ap of comp.antiPatterns) {
+      lines.push(`  anti-pattern: ${ap.pattern}`);
+      lines.push(`    reason: ${ap.reason} | fix: ${ap.fix}`);
+    }
+    if (comp.combinesWith.length) {
+      lines.push(`  combines-with: ${comp.combinesWith.join(",")}`);
+    }
+    lines.push("");
+  }
+  for (const recipe of results.recipeMatches) {
+    const snippet = full ? recipe.snippet : truncate(recipe.snippet, 500, `use compose "${recipe.name}" --full for complete code`);
+    lines.push(`-- recipe: ${recipe.name}`);
+    lines.push(`  ${recipe.description}`);
+    lines.push(`  components: ${recipe.components.join(",")}`);
+    lines.push("  code:");
+    lines.push(snippet.split(`
+`).map((l) => "    " + l).join(`
+`));
+    lines.push("");
+  }
+  const firstComponent = results.componentMatches[0]?.alternatives[0]?.component ?? results.recipeMatches[0]?.components[0] ?? undefined;
+  const ctx = { command: "compose" };
+  if (firstComponent)
+    ctx.componentName = firstComponent;
+  const help = buildContextualHelp(ctx);
+  if (help.length > 0) {
+    lines.push(formatHelp(help));
+  }
+  return lines.join(`
+`).trimEnd();
+}
+function toonReviewResult(result) {
+  const lines = [];
+  const hasBlockers = result.issues.some((i) => i.severity === "error");
+  const autoFixable = result.issues.filter((i) => i.fix !== null).length;
+  if (result.issues.length === 0) {
+    lines.push("issues[0]: clean");
+    lines.push(`hasBlockers: false | autoFixable: 0`);
+  } else {
+    lines.push(header("issues", result.issues.length, ["severity", "line", "code", "message"]));
+    for (const issue of result.issues) {
+      lines.push(row(issue.severity, issue.line, issue.code, issue.message));
+      if (issue.fix) {
+        lines.push(`    fix: ${issue.fix}`);
+      }
+    }
+    lines.push(`hasBlockers: ${hasBlockers} | autoFixable: ${autoFixable}`);
+  }
+  lines.push(result.summary);
+  const help = buildContextualHelp({
+    command: "review",
+    hasErrors: hasBlockers,
+    isEmpty: result.issues.length === 0
+  });
+  if (help.length > 0) {
+    lines.push("", formatHelp(help));
+  }
+  return lines.join(`
+`);
+}
+function toonDiagnoseResult(result) {
+  const lines = [];
+  const { variables } = result;
+  const missingCount = result.issues.filter((i) => i.code === "missing-token").length;
+  const totalRequired = variables.required + missingCount;
+  const coverage = totalRequired > 0 ? Math.round(variables.required / totalRequired * 100) : 100;
+  lines.push(`tokens: ${variables.found} found, ${variables.required} required, ${variables.extra} extra | coverage: ${coverage}%`);
+  if (result.issues.length === 0) {
+    lines.push("issues[0]: clean");
+  } else {
+    lines.push(header("issues", result.issues.length, ["severity", "code", "variable", "message"]));
+    for (const issue of result.issues) {
+      lines.push(row(issue.severity, issue.code, issue.variable, issue.message));
+      if (issue.fix) {
+        lines.push(`    fix: ${issue.fix}`);
+      }
+    }
+  }
+  lines.push(result.summary);
+  const hasErrors = result.issues.some((i) => i.severity === "error");
+  const help = buildContextualHelp({
+    command: "diagnose",
+    hasErrors,
+    isEmpty: result.issues.length === 0
+  });
+  if (help.length > 0) {
+    lines.push("", formatHelp(help));
+  }
+  return lines.join(`
+`);
+}
+var MAX_FINDINGS_DEFAULT = 50;
+function toonWorkspaceReport(report, opts) {
+  const full = opts?.full ?? false;
+  const title = opts?.title ?? "workspace";
+  const command = opts?.command ?? (title.includes("lint") ? "lint" : "doctor");
+  const lines = [];
+  lines.push(`${title} | root: ${report.root}`);
+  lines.push(`scanned: ${report.scannedFiles} files | errors: ${report.summary.error} | warnings: ${report.summary.warning} | info: ${report.summary.info}`);
+  if (report.summary.byRule && Object.keys(report.summary.byRule).length > 0) {
+    const sorted = Object.entries(report.summary.byRule).sort(([, a], [, b]) => b - a);
+    const topRule = sorted[0];
+    if (topRule) {
+      lines.push(`top-rule: ${topRule[0]} (${topRule[1]} occurrences)`);
+    }
+  }
+  if (report.findings.length === 0) {
+    lines.push("findings[0]: clean");
+  } else {
+    const findings = full ? report.findings : report.findings.slice(0, MAX_FINDINGS_DEFAULT);
+    const truncated = !full && report.findings.length > MAX_FINDINGS_DEFAULT;
+    lines.push(header("findings", findings.length, ["severity", "rule", "file", "line", "message"]));
+    for (const f of findings) {
+      lines.push(row(f.severity, f.ruleId, f.file, f.line ?? "-", f.message));
+      if (f.suggestedFixes.length > 0) {
+        for (const fix of f.suggestedFixes) {
+          lines.push(`    fix: ${fix.description}${fix.replacement ? ` -> ${fix.replacement}` : ""}`);
+        }
+      }
+    }
+    if (truncated) {
+      lines.push(`  (showing ${MAX_FINDINGS_DEFAULT} of ${report.findings.length} -- use --full to see all)`);
+    }
+  }
+  if (report.warnings.length > 0) {
+    lines.push("", header("warnings", report.warnings.length, ["message"]));
+    for (const w of report.warnings) {
+      lines.push("  " + w);
+    }
+  }
+  const help = buildContextualHelp({
+    command,
+    hasFindings: report.findings.length > 0,
+    isEmpty: report.findings.length === 0
+  });
+  if (help.length > 0) {
+    lines.push("", formatHelp(help));
+  }
+  return lines.join(`
+`);
+}
+function toonProjectDetection(detection) {
+  const lines = [];
+  lines.push(`project: ${detection.status} | framework: ${detection.framework} | pkg-manager: ${detection.packageManager}`);
+  lines.push(`root: ${detection.root ?? "(not found)"}`);
+  lines.push(`deps: ui=${detection.dependencies.ui}, primitives=${detection.dependencies.primitives}`);
+  lines.push(`theme: default=${detection.theme.defaultImported}, dark=${detection.theme.darkImported}, auto=${detection.theme.themeAuto}`);
+  if (detection.warnings.length > 0) {
+    lines.push(header("warnings", detection.warnings.length, ["message"]));
+    for (const w of detection.warnings) {
+      lines.push("  " + w);
+    }
+  }
+  const help = buildContextualHelp({ command: "detect", status: detection.status });
+  if (help.length > 0) {
+    lines.push("", formatHelp(help));
+  }
+  return lines.join(`
+`);
+}
+function toonStep(step, index) {
+  const parts = [`${index + 1}. [${step.status}] ${step.title}: ${step.description}`];
+  if (step.command)
+    parts.push(`   cmd: ${step.command}`);
+  if (step.path)
+    parts.push(`   file: ${step.path}`);
+  return parts.join(`
+`);
+}
+function toonInstallPlan(plan) {
+  const lines = [];
+  lines.push(toonProjectDetection(plan.detection));
+  lines.push("");
+  if (plan.steps.length === 0) {
+    lines.push("steps[0]: none needed");
+  } else {
+    lines.push(header("steps", plan.steps.length, ["status", "title", "description"]));
+    for (const [i, step] of plan.steps.entries()) {
+      lines.push(toonStep(step, i));
+    }
+  }
+  const help = buildContextualHelp({ command: "install" });
+  if (help.length > 0) {
+    lines.push("", formatHelp(help));
+  }
+  return lines.join(`
+`);
+}
+function toonAddPlan(plan) {
+  const lines = [];
+  lines.push(`add: ${plan.name} | target: ${plan.target ?? "(choose)"}`);
+  if (plan.importStatement) {
+    lines.push(`import: ${plan.importStatement}`);
+  }
+  lines.push("");
+  if (plan.installPlan.steps.length > 0) {
+    lines.push(header("install-steps", plan.installPlan.steps.length, ["status", "title"]));
+    for (const [i, step] of plan.installPlan.steps.entries()) {
+      lines.push(toonStep(step, i));
+    }
+    lines.push("");
+  }
+  if (plan.steps.length > 0) {
+    lines.push(header("add-steps", plan.steps.length, ["status", "title"]));
+    for (const [i, step] of plan.steps.entries()) {
+      lines.push(toonStep(step, i));
+    }
+  }
+  if (plan.warnings.length > 0) {
+    lines.push("", header("warnings", plan.warnings.length, ["message"]));
+    for (const w of plan.warnings) {
+      lines.push("  " + w);
+    }
+  }
+  return lines.join(`
+`);
+}
+function toonError(code, message, suggestions) {
+  const lines = [`error[1]{code,message}: ${esc(code)},${esc(message)}`];
+  if (suggestions?.length) {
+    lines.push(header("suggestions", suggestions.length, ["value"]));
+    for (const s of suggestions) {
+      lines.push("  " + s);
+    }
+  }
+  return lines.join(`
+`);
+}
 // ../../node_modules/.bun/zod@4.3.6/node_modules/zod/v3/helpers/util.js
 var util;
 (function(util2) {
@@ -9639,10 +10216,10 @@ function isValidJWT(jwt, alg) {
   if (!jwtRegex.test(jwt))
     return false;
   try {
-    const [header] = jwt.split(".");
-    if (!header)
+    const [header2] = jwt.split(".");
+    if (!header2)
       return false;
-    const base64 = header.replace(/-/g, "+").replace(/_/g, "/").padEnd(header.length + (4 - header.length % 4) % 4, "=");
+    const base64 = header2.replace(/-/g, "+").replace(/_/g, "/").padEnd(header2.length + (4 - header2.length % 4) % 4, "=");
     const decoded = JSON.parse(atob(base64));
     if (typeof decoded !== "object" || decoded === null)
       return false;
@@ -12981,7 +13558,7 @@ __export(exports_util, {
   finalizeIssue: () => finalizeIssue,
   extend: () => extend,
   escapeRegex: () => escapeRegex,
-  esc: () => esc,
+  esc: () => esc2,
   defineLazy: () => defineLazy,
   createTransparentProxy: () => createTransparentProxy,
   cloneDef: () => cloneDef,
@@ -13132,7 +13709,7 @@ function randomString(length = 10) {
   }
   return str;
 }
-function esc(str) {
+function esc2(str) {
   return JSON.stringify(str);
 }
 function slugify(input) {
@@ -14961,10 +15538,10 @@ function isValidJWT2(token, algorithm = null) {
     const tokensParts = token.split(".");
     if (tokensParts.length !== 3)
       return false;
-    const [header] = tokensParts;
-    if (!header)
+    const [header2] = tokensParts;
+    if (!header2)
       return false;
-    const parsedHeader = JSON.parse(atob(header));
+    const parsedHeader = JSON.parse(atob(header2));
     if ("typ" in parsedHeader && parsedHeader?.typ !== "JWT")
       return false;
     if (!parsedHeader.alg)
@@ -15358,7 +15935,7 @@ var $ZodObjectJIT = /* @__PURE__ */ $constructor("$ZodObjectJIT", (inst, def) =>
     const doc = new Doc(["shape", "payload", "ctx"]);
     const normalized = _normalized.value;
     const parseStr = (key) => {
-      const k = esc(key);
+      const k = esc2(key);
       return `shape[${k}]._zod.run({ value: input[${k}], issues: [] }, ctx)`;
     };
     doc.write(`const input = payload.value;`);
@@ -15370,7 +15947,7 @@ var $ZodObjectJIT = /* @__PURE__ */ $constructor("$ZodObjectJIT", (inst, def) =>
     doc.write(`const newResult = {};`);
     for (const key of normalized.keys) {
       const id = ids[key];
-      const k = esc(key);
+      const k = esc2(key);
       const schema = shape[key];
       const isOptionalOut = schema?._zod?.optout === "optional";
       doc.write(`const ${id} = ${parseStr(key)};`);
@@ -30688,11 +31265,14 @@ function toolError(e) {
 var SERVER_INSTRUCTIONS = [
   "DryUI is a zero-dependency Svelte 5 component library. Follow these rules:",
   "",
+  "OUTPUT FORMAT: All tool responses use TOON (token-optimized) format. Each response ends with",
+  "  `next[]` suggesting logical next commands. Empty results show `issues[0]: clean` or similar.",
+  "",
   '1. SET UP THE APP SHELL FIRST: Run `compose "app shell"` to get the root layout template.',
   '   Your +layout.svelte must import the theme CSS, and app.html needs <html class="theme-auto">.',
   "",
-  "2. PAGE LAYOUT: Use PageHeader.Root + Container + Stack for page structure.",
-  "   This gives you a header, constrained content width, and vertical rhythm.",
+  "2. PAGE LAYOUT: Use CSS grid for layout — not flexbox. Use Container for constrained content",
+  "   width. Use `@container` queries for responsive sizing (never `@media` for layout).",
   "",
   "3. CORRECT CSS TOKENS: Background is --dry-color-bg-base (not --dry-color-bg).",
   '   Text is --dry-color-text-strong (not --dry-color-text). See compose "app shell" for the full reset.',
@@ -30704,10 +31284,9 @@ var SERVER_INSTRUCTIONS = [
   "   the compose tool are instructions for YOU, not content for the page. Never render them as",
   "   visible text in the UI. Only use the code snippets from compose output.",
   "",
-  "6. USE DRYUI LAYOUT COMPONENTS, NOT CUSTOM CSS: Grid instead of `display: grid`, Flex instead",
-  "   of `display: flex`, Stack instead of vertical flex. Use Field.Root + Label for form fields,",
-  "   Button instead of raw `<button>`. Never write custom CSS for layout, spacing, or form",
-  "   structure when a DryUI component exists."
+  "6. USE DRYUI COMPONENTS FOR UI ELEMENTS: Use Field.Root + Label for form fields, Button instead",
+  "   of raw `<button>`, Separator instead of `<hr>`. Always call `info` or `compose` to check",
+  "   if a DryUI component exists before writing raw HTML."
 ].join(`
 `);
 var server = new McpServer({ name: "@dryui/mcp", version: version2 }, {
@@ -30729,7 +31308,7 @@ var REVIEW_DESC = [
   `- **Suggestions:** Manual flex/grid where DryUI layout components apply, hardcoded colors, raw <hr> instead of <Separator>
 `,
-  `Output: JSON with issues array and summary. When projectCss is provided, theme diagnosis results are included.
+  `Output: TOON format with issues, hasBlockers/autoFixable aggregates, and next-step suggestions. When projectCss is provided, theme diagnosis results are appended.
 `,
   `Example:
@@ -30753,25 +31332,7 @@ var REVIEW_DESC = [
   `Output:
 `,
-  `\`\`\`json
-{
-  "issues": [
-    {
-      "severity": "error",
-      "code": "bare-compound",
-      "message": "Card is a compound component — use <Card.Root> instead of <Card>",
-      "line": 5
-    },
-    {
-      "severity": "suggestion",
-      "code": "prefer-separator",
-      "message": "Use <Separator /> instead of raw <hr>",
-      "line": 11
-    }
-  ],
-  "summary": "1 error, 0 warnings, 1 suggestion"
-}
-\`\`\``
+  "```\nissues[2]{severity,line,code,message}:\n  error,5,bare-compound,Card is a compound component — use <Card.Root> instead of <Card>\n  suggestion,11,prefer-separator,Use <Separator /> instead of raw <hr>\nhasBlockers: true | autoFixable: 0\n1 error, 0 warnings, 1 suggestion\n```"
 ].join(`
 `);
 var DIAGNOSE_DESC = [
@@ -30797,7 +31358,7 @@ var DIAGNOSE_DESC = [
   `- To validate a custom theme before shipping
 `,
-  `Output: JSON with variables summary, issues array (severity + code + variable + message + fix), and summary string.
+  `Output: TOON format with token coverage percentage, issues, and next-step suggestions.
 `,
   `Example:
@@ -30824,18 +31385,15 @@ server.tool("review", REVIEW_DESC, {
     const spec = getSpec();
     const parts = [];
     const result = reviewComponent(code, spec, filename);
-    parts.push({ type: "text", text: JSON.stringify(result, null, 2) });
+    parts.push({ type: "text", text: toonReviewResult(result) });
     if (projectCss) {
       const diagnosis = diagnoseTheme(projectCss, spec);
       if (diagnosis.issues.length > 0) {
         parts.push({
           type: "text",
           text: `
 --- THEME DIAGNOSIS ---
-The project CSS has issues that will affect how DryUI components render:
-` + JSON.stringify(diagnosis, null, 2)
+` + toonDiagnoseResult(diagnosis)
         });
       }
     }
@@ -30863,7 +31421,7 @@ server.tool("diagnose", DIAGNOSE_DESC, {
       };
     }
     const result = diagnoseTheme(content, getSpec());
-    return { content: [{ type: "text", text: JSON.stringify(result, null, 2) }] };
+    return { content: [{ type: "text", text: toonDiagnoseResult(result) }] };
   } catch (e) {
     return toolError(e);
   }
@@ -30874,7 +31432,7 @@ var DETECT_PROJECT_DESC = [
 `,
   `Input: Optional cwd or project path.
 `,
-  `Output: JSON describing framework, package manager, DryUI dependencies, theme imports, theme-auto status, key file paths, and warnings.
+  `Output: TOON format with project status, framework, deps, theme state, and next-step suggestions.
 `,
   "Use this before planning installation or project-aware component adoption."
@@ -30884,7 +31442,7 @@ server.tool("detect_project", DETECT_PROJECT_DESC, {
 }, async ({ cwd }) => {
   try {
     const result = detectProject(getSpec(), cwd);
-    return { content: [{ type: "text", text: JSON.stringify(result, null, 2) }] };
+    return { content: [{ type: "text", text: toonProjectDetection(result) }] };
   } catch (e) {
     return toolError(e);
   }
@@ -30895,7 +31453,7 @@ var PLAN_INSTALL_DESC = [
 `,
   `Input: Optional cwd or project path.
 `,
-  `Output: JSON with project detection plus ordered install steps. The result never mutates files.
+  `Output: TOON format with project detection plus ordered install steps. The result never mutates files.
 `,
   "Use this to prepare a repo for DryUI before inserting components."
@@ -30905,7 +31463,7 @@ server.tool("plan_install", PLAN_INSTALL_DESC, {
 }, async ({ cwd }) => {
   try {
     const result = planInstall(getSpec(), cwd);
-    return { content: [{ type: "text", text: JSON.stringify(result, null, 2) }] };
+    return { content: [{ type: "text", text: toonInstallPlan(result) }] };
   } catch (e) {
     return toolError(e);
   }
@@ -30916,7 +31474,7 @@ var PLAN_ADD_DESC = [
 `,
   `Input: Component/composed-output name plus optional cwd, target file path, subpath flag, and withTheme flag.
 `,
-  `Output: JSON with install prerequisites, chosen import/source, target suggestions, and next steps. The result never mutates files.
+  `Output: TOON format with install prerequisites, chosen import/source, target suggestions, and next steps. The result never mutates files.
 `,
   "Use this when an agent needs project-aware adoption guidance without editing the repo directly."
@@ -30936,7 +31494,7 @@ server.tool("plan_add", PLAN_ADD_DESC, {
       ...withTheme !== undefined ? { withTheme } : {}
     };
     const result = planAdd(getSpec(), name, options);
-    return { content: [{ type: "text", text: JSON.stringify(result, null, 2) }] };
+    return { content: [{ type: "text", text: toonAddPlan(result) }] };
   } catch (e) {
     return toolError(e);
   }
@@ -30949,7 +31507,7 @@ var DOCTOR_DESC = [
 `,
   `Input: Optional cwd/path plus include/exclude globs, maxSeverity, and changed-only filtering.
 `,
-  `Output: JSON WorkspaceReport with detected projects, ordered findings, summary counts, and scan warnings.
+  `Output: TOON format with top-rule aggregate, findings (capped at 50, use --full for all), and next-step suggestions.
 `,
   "Use this for repo-wide health summaries across Svelte files, theme CSS, and project setup."
@@ -30969,7 +31527,7 @@ server.tool("doctor", DOCTOR_DESC, {
       ...maxSeverity ? { maxSeverity } : {},
       ...changed !== undefined ? { changed } : {}
     });
-    return { content: [{ type: "text", text: JSON.stringify(result, null, 2) }] };
+    return { content: [{ type: "text", text: toonWorkspaceReport(result, { title: "doctor", command: "doctor" }) }] };
   } catch (e) {
     return toolError(e);
   }
@@ -30980,7 +31538,7 @@ var LINT_DESC = [
 `,
   `Input: Optional cwd/path plus include/exclude globs, maxSeverity, and changed-only filtering.
 `,
-  `Output: JSON WorkspaceReport with sorted findings that can be consumed by scripts or agents.
+  `Output: TOON format with sorted findings (capped at 50) and next-step suggestions.
 `,
   "Use this when you need machine-oriented DryUI audit output for CI or automation."
@@ -31000,7 +31558,7 @@ server.tool("lint", LINT_DESC, {
       ...maxSeverity ? { maxSeverity } : {},
       ...changed !== undefined ? { changed } : {}
     });
-    return { content: [{ type: "text", text: JSON.stringify(result, null, 2) }] };
+    return { content: [{ type: "text", text: toonWorkspaceReport(result, { title: "lint", command: "lint" }) }] };
   } catch (e) {
     return toolError(e);
   }
@@ -31014,10 +31572,7 @@ var INFO_DESC = [
 `,
   `Input: Component name (case-insensitive, e.g. "Button", "card").
 `,
-  "Output: Formatted text showing name, description, category, tags, import statement, ",
-  "whether it is compound or simple, root and subpath imports when available, all props ",
-  "(with type, accepted values when known, required, bindable, default, and notes), native/rest-prop forwarding, ",
-  `compound structure guidance, CSS variables, data attributes, and example code.
+  `Output: TOON format with props, structure, CSS vars, data attributes, truncated example, and next-step suggestions.
 `,
   "Use this tool to understand what the component supports before generating code."
@@ -31044,8 +31599,7 @@ Available components:
       };
     }
     const { name: canonical, def } = result;
-    const output = def.compound ? formatCompound(canonical, def) : formatSimple(canonical, def);
-    return { content: [{ type: "text", text: output }] };
+    return { content: [{ type: "text", text: toonComponent(canonical, def) }] };
   } catch (e) {
     return toolError(e);
   }
@@ -31056,7 +31610,7 @@ var LIST_DESC = [
 `,
   `Input: Optional category name to filter results.
 `,
-  `Output: Components grouped by category.
+  `Output: TOON format with components listed as name, category, compound, description.
 `,
   "Use this tool to discover which components are available before looking up details with the info tool."
@@ -31066,42 +31620,7 @@ server.tool("list", LIST_DESC, {
 }, async ({ category }) => {
   try {
     const components = getComponents();
-    const entries = Object.entries(components);
-    const groups = {};
-    for (const [name, def] of entries) {
-      const cat = def.category;
-      if (category && cat.toLowerCase() !== category.toLowerCase())
-        continue;
-      (groups[cat] ??= []).push({ name, description: def.description });
-    }
-    if (Object.keys(groups).length === 0) {
-      const allCats = [...new Set(entries.map(([, d]) => d.category))].sort();
-      return {
-        content: [
-          {
-            type: "text",
-            text: `No components found for category: "${category}"
-Available categories:
-  ${allCats.join(", ")}`
-          }
-        ],
-        isError: true
-      };
-    }
-    const lines = [];
-    const sortedCats = Object.keys(groups).sort();
-    for (const cat of sortedCats) {
-      const items = groups[cat] ?? [];
-      lines.push(`${cat.toUpperCase()}`);
-      const maxNameLen = Math.max(...items.map((c) => c.name.length));
-      for (const item of items) {
-        lines.push(`  ${pad(item.name, maxNameLen + 2)}${item.description}`);
-      }
-      lines.push("");
-    }
-    return { content: [{ type: "text", text: lines.join(`
-`).trimEnd() }] };
+    return { content: [{ type: "text", text: toonComponentList(components, category) }] };
   } catch (e) {
     return toolError(e);
   }
@@ -31110,7 +31629,7 @@ var COMPOSE_DESC = [
   `Look up composition guidance for building UIs with DryUI.
 `,
-  `Returns ranked component alternatives with code snippets, anti-patterns to avoid, and full composition recipes.
+  `Returns ranked component alternatives with truncated code snippets, anti-patterns to avoid, and composition recipes in TOON format.
 `,
   `Call this BEFORE writing any DryUI layout to ensure correct component selection.
@@ -31126,177 +31645,12 @@ var COMPOSE_DESC = [
 `,
   "Output: Ranked alternatives with snippets, anti-patterns, and matching recipes."
 ].join("");
-var STOP_WORDS = new Set([
-  "a",
-  "an",
-  "the",
-  "and",
-  "or",
-  "but",
-  "in",
-  "on",
-  "at",
-  "to",
-  "for",
-  "of",
-  "with",
-  "by",
-  "from",
-  "is",
-  "it",
-  "that",
-  "this",
-  "as",
-  "be",
-  "are",
-  "was",
-  "were",
-  "been",
-  "has",
-  "have",
-  "had",
-  "do",
-  "does",
-  "did",
-  "will",
-  "would",
-  "could",
-  "should",
-  "may",
-  "might",
-  "can",
-  "i",
-  "me",
-  "my",
-  "we",
-  "our",
-  "you",
-  "your",
-  "need",
-  "want",
-  "like",
-  "create",
-  "make",
-  "build",
-  "add",
-  "using",
-  "use",
-  "show",
-  "display"
-]);
-function tokenize(text) {
-  return text.toLowerCase().replace(/[^a-z0-9]+/g, " ").split(/\s+/).filter((w) => w.length > 1 && !STOP_WORDS.has(w));
-}
-function scoreText(tokens, text) {
-  const lower = text.toLowerCase();
-  return tokens.reduce((score, t) => score + (lower.includes(t) ? 1 : 0), 0);
-}
 function findComposition(query) {
   const compositionData = getSpec().composition;
   if (!compositionData)
-    return {
-      componentMatches: [],
-      recipeMatches: []
-    };
-  const q = query.toLowerCase();
-  const tokens = tokenize(query);
-  const exactComponentMatches = [];
-  const exactRecipeMatches = [];
-  for (const comp of Object.values(compositionData.components)) {
-    if (comp.component.toLowerCase().includes(q) || comp.useWhen.toLowerCase().includes(q) || comp.alternatives.some((a) => a.component.toLowerCase().includes(q) || a.useWhen.toLowerCase().includes(q)) || comp.antiPatterns.some((ap) => ap.pattern.toLowerCase().includes(q))) {
-      exactComponentMatches.push(comp);
-    }
-  }
-  for (const recipe of Object.values(compositionData.recipes)) {
-    if (recipe.name.toLowerCase().includes(q) || recipe.description.toLowerCase().includes(q) || recipe.tags.some((t) => t.toLowerCase().includes(q)) || recipe.components.some((c) => c.toLowerCase().includes(q))) {
-      exactRecipeMatches.push(recipe);
-    }
-  }
-  if (exactComponentMatches.length || exactRecipeMatches.length) {
-    return { componentMatches: exactComponentMatches, recipeMatches: exactRecipeMatches };
-  }
-  if (!tokens.length)
-    return {
-      componentMatches: [],
-      recipeMatches: []
-    };
-  const scoredComponents = [];
-  for (const comp of Object.values(compositionData.components)) {
-    const corpus = [
-      comp.component,
-      comp.useWhen,
-      ...comp.alternatives.flatMap((a) => [a.component, a.useWhen]),
-      ...comp.antiPatterns.map((ap) => ap.pattern),
-      ...comp.combinesWith
-    ].join(" ");
-    const score = scoreText(tokens, corpus);
-    if (score > 0)
-      scoredComponents.push({ comp, score });
-  }
-  const scoredRecipes = [];
-  for (const recipe of Object.values(compositionData.recipes)) {
-    const corpus = [recipe.name, recipe.description, ...recipe.tags, ...recipe.components].join(" ");
-    const score = scoreText(tokens, corpus);
-    if (score > 0)
-      scoredRecipes.push({ recipe, score });
-  }
-  scoredComponents.sort((a, b) => b.score - a.score);
-  scoredRecipes.sort((a, b) => b.score - a.score);
-  const minScore = Math.max(1, Math.floor(tokens.length * 0.3));
-  return {
-    componentMatches: scoredComponents.filter((s) => s.score >= minScore).slice(0, 10).map((s) => s.comp),
-    recipeMatches: scoredRecipes.filter((s) => s.score >= minScore).slice(0, 5).map((s) => s.recipe)
-  };
-}
-function formatCompositionResult(results) {
-  const lines = [];
-  for (const comp of results.componentMatches) {
-    lines.push(`── ${comp.component} ──────────────────────────────`);
-    lines.push(`[DEV GUIDANCE — do not render as page content]`);
-    lines.push(`Use: ${comp.component} — ${comp.useWhen}`);
-    lines.push("");
-    for (const alt of comp.alternatives) {
-      lines.push(`  ${alt.rank}. ${alt.component} (${alt.useWhen})`);
-      lines.push(alt.snippet.split(`
-`).map((l) => `     ${l}`).join(`
-`));
-      lines.push("");
-    }
-    for (const ap of comp.antiPatterns) {
-      lines.push(`⚠ Anti-pattern: ${ap.pattern}`);
-      lines.push(`  Why: ${ap.reason}`);
-      lines.push(`  Use ${ap.fix} instead`);
-      lines.push("");
-    }
-    if (comp.combinesWith.length) {
-      lines.push(`Combines with: ${comp.combinesWith.join(", ")}`);
-    }
-    lines.push("");
-  }
-  for (const recipe of results.recipeMatches) {
-    lines.push(`── Recipe: ${recipe.name} ──────────────────────────────`);
-    lines.push(`[DEV GUIDANCE — do not render as page content]`);
-    lines.push(recipe.description);
-    lines.push(`Components: ${recipe.components.join(", ")}`);
-    lines.push("");
-    lines.push(`[CODE — use this in your Svelte file]`);
-    lines.push(recipe.snippet);
-    lines.push("");
-  }
-  return lines.join(`
-`);
+    return { componentMatches: [], recipeMatches: [] };
+  return searchComposition(compositionData, query);
 }
-var COMPOSE_PREAMBLE = [
-  "⚠ SETUP: Your root +layout.svelte must import '@dryui/ui/themes/default.css'",
-  `  and '@dryui/ui/themes/dark.css'. app.html needs <html class="theme-auto">.`,
-  '  If not set up yet, run: compose "app shell"',
-  "",
-  "⚠ THIS OUTPUT IS DEVELOPER GUIDANCE — do NOT render recipe names, descriptions,",
-  "  or component lists as visible page content. Only use the code snippets.",
-  "",
-  ""
-].join(`
-`);
 server.tool("compose", COMPOSE_DESC, {
   query: exports_external.string().describe('Short keywords: component name, pattern name, or UI concept (e.g. "search form", "date input", "hotel card", "dashboard")')
 }, async ({ query }) => {
@@ -31307,12 +31661,8 @@ server.tool("compose", COMPOSE_DESC, {
         content: [
           {
             type: "text",
-            text: `No composition guidance found for "${query}".
-Try:
-- A component name (e.g. "DatePicker", "Avatar")
-- A UI concept (e.g. "date input", "image placeholder")
-- A pattern name (e.g. "search-form", "dashboard-page")`
+            text: `matches[0]: none for "${query}"
+Try: component name (DatePicker, Avatar), UI concept (date input), or pattern (search-form)`
           }
         ]
       };
@@ -31321,7 +31671,7 @@ Try:
       content: [
         {
           type: "text",
-          text: COMPOSE_PREAMBLE + formatCompositionResult(results)
+          text: toonComposition(results)
         }
       ]
     };
@@ -31439,7 +31789,7 @@ server.registerPrompt("dryui-install", {
         role: "user",
         content: { type: "text", text: "Plan the DryUI installation for this project." }
       },
-      { role: "assistant", content: { type: "text", text: JSON.stringify(result, null, 2) } }
+      { role: "assistant", content: { type: "text", text: toonInstallPlan(result) } }
     ]
   };
 });
@@ -31463,7 +31813,7 @@ server.registerPrompt("dryui-add", {
         role: "user",
         content: { type: "text", text: `Plan how to add ${name} to this project.` }
       },
-      { role: "assistant", content: { type: "text", text: JSON.stringify(result, null, 2) } }
+      { role: "assistant", content: { type: "text", text: toonAddPlan(result) } }
     ]
   };
 });