Merge branch 'dev' into next

Author: hunterliu1003

dist/VueFinalModal.esm.js

@@ -6,26 +6,24 @@
       content-class="modal-content"
       @before-close="e => e.stop()"
     >
-      <template>
-        <button class="modal__close" @click="showModal = false">
-          <mdi-close></mdi-close>
+      <button class="modal__close" @click="showModal = false">
+        <mdi-close></mdi-close>
+      </button>
+      <span class="modal__title">Hello, vue-final-modal</span>
+      <div class="modal__content">
+        <p v-for="i in 5" :key="i">
+          Vue Final Modal is a renderless, stackable, detachable and lightweight
+          modal component.
+        </p>
+      </div>
+      <div class="modal__action">
+        <button class="vfm-btn" @click="showModal = false">
+          confirm
         </button>
-        <span class="modal__title">Hello, vue-final-modal</span>
-        <div class="modal__content">
-          <p v-for="i in 5" :key="i">
-            Vue Final Modal is a renderless, stackable, detachable and
-            lightweight modal component.
-          </p>
-        </div>
-        <div class="modal__action">
-          <button class="vfm-btn" @click="showModal = false">
-            confirm
-          </button>
-          <button class="vfm-btn" @click="showModal = false">
-            cancel
-          </button>
-        </div>
-      </template>
+        <button class="vfm-btn" @click="showModal = false">
+          cancel
+        </button>
+      </div>
     </vue-final-modal>
     <button class="vfm-btn" @click="showModal = true">Open modal</button>
   </div>

dist/VueFinalModal.esm.js.map

@@ -6,26 +6,24 @@
       content-class="modal-content"
       @before-open="e => e.stop()"
     >
-      <template>
-        <button class="modal__close" @click="showModal = false">
-          <mdi-close></mdi-close>
+      <button class="modal__close" @click="showModal = false">
+        <mdi-close></mdi-close>
+      </button>
+      <span class="modal__title">Hello, vue-final-modal</span>
+      <div class="modal__content">
+        <p v-for="i in 5" :key="i">
+          Vue Final Modal is a renderless, stackable, detachable and lightweight
+          modal component.
+        </p>
+      </div>
+      <div class="modal__action">
+        <button class="vfm-btn" @click="showModal = false">
+          confirm
         </button>
-        <span class="modal__title">Hello, vue-final-modal</span>
-        <div class="modal__content">
-          <p v-for="i in 5" :key="i">
-            Vue Final Modal is a renderless, stackable, detachable and
-            lightweight modal component.
-          </p>
-        </div>
-        <div class="modal__action">
-          <button class="vfm-btn" @click="showModal = false">
-            confirm
-          </button>
-          <button class="vfm-btn" @click="showModal = false">
-            cancel
-          </button>
-        </div>
-      </template>
+        <button class="vfm-btn" @click="showModal = false">
+          cancel
+        </button>
+      </div>
     </vue-final-modal>
     <button class="vfm-btn" @click="showModal = true">Open modal</button>
   </div>

dist/VueFinalModal.umd.js

@@ -151,6 +151,9 @@ watch(
     }
     mounted()
     if (!value) {
+      if (emitEvent('before-close', true)) {
+        return
+      }
       close()
     }
   }
@@ -238,9 +241,6 @@ function mounted() {
   }
 }
 function close() {
-  if (emitEvent('before-close', true)) {
-    return
-  }
   if ($vfm.openedModals.length > 0) {
     // If there are still nested modals opened
     const $_vm = $vfm.openedModals[$vfm.openedModals.length - 1]