https://multiplesclerosis.net/_nuxt/BdBj3Gkt.js

1import{_ as o,o as n,c as a,e as d,t as h,n as u,bJ as b,F as _,Z as M,a as f}from"./Bv6rD22K.js";const S={name:"MemberSearchResult",props:{user:{type:Object,required:!0},selected:{type:Boolean,default:!1}},data(){return{hover:!1}},computed:{userAvatarSrc(){return b(this.user.avatar)},imageAlt(){return this.user.username||""}},watch:{hover(e){e&&this.$emit("hover",this.user)}}},v=["aria-selected"],p=["src","alt"],x={class:"member-search-result__name"};function y(e,t,s,l,m,r){return n(),a("li",{class:u(["member-search-result",{"member-search-result--selected":s.selected}]),role:"option","aria-selected":s.selected?"true":"false",onClick:t[0]||(t[0]=i=>e.$emit("click",s.user)),onMouseover:t[1]||(t[1]=i=>m.hover=!0),onMouseleave:t[2]||(t[2]=i=>m.hover=!1)},[d("img",{class:"member-search-result__image",src:r.userAvatarSrc,alt:r.imageAlt},null,8,p),d("span",x,h(s.user.username),1)],42,v)}const k=Object.assign(o(S,[["render",y],["__scopeId","data-v-a04b85b3"]]),{__name:"MemberSearchResult"}),g={name:"MemberSearchList",props:{members:{type:Array,required:!0}},data(){return{selectedMember:{}}},computed:{selectedMemberIndex(){return this.members.findIndex(this.isSelectedMember)},firstMemberIsSelected(){return this.selectedMemberIndex===0},lastMemberIsSelected(){return this.selectedMemberIndex===this.members.length-1},noSelectedMember(){return Object.keys(this.selectedMember).length===0}},watch:{members(e){e&&([this.selectedMember]=e)}},mounted(){window.addEventListener("keydown",this.handleArrowKeys)},beforeUnmount(){window.removeEventListener("keydown",this.handleArrowKeys)},methods:{handleArrowKeys(e){if(this.members.length<=0)return;const t=40,s=38,l=13;e.keyCode===t&&(this.selectNext(),e.preventDefault()),e.keyCode===s&&(this.selectPrevious(),e.preventDefault()),e.keyCode===l&&(this.handleSubmit(),e.preventDefault())},selectNext(){if(this.lastMemberIsSelected){[this.selectedMember]=this.members;return}this.selectedMember=this.members[this.selectedMemberIndex+1]},selectPrevious(){if(this.firstMemberIsSelected){this.selectedMember=this.members[this.members.length-1];return}this.selectedMember=this.members[this.selectedMemberIndex-1]},selectMember(e){if(this.isSelectedMember(e))return;const t=this.members.findIndex(s=>s.id===e.id);this.selectedMember=this.members[t]},isSelectedMember(e){return e.id===this.selectedMember.id},handleSubmit(){this.noSelectedMember||this.$emit("memberSelected",this.selectedMember)}}},I={id:"member-search-list",class:"member-search-list list-reset",role:"listbox","aria-labelledby":"member-search-list"};function w(e,t,s,l,m,r){const i=k;return n(),a("ul",I,[(n(!0),a(_,null,M(s.members,c=>(n(),f(i,{key:`member-search${c.id}`,user:c,selected:r.isSelectedMember(c),onClick:r.handleSubmit,onHover:r.selectMember},null,8,["user","selected","onClick","onHover"]))),128))])}const O=Object.assign(o(g,[["render",w]]),{__name:"MemberSearchList"});export{O as _};