t-fighting-design/lib/button/src/index2.js

Fighting design can quickly build interactive interfaces in vue3 applications, which looks good.

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),f=require("../../svg-icon/index.js"),k=require("../../_components/svg/index8.js"),y=require("./index3.js"),h=require("../../_utils/index3.js"),B=require("../../_utils/index4.js"),I=require("../../_utils/index5.js"),z=["href","target"],v=["disabled","autofocus","name","type"],S=e.defineComponent({name:"FButton"}),F=e.defineComponent({...S,props:y.Props,setup(_){const l=_,d=e.ref(null),p=e.computed(()=>{const{type:o,round:r,simple:a,block:t,disabled:n,loading:s,bold:u,size:i,text:g,circle:C,color:c}=l;return["f-button",{[`f-button__${i}`]:i,[`f-button__${o}`]:!c,"f-button__disabled":n||s,"f-button__simple":a&&!c,"f-button__circle":C,"f-button__round":r,"f-button__block":t,"f-button__bold":u,"f-button__color":c,"f-button__text":g&&!c}]}),b=o=>{const{disabled:r,loading:a,ripples:t}=l;if(r||a){o.preventDefault();return}if(t){const{ripplesColor:n,simple:s,text:u,type:i}=l;new B.Ripples(o,d.value,{duration:700,component:"f-button",className:"f-button__ripples",ripplesColor:n,simple:s,text:u,type:i}).clickRipples()}l.click&&l.click(o)},m=e.computed(()=>{const{fontSize:o,fontColor:r,shadow:a,color:t}=l,n={"--f-button-font-size":h.sizeChange(o),"--f-button-font-color":r,"--f-button-box-shadow":a};if(t){const s=new I.ChangeColor(t),u=s.getLightColor(.4),i=s.getDarkColor(.2);n["--f-button-default-color"]=t,n["--f-button-hover-color"]=u,n["--f-button-active-color"]=i}return n});return(o,r)=>o.href?(e.openBlock(),e.createElementBlock("a",{key:0,ref_key:"FButton",ref:d,role:"button",tabindex:"0",class:e.normalizeClass(e.unref(p)),href:o.href,target:o.target,style:e.normalizeStyle(e.unref(m)),onClick:b},[o.loading||o.beforeIcon?(e.openBlock(),e.createBlock(e.unref(f.FSvgIcon),{key:0,class:e.normalizeClass(["f-button__before-icon",{"f-button__loading-animation":o.loading}]),icon:o.loading?o.loadingIcon||e.h(e.unref(k.default)):o.beforeIcon,size:16},null,8,["class","icon"])):e.createCommentVNode("",!0),e.renderSlot(o.$slots,"default"),o.afterIcon?(e.openBlock(),e.createBlock(e.unref(f.FSvgIcon),{key:1,icon:o.afterIcon,size:16},null,8,["icon"])):e.createCommentVNode("",!0)],14,z)):(e.openBlock(),e.createElementBlock("button",{key:1,ref_key:"FButton",ref:d,role:"button",tabindex:"0",class:e.normalizeClass(e.unref(p)),disabled:o.disabled||o.loading,autofocus:o.autofocus,name:o.name,type:o.nativeType,style:e.normalizeStyle(e.unref(m)),onClick:b},[o.loading||o.beforeIcon?(e.openBlock(),e.createBlock(e.unref(f.FSvgIcon),{key:0,class:e.normalizeClass(["f-button__before-icon",{"f-button__loading-animation":o.loading}]),icon:o.loading?o.loadingIcon||e.h(e.unref(k.default)):o.beforeIcon,size:16},null,8,["class","icon"])):e.createCommentVNode("",!0),e.renderSlot(o.$slots,"default"),o.afterIcon?(e.openBlock(),e.createBlock(e.unref(f.FSvgIcon),{key:1,icon:o.afterIcon,size:16},null,8,["icon"])):e.createCommentVNode("",!0)],14,v))}});exports.default=F;