Match against dynamic attributes first

Author: thecrypticace

src/index.ts

@@ -280,9 +280,10 @@ function transformHtml(ast: any, { env, changes }: TransformerContext) {
   let { parser } = env.options
 
   for (let attr of ast.attrs ?? []) {
-    if (matcher.hasStaticAttr(attr.name)) {
-      attr.value = sortClasses(attr.value, { env })
-    } else if (matcher.hasDynamicAttr(attr.name)) {
+    // We match against dynamic attributes first otherwise we might accidentally
+    // interpret a dynamic attribute as a static one. These always start with :,
+    // v-bind:, or are enclosed in `[…]`
+    if (matcher.hasDynamicAttr(attr.name)) {
       if (!/[`'"]/.test(attr.value)) {
         continue
       }
@@ -293,6 +294,11 @@ function transformHtml(ast: any, { env, changes }: TransformerContext) {
         transformDynamicJsAttribute(attr, env)
       }
     }
+
+    //
+    else if (matcher.hasStaticAttr(attr.name)) {
+      attr.value = sortClasses(attr.value, { env })
+    }
   }
 
   for (let child of ast.children ?? []) {