| blob | 29e0c5c51042e85b7cf7c45834769e57926e1bd7 |
1 "use strict";var de=Object.defineProperty,ce=Object.defineProperties;var fe=Object.getOwnPropertyDescriptors;var W=Object.getOwnPropertySymbols;var ve=Object.prototype.hasOwnProperty,ge=Object.prototype.propertyIsEnumerable;var z=(e,a,u)=>a in e?de(e,a,{enumerable:!0,configurable:!0,writable:!0,value:u}):e[a]=u,N=(e,a)=>{for(var u in a||(a={}))ve.call(a,u)&&z(e,u,a[u]);if(W)for(var u of W(a))ge.call(a,u)&&z(e,u,a[u]);return e},A=(e,a)=>ce(e,fe(a));var K=(e,a,u)=>new Promise((M,b)=>{var f=c=>{try{r(u.next(c))}catch(o){b(o)}},_=c=>{try{r(u.throw(c))}catch(o){b(o)}},r=c=>c.done?M(c.value):Promise.resolve(c.value).then(f,_);r((u=u.apply(e,a)).next())});const t=require("vue"),he=require("./CdxMenuItem.cjs"),me=require("./Icon.js"),pe=require("./CdxProgressBar.cjs"),Q=require("./useGeneratedId.cjs"),be=require("./useIntersectionObserver.cjs"),ye=require("./useSplitAttributes.cjs"),ke=require("./_plugin-vue_export-helper.js");function T(e){return e!==null&&Array.isArray(e)}function I(e){return"items"in e}const _e=t.defineComponent({name:"CdxMenu",components:{CdxMenuItem:he,CdxIcon:me.CdxIcon,CdxProgressBar:pe},inheritAttrs:!1,props:{menuItems:{type:Array,required:!0},footer:{type:Object,default:null},selected:{type:[String,Number,Array,null],required:!0},expanded:{type:Boolean,required:!0},showPending:{type:Boolean,default:!1},visibleItemLimit:{type:Number,default:null},showThumbnail:{type:Boolean,default:!1},boldLabel:{type:Boolean,default:!1},hideDescriptionOverflow:{type:Boolean,default:!1},searchQuery:{type:String,default:""},showNoResultsSlot:{type:Boolean,default:null}},emits:["update:selected","update:expanded","menu-item-click","menu-item-keyboard-navigation","load-more"],expose:["isExpanded","clearActive","getHighlightedMenuItem","getHighlightedViaKeyboard","getComputedMenuItems","delegateKeyNavigation"],setup(e,{emit:a,slots:u,attrs:M}){const b=t.computed(()=>{const l=e.footer&&e.menuItems?[...e.menuItems,e.footer]:e.menuItems,n=i=>A(N({},i),{id:Q("menu-item")});return l.map(i=>I(i)?A(N({},i),{id:Q("menu-group"),items:i.items.map(s=>n(s))}):n(i))}),f=t.computed(()=>{const l=[];return b.value.forEach(n=>{I(n)?l.push(...n.items):l.push(n)}),l}),_=t.computed(()=>u["no-results"]?e.showNoResultsSlot!==null?e.showNoResultsSlot:f.value.length===0:!1),r=t.ref(null),c=t.ref(!1),o=t.ref(null),L="additions removals";let d="",m=null;function H(){d="",m!==null&&(clearTimeout(m),m=null)}function R(){m!==null&&clearTimeout(m),m=setTimeout(H,1500)}function x(){var l;return(l=f.value.find(n=>T(e.selected)?e.selected.indexOf(n.value)!==-1:n.value===e.selected))!=null?l:null}const B=t.computed(()=>T(e.selected));function U(l){return T(e.selected)?e.selected.indexOf(l)!==-1:l===e.selected}function P(l){if(T(e.selected)){const n=e.selected.indexOf(l)===-1?e.selected.concat(l):e.selected.filter(i=>i!==l);a("update:selected",n)}else a("update:selected",l)}function g(l,n){if(!(n&&n.disabled))switch(l){case"selected":n&&P(n.value),B.value||a("update:expanded",!1),o.value=null;break;case"highlighted":r.value=n!=null?n:null,c.value=!1;break;case"highlightedViaKeyboard":r.value=n!=null?n:null,c.value=!0;break;case"active":o.value=n!=null?n:null;break}}const p=t.computed(()=>{if(r.value!==null)return f.value.findIndex(l=>l.value===r.value.value)});function $(l){l&&(g("highlightedViaKeyboard",l),a("menu-item-keyboard-navigation",l))}function q(l){var s;const n=k=>{for(let v=k-1;v>=0;v--)if(!f.value[v].disabled)return f.value[v]};l=l!=null?l:f.value.length;const i=(s=n(l))!=null?s:n(f.value.length);$(i)}function D(l){var s;const n=k=>f.value.find((v,V)=>!v.disabled&&V>k);l=l!=null?l:-1;const i=(s=n(l))!=null?s:n(-1);$(i)}function j(l){if(l.key==="Clear")return H(),!0;if(l.key==="Backspace")return d=d.slice(0,-1),R(),!0;if(l.key.length===1&&!l.metaKey&&!l.ctrlKey&&!l.altKey){if(e.expanded||a("update:expanded",!0),l.key===" "&&d.length<1)return!1;d+=l.key.toLowerCase();const n=d.length>1&&d.split("").every(v=>v===d[0]);let i=f.value,s=d;n&&p.value!==void 0&&(i=i.slice(p.value+1).concat(i.slice(0,p.value)),s=d[0]);const k=i.find(v=>{var V;return!v.disabled&&String((V=v.label)!=null?V:v.value).toLowerCase().startsWith(s)});return k&&(g("highlightedViaKeyboard",k),y()),R(),!0}return!1}function G(l,{prevent:n=!0,characterNavigation:i=!1}={}){if(i){if(j(l))return l.preventDefault(),!0;H()}function s(){n&&(l.preventDefault(),l.stopPropagation())}switch(l.key){case"Enter":case" ":return s(),e.expanded?(r.value&&c.value&&P(r.value.value),B.value||a("update:expanded",!1)):a("update:expanded",!0),!0;case"Tab":return e.expanded&&r.value&&c.value&&!B.value&&(P(r.value.value),a("update:expanded",!1)),!0;case"ArrowUp":return s(),e.expanded?(r.value===null&&g("highlightedViaKeyboard",x()),q(p.value)):a("update:expanded",!0),y(),!0;case"ArrowDown":return s(),e.expanded?(r.value===null&&g("highlightedViaKeyboard",x()),D(p.value)):a("update:expanded",!0),y(),!0;case"Home":return s(),e.expanded?(r.value===null&&g("highlightedViaKeyboard",x()),D()):a("update:expanded",!0),y(),!0;case"End":return s(),e.expanded?(r.value===null&&g("highlightedViaKeyboard",x()),q()):a("update:expanded",!0),y(),!0;case"Escape":return s(),a("update:expanded",!1),!0;default:return!1}}function O(){g("active",null)}const h=[],E=t.ref(void 0),J=be(E,{threshold:.8});t.watch(J,l=>{l&&a("load-more")});function X(l,n){if(l){h[n]=l.$el;const i=e.visibleItemLimit;if(!i||e.menuItems.length<i)return;const s=Math.min(i,Math.max(2,Math.floor(.2*e.menuItems.length)));n===e.menuItems.length-s&&(E.value=l.$el)}}const w=t.ref();function y(){const l=w.value&&w.value.scrollHeight>w.value.clientHeight;if(p.value===void 0||!l)return;const n=p.value>=0?p.value:0;h[n].scrollIntoView({behavior:"smooth",block:"nearest"})}const C=t.ref(null),S=t.ref(null);function F(){return K(this,null,function*(){yield t.nextTick(),Y(),Z(),yield t.nextTick(),y()})}function Y(){if(e.footer){const l=h[h.length-1];S.value=l.scrollHeight}else S.value=null}function Z(){if(!e.visibleItemLimit||h.length<=e.visibleItemLimit){C.value=null;return}const l=h[0].getBoundingClientRect().top,n=h[e.visibleItemLimit].getBoundingClientRect().top;C.value=n-l+2}function ee(l){return{"cdx-menu__group-wrapper--hide-label":!!l.hideLabel}}function te(l){return f.value.indexOf(l)}function le(l){var n,i;return N({selected:U(l.value),active:l.value===((n=o.value)==null?void 0:n.value),highlighted:l.value===((i=r.value)==null?void 0:i.value),showThumbnail:e.showThumbnail,boldLabel:e.boldLabel,hideDescriptionOverflow:e.hideDescriptionOverflow,searchQuery:e.searchQuery,multiselect:B.value},l)}function ne(l){return{change:(n,i)=>g(n,i?l:null),click:()=>a("menu-item-click",l)}}function ae(l){var n,i;return{menuItem:l,active:l.value===((n=o.value)==null?void 0:n.value)&&l.value===((i=r.value)==null?void 0:i.value)}}t.onMounted(()=>{document.addEventListener("mouseup",O)}),t.onUnmounted(()=>{document.removeEventListener("mouseup",O)}),t.watch(t.toRef(e,"expanded"),l=>K(this,null,function*(){if(l){const n=x();n&&!r.value&&g("highlighted",n),yield F()}else g("highlighted",null)})),t.watch(t.toRef(e,"menuItems"),l=>K(this,null,function*(){l.length<h.length&&(h.length=l.length),e.expanded&&(yield F())}),{deep:!0});const ie=t.computed(()=>({"max-height":C.value?"".concat(C.value,"px"):void 0,"margin-bottom":S.value?"".concat(S.value,"px"):void 0})),oe=t.computed(()=>({"cdx-menu--has-footer":!!e.footer})),{rootClasses:re,rootStyle:ue,otherAttrs:se}=ye(M,oe);return{listBoxStyle:ie,rootClasses:re,rootStyle:ue,otherAttrs:se,assignTemplateRef:X,computedMenuEntries:b,computedMenuItems:f,computedShowNoResultsSlot:_,highlightedMenuItem:r,highlightedViaKeyboard:c,handleMenuItemChange:g,handleKeyNavigation:G,ariaRelevant:L,isMultiselect:B,menuListbox:w,getGroupWrapperClasses:ee,getMenuItemIndex:te,getMenuItemBindings:le,getMenuItemHandlers:ne,getSlotBindings:ae,isMenuGroupData:I}},methods:{isExpanded(){return this.expanded},getHighlightedMenuItem(){return this.expanded?this.highlightedMenuItem:null},getHighlightedViaKeyboard(){return this.highlightedViaKeyboard},getComputedMenuItems(){return this.computedMenuItems},clearActive(){this.handleMenuItemChange("active",null)},delegateKeyNavigation(e,{prevent:a=!0,characterNavigation:u=!1}={}){return this.handleKeyNavigation(e,{prevent:a,characterNavigation:u})}}}),xe=["aria-live","aria-relevant","aria-multiselectable"],Be={key:0,class:"cdx-menu__pending cdx-menu-item"},Me={key:1,class:"cdx-menu__no-results cdx-menu-item",role:"option"},we=["aria-labelledby","aria-describedby"],Ce={class:"cdx-menu__group__meta"},Se={class:"cdx-menu__group__meta__text"},Ve=["id"],Ne=["id"];function Ke(e,a,u,M,b,f){const _=t.resolveComponent("cdx-icon"),r=t.resolveComponent("cdx-menu-item"),c=t.resolveComponent("cdx-progress-bar");return t.withDirectives((t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["cdx-menu",e.rootClasses]),style:t.normalizeStyle(e.rootStyle)},[t.createElementVNode("ul",t.mergeProps({ref:"menuListbox",class:"cdx-menu__listbox",role:"listbox",style:e.listBoxStyle,"aria-live":e.showPending?"polite":void 0,"aria-relevant":e.showPending?e.ariaRelevant:void 0,"aria-multiselectable":e.isMultiselect?!0:void 0},e.otherAttrs),[e.showPending&&e.computedMenuItems.length===0&&e.$slots.pending?(t.openBlock(),t.createElementBlock("li",Be,[t.renderSlot(e.$slots,"pending")])):t.createCommentVNode("v-if",!0),e.computedShowNoResultsSlot?(t.openBlock(),t.createElementBlock("li",Me,[t.renderSlot(e.$slots,"no-results")])):t.createCommentVNode("v-if",!0),(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.computedMenuEntries,(o,L)=>(t.openBlock(),t.createElementBlock(t.Fragment,{key:L},[e.isMenuGroupData(o)?(t.openBlock(),t.createElementBlock("li",{key:0,class:t.normalizeClass(["cdx-menu__group-wrapper",e.getGroupWrapperClasses(o)])},[t.createElementVNode("ul",{class:"cdx-menu__group",role:"group","aria-labelledby":o.id+"-label","aria-describedby":o.id+"-description"},[t.createElementVNode("span",Ce,[o.icon?(t.openBlock(),t.createBlock(_,{key:0,class:"cdx-menu__group__icon",icon:o.icon},null,8,["icon"])):t.createCommentVNode("v-if",!0),t.createElementVNode("span",Se,[t.createElementVNode("span",{id:o.id+"-label",class:"cdx-menu__group__label"},t.toDisplayString(o.label),9,Ve),o.description?(t.openBlock(),t.createElementBlock("span",{key:0,id:o.id+"-description",class:"cdx-menu__group__description"},t.toDisplayString(o.description),9,Ne)):t.createCommentVNode("v-if",!0)])]),(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(o.items,d=>(t.openBlock(),t.createBlock(r,t.mergeProps({key:d.value,ref_for:!0,ref:m=>e.assignTemplateRef(m,e.getMenuItemIndex(d)),class:"cdx-menu__group__item"},e.getMenuItemBindings(d),t.toHandlers(e.getMenuItemHandlers(d))),{default:t.withCtx(()=>[t.renderSlot(e.$slots,"default",t.mergeProps({ref_for:!0},e.getSlotBindings(d)))]),_:2},1040))),128))],8,we)],2)):(t.openBlock(),t.createBlock(r,t.mergeProps({key:1,ref_for:!0,ref:d=>e.assignTemplateRef(d,e.getMenuItemIndex(o))},e.getMenuItemBindings(o),t.toHandlers(e.getMenuItemHandlers(o))),{default:t.withCtx(()=>[t.renderSlot(e.$slots,"default",t.mergeProps({ref_for:!0},e.getSlotBindings(o)))]),_:2},1040))],64))),128)),e.showPending?(t.openBlock(),t.createBlock(c,{key:2,class:"cdx-menu__progress-bar",inline:!0})):t.createCommentVNode("v-if",!0)],16,xe)],6)),[[t.vShow,e.expanded]])}const Te=ke._export_sfc(_e,[["render",Ke]]);module.exports=Te;