vexip-ui/lib/components/ellipsis/ellipsis.vue2.cjs

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

"use strict";const e=require("vue");require("../tooltip/index.cjs");const a=require("@vexip-ui/config"),d=require("@vexip-ui/hooks"),T=require("@vexip-ui/utils"),y=require("./props.cjs"),k=require("../tooltip/tooltip.cjs"),H=e.defineComponent({name:"Ellipsis",__name:"ellipsis",props:y.ellipsisProps,setup(v,{expose:m}){const l=a.useNameHelper("ellipsis"),h=v,t=a.useProps("ellipsis",h,{placement:{default:"top",validator:r=>d.placementWhileList.includes(r)},transfer:"body",noHover:!1,transitionName:()=>l.ns("fade"),tooltipTheme:{default:"dark",validator:r=>["light","dark"].includes(r)},tipClass:null,maxLines:null,tipMaxWidth:500,tipDisabled:!1,tipShift:!1}),o=a.useHoverDelay(),s=e.ref(!1),u=e.ref(""),{timer:n}=d.useSetTimeout(),i=e.ref(),g=e.computed(()=>({[l.b()]:!0,[l.bm("inherit")]:t.inherit,[l.bm("multiple")]:t.maxLines})),x=e.computed(()=>t.maxLines>0?{"-webkit-line-clamp":t.maxLines}:""),b=e.computed(()=>({maxWidth:typeof t.tipMaxWidth=="string"?parseFloat(t.tipMaxWidth)||t.tipMaxWidth:`${t.tipMaxWidth}px`}));m({visible:s,wrapper:i});function p(){clearTimeout(n.hover),!t.tipDisabled&&(n.hover=setTimeout(()=>{if(!i.value||!i.value.childNodes.length){s.value=!1;return}if(t.maxLines>0){const r=i.value.scrollHeight,f=i.value.clientHeight;s.value=r>f}else s.value=T.getRangeWidth(i.value)>i.value.getBoundingClientRect().width;u.value=s.value?i.value.textContent??"":""},o.value))}function c(){clearTimeout(n.hover),!t.tipDisabled&&(n.hover=setTimeout(()=>{s.value=!1},o.value))}return(r,f)=>(e.openBlock(),e.createBlock(e.unref(k),{visible:s.value,trigger:"custom",disabled:e.unref(t).tipDisabled,transfer:e.unref(t).transfer,placement:e.unref(t).placement,"no-hover":e.unref(t).noHover,"transition-name":e.unref(t).transitionName,"tip-class":e.unref(t).tipClass,"tip-style":b.value,reverse:e.unref(t).tooltipTheme==="dark",shift:e.unref(t).tipShift,onTipEnter:p,onTipLeave:c},{trigger:e.withCtx(()=>[e.createElementVNode("div",e.mergeProps({ref_key:"wrapper",ref:i},r.$attrs,{class:g.value,style:x.value,onMouseenter:p,onMouseleave:c}),[e.renderSlot(r.$slots,"default")],16)]),default:e.withCtx(()=>[e.createTextVNode(" "+e.toDisplayString(u.value),1)]),_:3},8,["visible","disabled","transfer","placement","no-hover","transition-name","tip-class","tip-style","reverse","shift"]))}});module.exports=H;
//# sourceMappingURL=ellipsis.vue2.cjs.map