[{"data":1,"prerenderedAt":1287},["ShallowReactive",2],{"navigation_docs":3,"-concepts-imperative-flow":188,"-concepts-imperative-flow-surround":1282},[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":37,"body":190,"description":1276,"extension":1277,"links":1278,"meta":1279,"navigation":448,"path":38,"seo":1280,"stem":39,"__hash__":1281},"docs\u002F3.concepts\u002F2.imperative-flow.md",{"type":191,"value":192,"toc":1267},"minimark",[193,197,206,214,220,328,331,335,343,355,359,373,652,672,676,959,963,970,1164,1167,1173,1179,1253,1263],[194,195,37],"h1",{"id":196},"imperative-flow",[198,199,200,201,205],"p",{},"Modals are opened from code and ",[202,203,204],"code",{},"await","ed like any other async call. Result, cancellation, and chained logic stay in one function.",[207,208,210,211],"h2",{"id":209},"why-promises-not-v-model","Why promises, not ",[202,212,213],{},"v-model",[198,215,216,217,219],{},"A ",[202,218,213],{},"-style API splits a modal's outcome across props, refs, and event handlers. With a promise, the entire flow stays in one place:",[221,222,227],"pre",{"className":223,"code":224,"language":225,"meta":226,"style":226},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","const name = await openModal\u003Cstring>(NameDialog).catch(() => null)\nif (!name) return\nawait api.rename(id, name)\n","ts","",[202,228,229,288,306],{"__ignoreMap":226},[230,231,234,238,242,246,250,254,257,261,264,267,270,273,276,279,282,285],"span",{"class":232,"line":233},"line",1,[230,235,237],{"class":236},"spNyl","const",[230,239,241],{"class":240},"sTEyZ"," name ",[230,243,245],{"class":244},"sMK4o","=",[230,247,249],{"class":248},"s7zQu"," await",[230,251,253],{"class":252},"s2Zo4"," openModal",[230,255,256],{"class":244},"\u003C",[230,258,260],{"class":259},"sBMFI","string",[230,262,263],{"class":244},">",[230,265,266],{"class":240},"(NameDialog)",[230,268,269],{"class":244},".",[230,271,272],{"class":252},"catch",[230,274,275],{"class":240},"(",[230,277,278],{"class":244},"()",[230,280,281],{"class":236}," =>",[230,283,284],{"class":244}," null",[230,286,287],{"class":240},")\n",[230,289,291,294,297,300,303],{"class":232,"line":290},2,[230,292,293],{"class":248},"if",[230,295,296],{"class":240}," (",[230,298,299],{"class":244},"!",[230,301,302],{"class":240},"name) ",[230,304,305],{"class":248},"return\n",[230,307,309,311,314,316,319,322,325],{"class":232,"line":308},3,[230,310,204],{"class":248},[230,312,313],{"class":240}," api",[230,315,269],{"class":244},[230,317,318],{"class":252},"rename",[230,320,321],{"class":240},"(id",[230,323,324],{"class":244},",",[230,326,327],{"class":240}," name)\n",[198,329,330],{},"The modal call is a function call that happens to render UI. The caller awaits it, reads the result, and continues.",[207,332,334],{"id":333},"lifecycle","Lifecycle",[221,336,341],{"className":337,"code":339,"language":340},[338],"language-text","openModal(Component, options)\n  │\n  ├── component mounts inside its group target\n  │   user interacts …\n  │\n  ├── confirm(data)   → exit animation → promise resolves with data\n  └── close() \u002F Esc \u002F overlay → exit animation → promise rejects (ModalClosedError)\n","text",[202,342,339],{"__ignoreMap":226},[198,344,345,346,350,351,354],{},"The promise settles ",[347,348,349],"strong",{},"after"," the exit animation finishes, so your CSS transition always plays out. Pass ",[202,352,353],{},"instantExit: true"," to skip it.",[207,356,358],{"id":357},"inside-the-modal","Inside the modal",[198,360,361,364,365,368,369,372],{},[202,362,363],{},"useModalContext\u003CT>()"," exposes ",[202,366,367],{},"confirm(data)"," and ",[202,370,371],{},"close()",":",[221,374,379],{"className":375,"code":376,"filename":377,"language":378,"meta":226,"style":226},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup lang=\"ts\">\nimport { ModalRoot, ModalContent, useModalContext } from '@kolirt\u002Fvue-modal'\n\ndefineOptions({ modalGroup: 'default' })\n\nconst { close, confirm } = useModalContext\u003Cboolean>()\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CModalRoot>\n    \u003CModalContent>\n      \u003Cbutton @click=\"close()\">Cancel\u003C\u002Fbutton>\n      \u003Cbutton @click=\"confirm(true)\">OK\u003C\u002Fbutton>\n    \u003C\u002FModalContent>\n  \u003C\u002FModalRoot>\n\u003C\u002Ftemplate>\n","ConfirmDialog.vue","vue",[202,380,381,408,444,450,478,483,516,526,531,541,552,563,594,623,633,643],{"__ignoreMap":226},[230,382,383,385,389,392,395,397,400,403,405],{"class":232,"line":233},[230,384,256],{"class":244},[230,386,388],{"class":387},"swJcz","script",[230,390,391],{"class":236}," setup",[230,393,394],{"class":236}," lang",[230,396,245],{"class":244},[230,398,399],{"class":244},"\"",[230,401,225],{"class":402},"sfazB",[230,404,399],{"class":244},[230,406,407],{"class":244},">\n",[230,409,410,413,416,419,421,424,426,429,432,435,438,441],{"class":232,"line":290},[230,411,412],{"class":248},"import",[230,414,415],{"class":244}," {",[230,417,418],{"class":240}," ModalRoot",[230,420,324],{"class":244},[230,422,423],{"class":240}," ModalContent",[230,425,324],{"class":244},[230,427,428],{"class":240}," useModalContext",[230,430,431],{"class":244}," }",[230,433,434],{"class":248}," from",[230,436,437],{"class":244}," '",[230,439,440],{"class":402},"@kolirt\u002Fvue-modal",[230,442,443],{"class":244},"'\n",[230,445,446],{"class":232,"line":308},[230,447,449],{"emptyLinePlaceholder":448},true,"\n",[230,451,453,456,458,461,464,466,468,471,474,476],{"class":232,"line":452},4,[230,454,455],{"class":252},"defineOptions",[230,457,275],{"class":240},[230,459,460],{"class":244},"{",[230,462,463],{"class":387}," modalGroup",[230,465,372],{"class":244},[230,467,437],{"class":244},[230,469,470],{"class":402},"default",[230,472,473],{"class":244},"'",[230,475,431],{"class":244},[230,477,287],{"class":240},[230,479,481],{"class":232,"line":480},5,[230,482,449],{"emptyLinePlaceholder":448},[230,484,486,488,490,493,495,498,501,504,506,508,511,513],{"class":232,"line":485},6,[230,487,237],{"class":236},[230,489,415],{"class":244},[230,491,492],{"class":240}," close",[230,494,324],{"class":244},[230,496,497],{"class":240}," confirm ",[230,499,500],{"class":244},"}",[230,502,503],{"class":244}," =",[230,505,428],{"class":252},[230,507,256],{"class":244},[230,509,510],{"class":259},"boolean",[230,512,263],{"class":244},[230,514,515],{"class":240},"()\n",[230,517,519,522,524],{"class":232,"line":518},7,[230,520,521],{"class":244},"\u003C\u002F",[230,523,388],{"class":387},[230,525,407],{"class":244},[230,527,529],{"class":232,"line":528},8,[230,530,449],{"emptyLinePlaceholder":448},[230,532,534,536,539],{"class":232,"line":533},9,[230,535,256],{"class":244},[230,537,538],{"class":387},"template",[230,540,407],{"class":244},[230,542,544,547,550],{"class":232,"line":543},10,[230,545,546],{"class":244},"  \u003C",[230,548,549],{"class":387},"ModalRoot",[230,551,407],{"class":244},[230,553,555,558,561],{"class":232,"line":554},11,[230,556,557],{"class":244},"    \u003C",[230,559,560],{"class":387},"ModalContent",[230,562,407],{"class":244},[230,564,566,569,572,575,577,579,581,583,585,588,590,592],{"class":232,"line":565},12,[230,567,568],{"class":244},"      \u003C",[230,570,571],{"class":387},"button",[230,573,574],{"class":236}," @click",[230,576,245],{"class":244},[230,578,399],{"class":244},[230,580,371],{"class":402},[230,582,399],{"class":244},[230,584,263],{"class":244},[230,586,587],{"class":240},"Cancel",[230,589,521],{"class":244},[230,591,571],{"class":387},[230,593,407],{"class":244},[230,595,597,599,601,603,605,607,610,612,614,617,619,621],{"class":232,"line":596},13,[230,598,568],{"class":244},[230,600,571],{"class":387},[230,602,574],{"class":236},[230,604,245],{"class":244},[230,606,399],{"class":244},[230,608,609],{"class":402},"confirm(true)",[230,611,399],{"class":244},[230,613,263],{"class":244},[230,615,616],{"class":240},"OK",[230,618,521],{"class":244},[230,620,571],{"class":387},[230,622,407],{"class":244},[230,624,626,629,631],{"class":232,"line":625},14,[230,627,628],{"class":244},"    \u003C\u002F",[230,630,560],{"class":387},[230,632,407],{"class":244},[230,634,636,639,641],{"class":232,"line":635},15,[230,637,638],{"class":244},"  \u003C\u002F",[230,640,549],{"class":387},[230,642,407],{"class":244},[230,644,646,648,650],{"class":232,"line":645},16,[230,647,521],{"class":244},[230,649,538],{"class":387},[230,651,407],{"class":244},[653,654,655,664],"ul",{},[656,657,658,660,661,269],"li",{},[202,659,367],{}," — resolves the promise with ",[202,662,663],{},"data",[656,665,666,668,669,269],{},[202,667,371],{}," — rejects with ",[202,670,671],{},"ModalClosedError",[207,673,675],{"id":674},"on-the-calling-side","On the calling side",[221,677,679],{"className":223,"code":678,"language":225,"meta":226,"style":226},"import { openModal, ModalClosedError } from '@kolirt\u002Fvue-modal'\n\n\u002F\u002F Inline try\u002Fcatch — explicit success vs cancel\ntry {\n  const ok = await openModal\u003Cboolean>(ConfirmDialog, {\n    props: { message: 'Delete this item?' }\n  })\n  if (ok) await api.delete(id)\n} catch (e) {\n  if (!(e instanceof ModalClosedError)) throw e\n}\n\n\u002F\u002F .catch() shorthand — collapse cancel to a falsy value\nconst ok = await openModal\u003Cboolean>(ConfirmDialog, {\n  props: { message: 'Delete this item?' }\n}).catch(() => false)\n\nif (ok) await api.delete(id)\n",[202,680,681,704,708,714,722,751,775,782,811,824,851,856,860,865,891,912,935,940],{"__ignoreMap":226},[230,682,683,685,687,689,691,694,696,698,700,702],{"class":232,"line":233},[230,684,412],{"class":248},[230,686,415],{"class":244},[230,688,253],{"class":240},[230,690,324],{"class":244},[230,692,693],{"class":240}," ModalClosedError",[230,695,431],{"class":244},[230,697,434],{"class":248},[230,699,437],{"class":244},[230,701,440],{"class":402},[230,703,443],{"class":244},[230,705,706],{"class":232,"line":290},[230,707,449],{"emptyLinePlaceholder":448},[230,709,710],{"class":232,"line":308},[230,711,713],{"class":712},"sHwdD","\u002F\u002F Inline try\u002Fcatch — explicit success vs cancel\n",[230,715,716,719],{"class":232,"line":452},[230,717,718],{"class":248},"try",[230,720,721],{"class":244}," {\n",[230,723,724,727,730,732,734,736,738,740,742,744,747,749],{"class":232,"line":480},[230,725,726],{"class":236},"  const",[230,728,729],{"class":240}," ok",[230,731,503],{"class":244},[230,733,249],{"class":248},[230,735,253],{"class":252},[230,737,256],{"class":244},[230,739,510],{"class":259},[230,741,263],{"class":244},[230,743,275],{"class":387},[230,745,746],{"class":240},"ConfirmDialog",[230,748,324],{"class":244},[230,750,721],{"class":244},[230,752,753,756,758,760,763,765,767,770,772],{"class":232,"line":485},[230,754,755],{"class":387},"    props",[230,757,372],{"class":244},[230,759,415],{"class":244},[230,761,762],{"class":387}," message",[230,764,372],{"class":244},[230,766,437],{"class":244},[230,768,769],{"class":402},"Delete this item?",[230,771,473],{"class":244},[230,773,774],{"class":244}," }\n",[230,776,777,780],{"class":232,"line":518},[230,778,779],{"class":244},"  }",[230,781,287],{"class":387},[230,783,784,787,789,792,795,797,799,801,804,806,809],{"class":232,"line":528},[230,785,786],{"class":248},"  if",[230,788,296],{"class":387},[230,790,791],{"class":240},"ok",[230,793,794],{"class":387},") ",[230,796,204],{"class":248},[230,798,313],{"class":240},[230,800,269],{"class":244},[230,802,803],{"class":252},"delete",[230,805,275],{"class":387},[230,807,808],{"class":240},"id",[230,810,287],{"class":387},[230,812,813,815,818,821],{"class":232,"line":533},[230,814,500],{"class":244},[230,816,817],{"class":248}," catch",[230,819,820],{"class":240}," (e) ",[230,822,823],{"class":244},"{\n",[230,825,826,828,830,832,834,837,840,842,845,848],{"class":232,"line":543},[230,827,786],{"class":248},[230,829,296],{"class":387},[230,831,299],{"class":244},[230,833,275],{"class":387},[230,835,836],{"class":240},"e",[230,838,839],{"class":244}," instanceof",[230,841,693],{"class":259},[230,843,844],{"class":387},")) ",[230,846,847],{"class":248},"throw",[230,849,850],{"class":240}," e\n",[230,852,853],{"class":232,"line":554},[230,854,855],{"class":244},"}\n",[230,857,858],{"class":232,"line":565},[230,859,449],{"emptyLinePlaceholder":448},[230,861,862],{"class":232,"line":596},[230,863,864],{"class":712},"\u002F\u002F .catch() shorthand — collapse cancel to a falsy value\n",[230,866,867,869,872,874,876,878,880,882,884,887,889],{"class":232,"line":625},[230,868,237],{"class":236},[230,870,871],{"class":240}," ok ",[230,873,245],{"class":244},[230,875,249],{"class":248},[230,877,253],{"class":252},[230,879,256],{"class":244},[230,881,510],{"class":259},[230,883,263],{"class":244},[230,885,886],{"class":240},"(ConfirmDialog",[230,888,324],{"class":244},[230,890,721],{"class":244},[230,892,893,896,898,900,902,904,906,908,910],{"class":232,"line":635},[230,894,895],{"class":387},"  props",[230,897,372],{"class":244},[230,899,415],{"class":244},[230,901,762],{"class":387},[230,903,372],{"class":244},[230,905,437],{"class":244},[230,907,769],{"class":402},[230,909,473],{"class":244},[230,911,774],{"class":244},[230,913,914,916,919,921,923,925,927,929,933],{"class":232,"line":645},[230,915,500],{"class":244},[230,917,918],{"class":240},")",[230,920,269],{"class":244},[230,922,272],{"class":252},[230,924,275],{"class":240},[230,926,278],{"class":244},[230,928,281],{"class":236},[230,930,932],{"class":931},"sfNiH"," false",[230,934,287],{"class":240},[230,936,938],{"class":232,"line":937},17,[230,939,449],{"emptyLinePlaceholder":448},[230,941,943,945,948,950,952,954,956],{"class":232,"line":942},18,[230,944,293],{"class":248},[230,946,947],{"class":240}," (ok) ",[230,949,204],{"class":248},[230,951,313],{"class":240},[230,953,269],{"class":244},[230,955,803],{"class":252},[230,957,958],{"class":240},"(id)\n",[207,960,962],{"id":961},"chaining","Chaining",[198,964,965,966,969],{},"Because ",[202,967,968],{},"openModal"," returns a real promise, multi-step flows stay linear:",[221,971,973],{"className":223,"code":972,"language":225,"meta":226,"style":226},"async function rename() {\n  const name = await openModal\u003Cstring>(NameDialog).catch(() => null)\n  if (!name) return\n\n  const ok = await openModal\u003Cboolean>(ConfirmDialog, {\n    props: { message: `Rename to \"${name}\"?` }\n  }).catch(() => false)\n\n  if (ok) await api.rename(id, name)\n}\n",[202,974,975,990,1030,1045,1049,1075,1108,1128,1132,1160],{"__ignoreMap":226},[230,976,977,980,983,986,988],{"class":232,"line":233},[230,978,979],{"class":236},"async",[230,981,982],{"class":236}," function",[230,984,985],{"class":252}," rename",[230,987,278],{"class":244},[230,989,721],{"class":244},[230,991,992,994,997,999,1001,1003,1005,1007,1009,1011,1014,1016,1018,1020,1022,1024,1026,1028],{"class":232,"line":290},[230,993,726],{"class":236},[230,995,996],{"class":240}," name",[230,998,503],{"class":244},[230,1000,249],{"class":248},[230,1002,253],{"class":252},[230,1004,256],{"class":244},[230,1006,260],{"class":259},[230,1008,263],{"class":244},[230,1010,275],{"class":387},[230,1012,1013],{"class":240},"NameDialog",[230,1015,918],{"class":387},[230,1017,269],{"class":244},[230,1019,272],{"class":252},[230,1021,275],{"class":387},[230,1023,278],{"class":244},[230,1025,281],{"class":236},[230,1027,284],{"class":244},[230,1029,287],{"class":387},[230,1031,1032,1034,1036,1038,1041,1043],{"class":232,"line":308},[230,1033,786],{"class":248},[230,1035,296],{"class":387},[230,1037,299],{"class":244},[230,1039,1040],{"class":240},"name",[230,1042,794],{"class":387},[230,1044,305],{"class":248},[230,1046,1047],{"class":232,"line":452},[230,1048,449],{"emptyLinePlaceholder":448},[230,1050,1051,1053,1055,1057,1059,1061,1063,1065,1067,1069,1071,1073],{"class":232,"line":480},[230,1052,726],{"class":236},[230,1054,729],{"class":240},[230,1056,503],{"class":244},[230,1058,249],{"class":248},[230,1060,253],{"class":252},[230,1062,256],{"class":244},[230,1064,510],{"class":259},[230,1066,263],{"class":244},[230,1068,275],{"class":387},[230,1070,746],{"class":240},[230,1072,324],{"class":244},[230,1074,721],{"class":244},[230,1076,1077,1079,1081,1083,1085,1087,1090,1093,1096,1098,1100,1103,1106],{"class":232,"line":485},[230,1078,755],{"class":387},[230,1080,372],{"class":244},[230,1082,415],{"class":244},[230,1084,762],{"class":387},[230,1086,372],{"class":244},[230,1088,1089],{"class":244}," `",[230,1091,1092],{"class":402},"Rename to \"",[230,1094,1095],{"class":244},"${",[230,1097,1040],{"class":240},[230,1099,500],{"class":244},[230,1101,1102],{"class":402},"\"?",[230,1104,1105],{"class":244},"`",[230,1107,774],{"class":244},[230,1109,1110,1112,1114,1116,1118,1120,1122,1124,1126],{"class":232,"line":518},[230,1111,779],{"class":244},[230,1113,918],{"class":387},[230,1115,269],{"class":244},[230,1117,272],{"class":252},[230,1119,275],{"class":387},[230,1121,278],{"class":244},[230,1123,281],{"class":236},[230,1125,932],{"class":931},[230,1127,287],{"class":387},[230,1129,1130],{"class":232,"line":528},[230,1131,449],{"emptyLinePlaceholder":448},[230,1133,1134,1136,1138,1140,1142,1144,1146,1148,1150,1152,1154,1156,1158],{"class":232,"line":533},[230,1135,786],{"class":248},[230,1137,296],{"class":387},[230,1139,791],{"class":240},[230,1141,794],{"class":387},[230,1143,204],{"class":248},[230,1145,313],{"class":240},[230,1147,269],{"class":244},[230,1149,318],{"class":252},[230,1151,275],{"class":387},[230,1153,808],{"class":240},[230,1155,324],{"class":244},[230,1157,996],{"class":240},[230,1159,287],{"class":387},[230,1161,1162],{"class":232,"line":543},[230,1163,855],{"class":244},[198,1165,1166],{},"One try\u002Fcatch wraps the whole sequence. No shared state stuck between handlers.",[207,1168,1170],{"id":1169},"replacemodal",[202,1171,1172],{},"replaceModal",[198,1174,1175,1178],{},[202,1176,1177],{},"replaceModal(Component, options)"," closes the topmost modal of the target group instantly (skipping its exit animation and ignoring guards), then opens a new one. Use it for wizard-style step swaps where the previous step's exit animation would feel slow.",[221,1180,1182],{"className":223,"code":1181,"language":225,"meta":226,"style":226},"import { replaceModal } from '@kolirt\u002Fvue-modal'\n\nreplaceModal(StepTwo, {\n  props: { data: collected },\n  instantEnter: true\n})\n",[202,1183,1184,1203,1207,1218,1237,1247],{"__ignoreMap":226},[230,1185,1186,1188,1190,1193,1195,1197,1199,1201],{"class":232,"line":233},[230,1187,412],{"class":248},[230,1189,415],{"class":244},[230,1191,1192],{"class":240}," replaceModal",[230,1194,431],{"class":244},[230,1196,434],{"class":248},[230,1198,437],{"class":244},[230,1200,440],{"class":402},[230,1202,443],{"class":244},[230,1204,1205],{"class":232,"line":290},[230,1206,449],{"emptyLinePlaceholder":448},[230,1208,1209,1211,1214,1216],{"class":232,"line":308},[230,1210,1172],{"class":252},[230,1212,1213],{"class":240},"(StepTwo",[230,1215,324],{"class":244},[230,1217,721],{"class":244},[230,1219,1220,1222,1224,1226,1229,1231,1234],{"class":232,"line":452},[230,1221,895],{"class":387},[230,1223,372],{"class":244},[230,1225,415],{"class":244},[230,1227,1228],{"class":387}," data",[230,1230,372],{"class":244},[230,1232,1233],{"class":240}," collected ",[230,1235,1236],{"class":244},"},\n",[230,1238,1239,1242,1244],{"class":232,"line":480},[230,1240,1241],{"class":387},"  instantEnter",[230,1243,372],{"class":244},[230,1245,1246],{"class":931}," true\n",[230,1248,1249,1251],{"class":232,"line":485},[230,1250,500],{"class":244},[230,1252,287],{"class":240},[198,1254,1255,1256,1258,1259,1262],{},"The previous step's promise rejects with ",[202,1257,671],{}," — make sure the original caller catches it. See ",[1260,1261,62],"a",{"href":63}," for the full action reference.",[1264,1265,1266],"style",{},"html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}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 .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}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 .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}html pre.shiki code .sfNiH, html code.shiki .sfNiH{--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC}",{"title":226,"searchDepth":290,"depth":290,"links":1268},[1269,1271,1272,1273,1274,1275],{"id":209,"depth":290,"text":1270},"Why promises, not v-model",{"id":333,"depth":290,"text":334},{"id":357,"depth":290,"text":358},{"id":674,"depth":290,"text":675},{"id":961,"depth":290,"text":962},{"id":1169,"depth":290,"text":1172},"Why the API is promise-based and how the modal lifecycle works.","md",null,{},{"title":37,"description":1276},"2tn7DKIIEOy-uI3bSepPwiBQwIRdtBZADhb9FxiChiM",[1283,1285],{"title":33,"path":34,"stem":35,"description":1284,"children":-1},"How ModalTarget, ModalRoot, and the headless primitives fit together.",{"title":41,"path":42,"stem":43,"description":1286,"children":-1},"How multiple modals stack and what \"topmost\" means globally vs per-group.",1779523617515]