tutuca 0.9.47 → 0.9.49

package/dist/tutuca-dev.js

@@ -6211,10 +6211,7 @@ class LinterCtx {
     a.quote = quote;
     const dup = this.currentAttrs.find((x) => x.name === a.name);
     if (dup) {
-      this.report(HTML_DUPLICATE_ATTRIBUTE, LEVEL_WARN, a.nameStart, {
-        name: a.name,
-        firstAt: dup.nameStart
-      });
+      this.report(HTML_DUPLICATE_ATTRIBUTE, LEVEL_WARN, a.nameStart, { name: a.name, firstAt: dup.nameStart }, { kind: "remove", what: `the duplicate '${a.name}' attribute` });
     } else {
       this.currentAttrs.push(a);
     }
@@ -6264,12 +6261,12 @@ class LinterCtx {
           }
         }
         if (firstNonWs < 0) {
-          this.report(HTML_SELF_CLOSING_END_TAG, LEVEL_WARN, start, { tag: name });
+          this.report(HTML_SELF_CLOSING_END_TAG, LEVEL_WARN, start, { tag: name }, { kind: "rewrite", from: `</${name}/>`, to: `</${name}>` });
         } else {
-          this.report(HTML_ATTRIBUTES_ON_END_TAG, LEVEL_WARN, start, { tag: name });
+          this.report(HTML_ATTRIBUTES_ON_END_TAG, LEVEL_WARN, start, { tag: name }, { kind: "remove", what: `attributes from </${name}>` });
         }
       } else {
-        this.report(HTML_ATTRIBUTES_ON_END_TAG, LEVEL_WARN, start, { tag: name });
+        this.report(HTML_ATTRIBUTES_ON_END_TAG, LEVEL_WARN, start, { tag: name }, { kind: "remove", what: `attributes from </${name}>` });
       }
     }
     this.handleEndTag(name, start);
@@ -6302,14 +6299,15 @@ class LinterCtx {
     return this.currentNamespace() !== NS.html;
   }
   onend() {}
-  report(id, level, offset, info) {
+  report(id, level, offset, info, suggestion = null) {
     this.findingCount++;
     const { line, column } = offsetToLineCol(this.lineStarts, offset);
     this.onFinding({
       id,
       level,
       info,
-      location: { start: offset, end: offset + (info.tag?.length ?? 0), line, column }
+      location: { start: offset, end: offset + (info.tag?.length ?? 0), line, column },
+      suggestion
     });
   }
   currentNode() {
@@ -6418,17 +6416,11 @@ class LinterCtx {
     const ns = this.currentNamespace();
     if (ns === NS.html) {
       if (raw !== name) {
-        this.report(HTML_TAG_NAME_HAS_UPPERCASE, LEVEL_ERROR, start, {
-          raw,
-          lowercased: name
-        });
+        this.report(HTML_TAG_NAME_HAS_UPPERCASE, LEVEL_ERROR, start, { raw, lowercased: name }, { kind: "rewrite", from: `<${raw}>`, to: `<${name}>` });
       }
     } else if (ns === NS.svg) {
       if (raw !== raw.toLowerCase() && !this.svgCamelElements.has(raw)) {
-        this.report(HTML_SVG_TAG_WILL_LOWERCASE, LEVEL_ERROR, start, {
-          raw,
-          lowercased: name
-        });
+        this.report(HTML_SVG_TAG_WILL_LOWERCASE, LEVEL_ERROR, start, { raw, lowercased: name }, { kind: "rewrite", from: `<${raw}>`, to: `<${name}>` });
       }
     }
     const targetNs = ns !== NS.html ? ns : name === "svg" ? NS.svg : name === "math" ? NS.math : NS.html;
@@ -6436,20 +6428,14 @@ class LinterCtx {
       for (const a of this.currentAttrs) {
         const canonical = SVG_ATTR_LOWERCASE_TO_CAMEL.get(a.name);
         if (canonical && a.rawName !== canonical) {
-          this.report(HTML_SVG_ATTR_WILL_LOWERCASE, LEVEL_ERROR, a.nameStart, {
-            raw: a.rawName,
-            canonical
-          });
+          this.report(HTML_SVG_ATTR_WILL_LOWERCASE, LEVEL_ERROR, a.nameStart, { raw: a.rawName, canonical }, { kind: "rewrite", from: a.rawName, to: canonical });
         }
       }
     } else if (targetNs === NS.math) {
       for (const a of this.currentAttrs) {
         const canonical = MATHML_ATTR_LOWERCASE_TO_CAMEL.get(a.name);
         if (canonical && a.rawName !== canonical) {
-          this.report(HTML_MATHML_ATTR_WILL_LOWERCASE, LEVEL_ERROR, a.nameStart, {
-            raw: a.rawName,
-            canonical
-          });
+          this.report(HTML_MATHML_ATTR_WILL_LOWERCASE, LEVEL_ERROR, a.nameStart, { raw: a.rawName, canonical }, { kind: "rewrite", from: a.rawName, to: canonical });
         }
       }
     }
@@ -6564,10 +6550,7 @@ class LinterCtx {
     }
     if (name === "form") {
       if (this.openElementsHas("form") && !this.openElementsHas("template")) {
-        this.report(HTML_DUPLICATE_FORM, LEVEL_ERROR, start, {
-          tag: raw,
-          mode: this.insertionMode
-        });
+        this.report(HTML_DUPLICATE_FORM, LEVEL_ERROR, start, { tag: raw, mode: this.insertionMode }, { kind: "remove", what: "the inner <form>" });
         return;
       }
       if (this.hasInButtonScope("p"))
@@ -7129,10 +7112,7 @@ class LinterCtx {
       }
     }
     if (VOID_ELEMENTS.has(name)) {
-      this.report(HTML_VOID_ELEMENT_HAS_CLOSE_TAG, LEVEL_WARN, start, {
-        tag: name,
-        mode: this.insertionMode
-      });
+      this.report(HTML_VOID_ELEMENT_HAS_CLOSE_TAG, LEVEL_WARN, start, { tag: name, mode: this.insertionMode }, { kind: "remove", what: `the </${name}>` });
       return;
     }
     if (FORMATTING_ELEMENTS.has(name)) {
@@ -7240,7 +7220,75 @@ function offsetToLineCol(lineStarts, offset) {
   return { line: lo + 1, column: offset - lineStarts[lo] + 1 };
 }
 
+// tools/core/util/closest-name.js
+function editDistance(a, b) {
+  if (a === b)
+    return 0;
+  const la = a.length;
+  const lb = b.length;
+  if (la === 0)
+    return lb;
+  if (lb === 0)
+    return la;
+  const prev2 = new Array(lb + 1);
+  const prev1 = new Array(lb + 1);
+  const curr = new Array(lb + 1);
+  for (let j = 0;j <= lb; j++)
+    prev1[j] = j;
+  for (let i = 1;i <= la; i++) {
+    curr[0] = i;
+    const ca = a.charCodeAt(i - 1);
+    for (let j = 1;j <= lb; j++) {
+      const cb = b.charCodeAt(j - 1);
+      const cost = ca === cb ? 0 : 1;
+      let v = Math.min(curr[j - 1] + 1, prev1[j] + 1, prev1[j - 1] + cost);
+      if (i > 1 && j > 1 && ca === b.charCodeAt(j - 2) && a.charCodeAt(i - 2) === cb) {
+        v = Math.min(v, prev2[j - 2] + 1);
+      }
+      curr[j] = v;
+    }
+    for (let j = 0;j <= lb; j++) {
+      prev2[j] = prev1[j];
+      prev1[j] = curr[j];
+    }
+  }
+  return prev1[lb];
+}
+function closestName(name, candidates, maxDistance = 2) {
+  if (!name)
+    return null;
+  const lower = name.toLowerCase();
+  let best = null;
+  let bestDist = maxDistance + 1;
+  for (const cand of candidates) {
+    if (cand === name)
+      return null;
+    if (cand.toLowerCase() === lower)
+      return cand;
+    const d = editDistance(name, cand);
+    if (d < bestDist) {
+      best = cand;
+      bestDist = d;
+    }
+  }
+  return bestDist <= maxDistance ? best : null;
+}
+
 // tools/core/lint-check.js
+var KNOWN_DIRECTIVE_NAMES = new Set([
+  "dangerouslysetinnerhtml",
+  "slot",
+  "push-view",
+  "text",
+  "show",
+  "hide",
+  "each",
+  "enrich-with",
+  "when",
+  "loop-with",
+  "then",
+  "else"
+]);
 var ALT_HANDLER_NOT_DEFINED = "ALT_HANDLER_NOT_DEFINED";
 var ALT_HANDLER_NOT_REFERENCED = "ALT_HANDLER_NOT_REFERENCED";
 var RENDER_IT_OUTSIDE_OF_LOOP = "RENDER_IT_OUTSIDE_OF_LOOP";
@@ -7285,6 +7333,39 @@ var AT_PREFIX_HINT_KNOWN_BY_KIND = {
 var LEVEL_WARN2 = "warn";
 var LEVEL_ERROR2 = "error";
 var LEVEL_HINT = "hint";
+var PARSE_ISSUE_KIND_TO_KNOWN_NAMES = {
+  "unknown-directive": KNOWN_DIRECTIVE_NAMES,
+  "unknown-x-op": X_KNOWN_OP_NAMES,
+  "unknown-x-attr": X_KNOWN_ATTR_NAMES
+};
+function collectProtoMethodNames(proto) {
+  const out = [];
+  let cursor = proto;
+  while (cursor && cursor !== Object.prototype) {
+    for (const key of Object.getOwnPropertyNames(cursor)) {
+      if (key === "constructor")
+        continue;
+      out.push(key);
+    }
+    cursor = Object.getPrototypeOf(cursor);
+  }
+  return out;
+}
+function scopeKeysAlong(scope, mapKey) {
+  const out = [];
+  for (let cursor = scope;cursor; cursor = cursor.parent) {
+    const map = cursor[mapKey];
+    if (!map)
+      continue;
+    for (const key of Object.keys(map))
+      out.push(key);
+  }
+  return out;
+}
+function replaceNameSuggestion(name, candidates) {
+  const close = closestName(name, candidates);
+  return close ? { kind: "replace-name", from: name, to: close } : null;
+}
 function checkComponent(Comp, lx = new LintContext) {
   return lx.push({ componentName: Comp.name }, () => {
     const referencedAlters = new Set;
@@ -7314,7 +7395,7 @@ var HTML_LINT_OPTS = {
 function checkHtmlStructure(lx, view) {
   if (typeof view.rawView !== "string" || !view.rawView)
     return;
-  lintHtml(view.rawView, (f) => lx.report(f.id, { ...f.info, location: f.location }, f.level), HTML_LINT_OPTS);
+  lintHtml(view.rawView, (f) => lx.report(f.id, { ...f.info, location: f.location }, f.level, f.suggestion ?? null), HTML_LINT_OPTS);
 }
 function checkParseIssues(lx, view) {
   const issues = view.ctx.parseIssues;
@@ -7324,12 +7405,19 @@ function checkParseIssues(lx, view) {
     const id = PARSE_ISSUE_KIND_TO_LINT_ID[kind];
     if (!id)
       continue;
-    lx.error(id, info);
-    const known = AT_PREFIX_HINT_KNOWN_BY_KIND[kind];
-    if (known && info.name?.startsWith("@")) {
-      const suggestion = info.name.slice(1);
-      if (known.has(suggestion))
-        lx.hint(MAYBE_DROP_AT_PREFIX, { ...info, suggestion });
+    const atPrefixKnown = AT_PREFIX_HINT_KNOWN_BY_KIND[kind];
+    const isAtPrefixedTypo = atPrefixKnown && info.name?.startsWith("@") && atPrefixKnown.has(info.name.slice(1));
+    let suggestion = null;
+    if (isAtPrefixedTypo) {
+      suggestion = { kind: "drop-prefix", from: info.name, to: info.name.slice(1) };
+    } else {
+      const candidates = PARSE_ISSUE_KIND_TO_KNOWN_NAMES[kind];
+      if (candidates)
+        suggestion = replaceNameSuggestion(info.name, candidates);
+    }
+    lx.error(id, info, suggestion);
+    if (isAtPrefixedTypo) {
+      lx.hint(MAYBE_DROP_AT_PREFIX, { ...info, suggestion: info.name.slice(1) }, { kind: "drop-prefix", from: info.name, to: info.name.slice(1) });
     }
   }
 }
@@ -7342,11 +7430,7 @@ function checkMacroCallArgs(lx, view, Comp) {
     const { defaults } = macro;
     for (const argName in macroNode.attrs) {
       if (!(argName in defaults)) {
-        lx.error(UNKNOWN_MACRO_ARG, {
-          name: argName,
-          macroName: macroNode.name,
-          tag: `x:${macroNode.name}`
-        });
+        lx.error(UNKNOWN_MACRO_ARG, { name: argName, macroName: macroNode.name, tag: `x:${macroNode.name}` }, replaceNameSuggestion(argName, Object.keys(defaults)));
       }
     }
   }
@@ -7368,8 +7452,9 @@ function walkForRenderIt(lx, node, loopDepth) {
     return;
   switch (node.constructor.name) {
     case "RenderItNode":
-      if (loopDepth === 0)
-        lx.error(RENDER_IT_OUTSIDE_OF_LOOP, { node });
+      if (loopDepth === 0) {
+        lx.error(RENDER_IT_OUTSIDE_OF_LOOP, { node }, { kind: "wrap", from: "<x render-it>", to: "<x render-each>" });
+      }
       return;
     case "EachNode":
       walkForRenderIt(lx, node.node, loopDepth + 1);
@@ -7400,13 +7485,14 @@ function checkEventModifiers(lx, view) {
       const modWrappers = MOD_WRAPPERS_BY_EVENT[name] ?? NO_WRAPPERS;
       for (const modifier of modifiers) {
         if (modWrappers[modifier] === undefined) {
+          const close = closestName(modifier, Object.keys(modWrappers));
           lx.error(UNKNOWN_EVENT_MODIFIER, {
             name,
             modifier,
             handler,
             event,
             originAttr: `@on.${name}+${modifiers.join("+")}`
-          });
+          }, close ? { kind: "replace-name", from: `+${modifier}`, to: `+${close}` } : null);
         }
       }
     }
@@ -7472,42 +7558,22 @@ function checkEventHandlersHaveImpls(lx, Comp, referencedInputs) {
           const originAttr = `@on.${eventName}`;
           if (hvName === "InputHandlerNameVal") {
             referencedInputs?.add(handlerVal.name);
-            if (input[handlerVal.name] === undefined) {
-              lx.error(INPUT_HANDLER_NOT_IMPLEMENTED, {
-                name: handlerVal.name,
-                handler,
-                event,
-                eventName,
-                originAttr
-              });
-              if (proto[handlerVal.name] !== undefined) {
-                lx.hint(INPUT_HANDLER_METHOD_FOR_INPUT_HANDLER, {
-                  name: handlerVal.name,
-                  handler,
-                  event,
-                  eventName,
-                  originAttr
-                });
+            const { name } = handlerVal;
+            if (input[name] === undefined) {
+              const isMethodFix = proto[name] !== undefined;
+              lx.error(INPUT_HANDLER_NOT_IMPLEMENTED, { name, handler, event, eventName, originAttr }, isMethodFix ? { kind: "add-prefix", from: name, to: `.${name}` } : replaceNameSuggestion(name, Object.keys(input)));
+              if (isMethodFix) {
+                lx.hint(INPUT_HANDLER_METHOD_FOR_INPUT_HANDLER, { name, handler, event, eventName, originAttr }, { kind: "add-prefix", from: name, to: `.${name}` });
               }
             }
           } else if (hvName === "RawFieldVal") {
             referencedInputs?.add(handlerVal.name);
-            if (proto[handlerVal.name] === undefined) {
-              lx.error(INPUT_HANDLER_METHOD_NOT_IMPLEMENTED, {
-                name: handlerVal.name,
-                handler,
-                event,
-                eventName,
-                originAttr
-              });
-              if (input[handlerVal.name] !== undefined) {
-                lx.hint(INPUT_HANDLER_FOR_INPUT_HANDLER_METHOD, {
-                  name: handlerVal.name,
-                  handler,
-                  event,
-                  eventName,
-                  originAttr
-                });
+            const { name } = handlerVal;
+            if (proto[name] === undefined) {
+              const isInputFix = input[name] !== undefined;
+              lx.error(INPUT_HANDLER_METHOD_NOT_IMPLEMENTED, { name, handler, event, eventName, originAttr }, isInputFix ? { kind: "drop-prefix", from: `.${name}`, to: name } : replaceNameSuggestion(name, collectProtoMethodNames(proto)));
+              if (isInputFix) {
+                lx.hint(INPUT_HANDLER_FOR_INPUT_HANDLER_METHOD, { name, handler, event, eventName, originAttr }, { kind: "drop-prefix", from: `.${name}`, to: name });
               }
             }
           }
@@ -7521,22 +7587,23 @@ function checkConsistentAttrVal(lx, val, fields, proto, scope, alter, referenced
   if (valName === "FieldVal" || valName === "RawFieldVal") {
     const { name } = val;
     if (fields[name] === undefined && proto[name] === undefined) {
-      lx.error(FIELD_VAL_NOT_DEFINED, { ...errCtx, val, name });
+      const candidates = [...Object.keys(fields), ...collectProtoMethodNames(proto)];
+      lx.error(FIELD_VAL_NOT_DEFINED, { ...errCtx, val, name }, replaceNameSuggestion(name, candidates));
     }
   } else if (valName === "SeqAccessVal") {
     checkConsistentAttrVal(lx, val.seqVal, fields, proto, scope, alter, referencedAlters, skipNameVal, errCtx);
     checkConsistentAttrVal(lx, val.keyVal, fields, proto, scope, alter, referencedAlters, skipNameVal, errCtx);
   } else if (valName === "RequestVal") {
     if (scope.lookupRequest(val.name) === null) {
-      lx.error(UNKNOWN_REQUEST_NAME, { ...errCtx, name: val.name });
+      lx.error(UNKNOWN_REQUEST_NAME, { ...errCtx, name: val.name }, replaceNameSuggestion(val.name, scopeKeysAlong(scope, "reqsByName")));
     }
   } else if (valName === "TypeVal") {
     if (scope.lookupComponent(val.name) === null) {
-      lx.error(UNKNOWN_COMPONENT_NAME, { ...errCtx, name: val.name });
+      lx.error(UNKNOWN_COMPONENT_NAME, { ...errCtx, name: val.name }, replaceNameSuggestion(val.name, scopeKeysAlong(scope, "byName")));
     }
   } else if (valName === "NameVal") {
     if (!skipNameVal && !isKnownHandlerName(val.name)) {
-      lx.error(UNKNOWN_HANDLER_ARG_NAME, { ...errCtx, name: val.name });
+      lx.error(UNKNOWN_HANDLER_ARG_NAME, { ...errCtx, name: val.name }, replaceNameSuggestion(val.name, KNOWN_HANDLER_NAMES));
     }
   } else if (valName === "StrTplVal") {
     for (const subVal of val.vals) {
@@ -7545,7 +7612,7 @@ function checkConsistentAttrVal(lx, val, fields, proto, scope, alter, referenced
   } else if (valName === "AlterHandlerNameVal") {
     referencedAlters?.add(val.name);
     if (alter[val.name] === undefined) {
-      lx.error(ALT_HANDLER_NOT_DEFINED, { ...errCtx, name: val.name });
+      lx.error(ALT_HANDLER_NOT_DEFINED, { ...errCtx, name: val.name }, replaceNameSuggestion(val.name, Object.keys(alter)));
     }
   } else if (valName !== "ConstVal" && valName !== "BindVal" && valName !== "DynVal") {
     console.log(val);
@@ -7691,17 +7758,17 @@ class LintContext {
       this.frame = prev;
     }
   }
-  error(id, info) {
-    this.report(id, info, LEVEL_ERROR2);
+  error(id, info, suggestion = null) {
+    this.report(id, info, LEVEL_ERROR2, suggestion);
   }
-  warn(id, info) {
-    this.report(id, info, LEVEL_WARN2);
+  warn(id, info, suggestion = null) {
+    this.report(id, info, LEVEL_WARN2, suggestion);
   }
-  hint(id, info) {
-    this.report(id, info, LEVEL_HINT);
+  hint(id, info, suggestion = null) {
+    this.report(id, info, LEVEL_HINT, suggestion);
   }
-  report(id, info = {}, level = LEVEL_ERROR2) {
-    this.reports.push({ id, info, level, context: { ...this.frame } });
+  report(id, info = {}, level = LEVEL_ERROR2, suggestion = null) {
+    this.reports.push({ id, info, level, context: { ...this.frame }, suggestion });
   }
 }
 
@@ -7720,61 +7787,6 @@ class LintParseContext extends ParseContext {
   }
 }
 
-// tools/core/test-console.js
-var PASS = "color: #0a0; font-weight: bold";
-var FAIL = "color: #c00; font-weight: bold";
-var SKIP = "color: #888";
-var DIM = "color: #888";
-var RESET = "color: inherit; font-weight: normal";
-function reportTestNode(node) {
-  if (node.children) {
-    const label = node.componentName ? `${node.title} [${node.componentName}]` : node.title;
-    console.group(label);
-    for (const child of node.children)
-      reportTestNode(child);
-    console.groupEnd();
-    return;
-  }
-  const dur = node.status === "skip" ? "" : ` (${Math.round(node.durationMs)}ms)`;
-  if (node.status === "pass") {
-    console.log(`%c✓%c ${node.title}%c${dur}`, PASS, RESET, DIM);
-  } else if (node.status === "skip") {
-    console.log(`%c○ ${node.title}%c (skipped)`, SKIP, RESET);
-  } else {
-    console.group(`%c✗%c ${node.title}%c${dur}`, FAIL, RESET, DIM);
-    console.error(node.error?.message ?? "(no error message)");
-    if (node.error && (("expected" in node.error) || ("actual" in node.error))) {
-      console.log("expected:", node.error.expected);
-      console.log("actual:  ", node.error.actual);
-    }
-    if (node.error?.stack)
-      console.log(node.error.stack);
-    console.groupEnd();
-  }
-}
-function reportTestReportToConsole(report) {
-  for (const m of report.modules) {
-    const label = `tutuca tests${m.path ? ` — ${m.path}` : ""}`;
-    console.group(label);
-    if (m.suites.length === 0) {
-      console.log("(no tests)");
-    } else {
-      for (const s of m.suites)
-        reportTestNode(s);
-    }
-    const c = m.counts;
-    const summary = `${c.pass} passed, ${c.fail} failed, ${c.skip} skipped (${c.total} total)`;
-    if (c.fail > 0)
-      console.error(`%c${summary}`, FAIL);
-    else if (c.total === 0)
-      console.log(`%c${summary}`, DIM);
-    else
-      console.log(`%c${summary}`, PASS);
-    console.groupEnd();
-  }
-  return report;
-}
-
 // tools/core/results.js
 class ModuleInfo {
   constructor({ path = null, present = new Set, counts = {}, warnings = [] }) {
@@ -7812,11 +7824,12 @@ class ComponentDocs {
 }
 
 class LintFinding {
-  constructor({ id, level, info, context = {} }) {
+  constructor({ id, level, info, context = {}, suggestion = null }) {
     this.id = id;
     this.level = level;
     this.info = info;
     this.context = context;
+    this.suggestion = suggestion;
   }
 }
 
@@ -8146,6 +8159,61 @@ async function runTests({
   });
 }
 
+// tools/core/test-console.js
+var PASS = "color: #0a0; font-weight: bold";
+var FAIL = "color: #c00; font-weight: bold";
+var SKIP = "color: #888";
+var DIM = "color: #888";
+var RESET = "color: inherit; font-weight: normal";
+function reportTestNode(node) {
+  if (node.children) {
+    const label = node.componentName ? `${node.title} [${node.componentName}]` : node.title;
+    console.group(label);
+    for (const child of node.children)
+      reportTestNode(child);
+    console.groupEnd();
+    return;
+  }
+  const dur = node.status === "skip" ? "" : ` (${Math.round(node.durationMs)}ms)`;
+  if (node.status === "pass") {
+    console.log(`%c✓%c ${node.title}%c${dur}`, PASS, RESET, DIM);
+  } else if (node.status === "skip") {
+    console.log(`%c○ ${node.title}%c (skipped)`, SKIP, RESET);
+  } else {
+    console.group(`%c✗%c ${node.title}%c${dur}`, FAIL, RESET, DIM);
+    console.error(node.error?.message ?? "(no error message)");
+    if (node.error && (("expected" in node.error) || ("actual" in node.error))) {
+      console.log("expected:", node.error.expected);
+      console.log("actual:  ", node.error.actual);
+    }
+    if (node.error?.stack)
+      console.log(node.error.stack);
+    console.groupEnd();
+  }
+}
+function reportTestReportToConsole(report) {
+  for (const m of report.modules) {
+    const label = `tutuca tests${m.path ? ` — ${m.path}` : ""}`;
+    console.group(label);
+    if (m.suites.length === 0) {
+      console.log("(no tests)");
+    } else {
+      for (const s of m.suites)
+        reportTestNode(s);
+    }
+    const c = m.counts;
+    const summary = `${c.pass} passed, ${c.fail} failed, ${c.skip} skipped (${c.total} total)`;
+    if (c.fail > 0)
+      console.error(`%c${summary}`, FAIL);
+    else if (c.total === 0)
+      console.log(`%c${summary}`, DIM);
+    else
+      console.log(`%c${summary}`, PASS);
+    console.groupEnd();
+  }
+  return report;
+}
+
 // tools/format/lint.js
 function badValueMessage(info) {
   const v = JSON.stringify(info.value);
@@ -8201,7 +8269,7 @@ function fmtEventSuffix(info) {
 function lintIdToMessage(id, info) {
   switch (id) {
     case "RENDER_IT_OUTSIDE_OF_LOOP":
-      return "render-it used outside of a loop";
+      return "<x render-it> used outside of a loop";
     case "UNKNOWN_EVENT_MODIFIER": {
       const mods = info.handler?.modifiers ?? [info.modifier];
       const written = `@on.${info.name}+${mods.join("+")}`;
@@ -8212,13 +8280,13 @@ function lintIdToMessage(id, info) {
     case "INPUT_HANDLER_NOT_IMPLEMENTED":
       return `Input handler '${info.name}' is not implemented${fmtEventSuffix(info)}`;
     case "INPUT_HANDLER_NOT_REFERENCED":
-      return `Input handler '${info.name}' is defined but not referenced`;
+      return `Input handler '${info.name}' is defined but never used — remove it or wire it to an @on.* event`;
     case "INPUT_HANDLER_METHOD_NOT_IMPLEMENTED":
       return `Method '.${info.name}' is not implemented${fmtEventSuffix(info)}`;
     case "INPUT_HANDLER_FOR_INPUT_HANDLER_METHOD":
-      return `'${info.name}' exists as input handler — use without '.' prefix${fmtEventSuffix(info)}`;
+      return `'.${info.name}' is a method reference, but '${info.name}' is defined as an input handler${fmtEventSuffix(info)}`;
     case "INPUT_HANDLER_METHOD_FOR_INPUT_HANDLER":
-      return `'${info.name}' exists as method — use with '.' prefix${fmtEventSuffix(info)}`;
+      return `'${info.name}' is an input handler reference, but '${info.name}' is defined as a method${fmtEventSuffix(info)}`;
     case "FIELD_VAL_NOT_DEFINED":
       return `Field '.${info.name}' is not defined${fmtOriginSuffix(info)}`;
     case "DUPLICATE_ATTR_DEFINITION": {
@@ -8227,7 +8295,7 @@ function lintIdToMessage(id, info) {
       return `Attribute '${info.name}' is set ${info.sources?.length ?? "multiple"} times${sources}${tag}`;
     }
     case "IF_NO_BRANCH_SET":
-      return `'@if.${info.attr}' has no '@then' or '@else' branch — at least one must be set${fmtTagSuffix(info)}`;
+      return `'@if.${info.attr}' has no '@then' or '@else' branch — add '@then="…"' or '@else="…"' (or both)${fmtTagSuffix(info)}`;
     case "UNKNOWN_REQUEST_NAME":
       return `Unknown request '!${info.name}'${fmtOriginSuffix(info)}`;
     case "UNKNOWN_COMPONENT_NAME":
@@ -8235,7 +8303,7 @@ function lintIdToMessage(id, info) {
     case "ALT_HANDLER_NOT_DEFINED":
       return `Alter handler '${info.name}' is not defined${fmtOriginSuffix(info)}`;
     case "ALT_HANDLER_NOT_REFERENCED":
-      return `Alter handler '${info.name}' is defined but not referenced`;
+      return `Alter handler '${info.name}' is defined but never used — remove it or reference it from @when, @enrich-with, or @loop-with`;
     case "UNKNOWN_MACRO_ARG":
       return `Argument '${info.name}' is not declared in macro '${info.macroName}'`;
     case "UNKNOWN_DIRECTIVE":
@@ -8246,7 +8314,7 @@ function lintIdToMessage(id, info) {
       return `Unknown attribute '${info.name}=${JSON.stringify(info.value)}' on <x ${info.op}>${fmtTagSuffix(info)}`;
     case "MAYBE_DROP_AT_PREFIX": {
       const written = info.value !== undefined ? `${info.name}=${JSON.stringify(info.value)}` : info.name;
-      return `Did you mean '${info.suggestion}'? Drop the '@' from '${written}' on <x>.`;
+      return `'${written}' on <x> looks like a directive but is actually an x op/attr written with a leading '@'`;
     }
     case "BAD_VALUE":
       return `${badValueMessage(info)}${fmtTagSuffix(info)}`;
@@ -8255,7 +8323,7 @@ function lintIdToMessage(id, info) {
     case "HTML_SVG_TAG_WILL_LOWERCASE":
       return `SVG tag <${info.raw}> is not in the WHATWG case-correction list — will be lowercased to <${info.lowercased}>${fmtLocationSuffix(info)}`;
     case "HTML_TAG_NOT_ALLOWED_IN_PARENT":
-      return `<${info.tag}> not allowed under <${info.parent ?? "?"}> in ${info.mode} (action: ${info.action})${fmtLocationSuffix(info)}`;
+      return `<${info.tag}> not allowed under <${info.parent ?? "?"}> in ${info.mode} — ${htmlActionPhrase(info.action, info.tag, info.parent)}${fmtLocationSuffix(info)}`;
     case "HTML_TEXT_NOT_ALLOWED_IN_PARENT":
       return `Non-whitespace text not allowed in ${info.mode}: ${JSON.stringify(info.snippet)}${fmtLocationSuffix(info)}`;
     case "HTML_VOID_ELEMENT_HAS_CLOSE_TAG":
@@ -8292,11 +8360,47 @@ function lintIdToMessage(id, info) {
       return id;
   }
 }
+function suggestionToMessage(suggestion) {
+  if (!suggestion)
+    return null;
+  switch (suggestion.kind) {
+    case "replace-name":
+      return `did you mean '${suggestion.to}'?`;
+    case "drop-prefix":
+      return `did you mean '${suggestion.to}'? (drop the leading '${suggestion.from.slice(0, suggestion.from.length - suggestion.to.length)}')`;
+    case "add-prefix":
+      return `did you mean '${suggestion.to}'? (add the leading '${suggestion.to.slice(0, suggestion.to.length - suggestion.from.length)}')`;
+    case "remove":
+      return `remove ${suggestion.what}`;
+    case "rewrite":
+      return `use '${suggestion.to}' instead of '${suggestion.from}'`;
+    case "wrap":
+      return `wrap it in ${suggestion.to}`;
+    default:
+      return null;
+  }
+}
 function fmtLocationSuffix(info) {
   const loc = info?.location;
   if (!loc)
     return "";
-  return ` at L${loc.line}:C${loc.column}`;
+  return ` at line ${loc.line}, col ${loc.column}`;
+}
+function htmlActionPhrase(action, tag, parent) {
+  switch (action) {
+    case "ignored":
+      return `the parser will drop this <${tag}>`;
+    case "drop":
+      return `the parser will drop this <${tag}>`;
+    case "auto-close-implicit":
+      return `the parser will close <${parent ?? "?"}> first, then place <${tag}> as a sibling`;
+    case "foster-parent":
+      return `the parser will move <${tag}> outside <${parent ?? "?"}> (foster-parenting)`;
+    case "foreign-breakout":
+      return `the parser will exit foreign content and re-process <${tag}> in HTML mode`;
+    default:
+      return `parser action: ${action}`;
+  }
 }
 
 // src/components.js
@@ -8346,7 +8450,8 @@ class ComponentStack {
   enter() {
     return new ComponentStack(this.comps, this);
   }
-  registerComponents(comps, aliases2 = {}) {
+  registerComponents(comps, opts) {
+    const { aliases: aliases2 = {} } = opts ?? {};
     for (let i = 0;i < comps.length; i++) {
       const comp = comps[i];
       comp.scope = this.enter();
@@ -9438,9 +9543,9 @@ class App {
   sendAtRoot(name, args, opts) {
     this.transactor.pushSend(new Path([]), name, args, opts);
   }
-  registerComponents(comps, aliases2) {
+  registerComponents(comps, opts) {
     const scope = this.compStack.enter();
-    scope.registerComponents(comps, aliases2);
+    scope.registerComponents(comps, opts);
     return scope;
   }
   _transactNextBatch(maxRunTimeMs = 10) {
@@ -14861,7 +14966,9 @@ function check(app) {
     console.group(Comp.name);
     for (const r of reports) {
       counts[r.level]++;
-      const line = `[${r.level}] ${lintIdToMessage(r.id, r.info)}`;
+      const tail = suggestionToMessage(r.suggestion);
+      const suffix = tail ? ` — ${tail}` : "";
+      const line = `[${r.level}] ${lintIdToMessage(r.id, r.info)}${suffix}`;
       if (r.level === "error")
         console.error(line);
       else if (r.level === "warn")
@@ -14906,6 +15013,7 @@ export {
   update$1 as update,
   tutuca,
   test3 as test,
+  suggestionToMessage,
   setIn$1 as setIn,
   set2 as set,
   runTests,