types: refactor VNodeProps type

packages/runtime-core/src/apiCreateComponent.ts

@@ -9,13 +9,7 @@ import { SetupContext, RenderFunction } from './component'
 import { ComponentPublicInstance } from './componentProxy'
 import { ExtractPropTypes } from './componentProps'
 import { isFunction } from '@vue/shared'
-import { Ref } from '@vue/reactivity'
-
-interface BaseProps {
-  [key: string]: any
-  key?: string | number
-  ref?: string | Ref | Function
-}
+import { VNodeProps } from './vnode'
 
 // overload 1: direct setup function
 // (uses user defined props interface)
@@ -32,7 +26,7 @@ export function createComponent<Props, RawBindings = object>(
     {},
     {},
     // public props
-    BaseProps & Props
+    VNodeProps & Props
   >
 }
 
@@ -55,7 +49,7 @@ export function createComponent<
     D,
     C,
     M,
-    BaseProps & Props
+    VNodeProps & Props
   >
 }
 
@@ -73,7 +67,7 @@ export function createComponent<
 ): {
   __isConstructor: true
   // array props technically doesn't place any contraints on props in TSX
-  new (): ComponentPublicInstance<BaseProps, RawBindings, D, C, M>
+  new (): ComponentPublicInstance<VNodeProps, RawBindings, D, C, M>
 }
 
 // overload 4: object format with object props declaration
@@ -95,7 +89,7 @@ export function createComponent<
     D,
     C,
     M,
-    BaseProps & ExtractPropTypes<PropsOptions, false>
+    VNodeProps & ExtractPropTypes<PropsOptions, false>
   >
 }
 

packages/runtime-core/src/h.ts

@@ -1,6 +1,7 @@
 import {
   VNodeTypes,
   VNode,
+  VNodeProps,
   createVNode,
   VNodeChildren,
   Fragment,
@@ -9,7 +10,6 @@ import {
   Suspense
 } from './vnode'
 import { isObject, isArray } from '@vue/shared'
-import { Ref } from '@vue/reactivity'
 import { RawSlots } from './componentSlots'
 import { FunctionalComponent } from './component'
 import {
@@ -51,17 +51,14 @@ h(Component, {}, {}) // named slots
 h(Component, null, {})
 **/
 
-export interface RawProps {
-  [key: string]: any
-  key?: string | number
-  ref?: string | Ref | Function
+type RawProps = VNodeProps & {
   // used to differ from a single VNode object as children
   _isVNode?: never
   // used to differ from Array children
   [Symbol.iterator]?: never
 }
 
-export type RawChildren =
+type RawChildren =
   | string
   | number
   | boolean
@@ -69,8 +66,6 @@ export type RawChildren =
   | VNodeChildren
   | (() => any)
 
-export { RawSlots }
-
 // fake constructor type returned from `createComponent`
 interface Constructor<P = any> {
   new (): { $props: P }

packages/runtime-core/src/index.ts

@@ -60,8 +60,7 @@ export { registerRuntimeCompiler } from './component'
 // Types -----------------------------------------------------------------------
 
 export { App, AppConfig, AppContext, Plugin } from './apiApp'
-export { RawProps, RawChildren, RawSlots } from './h'
-export { VNode, VNodeTypes } from './vnode'
+export { VNode, VNodeTypes, VNodeProps } from './vnode'
 export {
   Component,
   FunctionalComponent,

packages/runtime-core/src/vnode.ts

@@ -14,7 +14,7 @@ import {
 } from './component'
 import { RawSlots } from './componentSlots'
 import { ShapeFlags } from './shapeFlags'
-import { isReactive } from '@vue/reactivity'
+import { isReactive, Ref } from '@vue/reactivity'
 import { AppContext } from './apiApp'
 import { SuspenseBoundary, isSuspenseType } from './suspense'
 import { DirectiveBinding } from './directives'
@@ -39,6 +39,12 @@ export type VNodeTypes =
   | typeof Comment
   | typeof SuspenseImpl
 
+export interface VNodeProps {
+  [key: string]: any
+  key?: string | number
+  ref?: string | Ref | Function
+}
+
 type VNodeChildAtom<HostNode, HostElement> =
   | VNode<HostNode, HostElement>
   | string
@@ -66,7 +72,7 @@ export type NormalizedChildren<HostNode = any, HostElement = any> =
 export interface VNode<HostNode = any, HostElement = any> {
   _isVNode: true
   type: VNodeTypes
-  props: Record<any, any> | null
+  props: VNodeProps | null
   key: string | number | null
   ref: string | Function | null
   children: NormalizedChildren<HostNode, HostElement>