diff --git a/.vscode/settings.json b/.vscode/settings.json
index 5184e96..6232eb0 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -10,8 +10,8 @@
 
   // Auto fix
   "editor.codeActionsOnSave": {
-    "source.fixAll.eslint": true,
-    "source.organizeImports": false
+    "source.fixAll.eslint": "explicit",
+    "source.organizeImports": "never"
   },
 
   // Silent the stylistic rules in you IDE, but still auto fix them
diff --git a/README.md b/README.md
index 82c0aab..7a444cf 100644
--- a/README.md
+++ b/README.md
@@ -18,7 +18,7 @@ Rewriting at Vue Macros.
 vue-macros sg
 ```
 
-supported vue macros:
+supported macros:
 
 - [x] jsx-directive
 - [x] define-render
diff --git a/package.json b/package.json
index ea6db2c..0788b20 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@vue-macros/cli",
   "type": "module",
-  "version": "1.1.1",
+  "version": "1.2.0",
   "packageManager": "pnpm@8.10.5",
   "description": "Rewriting at vue macros powered by ast-grep.",
   "author": "zhiyuanzmj <zhiyuanzmj@gmail.com>",
@@ -51,10 +51,15 @@
   },
   "devDependencies": {
     "@antfu/eslint-config": "^2.1.2",
+    "@vitejs/plugin-vue": "^4.5.1",
+    "@vitejs/plugin-vue-jsx": "^3.1.0",
+    "@vue-macros/volar": "^0.17.4",
+    "@vue/babel-helper-vue-transform-on": "1.2.0-alpha.0",
     "bumpp": "^9.2.0",
     "typescript": "^5.3.2",
     "unbuild": "^2.0.0",
     "unocss": "^0.57.7",
+    "unplugin-vue-macros": "^2.7.0",
     "vitest": "^0.34.6"
   }
 }
diff --git a/playground/package.json b/playground/package.json
index 1bb809f..3cce752 100644
--- a/playground/package.json
+++ b/playground/package.json
@@ -12,7 +12,6 @@
     "@vitejs/plugin-vue": "^4.5.0",
     "@vitejs/plugin-vue-jsx": "^3.1.0",
     "@vue-macros/volar": "^0.17.4",
-    "@vue/babel-helper-vue-transform-on": "1.2.0-alpha.0",
     "tsx": "^4.6.1",
     "typescript": "^5.3.2",
     "unplugin-vue-macros": "^2.7.0",
diff --git a/playground/pnpm-lock.yaml b/playground/pnpm-lock.yaml
index 934cfe1..7fc366b 100644
--- a/playground/pnpm-lock.yaml
+++ b/playground/pnpm-lock.yaml
@@ -19,9 +19,6 @@ devDependencies:
   '@vue-macros/volar':
     specifier: ^0.17.4
     version: 0.17.4(@vue-macros/reactivity-transform@0.4.0)(typescript@5.3.2)(vue@3.3.9)
-  '@vue/babel-helper-vue-transform-on':
-    specifier: 1.2.0-alpha.0
-    version: 1.2.0-alpha.0
   tsx:
     specifier: ^4.6.1
     version: 4.6.1
@@ -1280,10 +1277,6 @@ packages:
     resolution: {integrity: sha512-SgUymFpMoAyWeYWLAY+MkCK3QEROsiUnfaw5zxOVD/M64KQs8D/4oK6Q5omVA2hnvEOE0SCkH2TZxs/jnnUj7w==}
     dev: true
 
-  /@vue/babel-helper-vue-transform-on@1.2.0-alpha.0:
-    resolution: {integrity: sha512-8oelfDzzYre1XGykAGOYc8sSIL8ToDkWMG5awjN+tain/1XSu4KMyBYYESnEMqhyyo8pfMbgBXcQW5nRDrm61A==}
-    dev: true
-
   /@vue/babel-plugin-jsx@1.1.5(@babel/core@7.23.5):
     resolution: {integrity: sha512-nKs1/Bg9U1n3qSWnsHhCVQtAzI6aQXqua8j/bZrau8ywT1ilXQbK4FwEJGmU8fV7tcpuFvWmmN7TMmV1OBma1g==}
     peerDependencies:
diff --git a/playground/src/App.vue b/playground/src/App.vue
index cbf5637..21393c9 100644
--- a/playground/src/App.vue
+++ b/playground/src/App.vue
@@ -22,10 +22,10 @@ const compRef = shallowRef()
     v-on="on"
     @click.once="select = i"
     @submit="alert"
-    @update="select.id = $event"
+    @update:model-value="select.id = $event"
   >
     <template v-slot:default="{ id }">
-      <div>{{ id }}</div>
+      <el-input>{{ id }}</el-input>
     </template>
     <template #bottom="{ foo }">
       <div>{{ `${foo}` }}</div>
diff --git a/playground/vite.config.ts b/playground/vite.config.ts
index baf7215..6117a8f 100644
--- a/playground/vite.config.ts
+++ b/playground/vite.config.ts
@@ -19,10 +19,8 @@ export default defineConfig({
           },
         }),
 
-        vueJsx: VueJsx({
-          transformOn: true,
-        }),
+        vueJsx: VueJsx(),
       },
     }),
   ],
-})
+})
\ No newline at end of file
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 5e5c6c5..07dc605 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -28,6 +28,18 @@ devDependencies:
   '@antfu/eslint-config':
     specifier: ^2.1.2
     version: 2.1.2(eslint@8.54.0)(typescript@5.3.2)(vitest@0.34.6)
+  '@vitejs/plugin-vue':
+    specifier: ^4.5.1
+    version: 4.5.1(vite@5.0.4)(vue@3.3.10)
+  '@vitejs/plugin-vue-jsx':
+    specifier: ^3.1.0
+    version: 3.1.0(vite@5.0.4)(vue@3.3.10)
+  '@vue-macros/volar':
+    specifier: ^0.17.4
+    version: 0.17.4(@vue-macros/reactivity-transform@0.4.0)(rollup@3.29.4)(typescript@5.3.2)(vue@3.3.10)
+  '@vue/babel-helper-vue-transform-on':
+    specifier: 1.2.0-alpha.0
+    version: 1.2.0-alpha.0
   bumpp:
     specifier: ^9.2.0
     version: 9.2.0
@@ -40,6 +52,9 @@ devDependencies:
   unocss:
     specifier: ^0.57.7
     version: 0.57.7(postcss@8.4.31)(rollup@3.29.4)(vite@5.0.4)
+  unplugin-vue-macros:
+    specifier: ^2.7.0
+    version: 2.7.0(rollup@3.29.4)(typescript@5.3.2)(vite@5.0.4)(vue@3.3.10)
   vitest:
     specifier: ^0.34.6
     version: 0.34.6
@@ -1712,6 +1727,33 @@ packages:
       - rollup
     dev: true
 
+  /@vitejs/plugin-vue-jsx@3.1.0(vite@5.0.4)(vue@3.3.10):
+    resolution: {integrity: sha512-w9M6F3LSEU5kszVb9An2/MmXNxocAnUb3WhRr8bHlimhDrXNt6n6D2nJQR3UXpGlZHh/EsgouOHCsM8V3Ln+WA==}
+    engines: {node: ^14.18.0 || >=16.0.0}
+    peerDependencies:
+      vite: ^4.0.0 || ^5.0.0
+      vue: ^3.0.0
+    dependencies:
+      '@babel/core': 7.23.5
+      '@babel/plugin-transform-typescript': 7.23.5(@babel/core@7.23.5)
+      '@vue/babel-plugin-jsx': 1.1.5(@babel/core@7.23.5)
+      vite: 5.0.4(@types/node@20.10.1)
+      vue: 3.3.10(typescript@5.3.2)
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
+  /@vitejs/plugin-vue@4.5.1(vite@5.0.4)(vue@3.3.10):
+    resolution: {integrity: sha512-DaUzYFr+2UGDG7VSSdShKa9sIWYBa1LL8KC0MNOf2H5LjcTPjob0x8LbkqXWmAtbANJCkpiQTj66UVcQkN2s3g==}
+    engines: {node: ^14.18.0 || >=16.0.0}
+    peerDependencies:
+      vite: ^4.0.0 || ^5.0.0
+      vue: ^3.2.25
+    dependencies:
+      vite: 5.0.4(@types/node@20.10.1)
+      vue: 3.3.10(typescript@5.3.2)
+    dev: true
+
   /@vitest/expect@0.34.6:
     resolution: {integrity: sha512-QUzKpUQRc1qC7qdGo7rMK3AkETI7w18gTCUrsNnyjjJKYiuUB9+TQK3QnR1unhCnWRC0AbKv2omLGQDF/mIjOw==}
     dependencies:
@@ -1750,6 +1792,509 @@ packages:
       pretty-format: 29.7.0
     dev: true
 
+  /@volar/language-core@1.10.10:
+    resolution: {integrity: sha512-nsV1o3AZ5n5jaEAObrS3MWLBWaGwUj/vAsc15FVNIv+DbpizQRISg9wzygsHBr56ELRH8r4K75vkYNMtsSNNWw==}
+    dependencies:
+      '@volar/source-map': 1.10.10
+    dev: true
+
+  /@volar/source-map@1.10.10:
+    resolution: {integrity: sha512-GVKjLnifV4voJ9F0vhP56p4+F3WGf+gXlRtjFZsv6v3WxBTWU3ZVeaRaEHJmWrcv5LXmoYYpk/SC25BKemPRkg==}
+    dependencies:
+      muggle-string: 0.3.1
+    dev: true
+
+  /@vue-macros/api@0.9.0(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-PYV/yhoOh1F5z0mFg0/A8OhuwmDI/ta+XwYkNZYyuA9QZ1jMWZFOA0ZdUAjTCHG6AdVFbkajR+XyxTNnQ+YytQ==}
+    engines: {node: '>=16.14.0'}
+    dependencies:
+      '@babel/types': 7.23.5
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      resolve.exports: 2.0.2
+    transitivePeerDependencies:
+      - rollup
+      - vue
+    dev: true
+
+  /@vue-macros/better-define@1.7.0(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-MO+wAWFU8FF8YPMCmonv18FRJko7OZLy2wT7ia0RKwDCgu7IEKnSbLIfnUNwUsceVAPGOrVapDiIcQ+VVMJoiw==}
+    engines: {node: '>=16.14.0'}
+    dependencies:
+      '@vue-macros/api': 0.9.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      unplugin: 1.5.1
+    transitivePeerDependencies:
+      - rollup
+      - vue
+    dev: true
+
+  /@vue-macros/boolean-prop@0.3.0(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-QhG3FgusmtQ0dIvrs8SsgBUg0micfYdXmNJo1YPh+VykHwPcmw4kuTBSJsbzMM09I+62vgKi6FTYt3nZ74DBIA==}
+    engines: {node: '>=16.14.0'}
+    dependencies:
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue/compiler-core': 3.3.10
+    transitivePeerDependencies:
+      - rollup
+      - vue
+    dev: true
+
+  /@vue-macros/chain-call@0.2.0(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-0fC6mxYSJfU3hHrRwgLho9rZSgkIAZo0OKIWW7ZyrAlyNhZtq+8c7sq59samPFdZpYcwTfOBUcK5YuC3pjT9VQ==}
+    engines: {node: '>=16.14.0'}
+    dependencies:
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      unplugin: 1.5.1
+    transitivePeerDependencies:
+      - rollup
+      - vue
+    dev: true
+
+  /@vue-macros/common@1.9.0(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-LbfRHDkceuokkLlVuQW9Wq3ZLmRs6KIDPzCjUvvL14HB4GslWdtvBB1suFfNs6VMvh9Zj30cEKF/EAP7QBCZ6Q==}
+    engines: {node: '>=16.14.0'}
+    peerDependencies:
+      vue: ^2.7.0 || ^3.2.25
+    peerDependenciesMeta:
+      vue:
+        optional: true
+    dependencies:
+      '@babel/types': 7.23.5
+      '@rollup/pluginutils': 5.1.0(rollup@3.29.4)
+      '@vue/compiler-sfc': 3.3.10
+      ast-kit: 0.11.3(rollup@3.29.4)
+      local-pkg: 0.5.0
+      magic-string-ast: 0.3.0
+      vue: 3.3.10(typescript@5.3.2)
+    transitivePeerDependencies:
+      - rollup
+    dev: true
+
+  /@vue-macros/define-emit@0.2.0(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-h0BuYXD+3FcCjlWeCNp06n4wZfExrnl8rBs6KUTjGXwVglxjI6RHJT2kfK+p3TJpPCwvNct+iBS6CYA1w5eTfQ==}
+    engines: {node: '>=16.14.0'}
+    peerDependencies:
+      vue: ^2.7.0 || ^3.2.25
+    dependencies:
+      '@vue-macros/api': 0.9.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      unplugin: 1.5.1
+      vue: 3.3.10(typescript@5.3.2)
+    transitivePeerDependencies:
+      - rollup
+    dev: true
+
+  /@vue-macros/define-models@1.2.0(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-h4drdveUgNYxy+6tylFg/oGIStT7dZ4uo4CMXl5VkLzso78Yhsxqdz00ccm6gaAB9jdDCry2RGqL5ACEyDmLZA==}
+    engines: {node: '>=16.14.0'}
+    peerDependencies:
+      '@vueuse/core': '>=9.0.0'
+    peerDependenciesMeta:
+      '@vueuse/core':
+        optional: true
+    dependencies:
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      ast-walker-scope: 0.5.0(rollup@3.29.4)
+      unplugin: 1.5.1
+    transitivePeerDependencies:
+      - rollup
+      - vue
+    dev: true
+
+  /@vue-macros/define-prop@0.3.0(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-aiu+tJp8eIT2wigzbP5lH0KoZhyTqiw2rysEVEK193logk6T8Fls5Yxf8YmOetrzpwOp6M4RciACGyiILLrsug==}
+    engines: {node: '>=16.14.0'}
+    peerDependencies:
+      vue: ^2.7.0 || ^3.2.25
+    dependencies:
+      '@vue-macros/api': 0.9.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      unplugin: 1.5.1
+      vue: 3.3.10(typescript@5.3.2)
+    transitivePeerDependencies:
+      - rollup
+    dev: true
+
+  /@vue-macros/define-props-refs@1.2.0(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-ZWA9raSedk+eRfailc9gkyA4PHJrMGDg/tzV/yp89dDNVTzp9M1qQdLTV9S6R0ern/48ZvSYcz4n8ZVNwHg+Aw==}
+    engines: {node: '>=16.14.0'}
+    peerDependencies:
+      vue: ^2.7.0 || ^3.2.25
+    dependencies:
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      unplugin: 1.5.1
+      vue: 3.3.10(typescript@5.3.2)
+    transitivePeerDependencies:
+      - rollup
+    dev: true
+
+  /@vue-macros/define-props@2.0.0(@vue-macros/reactivity-transform@0.4.0)(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-OYdw4Bz12FDUHbHL5Ql5T5rO0V0laITbEyKGTvYwpeBim4oyTx+EodIx+edvgquLHtMYPabwRKJ6v9XoTlxc0g==}
+    engines: {node: '>=16.14.0'}
+    peerDependencies:
+      '@vue-macros/reactivity-transform': ^0.4.0
+      vue: ^2.7.0 || ^3.2.25
+    dependencies:
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/reactivity-transform': 0.4.0(rollup@3.29.4)(vue@3.3.10)
+      unplugin: 1.5.1
+      vue: 3.3.10(typescript@5.3.2)
+    transitivePeerDependencies:
+      - rollup
+    dev: true
+
+  /@vue-macros/define-render@1.5.0(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-QgScJaWRkZ6iYwm8k0uVlhPCfdGJYkMbkLr8Pr/pTRrjmXl3W+f7ZRbBDPKl4GBxVdJ+pHWjP0NsYuPb1dUXtw==}
+    engines: {node: '>=16.14.0'}
+    peerDependencies:
+      vue: ^2.7.0 || ^3.0.0
+    dependencies:
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      unplugin: 1.5.1
+      vue: 3.3.10(typescript@5.3.2)
+    transitivePeerDependencies:
+      - rollup
+    dev: true
+
+  /@vue-macros/define-slots@1.1.0(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-vkIxGrFhqdd8fvEuIGaIVw3ex0TB8MZFzGH5digCPOxBsBEeNNlTlwS3D63Qd5mCDpVsZy9xkuv159T9GS1DIg==}
+    engines: {node: '>=16.14.0'}
+    peerDependencies:
+      vue: ^2.7.0 || ^3.0.0
+    dependencies:
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      unplugin: 1.5.1
+      vue: 3.3.10(typescript@5.3.2)
+    transitivePeerDependencies:
+      - rollup
+    dev: true
+
+  /@vue-macros/devtools@0.2.0(typescript@5.3.2)(vite@5.0.4):
+    resolution: {integrity: sha512-jHjvY1bFgQLe/2+5pBOG4fgmL5MPhsqQDj7Barhj8YN+Oe7U2hBImvfAyOGpqd2uucLOWQTP1cWrp3q9b1svsg==}
+    engines: {node: '>=16.14.0'}
+    peerDependencies:
+      vite: ^4.0.0 || ^5.0.0-0
+    peerDependenciesMeta:
+      vite:
+        optional: true
+    dependencies:
+      sirv: 2.0.3
+      vite: 5.0.4(@types/node@20.10.1)
+      vue: 3.3.10(typescript@5.3.2)
+    transitivePeerDependencies:
+      - typescript
+    dev: true
+
+  /@vue-macros/export-expose@0.1.0(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-R1izR6LHS6yjJKI7IPDCwW385ct4KjQJVXz6jk6sL6Wk+iZbybDiGzzzK/jqpMlyzDvX0qVZ8vjACm1lidvLzA==}
+    engines: {node: '>=16.14.0'}
+    peerDependencies:
+      vue: ^2.7.0 || ^3.2.25
+    dependencies:
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue/compiler-sfc': 3.3.10
+      unplugin: 1.5.1
+      vue: 3.3.10(typescript@5.3.2)
+    transitivePeerDependencies:
+      - rollup
+    dev: true
+
+  /@vue-macros/export-props@0.4.0(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-XjDmw+OCxWOR4OPARH5aosvrarCk/TF7szE3ynx4UXfhCWS7lPJpLHwYkF/pfbx6FAFDUO81Drrey2BlhzTLvA==}
+    engines: {node: '>=16.14.0'}
+    peerDependencies:
+      vue: ^2.7.0 || ^3.2.25
+    dependencies:
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      unplugin: 1.5.1
+      vue: 3.3.10(typescript@5.3.2)
+    transitivePeerDependencies:
+      - rollup
+    dev: true
+
+  /@vue-macros/export-render@0.2.0(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-kmh6drhExv3r42DPGHo1UOtEX2pw2G5CTHvHg0FQiQAMltWd11C0/LXYRR/Zorh9EoMVMAObRnw5HrcdIoQEPA==}
+    engines: {node: '>=16.14.0'}
+    peerDependencies:
+      vue: ^2.7.0 || ^3.2.25
+    dependencies:
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue/compiler-sfc': 3.3.10
+      unplugin: 1.5.1
+      vue: 3.3.10(typescript@5.3.2)
+    transitivePeerDependencies:
+      - rollup
+    dev: true
+
+  /@vue-macros/hoist-static@1.5.0(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-ZhPOrnBftGmot+tLrf2db3C2LFP6hvHTOlO2tvD4r9FdhGS+ZNwKYvAiYYxH8Yevs6ZdgffAz+Gpz02QHggKuw==}
+    engines: {node: '>=16.14.0'}
+    dependencies:
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      unplugin: 1.5.1
+    transitivePeerDependencies:
+      - rollup
+      - vue
+    dev: true
+
+  /@vue-macros/jsx-directive@0.7.0(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-OSS7ZnwQueUkEYcjoe4VAeJLp+kkFa0l5mm4fkPQs9zK1uq4D+kCw+Hhg9OyrKNdiWpNutdUHgolJPNsqXUp7A==}
+    engines: {node: '>=16.14.0'}
+    dependencies:
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      unplugin: 1.5.1
+    transitivePeerDependencies:
+      - rollup
+      - vue
+    dev: true
+
+  /@vue-macros/named-template@0.4.0(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-dItF6N/WMWH0INQ5XqZ2SsFo5pZ+Q0muOWfTpi52GaeD96+N02yYUdT+wsZOdNu0VvLh/QuHxmDRCiiROmpL0Q==}
+    engines: {node: '>=16.14.0'}
+    dependencies:
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue/compiler-dom': 3.3.10
+      unplugin: 1.5.1
+    transitivePeerDependencies:
+      - rollup
+      - vue
+    dev: true
+
+  /@vue-macros/reactivity-transform@0.4.0(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-3DG+FWkIZe5xZJhIdxyieIYcDKJGC3aUab1JWtEOkS8Q21rLpu6VKUjV6TmB5LNyLSGVp+7de/87Ptd6C6RHOA==}
+    engines: {node: '>=16.14.0'}
+    peerDependencies:
+      vue: ^2.7.0 || ^3.2.25
+    dependencies:
+      '@babel/parser': 7.23.5
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue/compiler-core': 3.3.10
+      '@vue/shared': 3.3.10
+      magic-string: 0.30.5
+      unplugin: 1.5.1
+      vue: 3.3.10(typescript@5.3.2)
+    transitivePeerDependencies:
+      - rollup
+    dev: true
+
+  /@vue-macros/setup-block@0.3.0(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-URaruhrjrMnSAWt+elPblfqOUhL1y7uZKFzrfgPlr/uuyQGDsmxK/ZEw5gMY77rrJwcEqNfHDkNR8BV27gp/3w==}
+    engines: {node: '>=16.14.0'}
+    dependencies:
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue/compiler-dom': 3.3.10
+      unplugin: 1.5.1
+    transitivePeerDependencies:
+      - rollup
+      - vue
+    dev: true
+
+  /@vue-macros/setup-component@0.17.0(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-s/jwPQ+lGp3O0kgCFtPkH2+kvLtCLJ04iP+gTQwRXpgXDuQ6UlRdBday5wuhV32cq8C2oLHmKwSvYX/8N7WkRg==}
+    engines: {node: '>=16.14.0'}
+    dependencies:
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      unplugin: 1.5.1
+    transitivePeerDependencies:
+      - rollup
+      - vue
+    dev: true
+
+  /@vue-macros/setup-sfc@0.17.0(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-4cCoEl+tzEuJtHg4q6MlTLyM1M/xf+CC+d12QaCGbUgALfUAIa85sB8XnnPgxxu2A6MpD+4uE+6BrJHBOXIiVw==}
+    engines: {node: '>=16.14.0'}
+    dependencies:
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      unplugin: 1.5.1
+    transitivePeerDependencies:
+      - rollup
+      - vue
+    dev: true
+
+  /@vue-macros/short-bind@0.2.0(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-1cHCWaysLvrX4Oms+yAEhYjdxP0lfblC6JSlHZ0wzKVnsJ6DAWVaopp1H2kt3uJmWPr8C5iOYO7HRmRxd4JkrQ==}
+    engines: {node: '>=16.14.0'}
+    dependencies:
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue/compiler-core': 3.3.10
+    transitivePeerDependencies:
+      - rollup
+      - vue
+    dev: true
+
+  /@vue-macros/short-emits@1.5.0(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-R3ycVQwlnq9XXTSIOJDjdZ3Gbp6EcRwabLUrJcWUEEzqNZds8lP4br7jwPnA0KDCvXdEbjCQqqpzmosLPQuung==}
+    engines: {node: '>=16.14.0'}
+    dependencies:
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      unplugin: 1.5.1
+    transitivePeerDependencies:
+      - rollup
+      - vue
+    dev: true
+
+  /@vue-macros/short-vmodel@1.4.0(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-0rlL+GfDbbA4FGk90a5uPIkZmYSW4Asmh/r0KHZsqhKmyKxJf9eow7/CYGjvsnDKr+hk+pnq/CUSLkUnn+ey2g==}
+    engines: {node: '>=16.14.0'}
+    dependencies:
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue/compiler-core': 3.3.10
+    transitivePeerDependencies:
+      - rollup
+      - vue
+    dev: true
+
+  /@vue-macros/volar@0.17.4(@vue-macros/reactivity-transform@0.4.0)(rollup@3.29.4)(typescript@5.3.2)(vue@3.3.10):
+    resolution: {integrity: sha512-bPOp9KPAlm1nxIYPVAKoiKS5ERQMgSROAs6fQdlYv9sE4ZgxKpha3S0ZBCFniXkRwOwGaEfMqGkflo0V1buEfw==}
+    engines: {node: '>=16.14.0'}
+    peerDependencies:
+      vue-tsc: ^1.6.0
+    peerDependenciesMeta:
+      vue-tsc:
+        optional: true
+    dependencies:
+      '@rollup/pluginutils': 5.1.0(rollup@3.29.4)
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/define-props': 2.0.0(@vue-macros/reactivity-transform@0.4.0)(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/short-bind': 0.2.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/short-vmodel': 1.4.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue/language-core': 1.8.22(typescript@5.3.2)
+    transitivePeerDependencies:
+      - '@vue-macros/reactivity-transform'
+      - rollup
+      - typescript
+      - vue
+    dev: true
+
+  /@vue/babel-helper-vue-transform-on@1.1.5:
+    resolution: {integrity: sha512-SgUymFpMoAyWeYWLAY+MkCK3QEROsiUnfaw5zxOVD/M64KQs8D/4oK6Q5omVA2hnvEOE0SCkH2TZxs/jnnUj7w==}
+    dev: true
+
+  /@vue/babel-helper-vue-transform-on@1.2.0-alpha.0:
+    resolution: {integrity: sha512-8oelfDzzYre1XGykAGOYc8sSIL8ToDkWMG5awjN+tain/1XSu4KMyBYYESnEMqhyyo8pfMbgBXcQW5nRDrm61A==}
+    dev: true
+
+  /@vue/babel-plugin-jsx@1.1.5(@babel/core@7.23.5):
+    resolution: {integrity: sha512-nKs1/Bg9U1n3qSWnsHhCVQtAzI6aQXqua8j/bZrau8ywT1ilXQbK4FwEJGmU8fV7tcpuFvWmmN7TMmV1OBma1g==}
+    peerDependencies:
+      '@babel/core': ^7.0.0-0
+    dependencies:
+      '@babel/core': 7.23.5
+      '@babel/helper-module-imports': 7.22.15
+      '@babel/plugin-syntax-jsx': 7.23.3(@babel/core@7.23.5)
+      '@babel/template': 7.22.15
+      '@babel/traverse': 7.23.5
+      '@babel/types': 7.23.5
+      '@vue/babel-helper-vue-transform-on': 1.1.5
+      camelcase: 6.3.0
+      html-tags: 3.3.1
+      svg-tags: 1.0.0
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
+  /@vue/compiler-core@3.3.10:
+    resolution: {integrity: sha512-doe0hODR1+i1menPkRzJ5MNR6G+9uiZHIknK3Zn5OcIztu6GGw7u0XUzf3AgB8h/dfsZC9eouzoLo3c3+N/cVA==}
+    dependencies:
+      '@babel/parser': 7.23.5
+      '@vue/shared': 3.3.10
+      estree-walker: 2.0.2
+      source-map-js: 1.0.2
+    dev: true
+
+  /@vue/compiler-dom@3.3.10:
+    resolution: {integrity: sha512-NCrqF5fm10GXZIK0GrEAauBqdy+F2LZRt3yNHzrYjpYBuRssQbuPLtSnSNjyR9luHKkWSH8we5LMB3g+4z2HvA==}
+    dependencies:
+      '@vue/compiler-core': 3.3.10
+      '@vue/shared': 3.3.10
+    dev: true
+
+  /@vue/compiler-sfc@3.3.10:
+    resolution: {integrity: sha512-xpcTe7Rw7QefOTRFFTlcfzozccvjM40dT45JtrE3onGm/jBLZ0JhpKu3jkV7rbDFLeeagR/5RlJ2Y9SvyS0lAg==}
+    dependencies:
+      '@babel/parser': 7.23.5
+      '@vue/compiler-core': 3.3.10
+      '@vue/compiler-dom': 3.3.10
+      '@vue/compiler-ssr': 3.3.10
+      '@vue/reactivity-transform': 3.3.10
+      '@vue/shared': 3.3.10
+      estree-walker: 2.0.2
+      magic-string: 0.30.5
+      postcss: 8.4.32
+      source-map-js: 1.0.2
+    dev: true
+
+  /@vue/compiler-ssr@3.3.10:
+    resolution: {integrity: sha512-12iM4jA4GEbskwXMmPcskK5wImc2ohKm408+o9iox3tfN9qua8xL0THIZtoe9OJHnXP4eOWZpgCAAThEveNlqQ==}
+    dependencies:
+      '@vue/compiler-dom': 3.3.10
+      '@vue/shared': 3.3.10
+    dev: true
+
+  /@vue/language-core@1.8.22(typescript@5.3.2):
+    resolution: {integrity: sha512-bsMoJzCrXZqGsxawtUea1cLjUT9dZnDsy5TuZ+l1fxRMzUGQUG9+Ypq4w//CqpWmrx7nIAJpw2JVF/t258miRw==}
+    peerDependencies:
+      typescript: '*'
+    peerDependenciesMeta:
+      typescript:
+        optional: true
+    dependencies:
+      '@volar/language-core': 1.10.10
+      '@volar/source-map': 1.10.10
+      '@vue/compiler-dom': 3.3.10
+      '@vue/shared': 3.3.10
+      computeds: 0.0.1
+      minimatch: 9.0.3
+      muggle-string: 0.3.1
+      typescript: 5.3.2
+      vue-template-compiler: 2.7.15
+    dev: true
+
+  /@vue/reactivity-transform@3.3.10:
+    resolution: {integrity: sha512-0xBdk+CKHWT+Gev8oZ63Tc0qFfj935YZx+UAynlutnrDZ4diFCVFMWixn65HzjE3S1iJppWOo6Tt1OzASH7VEg==}
+    dependencies:
+      '@babel/parser': 7.23.5
+      '@vue/compiler-core': 3.3.10
+      '@vue/shared': 3.3.10
+      estree-walker: 2.0.2
+      magic-string: 0.30.5
+    dev: true
+
+  /@vue/reactivity@3.3.10:
+    resolution: {integrity: sha512-H5Z7rOY/JLO+e5a6/FEXaQ1TMuOvY4LDVgT+/+HKubEAgs9qeeZ+NhADSeEtrNQeiKLDuzeKc8v0CUFpB6Pqgw==}
+    dependencies:
+      '@vue/shared': 3.3.10
+    dev: true
+
+  /@vue/runtime-core@3.3.10:
+    resolution: {integrity: sha512-DZ0v31oTN4YHX9JEU5VW1LoIVgFovWgIVb30bWn9DG9a7oA415idcwsRNNajqTx8HQJyOaWfRKoyuP2P2TYIag==}
+    dependencies:
+      '@vue/reactivity': 3.3.10
+      '@vue/shared': 3.3.10
+    dev: true
+
+  /@vue/runtime-dom@3.3.10:
+    resolution: {integrity: sha512-c/jKb3ny05KJcYk0j1m7Wbhrxq7mZYr06GhKykDMNRRR9S+/dGT8KpHuNQjv3/8U4JshfkAk6TpecPD3B21Ijw==}
+    dependencies:
+      '@vue/runtime-core': 3.3.10
+      '@vue/shared': 3.3.10
+      csstype: 3.1.2
+    dev: true
+
+  /@vue/server-renderer@3.3.10(vue@3.3.10):
+    resolution: {integrity: sha512-0i6ww3sBV3SKlF3YTjSVqKQ74xialMbjVYGy7cOTi7Imd8ediE7t72SK3qnvhrTAhOvlQhq6Bk6nFPdXxe0sAg==}
+    peerDependencies:
+      vue: 3.3.10
+    dependencies:
+      '@vue/compiler-ssr': 3.3.10
+      '@vue/shared': 3.3.10
+      vue: 3.3.10(typescript@5.3.2)
+    dev: true
+
+  /@vue/shared@3.3.10:
+    resolution: {integrity: sha512-2y3Y2J1a3RhFa0WisHvACJR2ncvWiVHcP8t0Inxo+NKz+8RKO4ZV8eZgCxRgQoA6ITfV12L4E6POOL9HOU5nqw==}
+    dev: true
+
   /acorn-jsx@5.3.2(acorn@8.11.2):
     resolution: {integrity: sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==}
     peerDependencies:
@@ -1842,6 +2387,38 @@ packages:
     resolution: {integrity: sha512-jgsaNduz+ndvGyFt3uSuWqvy4lCnIJiovtouQN5JZHOKCS2QuhEdbcQHFhVksz2N2U9hXJo8odG7ETyWlEeuDw==}
     dev: true
 
+  /ast-kit@0.11.3(rollup@3.29.4):
+    resolution: {integrity: sha512-qdwwKEhckRk0XE22/xDdmU3v/60E8Edu4qFhgTLIhGGDs/PAJwLw9pQn8Rj99PitlbBZbYpx0k/lbir4kg0SuA==}
+    engines: {node: '>=16.14.0'}
+    dependencies:
+      '@babel/parser': 7.23.5
+      '@rollup/pluginutils': 5.1.0(rollup@3.29.4)
+      pathe: 1.1.1
+    transitivePeerDependencies:
+      - rollup
+    dev: true
+
+  /ast-kit@0.9.5(rollup@3.29.4):
+    resolution: {integrity: sha512-kbL7ERlqjXubdDd+szuwdlQ1xUxEz9mCz1+m07ftNVStgwRb2RWw+U6oKo08PAvOishMxiqz1mlJyLl8yQx2Qg==}
+    engines: {node: '>=16.14.0'}
+    dependencies:
+      '@babel/parser': 7.23.5
+      '@rollup/pluginutils': 5.1.0(rollup@3.29.4)
+      pathe: 1.1.1
+    transitivePeerDependencies:
+      - rollup
+    dev: true
+
+  /ast-walker-scope@0.5.0(rollup@3.29.4):
+    resolution: {integrity: sha512-NsyHMxBh4dmdEHjBo1/TBZvCKxffmZxRYhmclfu0PP6Aftre47jOHYaYaNqJcV0bxihxFXhDkzLHUwHc0ocd0Q==}
+    engines: {node: '>=16.14.0'}
+    dependencies:
+      '@babel/parser': 7.23.5
+      ast-kit: 0.9.5(rollup@3.29.4)
+    transitivePeerDependencies:
+      - rollup
+    dev: true
+
   /autoprefixer@10.4.16(postcss@8.4.31):
     resolution: {integrity: sha512-7vd3UC6xKp0HLfua5IjZlcXvGAGy7cBAXTg2lyQ/8WpNhd6SiZ8Be+xm3FyBSYJx5GKcpRCzBh7RH4/0dnY+uQ==}
     engines: {node: ^10 || ^12 || >=14}
@@ -1959,6 +2536,11 @@ packages:
     engines: {node: '>=6'}
     dev: true
 
+  /camelcase@6.3.0:
+    resolution: {integrity: sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA==}
+    engines: {node: '>=10'}
+    dev: true
+
   /caniuse-api@3.0.0:
     resolution: {integrity: sha512-bsTwuIg/BZZK/vreVTYYbSWoe2F+71P7K5QGEX+pT250DZbfU1MQ5prOKpPR+LL6uWKK3KMwMCAS74QB3Um1uw==}
     dependencies:
@@ -2128,6 +2710,10 @@ packages:
     resolution: {integrity: sha512-W9pAhw0ja1Edb5GVdIF1mjZw/ASI0AlShXM83UUGe2DVr5TdAPEA1OA8m/g8zWp9x6On7gqufY+FatDbC3MDQg==}
     dev: true
 
+  /computeds@0.0.1:
+    resolution: {integrity: sha512-7CEBgcMjVmitjYo5q8JTJVra6X5mQ20uTThdK+0kR7UEaDrAWEQcRiBtWJzga4eRpP6afNwwLsX2SET2JhVB1Q==}
+    dev: true
+
   /concat-map@0.0.1:
     resolution: {integrity: sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==}
     dev: true
@@ -2261,11 +2847,19 @@ packages:
       css-tree: 2.2.1
     dev: true
 
+  /csstype@3.1.2:
+    resolution: {integrity: sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==}
+    dev: true
+
   /data-uri-to-buffer@4.0.1:
     resolution: {integrity: sha512-0R9ikRb668HB7QDxT1vkpuUBtqc53YyAwMwGeUFKRojY/NWKvdZ+9UYtRfGmhqNbRkTSVpMbmyhXipFFv2cb/A==}
     engines: {node: '>= 12'}
     dev: false
 
+  /de-indent@1.0.2:
+    resolution: {integrity: sha512-e/1zu3xH5MQryN2zdVaF0OrdNLUbvWxzMbi+iNA6Bky7l1RoP8a2fIbRocyHclXt/arDrrR6lL3TqFD9pMQTsg==}
+    dev: true
+
   /debug@3.2.7:
     resolution: {integrity: sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==}
     peerDependencies:
@@ -3186,6 +3780,11 @@ packages:
       function-bind: 1.1.2
     dev: true
 
+  /he@1.2.0:
+    resolution: {integrity: sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==}
+    hasBin: true
+    dev: true
+
   /hookable@5.5.3:
     resolution: {integrity: sha512-Yc+BQe8SvoXH1643Qez1zqLRmbA5rCL+sSmk6TVos0LWVfNIB7PGncdlId77WzLGSIB5KaWgTaNTs2lNVEI6VQ==}
     dev: true
@@ -3194,6 +3793,11 @@ packages:
     resolution: {integrity: sha512-mxIDAb9Lsm6DoOJ7xH+5+X4y1LU/4Hi50L9C5sIswK3JzULS4bwk1FvjdBgvYR4bzT4tuUQiC15FE2f5HbLvYw==}
     dev: true
 
+  /html-tags@3.3.1:
+    resolution: {integrity: sha512-ztqyC3kLto0e9WbNp0aeP+M3kTt+nbaIveGmUxAtZa+8iFgKLUOD4YKM5j+f3QD89bra7UeumolZHKuOXnTmeQ==}
+    engines: {node: '>=8'}
+    dev: true
+
   /https-proxy-agent@7.0.2:
     resolution: {integrity: sha512-NmLNjm6ucYwtcUmL7JQC1ZQ57LmHP4lT15FQ8D61nak1rO6DH+fz5qNK2Ap5UN4ZapYICE3/0KodcLYSPsPbaA==}
     engines: {node: '>= 14'}
@@ -3525,6 +4129,13 @@ packages:
       yallist: 4.0.0
     dev: true
 
+  /magic-string-ast@0.3.0:
+    resolution: {integrity: sha512-0shqecEPgdFpnI3AP90epXyxZy9g6CRZ+SZ7BcqFwYmtFEnZ1jpevcV5HoyVnlDS9gCnc1UIg3Rsvp3Ci7r8OA==}
+    engines: {node: '>=16.14.0'}
+    dependencies:
+      magic-string: 0.30.5
+    dev: true
+
   /magic-string@0.30.5:
     resolution: {integrity: sha512-7xlpfBaQaP/T6Vh8MO/EqXSW5En6INHEvEXQiuff7Gku0PWjU3uf6w/j9o7O+SpB5fOAkrI5HeoNgwjEO0pFsA==}
     engines: {node: '>=12'}
@@ -3711,6 +4322,10 @@ packages:
     resolution: {integrity: sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==}
     dev: true
 
+  /muggle-string@0.3.1:
+    resolution: {integrity: sha512-ckmWDJjphvd/FvZawgygcUeQCxzvohjFO5RxTjj4eq8kw359gFF3E1brjfI+viLMxss5JrHTDRHZvu2/tuy0Qg==}
+    dev: true
+
   /mute-stream@1.0.0:
     resolution: {integrity: sha512-avsJQhyd+680gKXyG/sQc0nXaC6rBkPOfyHYcFb9+hdkqQkR9bdnkJ0AMZhke0oesPqIO+mFFJ+IdBc7mst4IA==}
     engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0}
@@ -4303,6 +4918,15 @@ packages:
       source-map-js: 1.0.2
     dev: true
 
+  /postcss@8.4.32:
+    resolution: {integrity: sha512-D/kj5JNu6oo2EIy+XL/26JEDTlIbB8hw85G8StOE6L74RQAVVP5rej6wxCNqyMbR4RkPfqvezVbPw81Ngd6Kcw==}
+    engines: {node: ^10 || ^12 || >=14}
+    dependencies:
+      nanoid: 3.3.7
+      picocolors: 1.0.0
+      source-map-js: 1.0.2
+    dev: true
+
   /prelude-ls@1.2.1:
     resolution: {integrity: sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==}
     engines: {node: '>= 0.8.0'}
@@ -4410,6 +5034,11 @@ packages:
     resolution: {integrity: sha512-seS2Tj26TBVOC2NIc2rOe2y2ZO7efxITtLZcGSOnHHNOQ7CkiUBfw0Iw2ck6xkIhPwLhKNLS8BO+hEpngQlqzw==}
     dev: true
 
+  /resolve.exports@2.0.2:
+    resolution: {integrity: sha512-X2UW6Nw3n/aMgDVy+0rSqgHlv39WZAlZrXCdnbyEiKm17DSqHX4MmQMaST3FbeWR5FTuRcUwYAziZajji0Y7mg==}
+    engines: {node: '>=10'}
+    dev: true
+
   /resolve@1.22.8:
     resolution: {integrity: sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw==}
     hasBin: true
@@ -4677,6 +5306,10 @@ packages:
     engines: {node: '>= 0.4'}
     dev: true
 
+  /svg-tags@1.0.0:
+    resolution: {integrity: sha512-ovssysQTa+luh7A5Weu3Rta6FJlFBBbInjOh722LIt6klpU2/HtdUbszju/G4devcvk8PGt7FCLv5wftu3THUA==}
+    dev: true
+
   /svgo@3.0.5:
     resolution: {integrity: sha512-HQKHEo73pMNOlDlBcLgZRcHW2+1wo7bFYayAXkGN0l/2+h68KjlfZyMRhdhaGvoHV2eApOovl12zoFz42sT6rQ==}
     engines: {node: '>=14.0.0'}
@@ -4902,6 +5535,95 @@ packages:
       - supports-color
     dev: true
 
+  /unplugin-combine@0.8.1(rollup@3.29.4)(vite@5.0.4):
+    resolution: {integrity: sha512-m2OSmXXRwCPZx8Ct8eF8WbjgTo8bydim2W1ofu2hDabGdr2pgDAoFjOP1J4MOIwa0OByqk1JX8IGlSdeE6uxVQ==}
+    engines: {node: '>=16.14.0'}
+    peerDependencies:
+      esbuild: '>=0.13'
+      rollup: ^3.2.0 || ^4.0.0
+      vite: ^2.3.0 || ^3.0.0 || ^4.0.0 || ^5.0.0
+      webpack: 4 || 5
+    peerDependenciesMeta:
+      esbuild:
+        optional: true
+      rollup:
+        optional: true
+      vite:
+        optional: true
+      webpack:
+        optional: true
+    dependencies:
+      '@antfu/utils': 0.7.6
+      rollup: 3.29.4
+      unplugin: 1.5.1
+      vite: 5.0.4(@types/node@20.10.1)
+    dev: true
+
+  /unplugin-vue-define-options@1.4.0(rollup@3.29.4)(vue@3.3.10):
+    resolution: {integrity: sha512-P8TPXzZ1eqwkLZrGm+tHc7fR7/md6bEfSuJdxZi6Pp4PcqRctDzmZiXpQVIjBULpv+LhOCVRehIrsOTvABVUww==}
+    engines: {node: '>=16.14.0'}
+    dependencies:
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      ast-walker-scope: 0.5.0(rollup@3.29.4)
+      unplugin: 1.5.1
+    transitivePeerDependencies:
+      - rollup
+      - vue
+    dev: true
+
+  /unplugin-vue-macros@2.7.0(rollup@3.29.4)(typescript@5.3.2)(vite@5.0.4)(vue@3.3.10):
+    resolution: {integrity: sha512-SztF4ARBbrd1yuH4FbJOhp22rTvzakjzJUHTKLRQkZY1KMkIzx/KAdzEkxjAG2Xteqb29SYrc7XcoPdrUPMCCw==}
+    engines: {node: '>=16.14.0'}
+    peerDependencies:
+      vue: ^2.7.0 || ^3.2.25
+    dependencies:
+      '@vue-macros/better-define': 1.7.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/boolean-prop': 0.3.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/chain-call': 0.2.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/common': 1.9.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/define-emit': 0.2.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/define-models': 1.2.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/define-prop': 0.3.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/define-props': 2.0.0(@vue-macros/reactivity-transform@0.4.0)(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/define-props-refs': 1.2.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/define-render': 1.5.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/define-slots': 1.1.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/devtools': 0.2.0(typescript@5.3.2)(vite@5.0.4)
+      '@vue-macros/export-expose': 0.1.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/export-props': 0.4.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/export-render': 0.2.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/hoist-static': 1.5.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/jsx-directive': 0.7.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/named-template': 0.4.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/reactivity-transform': 0.4.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/setup-block': 0.3.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/setup-component': 0.17.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/setup-sfc': 0.17.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/short-bind': 0.2.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/short-emits': 1.5.0(rollup@3.29.4)(vue@3.3.10)
+      '@vue-macros/short-vmodel': 1.4.0(rollup@3.29.4)(vue@3.3.10)
+      unplugin: 1.5.1
+      unplugin-combine: 0.8.1(rollup@3.29.4)(vite@5.0.4)
+      unplugin-vue-define-options: 1.4.0(rollup@3.29.4)(vue@3.3.10)
+      vue: 3.3.10(typescript@5.3.2)
+    transitivePeerDependencies:
+      - '@vueuse/core'
+      - esbuild
+      - rollup
+      - typescript
+      - vite
+      - webpack
+    dev: true
+
+  /unplugin@1.5.1:
+    resolution: {integrity: sha512-0QkvG13z6RD+1L1FoibQqnvTwVBXvS4XSPwAyinVgoOCl2jAgwzdUKmEj05o4Lt8xwQI85Hb6mSyYkcAGwZPew==}
+    dependencies:
+      acorn: 8.11.2
+      chokidar: 3.5.3
+      webpack-sources: 3.2.3
+      webpack-virtual-modules: 0.6.1
+    dev: true
+
   /untyped@1.4.0:
     resolution: {integrity: sha512-Egkr/s4zcMTEuulcIb7dgURS6QpN7DyqQYdf+jBtiaJvQ+eRsrtWUoX84SbvQWuLkXsOjM+8sJC9u6KoMK/U7Q==}
     hasBin: true
@@ -5086,11 +5808,43 @@ packages:
       - supports-color
     dev: true
 
+  /vue-template-compiler@2.7.15:
+    resolution: {integrity: sha512-yQxjxMptBL7UAog00O8sANud99C6wJF+7kgbcwqkvA38vCGF7HWE66w0ZFnS/kX5gSoJr/PQ4/oS3Ne2pW37Og==}
+    dependencies:
+      de-indent: 1.0.2
+      he: 1.2.0
+    dev: true
+
+  /vue@3.3.10(typescript@5.3.2):
+    resolution: {integrity: sha512-zg6SIXZdTBwiqCw/1p+m04VyHjLfwtjwz8N57sPaBhEex31ND0RYECVOC1YrRwMRmxFf5T1dabl6SGUbMKKuVw==}
+    peerDependencies:
+      typescript: '*'
+    peerDependenciesMeta:
+      typescript:
+        optional: true
+    dependencies:
+      '@vue/compiler-dom': 3.3.10
+      '@vue/compiler-sfc': 3.3.10
+      '@vue/runtime-dom': 3.3.10
+      '@vue/server-renderer': 3.3.10(vue@3.3.10)
+      '@vue/shared': 3.3.10
+      typescript: 5.3.2
+    dev: true
+
   /web-streams-polyfill@3.2.1:
     resolution: {integrity: sha512-e0MO3wdXWKrLbL0DgGnUV7WHVuw9OUvL4hjgnPkIeEvESk74gAITi5G606JtZPp39cd8HA9VQzCIvA49LpPN5Q==}
     engines: {node: '>= 8'}
     dev: false
 
+  /webpack-sources@3.2.3:
+    resolution: {integrity: sha512-/DyMEOrDgLKKIG0fmvtz+4dUX/3Ghozwgm6iPp8KRhvn+eQf9+Q7GWxVNMk3+uCPWfdXYC4ExGBckIXdFEfH1w==}
+    engines: {node: '>=10.13.0'}
+    dev: true
+
+  /webpack-virtual-modules@0.6.1:
+    resolution: {integrity: sha512-poXpCylU7ExuvZK8z+On3kX+S8o/2dQ/SVYueKA0D4WEMXROXgY8Ez50/bQEUmvoSMMrWcrJqCHuhAbsiwg7Dg==}
+    dev: true
+
   /webpod@0.0.2:
     resolution: {integrity: sha512-cSwwQIeg8v4i3p4ajHhwgR7N6VyxAf+KYSSsY6Pd3aETE+xEU4vbitz7qQkB0I321xnhDdgtxuiSfk5r/FVtjg==}
     hasBin: true
diff --git a/src/common/constants.ts b/src/common/constants.ts
index d15b40e..ec87473 100644
--- a/src/common/constants.ts
+++ b/src/common/constants.ts
@@ -1,7 +1,7 @@
 export const officialMacros = [
   { name: 'define-options', value: 'defineOptions', volar: true, status: 'official' },
   { name: 'define-slots', value: 'defineSlots', volar: true, status: 'official' },
-  { name: 'define-emits', value: 'defineEmits', volar: true, status: 'official' },
+  { name: 'short-emits', value: 'shortEmits', volar: false, status: 'official' },
 ] as const
 
 export const stableMacros = [
diff --git a/src/init/index.ts b/src/init/index.ts
index 75e029f..954f8c1 100644
--- a/src/init/index.ts
+++ b/src/init/index.ts
@@ -1,7 +1,7 @@
 import { checkbox, select } from '@inquirer/prompts'
 import { chalk } from 'zx'
 import type { VueMacros } from '../common'
-import { experimentalMacros, stableMacros } from '../common'
+import { experimentalMacros, officialMacros, stableMacros } from '../common'
 import { rewriteNuxtConfig } from './nuxt'
 import { rewriteTsConfig } from './tsconfig'
 import { rewriteViteConfig } from './vite'
@@ -11,10 +11,11 @@ export async function init(target: string) {
   const selectedMacros = (await checkbox({
     message: chalk.green(`Which vue macros do you want to use?`),
     choices: [
+      ...officialMacros.slice(-1),
       ...stableMacros.slice(-2),
       ...experimentalMacros,
     ],
-    pageSize: 13,
+    pageSize: 14,
   })).reduce((result, macro) => {
     result[macro] = true
     return result
@@ -38,11 +39,25 @@ export async function init(target: string) {
         { value: '::' },
         { value: '*' },
       ],
-    }) as any
+    })
 
     selectedMacros.shortVmodel = { prefix }
   }
 
+  if (selectedMacros.defineProp) {
+    const edition = await select({
+      message: chalk.green(
+      `Which edition do you want to use?`,
+      ),
+      choices: [
+        { name: 'kevinEdition', value: 'kevinEdition' },
+        { name: 'johnsonEdition', value: 'johnsonEdition' },
+      ],
+    })
+
+    selectedMacros.defineProp = { edition }
+  }
+
   await rewriteConfig(selectedMacros, target)
 }
 
diff --git a/src/init/package.ts b/src/init/package.ts
index 0c0d428..ebc4916 100644
--- a/src/init/package.ts
+++ b/src/init/package.ts
@@ -32,7 +32,7 @@ export async function rewritePackage(macros: VueMacros, target: string) {
     'typescript',
   ]
   if (macros.jsxDirective || macros.setupSFC)
-    deps.push('@vitejs/plugin-vue-jsx', '@vue/babel-helper-vue-transform-on')
+    deps.push('@vitejs/plugin-vue-jsx')
 
   await installDeps(deps)
 }
diff --git a/src/init/tsconfig.ts b/src/init/tsconfig.ts
index deb3b2e..a1cebf3 100644
--- a/src/init/tsconfig.ts
+++ b/src/init/tsconfig.ts
@@ -2,7 +2,7 @@ import type { TSConfig } from 'pkg-types'
 import { readTSConfig, writeTSConfig } from 'pkg-types'
 import { fs } from 'zx'
 import type { VueMacros } from '../common'
-import { vueMacros } from '../common'
+import { camelize, vueMacros } from '../common'
 
 export async function rewriteTsConfig(selectedMacros: VueMacros, target: string) {
   const filename = `${target}/nuxt.config.ts`
@@ -28,9 +28,11 @@ export async function rewriteTsConfig(selectedMacros: VueMacros, target: string)
   const vueCompilerOptions = tsconfig.vueCompilerOptions ??= {}
   const plugins = vueCompilerOptions.plugins ??= []
   for (const [macro, options] of Object.entries(macros)) {
-    if (macro === 'short-vmodel') {
+    if (options !== true) {
       const vueMacros = vueCompilerOptions.vueMacros ??= {}
-      vueMacros.shortVmodel = options
+      vueMacros[camelize(macro)] = options.edition
+        ? { experimentalDefinePropProposal: options.edition }
+        : options
     }
 
     // prevent exportProps and exportExpose co-usage
@@ -45,5 +47,10 @@ export async function rewriteTsConfig(selectedMacros: VueMacros, target: string)
       plugins.push(`@vue-macros/volar/${macro}`)
   }
 
+  tsconfig.compilerOptions ??= {}
+  tsconfig.compilerOptions.types ??= []
+  if (!tsconfig.compilerOptions.types.includes('unplugin-vue-macros/macros-global'))
+    tsconfig.compilerOptions.types.push('unplugin-vue-macros/macros-global')
+
   await writeTSConfig(`${target}/tsconfig.json`, tsconfig)
 }
diff --git a/src/init/vite.ts b/src/init/vite.ts
index ec65220..a02720f 100644
--- a/src/init/vite.ts
+++ b/src/init/vite.ts
@@ -37,11 +37,6 @@ export async function rewriteViteConfig(macros: VueMacros, target: string) {
   }
 
   const vueJsx: ProxifiedFunctionCall = vueMacrosOptions?.plugins?.vueJsx || getVitePlugin('@vitejs/plugin-vue-jsx', 'VueJsx')
-  if (vueJsx && (macros.jsxDirective || macros.setupSFC)) {
-    vueJsx.$args[0] ?? vueJsx.$args.push({})
-    const arg = vueJsx.$args[0] as any
-    arg.transformOn = true
-  }
 
   updateVitePluginConfig(config, 'unplugin-vue-macros/vite', {
     ...macros,
diff --git a/src/sg/rules/define-slots.yml b/src/sg/rules/define-slots.yml
index eb09014..431e5ff 100644
--- a/src/sg/rules/define-slots.yml
+++ b/src/sg/rules/define-slots.yml
@@ -4,8 +4,9 @@ utils:
   is-default-slot:
     kind: tag_name
     regex: ^slot$
+    inside:
+      kind: start_tag
     precedes:
-      kind: attribute
       not:
         has:
           kind: attribute_name
@@ -32,6 +33,8 @@ utils:
   is-slot:
     kind: tag_name
     regex: ^slot$
+    inside:
+      kind: start_tag
     precedes:
       kind: attribute
       has:
diff --git a/src/sg/rules/jsx-directive/pascal-case.yml b/src/sg/rules/jsx-directive/pascal-case.yml
new file mode 100644
index 0000000..e51b874
--- /dev/null
+++ b/src/sg/rules/jsx-directive/pascal-case.yml
@@ -0,0 +1,46 @@
+id: v-pascal-case for tagName
+language: tsx
+rule:
+    kind: identifier
+    pattern: $A
+    regex: '-'
+    inside:
+      any:
+        - kind: jsx_opening_element
+        - kind: jsx_closing_element
+        - kind: jsx_self_closing_element
+transform:
+  B:
+    convert:
+      source: $A
+      toCase: pascalCase
+      separatedBy: [dash]
+fix:
+  $B
+
+---
+
+id: v-pascal-case for attributeName
+language: tsx
+rule:
+  any:
+    - kind: property_identifier
+      pattern: $A
+      regex: ^[^v]-
+    - kind: identifier
+      pattern: $A
+      regex: '-'
+      follows:
+        kind: identifier
+        stopBy: end
+        inside:
+          kind: jsx_namespace_name
+
+transform:
+  B:
+    convert:
+      source: $A
+      toCase: camelCase
+      separatedBy: [dash]
+fix:
+  $B