0:[[["",{"children":["layouts",{"children":["",{}]}]},null,null,true],"$L1",["$L2",null]]]
2:[[["$","meta",null,{"charSet":"utf-8"}],["$","title",null,{"children":"Nested Layouts | Next.js App Router"}],["$","meta",null,{"name":"description","content":"A playground to explore new Next.js App Router features such as nested layouts, instant loading states, streaming, and component level data fetching."}],null,null,null,null,null,null,null,null,["$","meta",null,{"name":"viewport","content":"width=device-width, initial-scale=1"}],null,null,null,null,null,null,null,null,null,null,[]],[null,null,null,null],null,null,[null,null,null,null,null],null,null,null,null,[null,[["$","link",null,{"rel":"icon","href":"/_next/static/media/metadata/favicon.7161ee1d.ico","type":"image/x-icon","sizes":"any"}]],[],null]]
3:I{"id":"7581","name":"GlobalNav","chunks":["2575:2575-db88cfed28c36444","3185:app/layout-aa3a5899f5f2a9fe"],"async":false}
4:I{"id":"7088","name":"AddressBar","chunks":["2575:2575-db88cfed28c36444","3185:app/layout-aa3a5899f5f2a9fe"],"async":false}
5:I{"id":"8041","name":"","chunks":["2272:webpack-f863700beac54e80","9701:9701-a5c4ac6177b0a61e"],"async":false}
6:I{"id":"26","name":"","chunks":["2272:webpack-f863700beac54e80","9701:9701-a5c4ac6177b0a61e"],"async":false}
1:[["$","html",null,{"lang":"en","className":"[color-scheme:dark]","children":[["$","head",null,{}],["$","body",null,{"className":"overflow-y-scroll bg-gray-1100 bg-[url('/grid.svg')]","children":[["$","$L3",null,{}],["$","div",null,{"className":"lg:pl-72","children":["$","div",null,{"className":"mx-auto max-w-4xl space-y-8 px-2 pt-20 lg:py-8 lg:px-8","children":[["$","div",null,{"className":"rounded-lg bg-vc-border-gradient p-px shadow-lg shadow-black/20","children":["$","div",null,{"className":"rounded-lg bg-black","children":["$","$L4",null,{}]}]}],["$","div",null,{"className":"rounded-lg bg-vc-border-gradient p-px shadow-lg shadow-black/20","children":["$","div",null,{"className":"rounded-lg bg-black p-3.5 lg:p-6","children":["$","$L5",null,{"parallelRouterKey":"children","segmentPath":["children"],"hasLoading":false,"template":["$","$L6",null,{}],"notFound":["$","div",null,{"className":"relative rounded-lg border border-dashed p-4 lg:p-9 border-vercel-pink animate-[rerender_1s_ease-in-out_1] text-vercel-pink","children":[["$","div",null,{"className":"absolute -top-2.5 flex gap-x-1 text-[9px] uppercase leading-4 tracking-widest left-4 lg:left-9","children":[["$","div",null,{"className":"rounded-full px-1.5 shadow-[0_0_1px_3px_black] bg-vercel-pink text-white animate-[highlight_1s_ease-in-out_1]","children":"not-found.tsx"}]]}],["$","div",null,{"className":"space-y-4 text-vercel-pink","children":[["$","h2",null,{"className":"text-lg font-bold","children":"Not Found"}],["$","p",null,{"className":"text-sm","children":"Could not find requested resource"}]]}]]}],"notFoundStyles":[],"childProp":{"current":["$L7",null,null,[]],"segment":"layouts"}}]}]}],["$","div",null,{"className":"rounded-lg bg-vc-border-gradient p-px shadow-lg shadow-black/20","children":["$","div",null,{"className":"rounded-lg bg-black","children":["$","div",null,{"className":"flex items-center justify-between gap-x-4 p-3.5 lg:px-5 lg:py-3","children":[["$","div",null,{"className":"flex items-center gap-x-1.5","children":[["$","div",null,{"className":"text-sm text-gray-400","children":"By"}],["$","a",null,{"href":"https://vercel.com","title":"Vercel","children":["$","div",null,{"className":"w-16 text-gray-100 hover:text-gray-50","children":["$","svg",null,{"viewBox":"0 0 4438 1000","fill":"currentColor","xmlns":"http://www.w3.org/2000/svg","children":["$","path",null,{"d":"M2223.75 250C2051.25 250 1926.87 362.5 1926.87 531.25C1926.87 700 2066.72 812.5 2239.38 812.5C2343.59 812.5 2435.47 771.25 2492.34 701.719L2372.81 632.656C2341.25 667.188 2293.28 687.344 2239.38 687.344C2164.53 687.344 2100.94 648.281 2077.34 585.781H2515.16C2518.59 568.281 2520.63 550.156 2520.63 531.094C2520.63 362.5 2396.41 250 2223.75 250ZM2076.09 476.562C2095.62 414.219 2149.06 375 2223.75 375C2298.59 375 2352.03 414.219 2371.41 476.562H2076.09ZM2040.78 78.125L1607.81 828.125L1174.69 78.125H1337.03L1607.66 546.875L1878.28 78.125H2040.78ZM577.344 0L1154.69 1000H0L577.344 0ZM3148.75 531.25C3148.75 625 3210 687.5 3305 687.5C3369.38 687.5 3417.66 658.281 3442.5 610.625L3562.5 679.844C3512.81 762.656 3419.69 812.5 3305 812.5C3132.34 812.5 3008.13 700 3008.13 531.25C3008.13 362.5 3132.5 250 3305 250C3419.69 250 3512.66 299.844 3562.5 382.656L3442.5 451.875C3417.66 404.219 3369.38 375 3305 375C3210.16 375 3148.75 437.5 3148.75 531.25ZM4437.5 78.125V796.875H4296.88V78.125H4437.5ZM3906.25 250C3733.75 250 3609.38 362.5 3609.38 531.25C3609.38 700 3749.38 812.5 3921.88 812.5C4026.09 812.5 4117.97 771.25 4174.84 701.719L4055.31 632.656C4023.75 667.188 3975.78 687.344 3921.88 687.344C3847.03 687.344 3783.44 648.281 3759.84 585.781H4197.66C4201.09 568.281 4203.12 550.156 4203.12 531.094C4203.12 362.5 4078.91 250 3906.25 250ZM3758.59 476.562C3778.13 414.219 3831.41 375 3906.25 375C3981.09 375 4034.53 414.219 4053.91 476.562H3758.59ZM2961.25 265.625V417.031C2945.63 412.5 2929.06 409.375 2911.25 409.375C2820.47 409.375 2755 471.875 2755 565.625V796.875H2614.38V265.625H2755V409.375C2755 330 2847.34 265.625 2961.25 265.625Z"}]}]}]}]]}],["$","div",null,{"className":"text-sm text-gray-400","children":[["$","a",null,{"className":"underline decoration-dotted underline-offset-4 hover:text-gray-400","href":"https://github.com/vercel/app-playground","target":"_blank","rel":"noreferrer","children":"View code"}]," or ",["$","a",null,{"className":"underline decoration-dotted underline-offset-4 hover:text-gray-400","href":"https://vercel.com/templates/next.js/app-directory","target":"_blank","rel":"noreferrer","children":"deploy your own"}]]}]]}]}]}]]}]}]]}]]}],null,null,[["$","link","0",{"rel":"stylesheet","href":"/_next/static/css/e4f82a68ac8c2ed1.css","precedence":"next.js"}]]]
8:I{"id":"5803","name":"Tab","chunks":["2575:2575-db88cfed28c36444","5699:app/styling/layout-e26dcd28fbfe3afe"],"async":false}
9:I{"id":"1430","name":"ClickCounter","chunks":["2575:2575-db88cfed28c36444","2289:app/route-groups/(shop)/layout-c1d2373ab709a3a4"],"async":false}
7:["$","div",null,{"className":"space-y-9","children":[["$","div",null,{"className":"flex justify-between","children":[["$","div",null,{"className":"flex flex-wrap items-center gap-2","children":[["$","$L8","/layoutsundefined",{"item":{"text":"Home"},"path":"/layouts"}],["$","$L8","/layoutselectronics",{"item":{"text":"Electronics","slug":"electronics"},"path":"/layouts"}],["$","$L8","/layoutsclothing",{"item":{"text":"Clothing","slug":"clothing"},"path":"/layouts"}],["$","$L8","/layoutsbooks",{"item":{"text":"Books","slug":"books"},"path":"/layouts"}]]}],["$","div",null,{"className":"self-start","children":["$","$L9",null,{}]}]]}],["$","div",null,{"children":["$","$L5",null,{"parallelRouterKey":"children","segmentPath":["children","layouts","children"],"hasLoading":false,"template":["$","div",null,{"className":"relative rounded-lg border border-dashed p-4 lg:p-9 border-gray-700 animate-[rerender_1s_ease-in-out_1] text-vercel-pink","children":[["$","div",null,{"className":"absolute -top-2.5 flex gap-x-1 text-[9px] uppercase leading-4 tracking-widest left-4 lg:left-9","children":[["$","div",null,{"className":"rounded-full px-1.5 shadow-[0_0_1px_3px_black] bg-gray-800 text-gray-300 animate-[highlight_1s_ease-in-out_1]","children":"children"}]]}],["$","$L6",null,{}]]}],"templateStyles":[],"childProp":{"current":[["$","div",null,{"className":"prose prose-sm prose-invert max-w-none","children":[["$","h1",null,{"className":"text-xl font-bold","children":"Layouts"}],["$","ul",null,{"children":[["$","li",null,{"children":"A layout is UI that is shared between multiple pages. On navigation, layouts preserve state, remain interactive, and do not re-render. Two or more layouts can also be nested."}],["$","li",null,{"children":"Try navigating between categories and sub categories."}]]}],["$","div",null,{"className":"flex gap-2","children":[["$","a",null,{"href":"https://beta.nextjs.org/docs/routing/pages-and-layouts","className":"inline-flex gap-x-2 rounded-lg bg-gray-700 px-3 py-1 text-sm font-medium text-gray-100 no-underline hover:bg-gray-500 hover:text-white","children":[["$","div",null,{"children":"Docs"}],["$","svg",null,{"xmlns":"http://www.w3.org/2000/svg","fill":"none","viewBox":"0 0 24 24","strokeWidth":2,"stroke":"currentColor","aria-hidden":"true","className":"block w-4","children":["$","path",null,{"strokeLinecap":"round","strokeLinejoin":"round","d":"M14 5l7 7m0 0l-7 7m7-7H3"}]}]]}],["$","a",null,{"href":"https://github.com/vercel/app-playground/tree/main/app/layouts","className":"inline-flex gap-x-2 rounded-lg bg-gray-700 px-3 py-1 text-sm font-medium text-gray-100 no-underline hover:bg-gray-500 hover:text-white","children":[["$","div",null,{"children":"Code"}],["$","svg",null,{"xmlns":"http://www.w3.org/2000/svg","fill":"none","viewBox":"0 0 24 24","strokeWidth":2,"stroke":"currentColor","aria-hidden":"true","className":"block w-4","children":["$","path",null,{"strokeLinecap":"round","strokeLinejoin":"round","d":"M14 5l7 7m0 0l-7 7m7-7H3"}]}]]}]]}]]}],null,null,[]],"segment":""}}]}]]}]