fix: conditional classes, dynamic params, HMR and formatter

packages/compiler/src/parser.ts

@@ -386,7 +386,14 @@ export function parseHtmlView(src: string, pos: number): { nodes: ViewNode[]; en
   let i = pos;
 
   const isNameStart = (c: string): boolean => /[A-Za-z_]/.test(c);
-  const isNamePart = (c: string): boolean => /[A-Za-z0-9_:-]/.test(c);
+  const isNamePart = (c: string): boolean => /[A-Za-z0-9_:.[\]%-]/.test(c);
+  const isAttributeNamePart = (c: string, next: string | undefined): boolean => {
+    if (c === "/") {
+      return next !== ">";
+    }
+
+    return isNamePart(c);
+  };
   const isWs = (c: string): boolean => c === " " || c === "\t" || c === "\n" || c === "\r";
 
   const fail = (msg: string): never => {
@@ -425,7 +432,9 @@ export function parseHtmlView(src: string, pos: number): { nodes: ViewNode[]; en
   const readName = (): string => {
     if (i >= src.length || !isNameStart(src[i]!)) return fail("Expected a tag or attribute name");
     const start = i++;
-    while (i < src.length && isNamePart(src[i]!)) i++;
+    while (i < src.length && isAttributeNamePart(src[i], src[i + 1])) {
+      i++;
+    }
     return src.slice(start, i);
   };