vexip-ui/lib/components/slider/slider-trigger.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 b=require("@vexip-ui/config"),y=require("@vexip-ui/hooks"),C=require("../tooltip/tooltip.cjs"),N=["aria-valuenow","aria-valuemin","aria-valuemax","aria-disabled"],S=e.defineComponent({name:"SliderTrigger",__name:"slider-trigger",props:{value:{type:Number,default:0},tipTransfer:{type:[Boolean,String],default:!1},hideTip:{type:Boolean,default:!1},vertical:{type:Boolean,default:!1},min:{type:Number,default:0},max:{type:Number,default:100},disabled:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},reverse:{type:Boolean,default:!1},sliding:{type:Boolean,default:!1},tipHover:{type:Boolean,default:!1},tipProps:{type:Object,default:()=>({})}},emits:["key-minus","key-plus"],setup(a,{expose:h,emit:g}){const u=a,f=g,i=b.useNameHelper("slider"),d=b.useHoverDelay(),r=e.ref(!1),n=e.ref(null),s=e.ref(),{timer:o}=y.useSetTimeout(),{target:T}=y.useModifier({passive:!1,onKeyDown:(t,l)=>{if(l.up||l.down||l.left||l.right){v(t);const m=t.ctrlKey?"ctrl":t.shiftKey?"shift":t.altKey?"alt":void 0;l.up||l.left?f("key-minus",m):f("key-plus",m)}}}),x=e.computed(()=>{var t;return[i.be("tip"),(t=u.tipProps)==null?void 0:t.tipClass]});h({updateTooltip:k,focus:w,blur:B});function c(){clearTimeout(o.hover),u.disabled||(o.hover=setTimeout(()=>{r.value=!0},d.value))}function p(){clearTimeout(o.hover),o.hover=setTimeout(()=>{r.value=!1},d.value)}function v(t){t.cancelable&&(t.stopPropagation(),t.preventDefault())}function k(){n.value&&n.value.updatePopper()}function w(t){var l;(l=s.value)==null||l.focus(t)}function B(){var t;(t=s.value)==null||t.blur()}return(t,l)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"wrapper",ref:T,class:e.normalizeClass(e.unref(i).be("trigger")),tabindex:"-1",onTouchstart:v},[e.createVNode(e.unref(C),e.mergeProps({ref_key:"tooltip",ref:n,placement:a.vertical?"right":"top"},a.tipProps,{trigger:"custom",transfer:a.tipTransfer,visible:r.value||a.sliding,"tip-class":x.value,disabled:a.hideTip,"no-hover":!a.tipHover,onTipEnter:c,onTipLeave:p}),{trigger:e.withCtx(()=>[e.createElementVNode("div",{ref_key:"handler",ref:s,class:e.normalizeClass({[e.unref(i).be("button")]:!0,[e.unref(i).bem("button","loading")]:a.loading,[e.unref(i).bem("button","sliding")]:a.sliding}),role:"slider",tabindex:"0","aria-valuenow":a.value,"aria-valuemin":a.min,"aria-valuemax":a.max,"aria-disabled":a.disabled,onMouseenter:c,onMouseleave:p},[e.renderSlot(t.$slots,"default",{},()=>[e.createElementVNode("div",{class:e.normalizeClass(e.unref(i).be("handler"))},null,2)])],42,N)]),default:e.withCtx(()=>[e.renderSlot(t.$slots,"tip",{},()=>[e.createTextVNode(e.toDisplayString(a.value),1)])]),_:3},16,["placement","transfer","visible","tip-class","disabled","no-hover"])],34))}});module.exports=S;
//# sourceMappingURL=slider-trigger.vue2.cjs.map