[{"data":1,"prerenderedAt":816},["ShallowReactive",2],{"navigation_docs":3,"-api-plugin":188,"-api-plugin-surround":811},[4,9,27,52,101,130,163],{"title":5,"path":6,"stem":7,"icon":8},"Playground","\u002Fplayground","1.playground","i-lucide-flask-conical",{"title":10,"path":11,"stem":12,"children":13,"page":26},"Getting Started","\u002Fgetting-started","2.getting-started",[14,18,22],{"title":15,"path":16,"stem":17},"Introduction","\u002Fgetting-started\u002Fintroduction","2.getting-started\u002F1.introduction",{"title":19,"path":20,"stem":21},"Installation","\u002Fgetting-started\u002Finstallation","2.getting-started\u002F2.installation",{"title":23,"path":24,"stem":25},"First modal","\u002Fgetting-started\u002Ffirst-modal","2.getting-started\u002F3.first-modal",false,{"title":28,"path":29,"stem":30,"children":31,"page":26},"Concepts","\u002Fconcepts","3.concepts",[32,36,40,44,48],{"title":33,"path":34,"stem":35},"Architecture","\u002Fconcepts\u002Farchitecture","3.concepts\u002F1.architecture",{"title":37,"path":38,"stem":39},"Imperative flow","\u002Fconcepts\u002Fimperative-flow","3.concepts\u002F2.imperative-flow",{"title":41,"path":42,"stem":43},"Stacking","\u002Fconcepts\u002Fstacking","3.concepts\u002F3.stacking",{"title":45,"path":46,"stem":47},"Groups","\u002Fconcepts\u002Fgroups","3.concepts\u002F4.groups",{"title":49,"path":50,"stem":51},"Headless primitives","\u002Fconcepts\u002Fheadless-primitives","3.concepts\u002F5.headless-primitives",{"title":53,"path":54,"stem":55,"children":56,"page":26},"Guide","\u002Fguide","4.guide",[57,61,65,69,73,77,81,85,89,93,97],{"title":58,"path":59,"stem":60},"Writing a modal","\u002Fguide\u002Fwriting-a-modal","4.guide\u002F01.writing-a-modal",{"title":62,"path":63,"stem":64},"Opening & closing","\u002Fguide\u002Fopening-and-closing","4.guide\u002F02.opening-and-closing",{"title":66,"path":67,"stem":68},"Props & results","\u002Fguide\u002Fpassing-props-and-results","4.guide\u002F03.passing-props-and-results",{"title":70,"path":71,"stem":72},"Behavior options","\u002Fguide\u002Fbehavior-options","4.guide\u002F04.behavior-options",{"title":74,"path":75,"stem":76},"Animations & styling","\u002Fguide\u002Fstyling-and-animations","4.guide\u002F05.styling-and-animations",{"title":78,"path":79,"stem":80},"useModal composable","\u002Fguide\u002Fusemodal-composable","4.guide\u002F06.usemodal-composable",{"title":82,"path":83,"stem":84},"Modal context","\u002Fguide\u002Fmodal-context","4.guide\u002F07.modal-context",{"title":86,"path":87,"stem":88},"Multiple targets","\u002Fguide\u002Fmultiple-targets","4.guide\u002F08.multiple-targets",{"title":90,"path":91,"stem":92},"Overlay","\u002Fguide\u002Foverlay","4.guide\u002F09.overlay",{"title":94,"path":95,"stem":96},"Async components","\u002Fguide\u002Fasync-components","4.guide\u002F10.async-components",{"title":98,"path":99,"stem":100},"TypeScript","\u002Fguide\u002Ftypescript","4.guide\u002F11.typescript",{"title":102,"path":103,"stem":104,"children":105,"page":26},"Recipes","\u002Frecipes","5.recipes",[106,110,114,118,122,126],{"title":107,"path":108,"stem":109},"Confirm dialog","\u002Frecipes\u002Fconfirm-dialog","5.recipes\u002F1.confirm-dialog",{"title":111,"path":112,"stem":113},"Form modal with validation","\u002Frecipes\u002Fform-modal-with-validation","5.recipes\u002F2.form-modal-with-validation",{"title":115,"path":116,"stem":117},"Image lightbox","\u002Frecipes\u002Fimage-lightbox","5.recipes\u002F3.image-lightbox",{"title":119,"path":120,"stem":121},"Command palette","\u002Frecipes\u002Fcommand-palette","5.recipes\u002F4.command-palette",{"title":123,"path":124,"stem":125},"Nested flows \u002F wizards","\u002Frecipes\u002Fnested-flows","5.recipes\u002F5.nested-flows",{"title":127,"path":128,"stem":129},"Global error modal","\u002Frecipes\u002Fglobal-error-modal","5.recipes\u002F6.global-error-modal",{"title":131,"path":132,"stem":133,"children":134,"page":26},"Api","\u002Fapi","6.api",[135,139,143,147,151,155,159],{"title":136,"path":137,"stem":138},"Functions","\u002Fapi\u002Ffunctions","6.api\u002F1.functions",{"title":140,"path":141,"stem":142},"Components","\u002Fapi\u002Fcomponents","6.api\u002F2.components",{"title":144,"path":145,"stem":146},"Composables","\u002Fapi\u002Fcomposables","6.api\u002F3.composables",{"title":148,"path":149,"stem":150},"Plugin","\u002Fapi\u002Fplugin","6.api\u002F4.plugin",{"title":152,"path":153,"stem":154},"State helpers","\u002Fapi\u002Fstate","6.api\u002F5.state",{"title":156,"path":157,"stem":158},"Global events","\u002Fapi\u002Fevents","6.api\u002F6.events",{"title":160,"path":161,"stem":162},"Types","\u002Fapi\u002Ftypes","6.api\u002F7.types",{"title":164,"path":165,"stem":166,"children":167,"page":26},"Resources","\u002Fresources","7.resources",[168,172,176,180,184],{"title":169,"path":170,"stem":171},"Migration from v1","\u002Fresources\u002Fmigration-from-v1","7.resources\u002F1.migration-from-v1",{"title":173,"path":174,"stem":175},"FAQ","\u002Fresources\u002Ffaq","7.resources\u002F2.faq",{"title":177,"path":178,"stem":179},"Troubleshooting","\u002Fresources\u002Ftroubleshooting","7.resources\u002F3.troubleshooting",{"title":181,"path":182,"stem":183},"Comparison","\u002Fresources\u002Fcomparison","7.resources\u002F4.comparison",{"title":185,"path":186,"stem":187},"Changelog","\u002Fresources\u002Fchangelog","7.resources\u002F5.changelog",{"id":189,"title":148,"body":190,"description":805,"extension":806,"links":807,"meta":808,"navigation":266,"path":149,"seo":809,"stem":150,"__hash__":810},"docs\u002F6.api\u002F4.plugin.md",{"type":191,"value":192,"toc":796},"minimark",[193,197,205,213,218,297,301,355,388,393,464,495,508,512,757,761,774,792],[194,195,148],"h1",{"id":196},"plugin",[198,199,201],"h2",{"id":200},"createmodaloptions-plugin",[202,203,204],"code",{},"createModal(options?) → Plugin",[206,207,208,209,212],"p",{},"Creates a Vue plugin that stores per-group behavior configuration and returns it to ",[202,210,211],{},"app.use()",".",[214,215,217],"h3",{"id":216},"signature","Signature",[219,220,225],"pre",{"className":221,"code":222,"language":223,"meta":224,"style":224},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","function createModal(options?: CreateModalOptions): Plugin\n\ninterface CreateModalOptions {\n  groups?: ModalGroupsConfig\n}\n","ts","",[202,226,227,261,268,279,291],{"__ignoreMap":224},[228,229,232,236,240,244,248,251,255,258],"span",{"class":230,"line":231},"line",1,[228,233,235],{"class":234},"spNyl","function",[228,237,239],{"class":238},"s2Zo4"," createModal",[228,241,243],{"class":242},"sMK4o","(",[228,245,247],{"class":246},"sHdIc","options",[228,249,250],{"class":242},"?:",[228,252,254],{"class":253},"sBMFI"," CreateModalOptions",[228,256,257],{"class":242},"):",[228,259,260],{"class":253}," Plugin\n",[228,262,264],{"class":230,"line":263},2,[228,265,267],{"emptyLinePlaceholder":266},true,"\n",[228,269,271,274,276],{"class":230,"line":270},3,[228,272,273],{"class":234},"interface",[228,275,254],{"class":253},[228,277,278],{"class":242}," {\n",[228,280,282,286,288],{"class":230,"line":281},4,[228,283,285],{"class":284},"swJcz","  groups",[228,287,250],{"class":242},[228,289,290],{"class":253}," ModalGroupsConfig\n",[228,292,294],{"class":230,"line":293},5,[228,295,296],{"class":242},"}\n",[214,298,300],{"id":299},"parameters","Parameters",[302,303,304,323],"table",{},[305,306,307],"thead",{},[308,309,310,314,317,320],"tr",{},[311,312,313],"th",{},"Parameter",[311,315,316],{},"Type",[311,318,319],{},"Required",[311,321,322],{},"Description",[324,325,326],"tbody",{},[308,327,328,333,338,341],{},[329,330,331],"td",{},[202,332,247],{},[329,334,335],{},[202,336,337],{},"CreateModalOptions",[329,339,340],{},"no",[329,342,343,344,347,348,212],{},"Plugin configuration. Currently a single field — ",[202,345,346],{},"groups"," — that lets you set behavior defaults per registered group. See ",[349,350,352],"a",{"href":351},"\u002Fapi\u002Ftypes#modalgroupsconfig",[202,353,354],{},"ModalGroupsConfig",[206,356,357,358,361,362,365,366,370,371,374,375,378,379,381,382,384,385,387],{},"The returned plugin's ",[202,359,360],{},"install()"," method is intentionally empty — ",[202,363,364],{},"createModal"," does ",[367,368,369],"strong",{},"not"," register any global components. All components (",[202,372,373],{},"\u003CModalTarget>",", ",[202,376,377],{},"\u003CModalRoot>",", etc.) must be imported and registered locally or globally yourself. The only side-effect of ",[202,380,364],{}," is persisting the ",[202,383,346],{}," config so that ",[202,386,373],{}," instances can read it at mount time.",[214,389,391],{"id":390},"createmodaloptions",[202,392,337],{},[219,394,396],{"className":221,"code":395,"language":223,"meta":224,"style":224},"interface CreateModalOptions {\n  groups?: ModalGroupsConfig\n}\n\ntype ModalGroupsConfig = {\n  [K in ModalGroup]?: ModalBehaviorOptions\n}\n",[202,397,398,406,414,418,422,435,459],{"__ignoreMap":224},[228,399,400,402,404],{"class":230,"line":231},[228,401,273],{"class":234},[228,403,254],{"class":253},[228,405,278],{"class":242},[228,407,408,410,412],{"class":230,"line":263},[228,409,285],{"class":284},[228,411,250],{"class":242},[228,413,290],{"class":253},[228,415,416],{"class":230,"line":270},[228,417,296],{"class":242},[228,419,420],{"class":230,"line":281},[228,421,267],{"emptyLinePlaceholder":266},[228,423,424,427,430,433],{"class":230,"line":293},[228,425,426],{"class":234},"type",[228,428,429],{"class":253}," ModalGroupsConfig",[228,431,432],{"class":242}," =",[228,434,278],{"class":242},[228,436,438,442,445,448,451,454,456],{"class":230,"line":437},6,[228,439,441],{"class":440},"sTEyZ","  [",[228,443,444],{"class":253},"K",[228,446,447],{"class":242}," in",[228,449,450],{"class":253}," ModalGroup",[228,452,453],{"class":440},"]",[228,455,250],{"class":242},[228,457,458],{"class":253}," ModalBehaviorOptions\n",[228,460,462],{"class":230,"line":461},7,[228,463,296],{"class":242},[302,465,466,477],{},[305,467,468],{},[308,469,470,473,475],{},[311,471,472],{},"Field",[311,474,316],{},[311,476,322],{},[324,478,479],{},[308,480,481,485,489],{},[329,482,483],{},[202,484,346],{},[329,486,487],{},[202,488,354],{},[329,490,491,492,212],{},"Optional map of group keys → behavior defaults. Keys are constrained to your ",[202,493,494],{},"ModalGroupRegistry",[206,496,497,498,500,501,504,505,507],{},"See ",[349,499,160],{"href":161}," for the full ",[202,502,503],{},"ModalBehaviorOptions"," field list, and ",[349,506,45],{"href":46}," for the group system overview.",[214,509,511],{"id":510},"installation-example","Installation example",[219,513,515],{"className":221,"code":514,"language":223,"meta":224,"style":224},"import { createApp } from 'vue'\nimport { createModal } from '@kolirt\u002Fvue-modal'\nimport App from '.\u002FApp.vue'\n\ncreateApp(App)\n  .use(\n    createModal({\n      groups: {\n        default: {},\n        confirm: {\n          disableCloseOnEscape: true,\n          disableCloseOnInteractOverlay: true\n        },\n        preview: {\n          enableInteractOutside: true,\n          disableLockBodyScroll: true\n        }\n      }\n    })\n  )\n  .mount('#app')\n",[202,516,517,545,564,581,585,593,604,614,625,636,646,661,672,678,688,700,710,716,722,731,737],{"__ignoreMap":224},[228,518,519,523,526,529,532,535,538,542],{"class":230,"line":231},[228,520,522],{"class":521},"s7zQu","import",[228,524,525],{"class":242}," {",[228,527,528],{"class":440}," createApp",[228,530,531],{"class":242}," }",[228,533,534],{"class":521}," from",[228,536,537],{"class":242}," '",[228,539,541],{"class":540},"sfazB","vue",[228,543,544],{"class":242},"'\n",[228,546,547,549,551,553,555,557,559,562],{"class":230,"line":263},[228,548,522],{"class":521},[228,550,525],{"class":242},[228,552,239],{"class":440},[228,554,531],{"class":242},[228,556,534],{"class":521},[228,558,537],{"class":242},[228,560,561],{"class":540},"@kolirt\u002Fvue-modal",[228,563,544],{"class":242},[228,565,566,568,571,574,576,579],{"class":230,"line":270},[228,567,522],{"class":521},[228,569,570],{"class":440}," App ",[228,572,573],{"class":521},"from",[228,575,537],{"class":242},[228,577,578],{"class":540},".\u002FApp.vue",[228,580,544],{"class":242},[228,582,583],{"class":230,"line":281},[228,584,267],{"emptyLinePlaceholder":266},[228,586,587,590],{"class":230,"line":293},[228,588,589],{"class":238},"createApp",[228,591,592],{"class":440},"(App)\n",[228,594,595,598,601],{"class":230,"line":437},[228,596,597],{"class":242},"  .",[228,599,600],{"class":238},"use",[228,602,603],{"class":440},"(\n",[228,605,606,609,611],{"class":230,"line":461},[228,607,608],{"class":238},"    createModal",[228,610,243],{"class":440},[228,612,613],{"class":242},"{\n",[228,615,617,620,623],{"class":230,"line":616},8,[228,618,619],{"class":284},"      groups",[228,621,622],{"class":242},":",[228,624,278],{"class":242},[228,626,628,631,633],{"class":230,"line":627},9,[228,629,630],{"class":284},"        default",[228,632,622],{"class":242},[228,634,635],{"class":242}," {},\n",[228,637,639,642,644],{"class":230,"line":638},10,[228,640,641],{"class":284},"        confirm",[228,643,622],{"class":242},[228,645,278],{"class":242},[228,647,649,652,654,658],{"class":230,"line":648},11,[228,650,651],{"class":284},"          disableCloseOnEscape",[228,653,622],{"class":242},[228,655,657],{"class":656},"sfNiH"," true",[228,659,660],{"class":242},",\n",[228,662,664,667,669],{"class":230,"line":663},12,[228,665,666],{"class":284},"          disableCloseOnInteractOverlay",[228,668,622],{"class":242},[228,670,671],{"class":656}," true\n",[228,673,675],{"class":230,"line":674},13,[228,676,677],{"class":242},"        },\n",[228,679,681,684,686],{"class":230,"line":680},14,[228,682,683],{"class":284},"        preview",[228,685,622],{"class":242},[228,687,278],{"class":242},[228,689,691,694,696,698],{"class":230,"line":690},15,[228,692,693],{"class":284},"          enableInteractOutside",[228,695,622],{"class":242},[228,697,657],{"class":656},[228,699,660],{"class":242},[228,701,703,706,708],{"class":230,"line":702},16,[228,704,705],{"class":284},"          disableLockBodyScroll",[228,707,622],{"class":242},[228,709,671],{"class":656},[228,711,713],{"class":230,"line":712},17,[228,714,715],{"class":242},"        }\n",[228,717,719],{"class":230,"line":718},18,[228,720,721],{"class":242},"      }\n",[228,723,725,728],{"class":230,"line":724},19,[228,726,727],{"class":242},"    }",[228,729,730],{"class":440},")\n",[228,732,734],{"class":230,"line":733},20,[228,735,736],{"class":440},"  )\n",[228,738,740,742,745,747,750,753,755],{"class":230,"line":739},21,[228,741,597],{"class":242},[228,743,744],{"class":238},"mount",[228,746,243],{"class":440},[228,748,749],{"class":242},"'",[228,751,752],{"class":540},"#app",[228,754,749],{"class":242},[228,756,730],{"class":440},[214,758,760],{"id":759},"config-precedence","Config precedence",[206,762,763,764,767,768,770,771,773],{},"Group config set here is the ",[367,765,766],{},"lowest priority"," layer. It is overridden by behavior props on each ",[202,769,373],{}," instance. See ",[349,772,70],{"href":71}," for the full cascade.",[775,776,779,780,782,783,785,786,789,790,212],"callout",{"color":777,"icon":778},"warning","i-lucide-triangle-alert","Keys of ",[202,781,346],{}," are type-checked against ",[202,784,494],{},". Passing an undeclared group key is a TypeScript error. Register groups first via ",[202,787,788],{},"declare module"," augmentation — see ",[349,791,19],{"href":20},[793,794,795],"style",{},"html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}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 .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .sfNiH, html code.shiki .sfNiH{--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC}",{"title":224,"searchDepth":263,"depth":263,"links":797},[798],{"id":200,"depth":263,"text":204,"children":799},[800,801,802,803,804],{"id":216,"depth":270,"text":217},{"id":299,"depth":270,"text":300},{"id":390,"depth":270,"text":337},{"id":510,"depth":270,"text":511},{"id":759,"depth":270,"text":760},"createModal() — the Vue plugin factory for @kolirt\u002Fvue-modal.","md",null,{},{"title":148,"description":805},"9HwEGqWeY5JYOi9_hC4JAUSZ7hFDR5kv5kADHmidV2E",[812,814],{"title":144,"path":145,"stem":146,"description":813,"children":-1},"useModal, useModalContext.",{"title":152,"path":153,"stem":154,"description":815,"children":-1},"Reactive read-only exports for observing the modal stack — modals, isOpened, groupModals, isGroupOpen.",1779523620192]