types(defineComponent): Stricter Component Type + helpers

packages/dts-test/componentTypeHelpers.test-d.tsx

@@ -12,6 +12,7 @@ import {
   type DeclareEmits,
   type ExtractComponentOptions,
   type FunctionalComponent,
+  type ObjectToComponentProps,
   type PropType,
   type SetupContext,
   type SlotsType,
@@ -1304,6 +1305,62 @@ describe('DeclareEmits', () => {
   }
 })
 
+// ObjectToComponentProps
+describe('ObjectToComponentProps', () => {
+  {
+    // prop options
+    const props = {
+      foo: String,
+      bar: {
+        type: String,
+        default: 'bar',
+      },
+    }
+    const s = {} as ObjectToComponentProps<typeof props>
+
+    expectType<{
+      foo: StringConstructor
+      bar: {
+        type: StringConstructor
+        default: string
+      }
+    }>(s)
+
+    // @ts-expect-error not any
+    expectType<{ bar: string }>(s)
+  }
+  {
+    // array props
+    const props = ['foo', 'bar'] as const
+    const s = {} as ObjectToComponentProps<typeof props>
+
+    expectType<readonly ['foo', 'bar']>(s)
+    // @ts-expect-error not any
+    expectType<{ bar: string }>(s)
+  }
+
+  {
+    // types
+    const s = {} as ObjectToComponentProps<{
+      foo?: string
+      bar: string
+    }>
+
+    expectType<{
+      foo: {
+        type: PropType<string>
+        required: false
+      }
+      bar: {
+        type: PropType<string>
+        required: true
+      }
+    }>(s)
+    // @ts-expect-error not any
+    expectType<{ bar: string }>(s)
+  }
+})
+
 // Component Instance
 
 declare function retrieveComponentInstance<T>(

packages/runtime-core/src/componentTypeHelpers.ts

@@ -16,6 +16,7 @@ import type {
   ComponentPropsOptions,
   ExtractDefaultPropTypes,
   ExtractPropTypes,
+  Prop,
   PropType,
 } from './componentProps'
 import type { Slots, SlotsType, UnwrapSlotsType } from './componentSlots'
@@ -186,14 +187,18 @@ type ResolveMixin<T> = [T] extends [
  * }
  * ```
  */
-export type ObjectToComponentProps<T> = T extends Record<string, any>
-  ? {
-      [K in keyof T]-?: {
-        type: PropType<Exclude<T[K], undefined>>
-        required: undefined extends T[K] ? false : true
+export type ObjectToComponentProps<T> = T extends Readonly<Array<string>>
+  ? T
+  : T extends Record<string, any>
+    ? {
+        [K in keyof T]-?: T[K] extends Prop<any>
+          ? T[K]
+          : {
+              type: PropType<Exclude<T[K], undefined>>
+              required: undefined extends T[K] ? false : true
+            }
       }
-    }
-  : {}
+    : {}
 
 /**
  * Extracts Original props from options
@@ -251,7 +256,7 @@ export type ComponentEmitsAsProps<T> = T extends {
  * Returns runtime props definition for a component
  *
  *  @see Include emits {@linkcode ComponentEmitsAsProps}
- *  @see Get the render props {@linkcode ComponentExpectedProps}
+ *  @see Get the render props {@linkcode Compo/`nentExpectedProps}
  *
  * @example
  * ```ts