@imengyu/vue3-context-menu/lib/vue3-context-menu.umd.js

A context menu component for Vue3

(function(F,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(F=typeof globalThis<"u"?globalThis:F||self,e(F["vue3-context-menu"]={},F.Vue))})(this,function(F,e){"use strict";let U=null;function Pe(){return U!==null}function Ee(t){U&&ge(),U=t}function pe(t){t===U&&(U=null)}function ge(){U&&(U.closeMenu(),U=null)}const V={defaultDirection:"br",defaultMinWidth:100,defaultMaxWidth:600,defaultZindex:100,defaultZoom:1,defaultAdjustPadding:{x:0,y:10}};function X(t,l){let s=t.offsetTop;return t.offsetParent!=null&&t.offsetParent!=l&&(s-=t.offsetParent.scrollTop,s+=X(t.offsetParent,l)),s}function Z(t,l){let s=t.offsetLeft;return t.offsetParent!=null&&t.offsetParent!=l&&(s-=t.offsetParent.scrollLeft,s+=Z(t.offsetParent,l)),s}function $e(t,l,s,r){return{x:Z(t,r)+l,y:X(t,r)+s}}const ce="mx-menu-default-container",Ne="mx-menu-container-";let Te=0;function Ce(t){const{getContainer:l,zIndex:s}=t;if(l){const h=typeof l=="function"?l():l;if(h){let o=h.getAttribute("id");return o||(o=Ne+Te++,h.setAttribute("id",o)),{eleId:o,container:h,isNew:!1}}}let r=document.getElementById(ce);return r||(r=document.createElement("div"),r.setAttribute("id",ce),r.setAttribute("class","mx-menu-ghost-host fullscreen"),document.body.appendChild(r)),r.style.zIndex=(s==null?void 0:s.toString())||V.defaultZindex.toString(),{eleId:ce,container:r,isNew:!0}}function je(t){let l=0;for(let s=0;s<t.length;s++){const r=t.charCodeAt(s);l=(l<<5)-l+r,l|=0}return l}function be(t){return typeof t=="number"?`${t}px`:t}const D=e.defineComponent({props:{vnode:{type:null},data:{type:null,default:null}},setup(t){const{vnode:l,data:s}=e.toRefs(t);return()=>typeof l.value=="function"?l.value(s.value):l.value}});function Fe(t,l){const s={...t};return delete s[l],s}var Le=Object.defineProperty,ze=(t,l,s)=>l in t?Le(t,l,{enumerable:!0,configurable:!0,writable:!0,value:s}):t[l]=s,ye=(t,l,s)=>ze(t,typeof l!="symbol"?l+"":l,s);class ke{constructor(l,s){ye(this,"x",0),ye(this,"y",0),this.x=l||0,this.y=s||0}set(l,s){this.x=l,this.y=s}substract(l){this.x-=l.x,this.y-=l.y}}function xe(t){const{onDown:l,onMove:s,onUp:r}=t,h=new ke,o=new ke;let B;function d(p){p.stopPropagation(),o.set(p.x,p.y),o.substract(h),s(h,o,p,B)}function C(p){r(p,B),h.set(0,0),document.removeEventListener("mousemove",d),document.removeEventListener("mouseup",C)}return(p,k)=>l(p,k)?(B=k,h.set(p.x,p.y),document.addEventListener("mousemove",d),document.addEventListener("mouseup",C),p.stopPropagation(),!0):!1}function Ae(t,l){let s=0;return{start(){s>0&&clearInterval(s),s=setInterval(()=>{s=0,l()},t)},stop(){s>0&&(clearInterval(s),s=0)}}}const Q=[],Me=Ae(100,()=>{for(const t of Q)t()});function Ve(t,l,s,r){let h=0,o=0;function B(){t.value&&(l&&h!==t.value.offsetWidth&&l(t.value.offsetWidth),s&&o!==t.value.offsetHeight&&s(t.value.offsetHeight),r&&(h!==t.value.offsetWidth||o!==t.value.offsetHeight)&&r(t.value.offsetWidth,t.value.offsetHeight),h=t.value.offsetWidth,o=t.value.offsetHeight)}return{startResizeChecker(){Me.start(),Q.push(B)},stopResizeChecker(){const d=Q.indexOf(B);d>=0&&Q.splice(d,1),Q.length===0&&Me.stop()}}}const Se=140,De=70,Ke=e.defineComponent({__name:"ScrollRect",props:{scroll:{type:String,default:"both"},scrollBarAlwaysShow:{type:Boolean,default:!1},scrollBarBackgroundClickable:{type:Boolean,default:!1},height:{type:Number,default:void 0},width:{type:Number,default:void 0},maxHeight:{type:Number,default:void 0},maxWidth:{type:Number,default:void 0},containerClass:{type:String,default:""},containerStyle:{type:null}},emits:["scroll","resized"],setup(t,{expose:l,emit:s}){const r=t,h=s,o=e.ref(),B=e.ref(),d=e.ref(),C=e.ref(),p=e.ref(),k=e.ref(),I=e.ref(!1),$=e.computed(()=>r.scroll==="horizontal"||r.scroll==="both"),R=e.computed(()=>r.scroll==="vertical"||r.scroll==="both"),m=e.reactive({show:!1,size:0,sizeRaw:0,pos:0}),x=e.reactive({show:!1,size:0,sizeRaw:0,pos:0});let O=0,f=0,i=0,b=0,y=null;const M={attributes:!0,childList:!0};function S(){if(o.value){if(m.show){const n=o.value.offsetWidth/o.value.scrollWidth;m.sizeRaw=n*o.value.offsetWidth,m.size=n*100,m.pos=o.value.scrollLeft/(o.value.scrollWidth-o.value.offsetWidth)*(100-m.size),n>=1&&(m.show=!1)}if(x.show){const n=o.value.offsetHeight/o.value.scrollHeight;x.sizeRaw=n*o.value.offsetHeight,x.size=n*100,x.pos=o.value.scrollTop/(o.value.scrollHeight-o.value.offsetHeight)*(100-x.size),n>=1&&(x.show=!1)}h("scroll",o.value.scrollLeft,o.value.scrollTop)}}function c(n=!1){if(!o.value)return;let u=$.value,g=R.value;const a=u&&(O!==o.value.scrollWidth||i!==o.value.offsetWidth),q=R&&(f!==o.value.scrollHeight||b!==o.value.offsetHeight);if(!n&&!a&&!q)return;const T=window.getComputedStyle(o.value);(T.overflow==="hidden"||T.overflowX==="hidden")&&(u=!1),(T.overflow==="hidden"||T.overflowY==="hidden")&&(g=!1),m.show=u,x.show=g,S(),i=o.value.offsetWidth,b=o.value.offsetHeight,O=o.value.scrollWidth,f=o.value.scrollHeight,h("resized",O,f)}function H(n){var u;r.scroll=="horizontal"&&(n.deltaMode==0&&((u=o.value)==null||u.scrollTo({left:o.value.scrollLeft+(n.deltaY>0?Se:-140),behavior:"smooth"})),n.preventDefault(),n.stopPropagation())}function W(n){var u;n.deltaMode==0&&((u=o.value)==null||u.scrollTo({left:o.value.scrollLeft+(n.deltaY>0?Se:-140),behavior:"smooth"}),n.preventDefault(),n.stopPropagation())}function P(n){var u;n.deltaMode==0&&((u=o.value)==null||u.scrollTo({top:o.value.scrollTop+(n.deltaY>0?De:-70),behavior:"smooth"}),n.preventDefault(),n.stopPropagation())}let L=0,z=0,E=0,v=0;const _=xe({onDown(n){return!d.value||!p.value?!1:(L=n.offsetX,z=n.x-n.offsetX-p.value.offsetLeft,n.preventDefault(),I.value=!0,!0)},onMove(n,u,g){o.value&&d.value&&(K(g.x-L-z),g.preventDefault(),g.stopPropagation())},onUp(){I.value=!1}}),N=xe({onDown(n){return!C.value||!k.value?!1:(E=n.offsetY,v=n.y-n.offsetY-k.value.offsetTop,n.preventDefault(),I.value=!0,!0)},onMove(n,u,g){o.value&&C.value&&(G(g.y-E-v),g.preventDefault(),g.stopPropagation())},onUp(){I.value=!1}});function j(n){o.value&&(o.value.scrollLeft=n/100*(o.value.scrollWidth-o.value.offsetWidth))}function A(n){o.value&&(o.value.scrollLeft=n/100*(o.value.scrollHeight-o.value.offsetHeight))}function K(n){o.value&&(o.value.scrollLeft=n/(o.value.offsetWidth-m.sizeRaw)*(o.value.scrollWidth-o.value.offsetWidth))}function G(n){o.value&&(o.value.scrollTop=n/(o.value.offsetHeight-x.sizeRaw)*(o.value.scrollHeight-o.value.offsetHeight))}function w(n){r.scrollBarBackgroundClickable&&K(n.offsetX-m.sizeRaw/2)}function ee(n){r.scrollBarBackgroundClickable&&G(n.offsetY-x.sizeRaw/2)}const{startResizeChecker:We,stopResizeChecker:re}=Ve(o,()=>c(),()=>c());return e.onMounted(()=>{e.nextTick(()=>{setTimeout(()=>c(!0),200),c(!0),We(),y=new MutationObserver(()=>c()),y.observe(o.value,M)})}),e.onBeforeUnmount(()=>{re(),y&&(y.disconnect(),y=null)}),l({refreshScrollState(){c(!0)},getScrollContainer(){return o.value},scrollTo(n,u){var g;(g=o.value)==null||g.scrollTo(n,u)},scrollToTop(){var n;(n=o.value)==null||n.scrollTo(0,0)},scrollToBottom(){var n;(n=o.value)==null||n.scrollTo(o.value.scrollWidth,o.value.scrollHeight)}}),(n,u)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"scrollrect",ref:B,class:e.normalizeClass(["vue-scroll-rect",t.scrollBarAlwaysShow?"always-show-scrollbar":"",t.scrollBarBackgroundClickable?"background-clickable":"",I.value?"dragging":""]),style:e.normalizeStyle({width:t.width?`${t.width}px`:void 0,height:t.height?`${t.height}px`:void 0}),onWheel:H},[e.createElementVNode("div",{ref_key:"container",ref:o,class:e.normalizeClass(["scroll-content",t.scroll,t.containerClass]),style:e.normalizeStyle({maxWidth:t.maxWidth?`${t.maxWidth}px`:void 0,maxHeight:t.maxHeight?`${t.maxHeight}px`:void 0,...t.containerStyle}),onScroll:S},[e.renderSlot(n.$slots,"default")],38),m.show?e.renderSlot(n.$slots,"scrollBarX",{key:0,scrollBarValue:m,onScroll:j},()=>[e.createElementVNode("div",{ref_key:"scrollBarRefX",ref:d,class:"scrollbar horizontal",onClick:w,onWheel:W},[e.createElementVNode("div",{class:"thumb",ref_key:"scrollBarThumbRefX",ref:p,style:e.normalizeStyle({left:`${m.pos}%`,width:`${m.size}%`}),onMousedown:u[0]||(u[0]=(...g)=>e.unref(_)&&e.unref(_)(...g)),onWheel:W},null,36)],544)]):e.createCommentVNode("",!0),x.show?e.renderSlot(n.$slots,"scrollBarY",{key:1,scrollBarValue:x,onScroll:A},()=>[x.show?(e.openBlock(),e.createElementBlock("div",{key:0,ref_key:"scrollBarRefY",ref:C,class:"scrollbar vertical",onClick:ee,onWheel:P},[e.createElementVNode("div",{class:"thumb",ref_key:"scrollBarThumbRefY",ref:k,style:e.normalizeStyle({top:`${x.pos}%`,height:`${x.size}%`}),onMousedown:u[1]||(u[1]=(...g)=>e.unref(N)&&e.unref(N)(...g)),onWheel:P},null,36)],544)):e.createCommentVNode("",!0)]):e.createCommentVNode("",!0)],38))}}),le=(t,l)=>{const s=t.__vccOpts||t;for(const[r,h]of l)s[r]=h;return s},Ye={},Ue={class:"mx-checked-mark","aria-hidden":"true",viewBox:"0 0 1024 1024"},Xe=[e.createElementVNode("path",{d:"M129.3,428.6L52,512l345,372.5l575-620.8l-69.5-75L400.4,718.2L129.3,428.6z"},null,-1)];function Ze(t,l){return e.openBlock(),e.createElementBlock("svg",Ue,Xe)}const Ge=le(Ye,[["render",Ze]]),qe={},Je={class:"mx-right-arrow","aria-hidden":"true",viewBox:"0 0 1024 1024"},Qe=[e.createElementVNode("path",{d:"M307.018 49.445c11.517 0 23.032 4.394 31.819 13.18L756.404 480.18c8.439 8.438 13.181 19.885 13.181 31.82s-4.741 23.38-13.181 31.82L338.838 961.376c-17.574 17.573-46.065 17.573-63.64-0.001-17.573-17.573-17.573-46.065 0.001-63.64L660.944 512 275.198 126.265c-17.574-17.573-17.574-46.066-0.001-63.64C283.985 53.839 295.501 49.445 307.018 49.445z"},null,-1)];function et(t,l){return e.openBlock(),e.createElementBlock("svg",Je,Qe)}const tt=le(qe,[["render",et]]),nt={class:"mx-item-row"},ot=["xlink:href"],lt={key:1,class:"label"},st={class:"mx-item-row"},rt={class:"mx-shortcut"},se=e.defineComponent({__name:"ContextMenuItem",props:{disabled:{type:Boolean,default:!1},hidden:{type:Boolean,default:!1},customRender:{type:Function,default:null},customClass:{type:String,default:""},clickHandler:{type:Function,default:null},label:{type:[String,Object,Function],default:""},icon:{type:[String,Object,Function],default:""},iconFontClass:{type:String,default:"iconfont"},checked:{type:Boolean,default:!1},shortcut:{type:String,default:""},svgIcon:{type:String,default:""},svgProps:{type:Object,default:null},preserveIconWidth:{type:Boolean,default:!0},showRightArrow:{type:Boolean,default:!1},hasChildren:{type:Boolean,default:!1},clickClose:{type:Boolean,default:!0},clickableWhenHasChildren:{type:Boolean,default:!1},rawMenuItem:{type:Object,default:void 0}},emits:["click","subMenuOpen","subMenuClose"],setup(t,{expose:l,emit:s}){const r=t,h=s,{clickHandler:o,clickClose:B,clickableWhenHasChildren:d,disabled:C,hidden:p,label:k,icon:I,iconFontClass:$,showRightArrow:R,shortcut:m,hasChildren:x}=e.toRefs(r),O=e.ref(!1),f=e.ref(!1),i=e.ref(),b=e.inject("globalOptions"),y=e.inject("globalHasSlot"),M=e.inject("globalRenderSlot"),S=e.inject("globalCloseMenu"),c=e.inject("menuContext"),H=e.computed(()=>typeof k.value=="string"?k.value:typeof k.value=="function"?je(k.value.toString()):"MenuItem[unknow]");e.provide("MenuItemName",H);const W={getSubMenuInstance:()=>{},showSubMenu:()=>O.value?(c.markActiveMenuItem(W,!0),!0):x.value?(L(),!0):!1,hideSubMenu:()=>{c.closeOtherSubMenu()},isDisabledOrHidden:()=>C.value||p.value,getElement:()=>i.value,focus:()=>f.value=!0,blur:()=>f.value=!1,click:P};e.provide("menuItemInstance",W),e.onMounted(()=>{c.isMenuItemDataCollectedFlag()?e.nextTick(()=>{let v=0;const _=c.getElement();if(_){let N=0;for(let j=0;j<_.children.length;j++){const A=_.children[j];if(A.getAttribute("data-type")==="ContextMenuItem"){if(A===i.value){v=N;break}N++}}}c.addChildMenuItem(W,v)}):c.addChildMenuItem(W)}),e.onBeforeUnmount(()=>{c.removeChildMenuItem(W)});function P(v){if(!C.value){if(v){const _=v.target;if(_.classList.contains("mx-context-no-clickable")||b.value.ignoreClickClassName&&_.classList.contains(b.value.ignoreClickClassName))return;if(b.value.clickCloseClassName&&_.classList.contains(b.value.clickCloseClassName)){v.stopPropagation(),S(r.rawMenuItem);return}}x.value?d.value?(typeof o.value=="function"&&o.value(v),h("click",v)):O.value||L():(typeof o.value=="function"&&o.value(v),h("click",v),B.value&&S(r.rawMenuItem))}}function L(v){f.value=!1,c.checkCloseOtherSubMenuTimeOut()||c.closeOtherSubMenu(),C.value||(c.markActiveMenuItem(W),x.value&&(v||c.markThisOpenedByKeyBoard(),c.addOpenedSubMenu(z),O.value=!0,e.nextTick(()=>h("subMenuOpen",W))))}function z(){f.value=!1,O.value=!1,h("subMenuClose",W)}function E(){return{disabled:C.value,label:k.value,icon:I.value,iconFontClass:$.value,showRightArrow:R.value,clickClose:B.value,clickableWhenHasChildren:d.value,shortcut:m.value,theme:b.value.theme,isOpen:O,hasChildren:x,onClick:P,onMouseEnter:L,closeMenu:S}}return l(W),(v,_)=>{var N;return e.unref(p)?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",e.mergeProps({key:0,class:"mx-context-menu-item-wrapper",ref_key:"menuItemRef",ref:i,"data-type":"ContextMenuItem"},{...v.$attrs,...((N=t.rawMenuItem)==null?void 0:N.attrs)||{}}),[e.unref(y)("itemRender")?(e.openBlock(),e.createBlock(e.unref(D),{key:0,vnode:()=>e.unref(M)("itemRender",E())},null,8,["vnode"])):t.customRender?(e.openBlock(),e.createBlock(e.unref(D),{key:1,vnode:t.customRender,data:E()},null,8,["vnode","data"])):(e.openBlock(),e.createElementBlock("div",{key:2,class:e.normalizeClass(["mx-context-menu-item",e.unref(C)?"disabled":"",f.value?"keyboard-focus":"",t.customClass?" "+t.customClass:"",O.value?"open":""]),onClick:P,onMouseenter:L},[e.renderSlot(v.$slots,"default",{},()=>[e.createElementVNode("div",nt,[e.createElementVNode("div",{class:e.normalizeClass(["mx-icon-placeholder",t.preserveIconWidth?"preserve-width":""])},[e.renderSlot(v.$slots,"icon",{},()=>[e.unref(y)("itemIconRender")?(e.openBlock(),e.createBlock(e.unref(D),{key:0,vnode:()=>e.unref(M)("itemIconRender",E())},null,8,["vnode"])):typeof t.svgIcon=="string"&&t.svgIcon?(e.openBlock(),e.createElementBlock("svg",e.mergeProps({key:1,class:"icon svg"},t.svgProps),[e.createElementVNode("use",{"xlink:href":t.svgIcon},null,8,ot)],16)):typeof e.unref(I)!="string"?(e.openBlock(),e.createBlock(e.unref(D),{key:2,vnode:e.unref(I),data:e.unref(I)},null,8,["vnode","data"])):typeof e.unref(I)=="string"&&e.unref(I)!==""?(e.openBlock(),e.createElementBlock("i",{key:3,class:e.normalizeClass(e.unref(I)+" icon "+e.unref($)+" "+e.unref(b).iconFontClass)},null,2)):e.createCommentVNode("",!0)]),t.checked?e.renderSlot(v.$slots,"check",{key:0},()=>[e.unref(y)("itemCheckRender")?(e.openBlock(),e.createBlock(e.unref(D),{key:0,vnode:()=>e.unref(M)("itemCheckRender",E())},null,8,["vnode"])):e.createCommentVNode("",!0),e.createVNode(Ge)]):e.createCommentVNode("",!0)],2),e.renderSlot(v.$slots,"label",{},()=>[e.unref(y)("itemLabelRender")?(e.openBlock(),e.createBlock(e.unref(D),{key:0,vnode:()=>e.unref(M)("itemLabelRender",E())},null,8,["vnode"])):typeof e.unref(k)=="string"?(e.openBlock(),e.createElementBlock("span",lt,e.toDisplayString(e.unref(k)),1)):(e.openBlock(),e.createBlock(e.unref(D),{key:2,vnode:e.unref(k),data:e.unref(k)},null,8,["vnode","data"]))])]),e.createElementVNode("div",st,[e.unref(m)||v.$slots.shortcut?e.renderSlot(v.$slots,"shortcut",{key:0},()=>[e.unref(y)("itemShortcutRender")?(e.openBlock(),e.createBlock(e.unref(D),{key:0,vnode:()=>e.unref(M)("itemShortcutRender",E())},null,8,["vnode"])):e.createCommentVNode("",!0),e.createElementVNode("span",rt,e.toDisplayString(e.unref(m)),1)]):e.createCommentVNode("",!0),e.unref(R)?e.renderSlot(v.$slots,"rightArrow",{key:1},()=>[e.unref(y)("itemRightArrowRender")?(e.openBlock(),e.createBlock(e.unref(D),{key:0,vnode:()=>e.unref(M)("itemRightArrowRender",E())},null,8,["vnode"])):e.createCommentVNode("",!0),e.createVNode(tt)]):e.createCommentVNode("",!0)])])],34)),e.renderSlot(v.$slots,"submenu",{context:W,show:O.value})],16))}}}),at=e.defineComponent({name:"ContextMenuSperator",components:{VNodeRender:D},setup(){const t=e.inject("globalHasSlot"),l=e.inject("globalRenderSlot");return{globalHasSlot:t,globalRenderSlot:l}}}),it={key:1,class:"mx-context-menu-item-sperator mx-context-no-clickable"};function ct(t,l,s,r,h,o){const B=e.resolveComponent("VNodeRender");return t.globalHasSlot("separatorRender")?(e.openBlock(),e.createBlock(B,{key:0,vnode:()=>t.globalRenderSlot("separatorRender",{})},null,8,["vnode"])):(e.openBlock(),e.createElementBlock("div",it))}const J=le(at,[["render",ct]]),ue=e.defineComponent({__name:"ContextSubMenu",props:{items:{type:Object,default:null},show:{type:Boolean,default:!1},destroyOnClose:{type:Boolean,default:!0},maxHeight:{type:Number,default:0},maxWidth:{type:[String,Number],default:0},minWidth:{type:[String,Number],default:0},adjustPosition:{type:Boolean,default:!0},direction:{type:String,default:"br"},parentMenuItemContext:{type:Object,default:null}},emits:["closeAnimFinished"],setup(t,{expose:l,emit:s}){const r=t,h=s,o=e.ref(!1),B=e.inject("globalGetMenuHostId",""),d=e.inject("menuContext"),C=e.inject("globalOptions");e.inject("globalHasSlot"),e.inject("globalRenderSlot");const p=e.ref("UnknowOrRoot"),k=e.inject("MenuItemName",p),{zIndex:I,getParentWidth:$,getParentHeight:R,getZoom:m}=d,{adjustPosition:x}=e.toRefs(r),O=e.ref(),f=e.ref(),i=e.ref(),b=[],y=e.inject("globalSetCurrentSubMenu"),M=[];let S=null,c=0;function H(){S&&S.blur()}function W(n,u){if(n){for(let g=u!==void 0?u:0;g<M.length;g++)if(!M[g].isDisabledOrHidden()){P(g);break}}else for(let g=u!==void 0?u:M.length-1;g>=0;g--)if(!M[g].isDisabledOrHidden()){P(g);break}}function P(n){if(S&&H(),n!==void 0&&(S=M[Math.max(0,Math.min(n,M.length-1))]),!S)return;S.focus();const u=S.getElement();u&&u.scrollIntoView({behavior:"auto",block:"nearest",inline:"nearest"})}function L(){y(z)}const z={el:i,name:k,isTopLevel:()=>d.getParentContext()===null,closeSelfAndActiveParent:()=>{const n=_.getParentContext();if(n){n.closeOtherSubMenu();const u=n.getSubMenuInstanceContext();if(u)return u.focusCurrentItem(),!0}return!1},closeCurrentSubMenu:()=>{var n;return(n=_.getParentContext())==null?void 0:n.closeOtherSubMenu()},moveCurrentItemFirst:()=>W(!0),moveCurrentItemLast:()=>W(!1),moveCurrentItemDown:()=>W(!0,S?M.indexOf(S)+1:0),moveCurrentItemUp:()=>W(!1,S?M.indexOf(S)-1:0),focusCurrentItem:()=>P(),openCurrentItemSubMenu:()=>S?S==null?void 0:S.showSubMenu():!1,triggerCurrentItemClick:n=>S==null?void 0:S.click(n)};let E=!1,v=!1;const _={zIndex:I+1,container:d.container,adjustPadding:C.value.adjustPadding||V.defaultAdjustPadding,getParentWidth:()=>{var n;return((n=i.value)==null?void 0:n.offsetWidth)||0},getParentHeight:()=>{var n;return((n=i.value)==null?void 0:n.offsetHeight)||0},getPositon:()=>[w.value.x,w.value.y],getZoom:()=>C.value.zoom||V.defaultZoom,addOpenedSubMenu(n){b.push(n)},closeOtherSubMenu(){b.forEach(n=>n()),b.splice(0,b.length),y(z)},checkCloseOtherSubMenuTimeOut(){return c?(clearTimeout(c),c=0,!0):!1},closeOtherSubMenuWithTimeOut(){c=setTimeout(()=>{c=0,this.closeOtherSubMenu()},200)},addChildMenuItem:(n,u)=>{u===void 0?M.push(n):M.splice(u,0,n)},removeChildMenuItem:n=>{M.splice(M.indexOf(n),1),n.getSubMenuInstance=()=>{}},markActiveMenuItem:(n,u=!1)=>{H(),S=n,u&&P()},markThisOpenedByKeyBoard:()=>{E=!0},isOpenedByKeyBoardFlag:()=>E?(E=!1,!0):!1,isMenuItemDataCollectedFlag:()=>v,getElement:()=>i.value||null,getParentContext:()=>d,getSubMenuInstanceContext:()=>z};e.provide("menuContext",_);const N={getChildItem:n=>M[n],getMenuDimensions:()=>f.value?{width:f.value.offsetWidth,height:f.value.offsetHeight}:{width:0,height:0},getSubmenuRoot:()=>f.value,getMenu:()=>i.value,getScrollValue:()=>{var n,u;return((u=(n=O.value)==null?void 0:n.getScrollContainer())==null?void 0:u.scrollTop)||0},setScrollValue:n=>{var u;return(u=O.value)==null?void 0:u.scrollTo(0,n)},getScrollHeight:()=>A.value,adjustPosition:()=>{ee()},getMaxHeight:()=>K.value,getPosition:()=>w.value,setPosition:(n,u)=>{w.value.x=n,w.value.y=u}},j=e.inject("menuItemInstance",void 0);j&&(j.getSubMenuInstance=()=>N);const A=e.ref(0),K=e.ref(0),G=e.ref(!1),w=e.ref({x:0,y:0});function ee(){e.nextTick(()=>{var g;const n=i.value,u=f.value;if(n&&u&&O.value){const{container:a}=d,q=($==null?void 0:$())??0,T=(R==null?void 0:R())??0,Y=getComputedStyle(u),ae=parseFloat(Y.paddingLeft),ie=parseFloat(Y.paddingTop),fe=T>0?ie:0,bt=document.documentElement.scrollHeight/m(),yt=document.documentElement.scrollWidth/m(),kt=Math.min(yt,a.offsetWidth),Oe=Math.min(bt,a.offsetHeight);let he=Z(n,a),me=X(n,a);if(r.direction.includes("l")?w.value.x-=n.offsetWidth+ae:r.direction.includes("r")?w.value.x+=q+ae:(w.value.x+=q/2,w.value.x-=(n.offsetWidth+ae)/2),r.direction.includes("t")){const te=(g=r.parentMenuItemContext)==null?void 0:g.getElement();te&&(w.value.y+=te.offsetHeight),w.value.y-=(n.offsetHeight+ie)/m()}else r.direction.includes("b")?w.value.y-=ie/m():w.value.y-=n.offsetHeight/2/m();e.nextTick(()=>{var _e,He;he=Z(n,a),me=X(n,a);const te=((He=(_e=O.value)==null?void 0:_e.getScrollContainer())==null?void 0:He.scrollHeight)||0,xt=r.maxHeight;A.value=r.maxHeight?Math.min(te,r.maxHeight):te;const Mt=he+n.offsetWidth-kt,Re=me+A.value+fe*2-Oe;if(G.value=Re>0,x.value&&Mt>0){const ne=q+n.offsetWidth-ae,oe=he;ne>oe?w.value.x-=oe:w.value.x-=ne}if(G.value){if(x.value){const ne=Re,oe=me;ne>oe?w.value.y-=oe-fe:w.value.y-=ne-fe}K.value=Oe-(w.value.y+ie)}else K.value=xt||0})}})}function We(){}function re(){var u;const n=(u=r.parentMenuItemContext)==null?void 0:u.getElement();if(n){const g=Z(n,d.container),a=X(n,d.container);w.value.x=g,w.value.y=a}else{const[g,a]=d.getPositon();w.value.x=g,w.value.y=a}e.nextTick(()=>{var g;y(z),(g=i.value)==null||g.focus({preventScroll:!0}),d.isOpenedByKeyBoardFlag()&&e.nextTick(()=>W(!0)),v=!0}),ee()}return e.watch(()=>r.show,n=>{n?re():void 0}),e.onMounted(()=>{o.value=!0,r.show?re():ee()}),e.onBeforeUnmount(()=>{o.value=!1,j&&(j.getSubMenuInstance=()=>{})}),l(N),(n,u)=>{const g=e.resolveComponent("ContextSubMenu",!0);return o.value?(e.openBlock(),e.createBlock(e.Teleport,{key:0,to:`#${e.unref(B)}`},[e.createVNode(e.Transition,e.mergeProps({appear:""},e.unref(C).menuTransitionProps||{duration:10},{onAfterLeave:u[0]||(u[0]=a=>h("closeAnimFinished"))}),{default:e.withCtx(()=>[!t.destroyOnClose||t.show?e.withDirectives((e.openBlock(),e.createElementBlock("div",e.mergeProps({key:0,ref_key:"submenuRoot",ref:f},n.$attrs,{class:["mx-context-menu",e.unref(C).customClass?e.unref(C).customClass:"",e.unref(C).theme??""],style:{maxWidth:t.maxWidth?e.unref(be)(t.maxWidth):`${e.unref(V).defaultMaxWidth}px`,minWidth:t.minWidth?e.unref(be)(t.minWidth):`${e.unref(V).defaultMinWidth}px`,zIndex:e.unref(I),left:`${w.value.x}px`,top:`${w.value.y}px`},"data-type":"ContextSubMenu",onClick:L}),[e.createVNode(e.unref(Ke),{ref_key:"scrollRectRef",ref:O,scroll:"vertical",maxHeight:K.value,containerClass:"mx-context-menu-scroll"},{default:e.withCtx(()=>[e.createElementVNode("div",{class:e.normalizeClass(["mx-context-menu-items"]),ref_key:"menu",ref:i},[e.renderSlot(n.$slots,"default",{},()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.items,(a,q)=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:q},[a.hidden!==!0&&a.divided==="up"?(e.openBlock(),e.createBlock(J,{key:0})):e.createCommentVNode("",!0),a.hidden!==!0&&a.divided==="self"?(e.openBlock(),e.createBlock(J,{key:1})):(e.openBlock(),e.createBlock(se,{key:2,clickHandler:a.onClick?T=>a.onClick(T):void 0,disabled:typeof a.disabled=="object"?a.disabled.value:a.disabled,hidden:typeof a.hidden=="object"?a.hidden.value:a.hidden,icon:a.icon,iconFontClass:a.iconFontClass,svgIcon:a.svgIcon,svgProps:a.svgProps,label:a.label,customRender:a.customRender,customClass:a.customClass,checked:typeof a.checked=="object"?a.checked.value:a.checked,shortcut:a.shortcut,clickClose:a.clickClose,clickableWhenHasChildren:a.clickableWhenHasChildren,preserveIconWidth:a.preserveIconWidth!==void 0?a.preserveIconWidth:e.unref(C).preserveIconWidth,showRightArrow:a.children&&a.children.length>0,hasChildren:a.children&&a.children.length>0,rawMenuItem:a,onSubMenuOpen:T=>{var Y;return(Y=a.onSubMenuOpen)==null?void 0:Y.call(a,T)},onSubMenuClose:T=>{var Y;return(Y=a.onSubMenuClose)==null?void 0:Y.call(a,T)}},e.createSlots({_:2},[a.children&&a.children.length>0?{name:"submenu",fn:e.withCtx(({context:T,show:Y})=>[e.createVNode(g,{show:Y,destroyOnClose:t.destroyOnClose,parentMenuItemContext:T,items:a.children,maxWidth:a.maxWidth,minWidth:a.minWidth,maxHeight:a.maxHeight,adjustPosition:a.adjustSubMenuPosition!==void 0?a.adjustSubMenuPosition:e.unref(C).adjustPosition,direction:a.direction!==void 0?a.direction:e.unref(C).direction},null,8,["show","destroyOnClose","parentMenuItemContext","items","maxWidth","minWidth","maxHeight","adjustPosition","direction"])]),key:"0"}:void 0]),1032,["clickHandler","disabled","hidden","icon","iconFontClass","svgIcon","svgProps","label","customRender","customClass","checked","shortcut","clickClose","clickableWhenHasChildren","preserveIconWidth","showRightArrow","hasChildren","rawMenuItem","onSubMenuOpen","onSubMenuClose"])),a.hidden!==!0&&(a.divided==="down"||a.divided===!0)?(e.openBlock(),e.createBlock(J,{key:3})):e.createCommentVNode("",!0)],64))),128))])],512)]),_:3},8,["maxHeight"])],16)),[[e.vShow,t.show]]):e.createCommentVNode("",!0)]),_:3},16)],8,["to"])):e.createCommentVNode("",!0)}}}),wt="",ve=e.defineComponent({__name:"ContextSubMenuWrapper",props:{options:{type:Object,default:null},show:{type:null,default:null},destroyOnClose:{type:Boolean,default:!0},container:{type:Object,default:null},isFullScreenContainer:{type:Boolean,default:!0}},emits:["close","closeAnimFinished"],setup(t,{expose:l,emit:s}){const r=t,h=s,o=e.useSlots(),B=e.ref(),{options:d,show:C,destroyOnClose:p,container:k}=e.toRefs(r);e.onMounted(()=>{C.value&&R()}),e.onBeforeUnmount(()=>{f()}),e.watch(C,c=>{c?R():(pe(I),f())});const I={closeMenu:m,isClosed:x,getMenuRef:()=>B.value,getMenuDimensions:()=>{var c;return((c=B.value)==null?void 0:c.getMenuDimensions())??{width:0,height:0}}};let $=!1;function R(){O(),Ee(I)}function m(c){$=!0,h("close",c),d.value.menuTransitionProps||h("closeAnimFinished"),pe(I)}function x(){return $}function O(){setTimeout(()=>{document.addEventListener("click",M,!0),document.addEventListener("contextmenu",M,!0),document.addEventListener("scroll",y,!0),!r.isFullScreenContainer&&k.value&&k.value.addEventListener("scroll",y,!0),d.value.keyboardControl!==!1&&document.addEventListener("keydown",b,!0)},50)}function f(){document.removeEventListener("contextmenu",M,!0),document.removeEventListener("click",M,!0),document.removeEventListener("scroll",y,!0),!r.isFullScreenContainer&&k.value&&k.value.removeEventListener("scroll",y,!0),d.value.keyboardControl!==!1&&document.removeEventListener("keydown",b,!0)}const i=e.ref();e.provide("globalSetCurrentSubMenu",c=>i.value=c),e.provide("globalGetMenuHostId",k.value.id);function b(c){var W,P,L,z,E,v,_,N,j,A,K,G,w;let H=!0;switch(c.key){case"Escape":{((W=i.value)==null?void 0:W.isTopLevel())===!1?(P=i.value)==null||P.closeCurrentSubMenu():m();break}case"ArrowDown":(L=i.value)==null||L.moveCurrentItemDown();break;case"ArrowUp":(z=i.value)==null||z.moveCurrentItemUp();break;case"Home":(E=i.value)==null||E.moveCurrentItemFirst();break;case"End":(v=i.value)==null||v.moveCurrentItemLast();break;case"ArrowLeft":{(_=i.value)!=null&&_.closeSelfAndActiveParent()||(j=(N=d.value).onKeyFocusMoveLeft)==null||j.call(N);break}case"ArrowRight":(A=i.value)!=null&&A.openCurrentItemSubMenu()||(G=(K=d.value).onKeyFocusMoveRight)==null||G.call(K);break;case"Enter":(w=i.value)==null||w.triggerCurrentItemClick(c);break;default:H=!1;break}H&&i.value&&(c.stopPropagation(),c.preventDefault())}function y(c){d.value.closeWhenScroll!==!1&&S(c.target,null)}function M(c){S(c.target,c)}function S(c,H){var W,P;for(;c;){if(c.classList&&c.classList.contains("mx-context-menu"))return;c=c.parentNode}H?d.value.clickCloseOnOutside!==!1?(f(),m()):(P=(W=d.value).onClickOnOutside)==null||P.call(W,H):(f(),m())}return e.provide("globalOptions",d),e.provide("globalCloseMenu",m),e.provide("globalIsFullScreenContainer",r.isFullScreenContainer),e.provide("globalHasSlot",c=>o[c]!==void 0),e.provide("globalRenderSlot",(c,H)=>e.renderSlot(o,c,{...H},()=>[e.h("span","Render slot failed")],!1)),e.provide("menuContext",{zIndex:d.value.zIndex||V.defaultZindex,container:k.value,adjustPadding:{x:0,y:0},getZoom:()=>d.value.zoom||V.defaultZoom,getParentWidth:()=>0,getParentHeight:()=>0,getPositon:()=>[d.value.x,d.value.y],closeOtherSubMenuWithTimeOut:()=>{},checkCloseOtherSubMenuTimeOut:()=>!1,addOpenedSubMenu:()=>{},closeOtherSubMenu:()=>{},getParentContext:()=>null,getSubMenuInstanceContext:()=>null,getElement:()=>null,addChildMenuItem:()=>{},removeChildMenuItem:()=>{},markActiveMenuItem:()=>{},markThisOpenedByKeyBoard:()=>{},isOpenedByKeyBoardFlag:()=>!1,isMenuItemDataCollectedFlag:()=>!1}),l(I),(c,H)=>(e.openBlock(),e.createBlock(ue,{ref_key:"submenuInstance",ref:B,show:e.unref(C),destroyOnClose:e.unref(p),items:e.unref(d).items,adjustPosition:e.unref(d).adjustPosition,maxWidth:e.unref(d).maxWidth||e.unref(V).defaultMaxWidth,minWidth:e.unref(d).minWidth||e.unref(V).defaultMinWidth,maxHeight:e.unref(d).maxHeight,direction:e.unref(d).direction||e.unref(V).defaultDirection,onCloseAnimFinished:H[0]||(H[0]=W=>h("closeAnimFinished"))},{default:e.withCtx(()=>[e.renderSlot(c.$slots,"default")]),_:3},8,["show","destroyOnClose","items","adjustPosition","maxWidth","minWidth","maxHeight","direction"]))}}),Bt="",we=e.defineComponent({__name:"ContextMenu",props:{options:{type:Object,default:null},show:{type:Boolean,default:!1},destroyOnClose:{type:Boolean,default:!0}},emits:["update:show","close"],setup(t,{expose:l,emit:s}){const r=s,h=t,{options:o,show:B,destroyOnClose:d}=e.toRefs(h),{isNew:C,container:p,eleId:k}=Ce(o.value),I=e.ref(null),$=e.useSlots();function R(m){var x,O;r("update:show",!1),r("close"),(O=(x=o.value).onClose)==null||O.call(x,m)}return l({closeMenu:()=>r("update:show",!1),isClosed:()=>!B.value,getMenuRef:()=>{var m;return(m=I.value)==null?void 0:m.getMenuRef()},getMenuDimensions:()=>{var m;return((m=I.value)==null?void 0:m.getMenuDimensions())??{width:0,height:0}}}),(m,x)=>(e.openBlock(),e.createBlock(e.Teleport,{to:`#${e.unref(k)}`},[e.createVNode(ve,{ref_key:"menuRef",ref:I,options:e.unref(o),show:e.unref(B),destroyOnClose:e.unref(d),container:e.unref(p),isFullScreenContainer:!e.unref(C),onClose:R},e.createSlots({_:2},[e.renderList(e.unref($),(O,f)=>({name:f,fn:e.withCtx(i=>[e.renderSlot(m.$slots,f,e.normalizeProps(e.guardReactiveProps(i)))])}))]),1032,["options","show","destroyOnClose","container","isFullScreenContainer"])],8,["to"]))}}),Be=e.defineComponent({name:"ContextMenuGroup",props:{disabled:{type:Boolean,default:!1},hidden:{type:Boolean,default:!1},clickHandler:{type:Function,default:null},label:{type:String,default:""},icon:{type:String,default:""},iconFontClass:{type:String,default:"iconfont"},checked:{type:Boolean,default:!1},shortcut:{type:String,default:""},svgIcon:{type:String,default:""},svgProps:{type:Object,default:null},preserveIconWidth:{type:Boolean,default:!0},showRightArrow:{type:Boolean,default:!1},clickClose:{type:Boolean,default:!0},adjustSubMenuPosition:{type:Boolean,default:void 0},maxHeight:{type:[String,Number],default:0},maxWidth:{type:[String,Number],default:0},minWidth:{type:[String,Number],default:0}},setup(t,l){const s=e.inject("globalOptions"),{adjustSubMenuPosition:r,maxWidth:h,minWidth:o,maxHeight:B}=e.toRefs(t),d=typeof r.value<"u"?r.value:s.value.adjustPosition,C=e.ref(),p=e.ref();return l.expose({getSubMenuRef:()=>C.value,getMenuItemRef:()=>p.value}),()=>e.h(se,{...t,ref:p,showRightArrow:!0,maxWidth:void 0,minWidth:void 0,maxHeight:void 0,adjustSubMenuPosition:void 0,hasChildren:typeof l.slots.default!==void 0},l.slots.default?{submenu:k=>e.h(ue,{ref:C,show:k.show,maxWidth:h.value,minWidth:o.value,maxHeight:B.value,adjustPosition:d,parentMenuItemContext:k.context},{default:l.slots.default}),...Fe(l.slots,"default")}:l.slots)}});function ut(t,l,s,r){const h=e.ref(!0),o=e.h(ve,{options:t,show:h,container:l,isFullScreenContainer:!s,onCloseAnimFinished:()=>{e.render(null,l)},onClose:B=>{var d;(d=t.onClose)==null||d.call(t,B),h.value=!1}},r);return e.render(o,l),o.component}function Ie(t,l){const s=Ce(t);return ut(t,s.container,s.isNew,l).exposed}const de={install(t){t.config.globalProperties.$contextmenu=Ie,t.component("ContextMenu",we),t.component("ContextMenuItem",se),t.component("ContextMenuGroup",Be),t.component("ContextMenuSperator",J),t.component("ContextMenuSeparator",J),t.component("ContextSubMenu",ue)},showContextMenu(t,l){return Ie(t,l)},isAnyContextMenuOpen(){return Pe()},closeContextMenu:ge,transformMenuPosition:$e},dt={},ft={class:"mx-menu-bar-icon-menu",viewBox:"0 0 1024 1024",version:"1.1",xmlns:"http://www.w3.org/2000/svg",width:"200",height:"200"},ht=[e.createElementVNode("path",{d:"M133.310936 296.552327l757.206115 0c19.781623 0 35.950949-16.169326 35.950949-35.950949 0-19.781623-15.997312-35.950949-35.950949-35.950949L133.310936 224.650428c-19.781623 0-35.950949 16.169326-35.950949 35.950949C97.359987 280.383 113.529313 296.552327 133.310936 296.552327z"},null,-1),e.createElementVNode("path",{d:"M890.51705 476.135058 133.310936 476.135058c-19.781623 0-35.950949 16.169326-35.950949 35.950949 0 19.781623 16.169326 35.950949 35.950949 35.950949l757.206115 0c19.781623 0 35.950949-16.169326 35.950949-35.950949C926.467999 492.304384 910.298673 476.135058 890.51705 476.135058z"},null,-1),e.createElementVNode("path",{d:"M890.51705 727.447673 133.310936 727.447673c-19.781623 0-35.950949 15.997312-35.950949 35.950949s16.169326 35.950949 35.950949 35.950949l757.206115 0c19.781623 0 35.950949-15.997312 35.950949-35.950949S910.298673 727.447673 890.51705 727.447673z"},null,-1)];function mt(t,l){return e.openBlock(),e.createElementBlock("svg",ft,ht)}const pt=le(dt,[["render",mt]]),gt=["onClick","onMouseenter"],Ct=e.defineComponent({__name:"MenuBar",props:{options:{type:Object,default:null}},setup(t){const l=t,s=e.ref(),r=e.ref(!1),h=e.ref([]),o=e.ref(null);function B(){r.value=!0}function d(){r.value=!1}e.onMounted(()=>{h.value=l.options.items||[]}),e.watch(()=>l.options,()=>{h.value=l.options.items||[]});let C=null,p=-1;function k(){p<h.value.length-1?p++:p=0,R(p,h.value[p])}function I(){p>0?p--:p=h.value.length-1,R(p,h.value[p])}function $(f){const i=l.options.barPopDirection??"bl";let b=0,y=0;return i.startsWith("b")?y=X(f)+f.offsetHeight:i.startsWith("t")?y=X(f):y=X(f)+f.offsetHeight/2,i.endsWith("l")?b=Z(f):i.startsWith("r")?b=Z(f)+f.offsetWidth:b=Z(f)+f.offsetWidth/2,{x:b,y:y+5}}function R(f,i){var y;if(p=f,!i.children)return;C&&(C.closeMenu(),C=null,r.value=!0),o.value=i;const b=(y=s.value)==null?void 0:y.children[f];if(b){const{x:M,y:S}=$(b);C=de.showContextMenu({...l.options,items:i.children,x:M,y:S,onKeyFocusMoveLeft(){I()},onKeyFocusMoveRight(){k()},onClose(){o.value==i&&(r.value=!1,o.value=null),typeof i.onSubMenuClose=="function"&&i.onSubMenuClose(void 0)}}),C&&typeof i.onSubMenuOpen=="function"&&i.onSubMenuOpen(void 0)}}function m(){p=0;const f=s.value;if(f){const{x:i,y:b}=$(f);C=de.showContextMenu({...l.options,x:i,y:b})}}function x(f,i){i?(r.value=!0,R(f,i),i.onClick&&(i.clickableWhenHasChildren===!0&&i.children&&i.children.length>0||!i.children||i.children.length===0)&&i.onClick()):m()}function O(f,i){r.value&&R(f,i)}return(f,i)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["mx-menu-bar",t.options.theme??"",t.options.mini?"mini":""]),onFocus:B,onBlur:d},[e.renderSlot(f.$slots,"prefix"),t.options.mini?(e.openBlock(),e.createElementBlock("div",{key:0,ref_key:"menuBarContent",ref:s,class:"mx-menu-bar-content"},[e.createElementVNode("div",{class:"mx-menu-bar-item",onClick:i[0]||(i[0]=b=>x(0,null))},[e.createVNode(pt)])],512)):(e.openBlock(),e.createElementBlock("div",{key:1,ref_key:"menuBarContent",ref:s,class:"mx-menu-bar-content"},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(h.value,(b,y)=>(e.openBlock(),e.createElementBlock("div",{key:y,class:e.normalizeClass(["mx-menu-bar-item",b==o.value?"active":""]),onClick:M=>x(y,b),onMouseenter:M=>O(y,b)},e.toDisplayString(b.label),43,gt))),128))],512)),e.renderSlot(f.$slots,"suffix")],34))}}),Rt="";F.ContextMenu=we,F.ContextMenuGroup=Be,F.ContextMenuItem=se,F.ContextMenuSeparator=J,F.MenuBar=Ct,F.default=de,Object.defineProperties(F,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
//# sourceMappingURL=vue3-context-menu.umd.js.map