@vue/compat 3.6.0-beta.8 → 3.6.0-rc.1

package/README.md

@@ -18,7 +18,7 @@ While we've tried hard to make the migration build mimic Vue 2 behavior as much
 
 - Internet Explorer 11 support: [Vue 3 has officially dropped the plan for IE11 support](https://github.com/vuejs/rfcs/blob/master/active-rfcs/0038-vue3-ie11-support.md). If you still need to support IE11 or below, you will have to stay on Vue 2.
 
-- Server-side rendering: the migration build can be used for SSR, but migrating a custom SSR setup is much more involved. The general idea is replacing `vue-server-renderer` with [`@vue/server-renderer`](https://github.com/vuejs/core/tree/main/packages/server-renderer). Vue 3 no longer provides a bundle renderer and it is recommended to use Vue 3 SSR with [Vite](https://vitejs.dev/guide/ssr.html). If you are using [Nuxt.js](https://nuxtjs.org/), it is probably better to wait for Nuxt 3.
+- Server-side rendering: the migration build can be used for SSR, but migrating a custom SSR setup is much more involved. The general idea is replacing `vue-server-renderer` with [`@vue/server-renderer`](https://github.com/vuejs/core/tree/main/packages/server-renderer). Vue 3 no longer provides a bundle renderer and it is recommended to use Vue 3 SSR with [Vite](https://vite.dev/guide/ssr). If you are using [Nuxt.js](https://nuxtjs.org/), it is probably better to wait for Nuxt 3.
 
 ### Expectations
 
@@ -43,7 +43,7 @@ The following workflow walks through the steps of migrating an actual Vue 2 app
 1. Upgrade tooling if applicable.
    - If using custom webpack setup: Upgrade `vue-loader` to `^16.0.0`.
    - If using `vue-cli`: upgrade to the latest `@vue/cli-service` with `vue upgrade`
-   - (Alternative) migrate to [Vite](https://vitejs.dev/) + [vite-plugin-vue2](https://github.com/underfin/vite-plugin-vue2). [[Example commit](https://github.com/vuejs/vue-hackernews-2.0/commit/565b948919eb58f22a32afca7e321b490cb3b074)]
+   - (Alternative) migrate to [Vite](https://vite.dev/) + [vite-plugin-vue2](https://github.com/underfin/vite-plugin-vue2). [[Example commit](https://github.com/vuejs/vue-hackernews-2.0/commit/565b948919eb58f22a32afca7e321b490cb3b074)]
 
 2. In `package.json`, update `vue` to 3.1, install `@vue/compat` of the same version, and replace `vue-template-compiler` (if present) with `@vue/compiler-sfc`:
 

package/dist/vue-compat.d.ts

@@ -227,7 +227,10 @@ type Reactive<T> = UnwrapNestedRefs<T> & (T extends readonly any[] ? ReactiveMar
 * @see {@link https://vuejs.org/api/reactivity-core.html#reactive}
 */
 declare function reactive<T extends object>(target: T): Reactive<T>;
-declare const ShallowReactiveMarker: unique symbol;
+declare class ShallowReactiveBrandClass {
+  private __shallowReactiveBrand?;
+}
+type ShallowReactiveBrand = ShallowReactiveBrandClass;
 type Primitive = string | number | boolean | bigint | symbol | undefined | null;
 type Builtin = Primitive | Function | Date | Error | RegExp;
 //#endregion
@@ -262,14 +265,12 @@ type ShallowRef<T = any, S = T> = Ref<T, S> & {
 * ```
 */
 interface RefUnwrapBailTypes {}
-type ShallowUnwrapRef<T> = { [K in keyof T]: DistributeRef<T[K]> };
+type ShallowUnwrapRef<T> = T extends ShallowReactiveBrand ? T : { [K in keyof T]: DistributeRef<T[K]> };
 type DistributeRef<T> = T extends Ref<infer V, unknown> ? V : T;
 type UnwrapRef<T> = T extends ShallowRef<infer V, unknown> ? V : T extends Ref<infer V, unknown> ? UnwrapRefSimple<V> : UnwrapRefSimple<T>;
 type UnwrapRefSimple<T> = T extends Builtin | Ref | RefUnwrapBailTypes[keyof RefUnwrapBailTypes] | {
   [RawSymbol]?: true;
-} ? T : T extends Map<infer K, infer V> ? Map<K, UnwrapRefSimple<V>> & UnwrapRef<Omit<T, keyof Map<any, any>>> : T extends WeakMap<infer K, infer V> ? WeakMap<K, UnwrapRefSimple<V>> & UnwrapRef<Omit<T, keyof WeakMap<any, any>>> : T extends Set<infer V> ? Set<UnwrapRefSimple<V>> & UnwrapRef<Omit<T, keyof Set<any>>> : T extends WeakSet<infer V> ? WeakSet<UnwrapRefSimple<V>> & UnwrapRef<Omit<T, keyof WeakSet<any>>> : T extends ReadonlyArray<any> ? { [K in keyof T]: UnwrapRefSimple<T[K]> } : T extends object & {
-  [ShallowReactiveMarker]?: never;
-} ? { [P in keyof T]: P extends symbol ? T[P] : UnwrapRef<T[P]> } : T;
+} ? T : T extends ShallowReactiveBrand ? T : T extends Map<infer K, infer V> ? Map<K, UnwrapRefSimple<V>> & UnwrapRef<Omit<T, keyof Map<any, any>>> : T extends WeakMap<infer K, infer V> ? WeakMap<K, UnwrapRefSimple<V>> & UnwrapRef<Omit<T, keyof WeakMap<any, any>>> : T extends Set<infer V> ? Set<UnwrapRefSimple<V>> & UnwrapRef<Omit<T, keyof Set<any>>> : T extends WeakSet<infer V> ? WeakSet<UnwrapRefSimple<V>> & UnwrapRef<Omit<T, keyof WeakSet<any>>> : T extends ReadonlyArray<any> ? { [K in keyof T]: UnwrapRefSimple<T[K]> } : T extends object ? { [P in keyof T]: P extends symbol ? T[P] : UnwrapRef<T[P]> } : T;
 //#endregion
 //#region packages/reactivity/src/watch.d.ts
 type WatchCallback<V = any, OV = any> = (value: V, oldValue: OV, onCleanup: OnCleanup) => any;
@@ -435,9 +436,9 @@ type NormalizedPropsOptions = [NormalizedProps, string[]] | [];
 type ComponentTypeEmits = ((...args: any[]) => any) | Record<string, any>;
 //#endregion
 //#region packages/runtime-core/src/componentEmits.d.ts
-type ObjectEmitsOptions = Record<string, ((...args: any[]) => any) | null>;
+type ObjectEmitsOptions = Record<string, ((...args: any[]) => any) | null | any[]>;
 type EmitsOptions = ObjectEmitsOptions | string[];
-type EmitsToProps<T extends EmitsOptions | ComponentTypeEmits> = T extends string[] ? { [K in `on${Capitalize<T[number]>}`]?: (...args: any[]) => any } : T extends ObjectEmitsOptions ? { [K in string & keyof T as `on${Capitalize<K>}`]?: (...args: T[K] extends ((...args: infer P) => any) ? P : T[K] extends null ? any[] : never) => any } : {};
+type EmitsToProps<T extends EmitsOptions | ComponentTypeEmits> = T extends string[] ? { [K in `on${Capitalize<T[number]>}`]?: (...args: any[]) => any } : T extends ObjectEmitsOptions ? { [K in string & keyof T as `on${Capitalize<K>}`]?: (...args: T[K] extends ((...args: infer P) => any) ? P : T[K] extends null ? any[] : T[K] extends any[] ? T[K] : never) => any } : {};
 type ShortEmitsToObject<E> = E extends Record<string, any[]> ? { [K in keyof E]: (...args: E[K]) => any } : E;
 type EmitFn<Options = ObjectEmitsOptions, Event extends keyof Options = keyof Options> = Options extends Array<infer V> ? (event: V, ...args: any[]) => void : {} extends Options ? (event: string, ...args: any[]) => void : UnionToIntersection<{ [key in Event]: Options[key] extends ((...args: infer Args) => any) ? (event: key, ...args: Args) => void : Options[key] extends any[] ? (event: key, ...args: Options[key]) => void : (event: key, ...args: any[]) => void }[Event]>;
 //#endregion
@@ -521,9 +522,9 @@ type ComponentPublicInstanceConstructor<T extends ComponentPublicInstance<Props,
 * inference everywhere internally, but it has to be a new type to avoid
 * breaking types that relies on previous arguments order (#10842)
 */
-type CreateComponentPublicInstanceWithMixins<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, I extends ComponentInjectOptions = {}, S extends SlotsType = {}, LC extends Record<string, Component> = {}, Directives extends Record<string, Directive> = {}, Exposed extends string = string, TypeRefs extends Data = {}, TypeEl extends Element = any, Provide extends ComponentProvideOptions = ComponentProvideOptions, PublicMixin = IntersectionMixin<Mixin> & IntersectionMixin<Extends>, PublicP = UnwrapMixinsType<PublicMixin, "P"> & EnsureNonVoid<P>, PublicB = UnwrapMixinsType<PublicMixin, "B"> & EnsureNonVoid<B>, PublicD = UnwrapMixinsType<PublicMixin, "D"> & EnsureNonVoid<D>, PublicC extends ComputedOptions = UnwrapMixinsType<PublicMixin, "C"> & EnsureNonVoid<C>, PublicM extends MethodOptions = UnwrapMixinsType<PublicMixin, "M"> & EnsureNonVoid<M>, PublicDefaults = UnwrapMixinsType<PublicMixin, "Defaults"> & EnsureNonVoid<Defaults>> = ComponentPublicInstance<PublicP, PublicB, PublicD, PublicC, PublicM, E, PublicProps, PublicDefaults, MakeDefaultsOptional, ComponentOptionsBase<P, B, D, C, M, Mixin, Extends, E, string, Defaults, {}, string, S, LC, Directives, Exposed, Provide>, I, S, Exposed, TypeRefs, TypeEl>;
+type CreateComponentPublicInstanceWithMixins<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, I extends ComponentInjectOptions = {}, S extends SlotsType = {}, LC extends Record<string, Component> = {}, Directives extends Record<string, Directive> = {}, Exposed extends string = string, TypeRefs extends Data = {}, TypeEl = any, Provide extends ComponentProvideOptions = ComponentProvideOptions, PublicMixin = IntersectionMixin<Mixin> & IntersectionMixin<Extends>, PublicP = UnwrapMixinsType<PublicMixin, "P"> & EnsureNonVoid<P>, PublicB = UnwrapMixinsType<PublicMixin, "B"> & EnsureNonVoid<B>, PublicD = UnwrapMixinsType<PublicMixin, "D"> & EnsureNonVoid<D>, PublicC extends ComputedOptions = UnwrapMixinsType<PublicMixin, "C"> & EnsureNonVoid<C>, PublicM extends MethodOptions = UnwrapMixinsType<PublicMixin, "M"> & EnsureNonVoid<M>, PublicDefaults = UnwrapMixinsType<PublicMixin, "Defaults"> & EnsureNonVoid<Defaults>> = ComponentPublicInstance<PublicP, PublicB, PublicD, PublicC, PublicM, E, PublicProps, PublicDefaults, MakeDefaultsOptional, ComponentOptionsBase<P, B, D, C, M, Mixin, Extends, E, string, Defaults, {}, string, S, LC, Directives, Exposed, Provide>, I, S, Exposed, TypeRefs, TypeEl>;
 type ExposedKeys<T, Exposed extends string & keyof T> = "" extends Exposed ? T : Pick<T, Exposed>;
-type ComponentPublicInstance<P = {}, B = {}, D = {}, C extends ComputedOptions = {}, M extends MethodOptions = {}, E extends EmitsOptions = {}, PublicProps = {}, Defaults = {}, MakeDefaultsOptional extends boolean = false, Options = ComponentOptionsBase<any, any, any, any, any, any, any, any, any>, I extends ComponentInjectOptions = {}, S extends SlotsType = {}, Exposed extends string = "", TypeRefs extends Data = {}, TypeEl extends Element = any> = {
+type ComponentPublicInstance<P = {}, B = {}, D = {}, C extends ComputedOptions = {}, M extends MethodOptions = {}, E extends EmitsOptions = {}, PublicProps = {}, Defaults = {}, MakeDefaultsOptional extends boolean = false, Options = ComponentOptionsBase<any, any, any, any, any, any, any, any, any>, I extends ComponentInjectOptions = {}, S extends SlotsType = {}, Exposed extends string = "", TypeRefs extends Data = {}, TypeEl = any> = {
   $: ComponentInternalInstance;
   $data: D;
   $props: MakeDefaultsOptional extends true ? Partial<Defaults> & Omit<Prettify<P> & PublicProps, keyof Defaults> : Prettify<P> & PublicProps;
@@ -564,6 +565,10 @@ interface SuspenseProps {
   onResolve?: () => void;
   onPending?: () => void;
   onFallback?: () => void;
+  /**
+  * Switch to fallback content if it takes longer than `timeout` milliseconds to render the new default content.
+  * A `timeout` value of `0` will cause the fallback content to be displayed immediately when default content is replaced.
+  */
   timeout?: string | number;
   /**
   * Allow suspense to be captured by parent suspense
@@ -597,6 +602,7 @@ interface SuspenseBoundary {
   container: RendererElement;
   hiddenContainer: RendererElement;
   activeBranch: VNode | null;
+  isFallbackMountPending: boolean;
   pendingBranch: VNode | null;
   deps: number;
   pendingId: number;
@@ -923,7 +929,7 @@ type InjectionKey<T> = symbol & InjectionConstraint<T>;
 //#region packages/runtime-core/src/apiDefineComponent.d.ts
 type PublicProps = VNodeProps & AllowedComponentProps & ComponentCustomProps;
 type ResolveProps<PropsOrPropOptions, E extends EmitsOptions> = Readonly<PropsOrPropOptions extends ComponentPropsOptions ? ExtractPropTypes<PropsOrPropOptions> : PropsOrPropOptions> & ({} extends E ? {} : EmitsToProps<E>);
-type DefineComponent<PropsOrPropOptions = {}, RawBindings = {}, D = {}, C extends ComputedOptions = ComputedOptions, M extends MethodOptions = MethodOptions, Mixin extends ComponentOptionsMixin = ComponentOptionsMixin, Extends extends ComponentOptionsMixin = ComponentOptionsMixin, E extends EmitsOptions = {}, EE extends string = string, PP = PublicProps, Props = ResolveProps<PropsOrPropOptions, E>, Defaults = ExtractDefaultPropTypes<PropsOrPropOptions>, S extends SlotsType = {}, LC extends Record<string, Component> = {}, Directives extends Record<string, Directive> = {}, Exposed extends string = string, Provide extends ComponentProvideOptions = ComponentProvideOptions, MakeDefaultsOptional extends boolean = true, TypeRefs extends Record<string, unknown> = {}, TypeEl extends Element = any> = ComponentPublicInstanceConstructor<CreateComponentPublicInstanceWithMixins<Props, RawBindings, D, C, M, Mixin, Extends, E, PP, Defaults, MakeDefaultsOptional, {}, S, LC & GlobalComponents, Directives & GlobalDirectives, Exposed, TypeRefs, TypeEl>> & ComponentOptionsBase<Props, RawBindings, D, C, M, Mixin, Extends, E, EE, Defaults, {}, string, S, LC & GlobalComponents, Directives & GlobalDirectives, Exposed, Provide> & PP;
+type DefineComponent<PropsOrPropOptions = {}, RawBindings = {}, D = {}, C extends ComputedOptions = ComputedOptions, M extends MethodOptions = MethodOptions, Mixin extends ComponentOptionsMixin = ComponentOptionsMixin, Extends extends ComponentOptionsMixin = ComponentOptionsMixin, E extends EmitsOptions = {}, EE extends string = string, PP = PublicProps, Props = ResolveProps<PropsOrPropOptions, E>, Defaults = ExtractDefaultPropTypes<PropsOrPropOptions>, S extends SlotsType = {}, LC extends Record<string, Component> = {}, Directives extends Record<string, Directive> = {}, Exposed extends string = string, Provide extends ComponentProvideOptions = ComponentProvideOptions, MakeDefaultsOptional extends boolean = true, TypeRefs extends Record<string, unknown> = {}, TypeEl = any> = ComponentPublicInstanceConstructor<CreateComponentPublicInstanceWithMixins<Props, RawBindings, D, C, M, Mixin, Extends, E, PP, Defaults, MakeDefaultsOptional, {}, S, LC & GlobalComponents, Directives & GlobalDirectives, Exposed, TypeRefs, TypeEl>> & ComponentOptionsBase<Props, RawBindings, D, C, M, Mixin, Extends, E, EE, Defaults, {}, string, S, LC & GlobalComponents, Directives & GlobalDirectives, Exposed, Provide> & PP;
 //#endregion
 //#region packages/runtime-core/src/apiCreateApp.d.ts
 interface App<HostElement = any> {
@@ -1009,19 +1015,19 @@ interface AppConfig extends GenericAppConfig {
 * The vapor in vdom implementation is in runtime-vapor/src/vdomInterop.ts
 */
 interface VaporInteropInterface {
-  mount(vnode: VNode, container: any, anchor: any, parentComponent: ComponentInternalInstance | null, parentSuspense: SuspenseBoundary | null, onBeforeMount?: () => void): GenericComponentInstance;
-  update(n1: VNode, n2: VNode, shouldUpdate: boolean, onBeforeUpdate?: () => void): void;
+  mount(vnode: VNode, container: any, anchor: any, parentComponent: ComponentInternalInstance | null, parentSuspense: SuspenseBoundary | null, onBeforeMount?: () => void, onVnodeBeforeMount?: () => void): GenericComponentInstance;
+  update(n1: VNode, n2: VNode, shouldUpdate: boolean, onBeforeUpdate?: () => void, onVnodeBeforeUpdate?: () => void): void;
   unmount(vnode: VNode, doRemove?: boolean): void;
   move(vnode: VNode, container: any, anchor: any, moveType: MoveType): void;
   slot(n1: VNode | null, n2: VNode, container: any, anchor: any, parentComponent: ComponentInternalInstance | null, parentSuspense: SuspenseBoundary | null): void;
-  hydrate(vnode: VNode, node: any, container: any, anchor: any, parentComponent: ComponentInternalInstance | null, parentSuspense: SuspenseBoundary | null): Node;
-  hydrateSlot(vnode: VNode, node: any): Node;
+  hydrate(vnode: VNode, node: any, container: any, anchor: any, parentComponent: ComponentInternalInstance | null, parentSuspense: SuspenseBoundary | null, onBeforeMount?: () => void, onVnodeBeforeMount?: () => void): Node;
+  hydrateSlot(vnode: VNode, node: any, parentComponent: ComponentInternalInstance | null, parentSuspense: SuspenseBoundary | null): Node;
   activate(vnode: VNode, container: any, anchor: any, parentComponent: ComponentInternalInstance): void;
   deactivate(vnode: VNode, container: any): void;
   setTransitionHooks(component: ComponentInternalInstance, transition: TransitionHooks): void;
-  vdomMount: (component: ConcreteComponent, parentComponent: any, props?: any, slots?: any) => any;
+  vdomMount: (component: ConcreteComponent, parentComponent: any, props?: any, slots?: any, once?: boolean) => any;
   vdomUnmount: UnmountComponentFn;
-  vdomSlot: (slots: any, name: string | (() => string), props: Record<string, any>, parentComponent: any, fallback?: any) => any;
+  vdomSlot: (slots: any, name: string | (() => string), props: Record<string, any>, parentComponent: any, fallback?: any, once?: boolean, slotRoot?: boolean) => any;
   vdomMountVNode: (vnode: VNode, parentComponent: any) => any;
 }
 /**
@@ -1273,7 +1279,10 @@ interface VNode<HostNode = RendererNode, HostElement = RendererElement, ExtraPro
   vs?: {
     slot: (props: any) => any;
     fallback: (() => VNodeArrayChildren) | undefined;
+    outletFallback?: (() => VNodeArrayChildren) | undefined;
+    state?: unknown;
     ref?: ShallowRef<any>;
+    scope?: EffectScope;
   };
   /**
   * @internal Vapor slot Block
@@ -1544,6 +1553,11 @@ interface GenericComponentInstance {
   */
   asyncResolved: boolean;
   /**
+  * restore renderer-specific async context after `withAsyncContext()`
+  * @internal
+  */
+  restoreAsyncContext?: () => void | (() => void);
+  /**
   * `updateTeleportCssVars`
   * For updating css vars on contained teleports
   * @internal
@@ -22159,7 +22173,7 @@ declare namespace DataType {
   type SingleAnimationTimeline = "auto" | "none" | (string & {});
   type SingleTransition<TTime> = EasingFunction | TTime | "all" | "allow-discrete" | "none" | "normal" | (string & {});
   type StepEasingFunction = "step-end" | "step-start" | (string & {});
-  type SystemCexport olor = "AccentColor" | "AccentColorText" | "ActiveText" | "ButtonBorder" | "ButtonFace" | "ButtonText" | "Canvas" | "CanvasText" | "Field" | "FieldText" | "GrayText" | "Highlight" | "HighlightText" | "LinkText" | "Mark" | "MarkText" | "SelectedItem" | "SelectedItemText" | "VisitedText";
+  type SystemColor = "AccentColor" | "AccentColorText" | "ActiveText" | "ButtonBorder" | "ButtonFace" | "ButtonText" | "Canvas" | "CanvasText" | "Field" | "FieldText" | "GrayText" | "Highlight" | "HighlightText" | "LinkText" | "Mark" | "MarkText" | "SelectedItem" | "SelectedItemText" | "VisitedText";
   type SystemFamilyName = "caption" | "icon" | "menu" | "message-box" | "small-caption" | "status-bar";
   type TextEdge = "cap" | "ex" | "ideographic" | "ideographic-ink" | "text" | (string & {});
   type TimelineRangeName = "contain" | "cover" | "entry" | "entry-crossing" | "exit" | "exit-crossing";
@@ -22218,6 +22232,6 @@ declare module "@vue/runtime-core" {
 }
 //#endregion
 //#region temp/packages/vue-compat/src/index.d.ts
-declare const Vue: CompatVue;
+export declare const Vue: CompatVue;
 //#endregion
 export { Vue as default };