import { ComponentInternalInstance, Data, getExposeProxy, isStatefulComponent } from './component' import { nextTick, queueJob } from './scheduler' import { instanceWatch, WatchOptions, WatchStopHandle } from './apiWatch' import { EMPTY_OBJ, hasOwn, isGloballyWhitelisted, NOOP, extend, isString, isFunction } from '@vue/shared' import { ReactiveEffect, toRaw, shallowReadonly, track, TrackOpTypes, ShallowUnwrapRef, UnwrapNestedRefs } from '@vue/reactivity' import { ExtractComputedReturns, ComponentOptionsBase, ComputedOptions, MethodOptions, ComponentOptionsMixin, OptionTypesType, OptionTypesKeys, resolveMergedOptions, shouldCacheAccess, MergedComponentOptionsOverride } from './componentOptions' import { EmitsOptions, EmitFn } from './componentEmits' import { Slots } from './componentSlots' import { markAttrsAccessed } from './componentRenderUtils' import { currentRenderingInstance } from './componentRenderContext' import { warn } from './warning' import { UnionToIntersection } from './helpers/typeUtils' import { installCompatInstanceProperties } from './compat/instance' /** * Custom properties added to component instances in any way and can be accessed through `this` * * @example * Here is an example of adding a property `$router` to every component instance: * ```ts * import { createApp } from 'vue' * import { Router, createRouter } from 'vue-router' * * declare module '@vue/runtime-core' { * interface ComponentCustomProperties { * $router: Router * } * } * * // effectively adding the router to every component instance * const app = createApp({}) * const router = createRouter() * app.config.globalProperties.$router = router * * const vm = app.mount('#app') * // we can access the router from the instance * vm.$router.push('/') * ``` */ export interface ComponentCustomProperties {} type IsDefaultMixinComponent = T extends ComponentOptionsMixin ? ComponentOptionsMixin extends T ? true : false : false type MixinToOptionTypes = T extends ComponentOptionsBase< infer P, infer B, infer D, infer C, infer M, infer Mixin, infer Extends, any, any, infer Defaults > ? OptionTypesType

& IntersectionMixin & IntersectionMixin : never // ExtractMixin(map type) is used to resolve circularly references type ExtractMixin = { Mixin: MixinToOptionTypes }[T extends ComponentOptionsMixin ? 'Mixin' : never] type IntersectionMixin = IsDefaultMixinComponent extends true ? OptionTypesType<{}, {}, {}, {}, {}> : UnionToIntersection> type UnwrapMixinsType< T, Type extends OptionTypesKeys > = T extends OptionTypesType ? T[Type] : never type EnsureNonVoid = T extends void ? {} : T export type ComponentPublicInstanceConstructor< T extends ComponentPublicInstance< Props, RawBindings, D, C, M > = ComponentPublicInstance, Props = any, RawBindings = any, D = any, C extends ComputedOptions = ComputedOptions, M extends MethodOptions = MethodOptions > = { __isFragment?: never __isTeleport?: never __isSuspense?: never new (...args: any[]): T } export type CreateComponentPublicInstance< P = {}, B = {}, D = {}, C extends ComputedOptions = {}, M extends MethodOptions = {}, Mixin extends ComponentOptionsMixin = ComponentOptionsMixin, Extends extends ComponentOptionsMixin = ComponentOptionsMixin, E extends EmitsOptions = {}, PublicProps = P, Defaults = {}, MakeDefaultsOptional extends boolean = false, PublicMixin = IntersectionMixin & IntersectionMixin, PublicP = UnwrapMixinsType & EnsureNonVoid

, PublicB = UnwrapMixinsType & EnsureNonVoid, PublicD = UnwrapMixinsType & EnsureNonVoid, PublicC extends ComputedOptions = UnwrapMixinsType & EnsureNonVoid, PublicM extends MethodOptions = UnwrapMixinsType & EnsureNonVoid, PublicDefaults = UnwrapMixinsType & EnsureNonVoid > = ComponentPublicInstance< PublicP, PublicB, PublicD, PublicC, PublicM, E, PublicProps, PublicDefaults, MakeDefaultsOptional, ComponentOptionsBase > // public properties exposed on the proxy, which is used as the render context // in templates (as `this` in the render option) export type ComponentPublicInstance< P = {}, // props type extracted from props option B = {}, // raw bindings returned from setup() D = {}, // return from data() C extends ComputedOptions = {}, M extends MethodOptions = {}, E extends EmitsOptions = {}, PublicProps = P, Defaults = {}, MakeDefaultsOptional extends boolean = false, Options = ComponentOptionsBase > = { $: ComponentInternalInstance $data: D $props: MakeDefaultsOptional extends true ? Partial & Omit

: P & PublicProps $attrs: Data $refs: Data $slots: Slots $root: ComponentPublicInstance | null $parent: ComponentPublicInstance | null $emit: EmitFn $el: any $options: Options & MergedComponentOptionsOverride $forceUpdate: ReactiveEffect $nextTick: typeof nextTick $watch( source: string | Function, cb: Function, options?: WatchOptions ): WatchStopHandle } & P & ShallowUnwrapRef & UnwrapNestedRefs & ExtractComputedReturns & M & ComponentCustomProperties export type PublicPropertiesMap = Record< string, (i: ComponentInternalInstance) => any > /** * #2437 In Vue 3, functional components do not have a public instance proxy but * they exist in the internal parent chain. For code that relies on traversing * public $parent chains, skip functional ones and go to the parent instead. */ const getPublicInstance = ( i: ComponentInternalInstance | null ): ComponentPublicInstance | ComponentInternalInstance['exposed'] | null => { if (!i) return null if (isStatefulComponent(i)) return getExposeProxy(i) || i.proxy return getPublicInstance(i.parent) } export const publicPropertiesMap: PublicPropertiesMap = /*#__PURE__*/ extend( Object.create(null), { $: i => i, $el: i => i.vnode.el, $data: i => i.data, $props: i => (__DEV__ ? shallowReadonly(i.props) : i.props), $attrs: i => (__DEV__ ? shallowReadonly(i.attrs) : i.attrs), $slots: i => (__DEV__ ? shallowReadonly(i.slots) : i.slots), $refs: i => (__DEV__ ? shallowReadonly(i.refs) : i.refs), $parent: i => getPublicInstance(i.parent), $root: i => getPublicInstance(i.root), $emit: i => i.emit, $options: i => (__FEATURE_OPTIONS_API__ ? resolveMergedOptions(i) : i.type), $forceUpdate: i => () => queueJob(i.update), $nextTick: i => nextTick.bind(i.proxy!), $watch: i => (__FEATURE_OPTIONS_API__ ? instanceWatch.bind(i) : NOOP) } as PublicPropertiesMap ) if (__COMPAT__) { installCompatInstanceProperties(publicPropertiesMap) } const enum AccessTypes { SETUP, DATA, PROPS, CONTEXT, OTHER } export interface ComponentRenderContext { [key: string]: any _: ComponentInternalInstance } export const PublicInstanceProxyHandlers: ProxyHandler = { get({ _: instance }: ComponentRenderContext, key: string) { const { ctx, setupState, data, props, accessCache, type, appContext } = instance // for internal formatters to know that this is a Vue instance if (__DEV__ && key === '__isVue') { return true } // prioritize