vexip-ui/lib/components/video/video-volume.vue2.cjs

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

"use strict";const e=require("vue");require("../icon/index.cjs");require("../slider/index.cjs");const i=require("@vexip-ui/config");require("./video-control.vue.cjs");const g=require("./helper.cjs"),h=require("./symbol.cjs"),q=require("./video-control.vue2.cjs"),x=require("../icon/icon.cjs"),C=require("../slider/slider.vue2.cjs"),V=e.defineComponent({name:"VideoVolume",__name:"video-volume",props:{volume:{type:Number,default:1}},emits:["change"],setup(v,{expose:m,emit:p}){const a=v,s=p,o=i.useNameHelper("video"),r=i.useIcons(),_=e.inject(h.VIDEO_STATE),u=e.ref(a.volume),t=e.ref(!1),d=e.computed(()=>t.value?r.value.volumeMute:u.value<.5?r.value.volumeLow:r.value.volume);e.watch(()=>a.volume,l=>{u.value=l}),m({toggleMute:c});let n=u.value;function c(){t.value?u.value=n<=0?.5:n:(n=u.value,u.value=0),t.value=!t.value,s("change",u.value)}function f(l){l/=100,n=l,u.value=l,t.value=l<=0,s("change",u.value)}return(l,b)=>(e.openBlock(),e.createBlock(q,{class:e.normalizeClass(e.unref(o).be("volume")),type:"panel","tip-class":e.unref(o).be("volume-panel"),onClick:c},{panel:e.withCtx(()=>[e.createElementVNode("div",{class:e.normalizeClass(e.unref(o).be("volume-text"))},e.toDisplayString((u.value*100).toFixed()),3),e.createVNode(e.unref(C),{value:u.value*100,class:e.normalizeClass(e.unref(o).be("volume-slider")),min:0,max:100,vertical:"","hide-tip":"",reverse:"",range:!1,onInput:f},null,8,["value","class"])]),default:e.withCtx(()=>[e.createVNode(e.unref(x),e.normalizeProps(e.guardReactiveProps(e.unref(g.mergeIconScale)(e.unref(_).iconScale,d.value))),null,16)]),_:1},8,["class","tip-class"]))}});module.exports=V;
//# sourceMappingURL=video-volume.vue2.cjs.map