[{"data":1,"prerenderedAt":2459},["ShallowReactive",2],{"navigation_docs":3,"-recipes-confirm-dialog":188,"-recipes-confirm-dialog-surround":2454},[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":107,"body":190,"description":2448,"extension":2449,"links":2450,"meta":2451,"navigation":294,"path":108,"seo":2452,"stem":109,"__hash__":2453},"docs\u002F5.recipes\u002F1.confirm-dialog.md",{"type":191,"value":192,"toc":2440},"minimark",[193,197,218,223,386,539,553,557,2081,2085,2227,2231,2240,2387,2402,2405,2414,2418,2436],[194,195,107],"h1",{"id":196},"confirm-dialog",[198,199,200,201,205,206,209,210,213,214,217],"p",{},"The most common modal pattern: ask the user to confirm an action, get a ",[202,203,204],"code",{},"boolean"," back. This recipe builds a reusable ",[202,207,208],{},"\u003CConfirmDialog>"," component and a thin ",[202,211,212],{},"confirm()"," utility that wraps ",[202,215,216],{},"openModal",".",[219,220,222],"h2",{"id":221},"group-registration","Group registration",[224,225,231],"pre",{"className":226,"code":227,"filename":228,"language":229,"meta":230,"style":230},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","import { createModal } from '@kolirt\u002Fvue-modal'\nimport type { DefineGroups } from '@kolirt\u002Fvue-modal'\n\ndeclare module '@kolirt\u002Fvue-modal' {\n  interface ModalGroupRegistry extends DefineGroups\u003C['confirm']> {}\n}\n\napp.use(createModal())\n","main.ts","ts","",[202,232,233,266,289,296,316,354,360,365],{"__ignoreMap":230},[234,235,238,242,246,250,253,256,259,263],"span",{"class":236,"line":237},"line",1,[234,239,241],{"class":240},"s7zQu","import",[234,243,245],{"class":244},"sMK4o"," {",[234,247,249],{"class":248},"sTEyZ"," createModal",[234,251,252],{"class":244}," }",[234,254,255],{"class":240}," from",[234,257,258],{"class":244}," '",[234,260,262],{"class":261},"sfazB","@kolirt\u002Fvue-modal",[234,264,265],{"class":244},"'\n",[234,267,269,271,274,276,279,281,283,285,287],{"class":236,"line":268},2,[234,270,241],{"class":240},[234,272,273],{"class":240}," type",[234,275,245],{"class":244},[234,277,278],{"class":248}," DefineGroups",[234,280,252],{"class":244},[234,282,255],{"class":240},[234,284,258],{"class":244},[234,286,262],{"class":261},[234,288,265],{"class":244},[234,290,292],{"class":236,"line":291},3,[234,293,295],{"emptyLinePlaceholder":294},true,"\n",[234,297,299,303,306,308,310,313],{"class":236,"line":298},4,[234,300,302],{"class":301},"spNyl","declare",[234,304,305],{"class":301}," module",[234,307,258],{"class":244},[234,309,262],{"class":261},[234,311,312],{"class":244},"'",[234,314,315],{"class":244}," {\n",[234,317,319,322,326,329,331,334,338,340,343,345,348,351],{"class":236,"line":318},5,[234,320,321],{"class":301},"  interface",[234,323,325],{"class":324},"sBMFI"," ModalGroupRegistry",[234,327,328],{"class":301}," extends",[234,330,278],{"class":324},[234,332,333],{"class":244},"\u003C",[234,335,337],{"class":336},"swJcz","[",[234,339,312],{"class":244},[234,341,342],{"class":261},"confirm",[234,344,312],{"class":244},[234,346,347],{"class":336},"]",[234,349,350],{"class":244},">",[234,352,353],{"class":244}," {}\n",[234,355,357],{"class":236,"line":356},6,[234,358,359],{"class":244},"}\n",[234,361,363],{"class":236,"line":362},7,[234,364,295],{"emptyLinePlaceholder":294},[234,366,368,371,373,377,380,383],{"class":236,"line":367},8,[234,369,370],{"class":248},"app",[234,372,217],{"class":244},[234,374,376],{"class":375},"s2Zo4","use",[234,378,379],{"class":248},"(",[234,381,382],{"class":375},"createModal",[234,384,385],{"class":248},"())\n",[224,387,392],{"className":388,"code":389,"filename":390,"language":391,"meta":230,"style":230},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup lang=\"ts\">\nimport { ModalOverlay, ModalTarget } from '@kolirt\u002Fvue-modal'\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CRouterView \u002F>\n  \u003CModalTarget group=\"confirm\">\n    \u003CModalOverlay class=\"bg-black\u002F40\" \u002F>\n  \u003C\u002FModalTarget>\n\u003C\u002Ftemplate>\n","App.vue","vue",[202,393,394,420,445,454,458,467,478,498,520,530],{"__ignoreMap":230},[234,395,396,398,401,404,407,410,413,415,417],{"class":236,"line":237},[234,397,333],{"class":244},[234,399,400],{"class":336},"script",[234,402,403],{"class":301}," setup",[234,405,406],{"class":301}," lang",[234,408,409],{"class":244},"=",[234,411,412],{"class":244},"\"",[234,414,229],{"class":261},[234,416,412],{"class":244},[234,418,419],{"class":244},">\n",[234,421,422,424,426,429,432,435,437,439,441,443],{"class":236,"line":268},[234,423,241],{"class":240},[234,425,245],{"class":244},[234,427,428],{"class":248}," ModalOverlay",[234,430,431],{"class":244},",",[234,433,434],{"class":248}," ModalTarget",[234,436,252],{"class":244},[234,438,255],{"class":240},[234,440,258],{"class":244},[234,442,262],{"class":261},[234,444,265],{"class":244},[234,446,447,450,452],{"class":236,"line":291},[234,448,449],{"class":244},"\u003C\u002F",[234,451,400],{"class":336},[234,453,419],{"class":244},[234,455,456],{"class":236,"line":298},[234,457,295],{"emptyLinePlaceholder":294},[234,459,460,462,465],{"class":236,"line":318},[234,461,333],{"class":244},[234,463,464],{"class":336},"template",[234,466,419],{"class":244},[234,468,469,472,475],{"class":236,"line":356},[234,470,471],{"class":244},"  \u003C",[234,473,474],{"class":336},"RouterView",[234,476,477],{"class":244}," \u002F>\n",[234,479,480,482,485,488,490,492,494,496],{"class":236,"line":362},[234,481,471],{"class":244},[234,483,484],{"class":336},"ModalTarget",[234,486,487],{"class":301}," group",[234,489,409],{"class":244},[234,491,412],{"class":244},[234,493,342],{"class":261},[234,495,412],{"class":244},[234,497,419],{"class":244},[234,499,500,503,506,509,511,513,516,518],{"class":236,"line":367},[234,501,502],{"class":244},"    \u003C",[234,504,505],{"class":336},"ModalOverlay",[234,507,508],{"class":301}," class",[234,510,409],{"class":244},[234,512,412],{"class":244},[234,514,515],{"class":261},"bg-black\u002F40",[234,517,412],{"class":244},[234,519,477],{"class":244},[234,521,523,526,528],{"class":236,"line":522},9,[234,524,525],{"class":244},"  \u003C\u002F",[234,527,484],{"class":336},[234,529,419],{"class":244},[234,531,533,535,537],{"class":236,"line":532},10,[234,534,449],{"class":244},[234,536,464],{"class":336},[234,538,419],{"class":244},[198,540,541,544,545,548,549,552],{},[202,542,543],{},"\u003CModalOverlay>"," is a sibling of the modal stack inside ",[202,546,547],{},"\u003CModalTarget>"," — never inside ",[202,550,551],{},"\u003CModalContent>",". It paints behind every modal in the group automatically.",[219,554,556],{"id":555},"the-confirmdialog-component","The ConfirmDialog component",[558,559,560,1760],"code-group",{},[224,561,564],{"className":388,"code":562,"filename":563,"language":391,"meta":230,"style":230},"\u003Cscript setup lang=\"ts\">\nimport { ref } from 'vue'\nimport {\n  ModalRoot,\n  ModalContent,\n  ModalTitle,\n  ModalDescription,\n  useModalContext\n} from '@kolirt\u002Fvue-modal'\n\ndefineOptions({ modalGroup: 'confirm' })\n\nconst props = withDefaults(\n  defineProps\u003C{\n    title?: string\n    description?: string\n    confirmLabel?: string\n    cancelLabel?: string\n    destructive?: boolean\n    \u002F** Async action run before confirming. Returning false aborts. *\u002F\n    onConfirm?: () => Promise\u003Cboolean | void>\n  }>(),\n  {\n    title: 'Are you sure?',\n    description: undefined,\n    confirmLabel: 'Confirm',\n    cancelLabel: 'Cancel',\n    destructive: false,\n    onConfirm: undefined\n  }\n)\n\nconst { close, confirm } = useModalContext\u003Cboolean>()\nconst loading = ref(false)\n\nasync function handleConfirm() {\n  if (props.onConfirm) {\n    loading.value = true\n    try {\n      const result = await props.onConfirm()\n      if (result === false) return\n    } finally {\n      loading.value = false\n    }\n  }\n  confirm(true)\n}\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CModalRoot class=\"flex items-center justify-center p-4\">\n    \u003CModalContent class=\"w-full max-w-sm rounded-xl bg-white shadow-xl p-6 space-y-4\">\n        \u003Cdiv>\n          \u003CModalTitle class=\"text-lg font-semibold text-gray-900\">\n            {{ props.title }}\n          \u003C\u002FModalTitle>\n          \u003CModalDescription\n            v-if=\"props.description\"\n            class=\"mt-1 text-sm text-gray-500\"\n          >\n            {{ props.description }}\n          \u003C\u002FModalDescription>\n        \u003C\u002Fdiv>\n\n        \u003Cdiv class=\"flex justify-end gap-3 pt-2\">\n          \u003Cbutton\n            class=\"rounded-lg px-4 py-2 text-sm font-medium text-gray-700 ring-1 ring-gray-300 hover:bg-gray-50 disabled:opacity-50\"\n            :disabled=\"loading\"\n            @click=\"close()\"\n          >\n            {{ props.cancelLabel }}\n          \u003C\u002Fbutton>\n\n          \u003Cbutton\n            class=\"rounded-lg px-4 py-2 text-sm font-medium text-white disabled:opacity-50 flex items-center gap-2\"\n            :class=\"props.destructive ? 'bg-red-600 hover:bg-red-700' : 'bg-indigo-600 hover:bg-indigo-700'\"\n            :disabled=\"loading\"\n            @click=\"handleConfirm\"\n          >\n            \u003Csvg\n              v-if=\"loading\"\n              class=\"h-4 w-4 animate-spin\"\n              viewBox=\"0 0 24 24\"\n              fill=\"none\"\n            >\n              \u003Ccircle class=\"opacity-25\" cx=\"12\" cy=\"12\" r=\"10\" stroke=\"currentColor\" stroke-width=\"4\" \u002F>\n              \u003Cpath class=\"opacity-75\" fill=\"currentColor\" d=\"M4 12a8 8 0 018-8v8H4z\" \u002F>\n            \u003C\u002Fsvg>\n            {{ props.confirmLabel }}\n          \u003C\u002Fbutton>\n        \u003C\u002Fdiv>\n    \u003C\u002FModalContent>\n  \u003C\u002FModalRoot>\n\u003C\u002Ftemplate>\n","ConfirmDialog.vue",[202,565,566,586,605,611,619,626,633,640,645,658,662,690,695,712,721,733,743,753,763,774,781,810,821,827,843,853,869,885,898,908,914,919,924,956,975,980,996,1019,1035,1043,1066,1087,1098,1113,1119,1124,1137,1142,1151,1156,1165,1186,1207,1218,1240,1246,1256,1264,1280,1295,1301,1307,1317,1327,1332,1352,1360,1374,1389,1404,1409,1415,1425,1430,1437,1451,1466,1479,1493,1498,1507,1521,1536,1551,1566,1572,1653,1697,1708,1714,1723,1732,1742,1751],{"__ignoreMap":230},[234,567,568,570,572,574,576,578,580,582,584],{"class":236,"line":237},[234,569,333],{"class":244},[234,571,400],{"class":336},[234,573,403],{"class":301},[234,575,406],{"class":301},[234,577,409],{"class":244},[234,579,412],{"class":244},[234,581,229],{"class":261},[234,583,412],{"class":244},[234,585,419],{"class":244},[234,587,588,590,592,595,597,599,601,603],{"class":236,"line":268},[234,589,241],{"class":240},[234,591,245],{"class":244},[234,593,594],{"class":248}," ref",[234,596,252],{"class":244},[234,598,255],{"class":240},[234,600,258],{"class":244},[234,602,391],{"class":261},[234,604,265],{"class":244},[234,606,607,609],{"class":236,"line":291},[234,608,241],{"class":240},[234,610,315],{"class":244},[234,612,613,616],{"class":236,"line":298},[234,614,615],{"class":248},"  ModalRoot",[234,617,618],{"class":244},",\n",[234,620,621,624],{"class":236,"line":318},[234,622,623],{"class":248},"  ModalContent",[234,625,618],{"class":244},[234,627,628,631],{"class":236,"line":356},[234,629,630],{"class":248},"  ModalTitle",[234,632,618],{"class":244},[234,634,635,638],{"class":236,"line":362},[234,636,637],{"class":248},"  ModalDescription",[234,639,618],{"class":244},[234,641,642],{"class":236,"line":367},[234,643,644],{"class":248},"  useModalContext\n",[234,646,647,650,652,654,656],{"class":236,"line":522},[234,648,649],{"class":244},"}",[234,651,255],{"class":240},[234,653,258],{"class":244},[234,655,262],{"class":261},[234,657,265],{"class":244},[234,659,660],{"class":236,"line":532},[234,661,295],{"emptyLinePlaceholder":294},[234,663,665,668,670,673,676,679,681,683,685,687],{"class":236,"line":664},11,[234,666,667],{"class":375},"defineOptions",[234,669,379],{"class":248},[234,671,672],{"class":244},"{",[234,674,675],{"class":336}," modalGroup",[234,677,678],{"class":244},":",[234,680,258],{"class":244},[234,682,342],{"class":261},[234,684,312],{"class":244},[234,686,252],{"class":244},[234,688,689],{"class":248},")\n",[234,691,693],{"class":236,"line":692},12,[234,694,295],{"emptyLinePlaceholder":294},[234,696,698,701,704,706,709],{"class":236,"line":697},13,[234,699,700],{"class":301},"const",[234,702,703],{"class":248}," props ",[234,705,409],{"class":244},[234,707,708],{"class":375}," withDefaults",[234,710,711],{"class":248},"(\n",[234,713,715,718],{"class":236,"line":714},14,[234,716,717],{"class":375},"  defineProps",[234,719,720],{"class":244},"\u003C{\n",[234,722,724,727,730],{"class":236,"line":723},15,[234,725,726],{"class":336},"    title",[234,728,729],{"class":244},"?:",[234,731,732],{"class":324}," string\n",[234,734,736,739,741],{"class":236,"line":735},16,[234,737,738],{"class":336},"    description",[234,740,729],{"class":244},[234,742,732],{"class":324},[234,744,746,749,751],{"class":236,"line":745},17,[234,747,748],{"class":336},"    confirmLabel",[234,750,729],{"class":244},[234,752,732],{"class":324},[234,754,756,759,761],{"class":236,"line":755},18,[234,757,758],{"class":336},"    cancelLabel",[234,760,729],{"class":244},[234,762,732],{"class":324},[234,764,766,769,771],{"class":236,"line":765},19,[234,767,768],{"class":336},"    destructive",[234,770,729],{"class":244},[234,772,773],{"class":324}," boolean\n",[234,775,777],{"class":236,"line":776},20,[234,778,780],{"class":779},"sHwdD","    \u002F** Async action run before confirming. Returning false aborts. *\u002F\n",[234,782,784,787,789,792,795,798,800,802,805,808],{"class":236,"line":783},21,[234,785,786],{"class":336},"    onConfirm",[234,788,729],{"class":244},[234,790,791],{"class":244}," ()",[234,793,794],{"class":301}," =>",[234,796,797],{"class":324}," Promise",[234,799,333],{"class":244},[234,801,204],{"class":324},[234,803,804],{"class":244}," |",[234,806,807],{"class":324}," void",[234,809,419],{"class":244},[234,811,813,816,819],{"class":236,"line":812},22,[234,814,815],{"class":244},"  }>",[234,817,818],{"class":248},"()",[234,820,618],{"class":244},[234,822,824],{"class":236,"line":823},23,[234,825,826],{"class":244},"  {\n",[234,828,830,832,834,836,839,841],{"class":236,"line":829},24,[234,831,726],{"class":336},[234,833,678],{"class":244},[234,835,258],{"class":244},[234,837,838],{"class":261},"Are you sure?",[234,840,312],{"class":244},[234,842,618],{"class":244},[234,844,846,848,850],{"class":236,"line":845},25,[234,847,738],{"class":336},[234,849,678],{"class":244},[234,851,852],{"class":244}," undefined,\n",[234,854,856,858,860,862,865,867],{"class":236,"line":855},26,[234,857,748],{"class":336},[234,859,678],{"class":244},[234,861,258],{"class":244},[234,863,864],{"class":261},"Confirm",[234,866,312],{"class":244},[234,868,618],{"class":244},[234,870,872,874,876,878,881,883],{"class":236,"line":871},27,[234,873,758],{"class":336},[234,875,678],{"class":244},[234,877,258],{"class":244},[234,879,880],{"class":261},"Cancel",[234,882,312],{"class":244},[234,884,618],{"class":244},[234,886,888,890,892,896],{"class":236,"line":887},28,[234,889,768],{"class":336},[234,891,678],{"class":244},[234,893,895],{"class":894},"sfNiH"," false",[234,897,618],{"class":244},[234,899,901,903,905],{"class":236,"line":900},29,[234,902,786],{"class":336},[234,904,678],{"class":244},[234,906,907],{"class":244}," undefined\n",[234,909,911],{"class":236,"line":910},30,[234,912,913],{"class":244},"  }\n",[234,915,917],{"class":236,"line":916},31,[234,918,689],{"class":248},[234,920,922],{"class":236,"line":921},32,[234,923,295],{"emptyLinePlaceholder":294},[234,925,927,929,931,934,936,939,941,944,947,949,951,953],{"class":236,"line":926},33,[234,928,700],{"class":301},[234,930,245],{"class":244},[234,932,933],{"class":248}," close",[234,935,431],{"class":244},[234,937,938],{"class":248}," confirm ",[234,940,649],{"class":244},[234,942,943],{"class":244}," =",[234,945,946],{"class":375}," useModalContext",[234,948,333],{"class":244},[234,950,204],{"class":324},[234,952,350],{"class":244},[234,954,955],{"class":248},"()\n",[234,957,959,961,964,966,968,970,973],{"class":236,"line":958},34,[234,960,700],{"class":301},[234,962,963],{"class":248}," loading ",[234,965,409],{"class":244},[234,967,594],{"class":375},[234,969,379],{"class":248},[234,971,972],{"class":894},"false",[234,974,689],{"class":248},[234,976,978],{"class":236,"line":977},35,[234,979,295],{"emptyLinePlaceholder":294},[234,981,983,986,989,992,994],{"class":236,"line":982},36,[234,984,985],{"class":301},"async",[234,987,988],{"class":301}," function",[234,990,991],{"class":375}," handleConfirm",[234,993,818],{"class":244},[234,995,315],{"class":244},[234,997,999,1002,1005,1008,1010,1013,1016],{"class":236,"line":998},37,[234,1000,1001],{"class":240},"  if",[234,1003,1004],{"class":336}," (",[234,1006,1007],{"class":248},"props",[234,1009,217],{"class":244},[234,1011,1012],{"class":248},"onConfirm",[234,1014,1015],{"class":336},") ",[234,1017,1018],{"class":244},"{\n",[234,1020,1022,1025,1027,1030,1032],{"class":236,"line":1021},38,[234,1023,1024],{"class":248},"    loading",[234,1026,217],{"class":244},[234,1028,1029],{"class":248},"value",[234,1031,943],{"class":244},[234,1033,1034],{"class":894}," true\n",[234,1036,1038,1041],{"class":236,"line":1037},39,[234,1039,1040],{"class":240},"    try",[234,1042,315],{"class":244},[234,1044,1046,1049,1052,1054,1057,1060,1062,1064],{"class":236,"line":1045},40,[234,1047,1048],{"class":301},"      const",[234,1050,1051],{"class":248}," result",[234,1053,943],{"class":244},[234,1055,1056],{"class":240}," await",[234,1058,1059],{"class":248}," props",[234,1061,217],{"class":244},[234,1063,1012],{"class":375},[234,1065,955],{"class":336},[234,1067,1069,1072,1074,1077,1080,1082,1084],{"class":236,"line":1068},41,[234,1070,1071],{"class":240},"      if",[234,1073,1004],{"class":336},[234,1075,1076],{"class":248},"result",[234,1078,1079],{"class":244}," ===",[234,1081,895],{"class":894},[234,1083,1015],{"class":336},[234,1085,1086],{"class":240},"return\n",[234,1088,1090,1093,1096],{"class":236,"line":1089},42,[234,1091,1092],{"class":244},"    }",[234,1094,1095],{"class":240}," finally",[234,1097,315],{"class":244},[234,1099,1101,1104,1106,1108,1110],{"class":236,"line":1100},43,[234,1102,1103],{"class":248},"      loading",[234,1105,217],{"class":244},[234,1107,1029],{"class":248},[234,1109,943],{"class":244},[234,1111,1112],{"class":894}," false\n",[234,1114,1116],{"class":236,"line":1115},44,[234,1117,1118],{"class":244},"    }\n",[234,1120,1122],{"class":236,"line":1121},45,[234,1123,913],{"class":244},[234,1125,1127,1130,1132,1135],{"class":236,"line":1126},46,[234,1128,1129],{"class":375},"  confirm",[234,1131,379],{"class":336},[234,1133,1134],{"class":894},"true",[234,1136,689],{"class":336},[234,1138,1140],{"class":236,"line":1139},47,[234,1141,359],{"class":244},[234,1143,1145,1147,1149],{"class":236,"line":1144},48,[234,1146,449],{"class":244},[234,1148,400],{"class":336},[234,1150,419],{"class":244},[234,1152,1154],{"class":236,"line":1153},49,[234,1155,295],{"emptyLinePlaceholder":294},[234,1157,1159,1161,1163],{"class":236,"line":1158},50,[234,1160,333],{"class":244},[234,1162,464],{"class":336},[234,1164,419],{"class":244},[234,1166,1168,1170,1173,1175,1177,1179,1182,1184],{"class":236,"line":1167},51,[234,1169,471],{"class":244},[234,1171,1172],{"class":336},"ModalRoot",[234,1174,508],{"class":301},[234,1176,409],{"class":244},[234,1178,412],{"class":244},[234,1180,1181],{"class":261},"flex items-center justify-center p-4",[234,1183,412],{"class":244},[234,1185,419],{"class":244},[234,1187,1189,1191,1194,1196,1198,1200,1203,1205],{"class":236,"line":1188},52,[234,1190,502],{"class":244},[234,1192,1193],{"class":336},"ModalContent",[234,1195,508],{"class":301},[234,1197,409],{"class":244},[234,1199,412],{"class":244},[234,1201,1202],{"class":261},"w-full max-w-sm rounded-xl bg-white shadow-xl p-6 space-y-4",[234,1204,412],{"class":244},[234,1206,419],{"class":244},[234,1208,1210,1213,1216],{"class":236,"line":1209},53,[234,1211,1212],{"class":244},"        \u003C",[234,1214,1215],{"class":336},"div",[234,1217,419],{"class":244},[234,1219,1221,1224,1227,1229,1231,1233,1236,1238],{"class":236,"line":1220},54,[234,1222,1223],{"class":244},"          \u003C",[234,1225,1226],{"class":336},"ModalTitle",[234,1228,508],{"class":301},[234,1230,409],{"class":244},[234,1232,412],{"class":244},[234,1234,1235],{"class":261},"text-lg font-semibold text-gray-900",[234,1237,412],{"class":244},[234,1239,419],{"class":244},[234,1241,1243],{"class":236,"line":1242},55,[234,1244,1245],{"class":248},"            {{ props.title }}\n",[234,1247,1249,1252,1254],{"class":236,"line":1248},56,[234,1250,1251],{"class":244},"          \u003C\u002F",[234,1253,1226],{"class":336},[234,1255,419],{"class":244},[234,1257,1259,1261],{"class":236,"line":1258},57,[234,1260,1223],{"class":244},[234,1262,1263],{"class":336},"ModalDescription\n",[234,1265,1267,1270,1272,1274,1277],{"class":236,"line":1266},58,[234,1268,1269],{"class":301},"            v-if",[234,1271,409],{"class":244},[234,1273,412],{"class":244},[234,1275,1276],{"class":261},"props.description",[234,1278,1279],{"class":244},"\"\n",[234,1281,1283,1286,1288,1290,1293],{"class":236,"line":1282},59,[234,1284,1285],{"class":301},"            class",[234,1287,409],{"class":244},[234,1289,412],{"class":244},[234,1291,1292],{"class":261},"mt-1 text-sm text-gray-500",[234,1294,1279],{"class":244},[234,1296,1298],{"class":236,"line":1297},60,[234,1299,1300],{"class":244},"          >\n",[234,1302,1304],{"class":236,"line":1303},61,[234,1305,1306],{"class":248},"            {{ props.description }}\n",[234,1308,1310,1312,1315],{"class":236,"line":1309},62,[234,1311,1251],{"class":244},[234,1313,1314],{"class":336},"ModalDescription",[234,1316,419],{"class":244},[234,1318,1320,1323,1325],{"class":236,"line":1319},63,[234,1321,1322],{"class":244},"        \u003C\u002F",[234,1324,1215],{"class":336},[234,1326,419],{"class":244},[234,1328,1330],{"class":236,"line":1329},64,[234,1331,295],{"emptyLinePlaceholder":294},[234,1333,1335,1337,1339,1341,1343,1345,1348,1350],{"class":236,"line":1334},65,[234,1336,1212],{"class":244},[234,1338,1215],{"class":336},[234,1340,508],{"class":301},[234,1342,409],{"class":244},[234,1344,412],{"class":244},[234,1346,1347],{"class":261},"flex justify-end gap-3 pt-2",[234,1349,412],{"class":244},[234,1351,419],{"class":244},[234,1353,1355,1357],{"class":236,"line":1354},66,[234,1356,1223],{"class":244},[234,1358,1359],{"class":336},"button\n",[234,1361,1363,1365,1367,1369,1372],{"class":236,"line":1362},67,[234,1364,1285],{"class":301},[234,1366,409],{"class":244},[234,1368,412],{"class":244},[234,1370,1371],{"class":261},"rounded-lg px-4 py-2 text-sm font-medium text-gray-700 ring-1 ring-gray-300 hover:bg-gray-50 disabled:opacity-50",[234,1373,1279],{"class":244},[234,1375,1377,1380,1382,1384,1387],{"class":236,"line":1376},68,[234,1378,1379],{"class":301},"            :disabled",[234,1381,409],{"class":244},[234,1383,412],{"class":244},[234,1385,1386],{"class":261},"loading",[234,1388,1279],{"class":244},[234,1390,1392,1395,1397,1399,1402],{"class":236,"line":1391},69,[234,1393,1394],{"class":301},"            @click",[234,1396,409],{"class":244},[234,1398,412],{"class":244},[234,1400,1401],{"class":261},"close()",[234,1403,1279],{"class":244},[234,1405,1407],{"class":236,"line":1406},70,[234,1408,1300],{"class":244},[234,1410,1412],{"class":236,"line":1411},71,[234,1413,1414],{"class":248},"            {{ props.cancelLabel }}\n",[234,1416,1418,1420,1423],{"class":236,"line":1417},72,[234,1419,1251],{"class":244},[234,1421,1422],{"class":336},"button",[234,1424,419],{"class":244},[234,1426,1428],{"class":236,"line":1427},73,[234,1429,295],{"emptyLinePlaceholder":294},[234,1431,1433,1435],{"class":236,"line":1432},74,[234,1434,1223],{"class":244},[234,1436,1359],{"class":336},[234,1438,1440,1442,1444,1446,1449],{"class":236,"line":1439},75,[234,1441,1285],{"class":301},[234,1443,409],{"class":244},[234,1445,412],{"class":244},[234,1447,1448],{"class":261},"rounded-lg px-4 py-2 text-sm font-medium text-white disabled:opacity-50 flex items-center gap-2",[234,1450,1279],{"class":244},[234,1452,1454,1457,1459,1461,1464],{"class":236,"line":1453},76,[234,1455,1456],{"class":301},"            :class",[234,1458,409],{"class":244},[234,1460,412],{"class":244},[234,1462,1463],{"class":261},"props.destructive ? 'bg-red-600 hover:bg-red-700' : 'bg-indigo-600 hover:bg-indigo-700'",[234,1465,1279],{"class":244},[234,1467,1469,1471,1473,1475,1477],{"class":236,"line":1468},77,[234,1470,1379],{"class":301},[234,1472,409],{"class":244},[234,1474,412],{"class":244},[234,1476,1386],{"class":261},[234,1478,1279],{"class":244},[234,1480,1482,1484,1486,1488,1491],{"class":236,"line":1481},78,[234,1483,1394],{"class":301},[234,1485,409],{"class":244},[234,1487,412],{"class":244},[234,1489,1490],{"class":261},"handleConfirm",[234,1492,1279],{"class":244},[234,1494,1496],{"class":236,"line":1495},79,[234,1497,1300],{"class":244},[234,1499,1501,1504],{"class":236,"line":1500},80,[234,1502,1503],{"class":244},"            \u003C",[234,1505,1506],{"class":336},"svg\n",[234,1508,1510,1513,1515,1517,1519],{"class":236,"line":1509},81,[234,1511,1512],{"class":301},"              v-if",[234,1514,409],{"class":244},[234,1516,412],{"class":244},[234,1518,1386],{"class":261},[234,1520,1279],{"class":244},[234,1522,1524,1527,1529,1531,1534],{"class":236,"line":1523},82,[234,1525,1526],{"class":301},"              class",[234,1528,409],{"class":244},[234,1530,412],{"class":244},[234,1532,1533],{"class":261},"h-4 w-4 animate-spin",[234,1535,1279],{"class":244},[234,1537,1539,1542,1544,1546,1549],{"class":236,"line":1538},83,[234,1540,1541],{"class":301},"              viewBox",[234,1543,409],{"class":244},[234,1545,412],{"class":244},[234,1547,1548],{"class":261},"0 0 24 24",[234,1550,1279],{"class":244},[234,1552,1554,1557,1559,1561,1564],{"class":236,"line":1553},84,[234,1555,1556],{"class":301},"              fill",[234,1558,409],{"class":244},[234,1560,412],{"class":244},[234,1562,1563],{"class":261},"none",[234,1565,1279],{"class":244},[234,1567,1569],{"class":236,"line":1568},85,[234,1570,1571],{"class":244},"            >\n",[234,1573,1575,1578,1581,1583,1585,1587,1590,1592,1595,1597,1599,1602,1604,1607,1609,1611,1613,1615,1618,1620,1622,1625,1627,1630,1632,1634,1637,1639,1642,1644,1646,1649,1651],{"class":236,"line":1574},86,[234,1576,1577],{"class":244},"              \u003C",[234,1579,1580],{"class":336},"circle",[234,1582,508],{"class":301},[234,1584,409],{"class":244},[234,1586,412],{"class":244},[234,1588,1589],{"class":261},"opacity-25",[234,1591,412],{"class":244},[234,1593,1594],{"class":301}," cx",[234,1596,409],{"class":244},[234,1598,412],{"class":244},[234,1600,1601],{"class":261},"12",[234,1603,412],{"class":244},[234,1605,1606],{"class":301}," cy",[234,1608,409],{"class":244},[234,1610,412],{"class":244},[234,1612,1601],{"class":261},[234,1614,412],{"class":244},[234,1616,1617],{"class":301}," r",[234,1619,409],{"class":244},[234,1621,412],{"class":244},[234,1623,1624],{"class":261},"10",[234,1626,412],{"class":244},[234,1628,1629],{"class":301}," stroke",[234,1631,409],{"class":244},[234,1633,412],{"class":244},[234,1635,1636],{"class":261},"currentColor",[234,1638,412],{"class":244},[234,1640,1641],{"class":301}," stroke-width",[234,1643,409],{"class":244},[234,1645,412],{"class":244},[234,1647,1648],{"class":261},"4",[234,1650,412],{"class":244},[234,1652,477],{"class":244},[234,1654,1656,1658,1661,1663,1665,1667,1670,1672,1675,1677,1679,1681,1683,1686,1688,1690,1693,1695],{"class":236,"line":1655},87,[234,1657,1577],{"class":244},[234,1659,1660],{"class":336},"path",[234,1662,508],{"class":301},[234,1664,409],{"class":244},[234,1666,412],{"class":244},[234,1668,1669],{"class":261},"opacity-75",[234,1671,412],{"class":244},[234,1673,1674],{"class":301}," fill",[234,1676,409],{"class":244},[234,1678,412],{"class":244},[234,1680,1636],{"class":261},[234,1682,412],{"class":244},[234,1684,1685],{"class":301}," d",[234,1687,409],{"class":244},[234,1689,412],{"class":244},[234,1691,1692],{"class":261},"M4 12a8 8 0 018-8v8H4z",[234,1694,412],{"class":244},[234,1696,477],{"class":244},[234,1698,1700,1703,1706],{"class":236,"line":1699},88,[234,1701,1702],{"class":244},"            \u003C\u002F",[234,1704,1705],{"class":336},"svg",[234,1707,419],{"class":244},[234,1709,1711],{"class":236,"line":1710},89,[234,1712,1713],{"class":248},"            {{ props.confirmLabel }}\n",[234,1715,1717,1719,1721],{"class":236,"line":1716},90,[234,1718,1251],{"class":244},[234,1720,1422],{"class":336},[234,1722,419],{"class":244},[234,1724,1726,1728,1730],{"class":236,"line":1725},91,[234,1727,1322],{"class":244},[234,1729,1215],{"class":336},[234,1731,419],{"class":244},[234,1733,1735,1738,1740],{"class":236,"line":1734},92,[234,1736,1737],{"class":244},"    \u003C\u002F",[234,1739,1193],{"class":336},[234,1741,419],{"class":244},[234,1743,1745,1747,1749],{"class":236,"line":1744},93,[234,1746,525],{"class":244},[234,1748,1172],{"class":336},[234,1750,419],{"class":244},[234,1752,1754,1756,1758],{"class":236,"line":1753},94,[234,1755,449],{"class":244},[234,1757,464],{"class":336},[234,1759,419],{"class":244},[224,1761,1764],{"className":226,"code":1762,"filename":1763,"language":229,"meta":230,"style":230},"import { openModal, ModalClosedError } from '@kolirt\u002Fvue-modal'\nimport ConfirmDialog from '.\u002FConfirmDialog.vue'\n\nexport interface ConfirmOptions {\n  description?: string\n  confirmLabel?: string\n  cancelLabel?: string\n  destructive?: boolean\n  \u002F** Async action run before the modal resolves. Return false to abort. *\u002F\n  onConfirm?: () => Promise\u003Cboolean | void>\n}\n\n\u002F**\n * confirm('Delete item?', { destructive: true })\n *   .then(ok => ok && api.delete())\n *\u002F\nexport async function confirm(\n  title: string,\n  options: ConfirmOptions = {}\n): Promise\u003Cboolean> {\n  return openModal\u003Cboolean>(ConfirmDialog, {\n    props: { title, ...options }\n  }).catch((e) => {\n    if (e instanceof ModalClosedError) return false\n    throw e\n  })\n}\n","confirm.ts",[202,1765,1766,1790,1807,1811,1824,1833,1842,1851,1860,1865,1888,1892,1896,1901,1906,1911,1916,1930,1943,1956,1971,1993,2016,2042,2063,2071,2077],{"__ignoreMap":230},[234,1767,1768,1770,1772,1775,1777,1780,1782,1784,1786,1788],{"class":236,"line":237},[234,1769,241],{"class":240},[234,1771,245],{"class":244},[234,1773,1774],{"class":248}," openModal",[234,1776,431],{"class":244},[234,1778,1779],{"class":248}," ModalClosedError",[234,1781,252],{"class":244},[234,1783,255],{"class":240},[234,1785,258],{"class":244},[234,1787,262],{"class":261},[234,1789,265],{"class":244},[234,1791,1792,1794,1797,1800,1802,1805],{"class":236,"line":268},[234,1793,241],{"class":240},[234,1795,1796],{"class":248}," ConfirmDialog ",[234,1798,1799],{"class":240},"from",[234,1801,258],{"class":244},[234,1803,1804],{"class":261},".\u002FConfirmDialog.vue",[234,1806,265],{"class":244},[234,1808,1809],{"class":236,"line":291},[234,1810,295],{"emptyLinePlaceholder":294},[234,1812,1813,1816,1819,1822],{"class":236,"line":298},[234,1814,1815],{"class":240},"export",[234,1817,1818],{"class":301}," interface",[234,1820,1821],{"class":324}," ConfirmOptions",[234,1823,315],{"class":244},[234,1825,1826,1829,1831],{"class":236,"line":318},[234,1827,1828],{"class":336},"  description",[234,1830,729],{"class":244},[234,1832,732],{"class":324},[234,1834,1835,1838,1840],{"class":236,"line":356},[234,1836,1837],{"class":336},"  confirmLabel",[234,1839,729],{"class":244},[234,1841,732],{"class":324},[234,1843,1844,1847,1849],{"class":236,"line":362},[234,1845,1846],{"class":336},"  cancelLabel",[234,1848,729],{"class":244},[234,1850,732],{"class":324},[234,1852,1853,1856,1858],{"class":236,"line":367},[234,1854,1855],{"class":336},"  destructive",[234,1857,729],{"class":244},[234,1859,773],{"class":324},[234,1861,1862],{"class":236,"line":522},[234,1863,1864],{"class":779},"  \u002F** Async action run before the modal resolves. Return false to abort. *\u002F\n",[234,1866,1867,1870,1872,1874,1876,1878,1880,1882,1884,1886],{"class":236,"line":532},[234,1868,1869],{"class":336},"  onConfirm",[234,1871,729],{"class":244},[234,1873,791],{"class":244},[234,1875,794],{"class":301},[234,1877,797],{"class":324},[234,1879,333],{"class":244},[234,1881,204],{"class":324},[234,1883,804],{"class":244},[234,1885,807],{"class":324},[234,1887,419],{"class":244},[234,1889,1890],{"class":236,"line":664},[234,1891,359],{"class":244},[234,1893,1894],{"class":236,"line":692},[234,1895,295],{"emptyLinePlaceholder":294},[234,1897,1898],{"class":236,"line":697},[234,1899,1900],{"class":779},"\u002F**\n",[234,1902,1903],{"class":236,"line":714},[234,1904,1905],{"class":779}," * confirm('Delete item?', { destructive: true })\n",[234,1907,1908],{"class":236,"line":723},[234,1909,1910],{"class":779}," *   .then(ok => ok && api.delete())\n",[234,1912,1913],{"class":236,"line":735},[234,1914,1915],{"class":779}," *\u002F\n",[234,1917,1918,1920,1923,1925,1928],{"class":236,"line":745},[234,1919,1815],{"class":240},[234,1921,1922],{"class":301}," async",[234,1924,988],{"class":301},[234,1926,1927],{"class":375}," confirm",[234,1929,711],{"class":244},[234,1931,1932,1936,1938,1941],{"class":236,"line":755},[234,1933,1935],{"class":1934},"sHdIc","  title",[234,1937,678],{"class":244},[234,1939,1940],{"class":324}," string",[234,1942,618],{"class":244},[234,1944,1945,1948,1950,1952,1954],{"class":236,"line":765},[234,1946,1947],{"class":1934},"  options",[234,1949,678],{"class":244},[234,1951,1821],{"class":324},[234,1953,943],{"class":244},[234,1955,353],{"class":244},[234,1957,1958,1961,1963,1965,1967,1969],{"class":236,"line":776},[234,1959,1960],{"class":244},"):",[234,1962,797],{"class":324},[234,1964,333],{"class":244},[234,1966,204],{"class":324},[234,1968,350],{"class":244},[234,1970,315],{"class":244},[234,1972,1973,1976,1978,1980,1982,1984,1986,1989,1991],{"class":236,"line":783},[234,1974,1975],{"class":240},"  return",[234,1977,1774],{"class":375},[234,1979,333],{"class":244},[234,1981,204],{"class":324},[234,1983,350],{"class":244},[234,1985,379],{"class":336},[234,1987,1988],{"class":248},"ConfirmDialog",[234,1990,431],{"class":244},[234,1992,315],{"class":244},[234,1994,1995,1998,2000,2002,2005,2007,2010,2013],{"class":236,"line":812},[234,1996,1997],{"class":336},"    props",[234,1999,678],{"class":244},[234,2001,245],{"class":244},[234,2003,2004],{"class":248}," title",[234,2006,431],{"class":244},[234,2008,2009],{"class":244}," ...",[234,2011,2012],{"class":248},"options",[234,2014,2015],{"class":244}," }\n",[234,2017,2018,2021,2024,2026,2029,2031,2033,2036,2038,2040],{"class":236,"line":823},[234,2019,2020],{"class":244},"  }",[234,2022,2023],{"class":336},")",[234,2025,217],{"class":244},[234,2027,2028],{"class":375},"catch",[234,2030,379],{"class":336},[234,2032,379],{"class":244},[234,2034,2035],{"class":1934},"e",[234,2037,2023],{"class":244},[234,2039,794],{"class":301},[234,2041,315],{"class":244},[234,2043,2044,2047,2049,2051,2054,2056,2058,2061],{"class":236,"line":829},[234,2045,2046],{"class":240},"    if",[234,2048,1004],{"class":336},[234,2050,2035],{"class":248},[234,2052,2053],{"class":244}," instanceof",[234,2055,1779],{"class":324},[234,2057,1015],{"class":336},[234,2059,2060],{"class":240},"return",[234,2062,1112],{"class":894},[234,2064,2065,2068],{"class":236,"line":845},[234,2066,2067],{"class":240},"    throw",[234,2069,2070],{"class":248}," e\n",[234,2072,2073,2075],{"class":236,"line":855},[234,2074,2020],{"class":244},[234,2076,689],{"class":336},[234,2078,2079],{"class":236,"line":871},[234,2080,359],{"class":244},[219,2082,2084],{"id":2083},"basic-usage","Basic usage",[224,2086,2089],{"className":226,"code":2087,"filename":2088,"language":229,"meta":230,"style":230},"import { confirm } from '@\u002Futils\u002Fconfirm'\nimport { api } from '@\u002Fapi'\n\nasync function deleteItem(id: number) {\n  if (await confirm('Delete this item?', { destructive: true })) {\n    await api.items.delete(id)\n  }\n}\n","DeleteButton.vue (script)",[202,2090,2091,2110,2130,2134,2157,2196,2219,2223],{"__ignoreMap":230},[234,2092,2093,2095,2097,2099,2101,2103,2105,2108],{"class":236,"line":237},[234,2094,241],{"class":240},[234,2096,245],{"class":244},[234,2098,1927],{"class":248},[234,2100,252],{"class":244},[234,2102,255],{"class":240},[234,2104,258],{"class":244},[234,2106,2107],{"class":261},"@\u002Futils\u002Fconfirm",[234,2109,265],{"class":244},[234,2111,2112,2114,2116,2119,2121,2123,2125,2128],{"class":236,"line":268},[234,2113,241],{"class":240},[234,2115,245],{"class":244},[234,2117,2118],{"class":248}," api",[234,2120,252],{"class":244},[234,2122,255],{"class":240},[234,2124,258],{"class":244},[234,2126,2127],{"class":261},"@\u002Fapi",[234,2129,265],{"class":244},[234,2131,2132],{"class":236,"line":291},[234,2133,295],{"emptyLinePlaceholder":294},[234,2135,2136,2138,2140,2143,2145,2148,2150,2153,2155],{"class":236,"line":298},[234,2137,985],{"class":301},[234,2139,988],{"class":301},[234,2141,2142],{"class":375}," deleteItem",[234,2144,379],{"class":244},[234,2146,2147],{"class":1934},"id",[234,2149,678],{"class":244},[234,2151,2152],{"class":324}," number",[234,2154,2023],{"class":244},[234,2156,315],{"class":244},[234,2158,2159,2161,2163,2166,2168,2170,2172,2175,2177,2179,2181,2184,2186,2189,2191,2194],{"class":236,"line":318},[234,2160,1001],{"class":240},[234,2162,1004],{"class":336},[234,2164,2165],{"class":240},"await",[234,2167,1927],{"class":375},[234,2169,379],{"class":336},[234,2171,312],{"class":244},[234,2173,2174],{"class":261},"Delete this item?",[234,2176,312],{"class":244},[234,2178,431],{"class":244},[234,2180,245],{"class":244},[234,2182,2183],{"class":336}," destructive",[234,2185,678],{"class":244},[234,2187,2188],{"class":894}," true",[234,2190,252],{"class":244},[234,2192,2193],{"class":336},")) ",[234,2195,1018],{"class":244},[234,2197,2198,2201,2203,2205,2208,2210,2213,2215,2217],{"class":236,"line":356},[234,2199,2200],{"class":240},"    await",[234,2202,2118],{"class":248},[234,2204,217],{"class":244},[234,2206,2207],{"class":248},"items",[234,2209,217],{"class":244},[234,2211,2212],{"class":375},"delete",[234,2214,379],{"class":336},[234,2216,2147],{"class":248},[234,2218,689],{"class":336},[234,2220,2221],{"class":236,"line":362},[234,2222,913],{"class":244},[234,2224,2225],{"class":236,"line":367},[234,2226,359],{"class":244},[219,2228,2230],{"id":2229},"loading-state-async-confirm","Loading state — async confirm",[198,2232,2233,2234,2236,2237,2239],{},"Pass ",[202,2235,1012],{}," to run an async operation inside the modal before it closes. The button shows a spinner; returning ",[202,2238,972],{}," keeps the modal open.",[224,2241,2243],{"className":226,"code":2242,"language":229,"meta":230,"style":230},"if (\n  await confirm('Submit report?', {\n    description: 'This will notify all stakeholders.',\n    confirmLabel: 'Submit',\n    onConfirm: async () => {\n      await api.reports.submit(reportId)\n      \u002F\u002F return false here to abort (e.g. on validation failure)\n    }\n  })\n) {\n  toast.success('Report submitted')\n}\n",[202,2244,2245,2253,2273,2288,2303,2317,2341,2346,2350,2356,2362,2383],{"__ignoreMap":230},[234,2246,2247,2250],{"class":236,"line":237},[234,2248,2249],{"class":240},"if",[234,2251,2252],{"class":248}," (\n",[234,2254,2255,2258,2260,2262,2264,2267,2269,2271],{"class":236,"line":268},[234,2256,2257],{"class":240},"  await",[234,2259,1927],{"class":375},[234,2261,379],{"class":248},[234,2263,312],{"class":244},[234,2265,2266],{"class":261},"Submit report?",[234,2268,312],{"class":244},[234,2270,431],{"class":244},[234,2272,315],{"class":244},[234,2274,2275,2277,2279,2281,2284,2286],{"class":236,"line":291},[234,2276,738],{"class":336},[234,2278,678],{"class":244},[234,2280,258],{"class":244},[234,2282,2283],{"class":261},"This will notify all stakeholders.",[234,2285,312],{"class":244},[234,2287,618],{"class":244},[234,2289,2290,2292,2294,2296,2299,2301],{"class":236,"line":298},[234,2291,748],{"class":336},[234,2293,678],{"class":244},[234,2295,258],{"class":244},[234,2297,2298],{"class":261},"Submit",[234,2300,312],{"class":244},[234,2302,618],{"class":244},[234,2304,2305,2307,2309,2311,2313,2315],{"class":236,"line":318},[234,2306,786],{"class":375},[234,2308,678],{"class":244},[234,2310,1922],{"class":301},[234,2312,791],{"class":244},[234,2314,794],{"class":301},[234,2316,315],{"class":244},[234,2318,2319,2322,2324,2326,2329,2331,2334,2336,2339],{"class":236,"line":356},[234,2320,2321],{"class":240},"      await",[234,2323,2118],{"class":248},[234,2325,217],{"class":244},[234,2327,2328],{"class":248},"reports",[234,2330,217],{"class":244},[234,2332,2333],{"class":375},"submit",[234,2335,379],{"class":336},[234,2337,2338],{"class":248},"reportId",[234,2340,689],{"class":336},[234,2342,2343],{"class":236,"line":362},[234,2344,2345],{"class":779},"      \u002F\u002F return false here to abort (e.g. on validation failure)\n",[234,2347,2348],{"class":236,"line":367},[234,2349,1118],{"class":244},[234,2351,2352,2354],{"class":236,"line":522},[234,2353,2020],{"class":244},[234,2355,689],{"class":248},[234,2357,2358,2360],{"class":236,"line":532},[234,2359,1015],{"class":248},[234,2361,1018],{"class":244},[234,2363,2364,2367,2369,2372,2374,2376,2379,2381],{"class":236,"line":664},[234,2365,2366],{"class":248},"  toast",[234,2368,217],{"class":244},[234,2370,2371],{"class":375},"success",[234,2373,379],{"class":336},[234,2375,312],{"class":244},[234,2377,2378],{"class":261},"Report submitted",[234,2380,312],{"class":244},[234,2382,689],{"class":336},[234,2384,2385],{"class":236,"line":692},[234,2386,359],{"class":244},[2388,2389,2391,2393,2394,2398,2399,217],"callout",{"type":2390},"note",[202,2392,1012],{}," runs ",[2395,2396,2397],"strong",{},"inside"," the modal. Errors thrown there propagate to the caller; the spinner stops automatically via ",[202,2400,2401],{},"finally",[219,2403,90],{"id":2404},"overlay",[198,2406,2407,2408,2410,2411,2413],{},"The backdrop is rendered by ",[202,2409,543],{}," placed inside ",[202,2412,547],{}," (see the App.vue snippet above). It applies to every modal in that group — you don't include it in each individual modal component.",[219,2415,2417],{"id":2416},"related","Related",[2419,2420,2421,2428,2432],"ul",{},[2422,2423,2424],"li",{},[2425,2426,2427],"a",{"href":137},"API reference — functions",[2422,2429,2430],{},[2425,2431,82],{"href":83},[2422,2433,2434],{},[2425,2435,111],{"href":112},[2437,2438,2439],"style",{},"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 .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}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 pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--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 .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}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}",{"title":230,"searchDepth":268,"depth":268,"links":2441},[2442,2443,2444,2445,2446,2447],{"id":221,"depth":268,"text":222},{"id":555,"depth":268,"text":556},{"id":2083,"depth":268,"text":2084},{"id":2229,"depth":268,"text":2230},{"id":2404,"depth":268,"text":90},{"id":2416,"depth":268,"text":2417},"A reusable ConfirmDialog component paired with a confirm() helper that returns Promise\u003Cboolean>. Covers loading state and destructive variants.","md",null,{},{"title":107,"description":2448},"q0vuJcMslKDJgzNwDWvpdKW6XFebzZJrPr7I3DGsiTY",[2455,2457],{"title":98,"path":99,"stem":100,"description":2456,"children":-1},"Full type-safety — group registry, typed promises, ExtractComponentProps, and useModalContext typing.",{"title":111,"path":112,"stem":113,"description":2458,"children":-1},"A modal that hosts a form, returns validated data via confirm(data), and guards against accidental dirty-close.",1779523619623]