UNPKG

primevue

Version:

[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![npm version](https://badge.fury.io/js/primevue.svg)](https://badge.fury.io/js/primevue)

2 lines (1 loc) 8.21 kB
import{DomHandler as e}from"primevue/utils";import t from"primevue/ripple";import{resolveComponent as n,resolveDirective as i,openBlock as s,createBlock as o,Transition as l,withCtx as r,Fragment as a,renderList as c,withDirectives as d,createVNode as u,toDisplayString as m,createCommentVNode as p}from"vue";var h={emits:["leaf-click"],name:"sub-menu",props:{model:{type:Array,default:null},root:{type:Boolean,default:!1},parentActive:{type:Boolean,default:!1}},watch:{parentActive(e){e||(this.activeItem=null)}},data:()=>({activeItem:null}),methods:{onItemMouseEnter(e,t){t.disabled?e.preventDefault():this.activeItem=t},onItemClick(e,t,n){t.disabled?e.preventDefault():(t.command&&t.command({originalEvent:e,item:t}),t.items&&(this.activeItem&&t===this.activeItem?this.activeItem=null:this.activeItem=t),t.items||this.onLeafClick(),t.to&&n&&n(e))},onLeafClick(){this.activeItem=null,this.$emit("leaf-click")},onEnter(){this.position()},position(){const t=this.$refs.container.parentElement,n=e.getOffset(this.$refs.container.parentElement),i=e.getViewport(),s=this.$refs.container.offsetParent?this.$refs.container.offsetWidth:e.getHiddenElementOuterWidth(this.$refs.container),o=e.getOuterWidth(t.children[0]);this.$refs.container.style.top="0px",parseInt(n.left,10)+o+s>i.width-e.calculateScrollbarWidth()?this.$refs.container.style.left=-1*s+"px":this.$refs.container.style.left=o+"px"},getItemClass(e){return["p-menuitem",e.class,{"p-menuitem-active":this.activeItem===e}]},getLinkClass:e=>["p-menuitem-link",{"p-disabled":e.disabled}],visible:e=>"function"==typeof e.visible?e.visible():!1!==e.visible},computed:{containerClass(){return{"p-submenu-list":!this.root}}},directives:{ripple:t}};const f={class:"p-menuitem-text"},b={class:"p-menuitem-text"},v={key:0,class:"p-submenu-icon pi pi-angle-right"};h.render=function(e,t,h,L,C,x){const y=n("router-link"),g=n("sub-menu"),k=i("ripple");return s(),o(l,{name:"p-contextmenusub",onEnter:x.onEnter},{default:r((()=>[h.root||h.parentActive?(s(),o("ul",{key:0,ref:"container",class:x.containerClass,role:"menu"},[(s(!0),o(a,null,c(h.model,((e,t)=>(s(),o(a,null,[x.visible(e)&&!e.separator?(s(),o("li",{role:"none",class:x.getItemClass(e),style:e.style,key:e.label+t,onMouseenter:t=>x.onItemMouseEnter(t,e)},[e.to&&!e.disabled?(s(),o(y,{key:0,to:e.to,custom:""},{default:r((({navigate:t,href:n})=>[d(u("a",{href:n,onClick:n=>x.onItemClick(n,e,t),class:x.getLinkClass(e),role:"menuitem"},[u("span",{class:["p-menuitem-icon",e.icon]},null,2),u("span",f,m(e.label),1)],10,["href","onClick"]),[[k]])])),_:2},1032,["to"])):d((s(),o("a",{key:1,href:e.url,class:x.getLinkClass(e),target:e.target,onClick:t=>x.onItemClick(t,e),"aria-haspopup":null!=e.items,"aria-expanded":e===C.activeItem,role:"menuitem",tabindex:e.disabled?null:"0"},[u("span",{class:["p-menuitem-icon",e.icon]},null,2),u("span",b,m(e.label),1),e.items?(s(),o("span",v)):p("",!0)],10,["href","target","onClick","aria-haspopup","aria-expanded","tabindex"])),[[k]]),x.visible(e)&&e.items?(s(),o(g,{model:e.items,key:e.label+"_sub_",onLeafClick:x.onLeafClick,parentActive:e===C.activeItem},null,8,["model","onLeafClick","parentActive"])):p("",!0)],46,["onMouseenter"])):p("",!0),x.visible(e)&&e.separator?(s(),o("li",{class:["p-menu-separator",e.class],style:e.style,key:"separator"+t,role:"separator"},null,6)):p("",!0)],64)))),256))],2)):p("",!0)])),_:1},8,["onEnter"])};var L={props:{model:{type:Array,default:null},appendTo:{type:String,default:null},autoZIndex:{type:Boolean,default:!0},baseZIndex:{type:Number,default:0},global:{type:Boolean,default:!1}},target:null,outsideClickListener:null,resizeListener:null,documentContextMenuListener:null,pageX:null,pageY:null,container:null,data:()=>({visible:!1}),beforeUnmount(){this.restoreAppend(),this.unbindResizeListener(),this.unbindOutsideClickListener(),this.unbindDocumentContextMenuListener(),this.container=null},mounted(){this.global&&this.bindDocumentContextMenuListener()},methods:{itemClick(e){const t=e.item;t.command&&(t.command(e),e.originalEvent.preventDefault()),this.hide()},toggle(e){this.visible?this.hide():this.show(e)},onLeafClick(){this.hide()},show(e){this.pageX=e.pageX,this.pageY=e.pageY,this.visible?this.position():this.visible=!0,e.stopPropagation(),e.preventDefault()},hide(){this.visible=!1},onEnter(){this.appendContainer(),this.position(),this.bindOutsideClickListener(),this.bindResizeListener(),this.autoZIndex&&(this.container.style.zIndex=String(this.baseZIndex+e.generateZIndex()))},onLeave(){this.unbindOutsideClickListener(),this.unbindResizeListener()},position(){let t=this.pageX+1,n=this.pageY+1,i=this.container.offsetParent?this.container.offsetWidth:e.getHiddenElementOuterWidth(this.container),s=this.container.offsetParent?this.container.offsetHeight:e.getHiddenElementOuterHeight(this.container),o=e.getViewport();t+i-document.body.scrollLeft>o.width&&(t-=i),n+s-document.body.scrollTop>o.height&&(n-=s),t<document.body.scrollLeft&&(t=document.body.scrollLeft),n<document.body.scrollTop&&(n=document.body.scrollTop),this.container.style.left=t+"px",this.container.style.top=n+"px"},bindOutsideClickListener(){this.outsideClickListener||(this.outsideClickListener=e=>{this.visible&&this.container&&!this.container.contains(e.target)&&!e.ctrlKey&&this.hide()},document.addEventListener("click",this.outsideClickListener))},unbindOutsideClickListener(){this.outsideClickListener&&(document.removeEventListener("click",this.outsideClickListener),this.outsideClickListener=null)},bindResizeListener(){this.resizeListener||(this.resizeListener=()=>{this.visible&&this.hide()},window.addEventListener("resize",this.resizeListener))},unbindResizeListener(){this.resizeListener&&(window.removeEventListener("resize",this.resizeListener),this.resizeListener=null)},appendContainer(){this.appendTo&&("body"===this.appendTo?document.body.appendChild(this.container):document.getElementById(this.appendTo).appendChild(this.container))},restoreAppend(){this.container&&this.appendTo&&("body"===this.appendTo?document.body.removeChild(this.container):document.getElementById(this.appendTo).removeChild(this.container))},bindDocumentContextMenuListener(){this.documentContextMenuListener||(this.documentContextMenuListener=e=>{this.show(e)},document.addEventListener("contextmenu",this.documentContextMenuListener))},unbindDocumentContextMenuListener(){this.documentContextMenuListener&&(document.removeEventListener("contextmenu",this.documentContextMenuListener),this.documentContextMenuListener=null)},containerRef(e){this.container=e}},components:{ContextMenuSub:h}};!function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],s=document.createElement("style");s.type="text/css","top"===n&&i.firstChild?i.insertBefore(s,i.firstChild):i.appendChild(s),s.styleSheet?s.styleSheet.cssText=e:s.appendChild(document.createTextNode(e))}}("\n.p-contextmenu {\n position: absolute;\n}\n.p-contextmenu ul {\n margin: 0;\n padding: 0;\n list-style: none;\n}\n.p-contextmenu .p-submenu-list {\n position: absolute;\n min-width: 100%;\n z-index: 1;\n}\n.p-contextmenu .p-menuitem-link {\n cursor: pointer;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n text-decoration: none;\n overflow: hidden;\n position: relative;\n}\n.p-contextmenu .p-menuitem-text {\n line-height: 1;\n}\n.p-contextmenu .p-menuitem {\n position: relative;\n}\n.p-contextmenu .p-menuitem-link .p-submenu-icon {\n margin-left: auto;\n}\n.p-contextmenu-enter-from {\n opacity: 0;\n}\n.p-contextmenu-enter-active {\n -webkit-transition: opacity 250ms;\n transition: opacity 250ms;\n}\n"),L.render=function(e,t,i,a,c,d){const m=n("ContextMenuSub");return s(),o(l,{name:"p-contextmenu",onEnter:d.onEnter,onLeave:d.onLeave},{default:r((()=>[c.visible?(s(),o("div",{key:0,ref:d.containerRef,class:"p-contextmenu p-component"},[u(m,{model:i.model,root:!0,onLeafClick:d.onLeafClick},null,8,["model","onLeafClick"])],512)):p("",!0)])),_:1},8,["onEnter","onLeave"])};export default L;