feat(jsx-directive): support template-ref

Author: zhiyuanzmj

Diff for: playground/src/App.vue

@@ -1,10 +1,12 @@
 <script setup lang="ts">
+import { shallowRef } from 'vue';
 import Comp from './components/Comp.vue'
 
 const list = [{ id: 1 }]
 const bind = { }
 const on = { submit: () => {} }
 const select = $ref<{ id: number }>(list[0])
+const compRef = shallowRef()
 </script>
 
 <template>
@@ -14,6 +16,7 @@ const select = $ref<{ id: number }>(list[0])
     :key="i.id"
     v-bind="bind"
     v-model:id="i.id"
+    ref="compRef"
     v-loading.fullscreen.lock="true"
     v-memo="[select?.id === i.id]"
     v-on="on"

Diff for: src/rules/jsx-directive/v-bind.yml

@@ -22,6 +22,26 @@ fix: |-
 
 ---
 
+id: v-template-ref
+language: html
+rule:
+  kind: quoted_attribute_value
+  pattern: $VALUE
+  follows:
+    kind: attribute_name
+    regex: ^ref$
+    stopBy: end
+transform:
+  V:
+    substring:
+      startChar: 1
+      endChar: -1
+      source: $VALUE
+fix: |-
+  {$V}
+
+---
+
 id: v-bind transform to {...props}
 language: html
 rule: