feat: dynamic props

Author: sxzz

packages/runtime-vapor/__tests__/componentEmits.spec.ts

@@ -38,6 +38,28 @@ describe('component: emit', () => {
     expect(onBaz).toHaveBeenCalled()
   })
 
+  test('trigger dynamic emits', () => {
+    const { render } = define({
+      setup(_, { emit }) {
+        emit('foo')
+        emit('bar')
+        emit('!baz')
+      },
+    })
+    const onFoo = vi.fn()
+    const onBar = vi.fn()
+    const onBaz = vi.fn()
+    render(() => ({
+      onfoo: onFoo,
+      onBar,
+      ['on!baz']: onBaz,
+    }))
+
+    expect(onFoo).not.toHaveBeenCalled()
+    expect(onBar).toHaveBeenCalled()
+    expect(onBaz).toHaveBeenCalled()
+  })
+
   test('trigger camelCase handler', () => {
     const { render } = define({
       setup(_, { emit }) {

packages/runtime-vapor/src/apiCreateVaporApp.ts

@@ -1,4 +1,4 @@
-import { isObject } from '@vue/shared'
+import { isFunction, isObject } from '@vue/shared'
 import {
   type Component,
   type ComponentInternalInstance,
@@ -14,8 +14,9 @@ export function createVaporApp(
   rootComponent: Component,
   rootProps: RawProps | null = null,
 ): App {
-  if (rootProps != null && !isObject(rootProps)) {
-    __DEV__ && warn(`root props passed to app.mount() must be an object.`)
+  if (rootProps != null && !isObject(rootProps) && !isFunction(rootProps)) {
+    __DEV__ &&
+      warn(`root props passed to app.mount() must be an object or function.`)
     rootProps = null
   }
 

packages/runtime-vapor/src/componentEmits.ts

@@ -13,7 +13,7 @@ import {
 } from '@vue/shared'
 import type { Component, ComponentInternalInstance } from './component'
 import { VaporErrorCodes, callWithAsyncErrorHandling } from './errorHandling'
-import type { StaticProps } from './componentProps'
+import { type StaticProps, getDynamicPropValue } from './componentProps'
 import { warn } from './warning'
 
 export type ObjectEmitsOptions = Record<
@@ -86,12 +86,7 @@ export function emit(
 
   // has v-bind or :[eventName]
   if (hasDynamicProps) {
-    // TODO
-    // getDynamicPropValue(rawProps, 'key')
-    // for (const key in rawProps) {
-    // const getter = () =>
-    // registerProp(instance, props, key, getter, true)
-    // }
+    tryGet(key => getDynamicPropValue(rawProps, key)[0])
   } else {
     const staticProps = rawProps[0] as StaticProps
     tryGet(key => staticProps[key] && staticProps[key]())

packages/runtime-vapor/src/componentProps.ts

@@ -75,7 +75,7 @@ export type NormalizedPropsOptions =
 export type StaticProps = Record<string, () => unknown>
 type DynamicProps = () => Data
 export type NormalizedRawProps = Array<StaticProps | DynamicProps>
-export type RawProps = NormalizedRawProps | StaticProps | null
+export type RawProps = NormalizedRawProps | StaticProps | DynamicProps | null
 
 export function initProps(
   instance: ComponentInternalInstance,