[{"data":1,"prerenderedAt":249},["ShallowReactive",2],{"navigation_docs":3,"-components-plus-modal-page":81,"-components-plus-modal-page-surround":244},[4,27,41,67],{"title":5,"icon":6,"path":7,"stem":8,"children":9,"page":26},"Getting Started","i-lucide-rocket","\u002Fgetting-started","1.getting-started",[10,14,18,22],{"title":11,"path":12,"stem":13},"Introduction","\u002Fgetting-started\u002Fintroduction","1.getting-started\u002F1.introduction",{"title":15,"path":16,"stem":17},"Installation","\u002Fgetting-started\u002Finstallation","1.getting-started\u002F2.installation",{"title":19,"path":20,"stem":21},"Configuration","\u002Fgetting-started\u002Fconfiguration","1.getting-started\u002F3.configuration",{"title":23,"path":24,"stem":25},"Directory Structure","\u002Fgetting-started\u002Fdirectory-structure","1.getting-started\u002F4.directory-structure",false,{"title":28,"icon":29,"path":30,"stem":31,"children":32,"page":26},"Routing","i-lucide-route","\u002Frouting","2.routing",[33,37],{"title":34,"path":35,"stem":36},"Parallel Routes","\u002Frouting\u002Fparallel-routes","2.routing\u002F1.parallel-routes",{"title":38,"path":39,"stem":40},"Modal Routes","\u002Frouting\u002Fmodal-routes","2.routing\u002F2.modal-routes",{"title":42,"icon":43,"path":44,"stem":45,"children":46,"page":26},"Components","i-lucide-blocks","\u002Fcomponents","3.components",[47,51,55,59,63],{"title":48,"path":49,"stem":50},"\u003CPlusParallelPage \u002F>","\u002Fcomponents\u002Fplus-parallel-page","3.components\u002F1.plus-parallel-page",{"title":52,"path":53,"stem":54},"\u003CPlusModalApp \u002F>","\u002Fcomponents\u002Fplus-modal-app","3.components\u002F2.plus-modal-app",{"title":56,"path":57,"stem":58},"\u003CPlusModalNuxtPage \u002F>","\u002Fcomponents\u002Fplus-modal-nuxt-page","3.components\u002F3.plus-modal-nuxt-page",{"title":60,"path":61,"stem":62},"\u003CPlusModalPage \u002F>","\u002Fcomponents\u002Fplus-modal-page","3.components\u002F4.plus-modal-page",{"title":64,"path":65,"stem":66},"\u003CPlusModalLink \u002F>","\u002Fcomponents\u002Fplus-modal-link","3.components\u002F5.plus-modal-link",{"title":68,"icon":69,"path":70,"stem":71,"children":72,"page":26},"API","i-lucide-braces","\u002Fapi","4.api",[73,77],{"title":74,"path":75,"stem":76},"Composables","\u002Fapi\u002Fcomposables","4.api\u002F2.composables",{"title":78,"path":79,"stem":80},"Interfaces","\u002Fapi\u002Finterfaces","4.api\u002F3.interfaces",{"id":82,"title":60,"body":83,"description":237,"extension":238,"links":239,"meta":240,"navigation":241,"path":61,"seo":242,"stem":62,"__hash__":243},"docs\u002F3.components\u002F4.plus-modal-page.md",{"type":84,"value":85,"toc":234},"minimark",[86,101,133,138,145,230],[87,88,89,90,96,97,100],"p",{},"This component uses ",[91,92,93],"a",{"href":49},[94,95,48],"code",{}," at the underlying level for implementation but enables ",[94,98,99],{},"hide-fallback"," by default.",[87,102,103,104,110,111,116,117,123,124,127,128,132],{},"It also only renders while a modal route is open (see ",[91,105,107],{"href":106},"\u002Fapi\u002Finterfaces#modalrouter",[94,108,109],{},"ModalRouter.isOpen","), i.e. when the modal was opened through ",[91,112,113],{"href":65},[94,114,115],{},"\u003CPlusModalLink>"," or ",[91,118,120],{"href":119},"\u002Fapi\u002Fcomposables#usemodalrouter",[94,121,122],{},"$modalRouter",". A route reached by direct navigation (entering the URL, refreshing, or a plain ",[94,125,126],{},"NuxtLink",") renders as a plain full page and this outlet stays empty — even while a pending navigation still displays the previous page. If you need a parallel outlet that renders regardless of the modal state, use ",[91,129,130],{"href":49},[94,131,48],{}," directly.",[134,135,137],"h2",{"id":136},"usage","Usage",[139,140,141,142,144],"note",{},"Feel free to read ",[91,143,38],{"href":39}," first to know how to setup Modal Routes.",[146,147,153],"pre",{"className":148,"code":149,"filename":150,"language":151,"meta":152,"style":152},"language-html shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Ctemplate>\n  \u003Cdiv>\n    \u003CPlusModalPage name=\"foo\" \u002F>\n  \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n","pages\u002Findex.vue","html","",[94,154,155,171,182,210,220],{"__ignoreMap":152},[156,157,160,164,168],"span",{"class":158,"line":159},"line",1,[156,161,163],{"class":162},"sMK4o","\u003C",[156,165,167],{"class":166},"swJcz","template",[156,169,170],{"class":162},">\n",[156,172,174,177,180],{"class":158,"line":173},2,[156,175,176],{"class":162},"  \u003C",[156,178,179],{"class":166},"div",[156,181,170],{"class":162},[156,183,185,188,191,195,198,201,205,207],{"class":158,"line":184},3,[156,186,187],{"class":162},"    \u003C",[156,189,190],{"class":166},"PlusModalPage",[156,192,194],{"class":193},"spNyl"," name",[156,196,197],{"class":162},"=",[156,199,200],{"class":162},"\"",[156,202,204],{"class":203},"sfazB","foo",[156,206,200],{"class":162},[156,208,209],{"class":162}," \u002F>\n",[156,211,213,216,218],{"class":158,"line":212},4,[156,214,215],{"class":162},"  \u003C\u002F",[156,217,179],{"class":166},[156,219,170],{"class":162},[156,221,223,226,228],{"class":158,"line":222},5,[156,224,225],{"class":162},"\u003C\u002F",[156,227,167],{"class":166},[156,229,170],{"class":162},[231,232,233],"style",{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}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);}",{"title":152,"searchDepth":173,"depth":173,"links":235},[236],{"id":136,"depth":173,"text":137},"Component to use for rendering a modal page.","md",null,{},true,{"title":60,"description":237},"Wn2Ka1btVn-CCsw1kj4HrSDyB-fzeR3YVqYXnA2Qehk",[245,247],{"title":56,"path":57,"stem":58,"description":246,"children":-1},"A backward-compatible, page-only component for rendering the background route of a modal.",{"title":64,"path":65,"stem":66,"description":248,"children":-1},"Component to open a modal with a url or navigate inside modal view.",1786800921650]