primevue 3.22.3 → 3.23.0

package/orderlist/orderlist.cjs.min.js

@@ -1 +1 @@
-"use strict";var e=require("primevue/button"),t=require("primevue/ripple"),i=require("primevue/utils"),n=require("vue");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=l(e),s=l(t),r={name:"OrderList",emits:["update:modelValue","reorder","update:selection","selection-change","focus","blur"],props:{modelValue:{type:Array,default:null},selection:{type:Array,default:null},dataKey:{type:String,default:null},listStyle:{type:null,default:null},metaKeySelection:{type:Boolean,default:!0},responsive:{type:Boolean,default:!0},breakpoint:{type:String,default:"960px"},stripedRows:{type:Boolean,default:!1},tabindex:{type:Number,default:0},listProps:{type:null,default:null},moveUpButtonProps:{type:null,default:null},moveTopButtonProps:{type:null,default:null},moveDownButtonProps:{type:null,default:null},moveBottomButtonProps:{type:null,default:null},"aria-labelledby":{type:String,default:null},"aria-label":{type:String,default:null}},itemTouched:!1,reorderDirection:null,styleElement:null,list:null,data(){return{d_selection:this.selection,focused:!1,focusedOptionIndex:-1}},beforeUnmount(){this.destroyStyle()},updated(){this.reorderDirection&&(this.updateListScroll(),this.reorderDirection=null)},mounted(){this.responsive&&this.createStyle()},methods:{getItemKey(e,t){return this.dataKey?i.ObjectUtils.resolveFieldData(e,this.dataKey):t},isSelected(e){return-1!=i.ObjectUtils.findIndexInList(e,this.d_selection)},onListFocus(e){const t=i.DomHandler.findSingle(this.list,"li.p-orderlist-item.p-highlight"),n=i.ObjectUtils.findIndexInList(t,this.list.children);this.focused=!0;const l=-1!==this.focusedOptionIndex?this.focusedOptionIndex:t?n:-1;this.changeFocusedOptionIndex(l),this.$emit("focus",e)},onListBlur(e){this.focused=!1,this.focusedOptionIndex=-1,this.$emit("blur",e)},onListKeyDown(e){switch(e.code){case"ArrowDown":this.onArrowDownKey(e);break;case"ArrowUp":this.onArrowUpKey(e);break;case"Home":this.onHomeKey(e);break;case"End":this.onEndKey(e);break;case"Enter":this.onEnterKey(e);break;case"Space":this.onSpaceKey(e);break;case"KeyA":e.ctrlKey&&(this.d_selection=[...this.modelValue],this.$emit("update:selection",this.d_selection))}},onOptionMouseDown(e){this.focused=!0,this.focusedOptionIndex=e},onArrowDownKey(e){const t=this.findNextOptionIndex(this.focusedOptionIndex);this.changeFocusedOptionIndex(t),e.shiftKey&&this.onEnterKey(e),e.preventDefault()},onArrowUpKey(e){const t=this.findPrevOptionIndex(this.focusedOptionIndex);this.changeFocusedOptionIndex(t),e.shiftKey&&this.onEnterKey(e),e.preventDefault()},onHomeKey(e){if(e.ctrlKey&&e.shiftKey){const e=i.DomHandler.find(this.list,"li.p-orderlist-item"),t=i.DomHandler.findSingle(this.list,`li.p-orderlist-item[id=${this.focusedOptionIndex}]`),n=[...e].findIndex((e=>e===t));this.d_selection=[...this.modelValue].slice(0,n+1),this.$emit("update:selection",this.d_selection)}else this.changeFocusedOptionIndex(0);e.preventDefault()},onEndKey(e){if(e.ctrlKey&&e.shiftKey){const e=i.DomHandler.find(this.list,"li.p-orderlist-item"),t=i.DomHandler.findSingle(this.list,`li.p-orderlist-item[id=${this.focusedOptionIndex}]`),n=[...e].findIndex((e=>e===t));this.d_selection=[...this.modelValue].slice(n,e.length),this.$emit("update:selection",this.d_selection)}else this.changeFocusedOptionIndex(i.DomHandler.find(this.list,"li.p-orderlist-item").length-1);e.preventDefault()},onEnterKey(e){const t=i.DomHandler.find(this.list,"li.p-orderlist-item"),n=i.DomHandler.findSingle(this.list,`li.p-orderlist-item[id=${this.focusedOptionIndex}]`),l=[...t].findIndex((e=>e===n));this.onItemClick(e,this.modelValue[l],l),e.preventDefault()},onSpaceKey(e){if(e.shiftKey){const e=i.DomHandler.find(this.list,"li.p-orderlist-item"),t=i.ObjectUtils.findIndexInList(this.d_selection[0],[...this.modelValue]),n=i.DomHandler.findSingle(this.list,`li.p-orderlist-item[id=${this.focusedOptionIndex}]`),l=[...e].findIndex((e=>e===n));this.d_selection=[...this.modelValue].slice(Math.min(t,l),Math.max(t,l)+1),this.$emit("update:selection",this.d_selection)}else this.onEnterKey(e)},findNextOptionIndex(e){const t=[...i.DomHandler.find(this.list,"li.p-orderlist-item")].findIndex((t=>t.id===e));return t>-1?t+1:0},findPrevOptionIndex(e){const t=[...i.DomHandler.find(this.list,"li.p-orderlist-item")].findIndex((t=>t.id===e));return t>-1?t-1:0},changeFocusedOptionIndex(e){const t=i.DomHandler.find(this.list,"li.p-orderlist-item");let n=e>=t.length?t.length-1:e<0?0:e;this.focusedOptionIndex=t[n].getAttribute("id"),this.scrollInView(t[n].getAttribute("id"))},scrollInView(e){const t=i.DomHandler.findSingle(this.list,`li[id="${e}"]`);t&&t.scrollIntoView&&t.scrollIntoView({block:"nearest",inline:"start"})},moveUp(e){if(this.d_selection){let t=[...this.modelValue];for(let e=0;e<this.d_selection.length;e++){let n=this.d_selection[e],l=i.ObjectUtils.findIndexInList(n,t);if(0===l)break;{let e=t[l],i=t[l-1];t[l-1]=e,t[l]=i}}this.reorderDirection="up",this.$emit("update:modelValue",t),this.$emit("reorder",{originalEvent:e,value:t,direction:this.reorderDirection})}},moveTop(e){if(this.d_selection){let t=[...this.modelValue];for(let e=0;e<this.d_selection.length;e++){let n=this.d_selection[e],l=i.ObjectUtils.findIndexInList(n,t);if(0===l)break;{let e=t.splice(l,1)[0];t.unshift(e)}}this.reorderDirection="top",this.$emit("update:modelValue",t),this.$emit("reorder",{originalEvent:e,value:t,direction:this.reorderDirection})}},moveDown(e){if(this.d_selection){let t=[...this.modelValue];for(let e=this.d_selection.length-1;e>=0;e--){let n=this.d_selection[e],l=i.ObjectUtils.findIndexInList(n,t);if(l===t.length-1)break;{let e=t[l],i=t[l+1];t[l+1]=e,t[l]=i}}this.reorderDirection="down",this.$emit("update:modelValue",t),this.$emit("reorder",{originalEvent:e,value:t,direction:this.reorderDirection})}},moveBottom(e){if(this.d_selection){let t=[...this.modelValue];for(let e=this.d_selection.length-1;e>=0;e--){let n=this.d_selection[e],l=i.ObjectUtils.findIndexInList(n,t);if(l===t.length-1)break;{let e=t.splice(l,1)[0];t.push(e)}}this.reorderDirection="bottom",this.$emit("update:modelValue",t),this.$emit("reorder",{originalEvent:e,value:t,direction:this.reorderDirection})}},onItemClick(e,t,n){this.itemTouched=!1;const l=i.ObjectUtils.findIndexInList(t,this.d_selection),o=-1!=l,s=!this.itemTouched&&this.metaKeySelection,r=i.DomHandler.find(this.list,".p-orderlist-item")[n].getAttribute("id");if(this.focusedOptionIndex=r,s){const s=e.metaKey||e.ctrlKey;o&&s?this.d_selection=this.d_selection.filter(((e,t)=>t!==l)):(this.d_selection=s&&this.d_selection?[...this.d_selection]:[],i.ObjectUtils.insertIntoOrderedArray(t,n,this.d_selection,this.modelValue))}else o?this.d_selection=this.d_selection.filter(((e,t)=>t!==l)):(this.d_selection=this.d_selection?[...this.d_selection]:[],i.ObjectUtils.insertIntoOrderedArray(t,n,this.d_selection,this.modelValue));this.$emit("update:selection",this.d_selection),this.$emit("selection-change",{originalEvent:e,value:this.d_selection})},onItemTouchEnd(){this.itemTouched=!0},findNextItem(e){let t=e.nextElementSibling;return t?i.DomHandler.hasClass(t,"p-orderlist-item")?t:this.findNextItem(t):null},findPrevItem(e){let t=e.previousElementSibling;return t?i.DomHandler.hasClass(t,"p-orderlist-item")?t:this.findPrevItem(t):null},findFirstItem(){return i.DomHandler.findSingle(this.list,".p-orderlist-item")},findLastItem(){const e=i.DomHandler.find(this.list,".p-orderlist-item");return e[e.length-1]},itemClass(e,t){return["p-orderlist-item",{"p-highlight":this.isSelected(e),"p-focus":t===this.focusedOptionId}]},updateListScroll(){const e=i.DomHandler.find(this.list,".p-orderlist-item.p-highlight");if(e&&e.length)switch(this.reorderDirection){case"up":i.DomHandler.scrollInView(this.list,e[0]);break;case"top":this.list.scrollTop=0;break;case"down":i.DomHandler.scrollInView(this.list,e[e.length-1]);break;case"bottom":this.list.scrollTop=this.list.scrollHeight}},createStyle(){if(!this.styleElement){this.$el.setAttribute(this.attributeSelector,""),this.styleElement=document.createElement("style"),this.styleElement.type="text/css",document.head.appendChild(this.styleElement);let e=`\n@media screen and (max-width: ${this.breakpoint}) {\n    .p-orderlist[${this.attributeSelector}] {\n        flex-direction: column;\n    }\n\n    .p-orderlist[${this.attributeSelector}] .p-orderlist-controls {\n        padding: var(--content-padding);\n        flex-direction: row;\n    }\n\n    .p-orderlist[${this.attributeSelector}] .p-orderlist-controls .p-button {\n        margin-right: var(--inline-spacing);\n        margin-bottom: 0;\n    }\n\n    .p-orderlist[${this.attributeSelector}] .p-orderlist-controls .p-button:last-child {\n        margin-right: 0;\n    }\n}\n`;this.styleElement.innerHTML=e}},destroyStyle(){this.styleElement&&(document.head.removeChild(this.styleElement),this.styleElement=null)},moveDisabled(){if(!this.d_selection||!this.d_selection.length)return!0},listRef(e){this.list=e?e.$el:void 0}},computed:{containerClass(){return["p-orderlist p-component",{"p-orderlist-striped":this.stripedRows}]},id(){return this.$attrs.id||i.UniqueComponentId()},attributeSelector:()=>i.UniqueComponentId(),focusedOptionId(){return-1!==this.focusedOptionIndex?this.focusedOptionIndex:null},moveUpAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.moveUp:void 0},moveTopAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.moveTop:void 0},moveDownAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.moveDown:void 0},moveBottomAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.moveBottom:void 0}},components:{OLButton:o.default},directives:{ripple:s.default}};const d={class:"p-orderlist-controls"},a={class:"p-orderlist-list-container"},c={key:0,class:"p-orderlist-header"},h=["id","onClick","aria-selected","onMousedown"];!function(e,t){void 0===t&&(t={});var i=t.insertAt;if(e&&"undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===i&&n.firstChild?n.insertBefore(l,n.firstChild):n.appendChild(l),l.styleSheet?l.styleSheet.cssText=e:l.appendChild(document.createTextNode(e))}}("\n.p-orderlist {\n    display: flex;\n}\n.p-orderlist-controls {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n}\n.p-orderlist-list-container {\n    flex: 1 1 auto;\n}\n.p-orderlist-list {\n    list-style-type: none;\n    margin: 0;\n    padding: 0;\n    overflow: auto;\n    min-height: 12rem;\n    max-height: 24rem;\n}\n.p-orderlist-item {\n    cursor: pointer;\n    overflow: hidden;\n    position: relative;\n}\n.p-orderlist.p-state-disabled .p-orderlist-item,\n.p-orderlist.p-state-disabled .p-button {\n    cursor: default;\n}\n.p-orderlist.p-state-disabled .p-orderlist-list {\n    overflow: hidden;\n}\n"),r.render=function(e,t,i,l,o,s){const r=n.resolveComponent("OLButton"),u=n.resolveDirective("ripple");return n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(s.containerClass)},[n.createElementVNode("div",d,[n.renderSlot(e.$slots,"controlsstart"),n.createVNode(r,n.mergeProps({type:"button",icon:"pi pi-angle-up",onClick:s.moveUp,"aria-label":s.moveUpAriaLabel,disabled:s.moveDisabled()},i.moveUpButtonProps),null,16,["onClick","aria-label","disabled"]),n.createVNode(r,n.mergeProps({type:"button",icon:"pi pi-angle-double-up",onClick:s.moveTop,"aria-label":s.moveTopAriaLabel,disabled:s.moveDisabled()},i.moveTopButtonProps),null,16,["onClick","aria-label","disabled"]),n.createVNode(r,n.mergeProps({type:"button",icon:"pi pi-angle-down",onClick:s.moveDown,"aria-label":s.moveDownAriaLabel,disabled:s.moveDisabled()},i.moveDownButtonProps),null,16,["onClick","aria-label","disabled"]),n.createVNode(r,n.mergeProps({type:"button",icon:"pi pi-angle-double-down",onClick:s.moveBottom,"aria-label":s.moveBottomAriaLabel,disabled:s.moveDisabled()},i.moveBottomButtonProps),null,16,["onClick","aria-label","disabled"]),n.renderSlot(e.$slots,"controlsend")]),n.createElementVNode("div",a,[e.$slots.header?(n.openBlock(),n.createElementBlock("div",c,[n.renderSlot(e.$slots,"header")])):n.createCommentVNode("",!0),n.createVNode(n.TransitionGroup,n.mergeProps({ref:s.listRef,id:s.id+"_list",name:"p-orderlist-flip",tag:"ul",class:"p-orderlist-list",style:i.listStyle,role:"listbox","aria-multiselectable":"true",tabindex:i.tabindex,"aria-activedescendant":o.focused?s.focusedOptionId:void 0,"aria-label":e.ariaLabel,"aria-labelledby":e.ariaLabelledby,onFocus:s.onListFocus,onBlur:s.onListBlur,onKeydown:s.onListKeyDown},i.listProps),{default:n.withCtx((()=>[(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(i.modelValue,((i,l)=>n.withDirectives((n.openBlock(),n.createElementBlock("li",{key:s.getItemKey(i,l),id:s.id+"_"+l,role:"option",class:n.normalizeClass(s.itemClass(i,`${s.id}_${l}`)),onClick:e=>s.onItemClick(e,i,l),onTouchend:t[0]||(t[0]=(...e)=>s.onItemTouchEnd&&s.onItemTouchEnd(...e)),"aria-selected":s.isSelected(i),onMousedown:e=>s.onOptionMouseDown(l)},[n.renderSlot(e.$slots,"item",{item:i,index:l})],42,h)),[[u]]))),128))])),_:3},16,["id","style","tabindex","aria-activedescendant","aria-label","aria-labelledby","onFocus","onBlur","onKeydown"])])],2)},module.exports=r;
+"use strict";var e=require("primevue/button"),t=require("primevue/ripple"),i=require("primevue/utils"),n=require("vue");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=l(e),s=l(t),r={name:"OrderList",emits:["update:modelValue","reorder","update:selection","selection-change","focus","blur"],props:{modelValue:{type:Array,default:null},selection:{type:Array,default:null},dataKey:{type:String,default:null},listStyle:{type:null,default:null},metaKeySelection:{type:Boolean,default:!0},responsive:{type:Boolean,default:!0},breakpoint:{type:String,default:"960px"},stripedRows:{type:Boolean,default:!1},tabindex:{type:Number,default:0},listProps:{type:null,default:null},moveUpButtonProps:{type:null,default:null},moveTopButtonProps:{type:null,default:null},moveDownButtonProps:{type:null,default:null},moveBottomButtonProps:{type:null,default:null},"aria-labelledby":{type:String,default:null},"aria-label":{type:String,default:null}},itemTouched:!1,reorderDirection:null,styleElement:null,list:null,data(){return{id:this.$attrs.id,d_selection:this.selection,focused:!1,focusedOptionIndex:-1}},watch:{"$attrs.id":function(e){this.id=e||i.UniqueComponentId()}},beforeUnmount(){this.destroyStyle()},updated(){this.reorderDirection&&(this.updateListScroll(),this.reorderDirection=null)},mounted(){this.id=this.id||i.UniqueComponentId(),this.responsive&&this.createStyle()},methods:{getItemKey(e,t){return this.dataKey?i.ObjectUtils.resolveFieldData(e,this.dataKey):t},isSelected(e){return-1!=i.ObjectUtils.findIndexInList(e,this.d_selection)},onListFocus(e){const t=i.DomHandler.findSingle(this.list,"li.p-orderlist-item.p-highlight"),n=i.ObjectUtils.findIndexInList(t,this.list.children);this.focused=!0;const l=-1!==this.focusedOptionIndex?this.focusedOptionIndex:t?n:-1;this.changeFocusedOptionIndex(l),this.$emit("focus",e)},onListBlur(e){this.focused=!1,this.focusedOptionIndex=-1,this.$emit("blur",e)},onListKeyDown(e){switch(e.code){case"ArrowDown":this.onArrowDownKey(e);break;case"ArrowUp":this.onArrowUpKey(e);break;case"Home":this.onHomeKey(e);break;case"End":this.onEndKey(e);break;case"Enter":this.onEnterKey(e);break;case"Space":this.onSpaceKey(e);break;case"KeyA":e.ctrlKey&&(this.d_selection=[...this.modelValue],this.$emit("update:selection",this.d_selection))}},onOptionMouseDown(e){this.focused=!0,this.focusedOptionIndex=e},onArrowDownKey(e){const t=this.findNextOptionIndex(this.focusedOptionIndex);this.changeFocusedOptionIndex(t),e.shiftKey&&this.onEnterKey(e),e.preventDefault()},onArrowUpKey(e){const t=this.findPrevOptionIndex(this.focusedOptionIndex);this.changeFocusedOptionIndex(t),e.shiftKey&&this.onEnterKey(e),e.preventDefault()},onHomeKey(e){if(e.ctrlKey&&e.shiftKey){const e=i.DomHandler.find(this.list,"li.p-orderlist-item"),t=i.DomHandler.findSingle(this.list,`li.p-orderlist-item[id=${this.focusedOptionIndex}]`),n=[...e].findIndex((e=>e===t));this.d_selection=[...this.modelValue].slice(0,n+1),this.$emit("update:selection",this.d_selection)}else this.changeFocusedOptionIndex(0);e.preventDefault()},onEndKey(e){if(e.ctrlKey&&e.shiftKey){const e=i.DomHandler.find(this.list,"li.p-orderlist-item"),t=i.DomHandler.findSingle(this.list,`li.p-orderlist-item[id=${this.focusedOptionIndex}]`),n=[...e].findIndex((e=>e===t));this.d_selection=[...this.modelValue].slice(n,e.length),this.$emit("update:selection",this.d_selection)}else this.changeFocusedOptionIndex(i.DomHandler.find(this.list,"li.p-orderlist-item").length-1);e.preventDefault()},onEnterKey(e){const t=i.DomHandler.find(this.list,"li.p-orderlist-item"),n=i.DomHandler.findSingle(this.list,`li.p-orderlist-item[id=${this.focusedOptionIndex}]`),l=[...t].findIndex((e=>e===n));this.onItemClick(e,this.modelValue[l],l),e.preventDefault()},onSpaceKey(e){if(e.shiftKey){const e=i.DomHandler.find(this.list,"li.p-orderlist-item"),t=i.ObjectUtils.findIndexInList(this.d_selection[0],[...this.modelValue]),n=i.DomHandler.findSingle(this.list,`li.p-orderlist-item[id=${this.focusedOptionIndex}]`),l=[...e].findIndex((e=>e===n));this.d_selection=[...this.modelValue].slice(Math.min(t,l),Math.max(t,l)+1),this.$emit("update:selection",this.d_selection)}else this.onEnterKey(e)},findNextOptionIndex(e){const t=[...i.DomHandler.find(this.list,"li.p-orderlist-item")].findIndex((t=>t.id===e));return t>-1?t+1:0},findPrevOptionIndex(e){const t=[...i.DomHandler.find(this.list,"li.p-orderlist-item")].findIndex((t=>t.id===e));return t>-1?t-1:0},changeFocusedOptionIndex(e){const t=i.DomHandler.find(this.list,"li.p-orderlist-item");let n=e>=t.length?t.length-1:e<0?0:e;this.focusedOptionIndex=t[n].getAttribute("id"),this.scrollInView(t[n].getAttribute("id"))},scrollInView(e){const t=i.DomHandler.findSingle(this.list,`li[id="${e}"]`);t&&t.scrollIntoView&&t.scrollIntoView({block:"nearest",inline:"start"})},moveUp(e){if(this.d_selection){let t=[...this.modelValue];for(let e=0;e<this.d_selection.length;e++){let n=this.d_selection[e],l=i.ObjectUtils.findIndexInList(n,t);if(0===l)break;{let e=t[l],i=t[l-1];t[l-1]=e,t[l]=i}}this.reorderDirection="up",this.$emit("update:modelValue",t),this.$emit("reorder",{originalEvent:e,value:t,direction:this.reorderDirection})}},moveTop(e){if(this.d_selection){let t=[...this.modelValue];for(let e=0;e<this.d_selection.length;e++){let n=this.d_selection[e],l=i.ObjectUtils.findIndexInList(n,t);if(0===l)break;{let e=t.splice(l,1)[0];t.unshift(e)}}this.reorderDirection="top",this.$emit("update:modelValue",t),this.$emit("reorder",{originalEvent:e,value:t,direction:this.reorderDirection})}},moveDown(e){if(this.d_selection){let t=[...this.modelValue];for(let e=this.d_selection.length-1;e>=0;e--){let n=this.d_selection[e],l=i.ObjectUtils.findIndexInList(n,t);if(l===t.length-1)break;{let e=t[l],i=t[l+1];t[l+1]=e,t[l]=i}}this.reorderDirection="down",this.$emit("update:modelValue",t),this.$emit("reorder",{originalEvent:e,value:t,direction:this.reorderDirection})}},moveBottom(e){if(this.d_selection){let t=[...this.modelValue];for(let e=this.d_selection.length-1;e>=0;e--){let n=this.d_selection[e],l=i.ObjectUtils.findIndexInList(n,t);if(l===t.length-1)break;{let e=t.splice(l,1)[0];t.push(e)}}this.reorderDirection="bottom",this.$emit("update:modelValue",t),this.$emit("reorder",{originalEvent:e,value:t,direction:this.reorderDirection})}},onItemClick(e,t,n){this.itemTouched=!1;const l=i.ObjectUtils.findIndexInList(t,this.d_selection),o=-1!=l,s=!this.itemTouched&&this.metaKeySelection,r=i.DomHandler.find(this.list,".p-orderlist-item")[n].getAttribute("id");if(this.focusedOptionIndex=r,s){const s=e.metaKey||e.ctrlKey;o&&s?this.d_selection=this.d_selection.filter(((e,t)=>t!==l)):(this.d_selection=s&&this.d_selection?[...this.d_selection]:[],i.ObjectUtils.insertIntoOrderedArray(t,n,this.d_selection,this.modelValue))}else o?this.d_selection=this.d_selection.filter(((e,t)=>t!==l)):(this.d_selection=this.d_selection?[...this.d_selection]:[],i.ObjectUtils.insertIntoOrderedArray(t,n,this.d_selection,this.modelValue));this.$emit("update:selection",this.d_selection),this.$emit("selection-change",{originalEvent:e,value:this.d_selection})},onItemTouchEnd(){this.itemTouched=!0},findNextItem(e){let t=e.nextElementSibling;return t?i.DomHandler.hasClass(t,"p-orderlist-item")?t:this.findNextItem(t):null},findPrevItem(e){let t=e.previousElementSibling;return t?i.DomHandler.hasClass(t,"p-orderlist-item")?t:this.findPrevItem(t):null},findFirstItem(){return i.DomHandler.findSingle(this.list,".p-orderlist-item")},findLastItem(){const e=i.DomHandler.find(this.list,".p-orderlist-item");return e[e.length-1]},itemClass(e,t){return["p-orderlist-item",{"p-highlight":this.isSelected(e),"p-focus":t===this.focusedOptionId}]},updateListScroll(){const e=i.DomHandler.find(this.list,".p-orderlist-item.p-highlight");if(e&&e.length)switch(this.reorderDirection){case"up":i.DomHandler.scrollInView(this.list,e[0]);break;case"top":this.list.scrollTop=0;break;case"down":i.DomHandler.scrollInView(this.list,e[e.length-1]);break;case"bottom":this.list.scrollTop=this.list.scrollHeight}},createStyle(){if(!this.styleElement){this.$el.setAttribute(this.attributeSelector,""),this.styleElement=document.createElement("style"),this.styleElement.type="text/css",document.head.appendChild(this.styleElement);let e=`\n@media screen and (max-width: ${this.breakpoint}) {\n    .p-orderlist[${this.attributeSelector}] {\n        flex-direction: column;\n    }\n\n    .p-orderlist[${this.attributeSelector}] .p-orderlist-controls {\n        padding: var(--content-padding);\n        flex-direction: row;\n    }\n\n    .p-orderlist[${this.attributeSelector}] .p-orderlist-controls .p-button {\n        margin-right: var(--inline-spacing);\n        margin-bottom: 0;\n    }\n\n    .p-orderlist[${this.attributeSelector}] .p-orderlist-controls .p-button:last-child {\n        margin-right: 0;\n    }\n}\n`;this.styleElement.innerHTML=e}},destroyStyle(){this.styleElement&&(document.head.removeChild(this.styleElement),this.styleElement=null)},moveDisabled(){if(!this.d_selection||!this.d_selection.length)return!0},listRef(e){this.list=e?e.$el:void 0}},computed:{containerClass(){return["p-orderlist p-component",{"p-orderlist-striped":this.stripedRows}]},attributeSelector:()=>i.UniqueComponentId(),focusedOptionId(){return-1!==this.focusedOptionIndex?this.focusedOptionIndex:null},moveUpAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.moveUp:void 0},moveTopAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.moveTop:void 0},moveDownAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.moveDown:void 0},moveBottomAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.moveBottom:void 0}},components:{OLButton:o.default},directives:{ripple:s.default}};const d={class:"p-orderlist-controls"},a={class:"p-orderlist-list-container"},c={key:0,class:"p-orderlist-header"},h=["id","onClick","aria-selected","onMousedown"];!function(e,t){void 0===t&&(t={});var i=t.insertAt;if(e&&"undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===i&&n.firstChild?n.insertBefore(l,n.firstChild):n.appendChild(l),l.styleSheet?l.styleSheet.cssText=e:l.appendChild(document.createTextNode(e))}}("\n.p-orderlist {\n    display: flex;\n}\n.p-orderlist-controls {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n}\n.p-orderlist-list-container {\n    flex: 1 1 auto;\n}\n.p-orderlist-list {\n    list-style-type: none;\n    margin: 0;\n    padding: 0;\n    overflow: auto;\n    min-height: 12rem;\n    max-height: 24rem;\n}\n.p-orderlist-item {\n    cursor: pointer;\n    overflow: hidden;\n    position: relative;\n}\n.p-orderlist.p-state-disabled .p-orderlist-item,\n.p-orderlist.p-state-disabled .p-button {\n    cursor: default;\n}\n.p-orderlist.p-state-disabled .p-orderlist-list {\n    overflow: hidden;\n}\n"),r.render=function(e,t,i,l,o,s){const r=n.resolveComponent("OLButton"),u=n.resolveDirective("ripple");return n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(s.containerClass)},[n.createElementVNode("div",d,[n.renderSlot(e.$slots,"controlsstart"),n.createVNode(r,n.mergeProps({type:"button",icon:"pi pi-angle-up",onClick:s.moveUp,"aria-label":s.moveUpAriaLabel,disabled:s.moveDisabled()},i.moveUpButtonProps),null,16,["onClick","aria-label","disabled"]),n.createVNode(r,n.mergeProps({type:"button",icon:"pi pi-angle-double-up",onClick:s.moveTop,"aria-label":s.moveTopAriaLabel,disabled:s.moveDisabled()},i.moveTopButtonProps),null,16,["onClick","aria-label","disabled"]),n.createVNode(r,n.mergeProps({type:"button",icon:"pi pi-angle-down",onClick:s.moveDown,"aria-label":s.moveDownAriaLabel,disabled:s.moveDisabled()},i.moveDownButtonProps),null,16,["onClick","aria-label","disabled"]),n.createVNode(r,n.mergeProps({type:"button",icon:"pi pi-angle-double-down",onClick:s.moveBottom,"aria-label":s.moveBottomAriaLabel,disabled:s.moveDisabled()},i.moveBottomButtonProps),null,16,["onClick","aria-label","disabled"]),n.renderSlot(e.$slots,"controlsend")]),n.createElementVNode("div",a,[e.$slots.header?(n.openBlock(),n.createElementBlock("div",c,[n.renderSlot(e.$slots,"header")])):n.createCommentVNode("",!0),n.createVNode(n.TransitionGroup,n.mergeProps({ref:s.listRef,id:o.id+"_list",name:"p-orderlist-flip",tag:"ul",class:"p-orderlist-list",style:i.listStyle,role:"listbox","aria-multiselectable":"true",tabindex:i.tabindex,"aria-activedescendant":o.focused?s.focusedOptionId:void 0,"aria-label":e.ariaLabel,"aria-labelledby":e.ariaLabelledby,onFocus:s.onListFocus,onBlur:s.onListBlur,onKeydown:s.onListKeyDown},i.listProps),{default:n.withCtx((()=>[(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(i.modelValue,((i,l)=>n.withDirectives((n.openBlock(),n.createElementBlock("li",{key:s.getItemKey(i,l),id:o.id+"_"+l,role:"option",class:n.normalizeClass(s.itemClass(i,`${o.id}_${l}`)),onClick:e=>s.onItemClick(e,i,l),onTouchend:t[0]||(t[0]=(...e)=>s.onItemTouchEnd&&s.onItemTouchEnd(...e)),"aria-selected":s.isSelected(i),onMousedown:e=>s.onOptionMouseDown(l)},[n.renderSlot(e.$slots,"item",{item:i,index:l})],42,h)),[[u]]))),128))])),_:3},16,["id","style","tabindex","aria-activedescendant","aria-label","aria-labelledby","onFocus","onBlur","onKeydown"])])],2)},module.exports=r;

package/orderlist/orderlist.esm.js

@@ -1,6 +1,6 @@
 import Button from 'primevue/button';
 import Ripple from 'primevue/ripple';
-import { ObjectUtils, DomHandler, UniqueComponentId } from 'primevue/utils';
+import { UniqueComponentId, ObjectUtils, DomHandler } from 'primevue/utils';
 import { resolveComponent, resolveDirective, openBlock, createElementBlock, normalizeClass, createElementVNode, renderSlot, createVNode, mergeProps, createCommentVNode, TransitionGroup, withCtx, Fragment, renderList, withDirectives } from 'vue';
 
 var script = {
@@ -78,11 +78,17 @@ var script = {
     list: null,
     data() {
         return {
+            id: this.$attrs.id,
             d_selection: this.selection,
             focused: false,
             focusedOptionIndex: -1
         };
     },
+    watch: {
+        '$attrs.id': function (newValue) {
+            this.id = newValue || UniqueComponentId();
+        }
+    },
     beforeUnmount() {
         this.destroyStyle();
     },
@@ -93,6 +99,8 @@ var script = {
         }
     },
     mounted() {
+        this.id = this.id || UniqueComponentId();
+
         if (this.responsive) {
             this.createStyle();
         }
@@ -502,9 +510,6 @@ var script = {
                 }
             ];
         },
-        id() {
-            return this.$attrs.id || UniqueComponentId();
-        },
         attributeSelector() {
             return UniqueComponentId();
         },
@@ -587,7 +592,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         : createCommentVNode("", true),
       createVNode(TransitionGroup, mergeProps({
         ref: $options.listRef,
-        id: $options.id + '_list',
+        id: $data.id + '_list',
         name: "p-orderlist-flip",
         tag: "ul",
         class: "p-orderlist-list",
@@ -606,9 +611,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
           (openBlock(true), createElementBlock(Fragment, null, renderList($props.modelValue, (item, i) => {
             return withDirectives((openBlock(), createElementBlock("li", {
               key: $options.getItemKey(item, i),
-              id: $options.id + '_' + i,
+              id: $data.id + '_' + i,
               role: "option",
-              class: normalizeClass($options.itemClass(item, `${$options.id}_${i}`)),
+              class: normalizeClass($options.itemClass(item, `${$data.id}_${i}`)),
               onClick: $event => ($options.onItemClick($event, item, i)),
               onTouchend: _cache[0] || (_cache[0] = (...args) => ($options.onItemTouchEnd && $options.onItemTouchEnd(...args))),
               "aria-selected": $options.isSelected(item),

package/orderlist/orderlist.esm.min.js

@@ -1 +1 @@
-import e from"primevue/button";import t from"primevue/ripple";import{ObjectUtils as i,DomHandler as n,UniqueComponentId as l}from"primevue/utils";import{resolveComponent as o,resolveDirective as s,openBlock as r,createElementBlock as d,normalizeClass as a,createElementVNode as c,renderSlot as h,createVNode as u,mergeProps as p,createCommentVNode as m,TransitionGroup as f,withCtx as y,Fragment as b,renderList as v,withDirectives as g}from"vue";var I={name:"OrderList",emits:["update:modelValue","reorder","update:selection","selection-change","focus","blur"],props:{modelValue:{type:Array,default:null},selection:{type:Array,default:null},dataKey:{type:String,default:null},listStyle:{type:null,default:null},metaKeySelection:{type:Boolean,default:!0},responsive:{type:Boolean,default:!0},breakpoint:{type:String,default:"960px"},stripedRows:{type:Boolean,default:!1},tabindex:{type:Number,default:0},listProps:{type:null,default:null},moveUpButtonProps:{type:null,default:null},moveTopButtonProps:{type:null,default:null},moveDownButtonProps:{type:null,default:null},moveBottomButtonProps:{type:null,default:null},"aria-labelledby":{type:String,default:null},"aria-label":{type:String,default:null}},itemTouched:!1,reorderDirection:null,styleElement:null,list:null,data(){return{d_selection:this.selection,focused:!1,focusedOptionIndex:-1}},beforeUnmount(){this.destroyStyle()},updated(){this.reorderDirection&&(this.updateListScroll(),this.reorderDirection=null)},mounted(){this.responsive&&this.createStyle()},methods:{getItemKey(e,t){return this.dataKey?i.resolveFieldData(e,this.dataKey):t},isSelected(e){return-1!=i.findIndexInList(e,this.d_selection)},onListFocus(e){const t=n.findSingle(this.list,"li.p-orderlist-item.p-highlight"),l=i.findIndexInList(t,this.list.children);this.focused=!0;const o=-1!==this.focusedOptionIndex?this.focusedOptionIndex:t?l:-1;this.changeFocusedOptionIndex(o),this.$emit("focus",e)},onListBlur(e){this.focused=!1,this.focusedOptionIndex=-1,this.$emit("blur",e)},onListKeyDown(e){switch(e.code){case"ArrowDown":this.onArrowDownKey(e);break;case"ArrowUp":this.onArrowUpKey(e);break;case"Home":this.onHomeKey(e);break;case"End":this.onEndKey(e);break;case"Enter":this.onEnterKey(e);break;case"Space":this.onSpaceKey(e);break;case"KeyA":e.ctrlKey&&(this.d_selection=[...this.modelValue],this.$emit("update:selection",this.d_selection))}},onOptionMouseDown(e){this.focused=!0,this.focusedOptionIndex=e},onArrowDownKey(e){const t=this.findNextOptionIndex(this.focusedOptionIndex);this.changeFocusedOptionIndex(t),e.shiftKey&&this.onEnterKey(e),e.preventDefault()},onArrowUpKey(e){const t=this.findPrevOptionIndex(this.focusedOptionIndex);this.changeFocusedOptionIndex(t),e.shiftKey&&this.onEnterKey(e),e.preventDefault()},onHomeKey(e){if(e.ctrlKey&&e.shiftKey){const e=n.find(this.list,"li.p-orderlist-item"),t=n.findSingle(this.list,`li.p-orderlist-item[id=${this.focusedOptionIndex}]`),i=[...e].findIndex((e=>e===t));this.d_selection=[...this.modelValue].slice(0,i+1),this.$emit("update:selection",this.d_selection)}else this.changeFocusedOptionIndex(0);e.preventDefault()},onEndKey(e){if(e.ctrlKey&&e.shiftKey){const e=n.find(this.list,"li.p-orderlist-item"),t=n.findSingle(this.list,`li.p-orderlist-item[id=${this.focusedOptionIndex}]`),i=[...e].findIndex((e=>e===t));this.d_selection=[...this.modelValue].slice(i,e.length),this.$emit("update:selection",this.d_selection)}else this.changeFocusedOptionIndex(n.find(this.list,"li.p-orderlist-item").length-1);e.preventDefault()},onEnterKey(e){const t=n.find(this.list,"li.p-orderlist-item"),i=n.findSingle(this.list,`li.p-orderlist-item[id=${this.focusedOptionIndex}]`),l=[...t].findIndex((e=>e===i));this.onItemClick(e,this.modelValue[l],l),e.preventDefault()},onSpaceKey(e){if(e.shiftKey){const e=n.find(this.list,"li.p-orderlist-item"),t=i.findIndexInList(this.d_selection[0],[...this.modelValue]),l=n.findSingle(this.list,`li.p-orderlist-item[id=${this.focusedOptionIndex}]`),o=[...e].findIndex((e=>e===l));this.d_selection=[...this.modelValue].slice(Math.min(t,o),Math.max(t,o)+1),this.$emit("update:selection",this.d_selection)}else this.onEnterKey(e)},findNextOptionIndex(e){const t=[...n.find(this.list,"li.p-orderlist-item")].findIndex((t=>t.id===e));return t>-1?t+1:0},findPrevOptionIndex(e){const t=[...n.find(this.list,"li.p-orderlist-item")].findIndex((t=>t.id===e));return t>-1?t-1:0},changeFocusedOptionIndex(e){const t=n.find(this.list,"li.p-orderlist-item");let i=e>=t.length?t.length-1:e<0?0:e;this.focusedOptionIndex=t[i].getAttribute("id"),this.scrollInView(t[i].getAttribute("id"))},scrollInView(e){const t=n.findSingle(this.list,`li[id="${e}"]`);t&&t.scrollIntoView&&t.scrollIntoView({block:"nearest",inline:"start"})},moveUp(e){if(this.d_selection){let t=[...this.modelValue];for(let e=0;e<this.d_selection.length;e++){let n=this.d_selection[e],l=i.findIndexInList(n,t);if(0===l)break;{let e=t[l],i=t[l-1];t[l-1]=e,t[l]=i}}this.reorderDirection="up",this.$emit("update:modelValue",t),this.$emit("reorder",{originalEvent:e,value:t,direction:this.reorderDirection})}},moveTop(e){if(this.d_selection){let t=[...this.modelValue];for(let e=0;e<this.d_selection.length;e++){let n=this.d_selection[e],l=i.findIndexInList(n,t);if(0===l)break;{let e=t.splice(l,1)[0];t.unshift(e)}}this.reorderDirection="top",this.$emit("update:modelValue",t),this.$emit("reorder",{originalEvent:e,value:t,direction:this.reorderDirection})}},moveDown(e){if(this.d_selection){let t=[...this.modelValue];for(let e=this.d_selection.length-1;e>=0;e--){let n=this.d_selection[e],l=i.findIndexInList(n,t);if(l===t.length-1)break;{let e=t[l],i=t[l+1];t[l+1]=e,t[l]=i}}this.reorderDirection="down",this.$emit("update:modelValue",t),this.$emit("reorder",{originalEvent:e,value:t,direction:this.reorderDirection})}},moveBottom(e){if(this.d_selection){let t=[...this.modelValue];for(let e=this.d_selection.length-1;e>=0;e--){let n=this.d_selection[e],l=i.findIndexInList(n,t);if(l===t.length-1)break;{let e=t.splice(l,1)[0];t.push(e)}}this.reorderDirection="bottom",this.$emit("update:modelValue",t),this.$emit("reorder",{originalEvent:e,value:t,direction:this.reorderDirection})}},onItemClick(e,t,l){this.itemTouched=!1;const o=i.findIndexInList(t,this.d_selection),s=-1!=o,r=!this.itemTouched&&this.metaKeySelection,d=n.find(this.list,".p-orderlist-item")[l].getAttribute("id");if(this.focusedOptionIndex=d,r){const n=e.metaKey||e.ctrlKey;s&&n?this.d_selection=this.d_selection.filter(((e,t)=>t!==o)):(this.d_selection=n&&this.d_selection?[...this.d_selection]:[],i.insertIntoOrderedArray(t,l,this.d_selection,this.modelValue))}else s?this.d_selection=this.d_selection.filter(((e,t)=>t!==o)):(this.d_selection=this.d_selection?[...this.d_selection]:[],i.insertIntoOrderedArray(t,l,this.d_selection,this.modelValue));this.$emit("update:selection",this.d_selection),this.$emit("selection-change",{originalEvent:e,value:this.d_selection})},onItemTouchEnd(){this.itemTouched=!0},findNextItem(e){let t=e.nextElementSibling;return t?n.hasClass(t,"p-orderlist-item")?t:this.findNextItem(t):null},findPrevItem(e){let t=e.previousElementSibling;return t?n.hasClass(t,"p-orderlist-item")?t:this.findPrevItem(t):null},findFirstItem(){return n.findSingle(this.list,".p-orderlist-item")},findLastItem(){const e=n.find(this.list,".p-orderlist-item");return e[e.length-1]},itemClass(e,t){return["p-orderlist-item",{"p-highlight":this.isSelected(e),"p-focus":t===this.focusedOptionId}]},updateListScroll(){const e=n.find(this.list,".p-orderlist-item.p-highlight");if(e&&e.length)switch(this.reorderDirection){case"up":n.scrollInView(this.list,e[0]);break;case"top":this.list.scrollTop=0;break;case"down":n.scrollInView(this.list,e[e.length-1]);break;case"bottom":this.list.scrollTop=this.list.scrollHeight}},createStyle(){if(!this.styleElement){this.$el.setAttribute(this.attributeSelector,""),this.styleElement=document.createElement("style"),this.styleElement.type="text/css",document.head.appendChild(this.styleElement);let e=`\n@media screen and (max-width: ${this.breakpoint}) {\n    .p-orderlist[${this.attributeSelector}] {\n        flex-direction: column;\n    }\n\n    .p-orderlist[${this.attributeSelector}] .p-orderlist-controls {\n        padding: var(--content-padding);\n        flex-direction: row;\n    }\n\n    .p-orderlist[${this.attributeSelector}] .p-orderlist-controls .p-button {\n        margin-right: var(--inline-spacing);\n        margin-bottom: 0;\n    }\n\n    .p-orderlist[${this.attributeSelector}] .p-orderlist-controls .p-button:last-child {\n        margin-right: 0;\n    }\n}\n`;this.styleElement.innerHTML=e}},destroyStyle(){this.styleElement&&(document.head.removeChild(this.styleElement),this.styleElement=null)},moveDisabled(){if(!this.d_selection||!this.d_selection.length)return!0},listRef(e){this.list=e?e.$el:void 0}},computed:{containerClass(){return["p-orderlist p-component",{"p-orderlist-striped":this.stripedRows}]},id(){return this.$attrs.id||l()},attributeSelector:()=>l(),focusedOptionId(){return-1!==this.focusedOptionIndex?this.focusedOptionIndex:null},moveUpAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.moveUp:void 0},moveTopAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.moveTop:void 0},moveDownAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.moveDown:void 0},moveBottomAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.moveBottom:void 0}},components:{OLButton:e},directives:{ripple:t}};const x={class:"p-orderlist-controls"},$={class:"p-orderlist-list-container"},_={key:0,class:"p-orderlist-header"},w=["id","onClick","aria-selected","onMousedown"];!function(e,t){void 0===t&&(t={});var i=t.insertAt;if(e&&"undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===i&&n.firstChild?n.insertBefore(l,n.firstChild):n.appendChild(l),l.styleSheet?l.styleSheet.cssText=e:l.appendChild(document.createTextNode(e))}}("\n.p-orderlist {\n    display: flex;\n}\n.p-orderlist-controls {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n}\n.p-orderlist-list-container {\n    flex: 1 1 auto;\n}\n.p-orderlist-list {\n    list-style-type: none;\n    margin: 0;\n    padding: 0;\n    overflow: auto;\n    min-height: 12rem;\n    max-height: 24rem;\n}\n.p-orderlist-item {\n    cursor: pointer;\n    overflow: hidden;\n    position: relative;\n}\n.p-orderlist.p-state-disabled .p-orderlist-item,\n.p-orderlist.p-state-disabled .p-button {\n    cursor: default;\n}\n.p-orderlist.p-state-disabled .p-orderlist-list {\n    overflow: hidden;\n}\n"),I.render=function(e,t,i,n,l,I){const D=o("OLButton"),K=s("ripple");return r(),d("div",{class:a(I.containerClass)},[c("div",x,[h(e.$slots,"controlsstart"),u(D,p({type:"button",icon:"pi pi-angle-up",onClick:I.moveUp,"aria-label":I.moveUpAriaLabel,disabled:I.moveDisabled()},i.moveUpButtonProps),null,16,["onClick","aria-label","disabled"]),u(D,p({type:"button",icon:"pi pi-angle-double-up",onClick:I.moveTop,"aria-label":I.moveTopAriaLabel,disabled:I.moveDisabled()},i.moveTopButtonProps),null,16,["onClick","aria-label","disabled"]),u(D,p({type:"button",icon:"pi pi-angle-down",onClick:I.moveDown,"aria-label":I.moveDownAriaLabel,disabled:I.moveDisabled()},i.moveDownButtonProps),null,16,["onClick","aria-label","disabled"]),u(D,p({type:"button",icon:"pi pi-angle-double-down",onClick:I.moveBottom,"aria-label":I.moveBottomAriaLabel,disabled:I.moveDisabled()},i.moveBottomButtonProps),null,16,["onClick","aria-label","disabled"]),h(e.$slots,"controlsend")]),c("div",$,[e.$slots.header?(r(),d("div",_,[h(e.$slots,"header")])):m("",!0),u(f,p({ref:I.listRef,id:I.id+"_list",name:"p-orderlist-flip",tag:"ul",class:"p-orderlist-list",style:i.listStyle,role:"listbox","aria-multiselectable":"true",tabindex:i.tabindex,"aria-activedescendant":l.focused?I.focusedOptionId:void 0,"aria-label":e.ariaLabel,"aria-labelledby":e.ariaLabelledby,onFocus:I.onListFocus,onBlur:I.onListBlur,onKeydown:I.onListKeyDown},i.listProps),{default:y((()=>[(r(!0),d(b,null,v(i.modelValue,((i,n)=>g((r(),d("li",{key:I.getItemKey(i,n),id:I.id+"_"+n,role:"option",class:a(I.itemClass(i,`${I.id}_${n}`)),onClick:e=>I.onItemClick(e,i,n),onTouchend:t[0]||(t[0]=(...e)=>I.onItemTouchEnd&&I.onItemTouchEnd(...e)),"aria-selected":I.isSelected(i),onMousedown:e=>I.onOptionMouseDown(n)},[h(e.$slots,"item",{item:i,index:n})],42,w)),[[K]]))),128))])),_:3},16,["id","style","tabindex","aria-activedescendant","aria-label","aria-labelledby","onFocus","onBlur","onKeydown"])])],2)};export{I as default};
+import e from"primevue/button";import t from"primevue/ripple";import{UniqueComponentId as i,ObjectUtils as n,DomHandler as l}from"primevue/utils";import{resolveComponent as o,resolveDirective as s,openBlock as r,createElementBlock as d,normalizeClass as a,createElementVNode as c,renderSlot as h,createVNode as u,mergeProps as p,createCommentVNode as m,TransitionGroup as f,withCtx as y,Fragment as b,renderList as v,withDirectives as g}from"vue";var I={name:"OrderList",emits:["update:modelValue","reorder","update:selection","selection-change","focus","blur"],props:{modelValue:{type:Array,default:null},selection:{type:Array,default:null},dataKey:{type:String,default:null},listStyle:{type:null,default:null},metaKeySelection:{type:Boolean,default:!0},responsive:{type:Boolean,default:!0},breakpoint:{type:String,default:"960px"},stripedRows:{type:Boolean,default:!1},tabindex:{type:Number,default:0},listProps:{type:null,default:null},moveUpButtonProps:{type:null,default:null},moveTopButtonProps:{type:null,default:null},moveDownButtonProps:{type:null,default:null},moveBottomButtonProps:{type:null,default:null},"aria-labelledby":{type:String,default:null},"aria-label":{type:String,default:null}},itemTouched:!1,reorderDirection:null,styleElement:null,list:null,data(){return{id:this.$attrs.id,d_selection:this.selection,focused:!1,focusedOptionIndex:-1}},watch:{"$attrs.id":function(e){this.id=e||i()}},beforeUnmount(){this.destroyStyle()},updated(){this.reorderDirection&&(this.updateListScroll(),this.reorderDirection=null)},mounted(){this.id=this.id||i(),this.responsive&&this.createStyle()},methods:{getItemKey(e,t){return this.dataKey?n.resolveFieldData(e,this.dataKey):t},isSelected(e){return-1!=n.findIndexInList(e,this.d_selection)},onListFocus(e){const t=l.findSingle(this.list,"li.p-orderlist-item.p-highlight"),i=n.findIndexInList(t,this.list.children);this.focused=!0;const o=-1!==this.focusedOptionIndex?this.focusedOptionIndex:t?i:-1;this.changeFocusedOptionIndex(o),this.$emit("focus",e)},onListBlur(e){this.focused=!1,this.focusedOptionIndex=-1,this.$emit("blur",e)},onListKeyDown(e){switch(e.code){case"ArrowDown":this.onArrowDownKey(e);break;case"ArrowUp":this.onArrowUpKey(e);break;case"Home":this.onHomeKey(e);break;case"End":this.onEndKey(e);break;case"Enter":this.onEnterKey(e);break;case"Space":this.onSpaceKey(e);break;case"KeyA":e.ctrlKey&&(this.d_selection=[...this.modelValue],this.$emit("update:selection",this.d_selection))}},onOptionMouseDown(e){this.focused=!0,this.focusedOptionIndex=e},onArrowDownKey(e){const t=this.findNextOptionIndex(this.focusedOptionIndex);this.changeFocusedOptionIndex(t),e.shiftKey&&this.onEnterKey(e),e.preventDefault()},onArrowUpKey(e){const t=this.findPrevOptionIndex(this.focusedOptionIndex);this.changeFocusedOptionIndex(t),e.shiftKey&&this.onEnterKey(e),e.preventDefault()},onHomeKey(e){if(e.ctrlKey&&e.shiftKey){const e=l.find(this.list,"li.p-orderlist-item"),t=l.findSingle(this.list,`li.p-orderlist-item[id=${this.focusedOptionIndex}]`),i=[...e].findIndex((e=>e===t));this.d_selection=[...this.modelValue].slice(0,i+1),this.$emit("update:selection",this.d_selection)}else this.changeFocusedOptionIndex(0);e.preventDefault()},onEndKey(e){if(e.ctrlKey&&e.shiftKey){const e=l.find(this.list,"li.p-orderlist-item"),t=l.findSingle(this.list,`li.p-orderlist-item[id=${this.focusedOptionIndex}]`),i=[...e].findIndex((e=>e===t));this.d_selection=[...this.modelValue].slice(i,e.length),this.$emit("update:selection",this.d_selection)}else this.changeFocusedOptionIndex(l.find(this.list,"li.p-orderlist-item").length-1);e.preventDefault()},onEnterKey(e){const t=l.find(this.list,"li.p-orderlist-item"),i=l.findSingle(this.list,`li.p-orderlist-item[id=${this.focusedOptionIndex}]`),n=[...t].findIndex((e=>e===i));this.onItemClick(e,this.modelValue[n],n),e.preventDefault()},onSpaceKey(e){if(e.shiftKey){const e=l.find(this.list,"li.p-orderlist-item"),t=n.findIndexInList(this.d_selection[0],[...this.modelValue]),i=l.findSingle(this.list,`li.p-orderlist-item[id=${this.focusedOptionIndex}]`),o=[...e].findIndex((e=>e===i));this.d_selection=[...this.modelValue].slice(Math.min(t,o),Math.max(t,o)+1),this.$emit("update:selection",this.d_selection)}else this.onEnterKey(e)},findNextOptionIndex(e){const t=[...l.find(this.list,"li.p-orderlist-item")].findIndex((t=>t.id===e));return t>-1?t+1:0},findPrevOptionIndex(e){const t=[...l.find(this.list,"li.p-orderlist-item")].findIndex((t=>t.id===e));return t>-1?t-1:0},changeFocusedOptionIndex(e){const t=l.find(this.list,"li.p-orderlist-item");let i=e>=t.length?t.length-1:e<0?0:e;this.focusedOptionIndex=t[i].getAttribute("id"),this.scrollInView(t[i].getAttribute("id"))},scrollInView(e){const t=l.findSingle(this.list,`li[id="${e}"]`);t&&t.scrollIntoView&&t.scrollIntoView({block:"nearest",inline:"start"})},moveUp(e){if(this.d_selection){let t=[...this.modelValue];for(let e=0;e<this.d_selection.length;e++){let i=this.d_selection[e],l=n.findIndexInList(i,t);if(0===l)break;{let e=t[l],i=t[l-1];t[l-1]=e,t[l]=i}}this.reorderDirection="up",this.$emit("update:modelValue",t),this.$emit("reorder",{originalEvent:e,value:t,direction:this.reorderDirection})}},moveTop(e){if(this.d_selection){let t=[...this.modelValue];for(let e=0;e<this.d_selection.length;e++){let i=this.d_selection[e],l=n.findIndexInList(i,t);if(0===l)break;{let e=t.splice(l,1)[0];t.unshift(e)}}this.reorderDirection="top",this.$emit("update:modelValue",t),this.$emit("reorder",{originalEvent:e,value:t,direction:this.reorderDirection})}},moveDown(e){if(this.d_selection){let t=[...this.modelValue];for(let e=this.d_selection.length-1;e>=0;e--){let i=this.d_selection[e],l=n.findIndexInList(i,t);if(l===t.length-1)break;{let e=t[l],i=t[l+1];t[l+1]=e,t[l]=i}}this.reorderDirection="down",this.$emit("update:modelValue",t),this.$emit("reorder",{originalEvent:e,value:t,direction:this.reorderDirection})}},moveBottom(e){if(this.d_selection){let t=[...this.modelValue];for(let e=this.d_selection.length-1;e>=0;e--){let i=this.d_selection[e],l=n.findIndexInList(i,t);if(l===t.length-1)break;{let e=t.splice(l,1)[0];t.push(e)}}this.reorderDirection="bottom",this.$emit("update:modelValue",t),this.$emit("reorder",{originalEvent:e,value:t,direction:this.reorderDirection})}},onItemClick(e,t,i){this.itemTouched=!1;const o=n.findIndexInList(t,this.d_selection),s=-1!=o,r=!this.itemTouched&&this.metaKeySelection,d=l.find(this.list,".p-orderlist-item")[i].getAttribute("id");if(this.focusedOptionIndex=d,r){const l=e.metaKey||e.ctrlKey;s&&l?this.d_selection=this.d_selection.filter(((e,t)=>t!==o)):(this.d_selection=l&&this.d_selection?[...this.d_selection]:[],n.insertIntoOrderedArray(t,i,this.d_selection,this.modelValue))}else s?this.d_selection=this.d_selection.filter(((e,t)=>t!==o)):(this.d_selection=this.d_selection?[...this.d_selection]:[],n.insertIntoOrderedArray(t,i,this.d_selection,this.modelValue));this.$emit("update:selection",this.d_selection),this.$emit("selection-change",{originalEvent:e,value:this.d_selection})},onItemTouchEnd(){this.itemTouched=!0},findNextItem(e){let t=e.nextElementSibling;return t?l.hasClass(t,"p-orderlist-item")?t:this.findNextItem(t):null},findPrevItem(e){let t=e.previousElementSibling;return t?l.hasClass(t,"p-orderlist-item")?t:this.findPrevItem(t):null},findFirstItem(){return l.findSingle(this.list,".p-orderlist-item")},findLastItem(){const e=l.find(this.list,".p-orderlist-item");return e[e.length-1]},itemClass(e,t){return["p-orderlist-item",{"p-highlight":this.isSelected(e),"p-focus":t===this.focusedOptionId}]},updateListScroll(){const e=l.find(this.list,".p-orderlist-item.p-highlight");if(e&&e.length)switch(this.reorderDirection){case"up":l.scrollInView(this.list,e[0]);break;case"top":this.list.scrollTop=0;break;case"down":l.scrollInView(this.list,e[e.length-1]);break;case"bottom":this.list.scrollTop=this.list.scrollHeight}},createStyle(){if(!this.styleElement){this.$el.setAttribute(this.attributeSelector,""),this.styleElement=document.createElement("style"),this.styleElement.type="text/css",document.head.appendChild(this.styleElement);let e=`\n@media screen and (max-width: ${this.breakpoint}) {\n    .p-orderlist[${this.attributeSelector}] {\n        flex-direction: column;\n    }\n\n    .p-orderlist[${this.attributeSelector}] .p-orderlist-controls {\n        padding: var(--content-padding);\n        flex-direction: row;\n    }\n\n    .p-orderlist[${this.attributeSelector}] .p-orderlist-controls .p-button {\n        margin-right: var(--inline-spacing);\n        margin-bottom: 0;\n    }\n\n    .p-orderlist[${this.attributeSelector}] .p-orderlist-controls .p-button:last-child {\n        margin-right: 0;\n    }\n}\n`;this.styleElement.innerHTML=e}},destroyStyle(){this.styleElement&&(document.head.removeChild(this.styleElement),this.styleElement=null)},moveDisabled(){if(!this.d_selection||!this.d_selection.length)return!0},listRef(e){this.list=e?e.$el:void 0}},computed:{containerClass(){return["p-orderlist p-component",{"p-orderlist-striped":this.stripedRows}]},attributeSelector:()=>i(),focusedOptionId(){return-1!==this.focusedOptionIndex?this.focusedOptionIndex:null},moveUpAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.moveUp:void 0},moveTopAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.moveTop:void 0},moveDownAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.moveDown:void 0},moveBottomAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.moveBottom:void 0}},components:{OLButton:e},directives:{ripple:t}};const x={class:"p-orderlist-controls"},$={class:"p-orderlist-list-container"},w={key:0,class:"p-orderlist-header"},_=["id","onClick","aria-selected","onMousedown"];!function(e,t){void 0===t&&(t={});var i=t.insertAt;if(e&&"undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===i&&n.firstChild?n.insertBefore(l,n.firstChild):n.appendChild(l),l.styleSheet?l.styleSheet.cssText=e:l.appendChild(document.createTextNode(e))}}("\n.p-orderlist {\n    display: flex;\n}\n.p-orderlist-controls {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n}\n.p-orderlist-list-container {\n    flex: 1 1 auto;\n}\n.p-orderlist-list {\n    list-style-type: none;\n    margin: 0;\n    padding: 0;\n    overflow: auto;\n    min-height: 12rem;\n    max-height: 24rem;\n}\n.p-orderlist-item {\n    cursor: pointer;\n    overflow: hidden;\n    position: relative;\n}\n.p-orderlist.p-state-disabled .p-orderlist-item,\n.p-orderlist.p-state-disabled .p-button {\n    cursor: default;\n}\n.p-orderlist.p-state-disabled .p-orderlist-list {\n    overflow: hidden;\n}\n"),I.render=function(e,t,i,n,l,I){const D=o("OLButton"),K=s("ripple");return r(),d("div",{class:a(I.containerClass)},[c("div",x,[h(e.$slots,"controlsstart"),u(D,p({type:"button",icon:"pi pi-angle-up",onClick:I.moveUp,"aria-label":I.moveUpAriaLabel,disabled:I.moveDisabled()},i.moveUpButtonProps),null,16,["onClick","aria-label","disabled"]),u(D,p({type:"button",icon:"pi pi-angle-double-up",onClick:I.moveTop,"aria-label":I.moveTopAriaLabel,disabled:I.moveDisabled()},i.moveTopButtonProps),null,16,["onClick","aria-label","disabled"]),u(D,p({type:"button",icon:"pi pi-angle-down",onClick:I.moveDown,"aria-label":I.moveDownAriaLabel,disabled:I.moveDisabled()},i.moveDownButtonProps),null,16,["onClick","aria-label","disabled"]),u(D,p({type:"button",icon:"pi pi-angle-double-down",onClick:I.moveBottom,"aria-label":I.moveBottomAriaLabel,disabled:I.moveDisabled()},i.moveBottomButtonProps),null,16,["onClick","aria-label","disabled"]),h(e.$slots,"controlsend")]),c("div",$,[e.$slots.header?(r(),d("div",w,[h(e.$slots,"header")])):m("",!0),u(f,p({ref:I.listRef,id:l.id+"_list",name:"p-orderlist-flip",tag:"ul",class:"p-orderlist-list",style:i.listStyle,role:"listbox","aria-multiselectable":"true",tabindex:i.tabindex,"aria-activedescendant":l.focused?I.focusedOptionId:void 0,"aria-label":e.ariaLabel,"aria-labelledby":e.ariaLabelledby,onFocus:I.onListFocus,onBlur:I.onListBlur,onKeydown:I.onListKeyDown},i.listProps),{default:y((()=>[(r(!0),d(b,null,v(i.modelValue,((i,n)=>g((r(),d("li",{key:I.getItemKey(i,n),id:l.id+"_"+n,role:"option",class:a(I.itemClass(i,`${l.id}_${n}`)),onClick:e=>I.onItemClick(e,i,n),onTouchend:t[0]||(t[0]=(...e)=>I.onItemTouchEnd&&I.onItemTouchEnd(...e)),"aria-selected":I.isSelected(i),onMousedown:e=>I.onOptionMouseDown(n)},[h(e.$slots,"item",{item:i,index:n})],42,_)),[[K]]))),128))])),_:3},16,["id","style","tabindex","aria-activedescendant","aria-label","aria-labelledby","onFocus","onBlur","onKeydown"])])],2)};export{I as default};

package/orderlist/orderlist.js

@@ -82,11 +82,17 @@ this.primevue.orderlist = (function (Button, Ripple, utils, vue) {
         list: null,
         data() {
             return {
+                id: this.$attrs.id,
                 d_selection: this.selection,
                 focused: false,
                 focusedOptionIndex: -1
             };
         },
+        watch: {
+            '$attrs.id': function (newValue) {
+                this.id = newValue || utils.UniqueComponentId();
+            }
+        },
         beforeUnmount() {
             this.destroyStyle();
         },
@@ -97,6 +103,8 @@ this.primevue.orderlist = (function (Button, Ripple, utils, vue) {
             }
         },
         mounted() {
+            this.id = this.id || utils.UniqueComponentId();
+
             if (this.responsive) {
                 this.createStyle();
             }
@@ -506,9 +514,6 @@ this.primevue.orderlist = (function (Button, Ripple, utils, vue) {
                     }
                 ];
             },
-            id() {
-                return this.$attrs.id || utils.UniqueComponentId();
-            },
             attributeSelector() {
                 return utils.UniqueComponentId();
             },
@@ -591,7 +596,7 @@ this.primevue.orderlist = (function (Button, Ripple, utils, vue) {
             : vue.createCommentVNode("", true),
           vue.createVNode(vue.TransitionGroup, vue.mergeProps({
             ref: $options.listRef,
-            id: $options.id + '_list',
+            id: $data.id + '_list',
             name: "p-orderlist-flip",
             tag: "ul",
             class: "p-orderlist-list",
@@ -610,9 +615,9 @@ this.primevue.orderlist = (function (Button, Ripple, utils, vue) {
               (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($props.modelValue, (item, i) => {
                 return vue.withDirectives((vue.openBlock(), vue.createElementBlock("li", {
                   key: $options.getItemKey(item, i),
-                  id: $options.id + '_' + i,
+                  id: $data.id + '_' + i,
                   role: "option",
-                  class: vue.normalizeClass($options.itemClass(item, `${$options.id}_${i}`)),
+                  class: vue.normalizeClass($options.itemClass(item, `${$data.id}_${i}`)),
                   onClick: $event => ($options.onItemClick($event, item, i)),
                   onTouchend: _cache[0] || (_cache[0] = (...args) => ($options.onItemTouchEnd && $options.onItemTouchEnd(...args))),
                   "aria-selected": $options.isSelected(item),

package/orderlist/orderlist.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.orderlist=function(e,t,i,n){"use strict";function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=l(e),s=l(t),r={name:"OrderList",emits:["update:modelValue","reorder","update:selection","selection-change","focus","blur"],props:{modelValue:{type:Array,default:null},selection:{type:Array,default:null},dataKey:{type:String,default:null},listStyle:{type:null,default:null},metaKeySelection:{type:Boolean,default:!0},responsive:{type:Boolean,default:!0},breakpoint:{type:String,default:"960px"},stripedRows:{type:Boolean,default:!1},tabindex:{type:Number,default:0},listProps:{type:null,default:null},moveUpButtonProps:{type:null,default:null},moveTopButtonProps:{type:null,default:null},moveDownButtonProps:{type:null,default:null},moveBottomButtonProps:{type:null,default:null},"aria-labelledby":{type:String,default:null},"aria-label":{type:String,default:null}},itemTouched:!1,reorderDirection:null,styleElement:null,list:null,data(){return{d_selection:this.selection,focused:!1,focusedOptionIndex:-1}},beforeUnmount(){this.destroyStyle()},updated(){this.reorderDirection&&(this.updateListScroll(),this.reorderDirection=null)},mounted(){this.responsive&&this.createStyle()},methods:{getItemKey(e,t){return this.dataKey?i.ObjectUtils.resolveFieldData(e,this.dataKey):t},isSelected(e){return-1!=i.ObjectUtils.findIndexInList(e,this.d_selection)},onListFocus(e){const t=i.DomHandler.findSingle(this.list,"li.p-orderlist-item.p-highlight"),n=i.ObjectUtils.findIndexInList(t,this.list.children);this.focused=!0;const l=-1!==this.focusedOptionIndex?this.focusedOptionIndex:t?n:-1;this.changeFocusedOptionIndex(l),this.$emit("focus",e)},onListBlur(e){this.focused=!1,this.focusedOptionIndex=-1,this.$emit("blur",e)},onListKeyDown(e){switch(e.code){case"ArrowDown":this.onArrowDownKey(e);break;case"ArrowUp":this.onArrowUpKey(e);break;case"Home":this.onHomeKey(e);break;case"End":this.onEndKey(e);break;case"Enter":this.onEnterKey(e);break;case"Space":this.onSpaceKey(e);break;case"KeyA":e.ctrlKey&&(this.d_selection=[...this.modelValue],this.$emit("update:selection",this.d_selection))}},onOptionMouseDown(e){this.focused=!0,this.focusedOptionIndex=e},onArrowDownKey(e){const t=this.findNextOptionIndex(this.focusedOptionIndex);this.changeFocusedOptionIndex(t),e.shiftKey&&this.onEnterKey(e),e.preventDefault()},onArrowUpKey(e){const t=this.findPrevOptionIndex(this.focusedOptionIndex);this.changeFocusedOptionIndex(t),e.shiftKey&&this.onEnterKey(e),e.preventDefault()},onHomeKey(e){if(e.ctrlKey&&e.shiftKey){const e=i.DomHandler.find(this.list,"li.p-orderlist-item"),t=i.DomHandler.findSingle(this.list,`li.p-orderlist-item[id=${this.focusedOptionIndex}]`),n=[...e].findIndex((e=>e===t));this.d_selection=[...this.modelValue].slice(0,n+1),this.$emit("update:selection",this.d_selection)}else this.changeFocusedOptionIndex(0);e.preventDefault()},onEndKey(e){if(e.ctrlKey&&e.shiftKey){const e=i.DomHandler.find(this.list,"li.p-orderlist-item"),t=i.DomHandler.findSingle(this.list,`li.p-orderlist-item[id=${this.focusedOptionIndex}]`),n=[...e].findIndex((e=>e===t));this.d_selection=[...this.modelValue].slice(n,e.length),this.$emit("update:selection",this.d_selection)}else this.changeFocusedOptionIndex(i.DomHandler.find(this.list,"li.p-orderlist-item").length-1);e.preventDefault()},onEnterKey(e){const t=i.DomHandler.find(this.list,"li.p-orderlist-item"),n=i.DomHandler.findSingle(this.list,`li.p-orderlist-item[id=${this.focusedOptionIndex}]`),l=[...t].findIndex((e=>e===n));this.onItemClick(e,this.modelValue[l],l),e.preventDefault()},onSpaceKey(e){if(e.shiftKey){const e=i.DomHandler.find(this.list,"li.p-orderlist-item"),t=i.ObjectUtils.findIndexInList(this.d_selection[0],[...this.modelValue]),n=i.DomHandler.findSingle(this.list,`li.p-orderlist-item[id=${this.focusedOptionIndex}]`),l=[...e].findIndex((e=>e===n));this.d_selection=[...this.modelValue].slice(Math.min(t,l),Math.max(t,l)+1),this.$emit("update:selection",this.d_selection)}else this.onEnterKey(e)},findNextOptionIndex(e){const t=[...i.DomHandler.find(this.list,"li.p-orderlist-item")].findIndex((t=>t.id===e));return t>-1?t+1:0},findPrevOptionIndex(e){const t=[...i.DomHandler.find(this.list,"li.p-orderlist-item")].findIndex((t=>t.id===e));return t>-1?t-1:0},changeFocusedOptionIndex(e){const t=i.DomHandler.find(this.list,"li.p-orderlist-item");let n=e>=t.length?t.length-1:e<0?0:e;this.focusedOptionIndex=t[n].getAttribute("id"),this.scrollInView(t[n].getAttribute("id"))},scrollInView(e){const t=i.DomHandler.findSingle(this.list,`li[id="${e}"]`);t&&t.scrollIntoView&&t.scrollIntoView({block:"nearest",inline:"start"})},moveUp(e){if(this.d_selection){let t=[...this.modelValue];for(let e=0;e<this.d_selection.length;e++){let n=this.d_selection[e],l=i.ObjectUtils.findIndexInList(n,t);if(0===l)break;{let e=t[l],i=t[l-1];t[l-1]=e,t[l]=i}}this.reorderDirection="up",this.$emit("update:modelValue",t),this.$emit("reorder",{originalEvent:e,value:t,direction:this.reorderDirection})}},moveTop(e){if(this.d_selection){let t=[...this.modelValue];for(let e=0;e<this.d_selection.length;e++){let n=this.d_selection[e],l=i.ObjectUtils.findIndexInList(n,t);if(0===l)break;{let e=t.splice(l,1)[0];t.unshift(e)}}this.reorderDirection="top",this.$emit("update:modelValue",t),this.$emit("reorder",{originalEvent:e,value:t,direction:this.reorderDirection})}},moveDown(e){if(this.d_selection){let t=[...this.modelValue];for(let e=this.d_selection.length-1;e>=0;e--){let n=this.d_selection[e],l=i.ObjectUtils.findIndexInList(n,t);if(l===t.length-1)break;{let e=t[l],i=t[l+1];t[l+1]=e,t[l]=i}}this.reorderDirection="down",this.$emit("update:modelValue",t),this.$emit("reorder",{originalEvent:e,value:t,direction:this.reorderDirection})}},moveBottom(e){if(this.d_selection){let t=[...this.modelValue];for(let e=this.d_selection.length-1;e>=0;e--){let n=this.d_selection[e],l=i.ObjectUtils.findIndexInList(n,t);if(l===t.length-1)break;{let e=t.splice(l,1)[0];t.push(e)}}this.reorderDirection="bottom",this.$emit("update:modelValue",t),this.$emit("reorder",{originalEvent:e,value:t,direction:this.reorderDirection})}},onItemClick(e,t,n){this.itemTouched=!1;const l=i.ObjectUtils.findIndexInList(t,this.d_selection),o=-1!=l,s=!this.itemTouched&&this.metaKeySelection,r=i.DomHandler.find(this.list,".p-orderlist-item")[n].getAttribute("id");if(this.focusedOptionIndex=r,s){const s=e.metaKey||e.ctrlKey;o&&s?this.d_selection=this.d_selection.filter(((e,t)=>t!==l)):(this.d_selection=s&&this.d_selection?[...this.d_selection]:[],i.ObjectUtils.insertIntoOrderedArray(t,n,this.d_selection,this.modelValue))}else o?this.d_selection=this.d_selection.filter(((e,t)=>t!==l)):(this.d_selection=this.d_selection?[...this.d_selection]:[],i.ObjectUtils.insertIntoOrderedArray(t,n,this.d_selection,this.modelValue));this.$emit("update:selection",this.d_selection),this.$emit("selection-change",{originalEvent:e,value:this.d_selection})},onItemTouchEnd(){this.itemTouched=!0},findNextItem(e){let t=e.nextElementSibling;return t?i.DomHandler.hasClass(t,"p-orderlist-item")?t:this.findNextItem(t):null},findPrevItem(e){let t=e.previousElementSibling;return t?i.DomHandler.hasClass(t,"p-orderlist-item")?t:this.findPrevItem(t):null},findFirstItem(){return i.DomHandler.findSingle(this.list,".p-orderlist-item")},findLastItem(){const e=i.DomHandler.find(this.list,".p-orderlist-item");return e[e.length-1]},itemClass(e,t){return["p-orderlist-item",{"p-highlight":this.isSelected(e),"p-focus":t===this.focusedOptionId}]},updateListScroll(){const e=i.DomHandler.find(this.list,".p-orderlist-item.p-highlight");if(e&&e.length)switch(this.reorderDirection){case"up":i.DomHandler.scrollInView(this.list,e[0]);break;case"top":this.list.scrollTop=0;break;case"down":i.DomHandler.scrollInView(this.list,e[e.length-1]);break;case"bottom":this.list.scrollTop=this.list.scrollHeight}},createStyle(){if(!this.styleElement){this.$el.setAttribute(this.attributeSelector,""),this.styleElement=document.createElement("style"),this.styleElement.type="text/css",document.head.appendChild(this.styleElement);let e=`\n@media screen and (max-width: ${this.breakpoint}) {\n    .p-orderlist[${this.attributeSelector}] {\n        flex-direction: column;\n    }\n\n    .p-orderlist[${this.attributeSelector}] .p-orderlist-controls {\n        padding: var(--content-padding);\n        flex-direction: row;\n    }\n\n    .p-orderlist[${this.attributeSelector}] .p-orderlist-controls .p-button {\n        margin-right: var(--inline-spacing);\n        margin-bottom: 0;\n    }\n\n    .p-orderlist[${this.attributeSelector}] .p-orderlist-controls .p-button:last-child {\n        margin-right: 0;\n    }\n}\n`;this.styleElement.innerHTML=e}},destroyStyle(){this.styleElement&&(document.head.removeChild(this.styleElement),this.styleElement=null)},moveDisabled(){if(!this.d_selection||!this.d_selection.length)return!0},listRef(e){this.list=e?e.$el:void 0}},computed:{containerClass(){return["p-orderlist p-component",{"p-orderlist-striped":this.stripedRows}]},id(){return this.$attrs.id||i.UniqueComponentId()},attributeSelector:()=>i.UniqueComponentId(),focusedOptionId(){return-1!==this.focusedOptionIndex?this.focusedOptionIndex:null},moveUpAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.moveUp:void 0},moveTopAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.moveTop:void 0},moveDownAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.moveDown:void 0},moveBottomAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.moveBottom:void 0}},components:{OLButton:o.default},directives:{ripple:s.default}};const d={class:"p-orderlist-controls"},a={class:"p-orderlist-list-container"},c={key:0,class:"p-orderlist-header"},h=["id","onClick","aria-selected","onMousedown"];return function(e,t){void 0===t&&(t={});var i=t.insertAt;if(e&&"undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===i&&n.firstChild?n.insertBefore(l,n.firstChild):n.appendChild(l),l.styleSheet?l.styleSheet.cssText=e:l.appendChild(document.createTextNode(e))}}("\n.p-orderlist {\n    display: flex;\n}\n.p-orderlist-controls {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n}\n.p-orderlist-list-container {\n    flex: 1 1 auto;\n}\n.p-orderlist-list {\n    list-style-type: none;\n    margin: 0;\n    padding: 0;\n    overflow: auto;\n    min-height: 12rem;\n    max-height: 24rem;\n}\n.p-orderlist-item {\n    cursor: pointer;\n    overflow: hidden;\n    position: relative;\n}\n.p-orderlist.p-state-disabled .p-orderlist-item,\n.p-orderlist.p-state-disabled .p-button {\n    cursor: default;\n}\n.p-orderlist.p-state-disabled .p-orderlist-list {\n    overflow: hidden;\n}\n"),r.render=function(e,t,i,l,o,s){const r=n.resolveComponent("OLButton"),u=n.resolveDirective("ripple");return n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(s.containerClass)},[n.createElementVNode("div",d,[n.renderSlot(e.$slots,"controlsstart"),n.createVNode(r,n.mergeProps({type:"button",icon:"pi pi-angle-up",onClick:s.moveUp,"aria-label":s.moveUpAriaLabel,disabled:s.moveDisabled()},i.moveUpButtonProps),null,16,["onClick","aria-label","disabled"]),n.createVNode(r,n.mergeProps({type:"button",icon:"pi pi-angle-double-up",onClick:s.moveTop,"aria-label":s.moveTopAriaLabel,disabled:s.moveDisabled()},i.moveTopButtonProps),null,16,["onClick","aria-label","disabled"]),n.createVNode(r,n.mergeProps({type:"button",icon:"pi pi-angle-down",onClick:s.moveDown,"aria-label":s.moveDownAriaLabel,disabled:s.moveDisabled()},i.moveDownButtonProps),null,16,["onClick","aria-label","disabled"]),n.createVNode(r,n.mergeProps({type:"button",icon:"pi pi-angle-double-down",onClick:s.moveBottom,"aria-label":s.moveBottomAriaLabel,disabled:s.moveDisabled()},i.moveBottomButtonProps),null,16,["onClick","aria-label","disabled"]),n.renderSlot(e.$slots,"controlsend")]),n.createElementVNode("div",a,[e.$slots.header?(n.openBlock(),n.createElementBlock("div",c,[n.renderSlot(e.$slots,"header")])):n.createCommentVNode("",!0),n.createVNode(n.TransitionGroup,n.mergeProps({ref:s.listRef,id:s.id+"_list",name:"p-orderlist-flip",tag:"ul",class:"p-orderlist-list",style:i.listStyle,role:"listbox","aria-multiselectable":"true",tabindex:i.tabindex,"aria-activedescendant":o.focused?s.focusedOptionId:void 0,"aria-label":e.ariaLabel,"aria-labelledby":e.ariaLabelledby,onFocus:s.onListFocus,onBlur:s.onListBlur,onKeydown:s.onListKeyDown},i.listProps),{default:n.withCtx((()=>[(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(i.modelValue,((i,l)=>n.withDirectives((n.openBlock(),n.createElementBlock("li",{key:s.getItemKey(i,l),id:s.id+"_"+l,role:"option",class:n.normalizeClass(s.itemClass(i,`${s.id}_${l}`)),onClick:e=>s.onItemClick(e,i,l),onTouchend:t[0]||(t[0]=(...e)=>s.onItemTouchEnd&&s.onItemTouchEnd(...e)),"aria-selected":s.isSelected(i),onMousedown:e=>s.onOptionMouseDown(l)},[n.renderSlot(e.$slots,"item",{item:i,index:l})],42,h)),[[u]]))),128))])),_:3},16,["id","style","tabindex","aria-activedescendant","aria-label","aria-labelledby","onFocus","onBlur","onKeydown"])])],2)},r}(primevue.button,primevue.ripple,primevue.utils,Vue);
+this.primevue=this.primevue||{},this.primevue.orderlist=function(e,t,i,n){"use strict";function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=l(e),s=l(t),r={name:"OrderList",emits:["update:modelValue","reorder","update:selection","selection-change","focus","blur"],props:{modelValue:{type:Array,default:null},selection:{type:Array,default:null},dataKey:{type:String,default:null},listStyle:{type:null,default:null},metaKeySelection:{type:Boolean,default:!0},responsive:{type:Boolean,default:!0},breakpoint:{type:String,default:"960px"},stripedRows:{type:Boolean,default:!1},tabindex:{type:Number,default:0},listProps:{type:null,default:null},moveUpButtonProps:{type:null,default:null},moveTopButtonProps:{type:null,default:null},moveDownButtonProps:{type:null,default:null},moveBottomButtonProps:{type:null,default:null},"aria-labelledby":{type:String,default:null},"aria-label":{type:String,default:null}},itemTouched:!1,reorderDirection:null,styleElement:null,list:null,data(){return{id:this.$attrs.id,d_selection:this.selection,focused:!1,focusedOptionIndex:-1}},watch:{"$attrs.id":function(e){this.id=e||i.UniqueComponentId()}},beforeUnmount(){this.destroyStyle()},updated(){this.reorderDirection&&(this.updateListScroll(),this.reorderDirection=null)},mounted(){this.id=this.id||i.UniqueComponentId(),this.responsive&&this.createStyle()},methods:{getItemKey(e,t){return this.dataKey?i.ObjectUtils.resolveFieldData(e,this.dataKey):t},isSelected(e){return-1!=i.ObjectUtils.findIndexInList(e,this.d_selection)},onListFocus(e){const t=i.DomHandler.findSingle(this.list,"li.p-orderlist-item.p-highlight"),n=i.ObjectUtils.findIndexInList(t,this.list.children);this.focused=!0;const l=-1!==this.focusedOptionIndex?this.focusedOptionIndex:t?n:-1;this.changeFocusedOptionIndex(l),this.$emit("focus",e)},onListBlur(e){this.focused=!1,this.focusedOptionIndex=-1,this.$emit("blur",e)},onListKeyDown(e){switch(e.code){case"ArrowDown":this.onArrowDownKey(e);break;case"ArrowUp":this.onArrowUpKey(e);break;case"Home":this.onHomeKey(e);break;case"End":this.onEndKey(e);break;case"Enter":this.onEnterKey(e);break;case"Space":this.onSpaceKey(e);break;case"KeyA":e.ctrlKey&&(this.d_selection=[...this.modelValue],this.$emit("update:selection",this.d_selection))}},onOptionMouseDown(e){this.focused=!0,this.focusedOptionIndex=e},onArrowDownKey(e){const t=this.findNextOptionIndex(this.focusedOptionIndex);this.changeFocusedOptionIndex(t),e.shiftKey&&this.onEnterKey(e),e.preventDefault()},onArrowUpKey(e){const t=this.findPrevOptionIndex(this.focusedOptionIndex);this.changeFocusedOptionIndex(t),e.shiftKey&&this.onEnterKey(e),e.preventDefault()},onHomeKey(e){if(e.ctrlKey&&e.shiftKey){const e=i.DomHandler.find(this.list,"li.p-orderlist-item"),t=i.DomHandler.findSingle(this.list,`li.p-orderlist-item[id=${this.focusedOptionIndex}]`),n=[...e].findIndex((e=>e===t));this.d_selection=[...this.modelValue].slice(0,n+1),this.$emit("update:selection",this.d_selection)}else this.changeFocusedOptionIndex(0);e.preventDefault()},onEndKey(e){if(e.ctrlKey&&e.shiftKey){const e=i.DomHandler.find(this.list,"li.p-orderlist-item"),t=i.DomHandler.findSingle(this.list,`li.p-orderlist-item[id=${this.focusedOptionIndex}]`),n=[...e].findIndex((e=>e===t));this.d_selection=[...this.modelValue].slice(n,e.length),this.$emit("update:selection",this.d_selection)}else this.changeFocusedOptionIndex(i.DomHandler.find(this.list,"li.p-orderlist-item").length-1);e.preventDefault()},onEnterKey(e){const t=i.DomHandler.find(this.list,"li.p-orderlist-item"),n=i.DomHandler.findSingle(this.list,`li.p-orderlist-item[id=${this.focusedOptionIndex}]`),l=[...t].findIndex((e=>e===n));this.onItemClick(e,this.modelValue[l],l),e.preventDefault()},onSpaceKey(e){if(e.shiftKey){const e=i.DomHandler.find(this.list,"li.p-orderlist-item"),t=i.ObjectUtils.findIndexInList(this.d_selection[0],[...this.modelValue]),n=i.DomHandler.findSingle(this.list,`li.p-orderlist-item[id=${this.focusedOptionIndex}]`),l=[...e].findIndex((e=>e===n));this.d_selection=[...this.modelValue].slice(Math.min(t,l),Math.max(t,l)+1),this.$emit("update:selection",this.d_selection)}else this.onEnterKey(e)},findNextOptionIndex(e){const t=[...i.DomHandler.find(this.list,"li.p-orderlist-item")].findIndex((t=>t.id===e));return t>-1?t+1:0},findPrevOptionIndex(e){const t=[...i.DomHandler.find(this.list,"li.p-orderlist-item")].findIndex((t=>t.id===e));return t>-1?t-1:0},changeFocusedOptionIndex(e){const t=i.DomHandler.find(this.list,"li.p-orderlist-item");let n=e>=t.length?t.length-1:e<0?0:e;this.focusedOptionIndex=t[n].getAttribute("id"),this.scrollInView(t[n].getAttribute("id"))},scrollInView(e){const t=i.DomHandler.findSingle(this.list,`li[id="${e}"]`);t&&t.scrollIntoView&&t.scrollIntoView({block:"nearest",inline:"start"})},moveUp(e){if(this.d_selection){let t=[...this.modelValue];for(let e=0;e<this.d_selection.length;e++){let n=this.d_selection[e],l=i.ObjectUtils.findIndexInList(n,t);if(0===l)break;{let e=t[l],i=t[l-1];t[l-1]=e,t[l]=i}}this.reorderDirection="up",this.$emit("update:modelValue",t),this.$emit("reorder",{originalEvent:e,value:t,direction:this.reorderDirection})}},moveTop(e){if(this.d_selection){let t=[...this.modelValue];for(let e=0;e<this.d_selection.length;e++){let n=this.d_selection[e],l=i.ObjectUtils.findIndexInList(n,t);if(0===l)break;{let e=t.splice(l,1)[0];t.unshift(e)}}this.reorderDirection="top",this.$emit("update:modelValue",t),this.$emit("reorder",{originalEvent:e,value:t,direction:this.reorderDirection})}},moveDown(e){if(this.d_selection){let t=[...this.modelValue];for(let e=this.d_selection.length-1;e>=0;e--){let n=this.d_selection[e],l=i.ObjectUtils.findIndexInList(n,t);if(l===t.length-1)break;{let e=t[l],i=t[l+1];t[l+1]=e,t[l]=i}}this.reorderDirection="down",this.$emit("update:modelValue",t),this.$emit("reorder",{originalEvent:e,value:t,direction:this.reorderDirection})}},moveBottom(e){if(this.d_selection){let t=[...this.modelValue];for(let e=this.d_selection.length-1;e>=0;e--){let n=this.d_selection[e],l=i.ObjectUtils.findIndexInList(n,t);if(l===t.length-1)break;{let e=t.splice(l,1)[0];t.push(e)}}this.reorderDirection="bottom",this.$emit("update:modelValue",t),this.$emit("reorder",{originalEvent:e,value:t,direction:this.reorderDirection})}},onItemClick(e,t,n){this.itemTouched=!1;const l=i.ObjectUtils.findIndexInList(t,this.d_selection),o=-1!=l,s=!this.itemTouched&&this.metaKeySelection,r=i.DomHandler.find(this.list,".p-orderlist-item")[n].getAttribute("id");if(this.focusedOptionIndex=r,s){const s=e.metaKey||e.ctrlKey;o&&s?this.d_selection=this.d_selection.filter(((e,t)=>t!==l)):(this.d_selection=s&&this.d_selection?[...this.d_selection]:[],i.ObjectUtils.insertIntoOrderedArray(t,n,this.d_selection,this.modelValue))}else o?this.d_selection=this.d_selection.filter(((e,t)=>t!==l)):(this.d_selection=this.d_selection?[...this.d_selection]:[],i.ObjectUtils.insertIntoOrderedArray(t,n,this.d_selection,this.modelValue));this.$emit("update:selection",this.d_selection),this.$emit("selection-change",{originalEvent:e,value:this.d_selection})},onItemTouchEnd(){this.itemTouched=!0},findNextItem(e){let t=e.nextElementSibling;return t?i.DomHandler.hasClass(t,"p-orderlist-item")?t:this.findNextItem(t):null},findPrevItem(e){let t=e.previousElementSibling;return t?i.DomHandler.hasClass(t,"p-orderlist-item")?t:this.findPrevItem(t):null},findFirstItem(){return i.DomHandler.findSingle(this.list,".p-orderlist-item")},findLastItem(){const e=i.DomHandler.find(this.list,".p-orderlist-item");return e[e.length-1]},itemClass(e,t){return["p-orderlist-item",{"p-highlight":this.isSelected(e),"p-focus":t===this.focusedOptionId}]},updateListScroll(){const e=i.DomHandler.find(this.list,".p-orderlist-item.p-highlight");if(e&&e.length)switch(this.reorderDirection){case"up":i.DomHandler.scrollInView(this.list,e[0]);break;case"top":this.list.scrollTop=0;break;case"down":i.DomHandler.scrollInView(this.list,e[e.length-1]);break;case"bottom":this.list.scrollTop=this.list.scrollHeight}},createStyle(){if(!this.styleElement){this.$el.setAttribute(this.attributeSelector,""),this.styleElement=document.createElement("style"),this.styleElement.type="text/css",document.head.appendChild(this.styleElement);let e=`\n@media screen and (max-width: ${this.breakpoint}) {\n    .p-orderlist[${this.attributeSelector}] {\n        flex-direction: column;\n    }\n\n    .p-orderlist[${this.attributeSelector}] .p-orderlist-controls {\n        padding: var(--content-padding);\n        flex-direction: row;\n    }\n\n    .p-orderlist[${this.attributeSelector}] .p-orderlist-controls .p-button {\n        margin-right: var(--inline-spacing);\n        margin-bottom: 0;\n    }\n\n    .p-orderlist[${this.attributeSelector}] .p-orderlist-controls .p-button:last-child {\n        margin-right: 0;\n    }\n}\n`;this.styleElement.innerHTML=e}},destroyStyle(){this.styleElement&&(document.head.removeChild(this.styleElement),this.styleElement=null)},moveDisabled(){if(!this.d_selection||!this.d_selection.length)return!0},listRef(e){this.list=e?e.$el:void 0}},computed:{containerClass(){return["p-orderlist p-component",{"p-orderlist-striped":this.stripedRows}]},attributeSelector:()=>i.UniqueComponentId(),focusedOptionId(){return-1!==this.focusedOptionIndex?this.focusedOptionIndex:null},moveUpAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.moveUp:void 0},moveTopAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.moveTop:void 0},moveDownAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.moveDown:void 0},moveBottomAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.moveBottom:void 0}},components:{OLButton:o.default},directives:{ripple:s.default}};const d={class:"p-orderlist-controls"},a={class:"p-orderlist-list-container"},c={key:0,class:"p-orderlist-header"},h=["id","onClick","aria-selected","onMousedown"];return function(e,t){void 0===t&&(t={});var i=t.insertAt;if(e&&"undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===i&&n.firstChild?n.insertBefore(l,n.firstChild):n.appendChild(l),l.styleSheet?l.styleSheet.cssText=e:l.appendChild(document.createTextNode(e))}}("\n.p-orderlist {\n    display: flex;\n}\n.p-orderlist-controls {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n}\n.p-orderlist-list-container {\n    flex: 1 1 auto;\n}\n.p-orderlist-list {\n    list-style-type: none;\n    margin: 0;\n    padding: 0;\n    overflow: auto;\n    min-height: 12rem;\n    max-height: 24rem;\n}\n.p-orderlist-item {\n    cursor: pointer;\n    overflow: hidden;\n    position: relative;\n}\n.p-orderlist.p-state-disabled .p-orderlist-item,\n.p-orderlist.p-state-disabled .p-button {\n    cursor: default;\n}\n.p-orderlist.p-state-disabled .p-orderlist-list {\n    overflow: hidden;\n}\n"),r.render=function(e,t,i,l,o,s){const r=n.resolveComponent("OLButton"),u=n.resolveDirective("ripple");return n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(s.containerClass)},[n.createElementVNode("div",d,[n.renderSlot(e.$slots,"controlsstart"),n.createVNode(r,n.mergeProps({type:"button",icon:"pi pi-angle-up",onClick:s.moveUp,"aria-label":s.moveUpAriaLabel,disabled:s.moveDisabled()},i.moveUpButtonProps),null,16,["onClick","aria-label","disabled"]),n.createVNode(r,n.mergeProps({type:"button",icon:"pi pi-angle-double-up",onClick:s.moveTop,"aria-label":s.moveTopAriaLabel,disabled:s.moveDisabled()},i.moveTopButtonProps),null,16,["onClick","aria-label","disabled"]),n.createVNode(r,n.mergeProps({type:"button",icon:"pi pi-angle-down",onClick:s.moveDown,"aria-label":s.moveDownAriaLabel,disabled:s.moveDisabled()},i.moveDownButtonProps),null,16,["onClick","aria-label","disabled"]),n.createVNode(r,n.mergeProps({type:"button",icon:"pi pi-angle-double-down",onClick:s.moveBottom,"aria-label":s.moveBottomAriaLabel,disabled:s.moveDisabled()},i.moveBottomButtonProps),null,16,["onClick","aria-label","disabled"]),n.renderSlot(e.$slots,"controlsend")]),n.createElementVNode("div",a,[e.$slots.header?(n.openBlock(),n.createElementBlock("div",c,[n.renderSlot(e.$slots,"header")])):n.createCommentVNode("",!0),n.createVNode(n.TransitionGroup,n.mergeProps({ref:s.listRef,id:o.id+"_list",name:"p-orderlist-flip",tag:"ul",class:"p-orderlist-list",style:i.listStyle,role:"listbox","aria-multiselectable":"true",tabindex:i.tabindex,"aria-activedescendant":o.focused?s.focusedOptionId:void 0,"aria-label":e.ariaLabel,"aria-labelledby":e.ariaLabelledby,onFocus:s.onListFocus,onBlur:s.onListBlur,onKeydown:s.onListKeyDown},i.listProps),{default:n.withCtx((()=>[(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(i.modelValue,((i,l)=>n.withDirectives((n.openBlock(),n.createElementBlock("li",{key:s.getItemKey(i,l),id:o.id+"_"+l,role:"option",class:n.normalizeClass(s.itemClass(i,`${o.id}_${l}`)),onClick:e=>s.onItemClick(e,i,l),onTouchend:t[0]||(t[0]=(...e)=>s.onItemTouchEnd&&s.onItemTouchEnd(...e)),"aria-selected":s.isSelected(i),onMousedown:e=>s.onOptionMouseDown(l)},[n.renderSlot(e.$slots,"item",{item:i,index:l})],42,h)),[[u]]))),128))])),_:3},16,["id","style","tabindex","aria-activedescendant","aria-label","aria-labelledby","onFocus","onBlur","onKeydown"])])],2)},r}(primevue.button,primevue.ripple,primevue.utils,Vue);

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "primevue",
-    "version": "3.22.3",
+    "version": "3.23.0",
     "homepage": "https://www.primefaces.org/primevue",
     "repository": {
       "type": "git",

package/panelmenu/PanelMenu.vue

@@ -70,10 +70,18 @@ export default {
     },
     data() {
         return {
+            id: this.$attrs.id,
             activeItem: null
         };
     },
-
+    watch: {
+        '$attrs.id': function (newValue) {
+            this.id = newValue || UniqueComponentId();
+        }
+    },
+    mounted() {
+        this.id = this.id || UniqueComponentId();
+    },
     methods: {
         getItemProp(item, name) {
             return item ? ObjectUtils.getItemValue(item[name]) : undefined;
@@ -250,11 +258,6 @@ export default {
             return ['p-submenu-icon', this.isItemActive(item) ? 'pi pi-chevron-down' : 'pi pi-chevron-right'];
         }
     },
-    computed: {
-        id() {
-            return this.$attrs.id || UniqueComponentId();
-        }
-    },
     components: {
         PanelMenuList: PanelMenuList
     }

package/panelmenu/PanelMenuList.vue

@@ -200,7 +200,7 @@ export default {
         onEnterKey(event) {
             if (ObjectUtils.isNotEmpty(this.focusedItem)) {
                 const element = DomHandler.findSingle(this.$el, `li[id="${`${this.focusedItemId}`}"]`);
-                const anchorElement = element && DomHandler.findSingle(element, '.p-menuitem-link');
+                const anchorElement = element && (DomHandler.findSingle(element, '.p-menuitem-link') || DomHandler.findSingle(element, 'a,button'));
 
                 anchorElement ? anchorElement.click() : element && element.click();
             }

package/panelmenu/panelmenu.cjs.js

@@ -433,7 +433,7 @@ var script$1 = {
         onEnterKey(event) {
             if (utils.ObjectUtils.isNotEmpty(this.focusedItem)) {
                 const element = utils.DomHandler.findSingle(this.$el, `li[id="${`${this.focusedItemId}`}"]`);
-                const anchorElement = element && utils.DomHandler.findSingle(element, '.p-menuitem-link');
+                const anchorElement = element && (utils.DomHandler.findSingle(element, '.p-menuitem-link') || utils.DomHandler.findSingle(element, 'a,button'));
 
                 anchorElement ? anchorElement.click() : element && element.click();
             }
@@ -669,10 +669,18 @@ var script = {
     },
     data() {
         return {
+            id: this.$attrs.id,
             activeItem: null
         };
     },
-
+    watch: {
+        '$attrs.id': function (newValue) {
+            this.id = newValue || utils.UniqueComponentId();
+        }
+    },
+    mounted() {
+        this.id = this.id || utils.UniqueComponentId();
+    },
     methods: {
         getItemProp(item, name) {
             return item ? utils.ObjectUtils.getItemValue(item[name]) : undefined;
@@ -846,11 +854,6 @@ var script = {
             return ['p-submenu-icon', this.isItemActive(item) ? 'pi pi-chevron-down' : 'pi pi-chevron-right'];
         }
     },
-    computed: {
-        id() {
-            return this.$attrs.id || utils.UniqueComponentId();
-        }
-    },
     components: {
         PanelMenuList: script$1
     }
@@ -874,7 +877,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_PanelMenuList = vue.resolveComponent("PanelMenuList");
 
   return (vue.openBlock(), vue.createElementBlock("div", {
-    id: $options.id,
+    id: $data.id,
     class: "p-panelmenu p-component"
   }, [
     (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($props.model, (item, index) => {

package/panelmenu/panelmenu.cjs.min.js

@@ -1 +1 @@
-"use strict";var e=require("primevue/utils"),t=require("primevue/ripple"),i=require("vue");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n={name:"PanelMenuSub",emits:["item-toggle"],props:{panelId:{type:String,default:null},focusedItemId:{type:String,default:null},items:{type:Array,default:null},level:{type:Number,default:0},template:{type:Function,default:null},activeItemPath:{type:Object,default:null},exact:{type:Boolean,default:!0}},methods:{getItemId(e){return`${this.panelId}_${e.key}`},getItemKey(e){return this.getItemId(e)},getItemProp:(t,i,s)=>t&&t.item?e.ObjectUtils.getItemValue(t.item[i],s):void 0,getItemLabel(e){return this.getItemProp(e,"label")},isItemActive(e){return this.activeItemPath.some((t=>t.key===e.key))},isItemVisible(e){return!1!==this.getItemProp(e,"visible")},isItemDisabled(e){return this.getItemProp(e,"disabled")},isItemFocused(e){return this.focusedItemId===this.getItemId(e)},isItemGroup:t=>e.ObjectUtils.isNotEmpty(t.items),onItemClick(e,t){this.getItemProp(t,"command",{originalEvent:e,item:t.item}),this.$emit("item-toggle",{processedItem:t,expanded:!this.isItemActive(t)})},onItemToggle(e){this.$emit("item-toggle",e)},onItemActionClick(e,t){t&&t(e)},getAriaSetSize(){return this.items.filter((e=>this.isItemVisible(e)&&!this.getItemProp(e,"separator"))).length},getAriaPosInset(e){return e-this.items.slice(0,e).filter((e=>this.isItemVisible(e)&&this.getItemProp(e,"separator"))).length+1},getItemClass(e){return["p-menuitem",this.getItemProp(e,"class"),{"p-focus":this.isItemFocused(e),"p-disabled":this.isItemDisabled(e)}]},getItemActionClass(e,t){return["p-menuitem-link",{"router-link-active":t&&t.isActive,"router-link-active-exact":this.exact&&t&&t.isExactActive}]},getItemIconClass(e){return["p-menuitem-icon",this.getItemProp(e,"icon")]},getItemToggleIconClass(e){return["p-submenu-icon",this.isItemActive(e)?"pi pi-fw pi-chevron-down":"pi pi-fw pi-chevron-right"]},getSeparatorItemClass(e){return["p-menuitem-separator",this.getItemProp(e,"class")]}},directives:{ripple:s(t).default}};const a={class:"p-submenu-list"},l=["id","aria-label","aria-expanded","aria-level","aria-setsize","aria-posinset"],o=["onClick"],r=["href","onClick"],c={class:"p-menuitem-text"},m=["href","target"],d={class:"p-menuitem-text"},p={class:"p-toggleable-content"};n.render=function(e,t,s,n,u,h){const I=i.resolveComponent("router-link"),g=i.resolveComponent("PanelMenuSub",!0),f=i.resolveDirective("ripple");return i.openBlock(),i.createElementBlock("ul",a,[(i.openBlock(!0),i.createElementBlock(i.Fragment,null,i.renderList(s.items,((e,t)=>(i.openBlock(),i.createElementBlock(i.Fragment,{key:h.getItemKey(e)},[h.isItemVisible(e)&&!h.getItemProp(e,"separator")?(i.openBlock(),i.createElementBlock("li",{key:0,id:h.getItemId(e),style:i.normalizeStyle(h.getItemProp(e,"style")),class:i.normalizeClass(h.getItemClass(e)),role:"treeitem","aria-label":h.getItemLabel(e),"aria-expanded":h.isItemGroup(e)?h.isItemActive(e):void 0,"aria-level":s.level+1,"aria-setsize":h.getAriaSetSize(),"aria-posinset":h.getAriaPosInset(t)},[i.createElementVNode("div",{class:"p-menuitem-content",onClick:t=>h.onItemClick(t,e)},[s.template?(i.openBlock(),i.createBlock(i.resolveDynamicComponent(s.template),{key:1,item:e.item},null,8,["item"])):(i.openBlock(),i.createElementBlock(i.Fragment,{key:0},[h.getItemProp(e,"to")&&!h.isItemDisabled(e)?(i.openBlock(),i.createBlock(I,{key:0,to:h.getItemProp(e,"to"),custom:""},{default:i.withCtx((({navigate:t,href:s,isActive:n,isExactActive:a})=>[i.withDirectives((i.openBlock(),i.createElementBlock("a",{href:s,class:i.normalizeClass(h.getItemActionClass(e,{isActive:n,isExactActive:a})),tabindex:"-1","aria-hidden":"true",onClick:e=>h.onItemActionClick(e,t)},[h.getItemProp(e,"icon")?(i.openBlock(),i.createElementBlock("span",{key:0,class:i.normalizeClass(h.getItemIconClass(e))},null,2)):i.createCommentVNode("",!0),i.createElementVNode("span",c,i.toDisplayString(h.getItemLabel(e)),1)],10,r)),[[f]])])),_:2},1032,["to"])):i.withDirectives((i.openBlock(),i.createElementBlock("a",{key:1,href:h.getItemProp(e,"url"),class:i.normalizeClass(h.getItemActionClass(e)),target:h.getItemProp(e,"target"),tabindex:"-1","aria-hidden":"true"},[h.isItemGroup(e)?(i.openBlock(),i.createElementBlock("span",{key:0,class:i.normalizeClass(h.getItemToggleIconClass(e))},null,2)):i.createCommentVNode("",!0),h.getItemProp(e,"icon")?(i.openBlock(),i.createElementBlock("span",{key:1,class:i.normalizeClass(h.getItemIconClass(e))},null,2)):i.createCommentVNode("",!0),i.createElementVNode("span",d,i.toDisplayString(h.getItemLabel(e)),1)],10,m)),[[f]])],64))],8,o),i.createVNode(i.Transition,{name:"p-toggleable-content"},{default:i.withCtx((()=>[i.withDirectives(i.createElementVNode("div",p,[h.isItemVisible(e)&&h.isItemGroup(e)?(i.openBlock(),i.createBlock(g,{key:0,id:h.getItemId(e)+"_list",role:"group",panelId:s.panelId,focusedItemId:s.focusedItemId,items:e.items,level:s.level+1,template:s.template,activeItemPath:s.activeItemPath,exact:s.exact,onItemToggle:h.onItemToggle},null,8,["id","panelId","focusedItemId","items","level","template","activeItemPath","exact","onItemToggle"])):i.createCommentVNode("",!0)],512),[[i.vShow,h.isItemActive(e)]])])),_:2},1024)],14,l)):i.createCommentVNode("",!0),h.isItemVisible(e)&&h.getItemProp(e,"separator")?(i.openBlock(),i.createElementBlock("li",{key:1,style:i.normalizeStyle(h.getItemProp(e,"style")),class:i.normalizeClass(h.getSeparatorItemClass(e)),role:"separator"},null,6)):i.createCommentVNode("",!0)],64)))),128))])};var u={name:"PanelMenuList",emits:["item-toggle","header-focus"],props:{panelId:{type:String,default:null},items:{type:Array,default:null},template:{type:Function,default:null},expandedKeys:{type:Object,default:null},exact:{type:Boolean,default:!0}},searchTimeout:null,searchValue:null,data:()=>({focused:!1,focusedItem:null,activeItemPath:[]}),watch:{expandedKeys(e){this.autoUpdateActiveItemPath(e)}},mounted(){this.autoUpdateActiveItemPath(this.expandedKeys)},methods:{getItemProp:(t,i)=>t&&t.item?e.ObjectUtils.getItemValue(t.item[i]):void 0,getItemLabel(e){return this.getItemProp(e,"label")},isItemVisible(e){return!1!==this.getItemProp(e,"visible")},isItemDisabled(e){return this.getItemProp(e,"disabled")},isItemActive(e){return this.activeItemPath.some((t=>t.key===e.parentKey))},isItemGroup:t=>e.ObjectUtils.isNotEmpty(t.items),onFocus(e){this.focused=!0,this.focusedItem=this.focusedItem||(this.isElementInPanel(e,e.relatedTarget)?this.findFirstItem():this.findLastItem())},onBlur(){this.focused=!1,this.focusedItem=null,this.searchValue=""},onKeyDown(t){const i=t.metaKey||t.ctrlKey;switch(t.code){case"ArrowDown":this.onArrowDownKey(t);break;case"ArrowUp":this.onArrowUpKey(t);break;case"ArrowLeft":this.onArrowLeftKey(t);break;case"ArrowRight":this.onArrowRightKey(t);break;case"Home":this.onHomeKey(t);break;case"End":this.onEndKey(t);break;case"Space":this.onSpaceKey(t);break;case"Enter":this.onEnterKey(t);break;case"Escape":case"Tab":case"PageDown":case"PageUp":case"Backspace":case"ShiftLeft":case"ShiftRight":break;default:!i&&e.ObjectUtils.isPrintableCharacter(t.key)&&this.searchItems(t,t.key)}},onArrowDownKey(t){const i=e.ObjectUtils.isNotEmpty(this.focusedItem)?this.findNextItem(this.focusedItem):this.findFirstItem();this.changeFocusedItem({originalEvent:t,processedItem:i,focusOnNext:!0}),t.preventDefault()},onArrowUpKey(t){const i=e.ObjectUtils.isNotEmpty(this.focusedItem)?this.findPrevItem(this.focusedItem):this.findLastItem();this.changeFocusedItem({originalEvent:t,processedItem:i,selfCheck:!0}),t.preventDefault()},onArrowLeftKey(t){if(e.ObjectUtils.isNotEmpty(this.focusedItem)){this.activeItemPath.some((e=>e.key===this.focusedItem.key))?this.activeItemPath=this.activeItemPath.filter((e=>e.key!==this.focusedItem.key)):this.focusedItem=e.ObjectUtils.isNotEmpty(this.focusedItem.parent)?this.focusedItem.parent:this.focusedItem,t.preventDefault()}},onArrowRightKey(t){if(e.ObjectUtils.isNotEmpty(this.focusedItem)){if(this.isItemGroup(this.focusedItem)){this.activeItemPath.some((e=>e.key===this.focusedItem.key))?this.onArrowDownKey(t):(this.activeItemPath=this.activeItemPath.filter((e=>e.parentKey!==this.focusedItem.parentKey)),this.activeItemPath.push(this.focusedItem))}t.preventDefault()}},onHomeKey(e){this.changeFocusedItem({originalEvent:e,processedItem:this.findFirstItem(),allowHeaderFocus:!1}),e.preventDefault()},onEndKey(e){this.changeFocusedItem({originalEvent:e,processedItem:this.findLastItem(),focusOnNext:!0,allowHeaderFocus:!1}),e.preventDefault()},onEnterKey(t){if(e.ObjectUtils.isNotEmpty(this.focusedItem)){const t=e.DomHandler.findSingle(this.$el,`li[id="${this.focusedItemId}"]`),i=t&&e.DomHandler.findSingle(t,".p-menuitem-link");i?i.click():t&&t.click()}t.preventDefault()},onSpaceKey(e){this.onEnterKey(e)},onItemToggle(t){const{processedItem:i,expanded:s}=t;this.expandedKeys?this.$emit("item-toggle",{item:i.item,expanded:s}):(this.activeItemPath=this.activeItemPath.filter((e=>e.parentKey!==i.parentKey)),s&&this.activeItemPath.push(i)),this.focusedItem=i,e.DomHandler.focus(this.$el)},isElementInPanel(e,t){const i=e.currentTarget.closest(".p-panelmenu-panel");return i&&i.contains(t)},isItemMatched(e){return this.isValidItem(e)&&this.getItemLabel(e).toLocaleLowerCase(this.searchLocale).startsWith(this.searchValue.toLocaleLowerCase(this.searchLocale))},isVisibleItem(e){return!!e&&(0===e.level||this.isItemActive(e))&&this.isItemVisible(e)},isValidItem(e){return!!e&&!this.isItemDisabled(e)},findFirstItem(){return this.visibleItems.find((e=>this.isValidItem(e)))},findLastItem(){return e.ObjectUtils.findLast(this.visibleItems,(e=>this.isValidItem(e)))},findNextItem(e){const t=this.visibleItems.findIndex((t=>t.key===e.key));return(t<this.visibleItems.length-1?this.visibleItems.slice(t+1).find((e=>this.isValidItem(e))):void 0)||e},findPrevItem(t){const i=this.visibleItems.findIndex((e=>e.key===t.key));return(i>0?e.ObjectUtils.findLast(this.visibleItems.slice(0,i),(e=>this.isValidItem(e))):void 0)||t},searchItems(t,i){this.searchValue=(this.searchValue||"")+i;let s=null,n=!1;if(e.ObjectUtils.isNotEmpty(this.focusedItem)){const t=this.visibleItems.findIndex((e=>e.key===this.focusedItem.key));s=this.visibleItems.slice(t).find((e=>this.isItemMatched(e))),s=e.ObjectUtils.isEmpty(s)?this.visibleItems.slice(0,t).find((e=>this.isItemMatched(e))):s}else s=this.visibleItems.find((e=>this.isItemMatched(e)));return e.ObjectUtils.isNotEmpty(s)&&(n=!0),e.ObjectUtils.isEmpty(s)&&e.ObjectUtils.isEmpty(this.focusedItem)&&(s=this.findFirstItem()),e.ObjectUtils.isNotEmpty(s)&&this.changeFocusedItem({originalEvent:t,processedItem:s,allowHeaderFocus:!1}),this.searchTimeout&&clearTimeout(this.searchTimeout),this.searchTimeout=setTimeout((()=>{this.searchValue="",this.searchTimeout=null}),500),n},changeFocusedItem(t){const{originalEvent:i,processedItem:s,focusOnNext:n,selfCheck:a,allowHeaderFocus:l=!0}=t;e.ObjectUtils.isNotEmpty(this.focusedItem)&&this.focusedItem.key!==s.key?(this.focusedItem=s,this.scrollInView()):l&&this.$emit("header-focus",{originalEvent:i,focusOnNext:n,selfCheck:a})},scrollInView(){const t=e.DomHandler.findSingle(this.$el,`li[id="${this.focusedItemId}"]`);t&&t.scrollIntoView&&t.scrollIntoView({block:"nearest",inline:"start"})},autoUpdateActiveItemPath(e){this.activeItemPath=Object.entries(e||{}).reduce(((e,[t,i])=>{if(i){const i=this.findProcessedItemByItemKey(t);i&&e.push(i)}return e}),[])},findProcessedItemByItemKey(e,t,i=0){if(!(t=t||0===i&&this.processedItems))return null;for(let s=0;s<t.length;s++){const n=t[s];if(this.getItemProp(n,"key")===e)return n;const a=this.findProcessedItemByItemKey(e,n.items,i+1);if(a)return a}},createProcessedItems(e,t=0,i={},s=""){const n=[];return e&&e.forEach(((e,a)=>{const l=(""!==s?s+"_":"")+a,o={item:e,index:a,level:t,key:l,parent:i,parentKey:s};o.items=this.createProcessedItems(e.items,t+1,o,l),n.push(o)})),n},flatItems(e,t=[]){return e&&e.forEach((e=>{this.isVisibleItem(e)&&(t.push(e),this.flatItems(e.items,t))})),t}},computed:{processedItems(){return this.createProcessedItems(this.items||[])},visibleItems(){return this.flatItems(this.processedItems)},focusedItemId(){return e.ObjectUtils.isNotEmpty(this.focusedItem)?`${this.panelId}_${this.focusedItem.key}`:null}},components:{PanelMenuSub:n}};u.render=function(e,t,s,n,a,l){const o=i.resolveComponent("PanelMenuSub");return i.openBlock(),i.createBlock(o,{id:s.panelId+"_list",class:"p-panelmenu-root-list",role:"tree",tabindex:-1,"aria-activedescendant":a.focused?l.focusedItemId:void 0,panelId:s.panelId,focusedItemId:a.focused?l.focusedItemId:void 0,items:l.processedItems,template:s.template,activeItemPath:a.activeItemPath,exact:s.exact,onFocus:l.onFocus,onBlur:l.onBlur,onKeydown:l.onKeyDown,onItemToggle:l.onItemToggle},null,8,["id","aria-activedescendant","panelId","focusedItemId","items","template","activeItemPath","exact","onFocus","onBlur","onKeydown","onItemToggle"])};var h={name:"PanelMenu",emits:["update:expandedKeys","panel-open","panel-close"],props:{model:{type:Array,default:null},expandedKeys:{type:Object,default:null},exact:{type:Boolean,default:!0},tabindex:{type:Number,default:0}},data:()=>({activeItem:null}),methods:{getItemProp:(t,i)=>t?e.ObjectUtils.getItemValue(t[i]):void 0,getItemLabel(e){return this.getItemProp(e,"label")},isItemActive(t){return this.expandedKeys?this.expandedKeys[this.getItemProp(t,"key")]:e.ObjectUtils.equals(t,this.activeItem)},isItemVisible(e){return!1!==this.getItemProp(e,"visible")},isItemDisabled(e){return this.getItemProp(e,"disabled")},getPanelId(e){return`${this.id}_${e}`},getPanelKey(e){return this.getPanelId(e)},getHeaderId(e){return`${this.getPanelId(e)}_header`},getContentId(e){return`${this.getPanelId(e)}_content`},onHeaderClick(t,i){this.isItemDisabled(i)?t.preventDefault():(i.command&&i.command({originalEvent:t,item:i}),this.changeActiveItem(t,i),e.DomHandler.focus(t.currentTarget))},onHeaderKeyDown(e,t){switch(e.code){case"ArrowDown":this.onHeaderArrowDownKey(e);break;case"ArrowUp":this.onHeaderArrowUpKey(e);break;case"Home":this.onHeaderHomeKey(e);break;case"End":this.onHeaderEndKey(e);break;case"Enter":case"Space":this.onHeaderEnterKey(e,t)}},onHeaderArrowDownKey(t){const i=e.DomHandler.hasClass(t.currentTarget,"p-highlight")?e.DomHandler.findSingle(t.currentTarget.nextElementSibling,".p-panelmenu-root-list"):null;i?e.DomHandler.focus(i):this.updateFocusedHeader({originalEvent:t,focusOnNext:!0}),t.preventDefault()},onHeaderArrowUpKey(t){const i=this.findPrevHeader(t.currentTarget.parentElement)||this.findLastHeader(),s=e.DomHandler.hasClass(i,"p-highlight")?e.DomHandler.findSingle(i.nextElementSibling,".p-panelmenu-root-list"):null;s?e.DomHandler.focus(s):this.updateFocusedHeader({originalEvent:t,focusOnNext:!1}),t.preventDefault()},onHeaderHomeKey(e){this.changeFocusedHeader(e,this.findFirstHeader()),e.preventDefault()},onHeaderEndKey(e){this.changeFocusedHeader(e,this.findLastHeader()),e.preventDefault()},onHeaderEnterKey(t,i){const s=e.DomHandler.findSingle(t.currentTarget,".p-panelmenu-header-action");s?s.click():this.onHeaderClick(t,i),t.preventDefault()},onHeaderActionClick(e,t){t&&t(e)},findNextHeader(t,i=!1){const s=i?t:t.nextElementSibling,n=e.DomHandler.findSingle(s,".p-panelmenu-header");return n?e.DomHandler.hasClass(n,"p-disabled")?this.findNextHeader(n.parentElement):n:null},findPrevHeader(t,i=!1){const s=i?t:t.previousElementSibling,n=e.DomHandler.findSingle(s,".p-panelmenu-header");return n?e.DomHandler.hasClass(n,"p-disabled")?this.findPrevHeader(n.parentElement):n:null},findFirstHeader(){return this.findNextHeader(this.$el.firstElementChild,!0)},findLastHeader(){return this.findPrevHeader(this.$el.lastElementChild,!0)},updateFocusedHeader(t){const{originalEvent:i,focusOnNext:s,selfCheck:n}=t,a=i.currentTarget.closest(".p-panelmenu-panel"),l=n?e.DomHandler.findSingle(a,".p-panelmenu-header"):s?this.findNextHeader(a):this.findPrevHeader(a);l?this.changeFocusedHeader(i,l):s?this.onHeaderHomeKey(i):this.onHeaderEndKey(i)},changeActiveItem(t,i,s=!1){if(!this.isItemDisabled(i)){const n=this.isItemActive(i),a=n?"panel-close":"panel-open";this.activeItem=s?i:this.activeItem&&e.ObjectUtils.equals(i,this.activeItem)?null:i,this.changeExpandedKeys({item:i,expanded:!n}),this.$emit(a,{originalEvent:t,item:i})}},changeExpandedKeys({item:e,expanded:t=!1}){if(this.expandedKeys){let i={...this.expandedKeys};t?i[e.key]=!0:delete i[e.key],this.$emit("update:expandedKeys",i)}},changeFocusedHeader(t,i){i&&e.DomHandler.focus(i)},getPanelClass(e){return["p-panelmenu-panel",this.getItemProp(e,"class")]},getHeaderClass(e){return["p-panelmenu-header",this.getItemProp(e,"headerClass"),{"p-highlight":this.isItemActive(e),"p-disabled":this.isItemDisabled(e)}]},getHeaderActionClass(e,t){return["p-panelmenu-header-action",{"router-link-active":t&&t.isActive,"router-link-active-exact":this.exact&&t&&t.isExactActive}]},getHeaderIconClass(e){return["p-menuitem-icon",this.getItemProp(e,"icon")]},getHeaderToggleIconClass(e){return["p-submenu-icon",this.isItemActive(e)?"pi pi-chevron-down":"pi pi-chevron-right"]}},computed:{id(){return this.$attrs.id||e.UniqueComponentId()}},components:{PanelMenuList:u}};const I=["id"],g=["id","tabindex","aria-label","aria-expanded","aria-controls","aria-disabled","onClick","onKeydown"],f={class:"p-panelmenu-header-content"},y=["href","onClick"],v={class:"p-menuitem-text"},k=["href"],b={class:"p-menuitem-text"},P=["id","aria-labelledby"],C={key:0,class:"p-panelmenu-content"};!function(e,t){void 0===t&&(t={});var i=t.insertAt;if(e&&"undefined"!=typeof document){var s=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.type="text/css","top"===i&&s.firstChild?s.insertBefore(n,s.firstChild):s.appendChild(n),n.styleSheet?n.styleSheet.cssText=e:n.appendChild(document.createTextNode(e))}}("\n.p-panelmenu .p-panelmenu-header-action {\n    display: flex;\n    align-items: center;\n    user-select: none;\n    cursor: pointer;\n    position: relative;\n    text-decoration: none;\n}\n.p-panelmenu .p-panelmenu-header-action:focus {\n    z-index: 1;\n}\n.p-panelmenu .p-submenu-list {\n    margin: 0;\n    padding: 0;\n    list-style: none;\n}\n.p-panelmenu .p-menuitem-link {\n    display: flex;\n    align-items: center;\n    user-select: none;\n    cursor: pointer;\n    text-decoration: none;\n    position: relative;\n    overflow: hidden;\n}\n.p-panelmenu .p-menuitem-text {\n    line-height: 1;\n}\n"),h.render=function(e,t,s,n,a,l){const o=i.resolveComponent("router-link"),r=i.resolveComponent("PanelMenuList");return i.openBlock(),i.createElementBlock("div",{id:l.id,class:"p-panelmenu p-component"},[(i.openBlock(!0),i.createElementBlock(i.Fragment,null,i.renderList(s.model,((t,n)=>(i.openBlock(),i.createElementBlock(i.Fragment,{key:l.getPanelKey(n)},[l.isItemVisible(t)?(i.openBlock(),i.createElementBlock("div",{key:0,style:i.normalizeStyle(l.getItemProp(t,"style")),class:i.normalizeClass(l.getPanelClass(t))},[i.createElementVNode("div",{id:l.getHeaderId(n),class:i.normalizeClass(l.getHeaderClass(t)),tabindex:l.isItemDisabled(t)?-1:s.tabindex,role:"button","aria-label":l.getItemLabel(t),"aria-expanded":l.isItemActive(t),"aria-controls":l.getContentId(n),"aria-disabled":l.isItemDisabled(t),onClick:e=>l.onHeaderClick(e,t),onKeydown:e=>l.onHeaderKeyDown(e,t)},[i.createElementVNode("div",f,[e.$slots.item?(i.openBlock(),i.createBlock(i.resolveDynamicComponent(e.$slots.item),{key:1,item:t},null,8,["item"])):(i.openBlock(),i.createElementBlock(i.Fragment,{key:0},[l.getItemProp(t,"to")&&!l.isItemDisabled(t)?(i.openBlock(),i.createBlock(o,{key:0,to:l.getItemProp(t,"to"),custom:""},{default:i.withCtx((({navigate:e,href:s,isActive:n,isExactActive:a})=>[i.createElementVNode("a",{href:s,class:i.normalizeClass(l.getHeaderActionClass(t,{isActive:n,isExactActive:a})),tabindex:-1,onClick:t=>l.onHeaderActionClick(t,e)},[l.getItemProp(t,"icon")?(i.openBlock(),i.createElementBlock("span",{key:0,class:i.normalizeClass(l.getHeaderIconClass(t))},null,2)):i.createCommentVNode("",!0),i.createElementVNode("span",v,i.toDisplayString(l.getItemLabel(t)),1)],10,y)])),_:2},1032,["to"])):(i.openBlock(),i.createElementBlock("a",{key:1,href:l.getItemProp(t,"url"),class:i.normalizeClass(l.getHeaderActionClass(t)),tabindex:-1},[l.getItemProp(t,"items")?(i.openBlock(),i.createElementBlock("span",{key:0,class:i.normalizeClass(l.getHeaderToggleIconClass(t))},null,2)):i.createCommentVNode("",!0),l.getItemProp(t,"icon")?(i.openBlock(),i.createElementBlock("span",{key:1,class:i.normalizeClass(l.getHeaderIconClass(t))},null,2)):i.createCommentVNode("",!0),i.createElementVNode("span",b,i.toDisplayString(l.getItemLabel(t)),1)],10,k))],64))])],42,g),i.createVNode(i.Transition,{name:"p-toggleable-content"},{default:i.withCtx((()=>[i.withDirectives(i.createElementVNode("div",{id:l.getContentId(n),class:"p-toggleable-content",role:"region","aria-labelledby":l.getHeaderId(n)},[l.getItemProp(t,"items")?(i.openBlock(),i.createElementBlock("div",C,[i.createVNode(r,{panelId:l.getPanelId(n),items:l.getItemProp(t,"items"),template:e.$slots.item,expandedKeys:s.expandedKeys,onItemToggle:l.changeExpandedKeys,onHeaderFocus:l.updateFocusedHeader,exact:s.exact},null,8,["panelId","items","template","expandedKeys","onItemToggle","onHeaderFocus","exact"])])):i.createCommentVNode("",!0)],8,P),[[i.vShow,l.isItemActive(t)]])])),_:2},1024)],6)):i.createCommentVNode("",!0)],64)))),128))],8,I)},module.exports=h;
+"use strict";var e=require("primevue/utils"),t=require("primevue/ripple"),i=require("vue");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n={name:"PanelMenuSub",emits:["item-toggle"],props:{panelId:{type:String,default:null},focusedItemId:{type:String,default:null},items:{type:Array,default:null},level:{type:Number,default:0},template:{type:Function,default:null},activeItemPath:{type:Object,default:null},exact:{type:Boolean,default:!0}},methods:{getItemId(e){return`${this.panelId}_${e.key}`},getItemKey(e){return this.getItemId(e)},getItemProp:(t,i,s)=>t&&t.item?e.ObjectUtils.getItemValue(t.item[i],s):void 0,getItemLabel(e){return this.getItemProp(e,"label")},isItemActive(e){return this.activeItemPath.some((t=>t.key===e.key))},isItemVisible(e){return!1!==this.getItemProp(e,"visible")},isItemDisabled(e){return this.getItemProp(e,"disabled")},isItemFocused(e){return this.focusedItemId===this.getItemId(e)},isItemGroup:t=>e.ObjectUtils.isNotEmpty(t.items),onItemClick(e,t){this.getItemProp(t,"command",{originalEvent:e,item:t.item}),this.$emit("item-toggle",{processedItem:t,expanded:!this.isItemActive(t)})},onItemToggle(e){this.$emit("item-toggle",e)},onItemActionClick(e,t){t&&t(e)},getAriaSetSize(){return this.items.filter((e=>this.isItemVisible(e)&&!this.getItemProp(e,"separator"))).length},getAriaPosInset(e){return e-this.items.slice(0,e).filter((e=>this.isItemVisible(e)&&this.getItemProp(e,"separator"))).length+1},getItemClass(e){return["p-menuitem",this.getItemProp(e,"class"),{"p-focus":this.isItemFocused(e),"p-disabled":this.isItemDisabled(e)}]},getItemActionClass(e,t){return["p-menuitem-link",{"router-link-active":t&&t.isActive,"router-link-active-exact":this.exact&&t&&t.isExactActive}]},getItemIconClass(e){return["p-menuitem-icon",this.getItemProp(e,"icon")]},getItemToggleIconClass(e){return["p-submenu-icon",this.isItemActive(e)?"pi pi-fw pi-chevron-down":"pi pi-fw pi-chevron-right"]},getSeparatorItemClass(e){return["p-menuitem-separator",this.getItemProp(e,"class")]}},directives:{ripple:s(t).default}};const a={class:"p-submenu-list"},l=["id","aria-label","aria-expanded","aria-level","aria-setsize","aria-posinset"],o=["onClick"],r=["href","onClick"],c={class:"p-menuitem-text"},m=["href","target"],d={class:"p-menuitem-text"},p={class:"p-toggleable-content"};n.render=function(e,t,s,n,u,h){const I=i.resolveComponent("router-link"),g=i.resolveComponent("PanelMenuSub",!0),f=i.resolveDirective("ripple");return i.openBlock(),i.createElementBlock("ul",a,[(i.openBlock(!0),i.createElementBlock(i.Fragment,null,i.renderList(s.items,((e,t)=>(i.openBlock(),i.createElementBlock(i.Fragment,{key:h.getItemKey(e)},[h.isItemVisible(e)&&!h.getItemProp(e,"separator")?(i.openBlock(),i.createElementBlock("li",{key:0,id:h.getItemId(e),style:i.normalizeStyle(h.getItemProp(e,"style")),class:i.normalizeClass(h.getItemClass(e)),role:"treeitem","aria-label":h.getItemLabel(e),"aria-expanded":h.isItemGroup(e)?h.isItemActive(e):void 0,"aria-level":s.level+1,"aria-setsize":h.getAriaSetSize(),"aria-posinset":h.getAriaPosInset(t)},[i.createElementVNode("div",{class:"p-menuitem-content",onClick:t=>h.onItemClick(t,e)},[s.template?(i.openBlock(),i.createBlock(i.resolveDynamicComponent(s.template),{key:1,item:e.item},null,8,["item"])):(i.openBlock(),i.createElementBlock(i.Fragment,{key:0},[h.getItemProp(e,"to")&&!h.isItemDisabled(e)?(i.openBlock(),i.createBlock(I,{key:0,to:h.getItemProp(e,"to"),custom:""},{default:i.withCtx((({navigate:t,href:s,isActive:n,isExactActive:a})=>[i.withDirectives((i.openBlock(),i.createElementBlock("a",{href:s,class:i.normalizeClass(h.getItemActionClass(e,{isActive:n,isExactActive:a})),tabindex:"-1","aria-hidden":"true",onClick:e=>h.onItemActionClick(e,t)},[h.getItemProp(e,"icon")?(i.openBlock(),i.createElementBlock("span",{key:0,class:i.normalizeClass(h.getItemIconClass(e))},null,2)):i.createCommentVNode("",!0),i.createElementVNode("span",c,i.toDisplayString(h.getItemLabel(e)),1)],10,r)),[[f]])])),_:2},1032,["to"])):i.withDirectives((i.openBlock(),i.createElementBlock("a",{key:1,href:h.getItemProp(e,"url"),class:i.normalizeClass(h.getItemActionClass(e)),target:h.getItemProp(e,"target"),tabindex:"-1","aria-hidden":"true"},[h.isItemGroup(e)?(i.openBlock(),i.createElementBlock("span",{key:0,class:i.normalizeClass(h.getItemToggleIconClass(e))},null,2)):i.createCommentVNode("",!0),h.getItemProp(e,"icon")?(i.openBlock(),i.createElementBlock("span",{key:1,class:i.normalizeClass(h.getItemIconClass(e))},null,2)):i.createCommentVNode("",!0),i.createElementVNode("span",d,i.toDisplayString(h.getItemLabel(e)),1)],10,m)),[[f]])],64))],8,o),i.createVNode(i.Transition,{name:"p-toggleable-content"},{default:i.withCtx((()=>[i.withDirectives(i.createElementVNode("div",p,[h.isItemVisible(e)&&h.isItemGroup(e)?(i.openBlock(),i.createBlock(g,{key:0,id:h.getItemId(e)+"_list",role:"group",panelId:s.panelId,focusedItemId:s.focusedItemId,items:e.items,level:s.level+1,template:s.template,activeItemPath:s.activeItemPath,exact:s.exact,onItemToggle:h.onItemToggle},null,8,["id","panelId","focusedItemId","items","level","template","activeItemPath","exact","onItemToggle"])):i.createCommentVNode("",!0)],512),[[i.vShow,h.isItemActive(e)]])])),_:2},1024)],14,l)):i.createCommentVNode("",!0),h.isItemVisible(e)&&h.getItemProp(e,"separator")?(i.openBlock(),i.createElementBlock("li",{key:1,style:i.normalizeStyle(h.getItemProp(e,"style")),class:i.normalizeClass(h.getSeparatorItemClass(e)),role:"separator"},null,6)):i.createCommentVNode("",!0)],64)))),128))])};var u={name:"PanelMenuList",emits:["item-toggle","header-focus"],props:{panelId:{type:String,default:null},items:{type:Array,default:null},template:{type:Function,default:null},expandedKeys:{type:Object,default:null},exact:{type:Boolean,default:!0}},searchTimeout:null,searchValue:null,data:()=>({focused:!1,focusedItem:null,activeItemPath:[]}),watch:{expandedKeys(e){this.autoUpdateActiveItemPath(e)}},mounted(){this.autoUpdateActiveItemPath(this.expandedKeys)},methods:{getItemProp:(t,i)=>t&&t.item?e.ObjectUtils.getItemValue(t.item[i]):void 0,getItemLabel(e){return this.getItemProp(e,"label")},isItemVisible(e){return!1!==this.getItemProp(e,"visible")},isItemDisabled(e){return this.getItemProp(e,"disabled")},isItemActive(e){return this.activeItemPath.some((t=>t.key===e.parentKey))},isItemGroup:t=>e.ObjectUtils.isNotEmpty(t.items),onFocus(e){this.focused=!0,this.focusedItem=this.focusedItem||(this.isElementInPanel(e,e.relatedTarget)?this.findFirstItem():this.findLastItem())},onBlur(){this.focused=!1,this.focusedItem=null,this.searchValue=""},onKeyDown(t){const i=t.metaKey||t.ctrlKey;switch(t.code){case"ArrowDown":this.onArrowDownKey(t);break;case"ArrowUp":this.onArrowUpKey(t);break;case"ArrowLeft":this.onArrowLeftKey(t);break;case"ArrowRight":this.onArrowRightKey(t);break;case"Home":this.onHomeKey(t);break;case"End":this.onEndKey(t);break;case"Space":this.onSpaceKey(t);break;case"Enter":this.onEnterKey(t);break;case"Escape":case"Tab":case"PageDown":case"PageUp":case"Backspace":case"ShiftLeft":case"ShiftRight":break;default:!i&&e.ObjectUtils.isPrintableCharacter(t.key)&&this.searchItems(t,t.key)}},onArrowDownKey(t){const i=e.ObjectUtils.isNotEmpty(this.focusedItem)?this.findNextItem(this.focusedItem):this.findFirstItem();this.changeFocusedItem({originalEvent:t,processedItem:i,focusOnNext:!0}),t.preventDefault()},onArrowUpKey(t){const i=e.ObjectUtils.isNotEmpty(this.focusedItem)?this.findPrevItem(this.focusedItem):this.findLastItem();this.changeFocusedItem({originalEvent:t,processedItem:i,selfCheck:!0}),t.preventDefault()},onArrowLeftKey(t){if(e.ObjectUtils.isNotEmpty(this.focusedItem)){this.activeItemPath.some((e=>e.key===this.focusedItem.key))?this.activeItemPath=this.activeItemPath.filter((e=>e.key!==this.focusedItem.key)):this.focusedItem=e.ObjectUtils.isNotEmpty(this.focusedItem.parent)?this.focusedItem.parent:this.focusedItem,t.preventDefault()}},onArrowRightKey(t){if(e.ObjectUtils.isNotEmpty(this.focusedItem)){if(this.isItemGroup(this.focusedItem)){this.activeItemPath.some((e=>e.key===this.focusedItem.key))?this.onArrowDownKey(t):(this.activeItemPath=this.activeItemPath.filter((e=>e.parentKey!==this.focusedItem.parentKey)),this.activeItemPath.push(this.focusedItem))}t.preventDefault()}},onHomeKey(e){this.changeFocusedItem({originalEvent:e,processedItem:this.findFirstItem(),allowHeaderFocus:!1}),e.preventDefault()},onEndKey(e){this.changeFocusedItem({originalEvent:e,processedItem:this.findLastItem(),focusOnNext:!0,allowHeaderFocus:!1}),e.preventDefault()},onEnterKey(t){if(e.ObjectUtils.isNotEmpty(this.focusedItem)){const t=e.DomHandler.findSingle(this.$el,`li[id="${this.focusedItemId}"]`),i=t&&(e.DomHandler.findSingle(t,".p-menuitem-link")||e.DomHandler.findSingle(t,"a,button"));i?i.click():t&&t.click()}t.preventDefault()},onSpaceKey(e){this.onEnterKey(e)},onItemToggle(t){const{processedItem:i,expanded:s}=t;this.expandedKeys?this.$emit("item-toggle",{item:i.item,expanded:s}):(this.activeItemPath=this.activeItemPath.filter((e=>e.parentKey!==i.parentKey)),s&&this.activeItemPath.push(i)),this.focusedItem=i,e.DomHandler.focus(this.$el)},isElementInPanel(e,t){const i=e.currentTarget.closest(".p-panelmenu-panel");return i&&i.contains(t)},isItemMatched(e){return this.isValidItem(e)&&this.getItemLabel(e).toLocaleLowerCase(this.searchLocale).startsWith(this.searchValue.toLocaleLowerCase(this.searchLocale))},isVisibleItem(e){return!!e&&(0===e.level||this.isItemActive(e))&&this.isItemVisible(e)},isValidItem(e){return!!e&&!this.isItemDisabled(e)},findFirstItem(){return this.visibleItems.find((e=>this.isValidItem(e)))},findLastItem(){return e.ObjectUtils.findLast(this.visibleItems,(e=>this.isValidItem(e)))},findNextItem(e){const t=this.visibleItems.findIndex((t=>t.key===e.key));return(t<this.visibleItems.length-1?this.visibleItems.slice(t+1).find((e=>this.isValidItem(e))):void 0)||e},findPrevItem(t){const i=this.visibleItems.findIndex((e=>e.key===t.key));return(i>0?e.ObjectUtils.findLast(this.visibleItems.slice(0,i),(e=>this.isValidItem(e))):void 0)||t},searchItems(t,i){this.searchValue=(this.searchValue||"")+i;let s=null,n=!1;if(e.ObjectUtils.isNotEmpty(this.focusedItem)){const t=this.visibleItems.findIndex((e=>e.key===this.focusedItem.key));s=this.visibleItems.slice(t).find((e=>this.isItemMatched(e))),s=e.ObjectUtils.isEmpty(s)?this.visibleItems.slice(0,t).find((e=>this.isItemMatched(e))):s}else s=this.visibleItems.find((e=>this.isItemMatched(e)));return e.ObjectUtils.isNotEmpty(s)&&(n=!0),e.ObjectUtils.isEmpty(s)&&e.ObjectUtils.isEmpty(this.focusedItem)&&(s=this.findFirstItem()),e.ObjectUtils.isNotEmpty(s)&&this.changeFocusedItem({originalEvent:t,processedItem:s,allowHeaderFocus:!1}),this.searchTimeout&&clearTimeout(this.searchTimeout),this.searchTimeout=setTimeout((()=>{this.searchValue="",this.searchTimeout=null}),500),n},changeFocusedItem(t){const{originalEvent:i,processedItem:s,focusOnNext:n,selfCheck:a,allowHeaderFocus:l=!0}=t;e.ObjectUtils.isNotEmpty(this.focusedItem)&&this.focusedItem.key!==s.key?(this.focusedItem=s,this.scrollInView()):l&&this.$emit("header-focus",{originalEvent:i,focusOnNext:n,selfCheck:a})},scrollInView(){const t=e.DomHandler.findSingle(this.$el,`li[id="${this.focusedItemId}"]`);t&&t.scrollIntoView&&t.scrollIntoView({block:"nearest",inline:"start"})},autoUpdateActiveItemPath(e){this.activeItemPath=Object.entries(e||{}).reduce(((e,[t,i])=>{if(i){const i=this.findProcessedItemByItemKey(t);i&&e.push(i)}return e}),[])},findProcessedItemByItemKey(e,t,i=0){if(!(t=t||0===i&&this.processedItems))return null;for(let s=0;s<t.length;s++){const n=t[s];if(this.getItemProp(n,"key")===e)return n;const a=this.findProcessedItemByItemKey(e,n.items,i+1);if(a)return a}},createProcessedItems(e,t=0,i={},s=""){const n=[];return e&&e.forEach(((e,a)=>{const l=(""!==s?s+"_":"")+a,o={item:e,index:a,level:t,key:l,parent:i,parentKey:s};o.items=this.createProcessedItems(e.items,t+1,o,l),n.push(o)})),n},flatItems(e,t=[]){return e&&e.forEach((e=>{this.isVisibleItem(e)&&(t.push(e),this.flatItems(e.items,t))})),t}},computed:{processedItems(){return this.createProcessedItems(this.items||[])},visibleItems(){return this.flatItems(this.processedItems)},focusedItemId(){return e.ObjectUtils.isNotEmpty(this.focusedItem)?`${this.panelId}_${this.focusedItem.key}`:null}},components:{PanelMenuSub:n}};u.render=function(e,t,s,n,a,l){const o=i.resolveComponent("PanelMenuSub");return i.openBlock(),i.createBlock(o,{id:s.panelId+"_list",class:"p-panelmenu-root-list",role:"tree",tabindex:-1,"aria-activedescendant":a.focused?l.focusedItemId:void 0,panelId:s.panelId,focusedItemId:a.focused?l.focusedItemId:void 0,items:l.processedItems,template:s.template,activeItemPath:a.activeItemPath,exact:s.exact,onFocus:l.onFocus,onBlur:l.onBlur,onKeydown:l.onKeyDown,onItemToggle:l.onItemToggle},null,8,["id","aria-activedescendant","panelId","focusedItemId","items","template","activeItemPath","exact","onFocus","onBlur","onKeydown","onItemToggle"])};var h={name:"PanelMenu",emits:["update:expandedKeys","panel-open","panel-close"],props:{model:{type:Array,default:null},expandedKeys:{type:Object,default:null},exact:{type:Boolean,default:!0},tabindex:{type:Number,default:0}},data(){return{id:this.$attrs.id,activeItem:null}},watch:{"$attrs.id":function(t){this.id=t||e.UniqueComponentId()}},mounted(){this.id=this.id||e.UniqueComponentId()},methods:{getItemProp:(t,i)=>t?e.ObjectUtils.getItemValue(t[i]):void 0,getItemLabel(e){return this.getItemProp(e,"label")},isItemActive(t){return this.expandedKeys?this.expandedKeys[this.getItemProp(t,"key")]:e.ObjectUtils.equals(t,this.activeItem)},isItemVisible(e){return!1!==this.getItemProp(e,"visible")},isItemDisabled(e){return this.getItemProp(e,"disabled")},getPanelId(e){return`${this.id}_${e}`},getPanelKey(e){return this.getPanelId(e)},getHeaderId(e){return`${this.getPanelId(e)}_header`},getContentId(e){return`${this.getPanelId(e)}_content`},onHeaderClick(t,i){this.isItemDisabled(i)?t.preventDefault():(i.command&&i.command({originalEvent:t,item:i}),this.changeActiveItem(t,i),e.DomHandler.focus(t.currentTarget))},onHeaderKeyDown(e,t){switch(e.code){case"ArrowDown":this.onHeaderArrowDownKey(e);break;case"ArrowUp":this.onHeaderArrowUpKey(e);break;case"Home":this.onHeaderHomeKey(e);break;case"End":this.onHeaderEndKey(e);break;case"Enter":case"Space":this.onHeaderEnterKey(e,t)}},onHeaderArrowDownKey(t){const i=e.DomHandler.hasClass(t.currentTarget,"p-highlight")?e.DomHandler.findSingle(t.currentTarget.nextElementSibling,".p-panelmenu-root-list"):null;i?e.DomHandler.focus(i):this.updateFocusedHeader({originalEvent:t,focusOnNext:!0}),t.preventDefault()},onHeaderArrowUpKey(t){const i=this.findPrevHeader(t.currentTarget.parentElement)||this.findLastHeader(),s=e.DomHandler.hasClass(i,"p-highlight")?e.DomHandler.findSingle(i.nextElementSibling,".p-panelmenu-root-list"):null;s?e.DomHandler.focus(s):this.updateFocusedHeader({originalEvent:t,focusOnNext:!1}),t.preventDefault()},onHeaderHomeKey(e){this.changeFocusedHeader(e,this.findFirstHeader()),e.preventDefault()},onHeaderEndKey(e){this.changeFocusedHeader(e,this.findLastHeader()),e.preventDefault()},onHeaderEnterKey(t,i){const s=e.DomHandler.findSingle(t.currentTarget,".p-panelmenu-header-action");s?s.click():this.onHeaderClick(t,i),t.preventDefault()},onHeaderActionClick(e,t){t&&t(e)},findNextHeader(t,i=!1){const s=i?t:t.nextElementSibling,n=e.DomHandler.findSingle(s,".p-panelmenu-header");return n?e.DomHandler.hasClass(n,"p-disabled")?this.findNextHeader(n.parentElement):n:null},findPrevHeader(t,i=!1){const s=i?t:t.previousElementSibling,n=e.DomHandler.findSingle(s,".p-panelmenu-header");return n?e.DomHandler.hasClass(n,"p-disabled")?this.findPrevHeader(n.parentElement):n:null},findFirstHeader(){return this.findNextHeader(this.$el.firstElementChild,!0)},findLastHeader(){return this.findPrevHeader(this.$el.lastElementChild,!0)},updateFocusedHeader(t){const{originalEvent:i,focusOnNext:s,selfCheck:n}=t,a=i.currentTarget.closest(".p-panelmenu-panel"),l=n?e.DomHandler.findSingle(a,".p-panelmenu-header"):s?this.findNextHeader(a):this.findPrevHeader(a);l?this.changeFocusedHeader(i,l):s?this.onHeaderHomeKey(i):this.onHeaderEndKey(i)},changeActiveItem(t,i,s=!1){if(!this.isItemDisabled(i)){const n=this.isItemActive(i),a=n?"panel-close":"panel-open";this.activeItem=s?i:this.activeItem&&e.ObjectUtils.equals(i,this.activeItem)?null:i,this.changeExpandedKeys({item:i,expanded:!n}),this.$emit(a,{originalEvent:t,item:i})}},changeExpandedKeys({item:e,expanded:t=!1}){if(this.expandedKeys){let i={...this.expandedKeys};t?i[e.key]=!0:delete i[e.key],this.$emit("update:expandedKeys",i)}},changeFocusedHeader(t,i){i&&e.DomHandler.focus(i)},getPanelClass(e){return["p-panelmenu-panel",this.getItemProp(e,"class")]},getHeaderClass(e){return["p-panelmenu-header",this.getItemProp(e,"headerClass"),{"p-highlight":this.isItemActive(e),"p-disabled":this.isItemDisabled(e)}]},getHeaderActionClass(e,t){return["p-panelmenu-header-action",{"router-link-active":t&&t.isActive,"router-link-active-exact":this.exact&&t&&t.isExactActive}]},getHeaderIconClass(e){return["p-menuitem-icon",this.getItemProp(e,"icon")]},getHeaderToggleIconClass(e){return["p-submenu-icon",this.isItemActive(e)?"pi pi-chevron-down":"pi pi-chevron-right"]}},components:{PanelMenuList:u}};const I=["id"],g=["id","tabindex","aria-label","aria-expanded","aria-controls","aria-disabled","onClick","onKeydown"],f={class:"p-panelmenu-header-content"},y=["href","onClick"],v={class:"p-menuitem-text"},k=["href"],b={class:"p-menuitem-text"},P=["id","aria-labelledby"],C={key:0,class:"p-panelmenu-content"};!function(e,t){void 0===t&&(t={});var i=t.insertAt;if(e&&"undefined"!=typeof document){var s=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.type="text/css","top"===i&&s.firstChild?s.insertBefore(n,s.firstChild):s.appendChild(n),n.styleSheet?n.styleSheet.cssText=e:n.appendChild(document.createTextNode(e))}}("\n.p-panelmenu .p-panelmenu-header-action {\n    display: flex;\n    align-items: center;\n    user-select: none;\n    cursor: pointer;\n    position: relative;\n    text-decoration: none;\n}\n.p-panelmenu .p-panelmenu-header-action:focus {\n    z-index: 1;\n}\n.p-panelmenu .p-submenu-list {\n    margin: 0;\n    padding: 0;\n    list-style: none;\n}\n.p-panelmenu .p-menuitem-link {\n    display: flex;\n    align-items: center;\n    user-select: none;\n    cursor: pointer;\n    text-decoration: none;\n    position: relative;\n    overflow: hidden;\n}\n.p-panelmenu .p-menuitem-text {\n    line-height: 1;\n}\n"),h.render=function(e,t,s,n,a,l){const o=i.resolveComponent("router-link"),r=i.resolveComponent("PanelMenuList");return i.openBlock(),i.createElementBlock("div",{id:a.id,class:"p-panelmenu p-component"},[(i.openBlock(!0),i.createElementBlock(i.Fragment,null,i.renderList(s.model,((t,n)=>(i.openBlock(),i.createElementBlock(i.Fragment,{key:l.getPanelKey(n)},[l.isItemVisible(t)?(i.openBlock(),i.createElementBlock("div",{key:0,style:i.normalizeStyle(l.getItemProp(t,"style")),class:i.normalizeClass(l.getPanelClass(t))},[i.createElementVNode("div",{id:l.getHeaderId(n),class:i.normalizeClass(l.getHeaderClass(t)),tabindex:l.isItemDisabled(t)?-1:s.tabindex,role:"button","aria-label":l.getItemLabel(t),"aria-expanded":l.isItemActive(t),"aria-controls":l.getContentId(n),"aria-disabled":l.isItemDisabled(t),onClick:e=>l.onHeaderClick(e,t),onKeydown:e=>l.onHeaderKeyDown(e,t)},[i.createElementVNode("div",f,[e.$slots.item?(i.openBlock(),i.createBlock(i.resolveDynamicComponent(e.$slots.item),{key:1,item:t},null,8,["item"])):(i.openBlock(),i.createElementBlock(i.Fragment,{key:0},[l.getItemProp(t,"to")&&!l.isItemDisabled(t)?(i.openBlock(),i.createBlock(o,{key:0,to:l.getItemProp(t,"to"),custom:""},{default:i.withCtx((({navigate:e,href:s,isActive:n,isExactActive:a})=>[i.createElementVNode("a",{href:s,class:i.normalizeClass(l.getHeaderActionClass(t,{isActive:n,isExactActive:a})),tabindex:-1,onClick:t=>l.onHeaderActionClick(t,e)},[l.getItemProp(t,"icon")?(i.openBlock(),i.createElementBlock("span",{key:0,class:i.normalizeClass(l.getHeaderIconClass(t))},null,2)):i.createCommentVNode("",!0),i.createElementVNode("span",v,i.toDisplayString(l.getItemLabel(t)),1)],10,y)])),_:2},1032,["to"])):(i.openBlock(),i.createElementBlock("a",{key:1,href:l.getItemProp(t,"url"),class:i.normalizeClass(l.getHeaderActionClass(t)),tabindex:-1},[l.getItemProp(t,"items")?(i.openBlock(),i.createElementBlock("span",{key:0,class:i.normalizeClass(l.getHeaderToggleIconClass(t))},null,2)):i.createCommentVNode("",!0),l.getItemProp(t,"icon")?(i.openBlock(),i.createElementBlock("span",{key:1,class:i.normalizeClass(l.getHeaderIconClass(t))},null,2)):i.createCommentVNode("",!0),i.createElementVNode("span",b,i.toDisplayString(l.getItemLabel(t)),1)],10,k))],64))])],42,g),i.createVNode(i.Transition,{name:"p-toggleable-content"},{default:i.withCtx((()=>[i.withDirectives(i.createElementVNode("div",{id:l.getContentId(n),class:"p-toggleable-content",role:"region","aria-labelledby":l.getHeaderId(n)},[l.getItemProp(t,"items")?(i.openBlock(),i.createElementBlock("div",C,[i.createVNode(r,{panelId:l.getPanelId(n),items:l.getItemProp(t,"items"),template:e.$slots.item,expandedKeys:s.expandedKeys,onItemToggle:l.changeExpandedKeys,onHeaderFocus:l.updateFocusedHeader,exact:s.exact},null,8,["panelId","items","template","expandedKeys","onItemToggle","onHeaderFocus","exact"])])):i.createCommentVNode("",!0)],8,P),[[i.vShow,l.isItemActive(t)]])])),_:2},1024)],6)):i.createCommentVNode("",!0)],64)))),128))],8,I)},module.exports=h;

package/panelmenu/panelmenu.esm.js

@@ -427,7 +427,7 @@ var script$1 = {
         onEnterKey(event) {
             if (ObjectUtils.isNotEmpty(this.focusedItem)) {
                 const element = DomHandler.findSingle(this.$el, `li[id="${`${this.focusedItemId}`}"]`);
-                const anchorElement = element && DomHandler.findSingle(element, '.p-menuitem-link');
+                const anchorElement = element && (DomHandler.findSingle(element, '.p-menuitem-link') || DomHandler.findSingle(element, 'a,button'));
 
                 anchorElement ? anchorElement.click() : element && element.click();
             }
@@ -663,10 +663,18 @@ var script = {
     },
     data() {
         return {
+            id: this.$attrs.id,
             activeItem: null
         };
     },
-
+    watch: {
+        '$attrs.id': function (newValue) {
+            this.id = newValue || UniqueComponentId();
+        }
+    },
+    mounted() {
+        this.id = this.id || UniqueComponentId();
+    },
     methods: {
         getItemProp(item, name) {
             return item ? ObjectUtils.getItemValue(item[name]) : undefined;
@@ -840,11 +848,6 @@ var script = {
             return ['p-submenu-icon', this.isItemActive(item) ? 'pi pi-chevron-down' : 'pi pi-chevron-right'];
         }
     },
-    computed: {
-        id() {
-            return this.$attrs.id || UniqueComponentId();
-        }
-    },
     components: {
         PanelMenuList: script$1
     }
@@ -868,7 +871,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_PanelMenuList = resolveComponent("PanelMenuList");
 
   return (openBlock(), createElementBlock("div", {
-    id: $options.id,
+    id: $data.id,
     class: "p-panelmenu p-component"
   }, [
     (openBlock(true), createElementBlock(Fragment, null, renderList($props.model, (item, index) => {