[{"data":1,"prerenderedAt":3032},["ShallowReactive",2],{"navigation_docs":3,"-api-components-vue-final-modal":108,"-api-components-vue-final-modal-surround":3027},[4,33,67],{"title":5,"icon":6,"path":7,"stem":8,"children":9,"page":32},"Get Started","heroicons-outline:book-open","\u002Fget-started","2.get-started",[10],{"title":11,"icon":12,"path":13,"stem":14,"children":15,"page":32},"Guide","akar-icons:book","\u002Fget-started\u002Fguide","2.get-started\u002F1.guide",[16,20,24,28],{"title":17,"path":18,"stem":19},"Concepts","\u002Fget-started\u002Fguide\u002Fconcepts","2.get-started\u002F1.guide\u002F1.concepts",{"title":21,"path":22,"stem":23},"Setup","\u002Fget-started\u002Fguide\u002Fsetup","2.get-started\u002F1.guide\u002F2.setup",{"title":25,"path":26,"stem":27},"Migration Guide","\u002Fget-started\u002Fguide\u002Fmigration-guide","2.get-started\u002F1.guide\u002F3.migration-guide",{"title":29,"path":30,"stem":31},"Types","\u002Fget-started\u002Fguide\u002Ftypes","2.get-started\u002F1.guide\u002F4.types",false,{"title":34,"icon":35,"path":36,"stem":37,"children":38,"page":32},"API","heroicons-outline:bookmark-alt","\u002Fapi","3.api",[39,53],{"title":40,"icon":41,"path":42,"stem":43,"children":44,"page":32},"Components","heroicons-outline:cube","\u002Fapi\u002Fcomponents","3.api\u002F1.components",[45,49],{"title":46,"path":47,"stem":48},"\u003CVueFinalModal>","\u002Fapi\u002Fcomponents\u002Fvue-final-modal","3.api\u002F1.components\u002F1.vue-final-modal",{"title":50,"path":51,"stem":52},"\u003CModalsContainer>","\u002Fapi\u002Fcomponents\u002Fmodals-container","3.api\u002F1.components\u002F2.modals-container",{"title":54,"icon":55,"path":56,"stem":57,"children":58,"page":32},"Composables","heroicons-outline:switch-horizontal","\u002Fapi\u002Fcomposables","3.api\u002F2.composables",[59,63],{"title":60,"path":61,"stem":62},"useModal()","\u002Fapi\u002Fcomposables\u002Fuse-modal","3.api\u002F2.composables\u002F1.use-modal",{"title":64,"path":65,"stem":66},"useVfm()","\u002Fapi\u002Fcomposables\u002Fuse-vfm","3.api\u002F2.composables\u002F2.use-vfm",{"title":68,"path":69,"stem":70,"children":71,"page":32},"Use Cases","\u002Fuse-cases","4.use-cases",[72,76,80,84,88,92,96,100,104],{"title":73,"path":74,"stem":75},"Playground","\u002Fuse-cases\u002Fplayground","4.use-cases\u002F1.playground",{"title":77,"path":78,"stem":79},"Modal Keep Alive","\u002Fuse-cases\u002Fmodal-keep-alive","4.use-cases\u002F10.modal-keep-alive",{"title":81,"path":82,"stem":83},"Modal Confirm","\u002Fuse-cases\u002Fconfirm-modal","4.use-cases\u002F3.confirm-modal",{"title":85,"path":86,"stem":87},"Modal Nested","\u002Fuse-cases\u002Fmodal-nested","4.use-cases\u002F4.modal-nested",{"title":89,"path":90,"stem":91},"Modal Fullscreen","\u002Fuse-cases\u002Fmodal-fullscreen","4.use-cases\u002F5.modal-fullscreen",{"title":93,"path":94,"stem":95},"Modal Bottom","\u002Fuse-cases\u002Fmodal-bottom","4.use-cases\u002F6.modal-bottom",{"title":97,"path":98,"stem":99},"Modal Login Form","\u002Fuse-cases\u002Fmodal-login-form","4.use-cases\u002F7.modal-login-form",{"title":101,"path":102,"stem":103},"Modal Drag Resize","\u002Fuse-cases\u002Fmodal-drag-resize","4.use-cases\u002F8.modal-drag-resize",{"title":105,"path":106,"stem":107},"Modal Long Scroll","\u002Fuse-cases\u002Fmodal-long-scroll","4.use-cases\u002F9.modal-long-scroll",{"id":109,"title":46,"body":110,"description":127,"extension":3022,"links":3023,"meta":3024,"navigation":2723,"path":47,"seo":3025,"stem":48,"__hash__":3026},"docs\u002F3.api\u002F1.components\u002F1.vue-final-modal.md",{"type":111,"value":112,"toc":2990},"minimark",[113,118,147,428,431,435,542,546,554,659,663,666,698,702,746,820,824,827,857,861,864,926,929,958,1042,1045,1063,1141,1145,1155,1218,1222,1230,1284,1288,1297,1399,1403,1411,1503,1507,1516,1546,1550,1558,1588,1591,1594,1654,1658,1786,1790,1802,1832,1836,1871,1901,1905,1908,2007,2011,2014,2119,2122,2125,2156,2160,2181,2209,2213,2230,2258,2262,2482,2486,2497,2500,2583,2598,2604,2638,2957,2986],[114,115,117],"h2",{"id":116},"template-structure","Template structure",[119,120,121,122,140,141,146],"p",{},"This is the simplify template of the ",[123,124,128,133,137],"code",{"className":125,"language":126,"style":127},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","ts","",[129,130,132],"span",{"class":131},"sTEyZ","\u003C",[129,134,136],{"class":135},"sBMFI","VueFinalModal",[129,138,139],{"class":131},">",".\nIt will be helpful for understanding the naming of ",[142,143,145],"a",{"href":144},"#props","props",".",[148,149,154],"pre",{"className":150,"code":151,"filename":152,"language":153,"meta":127,"style":127},"language-html shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Ctemplate>\n  \u003CTeleport :to=\"teleportTo\">\n    \u003Cdiv class=\"vfm\" role=\"dialog\" aria-modal=\"true\">\n      \u003CTransition v-bind=\"overlayTransition\">\n        \u003Cdiv class=\"vfm__overlay\">\u003C\u002Fdiv>\n      \u003C\u002FTransition>\n      \u003CTransition v-bind=\"contentTransition\">\n        \u003Cdiv class=\"vfm__content\">\n          \u003Cslot \u002F>\n          \u003Cdiv class=\"vfm-swipe-banner-container\">\u003C\u002Fdiv>\n        \u003C\u002Fdiv>\n      \u003C\u002FTransition>\n    \u003C\u002Fdiv>\n  \u003C\u002FTeleport>\n\u003C\u002Ftemplate>\n","VueFinalModal.vue","html",[123,155,156,170,197,244,267,293,303,323,343,355,379,389,398,408,418],{"__ignoreMap":127},[129,157,160,163,167],{"class":158,"line":159},"line",1,[129,161,132],{"class":162},"sMK4o",[129,164,166],{"class":165},"swJcz","template",[129,168,169],{"class":162},">\n",[129,171,173,176,179,183,186,189,193,195],{"class":158,"line":172},2,[129,174,175],{"class":162},"  \u003C",[129,177,178],{"class":165},"Teleport",[129,180,182],{"class":181},"spNyl"," :to",[129,184,185],{"class":162},"=",[129,187,188],{"class":162},"\"",[129,190,192],{"class":191},"sfazB","teleportTo",[129,194,188],{"class":162},[129,196,169],{"class":162},[129,198,200,203,206,209,211,213,216,218,221,223,225,228,230,233,235,237,240,242],{"class":158,"line":199},3,[129,201,202],{"class":162},"    \u003C",[129,204,205],{"class":165},"div",[129,207,208],{"class":181}," class",[129,210,185],{"class":162},[129,212,188],{"class":162},[129,214,215],{"class":191},"vfm",[129,217,188],{"class":162},[129,219,220],{"class":181}," role",[129,222,185],{"class":162},[129,224,188],{"class":162},[129,226,227],{"class":191},"dialog",[129,229,188],{"class":162},[129,231,232],{"class":181}," aria-modal",[129,234,185],{"class":162},[129,236,188],{"class":162},[129,238,239],{"class":191},"true",[129,241,188],{"class":162},[129,243,169],{"class":162},[129,245,247,250,253,256,258,260,263,265],{"class":158,"line":246},4,[129,248,249],{"class":162},"      \u003C",[129,251,252],{"class":165},"Transition",[129,254,255],{"class":181}," v-bind",[129,257,185],{"class":162},[129,259,188],{"class":162},[129,261,262],{"class":191},"overlayTransition",[129,264,188],{"class":162},[129,266,169],{"class":162},[129,268,270,273,275,277,279,281,284,286,289,291],{"class":158,"line":269},5,[129,271,272],{"class":162},"        \u003C",[129,274,205],{"class":165},[129,276,208],{"class":181},[129,278,185],{"class":162},[129,280,188],{"class":162},[129,282,283],{"class":191},"vfm__overlay",[129,285,188],{"class":162},[129,287,288],{"class":162},">\u003C\u002F",[129,290,205],{"class":165},[129,292,169],{"class":162},[129,294,296,299,301],{"class":158,"line":295},6,[129,297,298],{"class":162},"      \u003C\u002F",[129,300,252],{"class":165},[129,302,169],{"class":162},[129,304,306,308,310,312,314,316,319,321],{"class":158,"line":305},7,[129,307,249],{"class":162},[129,309,252],{"class":165},[129,311,255],{"class":181},[129,313,185],{"class":162},[129,315,188],{"class":162},[129,317,318],{"class":191},"contentTransition",[129,320,188],{"class":162},[129,322,169],{"class":162},[129,324,326,328,330,332,334,336,339,341],{"class":158,"line":325},8,[129,327,272],{"class":162},[129,329,205],{"class":165},[129,331,208],{"class":181},[129,333,185],{"class":162},[129,335,188],{"class":162},[129,337,338],{"class":191},"vfm__content",[129,340,188],{"class":162},[129,342,169],{"class":162},[129,344,346,349,352],{"class":158,"line":345},9,[129,347,348],{"class":162},"          \u003C",[129,350,351],{"class":165},"slot",[129,353,354],{"class":162}," \u002F>\n",[129,356,358,360,362,364,366,368,371,373,375,377],{"class":158,"line":357},10,[129,359,348],{"class":162},[129,361,205],{"class":165},[129,363,208],{"class":181},[129,365,185],{"class":162},[129,367,188],{"class":162},[129,369,370],{"class":191},"vfm-swipe-banner-container",[129,372,188],{"class":162},[129,374,288],{"class":162},[129,376,205],{"class":165},[129,378,169],{"class":162},[129,380,382,385,387],{"class":158,"line":381},11,[129,383,384],{"class":162},"        \u003C\u002F",[129,386,205],{"class":165},[129,388,169],{"class":162},[129,390,392,394,396],{"class":158,"line":391},12,[129,393,298],{"class":162},[129,395,252],{"class":165},[129,397,169],{"class":162},[129,399,401,404,406],{"class":158,"line":400},13,[129,402,403],{"class":162},"    \u003C\u002F",[129,405,205],{"class":165},[129,407,169],{"class":162},[129,409,411,414,416],{"class":158,"line":410},14,[129,412,413],{"class":162},"  \u003C\u002F",[129,415,178],{"class":165},[129,417,169],{"class":162},[129,419,421,424,426],{"class":158,"line":420},15,[129,422,423],{"class":162},"\u003C\u002F",[129,425,166],{"class":165},[129,427,169],{"class":162},[114,429,430],{"id":145},"Props",[432,433,192],"h3",{"id":434},"teleportto",[436,437,438,471,531],"ul",{},[439,440,441,442],"li",{},"Description:\n",[436,443,444,451],{},[439,445,446,447,450],{},"Set ",[123,448,449],{},"null | false"," to disable teleport.",[439,452,453,454,464,465,146],{},"The default is ",[123,455,456,459,462],{"className":125,"language":126,"style":127},[129,457,458],{"class":162},"'",[129,460,461],{"class":191},"body",[129,463,458],{"class":162}," because that is the target Nuxt renders on the server, see ",[142,466,470],{"href":467,"rel":468},"https:\u002F\u002Fnuxt.com\u002Fdocs\u002Fapi\u002Fcomponents\u002Fteleports",[469],"nofollow","Nuxt teleports",[439,472,473,474],{},"Type:\n",[436,475,476,498],{},[439,477,478,479],{},"JS: ",[123,480,481,484,487,490,493,495],{"className":125,"language":126,"style":127},[129,482,483],{"class":131},"[String",[129,485,486],{"class":162},",",[129,488,489],{"class":162}," null,",[129,491,492],{"class":131}," Boolean",[129,494,486],{"class":162},[129,496,497],{"class":131}," Object]",[439,499,500,501],{},"TS: ",[123,502,503,506,508,511,514,517,519,522,525,529],{"className":125,"language":126,"style":127},[129,504,505],{"class":131},"PropType",[129,507,132],{"class":162},[129,509,510],{"class":131},"string ",[129,512,513],{"class":162},"|",[129,515,516],{"class":131}," RendererElement ",[129,518,513],{"class":162},[129,520,521],{"class":162}," null",[129,523,524],{"class":162}," |",[129,526,528],{"class":527},"sfNiH"," false",[129,530,139],{"class":162},[439,532,533,534],{},"Default: ",[123,535,536,538,540],{"className":125,"language":126,"style":127},[129,537,458],{"class":162},[129,539,461],{"class":191},[129,541,458],{"class":162},[432,543,545],{"id":544},"modalid-optional","modalId (optional)",[119,547,548,551,552,146],{},[123,549,550],{},"modalId"," should be an uniq value for the operation of a modal via ",[142,553,64],{"href":65},[436,555,556,652],{},[439,557,473,558],{},[436,559,560,576],{},[439,561,478,562],{},[123,563,564,566,568,571,573],{"className":125,"language":126,"style":127},[129,565,483],{"class":131},[129,567,486],{"class":162},[129,569,570],{"class":131}," Number",[129,572,486],{"class":162},[129,574,575],{"class":131}," Symbol]",[439,577,500,578,589,622],{},[123,579,580,582,584,587],{"className":125,"language":126,"style":127},[129,581,505],{"class":131},[129,583,132],{"class":162},[129,585,586],{"class":131},"ModalId",[129,588,139],{"class":162},[148,590,592],{"className":125,"code":591,"language":126,"meta":127,"style":127},"export type ModalId = number | string | symbol\n",[123,593,594],{"__ignoreMap":127},[129,595,596,600,603,606,609,612,614,617,619],{"class":158,"line":159},[129,597,599],{"class":598},"s7zQu","export",[129,601,602],{"class":181}," type",[129,604,605],{"class":135}," ModalId",[129,607,608],{"class":162}," =",[129,610,611],{"class":135}," number",[129,613,524],{"class":162},[129,615,616],{"class":135}," string",[129,618,524],{"class":162},[129,620,621],{"class":135}," symbol\n",[148,623,625],{"className":125,"code":624,"language":126,"meta":127,"style":127},"import { ModalId } from 'vue-final-modal'\n",[123,626,627],{"__ignoreMap":127},[129,628,629,632,635,637,640,643,646,649],{"class":158,"line":159},[129,630,631],{"class":598},"import",[129,633,634],{"class":162}," {",[129,636,605],{"class":131},[129,638,639],{"class":162}," }",[129,641,642],{"class":598}," from",[129,644,645],{"class":162}," '",[129,647,648],{"class":191},"vue-final-modal",[129,650,651],{"class":162},"'\n",[439,653,533,654],{},[123,655,656],{"className":125,"language":126,"style":127},[129,657,658],{"class":162},"undefined",[432,660,662],{"id":661},"modelvalue-optional","modelValue (optional)",[119,664,665],{},"Display the modal or not.",[436,667,668,692],{},[439,669,473,670],{},[436,671,672,679],{},[439,673,478,674],{},[123,675,676],{"className":125,"language":126,"style":127},[129,677,678],{"class":131},"Boolean",[439,680,500,681],{},[123,682,683,685,687,690],{"className":125,"language":126,"style":127},[129,684,505],{"class":131},[129,686,132],{"class":162},[129,688,689],{"class":131},"boolean",[129,691,139],{"class":162},[439,693,533,694],{},[123,695,696],{"className":125,"language":126,"style":127},[129,697,658],{"class":162},[432,699,701],{"id":700},"displaydirective","displayDirective",[119,703,704,705,714,715,724,725,734,735,724,738,741,742,745],{},"Render the modal via ",[123,706,707,709,712],{"className":125,"language":126,"style":127},[129,708,458],{"class":162},[129,710,711],{"class":191},"if",[129,713,458],{"class":162},", ",[123,716,717,719,722],{"className":125,"language":126,"style":127},[129,718,458],{"class":162},[129,720,721],{"class":191},"show",[129,723,458],{"class":162}," or ",[123,726,727,729,732],{"className":125,"language":126,"style":127},[129,728,458],{"class":162},[129,730,731],{"class":191},"visible",[129,733,458],{"class":162}," directive.\nIf you need to keep the modal alive, you can use ",[123,736,737],{},"'show'",[123,739,740],{},"'visible'"," directive. for example if you have a draggable and resizable modal and need to keep the size and position of the modal while re-open it (",[142,743,744],{"href":102},"see example",").",[436,747,748,810],{},[439,749,473,750],{},[436,751,752,778],{},[439,753,478,754],{},[123,755,756,758,760,762,764,766,768,770,772,774,776],{"className":125,"language":126,"style":127},[129,757,458],{"class":162},[129,759,711],{"class":191},[129,761,458],{"class":162},[129,763,524],{"class":162},[129,765,645],{"class":162},[129,767,721],{"class":191},[129,769,458],{"class":162},[129,771,524],{"class":162},[129,773,645],{"class":162},[129,775,731],{"class":191},[129,777,458],{"class":162},[439,779,500,780],{},[123,781,782,784,786,788,790,792,794,796,798,800,802,804,806,808],{"className":125,"language":126,"style":127},[129,783,505],{"class":131},[129,785,132],{"class":162},[129,787,458],{"class":162},[129,789,711],{"class":191},[129,791,458],{"class":162},[129,793,524],{"class":162},[129,795,645],{"class":162},[129,797,721],{"class":191},[129,799,458],{"class":162},[129,801,524],{"class":162},[129,803,645],{"class":162},[129,805,731],{"class":191},[129,807,458],{"class":162},[129,809,139],{"class":162},[439,811,533,812],{},[123,813,814,816,818],{"className":125,"language":126,"style":127},[129,815,458],{"class":162},[129,817,711],{"class":191},[129,819,458],{"class":162},[432,821,823],{"id":822},"hideoverlay","hideOverlay",[119,825,826],{},"Hide the overlay or not.",[436,828,829,851],{},[439,830,473,831],{},[436,832,833,839],{},[439,834,478,835],{},[123,836,837],{"className":125,"language":126,"style":127},[129,838,678],{"class":131},[439,840,500,841],{},[123,842,843,845,847,849],{"className":125,"language":126,"style":127},[129,844,505],{"class":131},[129,846,132],{"class":162},[129,848,689],{"class":131},[129,850,139],{"class":162},[439,852,533,853],{},[123,854,855],{"className":125,"language":126,"style":127},[129,856,658],{"class":162},[432,858,860],{"id":859},"overlaybehavior","overlayBehavior",[119,862,863],{},"Whether the overlay stays visible when another modal opens on top of this one.",[436,865,866,903],{},[439,867,473,868],{},[436,869,870,877],{},[439,871,478,872],{},[123,873,874],{"className":125,"language":126,"style":127},[129,875,876],{"class":131},"String",[439,878,500,879],{},[123,880,881,883,885,887,890,892,894,896,899,901],{"className":125,"language":126,"style":127},[129,882,505],{"class":131},[129,884,132],{"class":162},[129,886,458],{"class":162},[129,888,889],{"class":191},"auto",[129,891,458],{"class":162},[129,893,524],{"class":162},[129,895,645],{"class":162},[129,897,898],{"class":191},"persist",[129,900,458],{"class":162},[129,902,139],{"class":162},[439,904,533,905,909],{},[123,906,907],{"className":125,"language":126,"style":127},[129,908,889],{"class":131},[436,910,911],{},[439,912,913,914,916,917,919,920,922,923,925],{},"By default, the value of ",[123,915,860],{}," will be ",[123,918,889],{},". This means that when you open multiple modals, only the overlay of the top modal will be displayed. On the other hand, if you set the modal's ",[123,921,860],{}," to ",[123,924,898],{},", the modal's overlay will always be visible, allowing you to have multiple overlays at the same time.",[432,927,262],{"id":928},"overlaytransition",[119,930,931,932,935,936,714,939,714,942,714,945,714,948,951,952,957],{},"This prop allow you to setup the transition for ",[123,933,934],{},".vfm__overlay"," element. You can pass a transition name or use the built-in transition name provide by vue-final-modal including ",[123,937,938],{},"'vfm-fade'",[123,940,941],{},"'vfm-slide-down'",[123,943,944],{},"'vfm-slide-up'",[123,946,947],{},"'vfm-slide-right'",[123,949,950],{},"'vfm-slide-left'",". You can also pass the ",[142,953,956],{"href":954,"rel":955},"https:\u002F\u002Fvuejs.org\u002Fapi\u002Fbuilt-in-components.html#transition",[469],"TransitionProps"," to customize your own transition.",[436,959,960,1036],{},[439,961,473,962],{},[436,963,964,974],{},[439,965,478,966],{},[123,967,968,970,972],{"className":125,"language":126,"style":127},[129,969,483],{"class":131},[129,971,486],{"class":162},[129,973,497],{"class":131},[439,975,500,976],{},[123,977,978,980,982,984,986,988,991,993,995,997,1000,1002,1004,1006,1009,1011,1013,1015,1018,1020,1022,1024,1027,1029,1031,1034],{"className":125,"language":126,"style":127},[129,979,505],{"class":131},[129,981,132],{"class":162},[129,983,510],{"class":131},[129,985,513],{"class":162},[129,987,645],{"class":162},[129,989,990],{"class":191},"vfm-fade",[129,992,458],{"class":162},[129,994,524],{"class":162},[129,996,645],{"class":162},[129,998,999],{"class":191},"vfm-slide-down",[129,1001,458],{"class":162},[129,1003,524],{"class":162},[129,1005,645],{"class":162},[129,1007,1008],{"class":191},"vfm-slide-up",[129,1010,458],{"class":162},[129,1012,524],{"class":162},[129,1014,645],{"class":162},[129,1016,1017],{"class":191},"vfm-slide-right",[129,1019,458],{"class":162},[129,1021,524],{"class":162},[129,1023,645],{"class":162},[129,1025,1026],{"class":191},"vfm-slide-left",[129,1028,458],{"class":162},[129,1030,524],{"class":162},[129,1032,1033],{"class":131}," TransitionProps",[129,1035,139],{"class":162},[439,1037,533,1038],{},[123,1039,1040],{"className":125,"language":126,"style":127},[129,1041,658],{"class":162},[432,1043,318],{"id":1044},"contenttransition",[119,1046,931,1047,935,1050,714,1052,714,1054,714,1056,714,1058,951,1060,957],{},[123,1048,1049],{},".vfm__content",[123,1051,938],{},[123,1053,941],{},[123,1055,944],{},[123,1057,947],{},[123,1059,950],{},[142,1061,956],{"href":954,"rel":1062},[469],[436,1064,1065,1135],{},[439,1066,473,1067],{},[436,1068,1069,1079],{},[439,1070,478,1071],{},[123,1072,1073,1075,1077],{"className":125,"language":126,"style":127},[129,1074,483],{"class":131},[129,1076,486],{"class":162},[129,1078,497],{"class":131},[439,1080,500,1081],{},[123,1082,1083,1085,1087,1089,1091,1093,1095,1097,1099,1101,1103,1105,1107,1109,1111,1113,1115,1117,1119,1121,1123,1125,1127,1129,1131,1133],{"className":125,"language":126,"style":127},[129,1084,505],{"class":131},[129,1086,132],{"class":162},[129,1088,510],{"class":131},[129,1090,513],{"class":162},[129,1092,645],{"class":162},[129,1094,990],{"class":191},[129,1096,458],{"class":162},[129,1098,524],{"class":162},[129,1100,645],{"class":162},[129,1102,999],{"class":191},[129,1104,458],{"class":162},[129,1106,524],{"class":162},[129,1108,645],{"class":162},[129,1110,1008],{"class":191},[129,1112,458],{"class":162},[129,1114,524],{"class":162},[129,1116,645],{"class":162},[129,1118,1017],{"class":191},[129,1120,458],{"class":162},[129,1122,524],{"class":162},[129,1124,645],{"class":162},[129,1126,1026],{"class":191},[129,1128,458],{"class":162},[129,1130,524],{"class":162},[129,1132,1033],{"class":131},[129,1134,139],{"class":162},[439,1136,533,1137],{},[123,1138,1139],{"className":125,"language":126,"style":127},[129,1140,658],{"class":162},[432,1142,1144],{"id":1143},"overlayclass","overlayClass",[119,1146,1147,1148,1154],{},"Bind class to ",[123,1149,1150,1152],{"className":125,"language":126,"style":127},[129,1151,146],{"class":162},[129,1153,283],{"class":131}," element.",[436,1156,1157,1212],{},[439,1158,473,1159],{},[436,1160,1161,1178],{},[439,1162,478,1163],{},[123,1164,1165,1168,1170,1173,1175],{"className":125,"language":126,"style":127},[129,1166,1167],{"class":131},"[Object",[129,1169,486],{"class":162},[129,1171,1172],{"class":131}," Array",[129,1174,486],{"class":162},[129,1176,1177],{"class":131}," String]",[439,1179,500,1180],{},[123,1181,1182,1184,1186,1188,1190,1193,1196,1199,1202,1205,1207,1210],{"className":125,"language":126,"style":127},[129,1183,1167],{"class":131},[129,1185,486],{"class":162},[129,1187,1172],{"class":131},[129,1189,486],{"class":162},[129,1191,1192],{"class":131}," String] ",[129,1194,1195],{"class":598},"as",[129,1197,1198],{"class":135}," unknown",[129,1200,1201],{"class":598}," as",[129,1203,1204],{"class":135}," PropType",[129,1206,132],{"class":162},[129,1208,1209],{"class":135},"any",[129,1211,139],{"class":162},[439,1213,533,1214],{},[123,1215,1216],{"className":125,"language":126,"style":127},[129,1217,658],{"class":162},[432,1219,1221],{"id":1220},"contentclass","contentClass",[119,1223,1147,1224,1154],{},[123,1225,1226,1228],{"className":125,"language":126,"style":127},[129,1227,146],{"class":162},[129,1229,338],{"class":131},[436,1231,1232,1278],{},[439,1233,473,1234],{},[436,1235,1236,1250],{},[439,1237,478,1238],{},[123,1239,1240,1242,1244,1246,1248],{"className":125,"language":126,"style":127},[129,1241,1167],{"class":131},[129,1243,486],{"class":162},[129,1245,1172],{"class":131},[129,1247,486],{"class":162},[129,1249,1177],{"class":131},[439,1251,500,1252],{},[123,1253,1254,1256,1258,1260,1262,1264,1266,1268,1270,1272,1274,1276],{"className":125,"language":126,"style":127},[129,1255,1167],{"class":131},[129,1257,486],{"class":162},[129,1259,1172],{"class":131},[129,1261,486],{"class":162},[129,1263,1192],{"class":131},[129,1265,1195],{"class":598},[129,1267,1198],{"class":135},[129,1269,1201],{"class":598},[129,1271,1204],{"class":135},[129,1273,132],{"class":162},[129,1275,1209],{"class":135},[129,1277,139],{"class":162},[439,1279,533,1280],{},[123,1281,1282],{"className":125,"language":126,"style":127},[129,1283,658],{"class":162},[432,1285,1287],{"id":1286},"overlaystyle","overlayStyle",[119,1289,1290,1291,1154],{},"Bind style to ",[123,1292,1293,1295],{"className":125,"language":126,"style":127},[129,1294,146],{"class":162},[129,1296,283],{"class":131},[436,1298,1299,1393],{},[439,1300,473,1301],{},[436,1302,1303,1319],{},[439,1304,478,1305],{},[123,1306,1307,1309,1311,1314,1316],{"className":125,"language":126,"style":127},[129,1308,483],{"class":131},[129,1310,486],{"class":162},[129,1312,1313],{"class":131}," Object",[129,1315,486],{"class":162},[129,1317,1318],{"class":131}," Array]",[439,1320,500,1321,1332,1370],{},[123,1322,1323,1325,1327,1330],{"className":125,"language":126,"style":127},[129,1324,505],{"class":131},[129,1326,132],{"class":162},[129,1328,1329],{"class":131},"StyleValue",[129,1331,139],{"class":162},[148,1333,1335],{"className":125,"code":1334,"language":126,"meta":127,"style":127},"export type StyleValue = string | CSSProperties | (string | CSSProperties)[]\n",[123,1336,1337],{"__ignoreMap":127},[129,1338,1339,1341,1343,1346,1348,1350,1352,1355,1357,1360,1363,1365,1367],{"class":158,"line":159},[129,1340,599],{"class":598},[129,1342,602],{"class":181},[129,1344,1345],{"class":135}," StyleValue",[129,1347,608],{"class":162},[129,1349,616],{"class":135},[129,1351,524],{"class":162},[129,1353,1354],{"class":135}," CSSProperties",[129,1356,524],{"class":162},[129,1358,1359],{"class":131}," (",[129,1361,1362],{"class":135},"string",[129,1364,524],{"class":162},[129,1366,1354],{"class":135},[129,1368,1369],{"class":131},")[]\n",[148,1371,1373],{"className":125,"code":1372,"language":126,"meta":127,"style":127},"import { StyleValue } from 'vue-final-modal'\n",[123,1374,1375],{"__ignoreMap":127},[129,1376,1377,1379,1381,1383,1385,1387,1389,1391],{"class":158,"line":159},[129,1378,631],{"class":598},[129,1380,634],{"class":162},[129,1382,1345],{"class":131},[129,1384,639],{"class":162},[129,1386,642],{"class":598},[129,1388,645],{"class":162},[129,1390,648],{"class":191},[129,1392,651],{"class":162},[439,1394,533,1395],{},[123,1396,1397],{"className":125,"language":126,"style":127},[129,1398,658],{"class":162},[432,1400,1402],{"id":1401},"contentstyle","contentStyle",[119,1404,1290,1405,1154],{},[123,1406,1407,1409],{"className":125,"language":126,"style":127},[129,1408,146],{"class":162},[129,1410,338],{"class":131},[436,1412,1413,1497],{},[439,1414,473,1415],{},[436,1416,1417,1431],{},[439,1418,478,1419],{},[123,1420,1421,1423,1425,1427,1429],{"className":125,"language":126,"style":127},[129,1422,483],{"class":131},[129,1424,486],{"class":162},[129,1426,1313],{"class":131},[129,1428,486],{"class":162},[129,1430,1318],{"class":131},[439,1432,500,1433,1443,1475],{},[123,1434,1435,1437,1439,1441],{"className":125,"language":126,"style":127},[129,1436,505],{"class":131},[129,1438,132],{"class":162},[129,1440,1329],{"class":131},[129,1442,139],{"class":162},[148,1444,1445],{"className":125,"code":1334,"language":126,"meta":127,"style":127},[123,1446,1447],{"__ignoreMap":127},[129,1448,1449,1451,1453,1455,1457,1459,1461,1463,1465,1467,1469,1471,1473],{"class":158,"line":159},[129,1450,599],{"class":598},[129,1452,602],{"class":181},[129,1454,1345],{"class":135},[129,1456,608],{"class":162},[129,1458,616],{"class":135},[129,1460,524],{"class":162},[129,1462,1354],{"class":135},[129,1464,524],{"class":162},[129,1466,1359],{"class":131},[129,1468,1362],{"class":135},[129,1470,524],{"class":162},[129,1472,1354],{"class":135},[129,1474,1369],{"class":131},[148,1476,1477],{"className":125,"code":1372,"language":126,"meta":127,"style":127},[123,1478,1479],{"__ignoreMap":127},[129,1480,1481,1483,1485,1487,1489,1491,1493,1495],{"class":158,"line":159},[129,1482,631],{"class":598},[129,1484,634],{"class":162},[129,1486,1345],{"class":131},[129,1488,639],{"class":162},[129,1490,642],{"class":598},[129,1492,645],{"class":162},[129,1494,648],{"class":191},[129,1496,651],{"class":162},[439,1498,533,1499],{},[123,1500,1501],{"className":125,"language":126,"style":127},[129,1502,658],{"class":162},[432,1504,1506],{"id":1505},"clicktoclose","clickToClose",[119,1508,1509,1510,1154],{},"Can be closed by clicking the ",[123,1511,1512,1514],{"className":125,"language":126,"style":127},[129,1513,146],{"class":162},[129,1515,215],{"class":131},[436,1517,1518,1540],{},[439,1519,473,1520],{},[436,1521,1522,1528],{},[439,1523,478,1524],{},[123,1525,1526],{"className":125,"language":126,"style":127},[129,1527,678],{"class":131},[439,1529,500,1530],{},[123,1531,1532,1534,1536,1538],{"className":125,"language":126,"style":127},[129,1533,505],{"class":131},[129,1535,132],{"class":162},[129,1537,689],{"class":131},[129,1539,139],{"class":162},[439,1541,533,1542],{},[123,1543,1544],{"className":125,"language":126,"style":127},[129,1545,239],{"class":527},[432,1547,1549],{"id":1548},"esctoclose","escToClose",[119,1551,1552,1553,146],{},"Can be closed by keypress ",[123,1554,1555],{"className":125,"language":126,"style":127},[129,1556,1557],{"class":131},"esc",[436,1559,1560,1582],{},[439,1561,473,1562],{},[436,1563,1564,1570],{},[439,1565,478,1566],{},[123,1567,1568],{"className":125,"language":126,"style":127},[129,1569,678],{"class":131},[439,1571,500,1572],{},[123,1573,1574,1576,1578,1580],{"className":125,"language":126,"style":127},[129,1575,505],{"class":131},[129,1577,132],{"class":162},[129,1579,689],{"class":131},[129,1581,139],{"class":162},[439,1583,533,1584],{},[123,1585,1586],{"className":125,"language":126,"style":127},[129,1587,239],{"class":527},[432,1589,1590],{"id":1590},"background",[119,1592,1593],{},"Is it allow to interact with background of the modal.",[436,1595,1596,1644],{},[439,1597,473,1598],{},[436,1599,1600,1620],{},[439,1601,478,1602],{},[123,1603,1604,1606,1609,1611,1613,1615,1618],{"className":125,"language":126,"style":127},[129,1605,458],{"class":162},[129,1607,1608],{"class":191},"interactive",[129,1610,458],{"class":162},[129,1612,524],{"class":162},[129,1614,645],{"class":162},[129,1616,1617],{"class":191},"non-interactive",[129,1619,458],{"class":162},[439,1621,500,1622],{},[123,1623,1624,1626,1628,1630,1632,1634,1636,1638,1640,1642],{"className":125,"language":126,"style":127},[129,1625,505],{"class":131},[129,1627,132],{"class":162},[129,1629,458],{"class":162},[129,1631,1608],{"class":191},[129,1633,458],{"class":162},[129,1635,524],{"class":162},[129,1637,645],{"class":162},[129,1639,1617],{"class":191},[129,1641,458],{"class":162},[129,1643,139],{"class":162},[439,1645,533,1646],{},[123,1647,1648,1650,1652],{"className":125,"language":126,"style":127},[129,1649,458],{"class":162},[129,1651,1617],{"class":191},[129,1653,458],{"class":162},[432,1655,1657],{"id":1656},"focustrap","focusTrap",[436,1659,1660,1736,1768],{},[439,1661,441,1662],{},[436,1663,1664,1672,1691],{},[439,1665,446,1666,1671],{},[123,1667,1668],{"className":125,"language":126,"style":127},[129,1669,1670],{"class":527},"false"," to disable the focusTrap.",[439,1673,1674,1675,1678,1679,1684,1685,1690],{},"For more information on what ",[123,1676,1677],{},"options"," can be passed, see ",[142,1680,1683],{"href":1681,"rel":1682},"https:\u002F\u002Fgithub.com\u002Ffocus-trap\u002Ffocus-trap#createoptions",[469],"createOptions"," in the ",[142,1686,1689],{"href":1687,"rel":1688},"https:\u002F\u002Fgithub.com\u002Ffocus-trap\u002Ffocus-trap",[469],"focus-trap"," documentation.",[439,1692,1693,1694,1719,1720,1723,1724,1727,1728,1732,1733,146],{},"The options you pass are merged over ",[123,1695,1696,1699,1702,1705,1708,1710,1713,1715,1717],{"className":125,"language":126,"style":127},[129,1697,1698],{"class":162},"{",[129,1700,1701],{"class":135}," allowOutsideClick",[129,1703,1704],{"class":162},":",[129,1706,1707],{"class":527}," true",[129,1709,486],{"class":162},[129,1711,1712],{"class":135}," escapeDeactivates",[129,1714,1704],{"class":162},[129,1716,528],{"class":527},[129,1718,639],{"class":162},": outside clicks stay allowed so ",[142,1721,1506],{"href":1722},"#clicktoclose"," and an interactive ",[142,1725,1590],{"href":1726},"#background"," keep working, and the ",[123,1729,1730],{"className":125,"language":126,"style":127},[129,1731,1557],{"class":131}," key is handled by ",[142,1734,1549],{"href":1735},"#esctoclose",[439,1737,473,1738],{},[436,1739,1740,1751],{},[439,1741,478,1742],{},[123,1743,1744,1747,1749],{"className":125,"language":126,"style":127},[129,1745,1746],{"class":131},"[Boolean",[129,1748,486],{"class":162},[129,1750,497],{"class":131},[439,1752,500,1753],{},[123,1754,1755,1757,1759,1761,1763,1766],{"className":125,"language":126,"style":127},[129,1756,505],{"class":131},[129,1758,132],{"class":162},[129,1760,1670],{"class":527},[129,1762,524],{"class":162},[129,1764,1765],{"class":131}," Options",[129,1767,139],{"class":162},[439,1769,533,1770],{},[123,1771,1772,1775,1778,1780,1783],{"className":125,"language":126,"style":127},[129,1773,1774],{"class":162},"()",[129,1776,1777],{"class":181}," =>",[129,1779,1359],{"class":131},[129,1781,1782],{"class":162},"{}",[129,1784,1785],{"class":131},")",[432,1787,1789],{"id":1788},"lockscroll","lockScroll",[119,1791,1792,1793,1796,1797,1801],{},"Lock the scroll of the page while the modal is opened. A modal rendered inside a scroll container, for example with ",[142,1794,192],{"href":1795},"#teleportto"," set to ",[123,1798,1799],{"className":125,"language":126,"style":127},[129,1800,1670],{"class":527},", locks that container too. Locks are counted, so the scroll comes back when the last modal holding it closes. On iOS, touch scrolling keeps working inside the scrollable elements of the modal.",[436,1803,1804,1826],{},[439,1805,473,1806],{},[436,1807,1808,1814],{},[439,1809,478,1810],{},[123,1811,1812],{"className":125,"language":126,"style":127},[129,1813,678],{"class":131},[439,1815,500,1816],{},[123,1817,1818,1820,1822,1824],{"className":125,"language":126,"style":127},[129,1819,505],{"class":131},[129,1821,132],{"class":162},[129,1823,689],{"class":131},[129,1825,139],{"class":162},[439,1827,533,1828],{},[123,1829,1830],{"className":125,"language":126,"style":127},[129,1831,239],{"class":527},[432,1833,1835],{"id":1834},"reservescrollbargap","reserveScrollBarGap",[119,1837,1838,1839,1850,1851,1861,1862,1870],{},"Keep the room of the scrollbar that disappears when the scroll is locked, so the content does not shift. The page gets the scrollbar's width as ",[123,1840,1841,1844,1847],{"className":125,"language":126,"style":127},[129,1842,1843],{"class":131},"padding",[129,1845,1846],{"class":162},"-",[129,1848,1849],{"class":131},"right",". A locked scroll container keeps a stable ",[123,1852,1853,1856,1858],{"className":125,"language":126,"style":127},[129,1854,1855],{"class":131},"scrollbar",[129,1857,1846],{"class":162},[129,1859,1860],{"class":131},"gutter",", or gets the width as padding on its scrollbar's side where ",[123,1863,1864,1866,1868],{"className":125,"language":126,"style":127},[129,1865,1855],{"class":131},[129,1867,1846],{"class":162},[129,1869,1860],{"class":131}," is not supported.",[436,1872,1873,1895],{},[439,1874,473,1875],{},[436,1876,1877,1883],{},[439,1878,478,1879],{},[123,1880,1881],{"className":125,"language":126,"style":127},[129,1882,678],{"class":131},[439,1884,500,1885],{},[123,1886,1887,1889,1891,1893],{"className":125,"language":126,"style":127},[129,1888,505],{"class":131},[129,1890,132],{"class":162},[129,1892,689],{"class":131},[129,1894,139],{"class":162},[439,1896,533,1897],{},[123,1898,1899],{"className":125,"language":126,"style":127},[129,1900,239],{"class":527},[432,1902,1904],{"id":1903},"zindexfn","zIndexFn",[119,1906,1907],{},"Define how to increase the zIndex when there are nested modals.",[436,1909,1910,1958],{},[439,1911,473,1912],{},[436,1913,1914,1921],{},[439,1915,478,1916],{},[123,1917,1918],{"className":125,"language":126,"style":127},[129,1919,1920],{"class":131},"Function",[439,1922,500,1923],{},[123,1924,1925,1927,1930,1934,1936,1938,1941,1943,1945,1948,1950,1953,1955],{"className":125,"language":126,"style":127},[129,1926,505],{"class":131},[129,1928,1929],{"class":162},"\u003C(",[129,1931,1933],{"class":1932},"sHdIc","context",[129,1935,1704],{"class":162},[129,1937,634],{"class":162},[129,1939,1940],{"class":165}," index",[129,1942,1704],{"class":162},[129,1944,611],{"class":135},[129,1946,1947],{"class":162}," })",[129,1949,1777],{"class":181},[129,1951,1952],{"class":131}," number ",[129,1954,513],{"class":162},[129,1956,1957],{"class":162}," undefined>",[439,1959,533,1960,1997],{},[123,1961,1962,1965,1967,1970,1972,1974,1976,1978,1980,1982,1986,1989,1992,1995],{"className":125,"language":126,"style":127},[129,1963,1964],{"class":162},"({",[129,1966,1940],{"class":1932},[129,1968,1969],{"class":162}," }:",[129,1971,634],{"class":162},[129,1973,1940],{"class":165},[129,1975,1704],{"class":162},[129,1977,611],{"class":135},[129,1979,1947],{"class":162},[129,1981,1777],{"class":181},[129,1983,1985],{"class":1984},"sbssI"," 1000",[129,1987,1988],{"class":162}," +",[129,1990,1991],{"class":1984}," 2",[129,1993,1994],{"class":162}," *",[129,1996,1940],{"class":131},[436,1998,1999],{},[439,2000,2001,2006],{},[123,2002,2003],{"className":125,"language":126,"style":127},[129,2004,2005],{"class":131},"index"," is the index order of the opened modals",[432,2008,2010],{"id":2009},"swipetoclose","swipeToClose",[119,2012,2013],{},"The direction of swiping to close the modal",[436,2015,2016,2114],{},[439,2017,473,2018],{},[436,2019,2020,2066],{},[439,2021,478,2022],{},[123,2023,2024,2026,2029,2031,2033,2035,2038,2040,2042,2044,2046,2048,2050,2052,2055,2057,2059,2061,2064],{"className":125,"language":126,"style":127},[129,2025,458],{"class":162},[129,2027,2028],{"class":191},"none",[129,2030,458],{"class":162},[129,2032,524],{"class":162},[129,2034,645],{"class":162},[129,2036,2037],{"class":191},"up",[129,2039,458],{"class":162},[129,2041,524],{"class":162},[129,2043,645],{"class":162},[129,2045,1849],{"class":191},[129,2047,458],{"class":162},[129,2049,524],{"class":162},[129,2051,645],{"class":162},[129,2053,2054],{"class":191},"down",[129,2056,458],{"class":162},[129,2058,524],{"class":162},[129,2060,645],{"class":162},[129,2062,2063],{"class":191},"left",[129,2065,458],{"class":162},[439,2067,500,2068],{},[123,2069,2070,2072,2074,2076,2078,2080,2082,2084,2086,2088,2090,2092,2094,2096,2098,2100,2102,2104,2106,2108,2110,2112],{"className":125,"language":126,"style":127},[129,2071,505],{"class":131},[129,2073,132],{"class":162},[129,2075,458],{"class":162},[129,2077,2028],{"class":191},[129,2079,458],{"class":162},[129,2081,524],{"class":162},[129,2083,645],{"class":162},[129,2085,2037],{"class":191},[129,2087,458],{"class":162},[129,2089,524],{"class":162},[129,2091,645],{"class":162},[129,2093,1849],{"class":191},[129,2095,458],{"class":162},[129,2097,524],{"class":162},[129,2099,645],{"class":162},[129,2101,2054],{"class":191},[129,2103,458],{"class":162},[129,2105,524],{"class":162},[129,2107,645],{"class":162},[129,2109,2063],{"class":191},[129,2111,458],{"class":162},[129,2113,139],{"class":162},[439,2115,533,2116],{},[123,2117,2118],{},"'none'",[432,2120,2121],{"id":2121},"threshold",[119,2123,2124],{},"Threshold for swipe to close",[436,2126,2127,2151],{},[439,2128,473,2129],{},[436,2130,2131,2138],{},[439,2132,478,2133],{},[123,2134,2135],{"className":125,"language":126,"style":127},[129,2136,2137],{"class":131},"Number",[439,2139,500,2140],{},[123,2141,2142,2144,2146,2149],{"className":125,"language":126,"style":127},[129,2143,505],{"class":131},[129,2145,132],{"class":162},[129,2147,2148],{"class":131},"number",[129,2150,139],{"class":162},[439,2152,533,2153],{},[123,2154,2155],{},"0",[432,2157,2159],{"id":2158},"showswipebanner","showSwipeBanner",[119,2161,2162,2163,2176,2177,2180],{},"If set ",[123,2164,2165,2168,2170,2172,2174],{"className":125,"language":126,"style":127},[129,2166,2167],{"class":131},":showSwipeBanner",[129,2169,185],{"class":162},[129,2171,188],{"class":162},[129,2173,239],{"class":191},[129,2175,188],{"class":162},", only allow clicking ",[123,2178,2179],{},"swipe-banner"," slot to swipe to close",[436,2182,2183,2205],{},[439,2184,473,2185],{},[436,2186,2187,2193],{},[439,2188,478,2189],{},[123,2190,2191],{"className":125,"language":126,"style":127},[129,2192,678],{"class":131},[439,2194,500,2195],{},[123,2196,2197,2199,2201,2203],{"className":125,"language":126,"style":127},[129,2198,505],{"class":131},[129,2200,132],{"class":162},[129,2202,689],{"class":131},[129,2204,139],{"class":162},[439,2206,533,2207],{},[123,2208,658],{},[432,2210,2212],{"id":2211},"preventnavigationgestures","preventNavigationGestures",[119,2214,2215,2216,2229],{},"When set ",[123,2217,2218,2221,2223,2225,2227],{"className":125,"language":126,"style":127},[129,2219,2220],{"class":131},":preventNavigationGestures",[129,2222,185],{"class":162},[129,2224,188],{"class":162},[129,2226,239],{"class":191},[129,2228,188],{"class":162},", there will be two invisible bars for prevent navigation gestures including swiping back\u002Fforward on mobile webkit. For example: Safari mobile.",[436,2231,2232,2254],{},[439,2233,473,2234],{},[436,2235,2236,2242],{},[439,2237,478,2238],{},[123,2239,2240],{"className":125,"language":126,"style":127},[129,2241,678],{"class":131},[439,2243,500,2244],{},[123,2245,2246,2248,2250,2252],{"className":125,"language":126,"style":127},[129,2247,505],{"class":131},[129,2249,132],{"class":162},[129,2251,689],{"class":131},[129,2253,139],{"class":162},[439,2255,533,2256],{},[123,2257,658],{},[114,2259,2261],{"id":2260},"events","Events",[436,2263,2264,2337,2359,2422,2456],{},[439,2265,2266,2310,2311],{},[123,2267,2268,2271,2274,2276,2278,2281,2283,2285,2288,2290,2292,2295,2297,2300,2302,2305,2308],{"className":125,"language":126,"style":127},[129,2269,2270],{"class":162},"(",[129,2272,2273],{"class":1932},"e",[129,2275,1704],{"class":162},[129,2277,645],{"class":162},[129,2279,2280],{"class":191},"beforeOpen",[129,2282,458],{"class":162},[129,2284,486],{"class":162},[129,2286,2287],{"class":1932}," event",[129,2289,1704],{"class":162},[129,2291,634],{"class":162},[129,2293,2294],{"class":165}," stop",[129,2296,1704],{"class":162},[129,2298,2299],{"class":162}," ()",[129,2301,1777],{"class":181},[129,2303,2304],{"class":135}," void",[129,2306,2307],{"class":162}," }):",[129,2309,2304],{"class":135},": Emits while modal is still invisible, but before transition starting.\n",[436,2312,2313],{},[439,2314,2315,2318,2319,2327,2328,146],{},[123,2316,2317],{},"event.stop()"," is use to prevent the modal from opening. The pending ",[123,2320,2321,2325],{"className":125,"language":126,"style":127},[129,2322,2324],{"class":2323},"s2Zo4","open",[129,2326,1774],{"class":131}," then resolves with a message instead of ",[123,2329,2330,2332,2335],{"className":125,"language":126,"style":127},[129,2331,458],{"class":162},[129,2333,2334],{"class":191},"opened",[129,2336,458],{"class":162},[439,2338,2339,2358],{},[123,2340,2341,2343,2345,2347,2349,2351,2353,2356],{"className":125,"language":126,"style":127},[129,2342,2270],{"class":162},[129,2344,2273],{"class":1932},[129,2346,1704],{"class":162},[129,2348,645],{"class":162},[129,2350,2334],{"class":191},[129,2352,458],{"class":162},[129,2354,2355],{"class":162},"):",[129,2357,2304],{"class":135},": Emits after modal became visible and transition ended.",[439,2360,2361,2398,2399],{},[123,2362,2363,2365,2367,2369,2371,2374,2376,2378,2380,2382,2384,2386,2388,2390,2392,2394,2396],{"className":125,"language":126,"style":127},[129,2364,2270],{"class":162},[129,2366,2273],{"class":1932},[129,2368,1704],{"class":162},[129,2370,645],{"class":162},[129,2372,2373],{"class":191},"beforeClose",[129,2375,458],{"class":162},[129,2377,486],{"class":162},[129,2379,2287],{"class":1932},[129,2381,1704],{"class":162},[129,2383,634],{"class":162},[129,2385,2294],{"class":165},[129,2387,1704],{"class":162},[129,2389,2299],{"class":162},[129,2391,1777],{"class":181},[129,2393,2304],{"class":135},[129,2395,2307],{"class":162},[129,2397,2304],{"class":135},": Emits before modal is going to be closed.\n",[436,2400,2401],{},[439,2402,2403,2405,2406,2327,2413,146],{},[123,2404,2317],{}," is use to prevent the modal from closing. The pending ",[123,2407,2408,2411],{"className":125,"language":126,"style":127},[129,2409,2410],{"class":2323},"close",[129,2412,1774],{"class":131},[123,2414,2415,2417,2420],{"className":125,"language":126,"style":127},[129,2416,458],{"class":162},[129,2418,2419],{"class":191},"closed",[129,2421,458],{"class":162},[439,2423,2424,2442,2443,2450,2451,146],{},[123,2425,2426,2428,2430,2432,2434,2436,2438,2440],{"className":125,"language":126,"style":127},[129,2427,2270],{"class":162},[129,2429,2273],{"class":1932},[129,2431,1704],{"class":162},[129,2433,645],{"class":162},[129,2435,2419],{"class":191},[129,2437,458],{"class":162},[129,2439,2355],{"class":162},[129,2441,2304],{"class":135},": Emits after modal became invisible and transition ended. A modal opened by ",[123,2444,2445,2448],{"className":125,"language":126,"style":127},[129,2446,2447],{"class":2323},"useModal",[129,2449,1774],{"class":131}," is unmounted right after, unless it has ",[123,2452,2453],{"className":125,"language":126,"style":127},[129,2454,2455],{"class":131},"keepAlive",[439,2457,2458,2477,2478,2481],{},[123,2459,2460,2462,2464,2466,2468,2471,2473,2475],{"className":125,"language":126,"style":127},[129,2461,2270],{"class":162},[129,2463,2273],{"class":1932},[129,2465,1704],{"class":162},[129,2467,645],{"class":162},[129,2469,2470],{"class":191},"clickOutside",[129,2472,458],{"class":162},[129,2474,2355],{"class":162},[129,2476,2304],{"class":135},": Emits while ",[123,2479,2480],{},".vfm"," element on click.",[114,2483,2485],{"id":2484},"slots","Slots",[436,2487,2488],{},[439,2489,2490,2491,2496],{},"The ",[123,2492,2493],{"className":125,"language":126,"style":127},[129,2494,2495],{"class":598},"default"," slot can be used to render the modal content.",[119,2498,2499],{},"You can also use scoped slots to close modal, for example:",[148,2501,2503],{"className":150,"code":2502,"language":153,"meta":127,"style":127},"\u003CVueFinalModal>\n  \u003Ctemplate #default=\"{ close }\">\n    \u003Cbutton @click=\"() => close()\">\n      Cancel\n    \u003C\u002Fbutton>\n  \u003C\u002Ftemplate>\n\u003C\u002FVueFinalModal>\n",[123,2504,2505,2513,2533,2554,2559,2567,2575],{"__ignoreMap":127},[129,2506,2507,2509,2511],{"class":158,"line":159},[129,2508,132],{"class":162},[129,2510,136],{"class":165},[129,2512,169],{"class":162},[129,2514,2515,2517,2519,2522,2524,2526,2529,2531],{"class":158,"line":172},[129,2516,175],{"class":162},[129,2518,166],{"class":165},[129,2520,2521],{"class":181}," #default",[129,2523,185],{"class":162},[129,2525,188],{"class":162},[129,2527,2528],{"class":191},"{ close }",[129,2530,188],{"class":162},[129,2532,169],{"class":162},[129,2534,2535,2537,2540,2543,2545,2547,2550,2552],{"class":158,"line":199},[129,2536,202],{"class":162},[129,2538,2539],{"class":165},"button",[129,2541,2542],{"class":181}," @click",[129,2544,185],{"class":162},[129,2546,188],{"class":162},[129,2548,2549],{"class":191},"() => close()",[129,2551,188],{"class":162},[129,2553,169],{"class":162},[129,2555,2556],{"class":158,"line":246},[129,2557,2558],{"class":131},"      Cancel\n",[129,2560,2561,2563,2565],{"class":158,"line":269},[129,2562,403],{"class":162},[129,2564,2539],{"class":165},[129,2566,169],{"class":162},[129,2568,2569,2571,2573],{"class":158,"line":295},[129,2570,413],{"class":162},[129,2572,166],{"class":165},[129,2574,169],{"class":162},[129,2576,2577,2579,2581],{"class":158,"line":305},[129,2578,423],{"class":162},[129,2580,136],{"class":165},[129,2582,169],{"class":162},[436,2584,2585],{},[439,2586,2490,2587,2597],{},[123,2588,2589,2592,2594],{"className":125,"language":126,"style":127},[129,2590,2591],{"class":131},"swipe",[129,2593,1846],{"class":162},[129,2595,2596],{"class":131},"banner"," slot can be used to define the area that can be swipe to close",[114,2599,2601,2602],{"id":2600},"wrapping-vuefinalmodal","Wrapping ",[123,2603,46],{},[119,2605,2606,2607,2615,2616,2621,2622,2629,2630,1704],{},"To build your own modal component that still takes every prop of ",[123,2608,2609,2611,2613],{"className":125,"language":126,"style":127},[129,2610,132],{"class":131},[129,2612,136],{"class":135},[129,2614,139],{"class":131},", spread ",[123,2617,2618],{"className":125,"language":126,"style":127},[129,2619,2620],{"class":131},"vueFinalModalProps"," into its props and bind the result of ",[123,2623,2624,2627],{"className":125,"language":126,"style":127},[129,2625,2626],{"class":2323},"useVfmAttrs",[129,2628,1774],{"class":131}," to the inner ",[123,2631,2632,2634,2636],{"className":125,"language":126,"style":127},[129,2633,132],{"class":131},[129,2635,136],{"class":135},[129,2637,139],{"class":131},[148,2639,2644],{"className":2640,"code":2641,"filename":2642,"language":2643,"meta":127,"style":127},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup lang=\"ts\">\nimport type { VueFinalModalEmits } from 'vue-final-modal'\nimport { VueFinalModal, useVfmAttrs, vueFinalModalProps } from 'vue-final-modal'\n\nconst props = defineProps({\n  ...vueFinalModalProps,\n  title: { type: String, default: '' },\n})\nconst emit = defineEmits\u003CVueFinalModalEmits>()\ndefineOptions({ inheritAttrs: false })\n\nconst vfmAttrs = useVfmAttrs({ props, modalProps: vueFinalModalProps, emit })\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CVueFinalModal v-bind=\"vfmAttrs\">\n    \u003Ch1>{{ title }}\u003C\u002Fh1>\n    \u003Cslot \u002F>\n  \u003C\u002FVueFinalModal>\n\u003C\u002Ftemplate>\n","MyModal.vue","vue",[123,2645,2646,2669,2690,2719,2725,2743,2753,2782,2790,2812,2832,2836,2871,2879,2883,2891,2911,2930,2939,2948],{"__ignoreMap":127},[129,2647,2648,2650,2653,2656,2659,2661,2663,2665,2667],{"class":158,"line":159},[129,2649,132],{"class":162},[129,2651,2652],{"class":165},"script",[129,2654,2655],{"class":181}," setup",[129,2657,2658],{"class":181}," lang",[129,2660,185],{"class":162},[129,2662,188],{"class":162},[129,2664,126],{"class":191},[129,2666,188],{"class":162},[129,2668,169],{"class":162},[129,2670,2671,2673,2675,2677,2680,2682,2684,2686,2688],{"class":158,"line":172},[129,2672,631],{"class":598},[129,2674,602],{"class":598},[129,2676,634],{"class":162},[129,2678,2679],{"class":131}," VueFinalModalEmits",[129,2681,639],{"class":162},[129,2683,642],{"class":598},[129,2685,645],{"class":162},[129,2687,648],{"class":191},[129,2689,651],{"class":162},[129,2691,2692,2694,2696,2699,2701,2704,2706,2709,2711,2713,2715,2717],{"class":158,"line":199},[129,2693,631],{"class":598},[129,2695,634],{"class":162},[129,2697,2698],{"class":131}," VueFinalModal",[129,2700,486],{"class":162},[129,2702,2703],{"class":131}," useVfmAttrs",[129,2705,486],{"class":162},[129,2707,2708],{"class":131}," vueFinalModalProps",[129,2710,639],{"class":162},[129,2712,642],{"class":598},[129,2714,645],{"class":162},[129,2716,648],{"class":191},[129,2718,651],{"class":162},[129,2720,2721],{"class":158,"line":246},[129,2722,2724],{"emptyLinePlaceholder":2723},true,"\n",[129,2726,2727,2730,2733,2735,2738,2740],{"class":158,"line":269},[129,2728,2729],{"class":181},"const",[129,2731,2732],{"class":131}," props ",[129,2734,185],{"class":162},[129,2736,2737],{"class":2323}," defineProps",[129,2739,2270],{"class":131},[129,2741,2742],{"class":162},"{\n",[129,2744,2745,2748,2750],{"class":158,"line":295},[129,2746,2747],{"class":162},"  ...",[129,2749,2620],{"class":131},[129,2751,2752],{"class":162},",\n",[129,2754,2755,2758,2760,2762,2764,2766,2769,2771,2774,2776,2779],{"class":158,"line":305},[129,2756,2757],{"class":165},"  title",[129,2759,1704],{"class":162},[129,2761,634],{"class":162},[129,2763,602],{"class":165},[129,2765,1704],{"class":162},[129,2767,2768],{"class":131}," String",[129,2770,486],{"class":162},[129,2772,2773],{"class":165}," default",[129,2775,1704],{"class":162},[129,2777,2778],{"class":162}," ''",[129,2780,2781],{"class":162}," },\n",[129,2783,2784,2787],{"class":158,"line":325},[129,2785,2786],{"class":162},"}",[129,2788,2789],{"class":131},")\n",[129,2791,2792,2794,2797,2799,2802,2804,2807,2809],{"class":158,"line":345},[129,2793,2729],{"class":181},[129,2795,2796],{"class":131}," emit ",[129,2798,185],{"class":162},[129,2800,2801],{"class":2323}," defineEmits",[129,2803,132],{"class":162},[129,2805,2806],{"class":135},"VueFinalModalEmits",[129,2808,139],{"class":162},[129,2810,2811],{"class":131},"()\n",[129,2813,2814,2817,2819,2821,2824,2826,2828,2830],{"class":158,"line":357},[129,2815,2816],{"class":2323},"defineOptions",[129,2818,2270],{"class":131},[129,2820,1698],{"class":162},[129,2822,2823],{"class":165}," inheritAttrs",[129,2825,1704],{"class":162},[129,2827,528],{"class":527},[129,2829,639],{"class":162},[129,2831,2789],{"class":131},[129,2833,2834],{"class":158,"line":381},[129,2835,2724],{"emptyLinePlaceholder":2723},[129,2837,2838,2840,2843,2845,2847,2849,2851,2854,2856,2859,2861,2863,2865,2867,2869],{"class":158,"line":391},[129,2839,2729],{"class":181},[129,2841,2842],{"class":131}," vfmAttrs ",[129,2844,185],{"class":162},[129,2846,2703],{"class":2323},[129,2848,2270],{"class":131},[129,2850,1698],{"class":162},[129,2852,2853],{"class":131}," props",[129,2855,486],{"class":162},[129,2857,2858],{"class":165}," modalProps",[129,2860,1704],{"class":162},[129,2862,2708],{"class":131},[129,2864,486],{"class":162},[129,2866,2796],{"class":131},[129,2868,2786],{"class":162},[129,2870,2789],{"class":131},[129,2872,2873,2875,2877],{"class":158,"line":400},[129,2874,423],{"class":162},[129,2876,2652],{"class":165},[129,2878,169],{"class":162},[129,2880,2881],{"class":158,"line":410},[129,2882,2724],{"emptyLinePlaceholder":2723},[129,2884,2885,2887,2889],{"class":158,"line":420},[129,2886,132],{"class":162},[129,2888,166],{"class":165},[129,2890,169],{"class":162},[129,2892,2894,2896,2898,2900,2902,2904,2907,2909],{"class":158,"line":2893},16,[129,2895,175],{"class":162},[129,2897,136],{"class":165},[129,2899,255],{"class":181},[129,2901,185],{"class":162},[129,2903,188],{"class":162},[129,2905,2906],{"class":191},"vfmAttrs",[129,2908,188],{"class":162},[129,2910,169],{"class":162},[129,2912,2914,2916,2919,2921,2924,2926,2928],{"class":158,"line":2913},17,[129,2915,202],{"class":162},[129,2917,2918],{"class":165},"h1",[129,2920,139],{"class":162},[129,2922,2923],{"class":131},"{{ title }}",[129,2925,423],{"class":162},[129,2927,2918],{"class":165},[129,2929,169],{"class":162},[129,2931,2933,2935,2937],{"class":158,"line":2932},18,[129,2934,202],{"class":162},[129,2936,351],{"class":165},[129,2938,354],{"class":162},[129,2940,2942,2944,2946],{"class":158,"line":2941},19,[129,2943,413],{"class":162},[129,2945,136],{"class":165},[129,2947,169],{"class":162},[129,2949,2951,2953,2955],{"class":158,"line":2950},20,[129,2952,423],{"class":162},[129,2954,166],{"class":165},[129,2956,169],{"class":162},[119,2958,2959,2965,2966,2969,2970,2978,2979,2985],{},[123,2960,2961,2963],{"className":125,"language":126,"style":127},[129,2962,2626],{"class":2323},[129,2964,1774],{"class":131}," passes the modal props on, forwards the modal events through ",[123,2967,2968],{},"emit"," and lets every other attr fall through to ",[123,2971,2972,2974,2976],{"className":125,"language":126,"style":127},[129,2973,132],{"class":131},[129,2975,136],{"class":135},[129,2977,139],{"class":131},", including the listeners ",[123,2980,2981,2983],{"className":125,"language":126,"style":127},[129,2982,2447],{"class":2323},[129,2984,1774],{"class":131}," uses to know when the modal has opened or closed.",[2987,2988,2989],"style",{},"html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}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 .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .sfNiH, html code.shiki .sfNiH{--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC}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 .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 .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}",{"title":127,"searchDepth":172,"depth":172,"links":2991},[2992,2993,3018,3019,3020],{"id":116,"depth":172,"text":117},{"id":145,"depth":172,"text":430,"children":2994},[2995,2996,2997,2998,2999,3000,3001,3002,3003,3004,3005,3006,3007,3008,3009,3010,3011,3012,3013,3014,3015,3016,3017],{"id":434,"depth":199,"text":192},{"id":544,"depth":199,"text":545},{"id":661,"depth":199,"text":662},{"id":700,"depth":199,"text":701},{"id":822,"depth":199,"text":823},{"id":859,"depth":199,"text":860},{"id":928,"depth":199,"text":262},{"id":1044,"depth":199,"text":318},{"id":1143,"depth":199,"text":1144},{"id":1220,"depth":199,"text":1221},{"id":1286,"depth":199,"text":1287},{"id":1401,"depth":199,"text":1402},{"id":1505,"depth":199,"text":1506},{"id":1548,"depth":199,"text":1549},{"id":1590,"depth":199,"text":1590},{"id":1656,"depth":199,"text":1657},{"id":1788,"depth":199,"text":1789},{"id":1834,"depth":199,"text":1835},{"id":1903,"depth":199,"text":1904},{"id":2009,"depth":199,"text":2010},{"id":2121,"depth":199,"text":2121},{"id":2158,"depth":199,"text":2159},{"id":2211,"depth":199,"text":2212},{"id":2260,"depth":172,"text":2261},{"id":2484,"depth":172,"text":2485},{"id":2600,"depth":172,"text":3021},"Wrapping \u003CVueFinalModal>","md",null,{},{"title":46,"description":127},"t_44NtbjqXfYPFqhFcpaXsB8WjMtxwyaoGrrmk-EGoM",[3028,3030],{"title":29,"path":30,"stem":31,"description":3029,"children":-1},"The exported types in VueFinalModal.",{"title":50,"path":51,"stem":52,"description":3031,"children":-1},"A container for the dynamic modals created by useModal().",1791743377608]