From 7c68b482c58e76b58ecfd9fbf2abc3a306943073 Mon Sep 17 00:00:00 2001
From: daiwei <daiwei521@126.com>
Date: Wed, 5 Mar 2025 17:09:20 +0800
Subject: [PATCH] wip: vdom interop

---
 .../runtime-core/src/helpers/renderSlot.ts    |  2 +-
 .../runtime-dom/src/components/Transition.ts  | 18 ++++++++++++++++--
 packages/runtime-vapor/src/component.ts       |  4 ++--
 packages/runtime-vapor/src/componentSlots.ts  | 10 +++++-----
 packages/runtime-vapor/src/vdomInterop.ts     | 19 ++++++++++++++-----
 5 files changed, 38 insertions(+), 15 deletions(-)

diff --git a/packages/runtime-core/src/helpers/renderSlot.ts b/packages/runtime-core/src/helpers/renderSlot.ts
index 152c5a4b81..e41a14c2ae 100644
--- a/packages/runtime-core/src/helpers/renderSlot.ts
+++ b/packages/runtime-core/src/helpers/renderSlot.ts
@@ -35,7 +35,7 @@ export function renderSlot(
   let slot = slots[name]
 
   // vapor slots rendered in vdom
-  if (slot && slots._vapor) {
+  if (slot && slots.__interop) {
     const ret = (openBlock(), createBlock(VaporSlot, props))
     ret.vs = { slot, fallback }
     return ret
diff --git a/packages/runtime-dom/src/components/Transition.ts b/packages/runtime-dom/src/components/Transition.ts
index 3d8ac9dc8b..7e28dc0830 100644
--- a/packages/runtime-dom/src/components/Transition.ts
+++ b/packages/runtime-dom/src/components/Transition.ts
@@ -4,9 +4,11 @@ import {
   BaseTransitionPropsValidators,
   DeprecationTypes,
   type FunctionalComponent,
+  type Slots,
   assertNumber,
   compatUtils,
   h,
+  renderSlot,
 } from '@vue/runtime-core'
 import { extend, isArray, isObject, toNumber } from '@vue/shared'
 
@@ -101,8 +103,20 @@ const decorate = (t: typeof Transition) => {
 export const Transition: FunctionalComponent<TransitionProps> =
   /*@__PURE__*/ decorate((props, { slots }) => {
     const resolvedProps = resolveTransitionProps(props)
-    if (slots._vapor) {
-      // vapor transition
+    if (slots.__vapor) {
+      // with vapor interop plugin
+      if (slots.__interop) {
+        const children = vaporTransitionImpl!.applyTransition(
+          resolvedProps,
+          slots as any,
+        )
+        const vaporSlots = {
+          default: () => children,
+          __interop: true,
+        } as any as Slots
+        return renderSlot(vaporSlots, 'default')
+      }
+
       return vaporTransitionImpl!.applyTransition(resolvedProps, slots as any)
     }
 
diff --git a/packages/runtime-vapor/src/component.ts b/packages/runtime-vapor/src/component.ts
index 2eae68e5fe..bd033d6653 100644
--- a/packages/runtime-vapor/src/component.ts
+++ b/packages/runtime-vapor/src/component.ts
@@ -56,7 +56,7 @@ import {
   type VaporSlot,
   dynamicSlotsProxyHandlers,
   getSlot,
-  vaporSlotsProxyHandler,
+  staticSlotsProxyHandler,
 } from './componentSlots'
 import { hmrReload, hmrRerender } from './hmr'
 
@@ -417,7 +417,7 @@ export class VaporComponentInstance implements GenericComponentInstance {
     this.slots = rawSlots
       ? rawSlots.$
         ? new Proxy(rawSlots, dynamicSlotsProxyHandlers)
-        : new Proxy(rawSlots, vaporSlotsProxyHandler)
+        : new Proxy(rawSlots, staticSlotsProxyHandler)
       : EMPTY_OBJ
   }
 
diff --git a/packages/runtime-vapor/src/componentSlots.ts b/packages/runtime-vapor/src/componentSlots.ts
index 0dd1329e44..85bf52c0be 100644
--- a/packages/runtime-vapor/src/componentSlots.ts
+++ b/packages/runtime-vapor/src/componentSlots.ts
@@ -16,10 +16,10 @@ export type DynamicSlot = { name: string; fn: VaporSlot }
 export type DynamicSlotFn = () => DynamicSlot | DynamicSlot[]
 export type DynamicSlotSource = StaticSlots | DynamicSlotFn
 
-export const vaporSlotsProxyHandler: ProxyHandler<any> = {
+export const staticSlotsProxyHandler: ProxyHandler<any> = {
   get(target, key) {
-    if (key === '_vapor') {
-      return target
+    if (key === '__vapor') {
+      return true
     } else {
       return target[key]
     }
@@ -28,8 +28,8 @@ export const vaporSlotsProxyHandler: ProxyHandler<any> = {
 
 export const dynamicSlotsProxyHandlers: ProxyHandler<RawSlots> = {
   get: (target, key: string) => {
-    if (key === '_vapor') {
-      return target
+    if (key === '__vapor') {
+      return true
     } else {
       return getSlot(target, key)
     }
diff --git a/packages/runtime-vapor/src/vdomInterop.ts b/packages/runtime-vapor/src/vdomInterop.ts
index b4ed4cb4d5..f6dbd26739 100644
--- a/packages/runtime-vapor/src/vdomInterop.ts
+++ b/packages/runtime-vapor/src/vdomInterop.ts
@@ -29,11 +29,7 @@ import {
 import { type Block, VaporFragment, insert, remove } from './block'
 import { EMPTY_OBJ, extend, isFunction } from '@vue/shared'
 import { type RawProps, rawPropsProxyHandlers } from './componentProps'
-import {
-  type RawSlots,
-  type VaporSlot,
-  vaporSlotsProxyHandler,
-} from './componentSlots'
+import type { RawSlots, VaporSlot } from './componentSlots'
 import { renderEffect } from './renderEffect'
 import { createTextNode } from './dom/node'
 import { optimizePropertyLookup } from './dom/prop'
@@ -133,6 +129,16 @@ const vaporSlotPropsProxyHandler: ProxyHandler<
   },
 }
 
+const vaporSlotsProxyHandler: ProxyHandler<any> = {
+  get(target, key) {
+    if (key === '__interop') {
+      return target
+    } else {
+      return target[key]
+    }
+  },
+}
+
 /**
  * Mount vdom component in vapor
  */
@@ -170,6 +176,8 @@ function createVDOMComponent(
   }
 
   frag.insert = (parentNode, anchor) => {
+    const prev = currentInstance
+    simpleSetCurrentInstance(parentInstance)
     if (!isMounted) {
       internals.mt(
         vnode,
@@ -192,6 +200,7 @@ function createVDOMComponent(
         parentInstance as any,
       )
     }
+    simpleSetCurrentInstance(prev)
   }
 
   frag.remove = unmount
-- 
2.47.2