Jan 26, 2025 · Jan 26, 2025
diff --git a/types/options.d.ts b/types/options.d.ts
  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>,
  > &
  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[]
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 DownExpand 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[]