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

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

"use strict";const e=require("vue");require("../option/index.cjs");require("../tooltip/index.cjs");const s=require("@vexip-ui/config"),E=require("@vexip-ui/utils"),g=require("./props.cjs"),B=require("./symbol.cjs"),S=require("../tooltip/tooltip.cjs"),V=require("../option/option.vue2.cjs"),$=e.defineComponent({name:"VideoControl",__name:"video-control",props:g.videoControlProps,setup(f){const v=f,t=s.useProps("videoControl",v,{type:"button",label:{static:!0,default:""},tipClass:null,disabled:!1,shortcut:{static:!0,default:""},focusable:!1,value:null,options:()=>[]}),r=s.useNameHelper("video"),c=e.inject(B.VIDEO_STATE),i=e.ref(t.value),b=e.computed(()=>({[r.be("control")]:!0,[r.bem("control",t.type)]:t.type!=="button",[r.bem("control","disabled")]:t.disabled})),m=e.computed(()=>t.type==="button"?r.be("control-tip"):r.be("control-panel")),d=e.computed(()=>t.options.map(n=>typeof n=="string"?{value:n}:n)),y=e.computed(()=>E.listToMap(d.value,"value",void 0,!0)),a=e.computed(()=>y.value.get(i.value));let u;e.watch(()=>t.shortcut,n=>{u==null||u(),n&&(u=c.addShortcut(n,p))},{immediate:!0}),e.onBeforeUnmount(()=>u==null?void 0:u());function p(){!t.disabled&&s.emitEvent(t.onClick)}function k(n){t.disabled||n.disabled||(i.value=n.value,s.emitEvent(t.onSelect,n))}return(n,o)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(b.value)},[e.createVNode(e.unref(S),{trigger:e.unref(t).focusable?"hover-focus":"hover",raw:"",shift:"",transfer:e.unref(c).placeId&&`#${e.unref(c).placeId}`,"tip-class":[m.value,e.unref(t).tipClass],"no-hover":e.unref(t).type==="button",disabled:e.unref(t).type==="button"?!e.unref(t).label:e.unref(t).disabled,onTipEnter:o[2]||(o[2]=l=>e.unref(s.emitEvent)(e.unref(t).onEnter)),onTipLeave:o[3]||(o[3]=l=>e.unref(s.emitEvent)(e.unref(t).onLeave))},{trigger:e.withCtx(()=>[e.createElementVNode("button",{class:e.normalizeClass(e.unref(r).be("control-button")),type:"button",onFocus:o[0]||(o[0]=l=>e.unref(s.emitEvent)(e.unref(t).onFocus,l)),onBlur:o[1]||(o[1]=l=>e.unref(s.emitEvent)(e.unref(t).onBlur,l)),onClick:p},[a.value?e.renderSlot(n.$slots,"selected",{key:0,option:a.value},()=>[e.createTextVNode(e.toDisplayString(a.value.selectedLabel||a.value.label||a.value.value),1)]):e.renderSlot(n.$slots,"default",{key:1})],34)]),default:e.withCtx(()=>[e.unref(t).type==="button"?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(e.unref(r).be("control-name"))},[e.renderSlot(n.$slots,"label",{},()=>[e.createTextVNode(e.toDisplayString(e.unref(t).label)+" ",1),e.unref(t).shortcut?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(e.unref(r).be("control-shortcut"))},e.toDisplayString(`(${e.unref(t).shortcut})`),3)):e.createCommentVNode("",!0)])],2)):e.renderSlot(n.$slots,"panel",{key:1},()=>[e.unref(t).type==="select"?(e.openBlock(),e.createElementBlock("ul",{key:0,class:e.normalizeClass(e.unref(r).be("control-options"))},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(d.value,(l,C)=>(e.openBlock(),e.createBlock(e.unref(V),{key:l.value,class:e.normalizeClass({[e.unref(r).be("control-option")]:!0,[e.unref(r).bem("control-option","selected")]:l.value===i.value}),label:l.label,value:l.value,disabled:l.disabled,divided:l.disabled,title:l.title,"no-hover":"",onSelect:h=>k(l)},{default:e.withCtx(()=>[e.renderSlot(n.$slots,"option",{option:l,index:C,selected:l.value===i.value},()=>[e.createTextVNode(e.toDisplayString(l.label||l.value),1)])]),_:2},1032,["class","label","value","disabled","divided","title","onSelect"]))),128))],2)):e.createCommentVNode("",!0)])]),_:3},8,["trigger","transfer","tip-class","no-hover","disabled"])],2))}});module.exports=$;
//# sourceMappingURL=video-control.vue2.cjs.map