'message' support HTML template

Author: Leopoldthecoder

src/index.js

@@ -50,39 +50,41 @@ var MessageBoxConstructor = Vue.extend(msgboxVue);
 var currentMsg, instance;
 var msgQueue = [];
 
-var initInstance = function() {
-  instance = new MessageBoxConstructor({
-    el: document.createElement('div')
-  });
-
-  instance.callback = function(action) {
-    if (currentMsg) {
-      var callback = currentMsg.callback;
-      if (typeof callback === 'function') {
-        if (instance.showInput) {
-          callback(instance.inputValue, action);
-        } else {
-          callback(action);
-        }
+const defaultCallback = action => {
+  if (currentMsg) {
+    var callback = currentMsg.callback;
+    if (typeof callback === 'function') {
+      if (instance.showInput) {
+        callback(instance.inputValue, action);
+      } else {
+        callback(action);
       }
-      if (currentMsg.resolve) {
-        var $type = currentMsg.options.$type;
-        if ($type === 'confirm' || $type === 'prompt') {
-          if (action === 'confirm') {
-            if (instance.showInput) {
-              currentMsg.resolve({ value: instance.inputValue, action });
-            } else {
-              currentMsg.resolve(action);
-            }
-          } else if (action === 'cancel' && currentMsg.reject) {
-            currentMsg.reject(action);
+    }
+    if (currentMsg.resolve) {
+      var $type = currentMsg.options.$type;
+      if ($type === 'confirm' || $type === 'prompt') {
+        if (action === 'confirm') {
+          if (instance.showInput) {
+            currentMsg.resolve({ value: instance.inputValue, action });
+          } else {
+            currentMsg.resolve(action);
           }
-        } else {
-          currentMsg.resolve(action);
+        } else if (action === 'cancel' && currentMsg.reject) {
+          currentMsg.reject(action);
         }
+      } else {
+        currentMsg.resolve(action);
       }
     }
-  };
+  }
+};
+
+var initInstance = function() {
+  instance = new MessageBoxConstructor({
+    el: document.createElement('div')
+  });
+
+  instance.callback = defaultCallback;
 };
 
 var showNextMsg = function() {
@@ -100,6 +102,9 @@ var showNextMsg = function() {
           instance[prop] = options[prop];
         }
       }
+      if (options.callback === undefined) {
+        instance.callback = defaultCallback;
+      }
       ['modal', 'showClose', 'closeOnClickModal', 'closeOnPressEscape'].forEach(prop => {
         if (instance[prop] === undefined) {
           instance[prop] = true;

src/msgbox.vue

@@ -6,7 +6,7 @@
           <div class="mint-msgbox-title">{{ title }}</div>
         </div>
         <div class="mint-msgbox-content" v-if="message !== ''">
-          <div class="mint-msgbox-message"><p>{{ message }}</p></div>
+          <div class="mint-msgbox-message" v-html="message"></div>
           <div class="mint-msgbox-input" v-show="showInput">
             <input v-model="inputValue" :placeholder="inputPlaceholder" ref="input">
             <div class="mint-msgbox-errormsg" :style="{ visibility: !!editorErrorMessage ? 'visible' : 'hidden' }">{{ editorErrorMessage }}</div>