[{"data":1,"prerenderedAt":4715},["ShallowReactive",2],{"navigation":3,"-docs-getting-started-transitions":1119,"-docs-getting-started-transitions-surround":4710},[4,1030],{"title":5,"titleTemplate":6,"icon":7,"path":8,"stem":9,"children":10,"page":108},"Docs",null,"i-lucide-book-marked","/docs","docs",[11,109,349,813,905,942,984,1026],{"title":12,"titleTemplate":13,"icon":14,"path":15,"stem":16,"children":17,"page":108},"Get Started","%s · Get Started with Nuxt","i-lucide-rocket","/docs/getting-started","docs/1.getting-started",[18,23,28,33,38,43,48,53,58,63,68,73,78,83,88,93,98,103],{"title":19,"path":20,"stem":21,"titleTemplate":6,"icon":22},"Introduction","/docs/getting-started/introduction","docs/1.getting-started/01.introduction","i-lucide-info",{"title":24,"path":25,"stem":26,"titleTemplate":6,"icon":27},"Installation","/docs/getting-started/installation","docs/1.getting-started/02.installation","i-lucide-play",{"title":29,"path":30,"stem":31,"titleTemplate":6,"icon":32},"Configuration","/docs/getting-started/configuration","docs/1.getting-started/03.configuration","i-lucide-cog",{"title":34,"path":35,"stem":36,"titleTemplate":6,"icon":37},"Views","/docs/getting-started/views","docs/1.getting-started/04.views","i-lucide-panels-top-left",{"title":39,"path":40,"stem":41,"titleTemplate":6,"icon":42},"Assets","/docs/getting-started/assets","docs/1.getting-started/05.assets","i-lucide-image",{"title":44,"path":45,"stem":46,"titleTemplate":6,"icon":47},"Styling","/docs/getting-started/styling","docs/1.getting-started/06.styling","i-lucide-palette",{"title":49,"path":50,"stem":51,"titleTemplate":6,"icon":52},"Routing","/docs/getting-started/routing","docs/1.getting-started/07.routing","i-lucide-milestone",{"title":54,"path":55,"stem":56,"titleTemplate":6,"icon":57},"SEO and Meta","/docs/getting-started/seo-meta","docs/1.getting-started/08.seo-meta","i-lucide-file-search",{"title":59,"path":60,"stem":61,"titleTemplate":6,"icon":62},"Transitions","/docs/getting-started/transitions","docs/1.getting-started/09.transitions","i-lucide-toggle-right",{"title":64,"path":65,"stem":66,"titleTemplate":6,"icon":67},"Data Fetching","/docs/getting-started/data-fetching","docs/1.getting-started/10.data-fetching","i-lucide-cable",{"title":69,"path":70,"stem":71,"titleTemplate":6,"icon":72},"State Management","/docs/getting-started/state-management","docs/1.getting-started/11.state-management","i-lucide-database",{"title":74,"path":75,"stem":76,"titleTemplate":6,"icon":77},"Error Handling","/docs/getting-started/error-handling","docs/1.getting-started/12.error-handling","i-lucide-bug-off",{"title":79,"path":80,"stem":81,"titleTemplate":6,"icon":82},"Server","/docs/getting-started/server","docs/1.getting-started/13.server","i-lucide-pc-case",{"title":84,"path":85,"stem":86,"titleTemplate":6,"icon":87},"Layers","/docs/getting-started/layers","docs/1.getting-started/14.layers","i-lucide-layers",{"title":89,"path":90,"stem":91,"titleTemplate":6,"icon":92},"Prerendering","/docs/getting-started/prerendering","docs/1.getting-started/15.prerendering","i-lucide-file-code-2",{"title":94,"path":95,"stem":96,"titleTemplate":6,"icon":97},"Deployment","/docs/getting-started/deployment","docs/1.getting-started/16.deployment","i-lucide-cloud",{"title":99,"path":100,"stem":101,"titleTemplate":6,"icon":102},"Testing","/docs/getting-started/testing","docs/1.getting-started/17.testing","i-lucide-circle-check",{"title":104,"path":105,"stem":106,"titleTemplate":6,"icon":107},"Upgrade Guide","/docs/getting-started/upgrade","docs/1.getting-started/18.upgrade","i-lucide-circle-arrow-up",false,{"title":110,"titleTemplate":6,"icon":111,"path":112,"stem":113,"children":114,"page":108},"Guide","i-lucide-book-open","/docs/guide","docs/2.guide",[115,158,271,326],{"title":116,"titleTemplate":117,"icon":118,"path":119,"stem":120,"children":121,"page":108},"Key Concepts","%s · Nuxt Concepts","i-lucide-medal","/docs/guide/concepts","docs/2.guide/1.concepts",[122,126,130,134,138,142,146,150,154],{"title":123,"path":124,"stem":125,"titleTemplate":6},"Auto-imports","/docs/guide/concepts/auto-imports","docs/2.guide/1.concepts/1.auto-imports",{"title":127,"path":128,"stem":129,"titleTemplate":6},"Nuxt Lifecycle","/docs/guide/concepts/nuxt-lifecycle","docs/2.guide/1.concepts/10.nuxt-lifecycle",{"title":131,"path":132,"stem":133,"titleTemplate":6},"Vue.js Development","/docs/guide/concepts/vuejs-development","docs/2.guide/1.concepts/2.vuejs-development",{"title":135,"path":136,"stem":137,"titleTemplate":6},"Rendering Modes","/docs/guide/concepts/rendering","docs/2.guide/1.concepts/3.rendering",{"title":139,"path":140,"stem":141,"titleTemplate":6},"Server Engine","/docs/guide/concepts/server-engine","docs/2.guide/1.concepts/4.server-engine",{"title":143,"path":144,"stem":145,"titleTemplate":6},"Modules","/docs/guide/concepts/modules","docs/2.guide/1.concepts/5.modules",{"title":147,"path":148,"stem":149,"titleTemplate":6},"ES Modules","/docs/guide/concepts/esm","docs/2.guide/1.concepts/7.esm",{"title":151,"path":152,"stem":153,"titleTemplate":6},"TypeScript","/docs/guide/concepts/typescript","docs/2.guide/1.concepts/8.typescript",{"title":155,"path":156,"stem":157,"titleTemplate":6},"Code Style","/docs/guide/concepts/code-style","docs/2.guide/1.concepts/9.code-style",{"title":159,"titleTemplate":160,"icon":161,"path":162,"stem":163,"children":164,"page":108},"Directory Structure","%s · Nuxt Directory Structure","i-lucide-folders","/docs/guide/directory-structure","docs/2.guide/2.directory-structure",[165,170,174,178,182,186,190,194,198,202,206,210,214,218,222,226,230,235,239,243,247,251,255,259,263,267],{"title":166,"path":167,"stem":168,"titleTemplate":6,"icon":169},".nuxt","/docs/guide/directory-structure/nuxt","docs/2.guide/2.directory-structure/0.nuxt","i-lucide-folder",{"title":171,"path":172,"stem":173,"titleTemplate":6,"icon":169},".output","/docs/guide/directory-structure/output","docs/2.guide/2.directory-structure/0.output",{"title":175,"path":176,"stem":177,"titleTemplate":6,"icon":169},"assets","/docs/guide/directory-structure/assets","docs/2.guide/2.directory-structure/1.assets",{"title":179,"path":180,"stem":181,"titleTemplate":6,"icon":169},"components","/docs/guide/directory-structure/components","docs/2.guide/2.directory-structure/1.components",{"title":183,"path":184,"stem":185,"titleTemplate":6,"icon":169},"composables","/docs/guide/directory-structure/composables","docs/2.guide/2.directory-structure/1.composables",{"title":187,"path":188,"stem":189,"titleTemplate":6,"icon":169},"content","/docs/guide/directory-structure/content","docs/2.guide/2.directory-structure/1.content",{"title":191,"path":192,"stem":193,"titleTemplate":6,"icon":169},"layouts","/docs/guide/directory-structure/layouts","docs/2.guide/2.directory-structure/1.layouts",{"title":195,"path":196,"stem":197,"titleTemplate":6,"icon":169},"middleware","/docs/guide/directory-structure/middleware","docs/2.guide/2.directory-structure/1.middleware",{"title":199,"path":200,"stem":201,"titleTemplate":6,"icon":169},"modules","/docs/guide/directory-structure/modules","docs/2.guide/2.directory-structure/1.modules",{"title":203,"path":204,"stem":205,"titleTemplate":6,"icon":169},"node_modules","/docs/guide/directory-structure/node_modules","docs/2.guide/2.directory-structure/1.node_modules",{"title":207,"path":208,"stem":209,"titleTemplate":6,"icon":169},"pages","/docs/guide/directory-structure/pages","docs/2.guide/2.directory-structure/1.pages",{"title":211,"path":212,"stem":213,"titleTemplate":6,"icon":169},"plugins","/docs/guide/directory-structure/plugins","docs/2.guide/2.directory-structure/1.plugins",{"title":215,"path":216,"stem":217,"titleTemplate":6,"icon":169},"public","/docs/guide/directory-structure/public","docs/2.guide/2.directory-structure/1.public",{"title":219,"path":220,"stem":221,"titleTemplate":6,"icon":169},"server","/docs/guide/directory-structure/server","docs/2.guide/2.directory-structure/1.server",{"title":223,"path":224,"stem":225,"titleTemplate":6,"icon":169},"shared","/docs/guide/directory-structure/shared","docs/2.guide/2.directory-structure/1.shared",{"title":227,"path":228,"stem":229,"titleTemplate":6,"icon":169},"utils","/docs/guide/directory-structure/utils","docs/2.guide/2.directory-structure/1.utils",{"title":231,"path":232,"stem":233,"titleTemplate":6,"icon":234},".env","/docs/guide/directory-structure/env","docs/2.guide/2.directory-structure/2.env","i-lucide-file",{"title":236,"path":237,"stem":238,"titleTemplate":6,"icon":234},".gitignore","/docs/guide/directory-structure/gitignore","docs/2.guide/2.directory-structure/2.gitignore",{"title":240,"path":241,"stem":242,"titleTemplate":6,"icon":234},".nuxtignore","/docs/guide/directory-structure/nuxtignore","docs/2.guide/2.directory-structure/2.nuxtignore",{"title":244,"path":245,"stem":246,"titleTemplate":6,"icon":234},".nuxtrc","/docs/guide/directory-structure/nuxtrc","docs/2.guide/2.directory-structure/2.nuxtrc",{"title":248,"path":249,"stem":250,"titleTemplate":6,"icon":234},"app.vue","/docs/guide/directory-structure/app","docs/2.guide/2.directory-structure/3.app",{"title":252,"path":253,"stem":254,"titleTemplate":6,"icon":234},"app.config.ts","/docs/guide/directory-structure/app-config","docs/2.guide/2.directory-structure/3.app-config",{"title":256,"path":257,"stem":258,"titleTemplate":6,"icon":234},"error.vue","/docs/guide/directory-structure/error","docs/2.guide/2.directory-structure/3.error",{"title":260,"path":261,"stem":262,"titleTemplate":6,"icon":234},"nuxt.config.ts","/docs/guide/directory-structure/nuxt-config","docs/2.guide/2.directory-structure/3.nuxt-config",{"title":264,"path":265,"stem":266,"titleTemplate":6,"icon":234},"package.json","/docs/guide/directory-structure/package","docs/2.guide/2.directory-structure/3.package",{"title":268,"path":269,"stem":270,"titleTemplate":6,"icon":234},"tsconfig.json","/docs/guide/directory-structure/tsconfig","docs/2.guide/2.directory-structure/3.tsconfig",{"title":272,"titleTemplate":273,"icon":274,"path":275,"stem":276,"children":277,"page":108},"Going Further","%s · Nuxt Advanced","i-lucide-star","/docs/guide/going-further","docs/2.guide/3.going-further",[278,282,286,290,294,298,302,306,310,314,318,322],{"title":279,"path":280,"stem":281,"titleTemplate":6},"Events","/docs/guide/going-further/events","docs/2.guide/3.going-further/1.events",{"title":283,"path":284,"stem":285,"titleTemplate":6},"Experimental Features","/docs/guide/going-further/experimental-features","docs/2.guide/3.going-further/1.experimental-features",{"title":287,"path":288,"stem":289,"titleTemplate":6},"Features","/docs/guide/going-further/features","docs/2.guide/3.going-further/1.features",{"title":291,"path":292,"stem":293,"titleTemplate":6},"How Nuxt Works?","/docs/guide/going-further/internals","docs/2.guide/3.going-further/1.internals",{"title":295,"path":296,"stem":297,"titleTemplate":6},"Runtime Config","/docs/guide/going-further/runtime-config","docs/2.guide/3.going-further/10.runtime-config",{"title":299,"path":300,"stem":301,"titleTemplate":6},"Nightly Release Channel","/docs/guide/going-further/nightly-release-channel","docs/2.guide/3.going-further/11.nightly-release-channel",{"title":303,"path":304,"stem":305,"titleTemplate":6},"Lifecycle Hooks","/docs/guide/going-further/hooks","docs/2.guide/3.going-further/2.hooks",{"title":307,"path":308,"stem":309,"titleTemplate":6},"Module Author Guide","/docs/guide/going-further/modules","docs/2.guide/3.going-further/3.modules",{"title":311,"path":312,"stem":313,"titleTemplate":6},"Nuxt Kit","/docs/guide/going-further/kit","docs/2.guide/3.going-further/4.kit",{"title":315,"path":316,"stem":317,"titleTemplate":6},"NuxtApp","/docs/guide/going-further/nuxt-app","docs/2.guide/3.going-further/6.nuxt-app",{"title":319,"path":320,"stem":321,"titleTemplate":6},"Authoring Nuxt Layers","/docs/guide/going-further/layers","docs/2.guide/3.going-further/7.layers",{"title":323,"path":324,"stem":325,"titleTemplate":6},"Debugging","/docs/guide/going-further/debugging","docs/2.guide/3.going-further/9.debugging",{"title":327,"titleTemplate":328,"icon":329,"path":330,"stem":331,"children":332,"page":108},"Recipes","%s · Recipes","i-lucide-cooking-pot","/docs/guide/recipes","docs/2.guide/4.recipes",[333,337,341,345],{"title":334,"path":335,"stem":336,"titleTemplate":6},"Custom Routing","/docs/guide/recipes/custom-routing","docs/2.guide/4.recipes/1.custom-routing",{"title":338,"path":339,"stem":340,"titleTemplate":6},"Vite Plugins","/docs/guide/recipes/vite-plugin","docs/2.guide/4.recipes/2.vite-plugin",{"title":342,"path":343,"stem":344,"titleTemplate":6},"Custom useFetch","/docs/guide/recipes/custom-usefetch","docs/2.guide/4.recipes/3.custom-usefetch",{"title":346,"path":347,"stem":348,"titleTemplate":6},"Sessions and Authentication","/docs/guide/recipes/sessions-and-authentication","docs/2.guide/4.recipes/4.sessions-and-authentication",{"title":350,"titleTemplate":351,"icon":352,"path":353,"stem":354,"children":355,"page":108},"API","%s · Nuxt API","i-lucide-code-xml","/docs/api","docs/3.api",[356,424,547,662,729,795,808],{"title":357,"titleTemplate":358,"icon":359,"path":360,"stem":361,"children":362,"page":108},"Components","%s · Nuxt Components","i-lucide-box","/docs/api/components","docs/3.api/1.components",[363,367,371,375,379,383,388,392,396,400,404,408,412,416,420],{"title":364,"path":365,"stem":366,"titleTemplate":6},"\u003CClientOnly>","/docs/api/components/client-only","docs/3.api/1.components/1.client-only",{"title":368,"path":369,"stem":370,"titleTemplate":6},"\u003CDevOnly>","/docs/api/components/dev-only","docs/3.api/1.components/1.dev-only",{"title":372,"path":373,"stem":374,"titleTemplate":6},"\u003CNuxtClientFallback>","/docs/api/components/nuxt-client-fallback","docs/3.api/1.components/1.nuxt-client-fallback",{"title":376,"path":377,"stem":378,"titleTemplate":6},"\u003CNuxtPicture>","/docs/api/components/nuxt-picture","docs/3.api/1.components/10.nuxt-picture",{"title":380,"path":381,"stem":382,"titleTemplate":6},"\u003CTeleport>","/docs/api/components/teleports","docs/3.api/1.components/11.teleports",{"title":384,"path":385,"stem":386,"titleTemplate":6,"badge":387},"\u003CNuxtRouteAnnouncer>","/docs/api/components/nuxt-route-announcer","docs/3.api/1.components/12.nuxt-route-announcer","New",{"title":389,"path":390,"stem":391,"titleTemplate":6,"badge":387},"\u003CNuxtTime>","/docs/api/components/nuxt-time","docs/3.api/1.components/13.nuxt-time",{"title":393,"path":394,"stem":395,"titleTemplate":6},"\u003CNuxtPage>","/docs/api/components/nuxt-page","docs/3.api/1.components/2.nuxt-page",{"title":397,"path":398,"stem":399,"titleTemplate":6},"\u003CNuxtLayout>","/docs/api/components/nuxt-layout","docs/3.api/1.components/3.nuxt-layout",{"title":401,"path":402,"stem":403,"titleTemplate":6},"\u003CNuxtLink>","/docs/api/components/nuxt-link","docs/3.api/1.components/4.nuxt-link",{"title":405,"path":406,"stem":407,"titleTemplate":6},"\u003CNuxtLoadingIndicator>","/docs/api/components/nuxt-loading-indicator","docs/3.api/1.components/5.nuxt-loading-indicator",{"title":409,"path":410,"stem":411,"titleTemplate":6},"\u003CNuxtErrorBoundary>","/docs/api/components/nuxt-error-boundary","docs/3.api/1.components/6.nuxt-error-boundary",{"title":413,"path":414,"stem":415,"titleTemplate":6},"\u003CNuxtWelcome>","/docs/api/components/nuxt-welcome","docs/3.api/1.components/7.nuxt-welcome",{"title":417,"path":418,"stem":419,"titleTemplate":6},"\u003CNuxtIsland>","/docs/api/components/nuxt-island","docs/3.api/1.components/8.nuxt-island",{"title":421,"path":422,"stem":423,"titleTemplate":6},"\u003CNuxtImg>","/docs/api/components/nuxt-img","docs/3.api/1.components/9.nuxt-img",{"title":425,"titleTemplate":426,"icon":427,"path":428,"stem":429,"children":430,"page":108},"Composables","%s · Nuxt Composables","i-lucide-arrow-left-right","/docs/api/composables","docs/3.api/2.composables",[431,435,439,443,447,451,455,459,463,467,471,475,479,483,487,491,495,499,503,507,511,515,519,523,527,531,535,539,543],{"title":432,"path":433,"stem":434,"titleTemplate":6},"onPrehydrate","/docs/api/composables/on-prehydrate","docs/3.api/2.composables/on-prehydrate",{"title":436,"path":437,"stem":438,"titleTemplate":6},"useAppConfig","/docs/api/composables/use-app-config","docs/3.api/2.composables/use-app-config",{"title":440,"path":441,"stem":442,"titleTemplate":6},"useAsyncData","/docs/api/composables/use-async-data","docs/3.api/2.composables/use-async-data",{"title":444,"path":445,"stem":446,"titleTemplate":6},"useCookie","/docs/api/composables/use-cookie","docs/3.api/2.composables/use-cookie",{"title":448,"path":449,"stem":450,"titleTemplate":6},"useError","/docs/api/composables/use-error","docs/3.api/2.composables/use-error",{"title":452,"path":453,"stem":454,"titleTemplate":6},"useFetch","/docs/api/composables/use-fetch","docs/3.api/2.composables/use-fetch",{"title":456,"path":457,"stem":458,"titleTemplate":6},"useHead","/docs/api/composables/use-head","docs/3.api/2.composables/use-head",{"title":460,"path":461,"stem":462,"titleTemplate":6},"useHeadSafe","/docs/api/composables/use-head-safe","docs/3.api/2.composables/use-head-safe",{"title":464,"path":465,"stem":466,"titleTemplate":6},"useHydration","/docs/api/composables/use-hydration","docs/3.api/2.composables/use-hydration",{"title":468,"path":469,"stem":470,"titleTemplate":6},"useLazyAsyncData","/docs/api/composables/use-lazy-async-data","docs/3.api/2.composables/use-lazy-async-data",{"title":472,"path":473,"stem":474,"titleTemplate":6},"useLazyFetch","/docs/api/composables/use-lazy-fetch","docs/3.api/2.composables/use-lazy-fetch",{"title":476,"path":477,"stem":478,"titleTemplate":6},"useLoadingIndicator","/docs/api/composables/use-loading-indicator","docs/3.api/2.composables/use-loading-indicator",{"title":480,"path":481,"stem":482,"titleTemplate":6},"useNuxtApp","/docs/api/composables/use-nuxt-app","docs/3.api/2.composables/use-nuxt-app",{"title":484,"path":485,"stem":486,"titleTemplate":6},"useNuxtData","/docs/api/composables/use-nuxt-data","docs/3.api/2.composables/use-nuxt-data",{"title":488,"path":489,"stem":490,"titleTemplate":6},"usePreviewMode","/docs/api/composables/use-preview-mode","docs/3.api/2.composables/use-preview-mode",{"title":492,"path":493,"stem":494,"titleTemplate":6},"useRequestEvent","/docs/api/composables/use-request-event","docs/3.api/2.composables/use-request-event",{"title":496,"path":497,"stem":498,"titleTemplate":6},"useRequestFetch","/docs/api/composables/use-request-fetch","docs/3.api/2.composables/use-request-fetch",{"title":500,"path":501,"stem":502,"titleTemplate":6},"useRequestHeader","/docs/api/composables/use-request-header","docs/3.api/2.composables/use-request-header",{"title":504,"path":505,"stem":506,"titleTemplate":6},"useRequestHeaders","/docs/api/composables/use-request-headers","docs/3.api/2.composables/use-request-headers",{"title":508,"path":509,"stem":510,"titleTemplate":6},"useRequestURL","/docs/api/composables/use-request-url","docs/3.api/2.composables/use-request-url",{"title":512,"path":513,"stem":514,"titleTemplate":6},"useResponseHeader","/docs/api/composables/use-response-header","docs/3.api/2.composables/use-response-header",{"title":516,"path":517,"stem":518,"titleTemplate":6},"useRoute","/docs/api/composables/use-route","docs/3.api/2.composables/use-route",{"title":520,"path":521,"stem":522,"titleTemplate":6,"badge":387},"useRouteAnnouncer","/docs/api/composables/use-route-announcer","docs/3.api/2.composables/use-route-announcer",{"title":524,"path":525,"stem":526,"titleTemplate":6},"useRouter","/docs/api/composables/use-router","docs/3.api/2.composables/use-router",{"title":528,"path":529,"stem":530,"titleTemplate":6},"useRuntimeConfig","/docs/api/composables/use-runtime-config","docs/3.api/2.composables/use-runtime-config",{"title":532,"path":533,"stem":534,"titleTemplate":6},"useRuntimeHook","/docs/api/composables/use-runtime-hook","docs/3.api/2.composables/use-runtime-hook",{"title":536,"path":537,"stem":538,"titleTemplate":6},"useSeoMeta","/docs/api/composables/use-seo-meta","docs/3.api/2.composables/use-seo-meta",{"title":540,"path":541,"stem":542,"titleTemplate":6},"useServerSeoMeta","/docs/api/composables/use-server-seo-meta","docs/3.api/2.composables/use-server-seo-meta",{"title":544,"path":545,"stem":546,"titleTemplate":6},"useState","/docs/api/composables/use-state","docs/3.api/2.composables/use-state",{"title":548,"titleTemplate":549,"icon":550,"path":551,"stem":552,"children":553,"page":108},"Utils","%s · Nuxt Utils","i-lucide-square-function","/docs/api/utils","docs/3.api/3.utils",[554,558,562,566,570,574,578,582,586,590,594,598,602,606,610,614,618,622,626,630,634,638,642,646,650,654,658],{"title":555,"path":556,"stem":557,"titleTemplate":6},"$fetch","/docs/api/utils/dollarfetch","docs/3.api/3.utils/$fetch",{"title":559,"path":560,"stem":561,"titleTemplate":6},"abortNavigation","/docs/api/utils/abort-navigation","docs/3.api/3.utils/abort-navigation",{"title":563,"path":564,"stem":565,"titleTemplate":6},"addRouteMiddleware","/docs/api/utils/add-route-middleware","docs/3.api/3.utils/add-route-middleware",{"title":567,"path":568,"stem":569,"titleTemplate":6,"badge":387},"callOnce","/docs/api/utils/call-once","docs/3.api/3.utils/call-once",{"title":571,"path":572,"stem":573,"titleTemplate":6},"clearError","/docs/api/utils/clear-error","docs/3.api/3.utils/clear-error",{"title":575,"path":576,"stem":577,"titleTemplate":6},"clearNuxtData","/docs/api/utils/clear-nuxt-data","docs/3.api/3.utils/clear-nuxt-data",{"title":579,"path":580,"stem":581,"titleTemplate":6},"clearNuxtState","/docs/api/utils/clear-nuxt-state","docs/3.api/3.utils/clear-nuxt-state",{"title":583,"path":584,"stem":585,"titleTemplate":6},"createError","/docs/api/utils/create-error","docs/3.api/3.utils/create-error",{"title":587,"path":588,"stem":589,"titleTemplate":6},"defineNuxtComponent","/docs/api/utils/define-nuxt-component","docs/3.api/3.utils/define-nuxt-component",{"title":591,"path":592,"stem":593,"titleTemplate":6},"defineNuxtRouteMiddleware","/docs/api/utils/define-nuxt-route-middleware","docs/3.api/3.utils/define-nuxt-route-middleware",{"title":595,"path":596,"stem":597,"titleTemplate":6},"definePageMeta","/docs/api/utils/define-page-meta","docs/3.api/3.utils/define-page-meta",{"title":599,"path":600,"stem":601,"titleTemplate":6},"defineRouteRules","/docs/api/utils/define-route-rules","docs/3.api/3.utils/define-route-rules",{"title":603,"path":604,"stem":605,"titleTemplate":6},"navigateTo","/docs/api/utils/navigate-to","docs/3.api/3.utils/navigate-to",{"title":607,"path":608,"stem":609,"titleTemplate":6},"onBeforeRouteLeave","/docs/api/utils/on-before-route-leave","docs/3.api/3.utils/on-before-route-leave",{"title":611,"path":612,"stem":613,"titleTemplate":6},"onBeforeRouteUpdate","/docs/api/utils/on-before-route-update","docs/3.api/3.utils/on-before-route-update",{"title":615,"path":616,"stem":617,"titleTemplate":6},"onNuxtReady","/docs/api/utils/on-nuxt-ready","docs/3.api/3.utils/on-nuxt-ready",{"title":619,"path":620,"stem":621,"titleTemplate":6},"prefetchComponents","/docs/api/utils/prefetch-components","docs/3.api/3.utils/prefetch-components",{"title":623,"path":624,"stem":625,"titleTemplate":6},"preloadComponents","/docs/api/utils/preload-components","docs/3.api/3.utils/preload-components",{"title":627,"path":628,"stem":629,"titleTemplate":6},"preloadRouteComponents","/docs/api/utils/preload-route-components","docs/3.api/3.utils/preload-route-components",{"title":631,"path":632,"stem":633,"titleTemplate":6},"prerenderRoutes","/docs/api/utils/prerender-routes","docs/3.api/3.utils/prerender-routes",{"title":635,"path":636,"stem":637,"titleTemplate":6,"badge":387},"refreshCookie","/docs/api/utils/refresh-cookie","docs/3.api/3.utils/refresh-cookie",{"title":639,"path":640,"stem":641,"titleTemplate":6},"refreshNuxtData","/docs/api/utils/refresh-nuxt-data","docs/3.api/3.utils/refresh-nuxt-data",{"title":643,"path":644,"stem":645,"titleTemplate":6},"reloadNuxtApp","/docs/api/utils/reload-nuxt-app","docs/3.api/3.utils/reload-nuxt-app",{"title":647,"path":648,"stem":649,"titleTemplate":6},"setPageLayout","/docs/api/utils/set-page-layout","docs/3.api/3.utils/set-page-layout",{"title":651,"path":652,"stem":653,"titleTemplate":6},"setResponseStatus","/docs/api/utils/set-response-status","docs/3.api/3.utils/set-response-status",{"title":655,"path":656,"stem":657,"titleTemplate":6},"showError","/docs/api/utils/show-error","docs/3.api/3.utils/show-error",{"title":659,"path":660,"stem":661,"titleTemplate":6},"updateAppConfig","/docs/api/utils/update-app-config","docs/3.api/3.utils/update-app-config",{"title":663,"titleTemplate":664,"icon":665,"path":666,"stem":667,"children":668,"page":108},"Commands","%s · Nuxt Commands","i-lucide-square-terminal","/docs/api/commands","docs/3.api/4.commands",[669,673,677,681,685,689,693,697,701,705,709,713,717,721,725],{"title":670,"path":671,"stem":672,"titleTemplate":6},"nuxt add","/docs/api/commands/add","docs/3.api/4.commands/add",{"title":674,"path":675,"stem":676,"titleTemplate":6},"nuxt analyze","/docs/api/commands/analyze","docs/3.api/4.commands/analyze",{"title":678,"path":679,"stem":680,"titleTemplate":6},"nuxt build","/docs/api/commands/build","docs/3.api/4.commands/build",{"title":682,"path":683,"stem":684,"titleTemplate":6},"nuxt build-module","/docs/api/commands/build-module","docs/3.api/4.commands/build-module",{"title":686,"path":687,"stem":688,"titleTemplate":6},"nuxt cleanup","/docs/api/commands/cleanup","docs/3.api/4.commands/cleanup",{"title":690,"path":691,"stem":692,"titleTemplate":6},"nuxt dev","/docs/api/commands/dev","docs/3.api/4.commands/dev",{"title":694,"path":695,"stem":696,"titleTemplate":6},"nuxt devtools","/docs/api/commands/devtools","docs/3.api/4.commands/devtools",{"title":698,"path":699,"stem":700,"titleTemplate":6},"nuxt generate","/docs/api/commands/generate","docs/3.api/4.commands/generate",{"title":702,"path":703,"stem":704,"titleTemplate":6},"nuxt info","/docs/api/commands/info","docs/3.api/4.commands/info",{"title":706,"path":707,"stem":708,"titleTemplate":6},"create nuxt","/docs/api/commands/init","docs/3.api/4.commands/init",{"title":710,"path":711,"stem":712,"titleTemplate":6},"nuxt module","/docs/api/commands/module","docs/3.api/4.commands/module",{"title":714,"path":715,"stem":716,"titleTemplate":6},"nuxt prepare","/docs/api/commands/prepare","docs/3.api/4.commands/prepare",{"title":718,"path":719,"stem":720,"titleTemplate":6},"nuxt preview","/docs/api/commands/preview","docs/3.api/4.commands/preview",{"title":722,"path":723,"stem":724,"titleTemplate":6},"nuxt typecheck","/docs/api/commands/typecheck","docs/3.api/4.commands/typecheck",{"title":726,"path":727,"stem":728,"titleTemplate":6},"nuxt upgrade","/docs/api/commands/upgrade","docs/3.api/4.commands/upgrade",{"title":311,"titleTemplate":730,"icon":731,"path":732,"stem":733,"children":734,"page":108},"%s · Nuxt Kit","i-lucide-package","/docs/api/kit","docs/3.api/5.kit",[735,738,741,745,749,753,757,761,765,769,773,776,779,783,787,791],{"title":143,"path":736,"stem":737,"titleTemplate":6},"/docs/api/kit/modules","docs/3.api/5.kit/1.modules",{"title":295,"path":739,"stem":740,"titleTemplate":6},"/docs/api/kit/runtime-config","docs/3.api/5.kit/10.runtime-config",{"title":742,"path":743,"stem":744,"titleTemplate":6},"Templates","/docs/api/kit/templates","docs/3.api/5.kit/10.templates",{"title":746,"path":747,"stem":748,"titleTemplate":6},"Nitro","/docs/api/kit/nitro","docs/3.api/5.kit/11.nitro",{"title":750,"path":751,"stem":752,"titleTemplate":6},"Resolving","/docs/api/kit/resolving","docs/3.api/5.kit/12.resolving",{"title":754,"path":755,"stem":756,"titleTemplate":6},"Logging","/docs/api/kit/logging","docs/3.api/5.kit/13.logging",{"title":758,"path":759,"stem":760,"titleTemplate":6},"Builder","/docs/api/kit/builder","docs/3.api/5.kit/14.builder",{"title":762,"path":763,"stem":764,"titleTemplate":6},"Examples","/docs/api/kit/examples","docs/3.api/5.kit/15.examples",{"title":766,"path":767,"stem":768,"titleTemplate":6},"Programmatic Usage","/docs/api/kit/programmatic","docs/3.api/5.kit/2.programmatic",{"title":770,"path":771,"stem":772,"titleTemplate":6},"Compatibility","/docs/api/kit/compatibility","docs/3.api/5.kit/3.compatibility",{"title":123,"path":774,"stem":775,"titleTemplate":6},"/docs/api/kit/autoimports","docs/3.api/5.kit/4.autoimports",{"title":357,"path":777,"stem":778,"titleTemplate":6},"/docs/api/kit/components","docs/3.api/5.kit/5.components",{"title":780,"path":781,"stem":782,"titleTemplate":6},"Context","/docs/api/kit/context","docs/3.api/5.kit/6.context",{"title":784,"path":785,"stem":786,"titleTemplate":6},"Pages","/docs/api/kit/pages","docs/3.api/5.kit/7.pages",{"title":788,"path":789,"stem":790,"titleTemplate":6},"Layout","/docs/api/kit/layout","docs/3.api/5.kit/8.layout",{"title":792,"path":793,"stem":794,"titleTemplate":6},"Plugins","/docs/api/kit/plugins","docs/3.api/5.kit/9.plugins",{"title":796,"titleTemplate":6,"icon":797,"path":798,"stem":799,"children":800,"page":108},"Advanced","i-lucide-brain","/docs/api/advanced","docs/3.api/6.advanced",[801,804],{"title":303,"path":802,"stem":803,"titleTemplate":6},"/docs/api/advanced/hooks","docs/3.api/6.advanced/1.hooks",{"title":805,"path":806,"stem":807,"titleTemplate":6},"Import meta","/docs/api/advanced/import-meta","docs/3.api/6.advanced/2.import-meta",{"title":809,"path":810,"stem":811,"titleTemplate":812,"icon":32},"Nuxt Configuration","/docs/api/nuxt-config","docs/3.api/6.nuxt-config","%s",{"title":762,"titleTemplate":814,"icon":815,"path":816,"stem":817,"children":818,"page":108},"%s · Nuxt Examples","i-lucide-app-window-mac","/docs/examples","docs/4.examples",[819,823,845,860,896],{"title":820,"path":821,"stem":822,"titleTemplate":6},"Hello World","/docs/examples/hello-world","docs/4.examples/0.hello-world",{"title":287,"path":824,"stem":825,"children":826,"page":108},"/docs/examples/features","docs/4.examples/1.features",[827,831,834,837,841],{"title":828,"path":829,"stem":830,"titleTemplate":6},"Auto Imports","/docs/examples/features/auto-imports","docs/4.examples/1.features/1.auto-imports",{"title":64,"path":832,"stem":833,"titleTemplate":6},"/docs/examples/features/data-fetching","docs/4.examples/1.features/2.data-fetching",{"title":69,"path":835,"stem":836,"titleTemplate":6},"/docs/examples/features/state-management","docs/4.examples/1.features/3.state-management",{"title":838,"path":839,"stem":840,"titleTemplate":6},"Meta Tags","/docs/examples/features/meta-tags","docs/4.examples/1.features/4.meta-tags",{"title":842,"path":843,"stem":844,"titleTemplate":6},"Layouts","/docs/examples/features/layouts","docs/4.examples/1.features/5.layouts",{"title":49,"path":846,"stem":847,"children":848,"page":108},"/docs/examples/routing","docs/4.examples/2.routing",[849,853,856],{"title":850,"path":851,"stem":852,"titleTemplate":6},"Middleware","/docs/examples/routing/middleware","docs/4.examples/2.routing/middleware",{"title":784,"path":854,"stem":855,"titleTemplate":6},"/docs/examples/routing/pages","docs/4.examples/2.routing/pages",{"title":857,"path":858,"stem":859,"titleTemplate":6},"Universal Router","/docs/examples/routing/universal-router","docs/4.examples/2.routing/universal-router",{"title":796,"path":861,"stem":862,"children":863,"page":108},"/docs/examples/advanced","docs/4.examples/4.advanced",[864,867,870,874,878,882,886,889,892],{"title":84,"path":865,"stem":866,"titleTemplate":6},"/docs/examples/advanced/config-extends","docs/4.examples/4.advanced/config-extends",{"title":74,"path":868,"stem":869,"titleTemplate":6},"/docs/examples/advanced/error-handling","docs/4.examples/4.advanced/error-handling",{"title":871,"path":872,"stem":873,"titleTemplate":6},"JSX / TSX","/docs/examples/advanced/jsx","docs/4.examples/4.advanced/jsx",{"title":875,"path":876,"stem":877,"titleTemplate":6},"Locale","/docs/examples/advanced/locale","docs/4.examples/4.advanced/locale",{"title":879,"path":880,"stem":881,"titleTemplate":6},"Module Extend Pages","/docs/examples/advanced/module-extend-pages","docs/4.examples/4.advanced/module-extend-pages",{"title":883,"path":884,"stem":885,"titleTemplate":6},"Teleport","/docs/examples/advanced/teleport","docs/4.examples/4.advanced/teleport",{"title":99,"path":887,"stem":888,"titleTemplate":6},"/docs/examples/advanced/testing","docs/4.examples/4.advanced/testing",{"title":444,"path":890,"stem":891,"titleTemplate":6},"/docs/examples/advanced/use-cookie","docs/4.examples/4.advanced/use-cookie",{"title":893,"path":894,"stem":895,"titleTemplate":6},"Use Custom Fetch Composable","/docs/examples/advanced/use-custom-fetch-composable","docs/4.examples/4.advanced/use-custom-fetch-composable",{"title":897,"path":898,"stem":899,"children":900,"page":108},"Experimental","/docs/examples/experimental","docs/4.examples/7.experimental",[901],{"title":902,"path":903,"stem":904,"titleTemplate":6},"WASM","/docs/examples/experimental/wasm","docs/4.examples/7.experimental/wasm",{"title":906,"titleTemplate":907,"icon":908,"path":909,"stem":910,"children":911,"page":108},"Community","%s · Nuxt Community","i-lucide-messages-square","/docs/community","docs/5.community",[912,917,922,927,932,937],{"title":913,"path":914,"stem":915,"titleTemplate":6,"icon":916},"Getting Help","/docs/community/getting-help","docs/5.community/2.getting-help","i-lucide-life-buoy",{"title":918,"path":919,"stem":920,"titleTemplate":6,"icon":921},"Reporting Bugs","/docs/community/reporting-bugs","docs/5.community/3.reporting-bugs","i-lucide-bug",{"title":923,"path":924,"stem":925,"titleTemplate":6,"icon":926},"Contribution","/docs/community/contribution","docs/5.community/4.contribution","i-lucide-git-pull-request",{"title":928,"path":929,"stem":930,"titleTemplate":6,"icon":931},"Framework","/docs/community/framework-contribution","docs/5.community/5.framework-contribution","i-lucide-github",{"title":933,"path":934,"stem":935,"titleTemplate":6,"icon":936},"Roadmap","/docs/community/roadmap","docs/5.community/6.roadmap","i-lucide-map",{"title":938,"path":939,"stem":940,"titleTemplate":6,"icon":941},"Releases","/docs/community/changelog","docs/5.community/7.changelog","i-lucide-bell-dot",{"title":943,"titleTemplate":944,"icon":945,"path":946,"stem":947,"children":948,"page":108},"Migrate to Nuxt Bridge","Migrate to Nuxt Bridge: %s","i-lucide-ship","/docs/bridge","docs/6.bridge",[949,953,956,959,963,967,971,974,977,980],{"title":950,"path":951,"stem":952,"titleTemplate":6},"Overview","/docs/bridge/overview","docs/6.bridge/1.overview",{"title":29,"path":954,"stem":955,"titleTemplate":6},"/docs/bridge/configuration","docs/6.bridge/10.configuration",{"title":151,"path":957,"stem":958,"titleTemplate":6},"/docs/bridge/typescript","docs/6.bridge/2.typescript",{"title":960,"path":961,"stem":962,"titleTemplate":6},"Legacy Composition API","/docs/bridge/bridge-composition-api","docs/6.bridge/3.bridge-composition-api",{"title":964,"path":965,"stem":966,"titleTemplate":6},"Plugins and Middleware","/docs/bridge/plugins-and-middleware","docs/6.bridge/4.plugins-and-middleware",{"title":968,"path":969,"stem":970,"titleTemplate":6},"New Composition API","/docs/bridge/nuxt3-compatible-api","docs/6.bridge/5.nuxt3-compatible-api",{"title":838,"path":972,"stem":973,"titleTemplate":6},"/docs/bridge/meta","docs/6.bridge/6.meta",{"title":295,"path":975,"stem":976,"titleTemplate":6},"/docs/bridge/runtime-config","docs/6.bridge/7.runtime-config",{"title":746,"path":978,"stem":979,"titleTemplate":6},"/docs/bridge/nitro","docs/6.bridge/8.nitro",{"title":981,"path":982,"stem":983,"titleTemplate":6},"Vite","/docs/bridge/vite","docs/6.bridge/9.vite",{"title":985,"titleTemplate":986,"icon":107,"path":987,"stem":988,"children":989,"page":108},"Migrate to Nuxt 3","Migrate to Nuxt 3: %s","/docs/migration","docs/7.migration",[990,993,997,1000,1003,1006,1009,1012,1015,1019,1023],{"title":950,"path":991,"stem":992,"titleTemplate":6},"/docs/migration/overview","docs/7.migration/1.overview",{"title":994,"path":995,"stem":996,"titleTemplate":6},"Build Tooling","/docs/migration/bundling","docs/7.migration/10.bundling",{"title":79,"path":998,"stem":999,"titleTemplate":6},"/docs/migration/server","docs/7.migration/11.server",{"title":29,"path":1001,"stem":1002,"titleTemplate":6},"/docs/migration/configuration","docs/7.migration/2.configuration",{"title":143,"path":1004,"stem":1005,"titleTemplate":6},"/docs/migration/module-authors","docs/7.migration/20.module-authors",{"title":828,"path":1007,"stem":1008,"titleTemplate":6},"/docs/migration/auto-imports","docs/7.migration/3.auto-imports",{"title":838,"path":1010,"stem":1011,"titleTemplate":6},"/docs/migration/meta","docs/7.migration/4.meta",{"title":964,"path":1013,"stem":1014,"titleTemplate":6},"/docs/migration/plugins-and-middleware","docs/7.migration/5.plugins-and-middleware",{"title":1016,"path":1017,"stem":1018,"titleTemplate":6},"Pages and Layouts","/docs/migration/pages-and-layouts","docs/7.migration/6.pages-and-layouts",{"title":1020,"path":1021,"stem":1022,"titleTemplate":6},"Component Options","/docs/migration/component-options","docs/7.migration/7.component-options",{"title":295,"path":1024,"stem":1025,"titleTemplate":6},"/docs/migration/runtime-config","docs/7.migration/8.runtime-config",{"title":1027,"path":1028,"stem":1029,"titleTemplate":6},"Package","/docs/package","docs/package",{"title":1031,"path":1032,"stem":1033,"children":1034,"page":108},"Blog","/blog","blog",[1035,1039,1043,1047,1051,1055,1059,1063,1067,1071,1075,1079,1083,1087,1091,1095,1099,1103,1107,1111,1115],{"title":1036,"path":1037,"stem":1038},"Announcing 3.0","/blog/v3","blog/1.v3",{"title":1040,"path":1041,"stem":1042},"Nuxt 3.3","/blog/v3-3","blog/10.v3-3",{"title":1044,"path":1045,"stem":1046},"Nuxt 3.4","/blog/v3-4","blog/11.v3-4",{"title":1048,"path":1049,"stem":1050},"Nuxt 3.5","/blog/v3-5","blog/12.v3-5",{"title":1052,"path":1053,"stem":1054},"Nuxt 3.6","/blog/v3-6","blog/13.v3-6",{"title":1056,"path":1057,"stem":1058},"Nuxt on the Edge","/blog/nuxt-on-the-edge","blog/14.nuxt-on-the-edge",{"title":1060,"path":1061,"stem":1062},"Nuxt DevTools v1.0","/blog/nuxt-devtools-v1-0","blog/18.nuxt-devtools-v1-0",{"title":1064,"path":1065,"stem":1066},"Nuxt: A vision for 2023","/blog/vision-2023","blog/2.vision-2023",{"title":1068,"path":1069,"stem":1070},"The Evolution of Shiki v1.0","/blog/shiki-v1","blog/21.shiki-v1",{"title":1072,"path":1073,"stem":1074},"Refreshed Nuxt ESLint Integrations","/blog/eslint-module","blog/24.eslint-module",{"title":1076,"path":1077,"stem":1078},"Introducing Nuxt Scripts","/blog/nuxt-scripts","blog/26.nuxt-scripts",{"title":1080,"path":1081,"stem":1082},"Introducing Nuxt Icon v1","/blog/nuxt-icon-v1-0","blog/29.nuxt-icon-v1-0",{"title":1084,"path":1085,"stem":1086},"Introducing Nuxt DevTools","/blog/introducing-nuxt-devtools","blog/3.introducing-nuxt-devtools",{"title":1088,"path":1089,"stem":1090},"Announcing Nuxt 3 Release Candidate","/blog/nuxt3-rc","blog/3.nuxt3-rc",{"title":1092,"path":1093,"stem":1094},"Nuxt 2 End-of-Life (EOL)","/blog/nuxt2-eol","blog/4.nuxt2-eol",{"title":1096,"path":1097,"stem":1098},"Introducing Nuxt 3 Beta","/blog/nuxt3-beta","blog/4.nuxt3-beta",{"title":1100,"path":1101,"stem":1102},"Going Full Static","/blog/going-full-static","blog/5.going-full-static",{"title":1104,"path":1105,"stem":1106},"Introducing Smart Prefetching","/blog/introducing-smart-prefetching","blog/6.introducing-smart-prefetching",{"title":1108,"path":1109,"stem":1110},"Understanding how fetch works in Nuxt 2.12","/blog/understanding-how-fetch-works-in-nuxt-2-12","blog/7.understanding-how-fetch-works-in-nuxt-2-12",{"title":1112,"path":1113,"stem":1114},"Nuxt 2 Static Improvements","/blog/nuxt-static-improvements","blog/8.nuxt-static-improvements",{"title":1116,"path":1117,"stem":1118},"Nuxt 2: From Terminal to Browser","/blog/nuxtjs-from-terminal-to-browser","blog/9.nuxtjs-from-terminal-to-browser",{"id":1120,"title":59,"body":1121,"description":4704,"extension":4705,"links":6,"meta":4706,"navigation":4707,"path":60,"seo":4708,"stem":61,"titleTemplate":6,"__hash__":4709},"docs/docs/1.getting-started/09.transitions.md",{"type":1122,"value":1123,"toc":4692},"minimal",[1124,1142,1147,1153,1259,1268,1275,1618,1621,1633,1645,1879,1882,1889,1893,1898,1967,1974,2572,2574,2581,2593,2680,2684,2690,2715,2837,2846,2855,2945,2949,2956,3024,3029,3082,3086,3089,3097,3273,3289,3293,3302,4151,4160,4167,4171,4185,4292,4300,4304,4322,4335,4342,4388,4401,4412,4418,4466,4479,4535,4543,4560,4673,4678,4689],[1125,1126,1127],"note",{},[1128,1129,1130,1131,1141],"p",{},"Nuxt leverages Vue's ",[1132,1133,1137],"a",{"href":1134,"rel":1135},"https://vuejs.org/guide/built-ins/transition.html#the-transition-component",[1136],"nofollow",[1138,1139,1140],"code",{},"\u003CTransition>"," component to apply transitions between pages and layouts.",[1143,1144,1146],"h2",{"id":1145},"page-transitions","Page Transitions",[1128,1148,1149,1150,1152],{},"You can enable page transitions to apply an automatic transition for all your ",[1132,1151,207],{"href":208},".",[1154,1155,1161],"pre",{"className":1156,"code":1157,"filename":260,"language":1158,"meta":1159,"style":1160},"language-ts shiki shiki-themes material-theme-lighter material-theme-lighter material-theme-palenight","export default defineNuxtConfig({\n  app: {\n    pageTransition: { name: 'page', mode: 'out-in' }\n  },\n})\n","ts","twoslash","",[1138,1162,1163,1187,1200,1244,1250],{"__ignoreMap":1160},[1164,1165,1168,1172,1175,1179,1183],"span",{"class":1166,"line":1167},"line",1,[1164,1169,1171],{"class":1170},"s8R28","export",[1164,1173,1174],{"class":1170}," default",[1164,1176,1178],{"class":1177},"s3cPz"," defineNuxtConfig",[1164,1180,1182],{"class":1181},"sZSNi","(",[1164,1184,1186],{"class":1185},"sDfIl","{\n",[1164,1188,1190,1194,1197],{"class":1166,"line":1189},2,[1164,1191,1193],{"class":1192},"sRlkE","  app",[1164,1195,1196],{"class":1185},":",[1164,1198,1199],{"class":1185}," {\n",[1164,1201,1203,1206,1208,1211,1214,1216,1219,1223,1226,1229,1232,1234,1236,1239,1241],{"class":1166,"line":1202},3,[1164,1204,1205],{"class":1192},"    pageTransition",[1164,1207,1196],{"class":1185},[1164,1209,1210],{"class":1185}," {",[1164,1212,1213],{"class":1192}," name",[1164,1215,1196],{"class":1185},[1164,1217,1218],{"class":1185}," '",[1164,1220,1222],{"class":1221},"sGFVr","page",[1164,1224,1225],{"class":1185},"'",[1164,1227,1228],{"class":1185},",",[1164,1230,1231],{"class":1192}," mode",[1164,1233,1196],{"class":1185},[1164,1235,1218],{"class":1185},[1164,1237,1238],{"class":1221},"out-in",[1164,1240,1225],{"class":1185},[1164,1242,1243],{"class":1185}," }\n",[1164,1245,1247],{"class":1166,"line":1246},4,[1164,1248,1249],{"class":1185},"  },\n",[1164,1251,1253,1256],{"class":1166,"line":1252},5,[1164,1254,1255],{"class":1185},"}",[1164,1257,1258],{"class":1181},")\n",[1125,1260,1261],{},[1128,1262,1263,1264,1152],{},"If you are changing layouts as well as page, the page transition you set here will not run. Instead, you should set a ",[1132,1265,1267],{"href":1266},"/docs/getting-started/transitions#layout-transitions","layout transition",[1128,1269,1270,1271,1196],{},"To start adding transition between your pages, add the following CSS to your ",[1132,1272,1273],{"href":249},[1138,1274,248],{},[1276,1277,1278,1444,1537],"code-group",{},[1154,1279,1283],{"className":1280,"code":1281,"filename":248,"language":1282,"meta":1160,"style":1160},"language-vue shiki shiki-themes material-theme-lighter material-theme-lighter material-theme-palenight","\u003Ctemplate>\n  \u003CNuxtPage />\n\u003C/template>\n\n\u003Cstyle>\n.page-enter-active,\n.page-leave-active {\n  transition: all 0.4s;\n}\n.page-enter-from,\n.page-leave-to {\n  opacity: 0;\n  filter: blur(1rem);\n}\n\u003C/style>\n","vue",[1138,1284,1285,1296,1307,1316,1322,1331,1343,1353,1372,1378,1388,1398,1411,1430,1435],{"__ignoreMap":1160},[1164,1286,1287,1290,1293],{"class":1166,"line":1167},[1164,1288,1289],{"class":1185},"\u003C",[1164,1291,1292],{"class":1192},"template",[1164,1294,1295],{"class":1185},">\n",[1164,1297,1298,1301,1304],{"class":1166,"line":1189},[1164,1299,1300],{"class":1185},"  \u003C",[1164,1302,1303],{"class":1192},"NuxtPage",[1164,1305,1306],{"class":1185}," />\n",[1164,1308,1309,1312,1314],{"class":1166,"line":1202},[1164,1310,1311],{"class":1185},"\u003C/",[1164,1313,1292],{"class":1192},[1164,1315,1295],{"class":1185},[1164,1317,1318],{"class":1166,"line":1246},[1164,1319,1321],{"emptyLinePlaceholder":1320},true,"\n",[1164,1323,1324,1326,1329],{"class":1166,"line":1252},[1164,1325,1289],{"class":1185},[1164,1327,1328],{"class":1192},"style",[1164,1330,1295],{"class":1185},[1164,1332,1334,1336,1340],{"class":1166,"line":1333},6,[1164,1335,1152],{"class":1185},[1164,1337,1339],{"class":1338},"s52Pk","page-enter-active",[1164,1341,1342],{"class":1185},",\n",[1164,1344,1346,1348,1351],{"class":1166,"line":1345},7,[1164,1347,1152],{"class":1185},[1164,1349,1350],{"class":1338},"page-leave-active",[1164,1352,1199],{"class":1185},[1164,1354,1356,1360,1362,1365,1369],{"class":1166,"line":1355},8,[1164,1357,1359],{"class":1358},"spFsF","  transition",[1164,1361,1196],{"class":1185},[1164,1363,1364],{"class":1181}," all ",[1164,1366,1368],{"class":1367},"sYRBq","0.4s",[1164,1370,1371],{"class":1185},";\n",[1164,1373,1375],{"class":1166,"line":1374},9,[1164,1376,1377],{"class":1185},"}\n",[1164,1379,1381,1383,1386],{"class":1166,"line":1380},10,[1164,1382,1152],{"class":1185},[1164,1384,1385],{"class":1338},"page-enter-from",[1164,1387,1342],{"class":1185},[1164,1389,1391,1393,1396],{"class":1166,"line":1390},11,[1164,1392,1152],{"class":1185},[1164,1394,1395],{"class":1338},"page-leave-to",[1164,1397,1199],{"class":1185},[1164,1399,1401,1404,1406,1409],{"class":1166,"line":1400},12,[1164,1402,1403],{"class":1358},"  opacity",[1164,1405,1196],{"class":1185},[1164,1407,1408],{"class":1367}," 0",[1164,1410,1371],{"class":1185},[1164,1412,1414,1417,1419,1422,1424,1427],{"class":1166,"line":1413},13,[1164,1415,1416],{"class":1358},"  filter",[1164,1418,1196],{"class":1185},[1164,1420,1421],{"class":1177}," blur",[1164,1423,1182],{"class":1185},[1164,1425,1426],{"class":1367},"1rem",[1164,1428,1429],{"class":1185},");\n",[1164,1431,1433],{"class":1166,"line":1432},14,[1164,1434,1377],{"class":1185},[1164,1436,1438,1440,1442],{"class":1166,"line":1437},15,[1164,1439,1311],{"class":1185},[1164,1441,1328],{"class":1192},[1164,1443,1295],{"class":1185},[1154,1445,1448],{"className":1280,"code":1446,"filename":1447,"language":1282,"meta":1160,"style":1160},"\u003Ctemplate>\n  \u003Cdiv>\n    \u003Ch1>Home page\u003C/h1>\n    \u003CNuxtLink to=\"/about\">About page\u003C/NuxtLink>\n  \u003C/div>\n\u003C/template>\n","pages/index.vue",[1138,1449,1450,1458,1467,1487,1520,1529],{"__ignoreMap":1160},[1164,1451,1452,1454,1456],{"class":1166,"line":1167},[1164,1453,1289],{"class":1185},[1164,1455,1292],{"class":1192},[1164,1457,1295],{"class":1185},[1164,1459,1460,1462,1465],{"class":1166,"line":1189},[1164,1461,1300],{"class":1185},[1164,1463,1464],{"class":1192},"div",[1164,1466,1295],{"class":1185},[1164,1468,1469,1472,1475,1478,1481,1483,1485],{"class":1166,"line":1202},[1164,1470,1471],{"class":1185},"    \u003C",[1164,1473,1474],{"class":1192},"h1",[1164,1476,1477],{"class":1185},">",[1164,1479,1480],{"class":1181},"Home page",[1164,1482,1311],{"class":1185},[1164,1484,1474],{"class":1192},[1164,1486,1295],{"class":1185},[1164,1488,1489,1491,1494,1498,1501,1504,1507,1509,1511,1514,1516,1518],{"class":1166,"line":1246},[1164,1490,1471],{"class":1185},[1164,1492,1493],{"class":1192},"NuxtLink",[1164,1495,1497],{"class":1496},"smZ93"," to",[1164,1499,1500],{"class":1185},"=",[1164,1502,1503],{"class":1185},"\"",[1164,1505,1506],{"class":1221},"/about",[1164,1508,1503],{"class":1185},[1164,1510,1477],{"class":1185},[1164,1512,1513],{"class":1181},"About page",[1164,1515,1311],{"class":1185},[1164,1517,1493],{"class":1192},[1164,1519,1295],{"class":1185},[1164,1521,1522,1525,1527],{"class":1166,"line":1252},[1164,1523,1524],{"class":1185},"  \u003C/",[1164,1526,1464],{"class":1192},[1164,1528,1295],{"class":1185},[1164,1530,1531,1533,1535],{"class":1166,"line":1333},[1164,1532,1311],{"class":1185},[1164,1534,1292],{"class":1192},[1164,1536,1295],{"class":1185},[1154,1538,1541],{"className":1280,"code":1539,"filename":1540,"language":1282,"meta":1160,"style":1160},"\u003Ctemplate>\n  \u003Cdiv>\n    \u003Ch1>About page\u003C/h1>\n    \u003CNuxtLink to=\"/\">Home page\u003C/NuxtLink>\n  \u003C/div>\n\u003C/template>\n","pages/about.vue",[1138,1542,1543,1551,1559,1575,1602,1610],{"__ignoreMap":1160},[1164,1544,1545,1547,1549],{"class":1166,"line":1167},[1164,1546,1289],{"class":1185},[1164,1548,1292],{"class":1192},[1164,1550,1295],{"class":1185},[1164,1552,1553,1555,1557],{"class":1166,"line":1189},[1164,1554,1300],{"class":1185},[1164,1556,1464],{"class":1192},[1164,1558,1295],{"class":1185},[1164,1560,1561,1563,1565,1567,1569,1571,1573],{"class":1166,"line":1202},[1164,1562,1471],{"class":1185},[1164,1564,1474],{"class":1192},[1164,1566,1477],{"class":1185},[1164,1568,1513],{"class":1181},[1164,1570,1311],{"class":1185},[1164,1572,1474],{"class":1192},[1164,1574,1295],{"class":1185},[1164,1576,1577,1579,1581,1583,1585,1587,1590,1592,1594,1596,1598,1600],{"class":1166,"line":1246},[1164,1578,1471],{"class":1185},[1164,1580,1493],{"class":1192},[1164,1582,1497],{"class":1496},[1164,1584,1500],{"class":1185},[1164,1586,1503],{"class":1185},[1164,1588,1589],{"class":1221},"/",[1164,1591,1503],{"class":1185},[1164,1593,1477],{"class":1185},[1164,1595,1480],{"class":1181},[1164,1597,1311],{"class":1185},[1164,1599,1493],{"class":1192},[1164,1601,1295],{"class":1185},[1164,1603,1604,1606,1608],{"class":1166,"line":1252},[1164,1605,1524],{"class":1185},[1164,1607,1464],{"class":1192},[1164,1609,1295],{"class":1185},[1164,1611,1612,1614,1616],{"class":1166,"line":1333},[1164,1613,1311],{"class":1185},[1164,1615,1292],{"class":1192},[1164,1617,1295],{"class":1185},[1128,1619,1620],{},"This produces the following result when navigating between pages:",[1622,1623,1627,1628],"video",{"controls":1320,"className":1624,"poster":1626},[1625],"rounded","https://res.cloudinary.com/nuxt/video/upload/v1665061349/nuxt3/nuxt3-page-transitions_umwvmh.jpg","\n  ",[1629,1630],"source",{"src":1631,"type":1632},"https://res.cloudinary.com/nuxt/video/upload/v1665061349/nuxt3/nuxt3-page-transitions_umwvmh.mp4","video/mp4",[1128,1634,1635,1636,1639,1640,1644],{},"To set a different transition for a page, set the ",[1138,1637,1638],{},"pageTransition"," key in ",[1132,1641,1642],{"href":596},[1138,1643,595],{}," of the page:",[1276,1646,1647,1726],{},[1154,1648,1650],{"className":1280,"code":1649,"filename":1540,"language":1282,"meta":1159,"style":1160},"\u003Cscript setup lang=\"ts\">\ndefinePageMeta({\n  pageTransition: {\n    name: 'rotate'\n  }\n})\n\u003C/script>\n",[1138,1651,1652,1675,1683,1692,1707,1712,1718],{"__ignoreMap":1160},[1164,1653,1654,1656,1659,1662,1665,1667,1669,1671,1673],{"class":1166,"line":1167},[1164,1655,1289],{"class":1185},[1164,1657,1658],{"class":1192},"script",[1164,1660,1661],{"class":1496}," setup",[1164,1663,1664],{"class":1496}," lang",[1164,1666,1500],{"class":1185},[1164,1668,1503],{"class":1185},[1164,1670,1158],{"class":1221},[1164,1672,1503],{"class":1185},[1164,1674,1295],{"class":1185},[1164,1676,1677,1679,1681],{"class":1166,"line":1189},[1164,1678,595],{"class":1177},[1164,1680,1182],{"class":1181},[1164,1682,1186],{"class":1185},[1164,1684,1685,1688,1690],{"class":1166,"line":1202},[1164,1686,1687],{"class":1192},"  pageTransition",[1164,1689,1196],{"class":1185},[1164,1691,1199],{"class":1185},[1164,1693,1694,1697,1699,1701,1704],{"class":1166,"line":1246},[1164,1695,1696],{"class":1192},"    name",[1164,1698,1196],{"class":1185},[1164,1700,1218],{"class":1185},[1164,1702,1703],{"class":1221},"rotate",[1164,1705,1706],{"class":1185},"'\n",[1164,1708,1709],{"class":1166,"line":1252},[1164,1710,1711],{"class":1185},"  }\n",[1164,1713,1714,1716],{"class":1166,"line":1333},[1164,1715,1255],{"class":1185},[1164,1717,1258],{"class":1181},[1164,1719,1720,1722,1724],{"class":1166,"line":1345},[1164,1721,1311],{"class":1185},[1164,1723,1658],{"class":1192},[1164,1725,1295],{"class":1185},[1154,1727,1729],{"className":1280,"code":1728,"filename":248,"language":1282,"meta":1160,"style":1160},"\u003Ctemplate>\n  \u003CNuxtPage />\n\u003C/template>\n\n\u003Cstyle>\n/* ... */\n.rotate-enter-active,\n.rotate-leave-active {\n  transition: all 0.4s;\n}\n.rotate-enter-from,\n.rotate-leave-to {\n  opacity: 0;\n  transform: rotate3d(1, 1, 1, 15deg);\n}\n\u003C/style>\n",[1138,1730,1731,1739,1747,1755,1759,1767,1773,1782,1791,1803,1807,1816,1825,1835,1866,1870],{"__ignoreMap":1160},[1164,1732,1733,1735,1737],{"class":1166,"line":1167},[1164,1734,1289],{"class":1185},[1164,1736,1292],{"class":1192},[1164,1738,1295],{"class":1185},[1164,1740,1741,1743,1745],{"class":1166,"line":1189},[1164,1742,1300],{"class":1185},[1164,1744,1303],{"class":1192},[1164,1746,1306],{"class":1185},[1164,1748,1749,1751,1753],{"class":1166,"line":1202},[1164,1750,1311],{"class":1185},[1164,1752,1292],{"class":1192},[1164,1754,1295],{"class":1185},[1164,1756,1757],{"class":1166,"line":1246},[1164,1758,1321],{"emptyLinePlaceholder":1320},[1164,1760,1761,1763,1765],{"class":1166,"line":1252},[1164,1762,1289],{"class":1185},[1164,1764,1328],{"class":1192},[1164,1766,1295],{"class":1185},[1164,1768,1769],{"class":1166,"line":1333},[1164,1770,1772],{"class":1771},"sWuyu","/* ... */\n",[1164,1774,1775,1777,1780],{"class":1166,"line":1345},[1164,1776,1152],{"class":1185},[1164,1778,1779],{"class":1338},"rotate-enter-active",[1164,1781,1342],{"class":1185},[1164,1783,1784,1786,1789],{"class":1166,"line":1355},[1164,1785,1152],{"class":1185},[1164,1787,1788],{"class":1338},"rotate-leave-active",[1164,1790,1199],{"class":1185},[1164,1792,1793,1795,1797,1799,1801],{"class":1166,"line":1374},[1164,1794,1359],{"class":1358},[1164,1796,1196],{"class":1185},[1164,1798,1364],{"class":1181},[1164,1800,1368],{"class":1367},[1164,1802,1371],{"class":1185},[1164,1804,1805],{"class":1166,"line":1380},[1164,1806,1377],{"class":1185},[1164,1808,1809,1811,1814],{"class":1166,"line":1390},[1164,1810,1152],{"class":1185},[1164,1812,1813],{"class":1338},"rotate-enter-from",[1164,1815,1342],{"class":1185},[1164,1817,1818,1820,1823],{"class":1166,"line":1400},[1164,1819,1152],{"class":1185},[1164,1821,1822],{"class":1338},"rotate-leave-to",[1164,1824,1199],{"class":1185},[1164,1826,1827,1829,1831,1833],{"class":1166,"line":1413},[1164,1828,1403],{"class":1358},[1164,1830,1196],{"class":1185},[1164,1832,1408],{"class":1367},[1164,1834,1371],{"class":1185},[1164,1836,1837,1840,1842,1845,1847,1850,1852,1855,1857,1859,1861,1864],{"class":1166,"line":1432},[1164,1838,1839],{"class":1358},"  transform",[1164,1841,1196],{"class":1185},[1164,1843,1844],{"class":1177}," rotate3d",[1164,1846,1182],{"class":1185},[1164,1848,1849],{"class":1367},"1",[1164,1851,1228],{"class":1185},[1164,1853,1854],{"class":1367}," 1",[1164,1856,1228],{"class":1185},[1164,1858,1854],{"class":1367},[1164,1860,1228],{"class":1185},[1164,1862,1863],{"class":1367}," 15deg",[1164,1865,1429],{"class":1185},[1164,1867,1868],{"class":1166,"line":1437},[1164,1869,1377],{"class":1185},[1164,1871,1873,1875,1877],{"class":1166,"line":1872},16,[1164,1874,1311],{"class":1185},[1164,1876,1328],{"class":1192},[1164,1878,1295],{"class":1185},[1128,1880,1881],{},"Moving to the about page will add the 3d rotation effect:",[1622,1883,1627,1886],{"controls":1320,"className":1884,"poster":1885},[1625],"https://res.cloudinary.com/nuxt/video/upload/v1665063233/nuxt3/nuxt3-page-transitions-cutom.jpg",[1629,1887],{"src":1888,"type":1632},"https://res.cloudinary.com/nuxt/video/upload/v1665063233/nuxt3/nuxt3-page-transitions-cutom.mp4",[1143,1890,1892],{"id":1891},"layout-transitions","Layout Transitions",[1128,1894,1895,1896,1152],{},"You can enable layout transitions to apply an automatic transition for all your ",[1132,1897,191],{"href":192},[1154,1899,1901],{"className":1156,"code":1900,"filename":260,"language":1158,"meta":1159,"style":1160},"export default defineNuxtConfig({\n  app: {\n    layoutTransition: { name: 'layout', mode: 'out-in' }\n  },\n})\n",[1138,1902,1903,1915,1923,1957,1961],{"__ignoreMap":1160},[1164,1904,1905,1907,1909,1911,1913],{"class":1166,"line":1167},[1164,1906,1171],{"class":1170},[1164,1908,1174],{"class":1170},[1164,1910,1178],{"class":1177},[1164,1912,1182],{"class":1181},[1164,1914,1186],{"class":1185},[1164,1916,1917,1919,1921],{"class":1166,"line":1189},[1164,1918,1193],{"class":1192},[1164,1920,1196],{"class":1185},[1164,1922,1199],{"class":1185},[1164,1924,1925,1928,1930,1932,1934,1936,1938,1941,1943,1945,1947,1949,1951,1953,1955],{"class":1166,"line":1202},[1164,1926,1927],{"class":1192},"    layoutTransition",[1164,1929,1196],{"class":1185},[1164,1931,1210],{"class":1185},[1164,1933,1213],{"class":1192},[1164,1935,1196],{"class":1185},[1164,1937,1218],{"class":1185},[1164,1939,1940],{"class":1221},"layout",[1164,1942,1225],{"class":1185},[1164,1944,1228],{"class":1185},[1164,1946,1231],{"class":1192},[1164,1948,1196],{"class":1185},[1164,1950,1218],{"class":1185},[1164,1952,1238],{"class":1221},[1164,1954,1225],{"class":1185},[1164,1956,1243],{"class":1185},[1164,1958,1959],{"class":1166,"line":1246},[1164,1960,1249],{"class":1185},[1164,1962,1963,1965],{"class":1166,"line":1252},[1164,1964,1255],{"class":1185},[1164,1966,1258],{"class":1181},[1128,1968,1969,1970,1196],{},"To start adding transition between your pages and layouts, add the following CSS to your ",[1132,1971,1972],{"href":249},[1138,1973,248],{},[1276,1975,1976,2113,2222,2355,2433],{},[1154,1977,1979],{"className":1280,"code":1978,"filename":248,"language":1282,"meta":1160,"style":1160},"\u003Ctemplate>\n  \u003CNuxtLayout>\n    \u003CNuxtPage />\n  \u003C/NuxtLayout>\n\u003C/template>\n\n\u003Cstyle>\n.layout-enter-active,\n.layout-leave-active {\n  transition: all 0.4s;\n}\n.layout-enter-from,\n.layout-leave-to {\n  filter: grayscale(1);\n}\n\u003C/style>\n",[1138,1980,1981,1989,1998,2006,2014,2022,2026,2034,2043,2052,2064,2068,2077,2086,2101,2105],{"__ignoreMap":1160},[1164,1982,1983,1985,1987],{"class":1166,"line":1167},[1164,1984,1289],{"class":1185},[1164,1986,1292],{"class":1192},[1164,1988,1295],{"class":1185},[1164,1990,1991,1993,1996],{"class":1166,"line":1189},[1164,1992,1300],{"class":1185},[1164,1994,1995],{"class":1192},"NuxtLayout",[1164,1997,1295],{"class":1185},[1164,1999,2000,2002,2004],{"class":1166,"line":1202},[1164,2001,1471],{"class":1185},[1164,2003,1303],{"class":1192},[1164,2005,1306],{"class":1185},[1164,2007,2008,2010,2012],{"class":1166,"line":1246},[1164,2009,1524],{"class":1185},[1164,2011,1995],{"class":1192},[1164,2013,1295],{"class":1185},[1164,2015,2016,2018,2020],{"class":1166,"line":1252},[1164,2017,1311],{"class":1185},[1164,2019,1292],{"class":1192},[1164,2021,1295],{"class":1185},[1164,2023,2024],{"class":1166,"line":1333},[1164,2025,1321],{"emptyLinePlaceholder":1320},[1164,2027,2028,2030,2032],{"class":1166,"line":1345},[1164,2029,1289],{"class":1185},[1164,2031,1328],{"class":1192},[1164,2033,1295],{"class":1185},[1164,2035,2036,2038,2041],{"class":1166,"line":1355},[1164,2037,1152],{"class":1185},[1164,2039,2040],{"class":1338},"layout-enter-active",[1164,2042,1342],{"class":1185},[1164,2044,2045,2047,2050],{"class":1166,"line":1374},[1164,2046,1152],{"class":1185},[1164,2048,2049],{"class":1338},"layout-leave-active",[1164,2051,1199],{"class":1185},[1164,2053,2054,2056,2058,2060,2062],{"class":1166,"line":1380},[1164,2055,1359],{"class":1358},[1164,2057,1196],{"class":1185},[1164,2059,1364],{"class":1181},[1164,2061,1368],{"class":1367},[1164,2063,1371],{"class":1185},[1164,2065,2066],{"class":1166,"line":1390},[1164,2067,1377],{"class":1185},[1164,2069,2070,2072,2075],{"class":1166,"line":1400},[1164,2071,1152],{"class":1185},[1164,2073,2074],{"class":1338},"layout-enter-from",[1164,2076,1342],{"class":1185},[1164,2078,2079,2081,2084],{"class":1166,"line":1413},[1164,2080,1152],{"class":1185},[1164,2082,2083],{"class":1338},"layout-leave-to",[1164,2085,1199],{"class":1185},[1164,2087,2088,2090,2092,2095,2097,2099],{"class":1166,"line":1432},[1164,2089,1416],{"class":1358},[1164,2091,1196],{"class":1185},[1164,2093,2094],{"class":1177}," grayscale",[1164,2096,1182],{"class":1185},[1164,2098,1849],{"class":1367},[1164,2100,1429],{"class":1185},[1164,2102,2103],{"class":1166,"line":1437},[1164,2104,1377],{"class":1185},[1164,2106,2107,2109,2111],{"class":1166,"line":1872},[1164,2108,1311],{"class":1185},[1164,2110,1328],{"class":1192},[1164,2112,1295],{"class":1185},[1154,2114,2117],{"className":1280,"code":2115,"filename":2116,"language":1282,"meta":1160,"style":1160},"\u003Ctemplate>\n  \u003Cdiv>\n    \u003Cpre>default layout\u003C/pre>\n    \u003Cslot />\n  \u003C/div>\n\u003C/template>\n\n\u003Cstyle scoped>\ndiv {\n  background-color: lightgreen;\n}\n\u003C/style>\n","layouts/default.vue",[1138,2118,2119,2127,2135,2152,2161,2169,2177,2181,2192,2198,2210,2214],{"__ignoreMap":1160},[1164,2120,2121,2123,2125],{"class":1166,"line":1167},[1164,2122,1289],{"class":1185},[1164,2124,1292],{"class":1192},[1164,2126,1295],{"class":1185},[1164,2128,2129,2131,2133],{"class":1166,"line":1189},[1164,2130,1300],{"class":1185},[1164,2132,1464],{"class":1192},[1164,2134,1295],{"class":1185},[1164,2136,2137,2139,2141,2143,2146,2148,2150],{"class":1166,"line":1202},[1164,2138,1471],{"class":1185},[1164,2140,1154],{"class":1192},[1164,2142,1477],{"class":1185},[1164,2144,2145],{"class":1181},"default layout",[1164,2147,1311],{"class":1185},[1164,2149,1154],{"class":1192},[1164,2151,1295],{"class":1185},[1164,2153,2154,2156,2159],{"class":1166,"line":1246},[1164,2155,1471],{"class":1185},[1164,2157,2158],{"class":1192},"slot",[1164,2160,1306],{"class":1185},[1164,2162,2163,2165,2167],{"class":1166,"line":1252},[1164,2164,1524],{"class":1185},[1164,2166,1464],{"class":1192},[1164,2168,1295],{"class":1185},[1164,2170,2171,2173,2175],{"class":1166,"line":1333},[1164,2172,1311],{"class":1185},[1164,2174,1292],{"class":1192},[1164,2176,1295],{"class":1185},[1164,2178,2179],{"class":1166,"line":1345},[1164,2180,1321],{"emptyLinePlaceholder":1320},[1164,2182,2183,2185,2187,2190],{"class":1166,"line":1355},[1164,2184,1289],{"class":1185},[1164,2186,1328],{"class":1192},[1164,2188,2189],{"class":1496}," scoped",[1164,2191,1295],{"class":1185},[1164,2193,2194,2196],{"class":1166,"line":1374},[1164,2195,1464],{"class":1338},[1164,2197,1199],{"class":1185},[1164,2199,2200,2203,2205,2208],{"class":1166,"line":1380},[1164,2201,2202],{"class":1358},"  background-color",[1164,2204,1196],{"class":1185},[1164,2206,2207],{"class":1181}," lightgreen",[1164,2209,1371],{"class":1185},[1164,2211,2212],{"class":1166,"line":1390},[1164,2213,1377],{"class":1185},[1164,2215,2216,2218,2220],{"class":1166,"line":1400},[1164,2217,1311],{"class":1185},[1164,2219,1328],{"class":1192},[1164,2221,1295],{"class":1185},[1154,2223,2226],{"className":1280,"code":2224,"filename":2225,"language":1282,"meta":1160,"style":1160},"\u003Ctemplate>\n  \u003Cdiv>\n    \u003Cpre>orange layout\u003C/pre>\n    \u003Cslot />\n  \u003C/div>\n\u003C/template>\n\n\u003Cstyle scoped>\ndiv {\n  background-color: #eebb90;\n  padding: 20px;\n  height: 100vh;\n}\n\u003C/style>\n","layouts/orange.vue",[1138,2227,2228,2236,2244,2261,2269,2277,2285,2289,2299,2305,2319,2331,2343,2347],{"__ignoreMap":1160},[1164,2229,2230,2232,2234],{"class":1166,"line":1167},[1164,2231,1289],{"class":1185},[1164,2233,1292],{"class":1192},[1164,2235,1295],{"class":1185},[1164,2237,2238,2240,2242],{"class":1166,"line":1189},[1164,2239,1300],{"class":1185},[1164,2241,1464],{"class":1192},[1164,2243,1295],{"class":1185},[1164,2245,2246,2248,2250,2252,2255,2257,2259],{"class":1166,"line":1202},[1164,2247,1471],{"class":1185},[1164,2249,1154],{"class":1192},[1164,2251,1477],{"class":1185},[1164,2253,2254],{"class":1181},"orange layout",[1164,2256,1311],{"class":1185},[1164,2258,1154],{"class":1192},[1164,2260,1295],{"class":1185},[1164,2262,2263,2265,2267],{"class":1166,"line":1246},[1164,2264,1471],{"class":1185},[1164,2266,2158],{"class":1192},[1164,2268,1306],{"class":1185},[1164,2270,2271,2273,2275],{"class":1166,"line":1252},[1164,2272,1524],{"class":1185},[1164,2274,1464],{"class":1192},[1164,2276,1295],{"class":1185},[1164,2278,2279,2281,2283],{"class":1166,"line":1333},[1164,2280,1311],{"class":1185},[1164,2282,1292],{"class":1192},[1164,2284,1295],{"class":1185},[1164,2286,2287],{"class":1166,"line":1345},[1164,2288,1321],{"emptyLinePlaceholder":1320},[1164,2290,2291,2293,2295,2297],{"class":1166,"line":1355},[1164,2292,1289],{"class":1185},[1164,2294,1328],{"class":1192},[1164,2296,2189],{"class":1496},[1164,2298,1295],{"class":1185},[1164,2300,2301,2303],{"class":1166,"line":1374},[1164,2302,1464],{"class":1338},[1164,2304,1199],{"class":1185},[1164,2306,2307,2309,2311,2314,2317],{"class":1166,"line":1380},[1164,2308,2202],{"class":1358},[1164,2310,1196],{"class":1185},[1164,2312,2313],{"class":1185}," #",[1164,2315,2316],{"class":1181},"eebb90",[1164,2318,1371],{"class":1185},[1164,2320,2321,2324,2326,2329],{"class":1166,"line":1390},[1164,2322,2323],{"class":1358},"  padding",[1164,2325,1196],{"class":1185},[1164,2327,2328],{"class":1367}," 20px",[1164,2330,1371],{"class":1185},[1164,2332,2333,2336,2338,2341],{"class":1166,"line":1400},[1164,2334,2335],{"class":1358},"  height",[1164,2337,1196],{"class":1185},[1164,2339,2340],{"class":1367}," 100vh",[1164,2342,1371],{"class":1185},[1164,2344,2345],{"class":1166,"line":1413},[1164,2346,1377],{"class":1185},[1164,2348,2349,2351,2353],{"class":1166,"line":1432},[1164,2350,1311],{"class":1185},[1164,2352,1328],{"class":1192},[1164,2354,1295],{"class":1185},[1154,2356,2357],{"className":1280,"code":1446,"filename":1447,"language":1282,"meta":1160,"style":1160},[1138,2358,2359,2367,2375,2391,2417,2425],{"__ignoreMap":1160},[1164,2360,2361,2363,2365],{"class":1166,"line":1167},[1164,2362,1289],{"class":1185},[1164,2364,1292],{"class":1192},[1164,2366,1295],{"class":1185},[1164,2368,2369,2371,2373],{"class":1166,"line":1189},[1164,2370,1300],{"class":1185},[1164,2372,1464],{"class":1192},[1164,2374,1295],{"class":1185},[1164,2376,2377,2379,2381,2383,2385,2387,2389],{"class":1166,"line":1202},[1164,2378,1471],{"class":1185},[1164,2380,1474],{"class":1192},[1164,2382,1477],{"class":1185},[1164,2384,1480],{"class":1181},[1164,2386,1311],{"class":1185},[1164,2388,1474],{"class":1192},[1164,2390,1295],{"class":1185},[1164,2392,2393,2395,2397,2399,2401,2403,2405,2407,2409,2411,2413,2415],{"class":1166,"line":1246},[1164,2394,1471],{"class":1185},[1164,2396,1493],{"class":1192},[1164,2398,1497],{"class":1496},[1164,2400,1500],{"class":1185},[1164,2402,1503],{"class":1185},[1164,2404,1506],{"class":1221},[1164,2406,1503],{"class":1185},[1164,2408,1477],{"class":1185},[1164,2410,1513],{"class":1181},[1164,2412,1311],{"class":1185},[1164,2414,1493],{"class":1192},[1164,2416,1295],{"class":1185},[1164,2418,2419,2421,2423],{"class":1166,"line":1252},[1164,2420,1524],{"class":1185},[1164,2422,1464],{"class":1192},[1164,2424,1295],{"class":1185},[1164,2426,2427,2429,2431],{"class":1166,"line":1333},[1164,2428,1311],{"class":1185},[1164,2430,1292],{"class":1192},[1164,2432,1295],{"class":1185},[1154,2434,2436],{"className":1280,"code":2435,"filename":1540,"language":1282,"meta":1160,"style":1160},"\u003Cscript setup lang=\"ts\">\ndefinePageMeta({\n  layout: 'orange'\n})\n\u003C/script>\n\n\u003Ctemplate>\n  \u003Cdiv>\n    \u003Ch1>About page\u003C/h1>\n    \u003CNuxtLink to=\"/\">Home page\u003C/NuxtLink>\n  \u003C/div>\n\u003C/template>\n",[1138,2437,2438,2458,2466,2480,2486,2494,2498,2506,2514,2530,2556,2564],{"__ignoreMap":1160},[1164,2439,2440,2442,2444,2446,2448,2450,2452,2454,2456],{"class":1166,"line":1167},[1164,2441,1289],{"class":1185},[1164,2443,1658],{"class":1192},[1164,2445,1661],{"class":1496},[1164,2447,1664],{"class":1496},[1164,2449,1500],{"class":1185},[1164,2451,1503],{"class":1185},[1164,2453,1158],{"class":1221},[1164,2455,1503],{"class":1185},[1164,2457,1295],{"class":1185},[1164,2459,2460,2462,2464],{"class":1166,"line":1189},[1164,2461,595],{"class":1177},[1164,2463,1182],{"class":1181},[1164,2465,1186],{"class":1185},[1164,2467,2468,2471,2473,2475,2478],{"class":1166,"line":1202},[1164,2469,2470],{"class":1192},"  layout",[1164,2472,1196],{"class":1185},[1164,2474,1218],{"class":1185},[1164,2476,2477],{"class":1221},"orange",[1164,2479,1706],{"class":1185},[1164,2481,2482,2484],{"class":1166,"line":1246},[1164,2483,1255],{"class":1185},[1164,2485,1258],{"class":1181},[1164,2487,2488,2490,2492],{"class":1166,"line":1252},[1164,2489,1311],{"class":1185},[1164,2491,1658],{"class":1192},[1164,2493,1295],{"class":1185},[1164,2495,2496],{"class":1166,"line":1333},[1164,2497,1321],{"emptyLinePlaceholder":1320},[1164,2499,2500,2502,2504],{"class":1166,"line":1345},[1164,2501,1289],{"class":1185},[1164,2503,1292],{"class":1192},[1164,2505,1295],{"class":1185},[1164,2507,2508,2510,2512],{"class":1166,"line":1355},[1164,2509,1300],{"class":1185},[1164,2511,1464],{"class":1192},[1164,2513,1295],{"class":1185},[1164,2515,2516,2518,2520,2522,2524,2526,2528],{"class":1166,"line":1374},[1164,2517,1471],{"class":1185},[1164,2519,1474],{"class":1192},[1164,2521,1477],{"class":1185},[1164,2523,1513],{"class":1181},[1164,2525,1311],{"class":1185},[1164,2527,1474],{"class":1192},[1164,2529,1295],{"class":1185},[1164,2531,2532,2534,2536,2538,2540,2542,2544,2546,2548,2550,2552,2554],{"class":1166,"line":1380},[1164,2533,1471],{"class":1185},[1164,2535,1493],{"class":1192},[1164,2537,1497],{"class":1496},[1164,2539,1500],{"class":1185},[1164,2541,1503],{"class":1185},[1164,2543,1589],{"class":1221},[1164,2545,1503],{"class":1185},[1164,2547,1477],{"class":1185},[1164,2549,1480],{"class":1181},[1164,2551,1311],{"class":1185},[1164,2553,1493],{"class":1192},[1164,2555,1295],{"class":1185},[1164,2557,2558,2560,2562],{"class":1166,"line":1390},[1164,2559,1524],{"class":1185},[1164,2561,1464],{"class":1192},[1164,2563,1295],{"class":1185},[1164,2565,2566,2568,2570],{"class":1166,"line":1400},[1164,2567,1311],{"class":1185},[1164,2569,1292],{"class":1192},[1164,2571,1295],{"class":1185},[1128,2573,1620],{},[1622,2575,1627,2578],{"controls":1320,"className":2576,"poster":2577},[1625],"https://res.cloudinary.com/nuxt/video/upload/v1665065289/nuxt3/nuxt3-layouts-transitions_c9hwlx.jpg",[1629,2579],{"src":2580,"type":1632},"https://res.cloudinary.com/nuxt/video/upload/v1665065289/nuxt3/nuxt3-layouts-transitions_c9hwlx.mp4",[1128,2582,2583,2584,2586,2587,2590,2591,1196],{},"Similar to ",[1138,2585,1638],{},", you can apply a custom ",[1138,2588,2589],{},"layoutTransition"," to the page component using ",[1138,2592,595],{},[1154,2594,2596],{"className":1280,"code":2595,"filename":1540,"language":1282,"meta":1159,"style":1160},"\u003Cscript setup lang=\"ts\">\ndefinePageMeta({\n  layout: 'orange',\n  layoutTransition: {\n    name: 'slide-in'\n  }\n})\n\u003C/script>\n",[1138,2597,2598,2618,2626,2640,2649,2662,2666,2672],{"__ignoreMap":1160},[1164,2599,2600,2602,2604,2606,2608,2610,2612,2614,2616],{"class":1166,"line":1167},[1164,2601,1289],{"class":1185},[1164,2603,1658],{"class":1192},[1164,2605,1661],{"class":1496},[1164,2607,1664],{"class":1496},[1164,2609,1500],{"class":1185},[1164,2611,1503],{"class":1185},[1164,2613,1158],{"class":1221},[1164,2615,1503],{"class":1185},[1164,2617,1295],{"class":1185},[1164,2619,2620,2622,2624],{"class":1166,"line":1189},[1164,2621,595],{"class":1177},[1164,2623,1182],{"class":1181},[1164,2625,1186],{"class":1185},[1164,2627,2628,2630,2632,2634,2636,2638],{"class":1166,"line":1202},[1164,2629,2470],{"class":1192},[1164,2631,1196],{"class":1185},[1164,2633,1218],{"class":1185},[1164,2635,2477],{"class":1221},[1164,2637,1225],{"class":1185},[1164,2639,1342],{"class":1185},[1164,2641,2642,2645,2647],{"class":1166,"line":1246},[1164,2643,2644],{"class":1192},"  layoutTransition",[1164,2646,1196],{"class":1185},[1164,2648,1199],{"class":1185},[1164,2650,2651,2653,2655,2657,2660],{"class":1166,"line":1252},[1164,2652,1696],{"class":1192},[1164,2654,1196],{"class":1185},[1164,2656,1218],{"class":1185},[1164,2658,2659],{"class":1221},"slide-in",[1164,2661,1706],{"class":1185},[1164,2663,2664],{"class":1166,"line":1333},[1164,2665,1711],{"class":1185},[1164,2667,2668,2670],{"class":1166,"line":1345},[1164,2669,1255],{"class":1185},[1164,2671,1258],{"class":1181},[1164,2673,2674,2676,2678],{"class":1166,"line":1355},[1164,2675,1311],{"class":1185},[1164,2677,1658],{"class":1192},[1164,2679,1295],{"class":1185},[1143,2681,2683],{"id":2682},"global-settings","Global Settings",[1128,2685,2686,2687,1152],{},"You can customize these default transition names globally using ",[1138,2688,2689],{},"nuxt.config",[1128,2691,2692,2693,2695,2696,2698,2699,2706,2707,2710,2711,2714],{},"Both ",[1138,2694,1638],{}," and ",[1138,2697,2589],{}," keys accept ",[1132,2700,2703],{"href":2701,"rel":2702},"https://vuejs.org/api/built-in-components.html#transition",[1136],[1138,2704,2705],{},"TransitionProps"," as JSON serializable values where you can pass the ",[1138,2708,2709],{},"name",", ",[1138,2712,2713],{},"mode"," and other valid transition-props of the custom CSS transition.",[1154,2716,2718],{"className":1156,"code":2717,"filename":260,"language":1158,"meta":1159,"style":1160},"export default defineNuxtConfig({\n  app: {\n    pageTransition: {\n      name: 'fade',\n      mode: 'out-in' // default\n    },\n    layoutTransition: {\n      name: 'slide',\n      mode: 'out-in' // default\n    }\n  }\n})\n",[1138,2719,2720,2732,2740,2748,2764,2780,2785,2793,2808,2822,2827,2831],{"__ignoreMap":1160},[1164,2721,2722,2724,2726,2728,2730],{"class":1166,"line":1167},[1164,2723,1171],{"class":1170},[1164,2725,1174],{"class":1170},[1164,2727,1178],{"class":1177},[1164,2729,1182],{"class":1181},[1164,2731,1186],{"class":1185},[1164,2733,2734,2736,2738],{"class":1166,"line":1189},[1164,2735,1193],{"class":1192},[1164,2737,1196],{"class":1185},[1164,2739,1199],{"class":1185},[1164,2741,2742,2744,2746],{"class":1166,"line":1202},[1164,2743,1205],{"class":1192},[1164,2745,1196],{"class":1185},[1164,2747,1199],{"class":1185},[1164,2749,2750,2753,2755,2757,2760,2762],{"class":1166,"line":1246},[1164,2751,2752],{"class":1192},"      name",[1164,2754,1196],{"class":1185},[1164,2756,1218],{"class":1185},[1164,2758,2759],{"class":1221},"fade",[1164,2761,1225],{"class":1185},[1164,2763,1342],{"class":1185},[1164,2765,2766,2769,2771,2773,2775,2777],{"class":1166,"line":1252},[1164,2767,2768],{"class":1192},"      mode",[1164,2770,1196],{"class":1185},[1164,2772,1218],{"class":1185},[1164,2774,1238],{"class":1221},[1164,2776,1225],{"class":1185},[1164,2778,2779],{"class":1771}," // default\n",[1164,2781,2782],{"class":1166,"line":1333},[1164,2783,2784],{"class":1185},"    },\n",[1164,2786,2787,2789,2791],{"class":1166,"line":1345},[1164,2788,1927],{"class":1192},[1164,2790,1196],{"class":1185},[1164,2792,1199],{"class":1185},[1164,2794,2795,2797,2799,2801,2804,2806],{"class":1166,"line":1355},[1164,2796,2752],{"class":1192},[1164,2798,1196],{"class":1185},[1164,2800,1218],{"class":1185},[1164,2802,2803],{"class":1221},"slide",[1164,2805,1225],{"class":1185},[1164,2807,1342],{"class":1185},[1164,2809,2810,2812,2814,2816,2818,2820],{"class":1166,"line":1374},[1164,2811,2768],{"class":1192},[1164,2813,1196],{"class":1185},[1164,2815,1218],{"class":1185},[1164,2817,1238],{"class":1221},[1164,2819,1225],{"class":1185},[1164,2821,2779],{"class":1771},[1164,2823,2824],{"class":1166,"line":1380},[1164,2825,2826],{"class":1185},"    }\n",[1164,2828,2829],{"class":1166,"line":1390},[1164,2830,1711],{"class":1185},[1164,2832,2833,2835],{"class":1166,"line":1400},[1164,2834,1255],{"class":1185},[1164,2836,1258],{"class":1181},[2838,2839,2840],"warning",{},[1128,2841,2842,2843,2845],{},"If you change the ",[1138,2844,2709],{}," property, you also have to rename the CSS classes accordingly.",[1128,2847,2848,2849,2851,2852,2854],{},"To override the global transition property, use the ",[1138,2850,595],{}," to define page or layout transitions for a single Nuxt page and override any page or layout transitions that are defined globally in ",[1138,2853,2689],{}," file.",[1154,2856,2859],{"className":1280,"code":2857,"filename":2858,"language":1282,"meta":1159,"style":1160},"\u003Cscript setup lang=\"ts\">\ndefinePageMeta({\n  pageTransition: {\n    name: 'bounce',\n    mode: 'out-in' // default\n  }\n})\n\u003C/script>\n","pages/some-page.vue",[1138,2860,2861,2881,2889,2897,2912,2927,2931,2937],{"__ignoreMap":1160},[1164,2862,2863,2865,2867,2869,2871,2873,2875,2877,2879],{"class":1166,"line":1167},[1164,2864,1289],{"class":1185},[1164,2866,1658],{"class":1192},[1164,2868,1661],{"class":1496},[1164,2870,1664],{"class":1496},[1164,2872,1500],{"class":1185},[1164,2874,1503],{"class":1185},[1164,2876,1158],{"class":1221},[1164,2878,1503],{"class":1185},[1164,2880,1295],{"class":1185},[1164,2882,2883,2885,2887],{"class":1166,"line":1189},[1164,2884,595],{"class":1177},[1164,2886,1182],{"class":1181},[1164,2888,1186],{"class":1185},[1164,2890,2891,2893,2895],{"class":1166,"line":1202},[1164,2892,1687],{"class":1192},[1164,2894,1196],{"class":1185},[1164,2896,1199],{"class":1185},[1164,2898,2899,2901,2903,2905,2908,2910],{"class":1166,"line":1246},[1164,2900,1696],{"class":1192},[1164,2902,1196],{"class":1185},[1164,2904,1218],{"class":1185},[1164,2906,2907],{"class":1221},"bounce",[1164,2909,1225],{"class":1185},[1164,2911,1342],{"class":1185},[1164,2913,2914,2917,2919,2921,2923,2925],{"class":1166,"line":1252},[1164,2915,2916],{"class":1192},"    mode",[1164,2918,1196],{"class":1185},[1164,2920,1218],{"class":1185},[1164,2922,1238],{"class":1221},[1164,2924,1225],{"class":1185},[1164,2926,2779],{"class":1771},[1164,2928,2929],{"class":1166,"line":1333},[1164,2930,1711],{"class":1185},[1164,2932,2933,2935],{"class":1166,"line":1345},[1164,2934,1255],{"class":1185},[1164,2936,1258],{"class":1181},[1164,2938,2939,2941,2943],{"class":1166,"line":1355},[1164,2940,1311],{"class":1185},[1164,2942,1658],{"class":1192},[1164,2944,1295],{"class":1185},[1143,2946,2948],{"id":2947},"disable-transitions","Disable Transitions",[1128,2950,2951,2695,2953,2955],{},[1138,2952,1638],{},[1138,2954,2589],{}," can be disabled for a specific route:",[1154,2957,2959],{"className":1280,"code":2958,"filename":2858,"language":1282,"meta":1159,"style":1160},"\u003Cscript setup lang=\"ts\">\ndefinePageMeta({\n  pageTransition: false,\n  layoutTransition: false\n})\n\u003C/script>\n",[1138,2960,2961,2981,2989,3001,3010,3016],{"__ignoreMap":1160},[1164,2962,2963,2965,2967,2969,2971,2973,2975,2977,2979],{"class":1166,"line":1167},[1164,2964,1289],{"class":1185},[1164,2966,1658],{"class":1192},[1164,2968,1661],{"class":1496},[1164,2970,1664],{"class":1496},[1164,2972,1500],{"class":1185},[1164,2974,1503],{"class":1185},[1164,2976,1158],{"class":1221},[1164,2978,1503],{"class":1185},[1164,2980,1295],{"class":1185},[1164,2982,2983,2985,2987],{"class":1166,"line":1189},[1164,2984,595],{"class":1177},[1164,2986,1182],{"class":1181},[1164,2988,1186],{"class":1185},[1164,2990,2991,2993,2995,2999],{"class":1166,"line":1202},[1164,2992,1687],{"class":1192},[1164,2994,1196],{"class":1185},[1164,2996,2998],{"class":2997},"sbKd-"," false",[1164,3000,1342],{"class":1185},[1164,3002,3003,3005,3007],{"class":1166,"line":1246},[1164,3004,2644],{"class":1192},[1164,3006,1196],{"class":1185},[1164,3008,3009],{"class":2997}," false\n",[1164,3011,3012,3014],{"class":1166,"line":1252},[1164,3013,1255],{"class":1185},[1164,3015,1258],{"class":1181},[1164,3017,3018,3020,3022],{"class":1166,"line":1333},[1164,3019,1311],{"class":1185},[1164,3021,1658],{"class":1192},[1164,3023,1295],{"class":1185},[1128,3025,3026,3027,1196],{},"Or globally in the ",[1138,3028,2689],{},[1154,3030,3032],{"className":1156,"code":3031,"filename":260,"language":1158,"meta":1159,"style":1160},"export default defineNuxtConfig({\n  app: {\n    pageTransition: false,\n    layoutTransition: false\n  }\n})\n",[1138,3033,3034,3046,3054,3064,3072,3076],{"__ignoreMap":1160},[1164,3035,3036,3038,3040,3042,3044],{"class":1166,"line":1167},[1164,3037,1171],{"class":1170},[1164,3039,1174],{"class":1170},[1164,3041,1178],{"class":1177},[1164,3043,1182],{"class":1181},[1164,3045,1186],{"class":1185},[1164,3047,3048,3050,3052],{"class":1166,"line":1189},[1164,3049,1193],{"class":1192},[1164,3051,1196],{"class":1185},[1164,3053,1199],{"class":1185},[1164,3055,3056,3058,3060,3062],{"class":1166,"line":1202},[1164,3057,1205],{"class":1192},[1164,3059,1196],{"class":1185},[1164,3061,2998],{"class":2997},[1164,3063,1342],{"class":1185},[1164,3065,3066,3068,3070],{"class":1166,"line":1246},[1164,3067,1927],{"class":1192},[1164,3069,1196],{"class":1185},[1164,3071,3009],{"class":2997},[1164,3073,3074],{"class":1166,"line":1252},[1164,3075,1711],{"class":1185},[1164,3077,3078,3080],{"class":1166,"line":1333},[1164,3079,1255],{"class":1185},[1164,3081,1258],{"class":1181},[1143,3083,3085],{"id":3084},"javascript-hooks","JavaScript Hooks",[1128,3087,3088],{},"For advanced use-cases, you can use JavaScript hooks to create highly dynamic and custom transitions for your Nuxt pages.",[1128,3090,3091,3092,1152],{},"This way presents perfect use-cases for JavaScript animation libraries such as ",[1132,3093,3096],{"href":3094,"rel":3095},"https://gsap.com",[1136],"GSAP",[1154,3098,3100],{"className":1280,"code":3099,"filename":2858,"language":1282,"meta":1159,"style":1160},"\u003Cscript setup lang=\"ts\">\ndefinePageMeta({\n  pageTransition: {\n    name: 'custom-flip',\n    mode: 'out-in',\n    onBeforeEnter: (el) => {\n      console.log('Before enter...')\n    },\n    onEnter: (el, done) => {},\n    onAfterEnter: (el) => {}\n  }\n})\n\u003C/script>\n",[1138,3101,3102,3122,3130,3138,3153,3167,3189,3210,3214,3237,3255,3259,3265],{"__ignoreMap":1160},[1164,3103,3104,3106,3108,3110,3112,3114,3116,3118,3120],{"class":1166,"line":1167},[1164,3105,1289],{"class":1185},[1164,3107,1658],{"class":1192},[1164,3109,1661],{"class":1496},[1164,3111,1664],{"class":1496},[1164,3113,1500],{"class":1185},[1164,3115,1503],{"class":1185},[1164,3117,1158],{"class":1221},[1164,3119,1503],{"class":1185},[1164,3121,1295],{"class":1185},[1164,3123,3124,3126,3128],{"class":1166,"line":1189},[1164,3125,595],{"class":1177},[1164,3127,1182],{"class":1181},[1164,3129,1186],{"class":1185},[1164,3131,3132,3134,3136],{"class":1166,"line":1202},[1164,3133,1687],{"class":1192},[1164,3135,1196],{"class":1185},[1164,3137,1199],{"class":1185},[1164,3139,3140,3142,3144,3146,3149,3151],{"class":1166,"line":1246},[1164,3141,1696],{"class":1192},[1164,3143,1196],{"class":1185},[1164,3145,1218],{"class":1185},[1164,3147,3148],{"class":1221},"custom-flip",[1164,3150,1225],{"class":1185},[1164,3152,1342],{"class":1185},[1164,3154,3155,3157,3159,3161,3163,3165],{"class":1166,"line":1252},[1164,3156,2916],{"class":1192},[1164,3158,1196],{"class":1185},[1164,3160,1218],{"class":1185},[1164,3162,1238],{"class":1221},[1164,3164,1225],{"class":1185},[1164,3166,1342],{"class":1185},[1164,3168,3169,3172,3174,3177,3181,3184,3187],{"class":1166,"line":1333},[1164,3170,3171],{"class":1177},"    onBeforeEnter",[1164,3173,1196],{"class":1185},[1164,3175,3176],{"class":1185}," (",[1164,3178,3180],{"class":3179},"s1nJG","el",[1164,3182,3183],{"class":1185},")",[1164,3185,3186],{"class":1496}," =>",[1164,3188,1199],{"class":1185},[1164,3190,3191,3194,3196,3199,3201,3203,3206,3208],{"class":1166,"line":1345},[1164,3192,3193],{"class":1181},"      console",[1164,3195,1152],{"class":1185},[1164,3197,3198],{"class":1177},"log",[1164,3200,1182],{"class":1192},[1164,3202,1225],{"class":1185},[1164,3204,3205],{"class":1221},"Before enter...",[1164,3207,1225],{"class":1185},[1164,3209,1258],{"class":1192},[1164,3211,3212],{"class":1166,"line":1355},[1164,3213,2784],{"class":1185},[1164,3215,3216,3219,3221,3223,3225,3227,3230,3232,3234],{"class":1166,"line":1374},[1164,3217,3218],{"class":1177},"    onEnter",[1164,3220,1196],{"class":1185},[1164,3222,3176],{"class":1185},[1164,3224,3180],{"class":3179},[1164,3226,1228],{"class":1185},[1164,3228,3229],{"class":3179}," done",[1164,3231,3183],{"class":1185},[1164,3233,3186],{"class":1496},[1164,3235,3236],{"class":1185}," {},\n",[1164,3238,3239,3242,3244,3246,3248,3250,3252],{"class":1166,"line":1380},[1164,3240,3241],{"class":1177},"    onAfterEnter",[1164,3243,1196],{"class":1185},[1164,3245,3176],{"class":1185},[1164,3247,3180],{"class":3179},[1164,3249,3183],{"class":1185},[1164,3251,3186],{"class":1496},[1164,3253,3254],{"class":1185}," {}\n",[1164,3256,3257],{"class":1166,"line":1390},[1164,3258,1711],{"class":1185},[1164,3260,3261,3263],{"class":1166,"line":1400},[1164,3262,1255],{"class":1185},[1164,3264,1258],{"class":1181},[1164,3266,3267,3269,3271],{"class":1166,"line":1413},[1164,3268,1311],{"class":1185},[1164,3270,1658],{"class":1192},[1164,3272,1295],{"class":1185},[3274,3275,3276],"tip",{},[1128,3277,3278,3279,3284,3285,3288],{},"Learn more about additional ",[1132,3280,3283],{"href":3281,"rel":3282},"https://vuejs.org/guide/built-ins/transition.html#javascript-hooks",[1136],"JavaScript hooks"," available in the ",[1138,3286,3287],{},"Transition"," component.",[1143,3290,3292],{"id":3291},"dynamic-transitions","Dynamic Transitions",[1128,3294,3295,3296,3298,3299,1152],{},"To apply dynamic transitions using conditional logic, you can leverage inline ",[1132,3297,195],{"href":196}," to assign a different transition name to ",[1138,3300,3301],{},"to.meta.pageTransition",[1276,3303,3304,3837],{},[1154,3305,3308],{"className":1280,"code":3306,"filename":3307,"language":1282,"meta":1159,"style":1160},"\u003Cscript setup lang=\"ts\">\ndefinePageMeta({\n  pageTransition: {\n    name: 'slide-right',\n    mode: 'out-in'\n  },\n  middleware (to, from) {\n    if (to.meta.pageTransition && typeof to.meta.pageTransition !== 'boolean')\n      to.meta.pageTransition.name = +to.params.id! > +from.params.id! ? 'slide-left' : 'slide-right'\n  }\n})\n\u003C/script>\n\n\u003Ctemplate>\n  \u003Ch1>#{{ $route.params.id }}\u003C/h1>\n\u003C/template>\n\n\u003Cstyle>\n.slide-left-enter-active,\n.slide-left-leave-active,\n.slide-right-enter-active,\n.slide-right-leave-active {\n  transition: all 0.2s;\n}\n.slide-left-enter-from {\n  opacity: 0;\n  transform: translate(50px, 0);\n}\n.slide-left-leave-to {\n  opacity: 0;\n  transform: translate(-50px, 0);\n}\n.slide-right-enter-from {\n  opacity: 0;\n  transform: translate(-50px, 0);\n}\n.slide-right-leave-to {\n  opacity: 0;\n  transform: translate(50px, 0);\n}\n\u003C/style>\n","pages/[id].vue",[1138,3309,3310,3330,3338,3346,3361,3373,3377,3396,3442,3517,3521,3527,3535,3539,3547,3564,3572,3577,3586,3596,3606,3616,3626,3640,3645,3655,3666,3687,3692,3702,3713,3733,3738,3748,3759,3778,3783,3793,3804,3823,3828],{"__ignoreMap":1160},[1164,3311,3312,3314,3316,3318,3320,3322,3324,3326,3328],{"class":1166,"line":1167},[1164,3313,1289],{"class":1185},[1164,3315,1658],{"class":1192},[1164,3317,1661],{"class":1496},[1164,3319,1664],{"class":1496},[1164,3321,1500],{"class":1185},[1164,3323,1503],{"class":1185},[1164,3325,1158],{"class":1221},[1164,3327,1503],{"class":1185},[1164,3329,1295],{"class":1185},[1164,3331,3332,3334,3336],{"class":1166,"line":1189},[1164,3333,595],{"class":1177},[1164,3335,1182],{"class":1181},[1164,3337,1186],{"class":1185},[1164,3339,3340,3342,3344],{"class":1166,"line":1202},[1164,3341,1687],{"class":1192},[1164,3343,1196],{"class":1185},[1164,3345,1199],{"class":1185},[1164,3347,3348,3350,3352,3354,3357,3359],{"class":1166,"line":1246},[1164,3349,1696],{"class":1192},[1164,3351,1196],{"class":1185},[1164,3353,1218],{"class":1185},[1164,3355,3356],{"class":1221},"slide-right",[1164,3358,1225],{"class":1185},[1164,3360,1342],{"class":1185},[1164,3362,3363,3365,3367,3369,3371],{"class":1166,"line":1252},[1164,3364,2916],{"class":1192},[1164,3366,1196],{"class":1185},[1164,3368,1218],{"class":1185},[1164,3370,1238],{"class":1221},[1164,3372,1706],{"class":1185},[1164,3374,3375],{"class":1166,"line":1333},[1164,3376,1249],{"class":1185},[1164,3378,3379,3382,3384,3387,3389,3392,3394],{"class":1166,"line":1345},[1164,3380,3381],{"class":1192},"  middleware",[1164,3383,3176],{"class":1185},[1164,3385,3386],{"class":3179},"to",[1164,3388,1228],{"class":1185},[1164,3390,3391],{"class":3179}," from",[1164,3393,3183],{"class":1185},[1164,3395,1199],{"class":1185},[1164,3397,3398,3401,3403,3405,3407,3410,3412,3414,3417,3420,3422,3424,3426,3428,3430,3433,3435,3438,3440],{"class":1166,"line":1355},[1164,3399,3400],{"class":1170},"    if",[1164,3402,3176],{"class":1192},[1164,3404,3386],{"class":1181},[1164,3406,1152],{"class":1185},[1164,3408,3409],{"class":1181},"meta",[1164,3411,1152],{"class":1185},[1164,3413,1638],{"class":1181},[1164,3415,3416],{"class":1185}," &&",[1164,3418,3419],{"class":1185}," typeof",[1164,3421,1497],{"class":1181},[1164,3423,1152],{"class":1185},[1164,3425,3409],{"class":1181},[1164,3427,1152],{"class":1185},[1164,3429,1638],{"class":1181},[1164,3431,3432],{"class":1185}," !==",[1164,3434,1218],{"class":1185},[1164,3436,3437],{"class":1221},"boolean",[1164,3439,1225],{"class":1185},[1164,3441,1258],{"class":1192},[1164,3443,3444,3447,3449,3451,3453,3455,3457,3459,3462,3465,3467,3469,3472,3474,3477,3480,3483,3485,3488,3490,3492,3494,3496,3498,3501,3503,3506,3508,3511,3513,3515],{"class":1166,"line":1374},[1164,3445,3446],{"class":1181},"      to",[1164,3448,1152],{"class":1185},[1164,3450,3409],{"class":1181},[1164,3452,1152],{"class":1185},[1164,3454,1638],{"class":1181},[1164,3456,1152],{"class":1185},[1164,3458,2709],{"class":1181},[1164,3460,3461],{"class":1185}," =",[1164,3463,3464],{"class":1185}," +",[1164,3466,3386],{"class":1181},[1164,3468,1152],{"class":1185},[1164,3470,3471],{"class":1181},"params",[1164,3473,1152],{"class":1185},[1164,3475,3476],{"class":1181},"id",[1164,3478,3479],{"class":1185},"!",[1164,3481,3482],{"class":1185}," >",[1164,3484,3464],{"class":1185},[1164,3486,3487],{"class":1181},"from",[1164,3489,1152],{"class":1185},[1164,3491,3471],{"class":1181},[1164,3493,1152],{"class":1185},[1164,3495,3476],{"class":1181},[1164,3497,3479],{"class":1185},[1164,3499,3500],{"class":1185}," ?",[1164,3502,1218],{"class":1185},[1164,3504,3505],{"class":1221},"slide-left",[1164,3507,1225],{"class":1185},[1164,3509,3510],{"class":1185}," :",[1164,3512,1218],{"class":1185},[1164,3514,3356],{"class":1221},[1164,3516,1706],{"class":1185},[1164,3518,3519],{"class":1166,"line":1380},[1164,3520,1711],{"class":1185},[1164,3522,3523,3525],{"class":1166,"line":1390},[1164,3524,1255],{"class":1185},[1164,3526,1258],{"class":1181},[1164,3528,3529,3531,3533],{"class":1166,"line":1400},[1164,3530,1311],{"class":1185},[1164,3532,1658],{"class":1192},[1164,3534,1295],{"class":1185},[1164,3536,3537],{"class":1166,"line":1413},[1164,3538,1321],{"emptyLinePlaceholder":1320},[1164,3540,3541,3543,3545],{"class":1166,"line":1432},[1164,3542,1289],{"class":1185},[1164,3544,1292],{"class":1192},[1164,3546,1295],{"class":1185},[1164,3548,3549,3551,3553,3555,3558,3560,3562],{"class":1166,"line":1437},[1164,3550,1300],{"class":1185},[1164,3552,1474],{"class":1192},[1164,3554,1477],{"class":1185},[1164,3556,3557],{"class":1181},"#{{ $route.params.id }}",[1164,3559,1311],{"class":1185},[1164,3561,1474],{"class":1192},[1164,3563,1295],{"class":1185},[1164,3565,3566,3568,3570],{"class":1166,"line":1872},[1164,3567,1311],{"class":1185},[1164,3569,1292],{"class":1192},[1164,3571,1295],{"class":1185},[1164,3573,3575],{"class":1166,"line":3574},17,[1164,3576,1321],{"emptyLinePlaceholder":1320},[1164,3578,3580,3582,3584],{"class":1166,"line":3579},18,[1164,3581,1289],{"class":1185},[1164,3583,1328],{"class":1192},[1164,3585,1295],{"class":1185},[1164,3587,3589,3591,3594],{"class":1166,"line":3588},19,[1164,3590,1152],{"class":1185},[1164,3592,3593],{"class":1338},"slide-left-enter-active",[1164,3595,1342],{"class":1185},[1164,3597,3599,3601,3604],{"class":1166,"line":3598},20,[1164,3600,1152],{"class":1185},[1164,3602,3603],{"class":1338},"slide-left-leave-active",[1164,3605,1342],{"class":1185},[1164,3607,3609,3611,3614],{"class":1166,"line":3608},21,[1164,3610,1152],{"class":1185},[1164,3612,3613],{"class":1338},"slide-right-enter-active",[1164,3615,1342],{"class":1185},[1164,3617,3619,3621,3624],{"class":1166,"line":3618},22,[1164,3620,1152],{"class":1185},[1164,3622,3623],{"class":1338},"slide-right-leave-active",[1164,3625,1199],{"class":1185},[1164,3627,3629,3631,3633,3635,3638],{"class":1166,"line":3628},23,[1164,3630,1359],{"class":1358},[1164,3632,1196],{"class":1185},[1164,3634,1364],{"class":1181},[1164,3636,3637],{"class":1367},"0.2s",[1164,3639,1371],{"class":1185},[1164,3641,3643],{"class":1166,"line":3642},24,[1164,3644,1377],{"class":1185},[1164,3646,3648,3650,3653],{"class":1166,"line":3647},25,[1164,3649,1152],{"class":1185},[1164,3651,3652],{"class":1338},"slide-left-enter-from",[1164,3654,1199],{"class":1185},[1164,3656,3658,3660,3662,3664],{"class":1166,"line":3657},26,[1164,3659,1403],{"class":1358},[1164,3661,1196],{"class":1185},[1164,3663,1408],{"class":1367},[1164,3665,1371],{"class":1185},[1164,3667,3669,3671,3673,3676,3678,3681,3683,3685],{"class":1166,"line":3668},27,[1164,3670,1839],{"class":1358},[1164,3672,1196],{"class":1185},[1164,3674,3675],{"class":1177}," translate",[1164,3677,1182],{"class":1185},[1164,3679,3680],{"class":1367},"50px",[1164,3682,1228],{"class":1185},[1164,3684,1408],{"class":1367},[1164,3686,1429],{"class":1185},[1164,3688,3690],{"class":1166,"line":3689},28,[1164,3691,1377],{"class":1185},[1164,3693,3695,3697,3700],{"class":1166,"line":3694},29,[1164,3696,1152],{"class":1185},[1164,3698,3699],{"class":1338},"slide-left-leave-to",[1164,3701,1199],{"class":1185},[1164,3703,3705,3707,3709,3711],{"class":1166,"line":3704},30,[1164,3706,1403],{"class":1358},[1164,3708,1196],{"class":1185},[1164,3710,1408],{"class":1367},[1164,3712,1371],{"class":1185},[1164,3714,3716,3718,3720,3722,3724,3727,3729,3731],{"class":1166,"line":3715},31,[1164,3717,1839],{"class":1358},[1164,3719,1196],{"class":1185},[1164,3721,3675],{"class":1177},[1164,3723,1182],{"class":1185},[1164,3725,3726],{"class":1367},"-50px",[1164,3728,1228],{"class":1185},[1164,3730,1408],{"class":1367},[1164,3732,1429],{"class":1185},[1164,3734,3736],{"class":1166,"line":3735},32,[1164,3737,1377],{"class":1185},[1164,3739,3741,3743,3746],{"class":1166,"line":3740},33,[1164,3742,1152],{"class":1185},[1164,3744,3745],{"class":1338},"slide-right-enter-from",[1164,3747,1199],{"class":1185},[1164,3749,3751,3753,3755,3757],{"class":1166,"line":3750},34,[1164,3752,1403],{"class":1358},[1164,3754,1196],{"class":1185},[1164,3756,1408],{"class":1367},[1164,3758,1371],{"class":1185},[1164,3760,3762,3764,3766,3768,3770,3772,3774,3776],{"class":1166,"line":3761},35,[1164,3763,1839],{"class":1358},[1164,3765,1196],{"class":1185},[1164,3767,3675],{"class":1177},[1164,3769,1182],{"class":1185},[1164,3771,3726],{"class":1367},[1164,3773,1228],{"class":1185},[1164,3775,1408],{"class":1367},[1164,3777,1429],{"class":1185},[1164,3779,3781],{"class":1166,"line":3780},36,[1164,3782,1377],{"class":1185},[1164,3784,3786,3788,3791],{"class":1166,"line":3785},37,[1164,3787,1152],{"class":1185},[1164,3789,3790],{"class":1338},"slide-right-leave-to",[1164,3792,1199],{"class":1185},[1164,3794,3796,3798,3800,3802],{"class":1166,"line":3795},38,[1164,3797,1403],{"class":1358},[1164,3799,1196],{"class":1185},[1164,3801,1408],{"class":1367},[1164,3803,1371],{"class":1185},[1164,3805,3807,3809,3811,3813,3815,3817,3819,3821],{"class":1166,"line":3806},39,[1164,3808,1839],{"class":1358},[1164,3810,1196],{"class":1185},[1164,3812,3675],{"class":1177},[1164,3814,1182],{"class":1185},[1164,3816,3680],{"class":1367},[1164,3818,1228],{"class":1185},[1164,3820,1408],{"class":1367},[1164,3822,1429],{"class":1185},[1164,3824,3826],{"class":1166,"line":3825},40,[1164,3827,1377],{"class":1185},[1164,3829,3831,3833,3835],{"class":1166,"line":3830},41,[1164,3832,1311],{"class":1185},[1164,3834,1328],{"class":1192},[1164,3836,1295],{"class":1185},[1154,3838,3840],{"className":1280,"code":3839,"filename":2116,"language":1282,"meta":1160,"style":1160},"\u003Cscript setup lang=\"ts\">\nconst route = useRoute()\nconst id = computed(() => Number(route.params.id || 1))\nconst prev = computed(() => '/' + (id.value - 1))\nconst next = computed(() => '/' + (id.value + 1))\n\u003C/script>\n\n\u003Ctemplate>\n  \u003Cdiv>\n    \u003Cslot />\n    \u003Cdiv v-if=\"$route.params.id\">\n      \u003CNuxtLink :to=\"prev\">⬅️\u003C/NuxtLink> |\n      \u003CNuxtLink :to=\"next\">➡️\u003C/NuxtLink>\n    \u003C/div>\n  \u003C/div>\n\u003C/template>\n",[1138,3841,3842,3862,3878,3920,3960,3998,4006,4010,4018,4026,4034,4062,4096,4126,4135,4143],{"__ignoreMap":1160},[1164,3843,3844,3846,3848,3850,3852,3854,3856,3858,3860],{"class":1166,"line":1167},[1164,3845,1289],{"class":1185},[1164,3847,1658],{"class":1192},[1164,3849,1661],{"class":1496},[1164,3851,1664],{"class":1496},[1164,3853,1500],{"class":1185},[1164,3855,1503],{"class":1185},[1164,3857,1158],{"class":1221},[1164,3859,1503],{"class":1185},[1164,3861,1295],{"class":1185},[1164,3863,3864,3867,3870,3872,3875],{"class":1166,"line":1189},[1164,3865,3866],{"class":1496},"const",[1164,3868,3869],{"class":1181}," route ",[1164,3871,1500],{"class":1185},[1164,3873,3874],{"class":1177}," useRoute",[1164,3876,3877],{"class":1181},"()\n",[1164,3879,3880,3882,3885,3887,3890,3892,3895,3897,3900,3903,3905,3907,3909,3912,3915,3917],{"class":1166,"line":1202},[1164,3881,3866],{"class":1496},[1164,3883,3884],{"class":1181}," id ",[1164,3886,1500],{"class":1185},[1164,3888,3889],{"class":1177}," computed",[1164,3891,1182],{"class":1181},[1164,3893,3894],{"class":1185},"()",[1164,3896,3186],{"class":1496},[1164,3898,3899],{"class":1177}," Number",[1164,3901,3902],{"class":1181},"(route",[1164,3904,1152],{"class":1185},[1164,3906,3471],{"class":1181},[1164,3908,1152],{"class":1185},[1164,3910,3911],{"class":1181},"id ",[1164,3913,3914],{"class":1185},"||",[1164,3916,1854],{"class":1367},[1164,3918,3919],{"class":1181},"))\n",[1164,3921,3922,3924,3927,3929,3931,3933,3935,3937,3939,3941,3943,3945,3948,3950,3953,3956,3958],{"class":1166,"line":1246},[1164,3923,3866],{"class":1496},[1164,3925,3926],{"class":1181}," prev ",[1164,3928,1500],{"class":1185},[1164,3930,3889],{"class":1177},[1164,3932,1182],{"class":1181},[1164,3934,3894],{"class":1185},[1164,3936,3186],{"class":1496},[1164,3938,1218],{"class":1185},[1164,3940,1589],{"class":1221},[1164,3942,1225],{"class":1185},[1164,3944,3464],{"class":1185},[1164,3946,3947],{"class":1181}," (id",[1164,3949,1152],{"class":1185},[1164,3951,3952],{"class":1181},"value ",[1164,3954,3955],{"class":1185},"-",[1164,3957,1854],{"class":1367},[1164,3959,3919],{"class":1181},[1164,3961,3962,3964,3967,3969,3971,3973,3975,3977,3979,3981,3983,3985,3987,3989,3991,3994,3996],{"class":1166,"line":1252},[1164,3963,3866],{"class":1496},[1164,3965,3966],{"class":1181}," next ",[1164,3968,1500],{"class":1185},[1164,3970,3889],{"class":1177},[1164,3972,1182],{"class":1181},[1164,3974,3894],{"class":1185},[1164,3976,3186],{"class":1496},[1164,3978,1218],{"class":1185},[1164,3980,1589],{"class":1221},[1164,3982,1225],{"class":1185},[1164,3984,3464],{"class":1185},[1164,3986,3947],{"class":1181},[1164,3988,1152],{"class":1185},[1164,3990,3952],{"class":1181},[1164,3992,3993],{"class":1185},"+",[1164,3995,1854],{"class":1367},[1164,3997,3919],{"class":1181},[1164,3999,4000,4002,4004],{"class":1166,"line":1333},[1164,4001,1311],{"class":1185},[1164,4003,1658],{"class":1192},[1164,4005,1295],{"class":1185},[1164,4007,4008],{"class":1166,"line":1345},[1164,4009,1321],{"emptyLinePlaceholder":1320},[1164,4011,4012,4014,4016],{"class":1166,"line":1355},[1164,4013,1289],{"class":1185},[1164,4015,1292],{"class":1192},[1164,4017,1295],{"class":1185},[1164,4019,4020,4022,4024],{"class":1166,"line":1374},[1164,4021,1300],{"class":1185},[1164,4023,1464],{"class":1192},[1164,4025,1295],{"class":1185},[1164,4027,4028,4030,4032],{"class":1166,"line":1380},[1164,4029,1471],{"class":1185},[1164,4031,2158],{"class":1192},[1164,4033,1306],{"class":1185},[1164,4035,4036,4038,4040,4043,4045,4047,4050,4052,4054,4056,4058,4060],{"class":1166,"line":1390},[1164,4037,1471],{"class":1185},[1164,4039,1464],{"class":1192},[1164,4041,4042],{"class":1170}," v-if",[1164,4044,1500],{"class":1185},[1164,4046,1503],{"class":1185},[1164,4048,4049],{"class":1181},"$route",[1164,4051,1152],{"class":1185},[1164,4053,3471],{"class":1181},[1164,4055,1152],{"class":1185},[1164,4057,3476],{"class":1181},[1164,4059,1503],{"class":1185},[1164,4061,1295],{"class":1185},[1164,4063,4064,4067,4069,4071,4073,4075,4077,4080,4082,4084,4087,4089,4091,4093],{"class":1166,"line":1400},[1164,4065,4066],{"class":1185},"      \u003C",[1164,4068,1493],{"class":1192},[1164,4070,3510],{"class":1185},[1164,4072,3386],{"class":1496},[1164,4074,1500],{"class":1185},[1164,4076,1503],{"class":1185},[1164,4078,4079],{"class":1181},"prev",[1164,4081,1503],{"class":1185},[1164,4083,1477],{"class":1185},[1164,4085,4086],{"class":1181},"⬅️",[1164,4088,1311],{"class":1185},[1164,4090,1493],{"class":1192},[1164,4092,1477],{"class":1185},[1164,4094,4095],{"class":1181}," |\n",[1164,4097,4098,4100,4102,4104,4106,4108,4110,4113,4115,4117,4120,4122,4124],{"class":1166,"line":1413},[1164,4099,4066],{"class":1185},[1164,4101,1493],{"class":1192},[1164,4103,3510],{"class":1185},[1164,4105,3386],{"class":1496},[1164,4107,1500],{"class":1185},[1164,4109,1503],{"class":1185},[1164,4111,4112],{"class":1181},"next",[1164,4114,1503],{"class":1185},[1164,4116,1477],{"class":1185},[1164,4118,4119],{"class":1181},"➡️",[1164,4121,1311],{"class":1185},[1164,4123,1493],{"class":1192},[1164,4125,1295],{"class":1185},[1164,4127,4128,4131,4133],{"class":1166,"line":1432},[1164,4129,4130],{"class":1185},"    \u003C/",[1164,4132,1464],{"class":1192},[1164,4134,1295],{"class":1185},[1164,4136,4137,4139,4141],{"class":1166,"line":1437},[1164,4138,1524],{"class":1185},[1164,4140,1464],{"class":1192},[1164,4142,1295],{"class":1185},[1164,4144,4145,4147,4149],{"class":1166,"line":1872},[1164,4146,1311],{"class":1185},[1164,4148,1292],{"class":1192},[1164,4150,1295],{"class":1185},[1128,4152,4153,4154,4156,4157,4159],{},"The page now applies the ",[1138,4155,3505],{}," transition when going to the next id and ",[1138,4158,3356],{}," for the previous:",[1622,4161,1627,4164],{"controls":1320,"className":4162,"poster":4163},[1625],"https://res.cloudinary.com/nuxt/video/upload/v1665069410/nuxt3/nuxt-dynamic-page-transitions.jpg",[1629,4165],{"src":4166,"type":1632},"https://res.cloudinary.com/nuxt/video/upload/v1665069410/nuxt3/nuxt-dynamic-page-transitions.mp4",[1143,4168,4170],{"id":4169},"transition-with-nuxtpage","Transition with NuxtPage",[1128,4172,4173,4174,4177,4178,4180,4181,4184],{},"When ",[1138,4175,4176],{},"\u003CNuxtPage />"," is used in ",[1138,4179,248],{},", transitions can be configured with the ",[1138,4182,4183],{},"transition"," prop to activate transitions globally.",[1154,4186,4188],{"className":1280,"code":4187,"filename":248,"language":1282,"meta":1160,"style":1160},"\u003Ctemplate>\n  \u003Cdiv>\n    \u003CNuxtLayout>\n      \u003CNuxtPage :transition=\"{\n        name: 'bounce',\n        mode: 'out-in'\n      }\" />\n    \u003C/NuxtLayout>\n  \u003C/div>\n\u003C/template>\n",[1138,4189,4190,4198,4206,4214,4230,4246,4259,4268,4276,4284],{"__ignoreMap":1160},[1164,4191,4192,4194,4196],{"class":1166,"line":1167},[1164,4193,1289],{"class":1185},[1164,4195,1292],{"class":1192},[1164,4197,1295],{"class":1185},[1164,4199,4200,4202,4204],{"class":1166,"line":1189},[1164,4201,1300],{"class":1185},[1164,4203,1464],{"class":1192},[1164,4205,1295],{"class":1185},[1164,4207,4208,4210,4212],{"class":1166,"line":1202},[1164,4209,1471],{"class":1185},[1164,4211,1995],{"class":1192},[1164,4213,1295],{"class":1185},[1164,4215,4216,4218,4220,4222,4224,4226,4228],{"class":1166,"line":1246},[1164,4217,4066],{"class":1185},[1164,4219,1303],{"class":1192},[1164,4221,3510],{"class":1185},[1164,4223,4183],{"class":1496},[1164,4225,1500],{"class":1185},[1164,4227,1503],{"class":1185},[1164,4229,1186],{"class":1185},[1164,4231,4232,4235,4238,4240,4242,4244],{"class":1166,"line":1252},[1164,4233,4234],{"class":1192},"        name",[1164,4236,4237],{"class":1185},": ",[1164,4239,1225],{"class":1185},[1164,4241,2907],{"class":1221},[1164,4243,1225],{"class":1185},[1164,4245,1342],{"class":1185},[1164,4247,4248,4251,4253,4255,4257],{"class":1166,"line":1333},[1164,4249,4250],{"class":1192},"        mode",[1164,4252,4237],{"class":1185},[1164,4254,1225],{"class":1185},[1164,4256,1238],{"class":1221},[1164,4258,1706],{"class":1185},[1164,4260,4261,4264,4266],{"class":1166,"line":1345},[1164,4262,4263],{"class":1185},"      }",[1164,4265,1503],{"class":1185},[1164,4267,1306],{"class":1185},[1164,4269,4270,4272,4274],{"class":1166,"line":1355},[1164,4271,4130],{"class":1185},[1164,4273,1995],{"class":1192},[1164,4275,1295],{"class":1185},[1164,4277,4278,4280,4282],{"class":1166,"line":1374},[1164,4279,1524],{"class":1185},[1164,4281,1464],{"class":1192},[1164,4283,1295],{"class":1185},[1164,4285,4286,4288,4290],{"class":1166,"line":1380},[1164,4287,1311],{"class":1185},[1164,4289,1292],{"class":1192},[1164,4291,1295],{"class":1185},[1125,4293,4294],{},[1128,4295,4296,4297,4299],{},"Remember, this page transition cannot be overridden with ",[1138,4298,595],{}," on individual pages.",[1143,4301,4303],{"id":4302},"view-transitions-api-experimental","View Transitions API (experimental)",[1128,4305,4306,4307,4315,4316,4321],{},"Nuxt ships with an experimental implementation of the ",[1132,4308,4311],{"href":4309,"rel":4310},"https://developer.chrome.com/docs/web-platform/view-transitions",[1136],[4312,4313,4314],"strong",{},"View Transitions API"," (see ",[1132,4317,4320],{"href":4318,"rel":4319},"https://developer.mozilla.org/en-US/docs/Web/API/View_Transitions_API",[1136],"MDN","). This is an exciting new way to implement native browser transitions which (among other things) have the ability to transition between unrelated elements on different pages.",[1128,4323,4324,4325,4329,4330,1152],{},"You can check a demo on ",[1132,4326,4327],{"href":4327,"rel":4328},"https://nuxt-view-transitions.surge.sh",[1136]," and the ",[1132,4331,4334],{"href":4332,"rel":4333},"https://stackblitz.com/edit/nuxt-view-transitions",[1136],"source on StackBlitz",[1128,4336,4337,4338,4341],{},"The Nuxt integration is under active development, but can be enabled with the ",[1138,4339,4340],{},"experimental.viewTransition"," option in your configuration file:",[1154,4343,4345],{"className":1156,"code":4344,"filename":260,"language":1158,"meta":1159,"style":1160},"export default defineNuxtConfig({\n  experimental: {\n    viewTransition: true\n  }\n})\n",[1138,4346,4347,4359,4368,4378,4382],{"__ignoreMap":1160},[1164,4348,4349,4351,4353,4355,4357],{"class":1166,"line":1167},[1164,4350,1171],{"class":1170},[1164,4352,1174],{"class":1170},[1164,4354,1178],{"class":1177},[1164,4356,1182],{"class":1181},[1164,4358,1186],{"class":1185},[1164,4360,4361,4364,4366],{"class":1166,"line":1189},[1164,4362,4363],{"class":1192},"  experimental",[1164,4365,1196],{"class":1185},[1164,4367,1199],{"class":1185},[1164,4369,4370,4373,4375],{"class":1166,"line":1202},[1164,4371,4372],{"class":1192},"    viewTransition",[1164,4374,1196],{"class":1185},[1164,4376,4377],{"class":2997}," true\n",[1164,4379,4380],{"class":1166,"line":1246},[1164,4381,1711],{"class":1185},[1164,4383,4384,4386],{"class":1166,"line":1252},[1164,4385,1255],{"class":1185},[1164,4387,1258],{"class":1181},[1128,4389,4390,4391,2710,4394,4397,4398,1152],{},"The possible values are: ",[1138,4392,4393],{},"false",[1138,4395,4396],{},"true",", or ",[1138,4399,4400],{},"'always'",[1128,4402,4403,4404,4407,4408,4411],{},"If set to true, Nuxt will not apply transitions if the user's browser matches ",[1138,4405,4406],{},"prefers-reduced-motion: reduce"," (recommended). If set to ",[1138,4409,4410],{},"always",", Nuxt will always apply the transition and it is up to you to respect the user's preference.",[1128,4413,4414,4415,4417],{},"By default, view transitions are enabled for all ",[1132,4416,207],{"href":208},", but you can set a different global default.",[1154,4419,4421],{"className":1156,"code":4420,"filename":260,"language":1158,"meta":1159,"style":1160},"export default defineNuxtConfig({\n  app: {\n    // Disable view transitions globally, and opt-in on a per page basis\n    viewTransition: false\n  },\n})\n",[1138,4422,4423,4435,4443,4448,4456,4460],{"__ignoreMap":1160},[1164,4424,4425,4427,4429,4431,4433],{"class":1166,"line":1167},[1164,4426,1171],{"class":1170},[1164,4428,1174],{"class":1170},[1164,4430,1178],{"class":1177},[1164,4432,1182],{"class":1181},[1164,4434,1186],{"class":1185},[1164,4436,4437,4439,4441],{"class":1166,"line":1189},[1164,4438,1193],{"class":1192},[1164,4440,1196],{"class":1185},[1164,4442,1199],{"class":1185},[1164,4444,4445],{"class":1166,"line":1202},[1164,4446,4447],{"class":1771},"    // Disable view transitions globally, and opt-in on a per page basis\n",[1164,4449,4450,4452,4454],{"class":1166,"line":1246},[1164,4451,4372],{"class":1192},[1164,4453,1196],{"class":1185},[1164,4455,3009],{"class":2997},[1164,4457,4458],{"class":1166,"line":1252},[1164,4459,1249],{"class":1185},[1164,4461,4462,4464],{"class":1166,"line":1333},[1164,4463,1255],{"class":1185},[1164,4465,1258],{"class":1181},[1128,4467,4468,4469,4472,4473,1639,4475,1644],{},"It is possible to override the default ",[1138,4470,4471],{},"viewTransition"," value for a page by setting the ",[1138,4474,4471],{},[1132,4476,4477],{"href":596},[1138,4478,595],{},[1154,4480,4482],{"className":1280,"code":4481,"filename":1540,"language":1282,"meta":1159,"style":1160},"\u003Cscript setup lang=\"ts\">\ndefinePageMeta({\n  viewTransition: false\n})\n\u003C/script>\n",[1138,4483,4484,4504,4512,4521,4527],{"__ignoreMap":1160},[1164,4485,4486,4488,4490,4492,4494,4496,4498,4500,4502],{"class":1166,"line":1167},[1164,4487,1289],{"class":1185},[1164,4489,1658],{"class":1192},[1164,4491,1661],{"class":1496},[1164,4493,1664],{"class":1496},[1164,4495,1500],{"class":1185},[1164,4497,1503],{"class":1185},[1164,4499,1158],{"class":1221},[1164,4501,1503],{"class":1185},[1164,4503,1295],{"class":1185},[1164,4505,4506,4508,4510],{"class":1166,"line":1189},[1164,4507,595],{"class":1177},[1164,4509,1182],{"class":1181},[1164,4511,1186],{"class":1185},[1164,4513,4514,4517,4519],{"class":1166,"line":1202},[1164,4515,4516],{"class":1192},"  viewTransition",[1164,4518,1196],{"class":1185},[1164,4520,3009],{"class":2997},[1164,4522,4523,4525],{"class":1166,"line":1246},[1164,4524,1255],{"class":1185},[1164,4526,1258],{"class":1181},[1164,4528,4529,4531,4533],{"class":1166,"line":1252},[1164,4530,1311],{"class":1185},[1164,4532,1658],{"class":1192},[1164,4534,1295],{"class":1185},[2838,4536,4537],{},[1128,4538,4539,4540,4542],{},"Overriding view transitions on a per-page basis will only have an effect if you have enabled the ",[1138,4541,4340],{}," option.",[1128,4544,4545,4546,2695,4548,4550,4551,4555,4556,4559],{},"If you are also using Vue transitions like ",[1138,4547,1638],{},[1138,4549,2589],{}," (see above) to achieve the same result as the new View Transitions API, then you may wish to ",[4552,4553,4554],"em",{},"disable"," Vue transitions if the user's browser supports the newer, native web API. You can do this by creating ",[1138,4557,4558],{},"~/middleware/disable-vue-transitions.global.ts"," with the following contents:",[1154,4561,4563],{"className":1156,"code":4562,"language":1158,"meta":1160,"style":1160},"export default defineNuxtRouteMiddleware(to => {\n  if (import.meta.server || !document.startViewTransition) { return }\n\n  // Disable built-in Vue transitions\n  to.meta.pageTransition = false\n  to.meta.layoutTransition = false\n})\n",[1138,4564,4565,4582,4625,4629,4634,4651,4667],{"__ignoreMap":1160},[1164,4566,4567,4569,4571,4574,4576,4578,4580],{"class":1166,"line":1167},[1164,4568,1171],{"class":1170},[1164,4570,1174],{"class":1170},[1164,4572,4573],{"class":1177}," defineNuxtRouteMiddleware",[1164,4575,1182],{"class":1181},[1164,4577,3386],{"class":3179},[1164,4579,3186],{"class":1496},[1164,4581,1199],{"class":1185},[1164,4583,4584,4587,4589,4592,4594,4596,4598,4600,4603,4606,4609,4611,4614,4617,4620,4623],{"class":1166,"line":1189},[1164,4585,4586],{"class":1170},"  if",[1164,4588,3176],{"class":1192},[1164,4590,4591],{"class":1170},"import",[1164,4593,1152],{"class":1185},[1164,4595,3409],{"class":1181},[1164,4597,1152],{"class":1185},[1164,4599,219],{"class":1181},[1164,4601,4602],{"class":1185}," ||",[1164,4604,4605],{"class":1185}," !",[1164,4607,4608],{"class":1181},"document",[1164,4610,1152],{"class":1185},[1164,4612,4613],{"class":1181},"startViewTransition",[1164,4615,4616],{"class":1192},") ",[1164,4618,4619],{"class":1185},"{",[1164,4621,4622],{"class":1170}," return",[1164,4624,1243],{"class":1185},[1164,4626,4627],{"class":1166,"line":1202},[1164,4628,1321],{"emptyLinePlaceholder":1320},[1164,4630,4631],{"class":1166,"line":1246},[1164,4632,4633],{"class":1771},"  // Disable built-in Vue transitions\n",[1164,4635,4636,4639,4641,4643,4645,4647,4649],{"class":1166,"line":1252},[1164,4637,4638],{"class":1181},"  to",[1164,4640,1152],{"class":1185},[1164,4642,3409],{"class":1181},[1164,4644,1152],{"class":1185},[1164,4646,1638],{"class":1181},[1164,4648,3461],{"class":1185},[1164,4650,3009],{"class":2997},[1164,4652,4653,4655,4657,4659,4661,4663,4665],{"class":1166,"line":1333},[1164,4654,4638],{"class":1181},[1164,4656,1152],{"class":1185},[1164,4658,3409],{"class":1181},[1164,4660,1152],{"class":1185},[1164,4662,2589],{"class":1181},[1164,4664,3461],{"class":1185},[1164,4666,3009],{"class":2997},[1164,4668,4669,4671],{"class":1166,"line":1345},[1164,4670,1255],{"class":1185},[1164,4672,1258],{"class":1181},[4674,4675,4677],"h3",{"id":4676},"known-issues","Known Issues",[4679,4680,4681],"ul",{},[4682,4683,4684,4685,4688],"li",{},"If you perform data fetching within your page setup functions, that you may wish to reconsider using this feature for the moment. (By design, View Transitions completely freeze DOM updates whilst they are taking place.) We're looking at restrict the View Transition to the final moments before ",[1138,4686,4687],{},"\u003CSuspense>"," resolves, but in the interim you may want to consider carefully whether to adopt this feature if this describes you.",[1328,4690,4691],{},"html pre.shiki code .sDfIl, html code.shiki .sDfIl{--shiki-light:#39ADB5;--shiki-default:#39ADB5;--shiki-dark:#89DDFF}html pre.shiki code .sRlkE, html code.shiki .sRlkE{--shiki-light:#E53935;--shiki-default:#E53935;--shiki-dark:#F07178}html pre.shiki code .s52Pk, html code.shiki .s52Pk{--shiki-light:#E2931D;--shiki-default:#E2931D;--shiki-dark:#FFCB6B}html pre.shiki code .spFsF, html code.shiki .spFsF{--shiki-light:#8796B0;--shiki-default:#8796B0;--shiki-dark:#B2CCD6}html pre.shiki code .sZSNi, html code.shiki .sZSNi{--shiki-light:#90A4AE;--shiki-default:#90A4AE;--shiki-dark:#BABED8}html pre.shiki code .sYRBq, html code.shiki .sYRBq{--shiki-light:#F76D47;--shiki-default:#F76D47;--shiki-dark:#F78C6C}html pre.shiki code .s3cPz, html code.shiki .s3cPz{--shiki-light:#6182B8;--shiki-default:#6182B8;--shiki-dark:#82AAFF}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .smZ93, html code.shiki .smZ93{--shiki-light:#9C3EDA;--shiki-default:#9C3EDA;--shiki-dark:#C792EA}html pre.shiki code .sGFVr, html code.shiki .sGFVr{--shiki-light:#91B859;--shiki-default:#91B859;--shiki-dark:#C3E88D}html pre.shiki code .sWuyu, html code.shiki .sWuyu{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#90A4AE;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}html pre.shiki code .s8R28, html code.shiki .s8R28{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#39ADB5;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .s1nJG, html code.shiki .s1nJG{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#90A4AE;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}html pre.shiki code .sbKd-, html code.shiki .sbKd-{--shiki-light:#FF5370;--shiki-default:#FF5370;--shiki-dark:#FF9CAC}",{"title":1160,"searchDepth":1189,"depth":1189,"links":4693},[4694,4695,4696,4697,4698,4699,4700,4701],{"id":1145,"depth":1189,"text":1146},{"id":1891,"depth":1189,"text":1892},{"id":2682,"depth":1189,"text":2683},{"id":2947,"depth":1189,"text":2948},{"id":3084,"depth":1189,"text":3085},{"id":3291,"depth":1189,"text":3292},{"id":4169,"depth":1189,"text":4170},{"id":4302,"depth":1189,"text":4303,"children":4702},[4703],{"id":4676,"depth":1202,"text":4677},"Apply transitions between pages and layouts with Vue or native browser View Transitions.","md",{},{"icon":62},{"title":59,"description":4704},"0DjImUjBN2GuF7w9CBswJ7_V25tkUCLXRH5NnbyRtw4",[4711,4713],{"title":54,"path":55,"stem":56,"description":4712,"icon":57,"children":-1},"Improve your Nuxt app's SEO with powerful head config, composables and components.",{"title":64,"path":65,"stem":66,"description":4714,"icon":67,"children":-1},"Nuxt provides composables to handle data fetching within your application.",1748853343852]