@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 Oe(){return U!==null}function Pe(t){U&&me(),U=t}function he(t){t===U&&(U=null)}function me(){U&&(U.closeMenu(),U=null)}const D={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 Ee(t,l,s,r){return{x:Z(t,r)+l,y:X(t,r)+s}}const ae="mx-menu-default-container",Ne="mx-menu-container-";let $e=0;function pe(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+$e++,h.setAttribute("id",o)),{eleId:o,container:h,isNew:!1}}}let r=document.getElementById(ae);return r||(r=document.createElement("div"),r.setAttribute("id",ae),r.setAttribute("class","mx-menu-ghost-host fullscreen"),document.body.appendChild(r)),r.style.zIndex=(s==null?void 0:s.toString())||D.defaultZindex.toString(),{eleId:ae,container:r,isNew:!0}}function Te(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 ge(t){return typeof t=="number"?`${t}px`:t}const K=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 je(t,l){const s={...t};return delete s[l],s}var Fe=Object.defineProperty,Le=(t,l,s)=>l in t?Fe(t,l,{enumerable:!0,configurable:!0,writable:!0,value:s}):t[l]=s,Ce=(t,l,s)=>Le(t,typeof l!="symbol"?l+"":l,s);class be{constructor(l,s){Ce(this,"x",0),Ce(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 ke(t){const{onDown:l,onMove:s,onUp:r}=t,h=new be,o=new be;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 ze(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 J=[],ye=ze(100,()=>{for(const t of J)t()});function Ae(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(){ye.start(),J.push(B)},stopResizeChecker(){const d=J.indexOf(B);d>=0&&J.splice(d,1),J.length===0&&ye.stop()}}}const xe=140,Ve=70,De=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),P=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=P.value,p=S.value;const a=u&&(I!==o.value.scrollWidth||f!==o.value.offsetWidth),ee=S&&(c!==o.value.scrollHeight||b!==o.value.offsetHeight);if(!n&&!a&&!ee)return;const E=window.getComputedStyle(o.value);(E.overflow==="hidden"||E.overflowX==="hidden")&&(u=!1),(E.overflow==="hidden"||E.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?xe:-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?xe:-140),behavior:"smooth"}),n.preventDefault(),n.stopPropagation())}function N(n){var u;n.deltaMode==0&&((u=o.value)==null||u.scrollTo({top:o.value.scrollTop+(n.deltaY>0?Ve:-70),behavior:"smooth"}),n.preventDefault(),n.stopPropagation())}let F=0,L=0,O=0,v=0;const H=ke({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&&(Y(p.x-F-L),p.preventDefault(),p.stopPropagation())},onUp(){R.value=!1}}),A=ke({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 V(n){o.value&&(o.value.scrollLeft=n/100*(o.value.scrollHeight-o.value.offsetHeight))}function Y(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 _(n){r.scrollBarBackgroundClickable&&Y(n.offsetX-x.sizeRaw/2)}function Q(n){r.scrollBarBackgroundClickable&&G(n.offsetY-M.sizeRaw/2)}const{startResizeChecker:Be,stopResizeChecker:re}=Ae(o,()=>C(),()=>C());return e.onMounted(()=>{e.nextTick(()=>{setTimeout(()=>C(!0),200),C(!0),Be(),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:_,onWheel:W},[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:W},null,36)],544)]):e.createCommentVNode("",!0),M.show?e.renderSlot(n.$slots,"scrollBarY",{key:1,scrollBarValue:M,onScroll:V},()=>[M.show?(e.openBlock(),e.createElementBlock("div",{key:0,ref_key:"scrollBarRefY",ref:g,class:"scrollbar vertical",onClick:Q,onWheel:N},[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(A)&&e.unref(A)(...p)),onWheel:N},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},Ke={},Ye={class:"mx-checked-mark","aria-hidden":"true",viewBox:"0 0 1024 1024"},Ue=[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 Xe(t,l){return e.openBlock(),e.createElementBlock("svg",Ye,Ue)}const Ze=le(Ke,[["render",Xe]]),Ge={},qe={class:"mx-right-arrow","aria-hidden":"true",viewBox:"0 0 1024 1024"},Je=[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 Qe(t,l){return e.openBlock(),e.createElementBlock("svg",qe,Je)}const et=le(Ge,[["render",Qe]]),tt={class:"mx-item-row"},nt=["xlink:href"],ot={key:1,class:"label"},lt={class:"mx-item-row"},st={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:P,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"?Te(y.value.toString()):"MenuItem[unknow]");e.provide("MenuItemName",$);const W={getSubMenuInstance:()=>{},showSubMenu:()=>I.value?(C.markActiveMenuItem(W,!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:N};e.provide("menuItemInstance",W),e.onMounted(()=>{C.isMenuItemDataCollectedFlag()?e.nextTick(()=>{let v=0;const H=C.getElement();if(H){let A=0;for(let T=0;T<H.children.length;T++){const V=H.children[T];if(V.getAttribute("data-type")==="ContextMenuItem"){if(V===f.value){v=A;break}A++}}}C.addChildMenuItem(W,v)}):C.addChildMenuItem(W)}),e.onBeforeUnmount(()=>{C.removeChildMenuItem(W)});function N(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(W),M.value&&(v||C.markThisOpenedByKeyBoard(),C.addOpenedSubMenu(L),I.value=!0,e.nextTick(()=>h("subMenuOpen",W))))}function L(){c.value=!1,I.value=!1,h("subMenuClose",W)}function O(){return{disabled:g.value,label:y.value,icon:R.value,iconFontClass:P.value,showRightArrow:S.value,clickClose:B.value,clickableWhenHasChildren:d.value,shortcut:x.value,theme:b.value.theme,isOpen:I,hasChildren:M,onClick:N,onMouseEnter:F,closeMenu:i}}return l(W),(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(K),{key:0,vnode:()=>e.unref(w)("itemRender",O())},null,8,["vnode"])):t.customRender?(e.openBlock(),e.createBlock(e.unref(K),{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:N,onMouseenter:F},[e.renderSlot(v.$slots,"default",{},()=>[e.createElementVNode("div",tt,[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(K),{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,nt)],16)):typeof e.unref(R)!="string"?(e.openBlock(),e.createBlock(e.unref(K),{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(P)+" "+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(K),{key:0,vnode:()=>e.unref(w)("itemCheckRender",O())},null,8,["vnode"])):e.createCommentVNode("",!0),e.createVNode(Ze)]):e.createCommentVNode("",!0)],2),e.renderSlot(v.$slots,"label",{},()=>[e.unref(k)("itemLabelRender")?(e.openBlock(),e.createBlock(e.unref(K),{key:0,vnode:()=>e.unref(w)("itemLabelRender",O())},null,8,["vnode"])):typeof e.unref(y)=="string"?(e.openBlock(),e.createElementBlock("span",ot,e.toDisplayString(e.unref(y)),1)):(e.openBlock(),e.createBlock(e.unref(K),{key:2,vnode:e.unref(y),data:e.unref(y)},null,8,["vnode","data"]))])]),e.createElementVNode("div",lt,[e.unref(x)||v.$slots.shortcut?e.renderSlot(v.$slots,"shortcut",{key:0},()=>[e.unref(k)("itemShortcutRender")?(e.openBlock(),e.createBlock(e.unref(K),{key:0,vnode:()=>e.unref(w)("itemShortcutRender",O())},null,8,["vnode"])):e.createCommentVNode("",!0),e.createElementVNode("span",st,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(K),{key:0,vnode:()=>e.unref(w)("itemRightArrowRender",O())},null,8,["vnode"])):e.createCommentVNode("",!0),e.createVNode(et)]):e.createCommentVNode("",!0)])])],34)),e.renderSlot(v.$slots,"submenu",{context:W,show:I.value})],512))}}),rt=e.defineComponent({name:"ContextMenuSperator",components:{VNodeRender:K},setup(){const t=e.inject("globalHasSlot"),l=e.inject("globalRenderSlot");return{globalHasSlot:t,globalRenderSlot:l}}}),at={key:1,class:"mx-context-menu-item-sperator mx-context-no-clickable"};function it(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",at))}const q=le(rt,[["render",it]]),ie=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:P,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 W(n,u){if(n){for(let p=u!==void 0?u:0;p<w.length;p++)if(!w[p].isDisabledOrHidden()){N(p);break}}else for(let p=u!==void 0?u:w.length-1;p>=0;p--)if(!w[p].isDisabledOrHidden()){N(p);break}}function N(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:()=>W(!0),moveCurrentItemLast:()=>W(!1),moveCurrentItemDown:()=>W(!0,i?w.indexOf(i)+1:0),moveCurrentItemUp:()=>W(!1,i?w.indexOf(i)-1:0),focusCurrentItem:()=>N(),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||D.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:()=>[_.value.x,_.value.y],getZoom:()=>g.value.zoom||D.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&&N()},markThisOpenedByKeyBoard:()=>{O=!0},isOpenedByKeyBoardFlag:()=>O?(O=!1,!0):!1,isMenuItemDataCollectedFlag:()=>v,getElement:()=>f.value||null,getParentContext:()=>d,getSubMenuInstanceContext:()=>L};e.provide("menuContext",H);const A={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:()=>V.value,adjustPosition:()=>{Q()},getMaxHeight:()=>Y.value,getPosition:()=>_.value,setPosition:(n,u)=>{_.value.x=n,_.value.y=u}},T=e.inject("menuItemInstance",void 0);T&&(T.getSubMenuInstance=()=>A);const V=e.ref(0),Y=e.ref(0),G=e.ref(!1),_=e.ref({x:0,y:0});function Q(){e.nextTick(()=>{const n=f.value,u=c.value;if(n&&u&&I.value){const{container:p}=d,a=(P==null?void 0:P())??0,ee=(S==null?void 0:S())??0,E=getComputedStyle(u),z=parseFloat(E.paddingLeft),te=parseFloat(E.paddingTop),ue=ee>0?te:0,Ct=document.documentElement.scrollHeight/x(),bt=document.documentElement.scrollWidth/x(),kt=Math.min(bt,p.offsetWidth),Ie=Math.min(Ct,p.offsetHeight);let de=Z(n,p),fe=X(n,p);r.direction.includes("l")?_.value.x-=n.offsetWidth+z:r.direction.includes("r")?_.value.x+=a+z:(_.value.x+=a/2,_.value.x-=(n.offsetWidth+z)/2),r.direction.includes("t")?_.value.y-=(n.offsetHeight+te*2)/x():r.direction.includes("b")?_.value.y-=te/x():_.value.y-=(n.offsetHeight+te)/2/x(),e.nextTick(()=>{var Re,He;de=Z(n,p),fe=X(n,p);const We=((He=(Re=I.value)==null?void 0:Re.getScrollContainer())==null?void 0:He.scrollHeight)||0,yt=r.maxHeight;V.value=r.maxHeight?Math.min(We,r.maxHeight):We;const xt=de+n.offsetWidth-kt,_e=fe+V.value+ue*2-Ie;if(G.value=_e>0,M.value&&xt>0){const ne=a+n.offsetWidth-z,oe=de;ne>oe?_.value.x-=oe:_.value.x-=ne}if(G.value){if(M.value){const ne=_e,oe=fe;ne>oe?_.value.y-=oe-ue:_.value.y-=ne-ue}Y.value=Ie-(_.value.y+te)}else Y.value=yt||0})}})}function Be(){}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);_.value.x=p,_.value.y=a}else{const[p,a]=d.getPositon();_.value.x=p,_.value.y=a}e.nextTick(()=>{var p;k(L),(p=f.value)==null||p.focus({preventScroll:!0}),d.isOpenedByKeyBoardFlag()&&e.nextTick(()=>W(!0)),v=!0}),Q()}return e.watch(()=>r.show,n=>{n?re():void 0}),e.onMounted(()=>{o.value=!0,r.show?re():Q()}),e.onBeforeUnmount(()=>{o.value=!1,T&&(T.getSubMenuInstance=()=>{})}),l(A),(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(ge)(t.maxWidth):`${e.unref(D).defaultMaxWidth}px`,minWidth:t.minWidth?e.unref(ge)(t.minWidth):`${e.unref(D).defaultMinWidth}px`,zIndex:e.unref(R),left:`${_.value.x}px`,top:`${_.value.y}px`},"data-type":"ContextSubMenu",onClick:F}),[e.createVNode(e.unref(De),{ref_key:"scrollRectRef",ref:I,scroll:"vertical",maxHeight:Y.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,ee)=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:ee},[a.hidden!==!0&&a.divided==="up"?(e.openBlock(),e.createBlock(q,{key:0})):e.createCommentVNode("",!0),a.hidden!==!0&&a.divided==="self"?(e.openBlock(),e.createBlock(q,{key:1})):(e.openBlock(),e.createBlock(se,{key:2,clickHandler:a.onClick?E=>a.onClick(E):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:E=>{var z;return(z=a.onSubMenuOpen)==null?void 0:z.call(a,E)},onSubMenuClose:E=>{var z;return(z=a.onSubMenuClose)==null?void 0:z.call(a,E)}},e.createSlots({_:2},[a.children&&a.children.length>0?{name:"submenu",fn:e.withCtx(({context:E,show:z})=>[e.createVNode(p,{show:z,parentMenuItemContext:E,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(q,{key:3})):e.createCommentVNode("",!0)],64))),128))])],512)]),_:3},8,["maxHeight"])],16)):e.createCommentVNode("",!0)]),_:3},16)],8,["to"])):e.createCommentVNode("",!0)}}}),vt="",Me=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&&P()}),e.onBeforeUnmount(()=>{I()}),e.watch(g,i=>{i?P():(he(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 P(){M(),Pe(y)}function S(i){R=!0,h("close",i),d.value.menuTransitionProps||h("closeAnimFinished"),he(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 $,W,N,F,L,O,v,H,A,T,V,Y,G;let C=!0;switch(i.key){case"Escape":{(($=c.value)==null?void 0:$.isTopLevel())===!1?(W=c.value)==null||W.closeCurrentSubMenu():S();break}case"ArrowDown":(N=c.value)==null||N.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()||(A=(H=d.value).onKeyFocusMoveLeft)==null||A.call(H);break}case"ArrowRight":(T=c.value)!=null&&T.openCurrentItemSubMenu()||(Y=(V=d.value).onKeyFocusMoveRight)==null||Y.call(V);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 $,W;for(;i;){if(i.classList&&i.classList.contains("mx-context-menu"))return;i=i.parentNode}C?d.value.clickCloseOnOutside!==!1?(I(),S()):(W=($=d.value).onClickOnOutside)==null||W.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||D.defaultZindex,container:m.value,adjustPadding:{x:0,y:0},getZoom:()=>d.value.zoom||D.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(ie,{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(D).defaultMaxWidth,minWidth:e.unref(d).minWidth||e.unref(D).defaultMinWidth,maxHeight:e.unref(d).maxHeight,direction:e.unref(d).direction||e.unref(D).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"]))}}),wt="",Se=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}=pe(o.value),y=e.ref(null),R=e.useSlots();function P(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(Me,{ref_key:"menuRef",ref:y,options:e.unref(o),show:e.unref(B),container:e.unref(g),isFullScreenContainer:!e.unref(d),onClose:P},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"]))}}),ve=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(ie,{ref:g,show:y.show,maxWidth:h.value,minWidth:o.value,maxHeight:B.value,adjustPosition:d,parentMenuItemContext:y.context},{default:l.slots.default}),...je(l.slots,"default")}:l.slots)}});function ct(t,l,s,r){const h=e.ref(!0),o=e.h(Me,{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 we(t,l){const s=pe(t);return ct(t,s.container,s.isNew,l).exposed}const ce={install(t){t.config.globalProperties.$contextmenu=we,t.component("ContextMenu",Se),t.component("ContextMenuItem",se),t.component("ContextMenuGroup",ve),t.component("ContextMenuSperator",q),t.component("ContextMenuSeparator",q),t.component("ContextSubMenu",ie)},showContextMenu(t,l){return we(t,l)},isAnyContextMenuOpen(){return Oe()},closeContextMenu:me,transformMenuPosition:Ee},ut={},dt={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"},ft=[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 ht(t,l){return e.openBlock(),e.createElementBlock("svg",dt,ft)}const mt=le(ut,[["render",ht]]),pt=["onClick","onMouseenter"],gt=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 P(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}=P(b);g=ce.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}=P(c);g=ce.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(mt)])],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,pt))),128))],512)),e.renderSlot(c.$slots,"suffix")],34))}}),_t="";j.ContextMenu=Se,j.ContextMenuGroup=ve,j.ContextMenuItem=se,j.ContextMenuSeparator=q,j.MenuBar=gt,j.default=ce,Object.defineProperties(j,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
//# sourceMappingURL=vue3-context-menu.umd.js.map