feat(vue-jsx-vapor): support vaporComponent for createNodes

Author: zhiyuanzmj

docs/introduction/getting-started.md

@@ -25,7 +25,7 @@ We assume you are already familiar with the basic usages of Vue before you conti
 pnpm add vue-jsx-vapor
 
 # runtime
-pnpm add https://pkg.pr.new/vue@42f38ca
+pnpm add https://pkg.pr.new/vue@d386396
 ```
 
 The Vue Vapor runtime is not release, so we use [pkg.pr.new](https://github.com/stackblitz-labs/pkg.pr.new) to install.

packages/vue-jsx-vapor/package.json

@@ -191,6 +191,7 @@
     "esbuild": "*",
     "rollup": "^3",
     "vite": ">=3",
+    "vue": "^3.5.0",
     "webpack": "^4 || ^5"
   },
   "peerDependenciesMeta": {

packages/vue-jsx-vapor/src/core/runtime.ts

@@ -2,6 +2,7 @@ import {
   effectScope,
   insert,
   isFragment,
+  isVaporComponent,
   remove,
   renderEffect,
   VaporFragment,
@@ -12,27 +13,29 @@ import {
 export { shallowRef as useRef } from 'vue'
 
 function createFragment(
-  nodes: Block[],
+  nodes: Block,
   anchor: Node | undefined = document.createTextNode(''),
 ) {
   const frag = new VaporFragment(nodes)
   frag.anchor = anchor
   return frag
 }
 
-function normalizeValue(value: any, anchor?: Element): Block {
-  if (value instanceof Node || isFragment(value)) {
+function normalizeNode(node: any, anchor?: Element): Block {
+  if (node instanceof Node || isFragment(node)) {
     anchor && (anchor.textContent = '')
-    return value
-  } else if (Array.isArray(value)) {
+    return node
+  } else if (isVaporComponent(node)) {
+    anchor && (anchor.textContent = '')
+    return createFragment(node, anchor)
+  } else if (Array.isArray(node)) {
     anchor && (anchor.textContent = '')
     return createFragment(
-      value.map((i) => normalizeValue(i)),
+      node.map((i) => normalizeNode(i)),
       anchor,
     )
   } else {
-    const result =
-      value == null || typeof value === 'boolean' ? '' : String(value)
+    const result = node == null || typeof node === 'boolean' ? '' : String(node)
     if (anchor) {
       anchor.textContent = result
       return anchor
@@ -43,7 +46,7 @@ function normalizeValue(value: any, anchor?: Element): Block {
 }
 
 function resolveValue(current: Block, value: any, anchor?: Element) {
-  const node = normalizeValue(value, anchor)
+  const node = normalizeNode(value, anchor)
   if (current) {
     if (isFragment(current)) {
       const { anchor } = current