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

A context menu component for Vue3

(function(j,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(j=typeof globalThis<"u"?globalThis:j||self,e(j["vue3-context-menu"]={},j.Vue))})(this,function(j,e){"use strict";let U=null;function Ee(){return U!==null}function Pe(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 Ne(t,l,s,r){return{x:Z(t,r)+l,y:X(t,r)+s}}const ce="mx-menu-default-container",$e="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=$e+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,ke=(t,l,s)=>ze(t,typeof l!="symbol"?l+"":l,s);class ye{constructor(l,s){ke(this,"x",0),ke(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 ye,o=new ye;let B;function d(m){m.stopPropagation(),o.set(m.x,m.y),o.substract(h),s(h,o,m,B)}function g(m){r(m,B),h.set(0,0),document.removeEventListener("mousemove",d),document.removeEventListener("mouseup",g)}return(m,y)=>l(m,y)?(B=y,h.set(m.x,m.y),document.addEventListener("mousemove",d),document.addEventListener("mouseup",g),m.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(),g=e.ref(),m=e.ref(),y=e.ref(),R=e.ref(!1),E=e.computed(()=>r.scroll==="horizontal"||r.scroll==="both"),S=e.computed(()=>r.scroll==="vertical"||r.scroll==="both"),x=e.reactive({show:!1,size:0,sizeRaw:0,pos:0}),M=e.reactive({show:!1,size:0,sizeRaw:0,pos:0});let I=0,c=0,f=0,b=0,k=null;const w={attributes:!0,childList:!0};function i(){if(o.value){if(x.show){const n=o.value.offsetWidth/o.value.scrollWidth;x.sizeRaw=n*o.value.offsetWidth,x.size=n*100,x.pos=o.value.scrollLeft/(o.value.scrollWidth-o.value.offsetWidth)*(100-x.size),n>=1&&(x.show=!1)}if(M.show){const n=o.value.offsetHeight/o.value.scrollHeight;M.sizeRaw=n*o.value.offsetHeight,M.size=n*100,M.pos=o.value.scrollTop/(o.value.scrollHeight-o.value.offsetHeight)*(100-M.size),n>=1&&(M.show=!1)}h("scroll",o.value.scrollLeft,o.value.scrollTop)}}function C(n=!1){if(!o.value)return;let u=E.value,p=S.value;const a=u&&(I!==o.value.scrollWidth||f!==o.value.offsetWidth),q=S&&(c!==o.value.scrollHeight||b!==o.value.offsetHeight);if(!n&&!a&&!q)return;const N=window.getComputedStyle(o.value);(N.overflow==="hidden"||N.overflowX==="hidden")&&(u=!1),(N.overflow==="hidden"||N.overflowY==="hidden")&&(p=!1),x.show=u,M.show=p,i(),f=o.value.offsetWidth,b=o.value.offsetHeight,I=o.value.scrollWidth,c=o.value.scrollHeight,h("resized",I,c)}function $(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 _(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 F=0,L=0,O=0,v=0;const H=xe({onDown(n){return!d.value||!m.value?!1:(F=n.offsetX,L=n.x-n.offsetX-m.value.offsetLeft,n.preventDefault(),R.value=!0,!0)},onMove(n,u,p){o.value&&d.value&&(K(p.x-F-L),p.preventDefault(),p.stopPropagation())},onUp(){R.value=!1}}),z=xe({onDown(n){return!g.value||!y.value?!1:(O=n.offsetY,v=n.y-n.offsetY-y.value.offsetTop,n.preventDefault(),R.value=!0,!0)},onMove(n,u,p){o.value&&g.value&&(G(p.y-O-v),p.preventDefault(),p.stopPropagation())},onUp(){R.value=!1}});function T(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-x.sizeRaw)*(o.value.scrollWidth-o.value.offsetWidth))}function G(n){o.value&&(o.value.scrollTop=n/(o.value.offsetHeight-M.sizeRaw)*(o.value.scrollHeight-o.value.offsetHeight))}function W(n){r.scrollBarBackgroundClickable&&K(n.offsetX-x.sizeRaw/2)}function ee(n){r.scrollBarBackgroundClickable&&G(n.offsetY-M.sizeRaw/2)}const{startResizeChecker:We,stopResizeChecker:re}=Ve(o,()=>C(),()=>C());return e.onMounted(()=>{e.nextTick(()=>{setTimeout(()=>C(!0),200),C(!0),We(),k=new MutationObserver(()=>C()),k.observe(o.value,w)})}),e.onBeforeUnmount(()=>{re(),k&&(k.disconnect(),k=null)}),l({refreshScrollState(){C(!0)},getScrollContainer(){return o.value},scrollTo(n,u){var p;(p=o.value)==null||p.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":"",R.value?"dragging":""]),style:e.normalizeStyle({width:t.width?`${t.width}px`:void 0,height:t.height?`${t.height}px`:void 0}),onWheel:$},[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:i},[e.renderSlot(n.$slots,"default")],38),x.show?e.renderSlot(n.$slots,"scrollBarX",{key:0,scrollBarValue:x,onScroll:T},()=>[e.createElementVNode("div",{ref_key:"scrollBarRefX",ref:d,class:"scrollbar horizontal",onClick:W,onWheel:_},[e.createElementVNode("div",{class:"thumb",ref_key:"scrollBarThumbRefX",ref:m,style:e.normalizeStyle({left:`${x.pos}%`,width:`${x.size}%`}),onMousedown:u[0]||(u[0]=(...p)=>e.unref(H)&&e.unref(H)(...p)),onWheel:_},null,36)],544)]):e.createCommentVNode("",!0),M.show?e.renderSlot(n.$slots,"scrollBarY",{key:1,scrollBarValue:M,onScroll:A},()=>[M.show?(e.openBlock(),e.createElementBlock("div",{key:0,ref_key:"scrollBarRefY",ref:g,class:"scrollbar vertical",onClick:ee,onWheel:P},[e.createElementVNode("div",{class:"thumb",ref_key:"scrollBarThumbRefY",ref:y,style:e.normalizeStyle({top:`${M.pos}%`,height:`${M.size}%`}),onMousedown:u[1]||(u[1]=(...p)=>e.unref(z)&&e.unref(z)(...p)),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:g,hidden:m,label:y,icon:R,iconFontClass:E,showRightArrow:S,shortcut:x,hasChildren:M}=e.toRefs(r),I=e.ref(!1),c=e.ref(!1),f=e.ref(),b=e.inject("globalOptions"),k=e.inject("globalHasSlot"),w=e.inject("globalRenderSlot"),i=e.inject("globalCloseMenu"),C=e.inject("menuContext"),$=e.computed(()=>typeof y.value=="string"?y.value:typeof y.value=="function"?je(y.value.toString()):"MenuItem[unknow]");e.provide("MenuItemName",$);const _={getSubMenuInstance:()=>{},showSubMenu:()=>I.value?(C.markActiveMenuItem(_,!0),!0):M.value?(F(),!0):!1,hideSubMenu:()=>{C.closeOtherSubMenu()},isDisabledOrHidden:()=>g.value||m.value,getElement:()=>f.value,focus:()=>c.value=!0,blur:()=>c.value=!1,click:P};e.provide("menuItemInstance",_),e.onMounted(()=>{C.isMenuItemDataCollectedFlag()?e.nextTick(()=>{let v=0;const H=C.getElement();if(H){let z=0;for(let T=0;T<H.children.length;T++){const A=H.children[T];if(A.getAttribute("data-type")==="ContextMenuItem"){if(A===f.value){v=z;break}z++}}}C.addChildMenuItem(_,v)}):C.addChildMenuItem(_)}),e.onBeforeUnmount(()=>{C.removeChildMenuItem(_)});function P(v){if(!g.value){if(v){const H=v.target;if(H.classList.contains("mx-context-no-clickable")||b.value.ignoreClickClassName&&H.classList.contains(b.value.ignoreClickClassName))return;if(b.value.clickCloseClassName&&H.classList.contains(b.value.clickCloseClassName)){v.stopPropagation(),i(r.rawMenuItem);return}}M.value?d.value?(typeof o.value=="function"&&o.value(v),h("click",v)):I.value||F():(typeof o.value=="function"&&o.value(v),h("click",v),B.value&&i(r.rawMenuItem))}}function F(v){c.value=!1,C.checkCloseOtherSubMenuTimeOut()||C.closeOtherSubMenu(),g.value||(C.markActiveMenuItem(_),M.value&&(v||C.markThisOpenedByKeyBoard(),C.addOpenedSubMenu(L),I.value=!0,e.nextTick(()=>h("subMenuOpen",_))))}function L(){c.value=!1,I.value=!1,h("subMenuClose",_)}function O(){return{disabled:g.value,label:y.value,icon:R.value,iconFontClass:E.value,showRightArrow:S.value,clickClose:B.value,clickableWhenHasChildren:d.value,shortcut:x.value,theme:b.value.theme,isOpen:I,hasChildren:M,onClick:P,onMouseEnter:F,closeMenu:i}}return l(_),(v,H)=>e.unref(m)?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",{key:0,class:"mx-context-menu-item-wrapper",ref_key:"menuItemRef",ref:f,"data-type":"ContextMenuItem"},[e.unref(k)("itemRender")?(e.openBlock(),e.createBlock(e.unref(D),{key:0,vnode:()=>e.unref(w)("itemRender",O())},null,8,["vnode"])):t.customRender?(e.openBlock(),e.createBlock(e.unref(D),{key:1,vnode:t.customRender,data:O()},null,8,["vnode","data"])):(e.openBlock(),e.createElementBlock("div",{key:2,class:e.normalizeClass(["mx-context-menu-item",e.unref(g)?"disabled":"",c.value?"keyboard-focus":"",t.customClass?" "+t.customClass:"",I.value?"open":""]),onClick:P,onMouseenter:F},[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(k)("itemIconRender")?(e.openBlock(),e.createBlock(e.unref(D),{key:0,vnode:()=>e.unref(w)("itemIconRender",O())},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(R)!="string"?(e.openBlock(),e.createBlock(e.unref(D),{key:2,vnode:e.unref(R),data:e.unref(R)},null,8,["vnode","data"])):typeof e.unref(R)=="string"&&e.unref(R)!==""?(e.openBlock(),e.createElementBlock("i",{key:3,class:e.normalizeClass(e.unref(R)+" icon "+e.unref(E)+" "+e.unref(b).iconFontClass)},null,2)):e.createCommentVNode("",!0)]),t.checked?e.renderSlot(v.$slots,"check",{key:0},()=>[e.unref(k)("itemCheckRender")?(e.openBlock(),e.createBlock(e.unref(D),{key:0,vnode:()=>e.unref(w)("itemCheckRender",O())},null,8,["vnode"])):e.createCommentVNode("",!0),e.createVNode(Ge)]):e.createCommentVNode("",!0)],2),e.renderSlot(v.$slots,"label",{},()=>[e.unref(k)("itemLabelRender")?(e.openBlock(),e.createBlock(e.unref(D),{key:0,vnode:()=>e.unref(w)("itemLabelRender",O())},null,8,["vnode"])):typeof e.unref(y)=="string"?(e.openBlock(),e.createElementBlock("span",lt,e.toDisplayString(e.unref(y)),1)):(e.openBlock(),e.createBlock(e.unref(D),{key:2,vnode:e.unref(y),data:e.unref(y)},null,8,["vnode","data"]))])]),e.createElementVNode("div",st,[e.unref(x)||v.$slots.shortcut?e.renderSlot(v.$slots,"shortcut",{key:0},()=>[e.unref(k)("itemShortcutRender")?(e.openBlock(),e.createBlock(e.unref(D),{key:0,vnode:()=>e.unref(w)("itemShortcutRender",O())},null,8,["vnode"])):e.createCommentVNode("",!0),e.createElementVNode("span",rt,e.toDisplayString(e.unref(x)),1)]):e.createCommentVNode("",!0),e.unref(S)?e.renderSlot(v.$slots,"rightArrow",{key:1},()=>[e.unref(k)("itemRightArrowRender")?(e.openBlock(),e.createBlock(e.unref(D),{key:0,vnode:()=>e.unref(w)("itemRightArrowRender",O())},null,8,["vnode"])):e.createCommentVNode("",!0),e.createVNode(tt)]):e.createCommentVNode("",!0)])])],34)),e.renderSlot(v.$slots,"submenu",{context:_,show:I.value})],512))}}),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},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"),g=e.inject("globalOptions");e.inject("globalHasSlot"),e.inject("globalRenderSlot");const m=e.ref("UnknowOrRoot"),y=e.inject("MenuItemName",m),{zIndex:R,getParentWidth:E,getParentHeight:S,getZoom:x}=d,{adjustPosition:M}=e.toRefs(r),I=e.ref(),c=e.ref(),f=e.ref(),b=[],k=e.inject("globalSetCurrentSubMenu"),w=[];let i=null,C=0;function $(){i&&i.blur()}function _(n,u){if(n){for(let p=u!==void 0?u:0;p<w.length;p++)if(!w[p].isDisabledOrHidden()){P(p);break}}else for(let p=u!==void 0?u:w.length-1;p>=0;p--)if(!w[p].isDisabledOrHidden()){P(p);break}}function P(n){if(i&&$(),n!==void 0&&(i=w[Math.max(0,Math.min(n,w.length-1))]),!i)return;i.focus();const u=i.getElement();u&&u.scrollIntoView({behavior:"auto",block:"nearest",inline:"nearest"})}function F(){k(L)}const L={el:f,name:y,isTopLevel:()=>d.getParentContext()===null,closeSelfAndActiveParent:()=>{const n=H.getParentContext();if(n){n.closeOtherSubMenu();const u=n.getSubMenuInstanceContext();if(u)return u.focusCurrentItem(),!0}return!1},closeCurrentSubMenu:()=>{var n;return(n=H.getParentContext())==null?void 0:n.closeOtherSubMenu()},moveCurrentItemFirst:()=>_(!0),moveCurrentItemLast:()=>_(!1),moveCurrentItemDown:()=>_(!0,i?w.indexOf(i)+1:0),moveCurrentItemUp:()=>_(!1,i?w.indexOf(i)-1:0),focusCurrentItem:()=>P(),openCurrentItemSubMenu:()=>i?i==null?void 0:i.showSubMenu():!1,triggerCurrentItemClick:n=>i==null?void 0:i.click(n)};let O=!1,v=!1;const H={zIndex:R+1,container:d.container,adjustPadding:g.value.adjustPadding||V.defaultAdjustPadding,getParentWidth:()=>{var n;return((n=f.value)==null?void 0:n.offsetWidth)||0},getParentHeight:()=>{var n;return((n=f.value)==null?void 0:n.offsetHeight)||0},getPositon:()=>[W.value.x,W.value.y],getZoom:()=>g.value.zoom||V.defaultZoom,addOpenedSubMenu(n){b.push(n)},closeOtherSubMenu(){b.forEach(n=>n()),b.splice(0,b.length),k(L)},checkCloseOtherSubMenuTimeOut(){return C?(clearTimeout(C),C=0,!0):!1},closeOtherSubMenuWithTimeOut(){C=setTimeout(()=>{C=0,this.closeOtherSubMenu()},200)},addChildMenuItem:(n,u)=>{u===void 0?w.push(n):w.splice(u,0,n)},removeChildMenuItem:n=>{w.splice(w.indexOf(n),1),n.getSubMenuInstance=()=>{}},markActiveMenuItem:(n,u=!1)=>{$(),i=n,u&&P()},markThisOpenedByKeyBoard:()=>{O=!0},isOpenedByKeyBoardFlag:()=>O?(O=!1,!0):!1,isMenuItemDataCollectedFlag:()=>v,getElement:()=>f.value||null,getParentContext:()=>d,getSubMenuInstanceContext:()=>L};e.provide("menuContext",H);const z={getChildItem:n=>w[n],getMenuDimensions:()=>c.value?{width:c.value.offsetWidth,height:c.value.offsetHeight}:{width:0,height:0},getSubmenuRoot:()=>c.value,getMenu:()=>f.value,getScrollValue:()=>{var n,u;return((u=(n=I.value)==null?void 0:n.getScrollContainer())==null?void 0:u.scrollTop)||0},setScrollValue:n=>{var u;return(u=I.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}},T=e.inject("menuItemInstance",void 0);T&&(T.getSubMenuInstance=()=>z);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 p;const n=f.value,u=c.value;if(n&&u&&I.value){const{container:a}=d,q=(E==null?void 0:E())??0,N=(S==null?void 0:S())??0,Y=getComputedStyle(u),ae=parseFloat(Y.paddingLeft),ie=parseFloat(Y.paddingTop),fe=N>0?ie:0,bt=document.documentElement.scrollHeight/x(),kt=document.documentElement.scrollWidth/x(),yt=Math.min(kt,a.offsetWidth),_e=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=(p=r.parentMenuItemContext)==null?void 0:p.getElement();te&&(W.value.y+=te.offsetHeight),W.value.y-=(n.offsetHeight+ie)/x()}else r.direction.includes("b")?W.value.y-=ie/x():W.value.y-=n.offsetHeight/2/x();e.nextTick(()=>{var He,Oe;he=Z(n,a),me=X(n,a);const te=((Oe=(He=I.value)==null?void 0:He.getScrollContainer())==null?void 0:Oe.scrollHeight)||0,xt=r.maxHeight;A.value=r.maxHeight?Math.min(te,r.maxHeight):te;const Mt=he+n.offsetWidth-yt,Re=me+A.value+fe*2-_e;if(G.value=Re>0,M.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(M.value){const ne=Re,oe=me;ne>oe?W.value.y-=oe-fe:W.value.y-=ne-fe}K.value=_e-(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 p=Z(n,d.container),a=X(n,d.container);W.value.x=p,W.value.y=a}else{const[p,a]=d.getPositon();W.value.x=p,W.value.y=a}e.nextTick(()=>{var p;k(L),(p=f.value)==null||p.focus({preventScroll:!0}),d.isOpenedByKeyBoardFlag()&&e.nextTick(()=>_(!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,T&&(T.getSubMenuInstance=()=>{})}),l(z),(n,u)=>{const p=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(g).menuTransitionProps||{duration:10},{onAfterLeave:u[0]||(u[0]=a=>h("closeAnimFinished"))}),{default:e.withCtx(()=>[t.show?(e.openBlock(),e.createElementBlock("div",e.mergeProps({key:0,ref_key:"submenuRoot",ref:c},n.$attrs,{class:["mx-context-menu",e.unref(g).customClass?e.unref(g).customClass:"",e.unref(g).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(R),left:`${W.value.x}px`,top:`${W.value.y}px`},"data-type":"ContextSubMenu",onClick:F}),[e.createVNode(e.unref(Ke),{ref_key:"scrollRectRef",ref:I,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:f},[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?N=>a.onClick(N):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(g).preserveIconWidth,showRightArrow:a.children&&a.children.length>0,hasChildren:a.children&&a.children.length>0,rawMenuItem:a,onSubMenuOpen:N=>{var Y;return(Y=a.onSubMenuOpen)==null?void 0:Y.call(a,N)},onSubMenuClose:N=>{var Y;return(Y=a.onSubMenuClose)==null?void 0:Y.call(a,N)}},e.createSlots({_:2},[a.children&&a.children.length>0?{name:"submenu",fn:e.withCtx(({context:N,show:Y})=>[e.createVNode(p,{show:Y,parentMenuItemContext:N,items:a.children,maxWidth:a.maxWidth,minWidth:a.minWidth,maxHeight:a.maxHeight,adjustPosition:a.adjustSubMenuPosition!==void 0?a.adjustSubMenuPosition:e.unref(g).adjustPosition,direction:a.direction!==void 0?a.direction:e.unref(g).direction},null,8,["show","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.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},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:g,container:m}=e.toRefs(r);e.onMounted(()=>{g.value&&E()}),e.onBeforeUnmount(()=>{I()}),e.watch(g,i=>{i?E():(pe(y),I())});const y={closeMenu:S,isClosed:x,getMenuRef:()=>B.value,getMenuDimensions:()=>{var i;return((i=B.value)==null?void 0:i.getMenuDimensions())??{width:0,height:0}}};let R=!1;function E(){M(),Pe(y)}function S(i){R=!0,h("close",i),d.value.menuTransitionProps||h("closeAnimFinished"),pe(y)}function x(){return R}function M(){setTimeout(()=>{document.addEventListener("click",k,!0),document.addEventListener("contextmenu",k,!0),document.addEventListener("scroll",b,!0),!r.isFullScreenContainer&&m.value&&m.value.addEventListener("scroll",b,!0),d.value.keyboardControl!==!1&&document.addEventListener("keydown",f,!0)},50)}function I(){document.removeEventListener("contextmenu",k,!0),document.removeEventListener("click",k,!0),document.removeEventListener("scroll",b,!0),!r.isFullScreenContainer&&m.value&&m.value.removeEventListener("scroll",b,!0),d.value.keyboardControl!==!1&&document.removeEventListener("keydown",f,!0)}const c=e.ref();e.provide("globalSetCurrentSubMenu",i=>c.value=i),e.provide("globalGetMenuHostId",m.value.id);function f(i){var $,_,P,F,L,O,v,H,z,T,A,K,G;let C=!0;switch(i.key){case"Escape":{(($=c.value)==null?void 0:$.isTopLevel())===!1?(_=c.value)==null||_.closeCurrentSubMenu():S();break}case"ArrowDown":(P=c.value)==null||P.moveCurrentItemDown();break;case"ArrowUp":(F=c.value)==null||F.moveCurrentItemUp();break;case"Home":(L=c.value)==null||L.moveCurrentItemFirst();break;case"End":(O=c.value)==null||O.moveCurrentItemLast();break;case"ArrowLeft":{(v=c.value)!=null&&v.closeSelfAndActiveParent()||(z=(H=d.value).onKeyFocusMoveLeft)==null||z.call(H);break}case"ArrowRight":(T=c.value)!=null&&T.openCurrentItemSubMenu()||(K=(A=d.value).onKeyFocusMoveRight)==null||K.call(A);break;case"Enter":(G=c.value)==null||G.triggerCurrentItemClick(i);break;default:C=!1;break}C&&c.value&&(i.stopPropagation(),i.preventDefault())}function b(i){d.value.closeWhenScroll!==!1&&w(i.target,null)}function k(i){w(i.target,i)}function w(i,C){var $,_;for(;i;){if(i.classList&&i.classList.contains("mx-context-menu"))return;i=i.parentNode}C?d.value.clickCloseOnOutside!==!1?(I(),S()):(_=($=d.value).onClickOnOutside)==null||_.call($,C):(I(),S())}return e.provide("globalOptions",d),e.provide("globalCloseMenu",S),e.provide("globalIsFullScreenContainer",r.isFullScreenContainer),e.provide("globalHasSlot",i=>o[i]!==void 0),e.provide("globalRenderSlot",(i,C)=>e.renderSlot(o,i,{...C},()=>[e.h("span","Render slot failed")],!1)),e.provide("menuContext",{zIndex:d.value.zIndex||V.defaultZindex,container:m.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(y),(i,C)=>(e.openBlock(),e.createBlock(ue,{ref_key:"submenuInstance",ref:B,show:e.unref(g),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:C[0]||(C[0]=$=>h("closeAnimFinished"))},{default:e.withCtx(()=>[e.renderSlot(i.$slots,"default")]),_:3},8,["show","items","adjustPosition","maxWidth","minWidth","maxHeight","direction"]))}}),Bt="",we=e.defineComponent({__name:"ContextMenu",props:{options:{type:Object,default:null},show:{type:Boolean,default:!1}},emits:["update:show","close"],setup(t,{expose:l,emit:s}){const r=s,h=t,{options:o,show:B}=e.toRefs(h),{isNew:d,container:g,eleId:m}=Ce(o.value),y=e.ref(null),R=e.useSlots();function E(S){var x,M;r("update:show",!1),r("close"),(M=(x=o.value).onClose)==null||M.call(x,S)}return l({closeMenu:()=>r("update:show",!1),isClosed:()=>!B.value,getMenuRef:()=>{var S;return(S=y.value)==null?void 0:S.getMenuRef()},getMenuDimensions:()=>{var S;return((S=y.value)==null?void 0:S.getMenuDimensions())??{width:0,height:0}}}),(S,x)=>(e.openBlock(),e.createBlock(e.Teleport,{to:`#${e.unref(m)}`},[e.createVNode(ve,{ref_key:"menuRef",ref:y,options:e.unref(o),show:e.unref(B),container:e.unref(g),isFullScreenContainer:!e.unref(d),onClose:E},e.createSlots({_:2},[e.renderList(e.unref(R),(M,I)=>({name:I,fn:e.withCtx(c=>[e.renderSlot(S.$slots,I,e.normalizeProps(e.guardReactiveProps(c)))])}))]),1032,["options","show","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,g=e.ref(),m=e.ref();return l.expose({getSubMenuRef:()=>g.value,getMenuItemRef:()=>m.value}),()=>e.h(se,{...t,ref:m,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:y=>e.h(ue,{ref:g,show:y.show,maxWidth:h.value,minWidth:o.value,maxHeight:B.value,adjustPosition:d,parentMenuItemContext:y.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 Ee()},closeContextMenu:ge,transformMenuPosition:Ne},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 g=null,m=-1;function y(){m<h.value.length-1?m++:m=0,S(m,h.value[m])}function R(){m>0?m--:m=h.value.length-1,S(m,h.value[m])}function E(c){const f=l.options.barPopDirection??"bl";let b=0,k=0;return f.startsWith("b")?k=X(c)+c.offsetHeight:f.startsWith("t")?k=X(c):k=X(c)+c.offsetHeight/2,f.endsWith("l")?b=Z(c):f.startsWith("r")?b=Z(c)+c.offsetWidth:b=Z(c)+c.offsetWidth/2,{x:b,y:k+5}}function S(c,f){var k;if(m=c,!f.children)return;g&&(g.closeMenu(),g=null,r.value=!0),o.value=f;const b=(k=s.value)==null?void 0:k.children[c];if(b){const{x:w,y:i}=E(b);g=de.showContextMenu({...l.options,items:f.children,x:w,y:i,onKeyFocusMoveLeft(){R()},onKeyFocusMoveRight(){y()},onClose(){o.value==f&&(r.value=!1,o.value=null),typeof f.onSubMenuClose=="function"&&f.onSubMenuClose(void 0)}}),g&&typeof f.onSubMenuOpen=="function"&&f.onSubMenuOpen(void 0)}}function x(){m=0;const c=s.value;if(c){const{x:f,y:b}=E(c);g=de.showContextMenu({...l.options,x:f,y:b})}}function M(c,f){f?(r.value=!0,S(c,f),f.onClick&&(f.clickableWhenHasChildren===!0&&f.children&&f.children.length>0||!f.children||f.children.length===0)&&f.onClick()):x()}function I(c,f){r.value&&S(c,f)}return(c,f)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["mx-menu-bar",t.options.theme??"",t.options.mini?"mini":""]),onFocus:B,onBlur:d},[e.renderSlot(c.$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:f[0]||(f[0]=b=>M(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,k)=>(e.openBlock(),e.createElementBlock("div",{key:k,class:e.normalizeClass(["mx-menu-bar-item",b==o.value?"active":""]),onClick:w=>M(k,b),onMouseenter:w=>I(k,b)},e.toDisplayString(b.label),43,gt))),128))],512)),e.renderSlot(c.$slots,"suffix")],34))}}),Rt="";j.ContextMenu=we,j.ContextMenuGroup=Be,j.ContextMenuItem=se,j.ContextMenuSeparator=J,j.MenuBar=Ct,j.default=de,Object.defineProperties(j,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
//# sourceMappingURL=vue3-context-menu.umd.js.map