tutuca 0.9.31 → 0.9.32

package/dist/tutuca-cli.js

@@ -1147,6 +1147,8 @@ class AttrParser {
       this.parseThen(s);
     else if (directiveName.startsWith("else."))
       this.parseElse(s);
+    else
+      this.px.onParseIssue("unknown-directive", { name: directiveName, value: s });
   }
   _parseWhen(s) {
     if (this.eachAttr !== null)
@@ -1332,6 +1334,30 @@ function optimizeNode(node) {
   node.optimize();
   return node;
 }
+function processXExtras(node, attrs, opName, startIdx, px) {
+  const consumed = X_OP_CONSUMED[opName];
+  const wrappable = X_OP_WRAPPABLE.has(opName);
+  const wrappers = [];
+  for (let i = startIdx;i < attrs.length; i++) {
+    const a = attrs[i];
+    const aName = a.name;
+    if (consumed.has(aName))
+      continue;
+    if (wrappable && X_ATTR_WRAPPERS[aName]) {
+      wrappers.push([X_ATTR_WRAPPERS[aName], vp.parseCondValue(a.value, px)]);
+      continue;
+    }
+    const issueInfo = { op: opName, name: aName, value: a.value };
+    px.onParseIssue("unknown-x-attr", issueInfo);
+  }
+  for (let i = wrappers.length - 1;i >= 0; i--) {
+    const [Cls, val] = wrappers[i];
+    const wrapper = px.addNodeIf(Cls, val, node);
+    if (wrapper !== null)
+      node = wrapper;
+  }
+  return node;
+}
 function wrap(node, px, wrappers) {
   if (wrappers) {
     for (let i = wrappers.length - 1;i >= 0; i--) {
@@ -1438,6 +1464,9 @@ class ParseContext {
     return this.nodes[id] ?? null;
   }
   onAttributes(_attrs, _wrapperAttrs, _textChild, _isMacroCall) {}
+  onParseIssue(kind, info) {
+    console.warn(`tutuca parse issue [${kind}]`, info);
+  }
 }
 function condenseChildsWhites(childs) {
   if (childs.length === 0)
@@ -1517,7 +1546,7 @@ function compileModifiers(eventName, names) {
     return w(this, f, args, ctx);
   };
 }
-var TextNode, CommentNode, ChildsNode, DomNode, FragmentNode, maybeFragment = (xs) => xs.length === 1 ? xs[0] : new FragmentNode(xs), VALID_NODE_RE, ANode, MacroNode, RenderViewId, RenderNode, RenderItNode, RenderEachNode, RenderTextNode, RenderOnceNode, WrapperNode, ShowNode, HideNode, PushViewNameNode, SlotNode, ScopeNode, EachNode, filterAlwaysTrue = (_v, _k, _seq) => true, nullLoopWith = (seq) => ({ seq }), WRAPPER_NODES, _htmlBlockTags = "ADDRESS,ARTICLE,ASIDE,BLOCKQUOTE,CAPTION,COL,COLGROUP,DETAILS,DIALOG,DIV,DD,DL,DT,FIELDSET,FIGCAPTION,FIGURE,FOOTER,FORM,H1,H2,H3,H4,H5,H6,HEADER,HGROUP,HR,LEGEND,LI,MAIN,MENU,NAV,OL,P,PRE,SECTION,SUMMARY,TABLE,TBODY,TD,TFOOT,TH,THEAD,TR,UL", HTML_BLOCK_TAGS, isBlockDomNode = (n) => {
+var TextNode, CommentNode, ChildsNode, DomNode, FragmentNode, maybeFragment = (xs) => xs.length === 1 ? xs[0] : new FragmentNode(xs), VALID_NODE_RE, ANode, MacroNode, RenderViewId, RenderNode, RenderItNode, RenderEachNode, RenderTextNode, RenderOnceNode, WrapperNode, ShowNode, HideNode, PushViewNameNode, SlotNode, ScopeNode, EachNode, filterAlwaysTrue = (_v, _k, _seq) => true, nullLoopWith = (seq) => ({ seq }), X_OP_CONSUMED, X_OP_WRAPPABLE, X_ATTR_WRAPPERS, WRAPPER_NODES, _htmlBlockTags = "ADDRESS,ARTICLE,ASIDE,BLOCKQUOTE,CAPTION,COL,COLGROUP,DETAILS,DIALOG,DIV,DD,DL,DT,FIELDSET,FIGCAPTION,FIGURE,FOOTER,FORM,H1,H2,H3,H4,H5,H6,HEADER,HGROUP,HR,LEGEND,LI,MAIN,MENU,NAV,OL,P,PRE,SECTION,SUMMARY,TABLE,TBODY,TD,TFOOT,TH,THEAD,TR,UL", HTML_BLOCK_TAGS, isBlockDomNode = (n) => {
   const node = n instanceof FragmentNode ? n.childs[0] : n;
   return node instanceof DomNode && HTML_BLOCK_TAGS.has(node.tagName);
 }, isMac, fwdIfCtxPred = (pred) => (w) => (that, f, args, ctx) => pred(ctx) ? w(that, f, args, ctx) : that, fwdIfKey = (keyName) => fwdIfCtxPred((ctx) => ctx.e.key === keyName), fwdCtrl, fwdMeta, fwdAlt, metaWraps, MOD_WRAPPERS_BY_EVENT, identityModifierWrapper = (f, _ctx) => f;
@@ -1616,18 +1645,19 @@ var init_anode = __esm(() => {
     static parse(html, px) {
       const nodes = px.parseHTML(html);
       if (nodes.length === 0)
-        return new TextNode("");
+        return new CommentNode("Empty View in ANode.parse");
       if (nodes.length === 1)
         return ANode.fromDOM(nodes[0], px);
-      const childs = new Array(nodes.length);
-      for (let i = 0;i < nodes.length; i++)
-        childs[i] = ANode.fromDOM(nodes[i], px);
+      const childs = [];
+      for (let i = 0;i < nodes.length; i++) {
+        const child = ANode.fromDOM(nodes[i], px);
+        if (child !== null)
+          childs.push(child);
+      }
       const trimmed = condenseChildsWhites(childs);
       if (trimmed.length === 0)
-        return new TextNode("");
-      if (trimmed.length === 1)
-        return trimmed[0];
-      return new FragmentNode(trimmed);
+        return new CommentNode("Empty View in ANode.parse");
+      return maybeFragment(trimmed);
     }
     static fromDOM(node, px) {
       if (node instanceof px.Text)
@@ -1642,25 +1672,37 @@ var init_anode = __esm(() => {
       if (tag === "X" || isPseudoX) {
         if (attrs.length === 0)
           return maybeFragment(childs);
-        const { name, value } = attrs[isPseudoX ? 1 : 0];
+        const opIdx = isPseudoX ? 1 : 0;
+        const { name, value } = attrs[opIdx];
         const as = attrs.getNamedItem("as")?.value ?? null;
+        let node2;
         switch (name) {
           case "slot":
-            return new SlotNode(null, vp.const(value), maybeFragment(childs));
+            node2 = new SlotNode(null, vp.const(value), maybeFragment(childs));
+            break;
           case "text":
-            return px.addNodeIf(RenderTextNode, vp.parseText(value, px));
+            node2 = px.addNodeIf(RenderTextNode, vp.parseText(value, px));
+            break;
           case "render":
-            return px.addNodeIf(RenderNode, vp.parseRender(value, px), as);
+            node2 = px.addNodeIf(RenderNode, vp.parseRender(value, px), as);
+            break;
           case "render-it":
-            return px.addNodeIf(RenderItNode, vp.bindValIt, as);
+            node2 = px.addNodeIf(RenderItNode, vp.bindValIt, as);
+            break;
           case "render-each":
-            return RenderEachNode.parse(px, vp, value, as, attrs);
+            node2 = RenderEachNode.parse(px, vp, value, as, attrs);
+            break;
           case "show":
-            return px.addNodeIf(ShowNode, vp.parseCondValue(value, px), maybeFragment(childs));
+            node2 = px.addNodeIf(ShowNode, vp.parseCondValue(value, px), maybeFragment(childs));
+            break;
           case "hide":
-            return px.addNodeIf(HideNode, vp.parseCondValue(value, px), maybeFragment(childs));
+            node2 = px.addNodeIf(HideNode, vp.parseCondValue(value, px), maybeFragment(childs));
+            break;
+          default:
+            px.onParseIssue("unknown-x-op", { name, value });
+            return new CommentNode(`Error: InvalidSpecialTagOp ${name}=${value}`);
         }
-        return new CommentNode(`Error: InvalidSpecialTagOp ${name}=${value}`);
+        return processXExtras(node2, attrs, name, (isPseudoX ? 1 : 0) + 1, px);
       } else if (tag.charCodeAt(1) === 58 && tag.charCodeAt(0) === 88) {
         const macroName = tag.slice(2).toLowerCase();
         if (macroName === "slot") {
@@ -1844,6 +1886,17 @@ var init_anode = __esm(() => {
     }
     static register = true;
   };
+  X_OP_CONSUMED = {
+    slot: new Set,
+    text: new Set,
+    render: new Set(["as"]),
+    "render-it": new Set(["as"]),
+    "render-each": new Set(["as", "when", "loop-with"]),
+    show: new Set,
+    hide: new Set
+  };
+  X_OP_WRAPPABLE = new Set(["text", "render", "render-it", "render-each"]);
+  X_ATTR_WRAPPERS = { show: ShowNode, hide: HideNode };
   WRAPPER_NODES = {
     slot: SlotNode,
     show: ShowNode,
@@ -2084,11 +2137,29 @@ function checkComponent(Comp, lx = new LintContext) {
   });
 }
 function checkView(lx, view, Comp, referencedAlters, referencedComputed) {
+  checkParseIssues(lx, view);
   checkRenderItInLoop(lx, view);
   checkEventModifiers(lx, view);
   checkKnownHandlerNames(lx, view, Comp, referencedAlters, referencedComputed);
   checkMacroCallArgs(lx, view, Comp);
 }
+function checkParseIssues(lx, view) {
+  const issues = view.ctx.parseIssues;
+  if (!issues)
+    return;
+  for (const { kind, info } of issues) {
+    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 });
+    }
+  }
+}
 function checkMacroCallArgs(lx, view, Comp) {
   const { scope } = Comp;
   for (const macroNode of view.ctx.macroNodes) {
@@ -2377,9 +2448,28 @@ class LintContext {
     this.reports.push({ id, info, level, context: { ...this.frame } });
   }
 }
-var ALT_HANDLER_NOT_DEFINED = "ALT_HANDLER_NOT_DEFINED", ALT_HANDLER_NOT_REFERENCED = "ALT_HANDLER_NOT_REFERENCED", RENDER_IT_OUTSIDE_OF_LOOP = "RENDER_IT_OUTSIDE_OF_LOOP", UNKNOWN_EVENT_MODIFIER = "UNKNOWN_EVENT_MODIFIER", UNKNOWN_HANDLER_ARG_NAME = "UNKNOWN_HANDLER_ARG_NAME", INPUT_HANDLER_NOT_IMPLEMENTED = "INPUT_HANDLER_NOT_IMPLEMENTED", INPUT_HANDLER_NOT_REFERENCED = "INPUT_HANDLER_NOT_REFERENCED", INPUT_HANDLER_METHOD_NOT_IMPLEMENTED = "INPUT_HANDLER_METHOD_NOT_IMPLEMENTED", INPUT_HANDLER_FOR_INPUT_HANDLER_METHOD = "INPUT_HANDLER_FOR_INPUT_HANDLER_METHOD", INPUT_HANDLER_METHOD_FOR_INPUT_HANDLER = "INPUT_HANDLER_METHOD_FOR_INPUT_HANDLER", FIELD_VAL_NOT_DEFINED = "FIELD_VAL_NOT_DEFINED", COMPUTED_VAL_NOT_DEFINED = "COMPUTED_VAL_NOT_DEFINED", COMPUTED_NOT_REFERENCED = "COMPUTED_NOT_REFERENCED", DUPLICATE_ATTR_DEFINITION = "DUPLICATE_ATTR_DEFINITION", UNKNOWN_REQUEST_NAME = "UNKNOWN_REQUEST_NAME", UNKNOWN_COMPONENT_NAME = "UNKNOWN_COMPONENT_NAME", UNKNOWN_MACRO_ARG = "UNKNOWN_MACRO_ARG", LEVEL_WARN = "warn", LEVEL_ERROR = "error", LEVEL_HINT = "hint", NO_WRAPPERS, KNOWN_HANDLER_NAMES, LintParseContext;
+var ALT_HANDLER_NOT_DEFINED = "ALT_HANDLER_NOT_DEFINED", ALT_HANDLER_NOT_REFERENCED = "ALT_HANDLER_NOT_REFERENCED", RENDER_IT_OUTSIDE_OF_LOOP = "RENDER_IT_OUTSIDE_OF_LOOP", UNKNOWN_EVENT_MODIFIER = "UNKNOWN_EVENT_MODIFIER", UNKNOWN_HANDLER_ARG_NAME = "UNKNOWN_HANDLER_ARG_NAME", INPUT_HANDLER_NOT_IMPLEMENTED = "INPUT_HANDLER_NOT_IMPLEMENTED", INPUT_HANDLER_NOT_REFERENCED = "INPUT_HANDLER_NOT_REFERENCED", INPUT_HANDLER_METHOD_NOT_IMPLEMENTED = "INPUT_HANDLER_METHOD_NOT_IMPLEMENTED", INPUT_HANDLER_FOR_INPUT_HANDLER_METHOD = "INPUT_HANDLER_FOR_INPUT_HANDLER_METHOD", INPUT_HANDLER_METHOD_FOR_INPUT_HANDLER = "INPUT_HANDLER_METHOD_FOR_INPUT_HANDLER", FIELD_VAL_NOT_DEFINED = "FIELD_VAL_NOT_DEFINED", COMPUTED_VAL_NOT_DEFINED = "COMPUTED_VAL_NOT_DEFINED", COMPUTED_NOT_REFERENCED = "COMPUTED_NOT_REFERENCED", DUPLICATE_ATTR_DEFINITION = "DUPLICATE_ATTR_DEFINITION", UNKNOWN_REQUEST_NAME = "UNKNOWN_REQUEST_NAME", UNKNOWN_COMPONENT_NAME = "UNKNOWN_COMPONENT_NAME", UNKNOWN_MACRO_ARG = "UNKNOWN_MACRO_ARG", UNKNOWN_DIRECTIVE = "UNKNOWN_DIRECTIVE", UNKNOWN_X_OP = "UNKNOWN_X_OP", UNKNOWN_X_ATTR = "UNKNOWN_X_ATTR", MAYBE_DROP_AT_PREFIX = "MAYBE_DROP_AT_PREFIX", PARSE_ISSUE_KIND_TO_LINT_ID, X_KNOWN_OP_NAMES, X_KNOWN_ATTR_NAMES, AT_PREFIX_HINT_KNOWN_BY_KIND, LEVEL_WARN = "warn", LEVEL_ERROR = "error", LEVEL_HINT = "hint", NO_WRAPPERS, KNOWN_HANDLER_NAMES, LintParseContext;
 var init_lint_check = __esm(() => {
   init_anode();
+  PARSE_ISSUE_KIND_TO_LINT_ID = {
+    "unknown-directive": UNKNOWN_DIRECTIVE,
+    "unknown-x-op": UNKNOWN_X_OP,
+    "unknown-x-attr": UNKNOWN_X_ATTR
+  };
+  X_KNOWN_OP_NAMES = new Set([
+    "slot",
+    "text",
+    "render",
+    "render-it",
+    "render-each",
+    "show",
+    "hide"
+  ]);
+  X_KNOWN_ATTR_NAMES = new Set(["as", "when", "loop-with", "show", "hide"]);
+  AT_PREFIX_HINT_KNOWN_BY_KIND = {
+    "unknown-x-op": X_KNOWN_OP_NAMES,
+    "unknown-x-attr": X_KNOWN_ATTR_NAMES
+  };
   NO_WRAPPERS = {};
   KNOWN_HANDLER_NAMES = new Set([
     "value",
@@ -2405,10 +2495,14 @@ var init_lint_check = __esm(() => {
     constructor(document2, Text, Comment) {
       super(document2, Text, Comment);
       this.attrs = [];
+      this.parseIssues = [];
     }
     onAttributes(attrs, wrapperAttrs, textChild, isMacroCall = false) {
       this.attrs.push({ attrs, wrapperAttrs, textChild, isMacroCall });
     }
+    onParseIssue(kind, info) {
+      this.parseIssues.push({ kind, info });
+    }
   };
 });
 

package/dist/tutuca-dev.js

@@ -722,6 +722,8 @@ class AttrParser {
       this.parseThen(s);
     else if (directiveName.startsWith("else."))
       this.parseElse(s);
+    else
+      this.px.onParseIssue("unknown-directive", { name: directiveName, value: s });
   }
   _parseWhen(s) {
     if (this.eachAttr !== null)
@@ -1007,18 +1009,19 @@ class ANode extends BaseNode {
   static parse(html, px) {
     const nodes = px.parseHTML(html);
     if (nodes.length === 0)
-      return new TextNode("");
+      return new CommentNode("Empty View in ANode.parse");
     if (nodes.length === 1)
       return ANode.fromDOM(nodes[0], px);
-    const childs = new Array(nodes.length);
-    for (let i = 0;i < nodes.length; i++)
-      childs[i] = ANode.fromDOM(nodes[i], px);
+    const childs = [];
+    for (let i = 0;i < nodes.length; i++) {
+      const child = ANode.fromDOM(nodes[i], px);
+      if (child !== null)
+        childs.push(child);
+    }
     const trimmed = condenseChildsWhites(childs);
     if (trimmed.length === 0)
-      return new TextNode("");
-    if (trimmed.length === 1)
-      return trimmed[0];
-    return new FragmentNode(trimmed);
+      return new CommentNode("Empty View in ANode.parse");
+    return maybeFragment(trimmed);
   }
   static fromDOM(node, px) {
     if (node instanceof px.Text)
@@ -1033,25 +1036,37 @@ class ANode extends BaseNode {
     if (tag === "X" || isPseudoX) {
       if (attrs.length === 0)
         return maybeFragment(childs);
-      const { name, value } = attrs[isPseudoX ? 1 : 0];
+      const opIdx = isPseudoX ? 1 : 0;
+      const { name, value } = attrs[opIdx];
       const as = attrs.getNamedItem("as")?.value ?? null;
+      let node2;
       switch (name) {
         case "slot":
-          return new SlotNode(null, vp.const(value), maybeFragment(childs));
+          node2 = new SlotNode(null, vp.const(value), maybeFragment(childs));
+          break;
         case "text":
-          return px.addNodeIf(RenderTextNode, vp.parseText(value, px));
+          node2 = px.addNodeIf(RenderTextNode, vp.parseText(value, px));
+          break;
         case "render":
-          return px.addNodeIf(RenderNode, vp.parseRender(value, px), as);
+          node2 = px.addNodeIf(RenderNode, vp.parseRender(value, px), as);
+          break;
         case "render-it":
-          return px.addNodeIf(RenderItNode, vp.bindValIt, as);
+          node2 = px.addNodeIf(RenderItNode, vp.bindValIt, as);
+          break;
         case "render-each":
-          return RenderEachNode.parse(px, vp, value, as, attrs);
+          node2 = RenderEachNode.parse(px, vp, value, as, attrs);
+          break;
         case "show":
-          return px.addNodeIf(ShowNode, vp.parseCondValue(value, px), maybeFragment(childs));
+          node2 = px.addNodeIf(ShowNode, vp.parseCondValue(value, px), maybeFragment(childs));
+          break;
         case "hide":
-          return px.addNodeIf(HideNode, vp.parseCondValue(value, px), maybeFragment(childs));
+          node2 = px.addNodeIf(HideNode, vp.parseCondValue(value, px), maybeFragment(childs));
+          break;
+        default:
+          px.onParseIssue("unknown-x-op", { name, value });
+          return new CommentNode(`Error: InvalidSpecialTagOp ${name}=${value}`);
       }
-      return new CommentNode(`Error: InvalidSpecialTagOp ${name}=${value}`);
+      return processXExtras(node2, attrs, name, (isPseudoX ? 1 : 0) + 1, px);
     } else if (tag.charCodeAt(1) === 58 && tag.charCodeAt(0) === 88) {
       const macroName = tag.slice(2).toLowerCase();
       if (macroName === "slot") {
@@ -1072,6 +1087,30 @@ class ANode extends BaseNode {
     return new CommentNode(`Error: InvalidTagName ${tag}`);
   }
 }
+function processXExtras(node, attrs, opName, startIdx, px) {
+  const consumed = X_OP_CONSUMED[opName];
+  const wrappable = X_OP_WRAPPABLE.has(opName);
+  const wrappers = [];
+  for (let i = startIdx;i < attrs.length; i++) {
+    const a = attrs[i];
+    const aName = a.name;
+    if (consumed.has(aName))
+      continue;
+    if (wrappable && X_ATTR_WRAPPERS[aName]) {
+      wrappers.push([X_ATTR_WRAPPERS[aName], vp.parseCondValue(a.value, px)]);
+      continue;
+    }
+    const issueInfo = { op: opName, name: aName, value: a.value };
+    px.onParseIssue("unknown-x-attr", issueInfo);
+  }
+  for (let i = wrappers.length - 1;i >= 0; i--) {
+    const [Cls, val] = wrappers[i];
+    const wrapper = px.addNodeIf(Cls, val, node);
+    if (wrapper !== null)
+      node = wrapper;
+  }
+  return node;
+}
 function wrap(node, px, wrappers) {
   if (wrappers) {
     for (let i = wrappers.length - 1;i >= 0; i--) {
@@ -1299,6 +1338,17 @@ class IterInfo {
 }
 var filterAlwaysTrue = (_v, _k, _seq) => true;
 var nullLoopWith = (seq) => ({ seq });
+var X_OP_CONSUMED = {
+  slot: new Set,
+  text: new Set,
+  render: new Set(["as"]),
+  "render-it": new Set(["as"]),
+  "render-each": new Set(["as", "when", "loop-with"]),
+  show: new Set,
+  hide: new Set
+};
+var X_OP_WRAPPABLE = new Set(["text", "render", "render-it", "render-each"]);
+var X_ATTR_WRAPPERS = { show: ShowNode, hide: HideNode };
 var WRAPPER_NODES = {
   slot: SlotNode,
   show: ShowNode,
@@ -1375,6 +1425,9 @@ class ParseContext {
     return this.nodes[id] ?? null;
   }
   onAttributes(_attrs, _wrapperAttrs, _textChild, _isMacroCall) {}
+  onParseIssue(kind, info) {
+    console.warn(`tutuca parse issue [${kind}]`, info);
+  }
 }
 var _htmlBlockTags = "ADDRESS,ARTICLE,ASIDE,BLOCKQUOTE,CAPTION,COL,COLGROUP,DETAILS,DIALOG,DIV,DD,DL,DT,FIELDSET,FIGCAPTION,FIGURE,FOOTER,FORM,H1,H2,H3,H4,H5,H6,HEADER,HGROUP,HR,LEGEND,LI,MAIN,MENU,NAV,OL,P,PRE,SECTION,SUMMARY,TABLE,TBODY,TD,TFOOT,TH,THEAD,TR,UL";
 var HTML_BLOCK_TAGS = new Set(_htmlBlockTags.split(","));
@@ -1574,6 +1627,29 @@ var DUPLICATE_ATTR_DEFINITION = "DUPLICATE_ATTR_DEFINITION";
 var UNKNOWN_REQUEST_NAME = "UNKNOWN_REQUEST_NAME";
 var UNKNOWN_COMPONENT_NAME = "UNKNOWN_COMPONENT_NAME";
 var UNKNOWN_MACRO_ARG = "UNKNOWN_MACRO_ARG";
+var UNKNOWN_DIRECTIVE = "UNKNOWN_DIRECTIVE";
+var UNKNOWN_X_OP = "UNKNOWN_X_OP";
+var UNKNOWN_X_ATTR = "UNKNOWN_X_ATTR";
+var MAYBE_DROP_AT_PREFIX = "MAYBE_DROP_AT_PREFIX";
+var PARSE_ISSUE_KIND_TO_LINT_ID = {
+  "unknown-directive": UNKNOWN_DIRECTIVE,
+  "unknown-x-op": UNKNOWN_X_OP,
+  "unknown-x-attr": UNKNOWN_X_ATTR
+};
+var X_KNOWN_OP_NAMES = new Set([
+  "slot",
+  "text",
+  "render",
+  "render-it",
+  "render-each",
+  "show",
+  "hide"
+]);
+var X_KNOWN_ATTR_NAMES = new Set(["as", "when", "loop-with", "show", "hide"]);
+var AT_PREFIX_HINT_KNOWN_BY_KIND = {
+  "unknown-x-op": X_KNOWN_OP_NAMES,
+  "unknown-x-attr": X_KNOWN_ATTR_NAMES
+};
 var LEVEL_WARN = "warn";
 var LEVEL_ERROR = "error";
 var LEVEL_HINT = "hint";
@@ -1594,11 +1670,29 @@ function checkComponent(Comp, lx = new LintContext) {
   });
 }
 function checkView(lx, view, Comp, referencedAlters, referencedComputed) {
+  checkParseIssues(lx, view);
   checkRenderItInLoop(lx, view);
   checkEventModifiers(lx, view);
   checkKnownHandlerNames(lx, view, Comp, referencedAlters, referencedComputed);
   checkMacroCallArgs(lx, view, Comp);
 }
+function checkParseIssues(lx, view) {
+  const issues = view.ctx.parseIssues;
+  if (!issues)
+    return;
+  for (const { kind, info } of issues) {
+    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 });
+    }
+  }
+}
 function checkMacroCallArgs(lx, view, Comp) {
   const { scope } = Comp;
   for (const macroNode of view.ctx.macroNodes) {
@@ -1913,10 +2007,14 @@ class LintParseContext extends ParseContext {
   constructor(document2, Text, Comment) {
     super(document2, Text, Comment);
     this.attrs = [];
+    this.parseIssues = [];
   }
   onAttributes(attrs, wrapperAttrs, textChild, isMacroCall = false) {
     this.attrs.push({ attrs, wrapperAttrs, textChild, isMacroCall });
   }
+  onParseIssue(kind, info) {
+    this.parseIssues.push({ kind, info });
+  }
 }
 
 // tools/format/lint.js
@@ -1956,6 +2054,14 @@ function lintIdToMessage(id, info) {
       return `Alter handler '${info.name}' is defined but not referenced`;
     case "UNKNOWN_MACRO_ARG":
       return `Argument '${info.name}' is not declared in macro '${info.macroName}'`;
+    case "UNKNOWN_DIRECTIVE":
+      return `Unknown directive '@${info.name}=${JSON.stringify(info.value)}'`;
+    case "UNKNOWN_X_OP":
+      return `Unknown <x> op '${info.name}=${JSON.stringify(info.value)}'`;
+    case "UNKNOWN_X_ATTR":
+      return `Unknown attribute '${info.name}=${JSON.stringify(info.value)}' on <x ${info.op}>`;
+    case "MAYBE_DROP_AT_PREFIX":
+      return `Did you mean '${info.suggestion}'? Drop the '@' prefix on <x>.`;
     case "LINT_ERROR":
       return info.message;
     default:
@@ -8624,6 +8730,7 @@ class LintClassCollectorCtx extends ParseCtxClassSetCollector {
   constructor(...args) {
     super(...args);
     this.attrs = [];
+    this.parseIssues = [];
   }
   enterMacro(macroName, macroVars, macroSlots) {
     const { document: document2, Text, Comment, nodes, events, macroNodes } = this;
@@ -8631,12 +8738,16 @@ class LintClassCollectorCtx extends ParseCtxClassSetCollector {
     const v = new LintClassCollectorCtx(document2, Text, Comment, nodes, events, macroNodes, frame, this);
     v.classes = this.classes;
     v.attrs = this.attrs;
+    v.parseIssues = this.parseIssues;
     return v;
   }
   onAttributes(attrs, wrapperAttrs, textChild, isMacroCall = false) {
     super.onAttributes(attrs, wrapperAttrs, textChild, isMacroCall);
     this.attrs.push({ attrs, wrapperAttrs, textChild, isMacroCall });
   }
+  onParseIssue(kind, info) {
+    this.parseIssues.push({ kind, info });
+  }
 }
 export {
   version,
@@ -8688,10 +8799,13 @@ export {
   compileClassesToStyle,
   checkComponent,
   check,
+  UNKNOWN_X_OP,
+  UNKNOWN_X_ATTR,
   UNKNOWN_REQUEST_NAME,
   UNKNOWN_MACRO_ARG,
   UNKNOWN_HANDLER_ARG_NAME,
   UNKNOWN_EVENT_MODIFIER,
+  UNKNOWN_DIRECTIVE,
   UNKNOWN_COMPONENT_NAME,
   Stack2 as Stack,
   Set2 as Set,
@@ -8707,6 +8821,7 @@ export {
   OrderedMap,
   OrderedMap as OMap,
   Map2 as Map,
+  MAYBE_DROP_AT_PREFIX,
   List,
   LintParseContext,
   LintContext,