owntone-server/htdocs/assets/ControlDropdown.js
2023-12-14 20:00:28 +00:00

2 lines
1.2 KiB
JavaScript

import{_ as u,r as v,L as m,j as C,o as i,c as a,a as o,t as d,d as h,F as w,f,q as l}from"./index.js";const k={name:"ControlDropdown",props:["value","options"],emits:["update:value"],data(){return{is_active:!1}},computed:{option:{get(){return this.options.find(e=>e.id===this.value)}}},methods:{onClickOutside(e){this.is_active=!1},select(e){this.is_active=!1,this.$emit("update:value",e.id)}}},x={class:"dropdown-trigger"},g=["textContent"],D={id:"dropdown",class:"dropdown-menu",role:"menu"},y={class:"dropdown-content"},B=["onClick","textContent"];function b(e,c,r,z,s,n){const _=v("mdicon"),p=m("click-away");return C((i(),a("div",{class:l(["dropdown",{"is-active":s.is_active}])},[o("div",x,[o("button",{class:"button","aria-haspopup":"true","aria-controls":"dropdown",onClick:c[0]||(c[0]=t=>s.is_active=!s.is_active)},[o("span",{textContent:d(n.option.name)},null,8,g),h(_,{class:"icon",name:"chevron-down",size:"16"})])]),o("div",D,[o("div",y,[(i(!0),a(w,null,f(r.options,t=>(i(),a("a",{key:t.id,class:l(["dropdown-item",{"is-active":r.value===t.id}]),onClick:F=>n.select(t),textContent:d(t.name)},null,10,B))),128))])])],2)),[[p,n.onClickOutside]])}const N=u(k,[["render",b]]);export{N as C};