htmljs-parser 5.1.4 → 5.2.0

package/README.md

@@ -163,7 +163,7 @@ const parser = createParser({
    * 1╭─ <div>Hi</div>
    *  ╰─ ╰─ openTagStart
    */
-  onOpenTagStart(range) {}
+  onOpenTagStart(range) {},
 
   /**
    * Called when a tag name, which can include placeholders, has been parsed.
@@ -249,6 +249,18 @@ const parser = createParser({
     range.expressions; // A list of placeholder ranges (similar to whats emitted via onPlaceholder).
   },
 
+  /**
+   * Called after the type arguments for a tag have been parsed.
+   *
+   * @example
+   * 1╭─ <foo<string>>
+   *  │      │╰─ tagTypeArgs.value "string"
+   *  ╰─     ╰─ tagTypeArgs "<string>"
+   */
+  onTagTypeArgs(range) {
+    range.value; // Another range that includes only the type arguments themselves and not the angle brackets.
+  },
+
   /**
    * Called after a tag variable has been parsed.
    *
@@ -273,6 +285,18 @@ const parser = createParser({
     range.value; // Another range that includes only the args themselves and not the outer parenthesis.
   },
 
+  /**
+   * Called after type parameters for the tag parameters have been parsed.
+   *
+   * @example
+   * 1╭─ <tag<T>|input: { name: T }|>
+   *  │      │╰─ tagTypeParams.value
+   *  ╰─     ╰─ tagTypeParams "<T>"
+   */
+  onTagTypeParams(range) {
+    range.value; // Another range that includes only the type params themselves and not the angle brackets.
+  },
+
   /**
    * Called after tag parameters have been parsed.
    *
@@ -334,6 +358,9 @@ const parser = createParser({
    *  ╰─             ╰─ attrMethod "(ev) { foo(); }"
    */
   onAttrMethod(range) {
+    range.typeParams; // Another range which includes the type params for the method.
+    range.typeParams.value; // Another range which includes the type params without outer angle brackets.
+
     range.params; // Another range which includes the params for the method.
     range.params.value; // Another range which includes the method params without outer parenthesis.
 

package/dist/index.js

@@ -57,6 +57,9 @@ var ErrorCode = /* @__PURE__ */ ((ErrorCode3) => {
   ErrorCode3[ErrorCode3["MISSING_TAG_VARIABLE"] = 23] = "MISSING_TAG_VARIABLE";
   ErrorCode3[ErrorCode3["RESERVED_TAG_NAME"] = 24] = "RESERVED_TAG_NAME";
   ErrorCode3[ErrorCode3["ROOT_TAG_ONLY"] = 25] = "ROOT_TAG_ONLY";
+  ErrorCode3[ErrorCode3["INVALID_TAG_PARAMS"] = 26] = "INVALID_TAG_PARAMS";
+  ErrorCode3[ErrorCode3["INVALID_TAG_TYPES"] = 27] = "INVALID_TAG_TYPES";
+  ErrorCode3[ErrorCode3["INVALID_ATTR_TYPE_PARAMS"] = 28] = "INVALID_ATTR_TYPE_PARAMS";
   return ErrorCode3;
 })(ErrorCode || {});
 var TagType = /* @__PURE__ */ ((TagType2) => {
@@ -102,6 +105,9 @@ function htmlEOF() {
     }
   }
 }
+function matchesCloseAngleBracket(code) {
+  return code === 62 /* CLOSE_ANGLE_BRACKET */;
+}
 function matchesCloseParen(code) {
   return code === 41 /* CLOSE_PAREN */;
 }
@@ -392,8 +398,9 @@ var TAG_STAGE = /* @__PURE__ */ ((TAG_STAGE2) => {
   TAG_STAGE2[TAG_STAGE2["UNKNOWN"] = 0] = "UNKNOWN";
   TAG_STAGE2[TAG_STAGE2["VAR"] = 1] = "VAR";
   TAG_STAGE2[TAG_STAGE2["ARGUMENT"] = 2] = "ARGUMENT";
-  TAG_STAGE2[TAG_STAGE2["PARAMS"] = 3] = "PARAMS";
-  TAG_STAGE2[TAG_STAGE2["ATTR_GROUP"] = 4] = "ATTR_GROUP";
+  TAG_STAGE2[TAG_STAGE2["TYPES"] = 3] = "TYPES";
+  TAG_STAGE2[TAG_STAGE2["PARAMS"] = 4] = "PARAMS";
+  TAG_STAGE2[TAG_STAGE2["ATTR_GROUP"] = 5] = "ATTR_GROUP";
   return TAG_STAGE2;
 })(TAG_STAGE || {});
 var OPEN_TAG = {
@@ -412,6 +419,8 @@ var OPEN_TAG = {
       hasShorthandId: false,
       hasArgs: false,
       hasAttrs: false,
+      hasParams: false,
+      types: void 0,
       selfClosed: false,
       shorthandEnd: -1,
       tagName: void 0,
@@ -449,13 +458,13 @@ var OPEN_TAG = {
     }
   },
   eol(_, tag) {
-    if (this.isConcise && tag.stage !== 4 /* ATTR_GROUP */) {
+    if (this.isConcise && tag.stage !== 5 /* ATTR_GROUP */) {
       this.exitState();
     }
   },
   eof(tag) {
     if (this.isConcise) {
-      if (tag.stage === 4 /* ATTR_GROUP */) {
+      if (tag.stage === 5 /* ATTR_GROUP */) {
         this.emitError(
           tag,
           19 /* MALFORMED_OPEN_TAG */,
@@ -516,7 +525,7 @@ var OPEN_TAG = {
           );
           return;
         }
-        if (tag.stage === 4 /* ATTR_GROUP */) {
+        if (tag.stage === 5 /* ATTR_GROUP */) {
           this.emitError(
             this.pos,
             19 /* MALFORMED_OPEN_TAG */,
@@ -545,7 +554,7 @@ var OPEN_TAG = {
         this.enterState(states_exports.BEGIN_DELIMITED_HTML_BLOCK);
         return;
       } else if (code === 91 /* OPEN_SQUARE_BRACKET */) {
-        if (tag.stage === 4 /* ATTR_GROUP */) {
+        if (tag.stage === 5 /* ATTR_GROUP */) {
           this.emitError(
             this.pos,
             19 /* MALFORMED_OPEN_TAG */,
@@ -553,10 +562,10 @@ var OPEN_TAG = {
           );
           return;
         }
-        tag.stage = 4 /* ATTR_GROUP */;
+        tag.stage = 5 /* ATTR_GROUP */;
         return;
       } else if (code === 93 /* CLOSE_SQUARE_BRACKET */) {
-        if (tag.stage !== 4 /* ATTR_GROUP */) {
+        if (tag.stage !== 5 /* ATTR_GROUP */) {
           this.emitError(
             this.pos,
             19 /* MALFORMED_OPEN_TAG */,
@@ -577,13 +586,6 @@ var OPEN_TAG = {
       this.exitState();
       return;
     }
-    if (code === 60 /* OPEN_ANGLE_BRACKET */) {
-      return this.emitError(
-        this.pos,
-        2 /* INVALID_ATTRIBUTE_NAME */,
-        'Invalid attribute name. Attribute name cannot begin with the "<" character.'
-      );
-    }
     if (code === 47 /* FORWARD_SLASH */) {
       switch (this.lookAtCharCodeAhead(1)) {
         case 47 /* FORWARD_SLASH */:
@@ -601,113 +603,171 @@ var OPEN_TAG = {
       this.pos++;
       this.forward = 0;
       this.consumeWhitespace();
-    } else if (code === 47 /* FORWARD_SLASH */ && !tag.hasAttrs) {
-      tag.stage = 1 /* VAR */;
-      this.pos++;
-      this.forward = 0;
-      if (isWhitespaceCode(this.lookAtCharCodeAhead(0))) {
-        return this.emitError(
-          this.pos,
-          23 /* MISSING_TAG_VARIABLE */,
-          "A slash was found that was not followed by a variable name or lhs expression"
-        );
-      }
-      const expr = this.enterState(states_exports.EXPRESSION);
-      expr.operators = true;
-      expr.terminatedByWhitespace = true;
-      expr.shouldTerminate = this.isConcise ? shouldTerminateConciseTagVar : shouldTerminateHtmlTagVar;
-    } else if (code === 40 /* OPEN_PAREN */ && !tag.hasAttrs) {
-      if (tag.hasArgs) {
-        this.emitError(
-          this.pos,
-          11 /* INVALID_TAG_ARGUMENT */,
-          "A tag can only have one argument"
-        );
-        return;
-      }
-      tag.stage = 2 /* ARGUMENT */;
-      this.pos++;
-      this.forward = 0;
-      this.enterState(states_exports.EXPRESSION).shouldTerminate = matchesCloseParen;
-    } else if (code === 124 /* PIPE */ && !tag.hasAttrs) {
-      tag.stage = 3 /* PARAMS */;
-      this.pos++;
-      this.forward = 0;
-      this.enterState(states_exports.EXPRESSION).shouldTerminate = matchesPipe;
     } else {
       this.forward = 0;
-      if (tag.tagName) {
+      if (tag.hasAttrs) {
         this.enterState(states_exports.ATTRIBUTE);
-        tag.hasAttrs = true;
-      } else {
-        this.enterState(states_exports.TAG_NAME);
-      }
-    }
-  },
-  return(child, tag) {
-    var _a, _b, _c, _d, _e, _f;
-    switch (child.state) {
-      case states_exports.JS_COMMENT_BLOCK: {
-        break;
-      }
-      case states_exports.EXPRESSION: {
-        switch (tag.stage) {
-          case 1 /* VAR */: {
-            if (child.start === child.end) {
+      } else if (tag.tagName) {
+        switch (code) {
+          case 47 /* FORWARD_SLASH */: {
+            tag.stage = 1 /* VAR */;
+            this.pos++;
+            if (isWhitespaceCode(this.lookAtCharCodeAhead(0))) {
               return this.emitError(
-                child,
+                this.pos,
                 23 /* MISSING_TAG_VARIABLE */,
                 "A slash was found that was not followed by a variable name or lhs expression"
               );
             }
-            (_b = (_a = this.options).onTagVar) == null ? void 0 : _b.call(_a, {
-              start: child.start - 1,
-              end: child.end,
-              value: {
-                start: child.start,
-                end: child.end
-              }
-            });
+            const expr = this.enterState(states_exports.EXPRESSION);
+            expr.operators = true;
+            expr.terminatedByWhitespace = true;
+            expr.shouldTerminate = this.isConcise ? shouldTerminateConciseTagVar : shouldTerminateHtmlTagVar;
             break;
           }
-          case 2 /* ARGUMENT */: {
-            const start = child.start - 1;
-            const end = ++this.pos;
-            const value = {
-              start: child.start,
-              end: child.end
-            };
-            if (this.consumeWhitespaceIfBefore("{")) {
-              const attr = this.enterState(states_exports.ATTRIBUTE);
-              attr.start = start;
-              attr.args = { start, end, value };
-              tag.hasAttrs = true;
-              this.forward = 0;
-            } else {
-              tag.hasArgs = true;
-              (_d = (_c = this.options).onTagArgs) == null ? void 0 : _d.call(_c, {
-                start,
-                end,
-                value
-              });
+          case 40 /* OPEN_PAREN */:
+            if (tag.hasArgs) {
+              this.emitError(
+                this.pos,
+                11 /* INVALID_TAG_ARGUMENT */,
+                "A tag can only have one argument"
+              );
+              return;
             }
+            tag.hasArgs = true;
+            tag.stage = 2 /* ARGUMENT */;
+            this.pos++;
+            this.enterState(states_exports.EXPRESSION).shouldTerminate = matchesCloseParen;
             break;
-          }
-          case 3 /* PARAMS */: {
-            const end = ++this.pos;
-            (_f = (_e = this.options).onTagParams) == null ? void 0 : _f.call(_e, {
-              start: child.start - 1,
-              end,
-              value: {
-                start: child.start,
-                end: child.end
-              }
-            });
+          case 124 /* PIPE */:
+            if (tag.hasParams) {
+              this.emitError(
+                this.pos,
+                26 /* INVALID_TAG_PARAMS */,
+                "A tag can only specify parameters once"
+              );
+              return;
+            }
+            tag.hasParams = true;
+            tag.stage = 4 /* PARAMS */;
+            this.pos++;
+            this.enterState(states_exports.EXPRESSION).shouldTerminate = matchesPipe;
+            break;
+          case 60 /* OPEN_ANGLE_BRACKET */:
+            tag.stage = 3 /* TYPES */;
+            this.pos++;
+            this.enterState(states_exports.EXPRESSION).shouldTerminate = matchesCloseAngleBracket;
             break;
+          default:
+            tag.hasAttrs = true;
+            this.enterState(states_exports.ATTRIBUTE);
+        }
+      } else {
+        this.enterState(states_exports.TAG_NAME);
+      }
+    }
+  },
+  return(child, tag) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p;
+    if (child.state !== states_exports.EXPRESSION)
+      return;
+    switch (tag.stage) {
+      case 1 /* VAR */: {
+        if (child.start === child.end) {
+          return this.emitError(
+            child,
+            23 /* MISSING_TAG_VARIABLE */,
+            "A slash was found that was not followed by a variable name or lhs expression"
+          );
+        }
+        (_b = (_a = this.options).onTagVar) == null ? void 0 : _b.call(_a, {
+          start: child.start - 1,
+          end: child.end,
+          value: {
+            start: child.start,
+            end: child.end
           }
+        });
+        break;
+      }
+      case 2 /* ARGUMENT */: {
+        const { types } = tag;
+        const start = child.start - 1;
+        const end = ++this.pos;
+        const value = {
+          start: child.start,
+          end: child.end
+        };
+        if (this.consumeWhitespaceIfBefore("{")) {
+          const attr = this.enterState(states_exports.ATTRIBUTE);
+          if (types) {
+            attr.start = types.start;
+            attr.typeParams = types;
+          } else {
+            attr.start = start;
+          }
+          attr.args = { start, end, value };
+          this.forward = 0;
+          tag.hasAttrs = true;
+        } else {
+          if (types) {
+            (_d = (_c = this.options).onTagTypeArgs) == null ? void 0 : _d.call(_c, types);
+          }
+          (_f = (_e = this.options).onTagArgs) == null ? void 0 : _f.call(_e, {
+            start,
+            end,
+            value
+          });
+        }
+        break;
+      }
+      case 3 /* TYPES */: {
+        const { types, hasParams, hasArgs } = tag;
+        const end = ++this.pos;
+        const typeArgs = {
+          start: child.start - 1,
+          end,
+          value: {
+            start: child.start,
+            end: child.end
+          }
+        };
+        this.consumeWhitespace();
+        const nextCode = this.lookAtCharCodeAhead(0);
+        if (!hasParams && nextCode === 124 /* PIPE */) {
+          if (types) {
+            (_h = (_g = this.options).onTagTypeArgs) == null ? void 0 : _h.call(_g, types);
+          }
+          (_j = (_i = this.options).onTagTypeParams) == null ? void 0 : _j.call(_i, typeArgs);
+        } else if (!hasArgs && nextCode === 40 /* OPEN_PAREN */) {
+          if (types) {
+            (_l = (_k = this.options).onTagTypeArgs) == null ? void 0 : _l.call(_k, types);
+          }
+          tag.types = typeArgs;
+        } else if (!(types || hasParams || hasArgs)) {
+          (_n = (_m = this.options).onTagTypeArgs) == null ? void 0 : _n.call(_m, typeArgs);
+          tag.types = typeArgs;
+        } else {
+          this.emitError(
+            child,
+            27 /* INVALID_TAG_TYPES */,
+            "Unexpected types. Type arguments must follow a tag name and type paremeters must precede a method or tag parameters."
+          );
         }
         break;
       }
+      case 4 /* PARAMS */: {
+        const end = ++this.pos;
+        (_p = (_o = this.options).onTagParams) == null ? void 0 : _p.call(_o, {
+          start: child.start - 1,
+          end,
+          value: {
+            start: child.start,
+            end: child.end
+          }
+        });
+        break;
+      }
     }
   }
 };
@@ -718,6 +778,7 @@ function shouldTerminateConciseTagVar(code, data, pos) {
     case 124 /* PIPE */:
     case 40 /* OPEN_PAREN */:
     case 59 /* SEMICOLON */:
+    case 60 /* OPEN_ANGLE_BRACKET */:
       return true;
     case 58 /* COLON */:
       return data.charCodeAt(pos + 1) === 61 /* EQUAL */;
@@ -732,6 +793,7 @@ function shouldTerminateHtmlTagVar(code, data, pos) {
     case 61 /* EQUAL */:
     case 40 /* OPEN_PAREN */:
     case 62 /* CLOSE_ANGLE_BRACKET */:
+    case 60 /* OPEN_ANGLE_BRACKET */:
       return true;
     case 58 /* COLON */:
       return data.charCodeAt(pos + 1) === 61 /* EQUAL */;
@@ -755,6 +817,7 @@ var ATTRIBUTE = {
       stage: 0 /* UNKNOWN */,
       name: void 0,
       args: false,
+      typeParams: void 0,
       bound: false,
       spread: false
     };
@@ -785,25 +848,37 @@ var ATTRIBUTE = {
       const expr = this.enterState(states_exports.EXPRESSION);
       expr.operators = true;
       expr.terminatedByWhitespace = true;
-      expr.shouldTerminate = this.isConcise ? this.activeTag.stage === 4 /* ATTR_GROUP */ ? shouldTerminateConciseGroupedAttrValue : shouldTerminateConciseAttrValue : shouldTerminateHtmlAttrValue;
+      expr.shouldTerminate = this.isConcise ? this.activeTag.stage === 5 /* ATTR_GROUP */ ? shouldTerminateConciseGroupedAttrValue : shouldTerminateConciseAttrValue : shouldTerminateHtmlAttrValue;
     } else if (code === 40 /* OPEN_PAREN */) {
       ensureAttrName(this, attr);
       attr.stage = 3 /* ARGUMENT */;
       this.pos++;
       this.forward = 0;
       this.enterState(states_exports.EXPRESSION).shouldTerminate = matchesCloseParen;
+    } else if (code === 60 /* OPEN_ANGLE_BRACKET */ && attr.stage === 1 /* NAME */) {
+      attr.stage = 4 /* TYPE_PARAMS */;
+      this.pos++;
+      this.forward = 0;
+      this.enterState(states_exports.EXPRESSION).shouldTerminate = matchesCloseAngleBracket;
     } else if (code === 123 /* OPEN_CURLY_BRACE */ && attr.args) {
       ensureAttrName(this, attr);
-      attr.stage = 4 /* BLOCK */;
+      attr.stage = 5 /* BLOCK */;
       this.pos++;
       this.forward = 0;
       this.enterState(states_exports.EXPRESSION).shouldTerminate = matchesCloseCurlyBrace;
     } else if (attr.stage === 0 /* UNKNOWN */) {
+      if (code === 60 /* OPEN_ANGLE_BRACKET */) {
+        return this.emitError(
+          this.pos,
+          2 /* INVALID_ATTRIBUTE_NAME */,
+          'Invalid attribute name. Attribute name cannot begin with the "<" character.'
+        );
+      }
       attr.stage = 1 /* NAME */;
       this.forward = 0;
       const expr = this.enterState(states_exports.EXPRESSION);
       expr.terminatedByWhitespace = true;
-      expr.shouldTerminate = this.isConcise ? this.activeTag.stage === 4 /* ATTR_GROUP */ ? shouldTerminateConciseGroupedAttrName : shouldTerminateConciseAttrName : shouldTerminateHtmlAttrName;
+      expr.shouldTerminate = this.isConcise ? this.activeTag.stage === 5 /* ATTR_GROUP */ ? shouldTerminateConciseGroupedAttrName : shouldTerminateConciseAttrName : shouldTerminateHtmlAttrName;
     } else {
       this.exitState();
     }
@@ -856,6 +931,12 @@ var ATTRIBUTE = {
             end,
             value
           };
+        } else if (attr.typeParams) {
+          this.emitError(
+            child,
+            1 /* INVALID_ATTRIBUTE_ARGUMENT */,
+            "An attribute cannot have both type parameters and arguments"
+          );
         } else {
           attr.args = true;
           (_d = (_c = this.options).onAttrArgs) == null ? void 0 : _d.call(_c, {
@@ -866,14 +947,16 @@ var ATTRIBUTE = {
         }
         break;
       }
-      case 4 /* BLOCK */: {
+      case 5 /* BLOCK */: {
         const params = attr.args;
-        const start = params.start;
         const end = ++this.pos;
+        const { typeParams } = attr;
+        const start = typeParams ? typeParams.start : params.start;
         (_f = (_e = this.options).onAttrMethod) == null ? void 0 : _f.call(_e, {
           start,
           end,
           params,
+          typeParams,
           body: {
             start: child.start - 1,
             end,
@@ -886,6 +969,26 @@ var ATTRIBUTE = {
         this.exitState();
         break;
       }
+      case 4 /* TYPE_PARAMS */: {
+        const start = child.start - 1;
+        const end = ++this.pos;
+        if (!this.consumeWhitespaceIfBefore("(")) {
+          return this.emitError(
+            child,
+            28 /* INVALID_ATTR_TYPE_PARAMS */,
+            "Attribute cannot contain type parameters unless it is a shorthand method"
+          );
+        }
+        attr.typeParams = {
+          start,
+          end,
+          value: {
+            start: child.start,
+            end: child.end
+          }
+        };
+        break;
+      }
       case 2 /* VALUE */: {
         if (child.start === child.end) {
           return this.emitError(
@@ -935,6 +1038,7 @@ function shouldTerminateHtmlAttrName(code, data, pos) {
     case 61 /* EQUAL */:
     case 40 /* OPEN_PAREN */:
     case 62 /* CLOSE_ANGLE_BRACKET */:
+    case 60 /* OPEN_ANGLE_BRACKET */:
       return true;
     case 58 /* COLON */:
       return data.charCodeAt(pos + 1) === 61 /* EQUAL */;
@@ -962,6 +1066,7 @@ function shouldTerminateConciseAttrName(code, data, pos) {
     case 61 /* EQUAL */:
     case 40 /* OPEN_PAREN */:
     case 59 /* SEMICOLON */:
+    case 60 /* OPEN_ANGLE_BRACKET */:
       return true;
     case 58 /* COLON */:
       return data.charCodeAt(pos + 1) === 61 /* EQUAL */;
@@ -988,6 +1093,7 @@ function shouldTerminateConciseGroupedAttrName(code, data, pos) {
     case 61 /* EQUAL */:
     case 40 /* OPEN_PAREN */:
     case 93 /* CLOSE_SQUARE_BRACKET */:
+    case 60 /* OPEN_ANGLE_BRACKET */:
       return true;
     case 58 /* COLON */:
       return data.charCodeAt(pos + 1) === 61 /* EQUAL */;
@@ -1540,6 +1646,7 @@ var EXPRESSION = {
           default: {
             if (canFollowDivision(this.getPreviousNonWhitespaceCharCode())) {
               this.pos++;
+              this.forward = 0;
               this.consumeWhitespace();
             } else {
               this.enterState(states_exports.REGULAR_EXPRESSION);
@@ -2328,6 +2435,7 @@ var TAG_NAME = {
       parent,
       start,
       end: start,
+      shorthandCode: -1,
       expressions: [],
       quasis: [{ start, end: start }]
     };
@@ -2407,7 +2515,7 @@ var TAG_NAME = {
       this.pos += 2;
       this.forward = 0;
       this.enterState(states_exports.EXPRESSION).shouldTerminate = matchesCloseCurlyBrace;
-    } else if (isWhitespaceCode(code) || code === 61 /* EQUAL */ || code === 58 /* COLON */ && this.lookAtCharCodeAhead(1) === 61 /* EQUAL */ || code === 40 /* OPEN_PAREN */ || code === 47 /* FORWARD_SLASH */ || code === 124 /* PIPE */ || (this.isConcise ? code === 59 /* SEMICOLON */ : code === 62 /* CLOSE_ANGLE_BRACKET */)) {
+    } else if (isWhitespaceCode(code) || code === 61 /* EQUAL */ || code === 58 /* COLON */ && this.lookAtCharCodeAhead(1) === 61 /* EQUAL */ || code === 40 /* OPEN_PAREN */ || code === 47 /* FORWARD_SLASH */ || code === 124 /* PIPE */ || code === 60 /* OPEN_ANGLE_BRACKET */ || (this.isConcise ? code === 59 /* SEMICOLON */ : code === 62 /* CLOSE_ANGLE_BRACKET */)) {
       this.activeTag.shorthandEnd = this.pos;
       this.exitState();
     } else if (code === 46 /* PERIOD */ || code === 35 /* NUMBER_SIGN */) {

package/dist/index.mjs

@@ -32,6 +32,9 @@ var ErrorCode = /* @__PURE__ */ ((ErrorCode3) => {
   ErrorCode3[ErrorCode3["MISSING_TAG_VARIABLE"] = 23] = "MISSING_TAG_VARIABLE";
   ErrorCode3[ErrorCode3["RESERVED_TAG_NAME"] = 24] = "RESERVED_TAG_NAME";
   ErrorCode3[ErrorCode3["ROOT_TAG_ONLY"] = 25] = "ROOT_TAG_ONLY";
+  ErrorCode3[ErrorCode3["INVALID_TAG_PARAMS"] = 26] = "INVALID_TAG_PARAMS";
+  ErrorCode3[ErrorCode3["INVALID_TAG_TYPES"] = 27] = "INVALID_TAG_TYPES";
+  ErrorCode3[ErrorCode3["INVALID_ATTR_TYPE_PARAMS"] = 28] = "INVALID_ATTR_TYPE_PARAMS";
   return ErrorCode3;
 })(ErrorCode || {});
 var TagType = /* @__PURE__ */ ((TagType2) => {
@@ -77,6 +80,9 @@ function htmlEOF() {
     }
   }
 }
+function matchesCloseAngleBracket(code) {
+  return code === 62 /* CLOSE_ANGLE_BRACKET */;
+}
 function matchesCloseParen(code) {
   return code === 41 /* CLOSE_PAREN */;
 }
@@ -367,8 +373,9 @@ var TAG_STAGE = /* @__PURE__ */ ((TAG_STAGE2) => {
   TAG_STAGE2[TAG_STAGE2["UNKNOWN"] = 0] = "UNKNOWN";
   TAG_STAGE2[TAG_STAGE2["VAR"] = 1] = "VAR";
   TAG_STAGE2[TAG_STAGE2["ARGUMENT"] = 2] = "ARGUMENT";
-  TAG_STAGE2[TAG_STAGE2["PARAMS"] = 3] = "PARAMS";
-  TAG_STAGE2[TAG_STAGE2["ATTR_GROUP"] = 4] = "ATTR_GROUP";
+  TAG_STAGE2[TAG_STAGE2["TYPES"] = 3] = "TYPES";
+  TAG_STAGE2[TAG_STAGE2["PARAMS"] = 4] = "PARAMS";
+  TAG_STAGE2[TAG_STAGE2["ATTR_GROUP"] = 5] = "ATTR_GROUP";
   return TAG_STAGE2;
 })(TAG_STAGE || {});
 var OPEN_TAG = {
@@ -387,6 +394,8 @@ var OPEN_TAG = {
       hasShorthandId: false,
       hasArgs: false,
       hasAttrs: false,
+      hasParams: false,
+      types: void 0,
       selfClosed: false,
       shorthandEnd: -1,
       tagName: void 0,
@@ -424,13 +433,13 @@ var OPEN_TAG = {
     }
   },
   eol(_, tag) {
-    if (this.isConcise && tag.stage !== 4 /* ATTR_GROUP */) {
+    if (this.isConcise && tag.stage !== 5 /* ATTR_GROUP */) {
       this.exitState();
     }
   },
   eof(tag) {
     if (this.isConcise) {
-      if (tag.stage === 4 /* ATTR_GROUP */) {
+      if (tag.stage === 5 /* ATTR_GROUP */) {
         this.emitError(
           tag,
           19 /* MALFORMED_OPEN_TAG */,
@@ -491,7 +500,7 @@ var OPEN_TAG = {
           );
           return;
         }
-        if (tag.stage === 4 /* ATTR_GROUP */) {
+        if (tag.stage === 5 /* ATTR_GROUP */) {
           this.emitError(
             this.pos,
             19 /* MALFORMED_OPEN_TAG */,
@@ -520,7 +529,7 @@ var OPEN_TAG = {
         this.enterState(states_exports.BEGIN_DELIMITED_HTML_BLOCK);
         return;
       } else if (code === 91 /* OPEN_SQUARE_BRACKET */) {
-        if (tag.stage === 4 /* ATTR_GROUP */) {
+        if (tag.stage === 5 /* ATTR_GROUP */) {
           this.emitError(
             this.pos,
             19 /* MALFORMED_OPEN_TAG */,
@@ -528,10 +537,10 @@ var OPEN_TAG = {
           );
           return;
         }
-        tag.stage = 4 /* ATTR_GROUP */;
+        tag.stage = 5 /* ATTR_GROUP */;
         return;
       } else if (code === 93 /* CLOSE_SQUARE_BRACKET */) {
-        if (tag.stage !== 4 /* ATTR_GROUP */) {
+        if (tag.stage !== 5 /* ATTR_GROUP */) {
           this.emitError(
             this.pos,
             19 /* MALFORMED_OPEN_TAG */,
@@ -552,13 +561,6 @@ var OPEN_TAG = {
       this.exitState();
       return;
     }
-    if (code === 60 /* OPEN_ANGLE_BRACKET */) {
-      return this.emitError(
-        this.pos,
-        2 /* INVALID_ATTRIBUTE_NAME */,
-        'Invalid attribute name. Attribute name cannot begin with the "<" character.'
-      );
-    }
     if (code === 47 /* FORWARD_SLASH */) {
       switch (this.lookAtCharCodeAhead(1)) {
         case 47 /* FORWARD_SLASH */:
@@ -576,113 +578,171 @@ var OPEN_TAG = {
       this.pos++;
       this.forward = 0;
       this.consumeWhitespace();
-    } else if (code === 47 /* FORWARD_SLASH */ && !tag.hasAttrs) {
-      tag.stage = 1 /* VAR */;
-      this.pos++;
-      this.forward = 0;
-      if (isWhitespaceCode(this.lookAtCharCodeAhead(0))) {
-        return this.emitError(
-          this.pos,
-          23 /* MISSING_TAG_VARIABLE */,
-          "A slash was found that was not followed by a variable name or lhs expression"
-        );
-      }
-      const expr = this.enterState(states_exports.EXPRESSION);
-      expr.operators = true;
-      expr.terminatedByWhitespace = true;
-      expr.shouldTerminate = this.isConcise ? shouldTerminateConciseTagVar : shouldTerminateHtmlTagVar;
-    } else if (code === 40 /* OPEN_PAREN */ && !tag.hasAttrs) {
-      if (tag.hasArgs) {
-        this.emitError(
-          this.pos,
-          11 /* INVALID_TAG_ARGUMENT */,
-          "A tag can only have one argument"
-        );
-        return;
-      }
-      tag.stage = 2 /* ARGUMENT */;
-      this.pos++;
-      this.forward = 0;
-      this.enterState(states_exports.EXPRESSION).shouldTerminate = matchesCloseParen;
-    } else if (code === 124 /* PIPE */ && !tag.hasAttrs) {
-      tag.stage = 3 /* PARAMS */;
-      this.pos++;
-      this.forward = 0;
-      this.enterState(states_exports.EXPRESSION).shouldTerminate = matchesPipe;
     } else {
       this.forward = 0;
-      if (tag.tagName) {
+      if (tag.hasAttrs) {
         this.enterState(states_exports.ATTRIBUTE);
-        tag.hasAttrs = true;
-      } else {
-        this.enterState(states_exports.TAG_NAME);
-      }
-    }
-  },
-  return(child, tag) {
-    var _a, _b, _c, _d, _e, _f;
-    switch (child.state) {
-      case states_exports.JS_COMMENT_BLOCK: {
-        break;
-      }
-      case states_exports.EXPRESSION: {
-        switch (tag.stage) {
-          case 1 /* VAR */: {
-            if (child.start === child.end) {
+      } else if (tag.tagName) {
+        switch (code) {
+          case 47 /* FORWARD_SLASH */: {
+            tag.stage = 1 /* VAR */;
+            this.pos++;
+            if (isWhitespaceCode(this.lookAtCharCodeAhead(0))) {
               return this.emitError(
-                child,
+                this.pos,
                 23 /* MISSING_TAG_VARIABLE */,
                 "A slash was found that was not followed by a variable name or lhs expression"
               );
             }
-            (_b = (_a = this.options).onTagVar) == null ? void 0 : _b.call(_a, {
-              start: child.start - 1,
-              end: child.end,
-              value: {
-                start: child.start,
-                end: child.end
-              }
-            });
+            const expr = this.enterState(states_exports.EXPRESSION);
+            expr.operators = true;
+            expr.terminatedByWhitespace = true;
+            expr.shouldTerminate = this.isConcise ? shouldTerminateConciseTagVar : shouldTerminateHtmlTagVar;
             break;
           }
-          case 2 /* ARGUMENT */: {
-            const start = child.start - 1;
-            const end = ++this.pos;
-            const value = {
-              start: child.start,
-              end: child.end
-            };
-            if (this.consumeWhitespaceIfBefore("{")) {
-              const attr = this.enterState(states_exports.ATTRIBUTE);
-              attr.start = start;
-              attr.args = { start, end, value };
-              tag.hasAttrs = true;
-              this.forward = 0;
-            } else {
-              tag.hasArgs = true;
-              (_d = (_c = this.options).onTagArgs) == null ? void 0 : _d.call(_c, {
-                start,
-                end,
-                value
-              });
+          case 40 /* OPEN_PAREN */:
+            if (tag.hasArgs) {
+              this.emitError(
+                this.pos,
+                11 /* INVALID_TAG_ARGUMENT */,
+                "A tag can only have one argument"
+              );
+              return;
             }
+            tag.hasArgs = true;
+            tag.stage = 2 /* ARGUMENT */;
+            this.pos++;
+            this.enterState(states_exports.EXPRESSION).shouldTerminate = matchesCloseParen;
             break;
-          }
-          case 3 /* PARAMS */: {
-            const end = ++this.pos;
-            (_f = (_e = this.options).onTagParams) == null ? void 0 : _f.call(_e, {
-              start: child.start - 1,
-              end,
-              value: {
-                start: child.start,
-                end: child.end
-              }
-            });
+          case 124 /* PIPE */:
+            if (tag.hasParams) {
+              this.emitError(
+                this.pos,
+                26 /* INVALID_TAG_PARAMS */,
+                "A tag can only specify parameters once"
+              );
+              return;
+            }
+            tag.hasParams = true;
+            tag.stage = 4 /* PARAMS */;
+            this.pos++;
+            this.enterState(states_exports.EXPRESSION).shouldTerminate = matchesPipe;
+            break;
+          case 60 /* OPEN_ANGLE_BRACKET */:
+            tag.stage = 3 /* TYPES */;
+            this.pos++;
+            this.enterState(states_exports.EXPRESSION).shouldTerminate = matchesCloseAngleBracket;
             break;
+          default:
+            tag.hasAttrs = true;
+            this.enterState(states_exports.ATTRIBUTE);
+        }
+      } else {
+        this.enterState(states_exports.TAG_NAME);
+      }
+    }
+  },
+  return(child, tag) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p;
+    if (child.state !== states_exports.EXPRESSION)
+      return;
+    switch (tag.stage) {
+      case 1 /* VAR */: {
+        if (child.start === child.end) {
+          return this.emitError(
+            child,
+            23 /* MISSING_TAG_VARIABLE */,
+            "A slash was found that was not followed by a variable name or lhs expression"
+          );
+        }
+        (_b = (_a = this.options).onTagVar) == null ? void 0 : _b.call(_a, {
+          start: child.start - 1,
+          end: child.end,
+          value: {
+            start: child.start,
+            end: child.end
           }
+        });
+        break;
+      }
+      case 2 /* ARGUMENT */: {
+        const { types } = tag;
+        const start = child.start - 1;
+        const end = ++this.pos;
+        const value = {
+          start: child.start,
+          end: child.end
+        };
+        if (this.consumeWhitespaceIfBefore("{")) {
+          const attr = this.enterState(states_exports.ATTRIBUTE);
+          if (types) {
+            attr.start = types.start;
+            attr.typeParams = types;
+          } else {
+            attr.start = start;
+          }
+          attr.args = { start, end, value };
+          this.forward = 0;
+          tag.hasAttrs = true;
+        } else {
+          if (types) {
+            (_d = (_c = this.options).onTagTypeArgs) == null ? void 0 : _d.call(_c, types);
+          }
+          (_f = (_e = this.options).onTagArgs) == null ? void 0 : _f.call(_e, {
+            start,
+            end,
+            value
+          });
+        }
+        break;
+      }
+      case 3 /* TYPES */: {
+        const { types, hasParams, hasArgs } = tag;
+        const end = ++this.pos;
+        const typeArgs = {
+          start: child.start - 1,
+          end,
+          value: {
+            start: child.start,
+            end: child.end
+          }
+        };
+        this.consumeWhitespace();
+        const nextCode = this.lookAtCharCodeAhead(0);
+        if (!hasParams && nextCode === 124 /* PIPE */) {
+          if (types) {
+            (_h = (_g = this.options).onTagTypeArgs) == null ? void 0 : _h.call(_g, types);
+          }
+          (_j = (_i = this.options).onTagTypeParams) == null ? void 0 : _j.call(_i, typeArgs);
+        } else if (!hasArgs && nextCode === 40 /* OPEN_PAREN */) {
+          if (types) {
+            (_l = (_k = this.options).onTagTypeArgs) == null ? void 0 : _l.call(_k, types);
+          }
+          tag.types = typeArgs;
+        } else if (!(types || hasParams || hasArgs)) {
+          (_n = (_m = this.options).onTagTypeArgs) == null ? void 0 : _n.call(_m, typeArgs);
+          tag.types = typeArgs;
+        } else {
+          this.emitError(
+            child,
+            27 /* INVALID_TAG_TYPES */,
+            "Unexpected types. Type arguments must follow a tag name and type paremeters must precede a method or tag parameters."
+          );
         }
         break;
       }
+      case 4 /* PARAMS */: {
+        const end = ++this.pos;
+        (_p = (_o = this.options).onTagParams) == null ? void 0 : _p.call(_o, {
+          start: child.start - 1,
+          end,
+          value: {
+            start: child.start,
+            end: child.end
+          }
+        });
+        break;
+      }
     }
   }
 };
@@ -693,6 +753,7 @@ function shouldTerminateConciseTagVar(code, data, pos) {
     case 124 /* PIPE */:
     case 40 /* OPEN_PAREN */:
     case 59 /* SEMICOLON */:
+    case 60 /* OPEN_ANGLE_BRACKET */:
       return true;
     case 58 /* COLON */:
       return data.charCodeAt(pos + 1) === 61 /* EQUAL */;
@@ -707,6 +768,7 @@ function shouldTerminateHtmlTagVar(code, data, pos) {
     case 61 /* EQUAL */:
     case 40 /* OPEN_PAREN */:
     case 62 /* CLOSE_ANGLE_BRACKET */:
+    case 60 /* OPEN_ANGLE_BRACKET */:
       return true;
     case 58 /* COLON */:
       return data.charCodeAt(pos + 1) === 61 /* EQUAL */;
@@ -730,6 +792,7 @@ var ATTRIBUTE = {
       stage: 0 /* UNKNOWN */,
       name: void 0,
       args: false,
+      typeParams: void 0,
       bound: false,
       spread: false
     };
@@ -760,25 +823,37 @@ var ATTRIBUTE = {
       const expr = this.enterState(states_exports.EXPRESSION);
       expr.operators = true;
       expr.terminatedByWhitespace = true;
-      expr.shouldTerminate = this.isConcise ? this.activeTag.stage === 4 /* ATTR_GROUP */ ? shouldTerminateConciseGroupedAttrValue : shouldTerminateConciseAttrValue : shouldTerminateHtmlAttrValue;
+      expr.shouldTerminate = this.isConcise ? this.activeTag.stage === 5 /* ATTR_GROUP */ ? shouldTerminateConciseGroupedAttrValue : shouldTerminateConciseAttrValue : shouldTerminateHtmlAttrValue;
     } else if (code === 40 /* OPEN_PAREN */) {
       ensureAttrName(this, attr);
       attr.stage = 3 /* ARGUMENT */;
       this.pos++;
       this.forward = 0;
       this.enterState(states_exports.EXPRESSION).shouldTerminate = matchesCloseParen;
+    } else if (code === 60 /* OPEN_ANGLE_BRACKET */ && attr.stage === 1 /* NAME */) {
+      attr.stage = 4 /* TYPE_PARAMS */;
+      this.pos++;
+      this.forward = 0;
+      this.enterState(states_exports.EXPRESSION).shouldTerminate = matchesCloseAngleBracket;
     } else if (code === 123 /* OPEN_CURLY_BRACE */ && attr.args) {
       ensureAttrName(this, attr);
-      attr.stage = 4 /* BLOCK */;
+      attr.stage = 5 /* BLOCK */;
       this.pos++;
       this.forward = 0;
       this.enterState(states_exports.EXPRESSION).shouldTerminate = matchesCloseCurlyBrace;
     } else if (attr.stage === 0 /* UNKNOWN */) {
+      if (code === 60 /* OPEN_ANGLE_BRACKET */) {
+        return this.emitError(
+          this.pos,
+          2 /* INVALID_ATTRIBUTE_NAME */,
+          'Invalid attribute name. Attribute name cannot begin with the "<" character.'
+        );
+      }
       attr.stage = 1 /* NAME */;
       this.forward = 0;
       const expr = this.enterState(states_exports.EXPRESSION);
       expr.terminatedByWhitespace = true;
-      expr.shouldTerminate = this.isConcise ? this.activeTag.stage === 4 /* ATTR_GROUP */ ? shouldTerminateConciseGroupedAttrName : shouldTerminateConciseAttrName : shouldTerminateHtmlAttrName;
+      expr.shouldTerminate = this.isConcise ? this.activeTag.stage === 5 /* ATTR_GROUP */ ? shouldTerminateConciseGroupedAttrName : shouldTerminateConciseAttrName : shouldTerminateHtmlAttrName;
     } else {
       this.exitState();
     }
@@ -831,6 +906,12 @@ var ATTRIBUTE = {
             end,
             value
           };
+        } else if (attr.typeParams) {
+          this.emitError(
+            child,
+            1 /* INVALID_ATTRIBUTE_ARGUMENT */,
+            "An attribute cannot have both type parameters and arguments"
+          );
         } else {
           attr.args = true;
           (_d = (_c = this.options).onAttrArgs) == null ? void 0 : _d.call(_c, {
@@ -841,14 +922,16 @@ var ATTRIBUTE = {
         }
         break;
       }
-      case 4 /* BLOCK */: {
+      case 5 /* BLOCK */: {
         const params = attr.args;
-        const start = params.start;
         const end = ++this.pos;
+        const { typeParams } = attr;
+        const start = typeParams ? typeParams.start : params.start;
         (_f = (_e = this.options).onAttrMethod) == null ? void 0 : _f.call(_e, {
           start,
           end,
           params,
+          typeParams,
           body: {
             start: child.start - 1,
             end,
@@ -861,6 +944,26 @@ var ATTRIBUTE = {
         this.exitState();
         break;
       }
+      case 4 /* TYPE_PARAMS */: {
+        const start = child.start - 1;
+        const end = ++this.pos;
+        if (!this.consumeWhitespaceIfBefore("(")) {
+          return this.emitError(
+            child,
+            28 /* INVALID_ATTR_TYPE_PARAMS */,
+            "Attribute cannot contain type parameters unless it is a shorthand method"
+          );
+        }
+        attr.typeParams = {
+          start,
+          end,
+          value: {
+            start: child.start,
+            end: child.end
+          }
+        };
+        break;
+      }
       case 2 /* VALUE */: {
         if (child.start === child.end) {
           return this.emitError(
@@ -910,6 +1013,7 @@ function shouldTerminateHtmlAttrName(code, data, pos) {
     case 61 /* EQUAL */:
     case 40 /* OPEN_PAREN */:
     case 62 /* CLOSE_ANGLE_BRACKET */:
+    case 60 /* OPEN_ANGLE_BRACKET */:
       return true;
     case 58 /* COLON */:
       return data.charCodeAt(pos + 1) === 61 /* EQUAL */;
@@ -937,6 +1041,7 @@ function shouldTerminateConciseAttrName(code, data, pos) {
     case 61 /* EQUAL */:
     case 40 /* OPEN_PAREN */:
     case 59 /* SEMICOLON */:
+    case 60 /* OPEN_ANGLE_BRACKET */:
       return true;
     case 58 /* COLON */:
       return data.charCodeAt(pos + 1) === 61 /* EQUAL */;
@@ -963,6 +1068,7 @@ function shouldTerminateConciseGroupedAttrName(code, data, pos) {
     case 61 /* EQUAL */:
     case 40 /* OPEN_PAREN */:
     case 93 /* CLOSE_SQUARE_BRACKET */:
+    case 60 /* OPEN_ANGLE_BRACKET */:
       return true;
     case 58 /* COLON */:
       return data.charCodeAt(pos + 1) === 61 /* EQUAL */;
@@ -1515,6 +1621,7 @@ var EXPRESSION = {
           default: {
             if (canFollowDivision(this.getPreviousNonWhitespaceCharCode())) {
               this.pos++;
+              this.forward = 0;
               this.consumeWhitespace();
             } else {
               this.enterState(states_exports.REGULAR_EXPRESSION);
@@ -2303,6 +2410,7 @@ var TAG_NAME = {
       parent,
       start,
       end: start,
+      shorthandCode: -1,
       expressions: [],
       quasis: [{ start, end: start }]
     };
@@ -2382,7 +2490,7 @@ var TAG_NAME = {
       this.pos += 2;
       this.forward = 0;
       this.enterState(states_exports.EXPRESSION).shouldTerminate = matchesCloseCurlyBrace;
-    } else if (isWhitespaceCode(code) || code === 61 /* EQUAL */ || code === 58 /* COLON */ && this.lookAtCharCodeAhead(1) === 61 /* EQUAL */ || code === 40 /* OPEN_PAREN */ || code === 47 /* FORWARD_SLASH */ || code === 124 /* PIPE */ || (this.isConcise ? code === 59 /* SEMICOLON */ : code === 62 /* CLOSE_ANGLE_BRACKET */)) {
+    } else if (isWhitespaceCode(code) || code === 61 /* EQUAL */ || code === 58 /* COLON */ && this.lookAtCharCodeAhead(1) === 61 /* EQUAL */ || code === 40 /* OPEN_PAREN */ || code === 47 /* FORWARD_SLASH */ || code === 124 /* PIPE */ || code === 60 /* OPEN_ANGLE_BRACKET */ || (this.isConcise ? code === 59 /* SEMICOLON */ : code === 62 /* CLOSE_ANGLE_BRACKET */)) {
       this.activeTag.shorthandEnd = this.pos;
       this.exitState();
     } else if (code === 46 /* PERIOD */ || code === 35 /* NUMBER_SIGN */) {

package/dist/states/ATTRIBUTE.d.ts

@@ -4,13 +4,15 @@ declare const enum ATTR_STAGE {
     NAME = 1,
     VALUE = 2,
     ARGUMENT = 3,
-    BLOCK = 4
+    TYPE_PARAMS = 4,
+    BLOCK = 5
 }
 export interface AttrMeta extends Meta {
     stage: ATTR_STAGE;
     name: undefined | Range;
     valueStart: number;
     args: boolean | Ranges.AttrMethod["params"];
+    typeParams: undefined | Ranges.Value;
     spread: boolean;
     bound: boolean;
 }

package/dist/states/OPEN_TAG.d.ts

@@ -3,8 +3,9 @@ export declare enum TAG_STAGE {
     UNKNOWN = 0,
     VAR = 1,
     ARGUMENT = 2,
-    PARAMS = 3,
-    ATTR_GROUP = 4
+    TYPES = 3,
+    PARAMS = 4,
+    ATTR_GROUP = 5
 }
 export interface OpenTagMeta extends Meta {
     type: TagType;
@@ -15,6 +16,8 @@ export interface OpenTagMeta extends Meta {
     shorthandEnd: number;
     hasArgs: boolean;
     hasAttrs: boolean;
+    hasParams: boolean;
+    types: undefined | Ranges.Value;
     hasShorthandId: boolean;
     selfClosed: boolean;
     indent: string;

package/dist/states/TAG_NAME.d.ts

@@ -1,5 +1,5 @@
 import { CODE, StateDefinition, Ranges, Meta } from "../internal";
 export interface TagNameMeta extends Meta, Ranges.Template {
-    shorthandCode?: CODE.NUMBER_SIGN | CODE.PERIOD;
+    shorthandCode: -1 | CODE.NUMBER_SIGN | CODE.PERIOD;
 }
 export declare const TAG_NAME: StateDefinition<TagNameMeta>;

package/dist/util/constants.d.ts

@@ -90,6 +90,7 @@ export declare namespace Ranges {
     interface AttrMethod extends Range {
         body: Value;
         params: Value;
+        typeParams: Value | undefined;
     }
     interface OpenTagEnd extends Range {
         selfClosed: boolean;
@@ -121,7 +122,10 @@ export declare enum ErrorCode {
     MISSING_END_TAG = 22,
     MISSING_TAG_VARIABLE = 23,
     RESERVED_TAG_NAME = 24,
-    ROOT_TAG_ONLY = 25
+    ROOT_TAG_ONLY = 25,
+    INVALID_TAG_PARAMS = 26,
+    INVALID_TAG_TYPES = 27,
+    INVALID_ATTR_TYPE_PARAMS = 28
 }
 export declare const enum TagType {
     html = 0,
@@ -142,8 +146,10 @@ export interface ParserOptions {
     onOpenTagName?(data: Ranges.Template): TagType | void;
     onTagShorthandId?(data: Ranges.Template): void;
     onTagShorthandClass?(data: Ranges.Template): void;
+    onTagTypeArgs?(data: Ranges.Value): void;
     onTagVar?(data: Ranges.Value): void;
     onTagArgs?(data: Ranges.Value): void;
+    onTagTypeParams?(data: Ranges.Value): void;
     onTagParams?(data: Ranges.Value): void;
     onAttrName?(data: Range): void;
     onAttrArgs?(data: Ranges.Value): void;

package/dist/util/util.d.ts

@@ -15,6 +15,7 @@ export declare function getPosition(lines: number[], offset: number): Position;
  */
 export declare function getLines(src: string): number[];
 export declare function htmlEOF(this: Parser): void;
+export declare function matchesCloseAngleBracket(code: number): boolean;
 export declare function matchesCloseParen(code: number): boolean;
 export declare function matchesCloseCurlyBrace(code: number): boolean;
 export declare function matchesPipe(code: number): boolean;

package/package.json

@@ -1,31 +1,31 @@
 {
   "name": "htmljs-parser",
   "description": "An HTML parser recognizes content and string placeholders and allows JavaScript expressions as attribute values",
-  "version": "5.1.4",
+  "version": "5.2.0",
   "devDependencies": {
-    "@changesets/changelog-github": "^0.4.6",
-    "@changesets/cli": "^2.24.1",
+    "@changesets/changelog-github": "^0.4.7",
+    "@changesets/cli": "^2.25.2",
     "@types/degit": "^2.8.3",
-    "@types/mocha": "^9.1.1",
-    "@types/node": "^18.6.4",
-    "@typescript-eslint/eslint-plugin": "^5.32.0",
-    "@typescript-eslint/parser": "^5.32.0",
+    "@types/mocha": "^10.0.0",
+    "@types/node": "^18.11.9",
+    "@typescript-eslint/eslint-plugin": "^5.42.0",
+    "@typescript-eslint/parser": "^5.42.0",
     "cross-env": "^7.0.3",
     "degit": "^2.8.4",
-    "esbuild": "0.14.53",
-    "eslint": "^8.21.0",
+    "esbuild": "0.15.13",
+    "eslint": "^8.26.0",
     "eslint-config-prettier": "^8.5.0",
-    "fast-glob": "^3.2.11",
+    "fast-glob": "^3.2.12",
     "fixpack": "^4.0.0",
     "husky": "^8.0.1",
     "lint-staged": "^13.0.3",
     "mitata": "^0.1.6",
-    "mocha": "^10.0.0",
+    "mocha": "^10.1.0",
     "mocha-snap": "^4.3.0",
     "nyc": "^15.1.0",
     "prettier": "^2.7.1",
-    "tsx": "^3.8.0",
-    "typescript": "^4.7.4"
+    "tsx": "^3.11.0",
+    "typescript": "^4.8.4"
   },
   "exports": {
     ".": {