rms-vue3-confirm-dialog
Version:
A VueJs(Vue3) component library for creating confirm dialog.
2 lines (1 loc) • 2.72 kB
JavaScript
(function(o,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(o=typeof globalThis<"u"?globalThis:o||self,e(o.ConfirmDialog={},o.Vue))})(this,function(o,e){"use strict";const d=(t,n)=>{const s=t.__vccOpts||t;for(const[i,l]of n)s[i]=l;return s},m={class:"rms-dialog-box-content box px-4 py-6"},f={class:"title"},u={class:"mb-4"},C={class:"buttons is-centered mt-6"},c=d({__name:"ConfirmDialog",props:{title:{type:String,default:""},message:{type:String,default:""},btnConfirmText:{type:String,default:"OK"},btnCancelText:{type:String,default:"Cancel"},onConfirm:{type:Function,required:!0},onCancel:{type:Function,required:!0},dialogBoxMinWidth:{type:String,default:"300px"},dialogBoxClasses:{type:String,default:" has-background-primary"},btnConfirmClasses:{type:String,default:" is-primary is-outlined"},btnCancelClasses:{type:String,default:" is-danger is-outlined"},showCloseIcon:{type:Boolean,default:!0},btnConfirmRes:{type:[String,Boolean],default:!0},btnCancelRes:{type:[String,Boolean],default:!1}},setup(t){const n=t;function s(){n.onConfirm(n.btnConfirmRes||!0)}function i(){n.onCancel(n.btnCancelRes||!1)}function l(){n.onCancel()}return(r,a)=>(e.openBlock(),e.createElementBlock("div",{class:"rms-dialog-overlay is-flex is-justify-content-center is-align-items-center",onClick:l},[e.createElementVNode("div",{class:e.normalizeClass("rms-dialog-box has-text-centered "+t.dialogBoxClasses),style:e.normalizeStyle({minWidth:t.dialogBoxMinWidth}),onClick:a[0]||(a[0]=e.withModifiers(()=>{},["stop"]))},[t.showCloseIcon?(e.openBlock(),e.createElementBlock("button",{key:0,class:"delete is-pulled-right m-2",onClick:i})):e.createCommentVNode("",!0),e.createElementVNode("div",m,[e.createElementVNode("h2",f,e.toDisplayString(t.title),1),e.createElementVNode("p",u,e.toDisplayString(t.message),1),e.createElementVNode("div",C,[e.createElementVNode("button",{onClick:i,class:e.normalizeClass("button "+t.btnCancelClasses)},e.toDisplayString(t.btnCancelText),3),e.createElementVNode("button",{onClick:s,class:e.normalizeClass("button "+t.btnConfirmClasses)},e.toDisplayString(t.btnConfirmText),3)])])],6)]))}},[["__scopeId","data-v-fb6cc521"]]);function g(t){return new Promise((n,s)=>{const i=document.createElement("div");document.body.appendChild(i);const l=e.createApp(c,{...t,onConfirm:a=>{n(a),r()},onCancel:a=>{n(a||null),r()}});l.mount(i);function r(){document.body.contains(i)&&(l.unmount(),document.body.removeChild(i))}})}const y={install(t){t.component("ConfirmDialog",c)}};o.ConfirmDialog=c,o.default=y,o.showDialog=g,Object.defineProperties(o,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});