Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

types(defineComponent): Support for GlobalComponents, typed Directives and respect expose on defineComponent #3399

Merged
merged 43 commits into from
Apr 25, 2024
Merged
Show file tree
Hide file tree
Changes from 13 commits
Commits
Show all changes
43 commits
Select commit Hold shift + click to select a range
e2cac07
types(defineComponent): support for expose component types
pikax Mar 9, 2021
3ccdc0b
chore: add directive typing test
pikax Mar 9, 2021
e140b07
chore: exposed type suppor
pikax Mar 9, 2021
5f49e9c
chore: add global directive type
pikax Mar 9, 2021
fbb62bc
chore: fix tests
pikax Mar 9, 2021
b10bc77
chore: clean dup code
pikax Mar 10, 2021
d0b13fa
chore: add GlobalComponents and GlobalDirectives
pikax Mar 11, 2021
057bad9
chore: add Suspense, KeepAlive, Teleport to GlobalComponents
pikax Mar 13, 2021
9970b45
chore: add Transition and TransitionGroup to globalComponents
pikax Mar 13, 2021
2498929
chore: add BaseTransition ass globalComponent
pikax Mar 13, 2021
b792c6c
chore: add VShow as a globalDirective
pikax Mar 13, 2021
980dbf3
chore: add BaseTransition
pikax Mar 13, 2021
200838d
chore: correct interface with file name
pikax Mar 14, 2021
dffd7c9
Merge branch 'master' into types/refactor_defineComponent
pikax Mar 30, 2021
08c1217
chore: wrap component to get the type
pikax Mar 30, 2021
ca63ffa
chore: typed directives + VModel directive
pikax Apr 15, 2021
16352ca
chore: move arg after modifiers and add tests
pikax Apr 18, 2021
7754d7e
chore: improve tests
pikax Apr 18, 2021
6558afd
chore: add vOn directive as global
pikax Apr 23, 2021
99741b8
chore: vmodel WIP
pikax Apr 25, 2021
675a642
Merge branch 'master-upstream' into types/refactor_defineComponent
pikax Aug 15, 2021
5573d90
chore: remove bad import and fix compat render type
pikax Aug 15, 2021
a3408d7
chore: remove type
pikax Aug 15, 2021
3ecd0cb
Merge branch 'master-upstream' into types/refactor_defineComponent
pikax Jan 1, 2022
3757760
Merge branch 'main-upstream' into types/refactor_defineComponent
pikax Jan 27, 2022
37593c9
minor: fix ssrCompiler test
pikax Feb 5, 2022
b268011
minor: remove breaking code -.-'
pikax Feb 5, 2022
5b82ea4
Merge branch 'main-upstream' into types/refactor_defineComponent
pikax Feb 5, 2022
1269ab1
minor: fix tests and remove unnecessary defineComponent
pikax Feb 5, 2022
50b17d4
chore: remove added defineComponent
pikax Feb 5, 2022
90a5872
Merge branch 'main-upstream' into types/refactor_defineComponent
pikax May 11, 2022
fa99b42
fix bad merge
pikax May 11, 2022
a59d3c5
Merge branch 'main-upstream' into types/refactor_defineComponent
pikax May 12, 2022
30dd076
Merge branch 'main' into pr/3399
pikax Oct 21, 2023
6f0042e
[autofix.ci] apply automated fixes
autofix-ci[bot] Oct 21, 2023
f9754a6
format and remove comment
pikax Oct 21, 2023
9b98398
chore: remove RawOptions from defineComponent
pikax Oct 21, 2023
794f6c1
Merge branch 'main' into pr/3399
pikax Nov 17, 2023
34a5391
[autofix.ci] apply automated fixes
autofix-ci[bot] Nov 17, 2023
6eda2d5
chore: fix vuetify usage
pikax Nov 22, 2023
3b5b8f2
chore: Merge branch 'minor' into pr/3399
pikax Jan 21, 2024
93b94c2
Merge branch 'minor' into types/refactor_defineComponent
pikax Apr 17, 2024
af1c810
chore: Merge branch 'minor' into types/refactor_defineComponent
yyx990803 Apr 25, 2024
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
82 changes: 71 additions & 11 deletions packages/runtime-core/src/apiDefineComponent.ts
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,10 @@ import {
import {
SetupContext,
AllowedComponentProps,
ComponentCustomProps
ComponentCustomProps,
Component,
GlobalDirectives,
GlobalComponents
} from './component'
import {
ExtractPropTypes,
Expand All @@ -25,6 +28,7 @@ import {
CreateComponentPublicInstance,
ComponentPublicInstanceConstructor
} from './componentPublicInstance'
import { Directive } from './directives'

export type PublicProps = VNodeProps &
AllowedComponentProps &
Expand All @@ -40,6 +44,9 @@ export type DefineComponent<
Extends extends ComponentOptionsMixin = ComponentOptionsMixin,
E extends EmitsOptions = Record<string, any>,
EE extends string = string,
LC extends Record<string, Component> = {},
Directives extends Record<string, Directive> = {},
Exposed extends string = string,
PP = PublicProps,
Props = Readonly<ExtractPropTypes<PropsOrPropOptions>>,
Defaults = ExtractDefaultPropTypes<PropsOrPropOptions>
Expand All @@ -55,7 +62,10 @@ export type DefineComponent<
E,
PP & Props,
Defaults,
true
true,
LC & GlobalComponents,
Directives & GlobalDirectives,
Exposed
> &
Props
> &
Expand All @@ -69,6 +79,9 @@ export type DefineComponent<
Extends,
E,
EE,
LC & GlobalComponents,
Directives & GlobalDirectives,
Exposed,
Defaults
> &
PP
Expand Down Expand Up @@ -99,7 +112,10 @@ export function defineComponent<
Mixin extends ComponentOptionsMixin = ComponentOptionsMixin,
Extends extends ComponentOptionsMixin = ComponentOptionsMixin,
E extends EmitsOptions = EmitsOptions,
EE extends string = string
EE extends string = string,
LC extends Record<string, Component> = {},
Directives extends Record<string, Directive> = {},
Exposed extends string = string
>(
options: ComponentOptionsWithoutProps<
Props,
Expand All @@ -110,9 +126,25 @@ export function defineComponent<
Mixin,
Extends,
E,
EE
EE,
LC,
Directives,
Exposed
>
): DefineComponent<Props, RawBindings, D, C, M, Mixin, Extends, E, EE>
): DefineComponent<
Props,
RawBindings,
D,
C,
M,
Mixin,
Extends,
E,
EE,
LC,
Directives,
Exposed
>

// overload 3: object format with array props declaration
// props inferred as { [key in PropNames]?: any }
Expand All @@ -126,7 +158,10 @@ export function defineComponent<
Mixin extends ComponentOptionsMixin = ComponentOptionsMixin,
Extends extends ComponentOptionsMixin = ComponentOptionsMixin,
E extends EmitsOptions = Record<string, any>,
EE extends string = string
EE extends string = string,
LC extends Record<string, Component> = {},
Directives extends Record<string, Directive> = {},
Exposed extends string = string
>(
options: ComponentOptionsWithArrayProps<
PropNames,
Expand All @@ -137,7 +172,10 @@ export function defineComponent<
Mixin,
Extends,
E,
EE
EE,
LC,
Directives,
Exposed
>
): DefineComponent<
Readonly<{ [key in PropNames]?: any }>,
Expand All @@ -148,7 +186,10 @@ export function defineComponent<
Mixin,
Extends,
E,
EE
EE,
LC,
Directives,
Exposed
>

// overload 4: object format with object props declaration
Expand All @@ -164,7 +205,10 @@ export function defineComponent<
Mixin extends ComponentOptionsMixin = ComponentOptionsMixin,
Extends extends ComponentOptionsMixin = ComponentOptionsMixin,
E extends EmitsOptions = Record<string, any>,
EE extends string = string
EE extends string = string,
LC extends Record<string, Component> = {},
Directives extends Record<string, Directive> = {},
Exposed extends string = string
>(
options: ComponentOptionsWithObjectProps<
PropsOptions,
Expand All @@ -175,9 +219,25 @@ export function defineComponent<
Mixin,
Extends,
E,
EE
EE,
LC,
Directives,
Exposed
>
): DefineComponent<PropsOptions, RawBindings, D, C, M, Mixin, Extends, E, EE>
): DefineComponent<
PropsOptions,
RawBindings,
D,
C,
M,
Mixin,
Extends,
E,
EE,
LC,
Directives,
Exposed
>

// implementation, close to no-op
export function defineComponent(options: unknown) {
Expand Down
34 changes: 34 additions & 0 deletions packages/runtime-core/src/component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -62,6 +62,40 @@ export type Data = Record<string, unknown>
*/
export interface ComponentCustomProps {}

/**
* For globally defined Directives
* Here is an example of adding a directive `VTooltip` as global directive:
*
* @example
* ```ts
* import VTooltip from 'v-tooltip'
*
* declare module '@vue/runtime-core' {
* interface GlobalDirectives {
* VTooltip
* }
* }
* ```
*/
export interface GlobalDirectives extends Record<string, Directive> {}

/**
* For globally defined Components
* Here is an example of adding a component `RouterView` as global component:
*
* @example
* ```ts
* import { RouterView } from 'vue-router'
*
* declare module '@vue/runtime-core' {
* interface GlobalComponents {
* RouterView
* }
* }
* ```
*/
export interface GlobalComponents extends Record<string, Component> {}
pikax marked this conversation as resolved.
Show resolved Hide resolved

/**
* Default allowed non-declared props on component in TSX
*/
Expand Down
85 changes: 74 additions & 11 deletions packages/runtime-core/src/componentOptions.ts
Original file line number Diff line number Diff line change
Expand Up @@ -104,6 +104,9 @@ export interface ComponentOptionsBase<
Extends extends ComponentOptionsMixin,
E extends EmitsOptions,
EE extends string = string,
LC extends Record<string, Component> = {},
Directives extends Record<string, Directive> = {},
Exposed extends string = string,
Defaults = {}
>
extends LegacyOptions<Props, D, C, M, Mixin, Extends>,
Expand All @@ -124,12 +127,11 @@ export interface ComponentOptionsBase<
// Luckily `render()` doesn't need any arguments nor does it care about return
// type.
render?: Function
components?: Record<string, Component>
directives?: Record<string, Directive>
components?: LC
directives?: Directives
inheritAttrs?: boolean
emits?: (E | EE[]) & ThisType<void>
// TODO infer public instance type based on exposed keys
expose?: string[]
expose?: Exposed[]
serverPrefetch?(): Promise<any>

// Internal ------------------------------------------------------------------
Expand Down Expand Up @@ -194,7 +196,10 @@ export type ComponentOptionsWithoutProps<
Mixin extends ComponentOptionsMixin = ComponentOptionsMixin,
Extends extends ComponentOptionsMixin = ComponentOptionsMixin,
E extends EmitsOptions = EmitsOptions,
EE extends string = string
EE extends string = string,
LC extends Record<string, Component> = {},
Directives extends Record<string, Directive> = {},
Exposed extends string = string
> = ComponentOptionsBase<
Props,
RawBindings,
Expand All @@ -205,11 +210,29 @@ export type ComponentOptionsWithoutProps<
Extends,
E,
EE,
LC,
Directives,
Exposed,
{}
> & {
props?: undefined
} & ThisType<
CreateComponentPublicInstance<{}, RawBindings, D, C, M, Mixin, Extends, E>
CreateComponentPublicInstance<
{},
RawBindings,
D,
C,
M,
Mixin,
Extends,
E,
Props,
{},
false,
LC,
Directives,
Exposed
>
>

export type ComponentOptionsWithArrayProps<
Expand All @@ -222,6 +245,9 @@ export type ComponentOptionsWithArrayProps<
Extends extends ComponentOptionsMixin = ComponentOptionsMixin,
E extends EmitsOptions = EmitsOptions,
EE extends string = string,
LC extends Record<string, Component> = {},
Directives extends Record<string, Directive> = {},
Exposed extends string = string,
Props = Readonly<{ [key in PropNames]?: any }>
> = ComponentOptionsBase<
Props,
Expand All @@ -233,6 +259,9 @@ export type ComponentOptionsWithArrayProps<
Extends,
E,
EE,
LC,
Directives,
Exposed,
{}
> & {
props: PropNames[]
Expand All @@ -245,7 +274,13 @@ export type ComponentOptionsWithArrayProps<
M,
Mixin,
Extends,
E
E,
Props,
{},
false,
LC,
Directives,
Exposed
>
>

Expand All @@ -259,6 +294,9 @@ export type ComponentOptionsWithObjectProps<
Extends extends ComponentOptionsMixin = ComponentOptionsMixin,
E extends EmitsOptions = EmitsOptions,
EE extends string = string,
LC extends Record<string, Component> = {},
Directives extends Record<string, Directive> = {},
Exposed extends string = string,
Props = Readonly<ExtractPropTypes<PropsOptions>>,
Defaults = ExtractDefaultPropTypes<PropsOptions>
> = ComponentOptionsBase<
Expand All @@ -271,6 +309,9 @@ export type ComponentOptionsWithObjectProps<
Extends,
E,
EE,
LC,
Directives,
Exposed,
Defaults
> & {
props: PropsOptions & ThisType<void>
Expand All @@ -286,7 +327,9 @@ export type ComponentOptionsWithObjectProps<
E,
Props,
Defaults,
false
false,
LC,
Directives
>
>

Expand All @@ -298,8 +341,24 @@ export type ComponentOptions<
M extends MethodOptions = any,
Mixin extends ComponentOptionsMixin = any,
Extends extends ComponentOptionsMixin = any,
E extends EmitsOptions = any
> = ComponentOptionsBase<Props, RawBindings, D, C, M, Mixin, Extends, E> &
E extends EmitsOptions = any,
LC extends Record<string, Component> = {},
Directives extends Record<string, Directive> = {},
Exposed extends string = string
> = ComponentOptionsBase<
Props,
RawBindings,
D,
C,
M,
Mixin,
Extends,
E,
string,
LC,
Directives,
Exposed
> &
ThisType<
CreateComponentPublicInstance<
{},
Expand All @@ -310,7 +369,11 @@ export type ComponentOptions<
Mixin,
Extends,
E,
Readonly<Props>
Readonly<Props>,
{},
false,
LC,
Directives
>
>

Expand Down