UNPKG

vexip-ui

Version:

A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good

3 lines (2 loc) 4.63 kB
"use strict";const e=require("vue");require("../icon/index.cjs");require("../renderer/index.cjs");const o=require("@vexip-ui/config"),v=require("@vexip-ui/utils"),V=require("./props.cjs"),l=require("../renderer/renderer.cjs"),C=require("../icon/icon.cjs"),E=["aria-busy"],B=e.defineComponent({name:"Spin",__name:"spin",props:V.spinProps,setup(y,{expose:N}){const t=o.useNameHelper("spin"),h=y,r=o.useProps("spin",h,{active:{default:!1,static:!0},icon:o.createIconProp(),inner:!1,delay:!1,tip:"",hideMask:!1,maskColor:"",maskClass:null,transitionName:()=>t.ns("fade"),iconEffect:null,slots:()=>({})}),b=e.useSlots(),a=o.useIcons(),s=e.ref(r.active),i=e.computed(()=>!!(r.tip||b.tip)),d=e.computed(()=>{const n={};return r.maskColor&&(n[t.cv("mask-bg-color")]=r.maskColor),n}),m=e.computed(()=>{if(r.delay){if(r.delay===!0)return{enter:500,leave:500};if(typeof r.delay=="number")return{enter:r.delay,leave:r.delay};if(Array.isArray(r.delay))return{enter:v.toNumber(r.delay[0]),leave:v.toNumber(r.delay[1])}}return{enter:0,leave:0}});let p;e.watch(()=>r.active,n=>{clearTimeout(p);const f=n?m.value.enter:m.value.leave;f?p=setTimeout(()=>{s.value=n},f):s.value=n}),N({currentActive:s,hasTip:i,handleShow:c,handleHide:u});function k(n){o.emitEvent(r.onMaskClick,n)}function c(){o.emitEvent(r.onShow)}function u(){o.emitEvent(r.onHide)}return(n,f)=>e.unref(r).inner?(e.openBlock(),e.createBlock(e.Transition,{key:1,appear:"",name:e.unref(r).transitionName,onAfterEnter:c,onAfterLeave:u},{default:e.withCtx(()=>[s.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass([e.unref(t).b(),e.unref(t).bs("vars"),e.unref(t).bm("inner")])},[e.unref(r).hideMask?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass([e.unref(t).be("mask"),e.unref(r).maskClass]),style:e.normalizeStyle(d.value),onClick:k},null,6)),e.renderSlot(n.$slots,"content",{},()=>[e.createVNode(e.unref(l),{renderer:e.unref(r).slots.content},{default:e.withCtx(()=>[e.createElementVNode("div",{class:e.normalizeClass(e.unref(t).be("icon"))},[e.renderSlot(n.$slots,"icon",{},()=>[e.createVNode(e.unref(l),{renderer:e.unref(r).slots.icon},{default:e.withCtx(()=>[e.createVNode(e.unref(C),e.mergeProps(e.unref(a).loading,{icon:e.unref(r).icon||e.unref(a).loading.icon,effect:e.unref(r).iconEffect||e.unref(a).loading.effect,label:"loading"}),null,16,["icon","effect"])]),_:1},8,["renderer"])])],2),i.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(e.unref(t).be("tip"))},[e.renderSlot(n.$slots,"tip",{},()=>[e.createVNode(e.unref(l),{renderer:e.unref(r).slots.tip},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(r).tip),1)]),_:1},8,["renderer"])])],2)):e.createCommentVNode("",!0)]),_:3},8,["renderer"])])],2)):e.createCommentVNode("",!0)]),_:3},8,["name"])):(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass([e.unref(t).b(),e.unref(t).bs("vars"),e.unref(r).inherit&&e.unref(t).bm("inherit")]),"aria-busy":s.value?"true":void 0},[e.renderSlot(n.$slots,"default",{},()=>[e.createVNode(e.unref(l),{renderer:e.unref(r).slots.default},null,8,["renderer"])]),e.createVNode(e.Transition,{appear:"",name:e.unref(r).transitionName,onAfterEnter:c,onAfterLeave:u},{default:e.withCtx(()=>[s.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(e.unref(t).be("loading"))},[e.unref(r).hideMask?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass([e.unref(t).be("mask"),e.unref(r).maskClass]),style:e.normalizeStyle(d.value),onClick:k},null,6)),e.renderSlot(n.$slots,"content",{},()=>[e.createVNode(e.unref(l),{renderer:e.unref(r).slots.content},{default:e.withCtx(()=>[e.createElementVNode("div",{class:e.normalizeClass(e.unref(t).be("icon"))},[e.renderSlot(n.$slots,"icon",{},()=>[e.createVNode(e.unref(l),{renderer:e.unref(r).slots.icon},{default:e.withCtx(()=>[e.createVNode(e.unref(C),e.mergeProps(e.unref(a).loading,{icon:e.unref(r).icon||e.unref(a).loading.icon,effect:e.unref(r).iconEffect||e.unref(a).loading.effect,label:"loading"}),null,16,["icon","effect"])]),_:1},8,["renderer"])])],2),i.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(e.unref(t).be("tip"))},[e.renderSlot(n.$slots,"tip",{},()=>[e.createVNode(e.unref(l),{renderer:e.unref(r).slots.tip},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(r).tip),1)]),_:1},8,["renderer"])])],2)):e.createCommentVNode("",!0)]),_:3},8,["renderer"])])],2)):e.createCommentVNode("",!0)]),_:3},8,["name"])],10,E))}});module.exports=B; //# sourceMappingURL=spin.vue2.cjs.map