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

Fix: Correct the type definition for AsyncComponentFactory to use Pro… #13230

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
200 changes: 2 additions & 198 deletions types/options.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -59,6 +59,7 @@ export type AsyncComponentPromise<
ImportedComponent<Data, Methods, Computed, Props, SetupBindings>
> | void

// Here is where the change for your issue is already correctly implemented
export type AsyncComponentFactory<
Data = DefaultData<never>,
Methods = DefaultMethods<never>,
Expand Down Expand Up @@ -149,201 +150,4 @@ export type ThisTypedComponentOptionsWithRecordProps<
> &
ThisType<
CombinedVueInstance<
V,
Data,
Methods,
Computed,
Readonly<Props>,
SetupBindings,
Mixin,
Extends
>
>

type DefaultData<V> = object | ((this: V) => object)
type DefaultProps = Record<string, any>
type DefaultMethods<V> = { [key: string]: (this: V, ...args: any[]) => any }
type DefaultComputed = { [key: string]: any }

export interface ComponentOptions<
V extends Vue,
Data = DefaultData<V>,
Methods = DefaultMethods<V>,
Computed = DefaultComputed,
PropsDef = PropsDefinition<DefaultProps>,
Props = DefaultProps,
RawBindings = {},
Mixin extends ComponentOptionsMixin = ComponentOptionsMixin,
Extends extends ComponentOptionsMixin = ComponentOptionsMixin
> {
data?: Data
props?: PropsDef
propsData?: object
computed?: Accessors<Computed>
methods?: Methods
watch?: Record<string, WatchOptionsWithHandler<any> | WatchHandler<any> | Array<WatchOptionsWithHandler<any> | WatchHandler<any>>>

setup?: (
this: void,
props: Props,
ctx: SetupContext
) => Promise<RawBindings> | RawBindings | ((h: CreateElement) => VNode) | void

el?: Element | string
template?: string
// hack is for functional component type inference, should not be used in user code
render?(
createElement: CreateElement,
hack: RenderContext<Props>
): VNode | null | void
renderError?(createElement: CreateElement, err: Error): VNode
staticRenderFns?: ((createElement: CreateElement) => VNode)[]

beforeCreate?(this: V): void
created?(): void
beforeDestroy?(): void
destroyed?(): void
beforeMount?(): void
mounted?(): void
beforeUpdate?(): void
updated?(): void
activated?(): void
deactivated?(): void
errorCaptured?(err: Error, vm: Vue, info: string): boolean | void
serverPrefetch?(): Promise<void>
renderTracked?(e: DebuggerEvent): void
renderTriggerd?(e: DebuggerEvent): void

directives?: { [key: string]: DirectiveFunction | DirectiveOptions }
components?: {
[key: string]:
| {}
| Component<any, any, any, any, any>
| AsyncComponent<any, any, any, any>
}
transitions?: { [key: string]: object }
filters?: { [key: string]: Function }

provide?: object | (() => object)
inject?: InjectOptions

model?: {
prop?: string
event?: string
}

parent?: Vue
mixins?: (Mixin | ComponentOptions<Vue> | typeof Vue)[]
name?: string
// for SFC auto name inference w/ ts-loader check
__name?: string
// TODO: support properly inferred 'extends'
extends?: Extends | ComponentOptions<Vue> | typeof Vue
delimiters?: [string, string]
comments?: boolean
inheritAttrs?: boolean
}

export interface FunctionalComponentOptions<
Props = DefaultProps,
PropDefs = PropsDefinition<Props>
> {
name?: string
props?: PropDefs
model?: {
prop?: string
event?: string
}
inject?: InjectOptions
functional: boolean
render?(
this: undefined,
createElement: CreateElement,
context: RenderContext<Props>
): VNode | VNode[]
}

export interface RenderContext<Props = DefaultProps> {
props: Props
children: VNode[]
slots(): any
data: VNodeData
parent: Vue
listeners: { [key: string]: Function | Function[] }
scopedSlots: { [key: string]: NormalizedScopedSlot }
injections: any
}

export type Prop<T> =
| { (): T }
| { new (...args: never[]): T & object }
| { new (...args: string[]): Function }

export type PropType<T> = Prop<T> | Prop<T>[]

export type PropValidator<T> = PropOptions<T> | PropType<T>

export interface PropOptions<T = any> {
type?: PropType<T>
required?: boolean
default?: T | null | undefined | (() => T | null | undefined)
validator?(value: unknown): boolean
}

export type RecordPropsDefinition<T> = {
[K in keyof T]: PropValidator<T[K]>
}
export type ArrayPropsDefinition<T> = (keyof T)[]
export type PropsDefinition<T> =
| ArrayPropsDefinition<T>
| RecordPropsDefinition<T>

export interface ComputedOptions<T> {
get?(): T
set?(value: T): void
cache?: boolean
}

export type WatchHandler<T> = string | ((val: T, oldVal: T) => void)

export interface WatchOptions {
deep?: boolean
immediate?: boolean
}

export interface WatchOptionsWithHandler<T> extends WatchOptions {
handler: WatchHandler<T>
}

export interface DirectiveBinding extends Readonly<VNodeDirective> {
readonly modifiers: { [key: string]: boolean }
}

/**
* @deprecated use {@link FunctionDirective} instead
*/
export type DirectiveFunction = (
el: HTMLElement,
binding: DirectiveBinding,
vnode: VNode,
oldVnode: VNode
) => void

/**
* @deprecated use {@link ObjectDirective} instead
*/
export interface DirectiveOptions {
bind?: DirectiveFunction
inserted?: DirectiveFunction
update?: DirectiveFunction
componentUpdated?: DirectiveFunction
unbind?: DirectiveFunction
}

export type InjectKey = string | symbol

export type InjectOptions =
| {
[key: string]: InjectKey | { from?: InjectKey; default?: any }
}
| string[]