feat(nuxt): allow passing transition & keepalive props to <NuxtPage> (

#7492)

packages/nuxt/src/pages/runtime/page.ts

@@ -1,4 +1,4 @@
-import { computed, defineComponent, h, inject, provide, reactive, onMounted, nextTick, Suspense, Transition } from 'vue'
+import { computed, defineComponent, h, inject, provide, reactive, onMounted, nextTick, Suspense, Transition, KeepAliveProps, TransitionProps } from 'vue'
 import type { DefineComponent, VNode } from 'vue'
 import { RouteLocationNormalized, RouteLocationNormalizedLoaded, RouterView } from 'vue-router'
 import type { RouteLocation } from 'vue-router'
@@ -18,6 +18,14 @@ export default defineComponent({
     name: {
       type: String
     },
+    transition: {
+      type: [Boolean, Object] as any as () => boolean | TransitionProps,
+      default: undefined
+    },
+    keepalive: {
+      type: [Boolean, Object] as any as () => boolean | KeepAliveProps,
+      default: undefined
+    },
     route: {
       type: Object as () => RouteLocationNormalized
     },
@@ -38,10 +46,10 @@ export default defineComponent({
           if (!routeProps.Component) { return }
 
           const key = generateRouteKey(props.pageKey, routeProps)
-          const transitionProps = routeProps.route.meta.pageTransition ?? defaultPageTransition
+          const transitionProps = props.transition ?? routeProps.route.meta.pageTransition ?? (defaultPageTransition as TransitionProps)
 
           return _wrapIf(Transition, transitionProps,
-            wrapInKeepAlive(routeProps.route.meta.keepalive ?? defaultKeepaliveConfig, isNested && nuxtApp.isHydrating
+            wrapInKeepAlive(props.keepalive ?? routeProps.route.meta.keepalive ?? (defaultKeepaliveConfig as KeepAliveProps), isNested && nuxtApp.isHydrating
               // Include route children in parent suspense
               ? h(Component, { key, routeProps, pageKey: key, hasTransition: !!transitionProps } as {})
               : h(Suspense, {