jiku-ui/lib/message-box.js

A Component Library for Vue.js.

module.exports=function(e){var t={};function n(o){if(t[o])return t[o].exports;var i=t[o]={i:o,l:!1,exports:{}};return e[o].call(i.exports,i,i.exports,n),i.l=!0,i.exports}return n.m=e,n.c=t,n.d=function(e,t,o){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:o})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var o=Object.create(null);if(n.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var i in e)n.d(o,i,function(t){return e[t]}.bind(null,i));return o},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=93)}({0:function(e,t,n){"use strict";function o(e,t,n,o,i,s,r,l){var a,u="function"==typeof e?e.options:e;if(t&&(u.render=t,u.staticRenderFns=n,u._compiled=!0),o&&(u.functional=!0),s&&(u._scopeId="data-v-"+s),r?(a=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),i&&i.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(r)},u._ssrRegister=a):i&&(a=l?function(){i.call(this,(u.functional?this.parent:this).$root.$options.shadowRoot)}:i),a)if(u.functional){u._injectStyles=a;var c=u.render;u.render=function(e,t){return a.call(t),c(e,t)}}else{var d=u.beforeCreate;u.beforeCreate=d?[].concat(d,a):[a]}return{exports:e,options:u}}n.d(t,"a",(function(){return o}))},11:function(e,t){e.exports=require("jiku-ui/lib/input")},14:function(e,t){e.exports=require("jiku-ui/lib/utils/popup")},19:function(e,t){e.exports=require("jiku-ui/lib/button")},2:function(e,t){e.exports=require("jiku-ui/lib/utils/dom")},20:function(e,t){e.exports=require("jiku-ui/lib/locale")},25:function(e,t){e.exports=require("jiku-ui/lib/utils/vdom")},52:function(e,t){e.exports=require("jiku-ui/lib/utils/aria-dialog")},6:function(e,t){e.exports=require("jiku-ui/lib/mixins/locale")},7:function(e,t){e.exports=require("vue")},9:function(e,t){e.exports=require("jiku-ui/lib/utils/merge")},93:function(e,t,n){"use strict";n.r(t);var o=n(7),i=n.n(o),s=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("transition",{attrs:{name:"msgbox-fade"}},[n("div",{directives:[{name:"show",rawName:"v-show",value:e.visible,expression:"visible"}],staticClass:"hn-message-box__wrapper",attrs:{tabindex:"-1",role:"dialog","aria-modal":"true","aria-label":e.title||"dialog"},on:{click:function(t){return t.target!==t.currentTarget?null:e.handleWrapperClick(t)}}},[n("div",{staticClass:"hn-message-box",class:[e.customClass,e.center&&"hn-message-box--center"]},[null!==e.title?n("div",{staticClass:"hn-message-box__header"},[n("div",{staticClass:"hn-message-box__title"},[e.icon&&e.center?n("div",{class:["hn-message-box__status",e.icon]}):e._e(),n("span",[e._v(e._s(e.title))])]),e.showClose?n("button",{staticClass:"hn-message-box__headerbtn",attrs:{type:"button","aria-label":"Close"},on:{click:function(t){return e.handleAction(e.distinguishCancelAndClose?"close":"cancel")},keydown:function(t){return!t.type.indexOf("key")&&e._k(t.keyCode,"enter",13,t.key,"Enter")?null:e.handleAction(e.distinguishCancelAndClose?"close":"cancel")}}},[n("i",{staticClass:"hn-message-box__close hn-icon-close"})]):e._e()]):e._e(),n("div",{staticClass:"hn-message-box__content"},[e.icon&&!e.center&&""!==e.message?n("div",{class:["hn-message-box__status",e.icon]}):e._e(),""!==e.message?n("div",{staticClass:"hn-message-box__message"},[e._t("default",[e.dangerouslyUseHTMLString?n("p",{domProps:{innerHTML:e._s(e.message)}}):n("p",[e._v(e._s(e.message))])])],2):e._e(),n("div",{directives:[{name:"show",rawName:"v-show",value:e.showInput,expression:"showInput"}],staticClass:"hn-message-box__input"},[n("hn-input",{ref:"input",attrs:{type:e.inputType,placeholder:e.inputPlaceholder},nativeOn:{keydown:function(t){return!t.type.indexOf("key")&&e._k(t.keyCode,"enter",13,t.key,"Enter")?null:e.handleInputEnter(t)}},model:{value:e.inputValue,callback:function(t){e.inputValue=t},expression:"inputValue"}}),n("div",{staticClass:"hn-message-box__errormsg",style:{visibility:e.editorErrorMessage?"visible":"hidden"}},[e._v(e._s(e.editorErrorMessage))])],1)]),n("div",{staticClass:"hn-message-box__btns"},[e.showCancelButton?n("hn-button",{class:[e.cancelButtonClasses],attrs:{loading:e.cancelButtonLoading,round:e.roundButton,size:"small"},on:{keydown:function(t){return!t.type.indexOf("key")&&e._k(t.keyCode,"enter",13,t.key,"Enter")?null:e.handleAction("cancel")}},nativeOn:{click:function(t){return e.handleAction("cancel")}}},[e._v("\n          "+e._s(e.cancelButtonText||e.t("hn.messagebox.cancel"))+"\n        ")]):e._e(),n("hn-button",{directives:[{name:"show",rawName:"v-show",value:e.showConfirmButton,expression:"showConfirmButton"}],ref:"confirm",class:[e.confirmButtonClasses],attrs:{loading:e.confirmButtonLoading,round:e.roundButton,size:"small"},on:{keydown:function(t){return!t.type.indexOf("key")&&e._k(t.keyCode,"enter",13,t.key,"Enter")?null:e.handleAction("confirm")}},nativeOn:{click:function(t){return e.handleAction("confirm")}}},[e._v("\n          "+e._s(e.confirmButtonText||e.t("hn.messagebox.confirm"))+"\n        ")])],1)])])])};s._withStripped=!0;var r=n(14),l=n.n(r),a=n(6),u=n.n(a),c=n(11),d=n.n(c),f=n(19),h=n.n(f),p=n(2),m=n(20),b=n(52),g=n.n(b),v=void 0,C={success:"success",info:"info",warning:"warning",error:"error"},y={mixins:[l.a,u.a],props:{modal:{default:!0},lockScroll:{default:!0},showClose:{type:Boolean,default:!0},closeOnClickModal:{default:!0},closeOnPressEscape:{default:!0},closeOnHashChange:{default:!0},center:{default:!1,type:Boolean},roundButton:{default:!1,type:Boolean}},components:{HnInput:d.a,HnButton:h.a},computed:{icon:function(){var e=this.type;return this.iconClass||(e&&C[e]?"hn-icon-"+C[e]:"")},confirmButtonClasses:function(){return"hn-button--primary "+this.confirmButtonClass},cancelButtonClasses:function(){return""+this.cancelButtonClass}},methods:{getSafeClose:function(){var e=this,t=this.uid;return function(){e.$nextTick((function(){t===e.uid&&e.doClose()}))}},doClose:function(){var e=this;this.visible&&(this.visible=!1,this._closing=!0,this.onClose&&this.onClose(),v.closeDialog(),this.lockScroll&&setTimeout(this.restoreBodyStyle,200),this.opened=!1,this.doAfterClose(),setTimeout((function(){e.action&&e.callback(e.action,e)})))},handleWrapperClick:function(){this.closeOnClickModal&&this.handleAction(this.distinguishCancelAndClose?"close":"cancel")},handleInputEnter:function(){if("textarea"!==this.inputType)return this.handleAction("confirm")},handleAction:function(e){("prompt"!==this.$type||"confirm"!==e||this.validate())&&(this.action=e,"function"==typeof this.beforeClose?(this.close=this.getSafeClose(),this.beforeClose(e,this,this.close)):this.doClose())},validate:function(){if("prompt"===this.$type){var e=this.inputPattern;if(e&&!e.test(this.inputValue||""))return this.editorErrorMessage=this.inputErrorMessage||Object(m.t)("hn.messagebox.error"),Object(p.addClass)(this.getInputElement(),"invalid"),!1;var t=this.inputValidator;if("function"==typeof t){var n=t(this.inputValue);if(!1===n)return this.editorErrorMessage=this.inputErrorMessage||Object(m.t)("hn.messagebox.error"),Object(p.addClass)(this.getInputElement(),"invalid"),!1;if("string"==typeof n)return this.editorErrorMessage=n,Object(p.addClass)(this.getInputElement(),"invalid"),!1}}return this.editorErrorMessage="",Object(p.removeClass)(this.getInputElement(),"invalid"),!0},getFirstFocus:function(){var e=this.$el.querySelector(".hn-message-box__btns .hn-button"),t=this.$el.querySelector(".hn-message-box__btns .hn-message-box__title");return e||t},getInputElement:function(){var e=this.$refs.input.$refs;return e.input||e.textarea},handleClose:function(){this.handleAction("close")}},watch:{inputValue:{immediate:!0,handler:function(e){var t=this;this.$nextTick((function(n){"prompt"===t.$type&&null!==e&&t.validate()}))}},visible:function(e){var t=this;e&&(this.uid++,"alert"!==this.$type&&"confirm"!==this.$type||this.$nextTick((function(){t.$refs.confirm.$el.focus()})),this.focusAfterClosed=document.activeElement,v=new g.a(this.$el,this.focusAfterClosed,this.getFirstFocus())),"prompt"===this.$type&&(e?setTimeout((function(){t.$refs.input&&t.$refs.input.$el&&t.getInputElement().focus()}),500):(this.editorErrorMessage="",Object(p.removeClass)(this.getInputElement(),"invalid")))}},mounted:function(){var e=this;this.$nextTick((function(){e.closeOnHashChange&&window.addEventListener("hashchange",e.close)}))},beforeDestroy:function(){this.closeOnHashChange&&window.removeEventListener("hashchange",this.close),setTimeout((function(){v.closeDialog()}))},data:function(){return{uid:1,title:void 0,message:"",type:"",iconClass:"",customClass:"",showInput:!1,inputValue:null,inputPlaceholder:"",inputType:"text",inputPattern:null,inputValidator:null,inputErrorMessage:"",showConfirmButton:!0,showCancelButton:!1,action:"",confirmButtonText:"",cancelButtonText:"",confirmButtonLoading:!1,cancelButtonLoading:!1,confirmButtonClass:"",confirmButtonDisabled:!1,cancelButtonClass:"",editorErrorMessage:null,callback:null,dangerouslyUseHTMLString:!1,focusAfterClosed:null,isOnComposition:!1,distinguishCancelAndClose:!1}}},_=n(0),x=Object(_.a)(y,s,[],!1,null,null,null);x.options.__file="packages/message-box/src/main.vue";var k=x.exports,w=n(9),B=n.n(w),O=n(25),E="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},$={title:null,message:"",type:"",iconClass:"",showInput:!1,showClose:!0,modalFade:!0,lockScroll:!0,closeOnClickModal:!0,closeOnPressEscape:!0,closeOnHashChange:!0,inputValue:null,inputPlaceholder:"",inputType:"text",inputPattern:null,inputValidator:null,inputErrorMessage:"",showConfirmButton:!0,showCancelButton:!1,confirmButtonPosition:"right",confirmButtonHighlight:!1,cancelButtonHighlight:!1,confirmButtonText:"",cancelButtonText:"",confirmButtonClass:"",cancelButtonClass:"",customClass:"",beforeClose:null,dangerouslyUseHTMLString:!1,center:!1,roundButton:!1,distinguishCancelAndClose:!1},T=i.a.extend(k),S=void 0,M=void 0,j=[],P=function(e){if(S){var t=S.callback;"function"==typeof t&&(M.showInput?t(M.inputValue,e):t(e)),S.resolve&&("confirm"===e?M.showInput?S.resolve({value:M.inputValue,action:e}):S.resolve(e):!S.reject||"cancel"!==e&&"close"!==e||S.reject(e))}},A=function e(){if(M||((M=new T({el:document.createElement("div")})).callback=P),M.action="",(!M.visible||M.closeTimer)&&j.length>0){var t=(S=j.shift()).options;for(var n in t)t.hasOwnProperty(n)&&(M[n]=t[n]);void 0===t.callback&&(M.callback=P);var o=M.callback;M.callback=function(t,n){o(t,n),e()},Object(O.isVNode)(M.message)?(M.$slots.default=[M.message],M.message=null):delete M.$slots.default,["modal","showClose","closeOnClickModal","closeOnPressEscape","closeOnHashChange"].forEach((function(e){void 0===M[e]&&(M[e]=!0)})),document.body.appendChild(M.$el),i.a.nextTick((function(){M.visible=!0}))}},I=function e(t,n){if(!i.a.prototype.$isServer){if("string"==typeof t||Object(O.isVNode)(t)?(t={message:t},"string"==typeof arguments[1]&&(t.title=arguments[1])):t.callback&&!n&&(n=t.callback),"undefined"!=typeof Promise)return new Promise((function(o,i){j.push({options:B()({},$,e.defaults,t),callback:n,resolve:o,reject:i}),A()}));j.push({options:B()({},$,e.defaults,t),callback:n}),A()}};I.setDefaults=function(e){I.defaults=e},I.alert=function(e,t,n){return"object"===(void 0===t?"undefined":E(t))?(n=t,t=""):void 0===t&&(t=""),I(B()({title:t,message:e,$type:"alert",closeOnPressEscape:!1,closeOnClickModal:!1},n))},I.confirm=function(e,t,n){return"object"===(void 0===t?"undefined":E(t))?(n=t,t=""):void 0===t&&(t=""),I(B()({title:t,message:e,$type:"confirm",showCancelButton:!0},n))},I.prompt=function(e,t,n){return"object"===(void 0===t?"undefined":E(t))?(n=t,t=""):void 0===t&&(t=""),I(B()({title:t,message:e,showCancelButton:!0,showInput:!0,$type:"prompt"},n))},I.close=function(){M.doClose(),M.visible=!1,j=[],S=null};var V=I;t.default=V}}).default;