ol-contextmenu - npm Package Compare versions

Comparing version 5.1.1 to 5.1.2

dist/ol-contextmenu.iife.js

 
   /*!
-  * ol-contextmenu - v5.1.1
+  * ol-contextmenu - v5.1.2
   * https://github.com/jonataswalker/ol-contextmenu
-  * Built: Sat Nov 12 2022 12:41:10 GMT-0300 (Brasilia Standard Time)
+  * Built: Mon Dec 26 2022 19:24:15 GMT-0300 (Brasilia Standard Time)
   */
 
-var ContextMenu=function(m,h){"use strict";var H=Object.defineProperty;var U=(m,h,f)=>h in m?H(m,h,{enumerable:!0,configurable:!0,writable:!0,value:f}):m[h]=f;var r=(m,h,f)=>(U(m,typeof h!="symbol"?h+"":h,f),f);const S=(n=>n&&typeof n=="object"&&"default"in n?n:{default:n})(m);var b=(n=>(n.CONTEXTMENU="contextmenu",n.CLICK="click",n.DBLCLICK="dblclick",n))(b||{}),d=(n=>(n.BEFOREOPEN="beforeopen",n.OPEN="open",n.CLOSE="close",n.ADD_MENU_ENTRY="add-menu-entry",n))(d||{});class C extends h.MapBrowserEvent{constructor(s){super(s.type,s.map,s.originalEvent)}}const k={width:150,scrollAt:4,eventType:b.CONTEXTMENU,defaultItems:!0,items:[]},p="ol-ctx-menu",a={namespace:p,container:`${p}-container`,separator:`${p}-separator`,submenu:`${p}-submenu`,hidden:`${p}-hidden`,icon:`${p}-icon`,zoomIn:`${p}-zoom-in`,zoomOut:`${p}-zoom-out`,unselectable:"ol-unselectable"},A=[{text:"Zoom In",classname:`${a.zoomIn} ${a.icon}`,callback:(n,s)=>{const e=s.getView();e.animate({zoom:Number(e.getZoom())+1,duration:700,center:n.coordinate})}},{text:"Zoom Out",classname:`${a.zoomOut} ${a.icon}`,callback:(n,s)=>{const e=s.getView();e.animate({zoom:Number(e.getZoom())-1,duration:700,center:n.coordinate})}}];var N={exports:{}};function x(){}x.prototype={on:function(n,s,e){var t=this.e||(this.e={});return(t[n]||(t[n]=[])).push({fn:s,ctx:e}),this},once:function(n,s,e){var t=this;function i(){t.off(n,i),s.apply(e,arguments)}return i._=s,this.on(n,i,e)},emit:function(n){var s=[].slice.call(arguments,1),e=((this.e||(this.e={}))[n]||[]).slice(),t=0,i=e.length;for(t;t<i;t++)e[t].fn.apply(e[t].ctx,s);return this},off:function(n,s){var e=this.e||(this.e={}),t=e[n],i=[];if(t&&s)for(var o=0,c=t.length;o<c;o++)t[o].fn!==s&&t[o].fn._!==s&&i.push(t[o]);return i.length?e[n]=i:delete e[n],this}},N.exports=x;var T=N.exports.TinyEmitter=x;const y=new T;function v(n){const s=document.createDocumentFragment(),e=document.createElement("div");for(e.innerHTML=n;e.firstChild;)s.append(e.firstChild);return s}function _(n){const s=document.importNode(n),e=n.offsetWidth;s.style.cssText=`position: fixed; top: 0; left: 0; overflow: auto; visibility: hidden; pointer-events: none; height: unset; max-height: unset; width: ${e}px`;const t=v("<span>Foo</span>"),i=v("<span>Foo</span>"),o=document.createElement("li"),c=document.createElement("li");o.append(t),c.append(i),s.append(o),s.append(c),n.parentNode?.append(s);const E=s.offsetHeight/2;return n.parentNode?.removeChild(s),E}function $(n,s,e=!1){const t=`_${Math.random().toString(36).slice(2,11)}`;if(typeof s!="string"&&"text"in s){const E=`<span>${s.text}</span>`,M=v(E),l=document.createElement("li");return s.classname=s.classname||"",s.icon&&(s.classname===""?s.classname=a.icon:s.classname.includes(a.icon)===!1&&(s.classname+=` ${a.icon}`),l.setAttribute("style",`background-image:url(${s.icon})`)),l.id=t,l.className=s.classname,l.append(M),n.append(l),y.emit(d.ADD_MENU_ENTRY,{id:t,isSubmenu:e,isSeparator:!1,callback:"callback"in s?s.callback:null,data:"data"in s?s.data:null},l),l}const i=`<li id="${t}" class="${a.separator}"><hr></li>`,o=v(i);n.append(o);const c=n.lastChild;return y.emit(d.ADD_MENU_ENTRY,{id:t,isSubmenu:e,isSeparator:!0,callback:null,data:null},c),c}function L(n,s,e){s.forEach(t=>{if(typeof t!="string"&&"items"in t&&Array.isArray(t.items)){const i=$(n,t,!0);i.classList.add(a.submenu);const o=document.createElement("ul");o.classList.add(a.container),o.style.width=`${e}px`,i.append(o),L(o,t.items,e)}else $(n,t)})}const F="";function w(n,s){if(!n)throw new Error(s)}class D extends S.default{constructor(e={}){w(typeof e=="object","@param `opts` should be object type!");const t=document.createElement("div");super({element:t});r(this,"map");r(this,"container");r(this,"coordinate",[]);r(this,"pixel",[]);r(this,"contextMenuEventListener");r(this,"entryCallbackEventListener");r(this,"mapMoveListener");r(this,"lineHeight",0);r(this,"disabled");r(this,"opened");r(this,"items",[]);r(this,"menuEntries",new Map);r(this,"options");this.options={...k,...e};const i=document.createElement("ul");t.append(i),t.style.width=`${this.options.width}px`,t.classList.add(a.container,a.unselectable,a.hidden),this.container=t,this.contextMenuEventListener=o=>{this.handleContextMenu(o)},this.entryCallbackEventListener=o=>{this.handleEntryCallback(o)},this.mapMoveListener=()=>{this.handleMapMove()},this.disabled=!1,this.opened=!1}clear(){for(const e of this.menuEntries.keys())this.removeMenuEntry(e);this.container.replaceChildren(),this.container.append(document.createElement("ul"))}enable(){this.disabled=!1}disable(){this.disabled=!0}getDefaultItems(){return A}countItems(){return this.menuEntries.size}extend(e){w(Array.isArray(e),"@param `items` should be an Array."),L(this.container.firstElementChild,e,this.options.width)}closeMenu(){this.opened=!1,this.container.classList.add(a.hidden),this.dispatchEvent(d.CLOSE)}isOpen(){return this.opened}updatePosition(e){w(Array.isArray(e),"@param `pixel` should be an Array."),this.isOpen()&&(this.pixel=e,this.positionContainer())}pop(){const e=Array.from(this.menuEntries.keys()).pop();e&&this.removeMenuEntry(e)}shift(){const e=Array.from(this.menuEntries.keys()).shift();e&&this.removeMenuEntry(e)}push(e){e&&this.extend([e])}setMap(e){if(super.setMap(e),e){this.map=e,this.map.getViewport().addEventListener(this.options.eventType,this.contextMenuEventListener,!1),this.map.on("movestart",()=>{this.handleMapMove()}),y.on(d.ADD_MENU_ENTRY,(i,o)=>{this.handleAddMenuEntry(i,o)},this),this.items=this.options.defaultItems?this.options.items.concat(A):this.options.items,L(this.container.firstElementChild,this.items,this.options.width);const t=this.getMenuEntriesLength();this.lineHeight=t>0?this.container.offsetHeight/t:_(this.container)}else this.removeListeners(),this.clear()}removeListeners(){this.map.getViewport().removeEventListener(this.options.eventType,this.contextMenuEventListener,!1),y.off(d.ADD_MENU_ENTRY)}removeMenuEntry(e){const t=document.getElementById(e);t?.remove(),t?.removeEventListener("click",this.entryCallbackEventListener),this.menuEntries.delete(e)}handleContextMenu(e){this.coordinate=this.map.getEventCoordinate(e),this.pixel=this.map.getEventPixel(e),this.dispatchEvent(new C({type:d.BEFOREOPEN,map:this.map,originalEvent:e})),!this.disabled&&(this.options.eventType===b.CONTEXTMENU&&(e.stopPropagation(),e.preventDefault()),setTimeout(()=>{this.openMenu(e)}),e.target?.addEventListener("pointerdown",t=>{this.opened&&(t.stopPropagation(),this.closeMenu())},{once:!0}))}openMenu(e){this.menuEntries.size!==0&&(this.opened=!0,this.positionContainer(),this.container.classList.remove(a.hidden),this.dispatchEvent(new C({type:d.OPEN,map:this.map,originalEvent:e})))}getMenuEntriesLength(){return Array.from(this.menuEntries).filter(([,e])=>e.isSeparator===!1||e.isSubmenu===!1).length}positionContainer(){const e=this.map.getSize()||[0,0],t={w:e[0]-this.pixel[0],h:e[1]-this.pixel[1]},i={w:this.container.offsetWidth,h:Math.round(this.lineHeight*this.getMenuEntriesLength())},o=t.w>=i.w?this.pixel[0]+5:this.pixel[0]-i.w;this.container.style.left=`${o}px`,this.container.style.top=t.h>=i.h?`${this.pixel[1]-10}px`:`${this.pixel[1]-i.h}px`,this.container.style.right="auto",this.container.style.bottom="auto",t.w-=i.w;const c=l=>Array.from(l.children).filter(g=>g.tagName==="LI"&&g.classList.contains(a.submenu));let E=0;const M=(l,g)=>{E+=1,c(l).forEach(O=>{const I=g>=i.w?i.w-8:(i.w+8)*-1,u=O.querySelector(`ul.${a.container}`),z=Math.round(this.lineHeight*Array.from(u.children).filter(P=>P.tagName==="LI").length);u.style.left=`${I}px`,u.style.right="auto",u.style.top=t.h>=z+i.h?"0":`-${u.offsetHeight-25}px`,u.style.bottom="auto",u.style.zIndex=String(E),c(u).length>0&&M(u,g-i.w)})};M(this.container.firstElementChild,t.w)}handleMapMove(){this.closeMenu()}handleEntryCallback(e){e.preventDefault(),e.stopPropagation();const t=e.currentTarget,i=this.menuEntries.get(t.id);if(!i)return;const o={coordinate:this.coordinate,data:i.data};this.closeMenu(),i.callback?.(o,this.map)}handleAddMenuEntry(e,t){this.menuEntries.set(e.id,e),"callback"in e&&typeof e.callback=="function"&&t.addEventListener("click",this.entryCallbackEventListener,!1)}}return D}(ol.control.Control,ol);
+var ContextMenu=function(f,h){"use strict";var P=Object.defineProperty;var H=(f,h,u)=>h in f?P(f,h,{enumerable:!0,configurable:!0,writable:!0,value:u}):f[h]=u;var a=(f,h,u)=>(H(f,typeof h!="symbol"?h+"":h,u),u);var u=(s=>(s.CONTEXTMENU="contextmenu",s.CLICK="click",s.DBLCLICK="dblclick",s))(u||{}),p=(s=>(s.BEFOREOPEN="beforeopen",s.OPEN="open",s.CLOSE="close",s.ADD_MENU_ENTRY="add-menu-entry",s))(p||{});class C extends h.MapBrowserEvent{constructor(n){super(n.type,n.map,n.originalEvent)}}const $={width:150,scrollAt:4,eventType:u.CONTEXTMENU,defaultItems:!0,items:[]},m="ol-ctx-menu",r={namespace:m,container:`${m}-container`,separator:`${m}-separator`,submenu:`${m}-submenu`,hidden:`${m}-hidden`,icon:`${m}-icon`,zoomIn:`${m}-zoom-in`,zoomOut:`${m}-zoom-out`,unselectable:"ol-unselectable"},A=[{text:"Zoom In",classname:`${r.zoomIn} ${r.icon}`,callback:(s,n)=>{const e=n.getView();e.animate({zoom:Number(e.getZoom())+1,duration:700,center:s.coordinate})}},{text:"Zoom Out",classname:`${r.zoomOut} ${r.icon}`,callback:(s,n)=>{const e=n.getView();e.animate({zoom:Number(e.getZoom())-1,duration:700,center:s.coordinate})}}];var b={},S={get exports(){return b},set exports(s){b=s}};function x(){}x.prototype={on:function(s,n,e){var t=this.e||(this.e={});return(t[s]||(t[s]=[])).push({fn:n,ctx:e}),this},once:function(s,n,e){var t=this;function i(){t.off(s,i),n.apply(e,arguments)}return i._=n,this.on(s,i,e)},emit:function(s){var n=[].slice.call(arguments,1),e=((this.e||(this.e={}))[s]||[]).slice(),t=0,i=e.length;for(t;t<i;t++)e[t].fn.apply(e[t].ctx,n);return this},off:function(s,n){var e=this.e||(this.e={}),t=e[s],i=[];if(t&&n)for(var o=0,c=t.length;o<c;o++)t[o].fn!==n&&t[o].fn._!==n&&i.push(t[o]);return i.length?e[s]=i:delete e[s],this}},S.exports=x;var k=b.TinyEmitter=x;const v=new k;function y(s){const n=document.createDocumentFragment(),e=document.createElement("div");for(e.innerHTML=s;e.firstChild;)n.append(e.firstChild);return n}function T(s){const n=document.importNode(s),e=s.offsetWidth;n.style.cssText=`position: fixed; top: 0; left: 0; overflow: auto; visibility: hidden; pointer-events: none; height: unset; max-height: unset; width: ${e}px`;const t=y("<span>Foo</span>"),i=y("<span>Foo</span>"),o=document.createElement("li"),c=document.createElement("li");o.append(t),c.append(i),n.append(o),n.append(c),s.parentNode?.append(n);const E=n.offsetHeight/2;return s.parentNode?.removeChild(n),E}function N(s,n,e=!1){const t=`_${Math.random().toString(36).slice(2,11)}`;if(typeof n!="string"&&"text"in n){const E=`<span>${n.text}</span>`,M=y(E),l=document.createElement("li");return n.classname=n.classname||"",n.icon&&(n.classname===""?n.classname=r.icon:n.classname.includes(r.icon)===!1&&(n.classname+=` ${r.icon}`),l.setAttribute("style",`background-image:url(${n.icon})`)),l.id=t,l.className=n.classname,l.append(M),s.append(l),v.emit(p.ADD_MENU_ENTRY,{id:t,isSubmenu:e,isSeparator:!1,callback:"callback"in n?n.callback:null,data:"data"in n?n.data:null},l),l}const i=`<li id="${t}" class="${r.separator}"><hr></li>`,o=y(i);s.append(o);const c=s.lastChild;return v.emit(p.ADD_MENU_ENTRY,{id:t,isSubmenu:e,isSeparator:!0,callback:null,data:null},c),c}function L(s,n,e){n.forEach(t=>{if(typeof t!="string"&&"items"in t&&Array.isArray(t.items)){const i=N(s,t,!0);i.classList.add(r.submenu);const o=document.createElement("ul");o.classList.add(r.container),o.style.width=`${e}px`,i.append(o),L(o,t.items,e)}else N(s,t)})}const U="";function w(s,n){if(!s)throw new Error(n)}class O extends f{constructor(e={}){w(typeof e=="object","@param `opts` should be object type!");const t=document.createElement("div");super({element:t});a(this,"map");a(this,"container");a(this,"coordinate",[]);a(this,"pixel",[]);a(this,"contextMenuEventListener");a(this,"entryCallbackEventListener");a(this,"mapMoveListener");a(this,"lineHeight",0);a(this,"disabled");a(this,"opened");a(this,"items",[]);a(this,"menuEntries",new Map);a(this,"options");this.options={...$,...e};const i=document.createElement("ul");t.append(i),t.style.width=`${this.options.width}px`,t.classList.add(r.container,r.unselectable,r.hidden),this.container=t,this.contextMenuEventListener=o=>{this.handleContextMenu(o)},this.entryCallbackEventListener=o=>{this.handleEntryCallback(o)},this.mapMoveListener=()=>{this.handleMapMove()},this.disabled=!1,this.opened=!1}clear(){for(const e of this.menuEntries.keys())this.removeMenuEntry(e);this.container.replaceChildren(),this.container.append(document.createElement("ul"))}enable(){this.disabled=!1}disable(){this.disabled=!0}getDefaultItems(){return A}countItems(){return this.menuEntries.size}extend(e){w(Array.isArray(e),"@param `items` should be an Array."),L(this.container.firstElementChild,e,this.options.width)}closeMenu(){this.opened=!1,this.container.classList.add(r.hidden),this.dispatchEvent(p.CLOSE)}isOpen(){return this.opened}updatePosition(e){w(Array.isArray(e),"@param `pixel` should be an Array."),this.isOpen()&&(this.pixel=e,this.positionContainer())}pop(){const e=Array.from(this.menuEntries.keys()).pop();e&&this.removeMenuEntry(e)}shift(){const e=Array.from(this.menuEntries.keys()).shift();e&&this.removeMenuEntry(e)}push(e){e&&this.extend([e])}setMap(e){if(super.setMap(e),e){this.map=e,this.map.getViewport().addEventListener(this.options.eventType,this.contextMenuEventListener,!1),this.map.on("movestart",()=>{this.handleMapMove()}),v.on(p.ADD_MENU_ENTRY,(i,o)=>{this.handleAddMenuEntry(i,o)},this),this.items=this.options.defaultItems?this.options.items.concat(A):this.options.items,L(this.container.firstElementChild,this.items,this.options.width);const t=this.getMenuEntriesLength();this.lineHeight=t>0?this.container.offsetHeight/t:T(this.container)}else this.removeListeners(),this.clear()}removeListeners(){this.map.getViewport().removeEventListener(this.options.eventType,this.contextMenuEventListener,!1),v.off(p.ADD_MENU_ENTRY)}removeMenuEntry(e){const t=document.getElementById(e);t?.remove(),t?.removeEventListener("click",this.entryCallbackEventListener),this.menuEntries.delete(e)}handleContextMenu(e){this.coordinate=this.map.getEventCoordinate(e),this.pixel=this.map.getEventPixel(e),this.dispatchEvent(new C({type:p.BEFOREOPEN,map:this.map,originalEvent:e})),!this.disabled&&(this.options.eventType===u.CONTEXTMENU&&(e.stopPropagation(),e.preventDefault()),setTimeout(()=>{this.openMenu(e)}),e.target?.addEventListener("pointerdown",t=>{this.opened&&(t.stopPropagation(),this.closeMenu())},{once:!0}))}openMenu(e){this.menuEntries.size!==0&&(this.opened=!0,this.positionContainer(),this.container.classList.remove(r.hidden),this.dispatchEvent(new C({type:p.OPEN,map:this.map,originalEvent:e})))}getMenuEntriesLength(){return Array.from(this.menuEntries).filter(([,e])=>e.isSeparator===!1||e.isSubmenu===!1).length}positionContainer(){const e=this.map.getSize()||[0,0],t={w:e[0]-this.pixel[0],h:e[1]-this.pixel[1]},i={w:this.container.offsetWidth,h:Math.round(this.lineHeight*this.getMenuEntriesLength())},o=t.w>=i.w?this.pixel[0]+5:this.pixel[0]-i.w;this.container.style.left=`${o}px`,this.container.style.top=t.h>=i.h?`${this.pixel[1]-10}px`:`${this.pixel[1]-i.h}px`,this.container.style.right="auto",this.container.style.bottom="auto",t.w-=i.w;const c=l=>Array.from(l.children).filter(g=>g.tagName==="LI"&&g.classList.contains(r.submenu));let E=0;const M=(l,g)=>{E+=1,c(l).forEach(D=>{const _=g>=i.w?i.w-8:(i.w+8)*-1,d=D.querySelector(`ul.${r.container}`),I=Math.round(this.lineHeight*Array.from(d.children).filter(z=>z.tagName==="LI").length);d.style.left=`${_}px`,d.style.right="auto",d.style.top=t.h>=I+i.h?"0":`-${d.offsetHeight-25}px`,d.style.bottom="auto",d.style.zIndex=String(E),c(d).length>0&&M(d,g-i.w)})};M(this.container.firstElementChild,t.w)}handleMapMove(){this.closeMenu()}handleEntryCallback(e){e.preventDefault(),e.stopPropagation();const t=e.currentTarget,i=this.menuEntries.get(t.id);if(!i)return;const o={coordinate:this.coordinate,data:i.data};this.closeMenu(),i.callback?.(o,this.map)}handleAddMenuEntry(e,t){this.menuEntries.set(e.id,e),this.positionContainer(),"callback"in e&&typeof e.callback=="function"&&t.addEventListener("click",this.entryCallbackEventListener,!1)}}return O}(ol.control.Control,ol);

dist/ol-contextmenu.js

 
   /*!
-  * ol-contextmenu - v5.1.1
+  * ol-contextmenu - v5.1.2
   * https://github.com/jonataswalker/ol-contextmenu
-  * Built: Sat Nov 12 2022 12:41:10 GMT-0300 (Brasilia Standard Time)
+  * Built: Mon Dec 26 2022 19:24:15 GMT-0300 (Brasilia Standard Time)
   */
@@ -10,7 +10,7 @@
 var T = (s, t, e) => t in s ? k(s, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : s[t] = e;
-var r = (s, t, e) => (T(s, typeof t != "symbol" ? t + "" : t, e), e);
+var a = (s, t, e) => (T(s, typeof t != "symbol" ? t + "" : t, e), e);
 import O from "ol/control/Control";
 import { MapBrowserEvent as D } from "ol";
-var M = /* @__PURE__ */ ((s) => (s.CONTEXTMENU = "contextmenu", s.CLICK = "click", s.DBLCLICK = "dblclick", s))(M || {}), d = /* @__PURE__ */ ((s) => (s.BEFOREOPEN = "beforeopen", s.OPEN = "open", s.CLOSE = "close", s.ADD_MENU_ENTRY = "add-menu-entry", s))(d || {});
-class x extends D {
+var b = /* @__PURE__ */ ((s) => (s.CONTEXTMENU = "contextmenu", s.CLICK = "click", s.DBLCLICK = "dblclick", s))(b || {}), p = /* @__PURE__ */ ((s) => (s.BEFOREOPEN = "beforeopen", s.OPEN = "open", s.CLOSE = "close", s.ADD_MENU_ENTRY = "add-menu-entry", s))(p || {});
+class L extends D {
   constructor(t) {
@@ -23,6 +23,6 @@ super(t.type, t.map, t.originalEvent);
   scrollAt: 4,
-  eventType: M.CONTEXTMENU,
+  eventType: b.CONTEXTMENU,
   defaultItems: !0,
   items: []
-}, u = "ol-ctx-menu", a = {
+}, u = "ol-ctx-menu", r = {
   namespace: u,
@@ -37,6 +37,6 @@ container: `${u}-container`,
   unselectable: "ol-unselectable"
-}, L = [
+}, w = [
   {
     text: "Zoom In",
-    classname: `${a.zoomIn} ${a.icon}`,
+    classname: `${r.zoomIn} ${r.icon}`,
     callback: (s, t) => {
@@ -53,3 +53,3 @@ const e = t.getView();
     text: "Zoom Out",
-    classname: `${a.zoomOut} ${a.icon}`,
+    classname: `${r.zoomOut} ${r.icon}`,
     callback: (s, t) => {
@@ -65,6 +65,13 @@ const e = t.getView();
 ];
-var C = { exports: {} };
-function b() {
+var v = {}, I = {
+  get exports() {
+    return v;
+  },
+  set exports(s) {
+    v = s;
+  }
+};
+function x() {
 }
-b.prototype = {
+x.prototype = {
   on: function(s, t, e) {
@@ -98,5 +105,5 @@ var n = this.e || (this.e = {});
 };
-C.exports = b;
-var I = C.exports.TinyEmitter = b;
-const E = new I();
+I.exports = x;
+var z = v.TinyEmitter = x;
+const E = new z();
 function g(s) {
@@ -108,3 +115,3 @@ const t = document.createDocumentFragment(), e = document.createElement("div");
 }
-function z(s) {
+function P(s) {
   const t = document.importNode(s), e = s.offsetWidth;
@@ -114,11 +121,11 @@ t.style.cssText = `position: fixed; top: 0; left: 0; overflow: auto; visibility: hidden; pointer-events: none; height: unset; max-height: unset; width: ${e}px`;
   o.append(n), c.append(i), t.append(o), t.append(c), s.parentNode?.append(t);
-  const p = t.offsetHeight / 2;
-  return s.parentNode?.removeChild(t), p;
+  const d = t.offsetHeight / 2;
+  return s.parentNode?.removeChild(t), d;
 }
-function w(s, t, e = !1) {
+function C(s, t, e = !1) {
   const n = `_${Math.random().toString(36).slice(2, 11)}`;
   if (typeof t != "string" && "text" in t) {
-    const p = `<span>${t.text}</span>`, f = g(p), l = document.createElement("li");
-    return t.classname = t.classname || "", t.icon && (t.classname === "" ? t.classname = a.icon : t.classname.includes(a.icon) === !1 && (t.classname += ` ${a.icon}`), l.setAttribute("style", `background-image:url(${t.icon})`)), l.id = n, l.className = t.classname, l.append(f), s.append(l), E.emit(
-      d.ADD_MENU_ENTRY,
+    const d = `<span>${t.text}</span>`, f = g(d), l = document.createElement("li");
+    return t.classname = t.classname || "", t.icon && (t.classname === "" ? t.classname = r.icon : t.classname.includes(r.icon) === !1 && (t.classname += ` ${r.icon}`), l.setAttribute("style", `background-image:url(${t.icon})`)), l.id = n, l.className = t.classname, l.append(f), s.append(l), E.emit(
+      p.ADD_MENU_ENTRY,
       {
@@ -134,7 +141,7 @@ id: n,
   }
-  const i = `<li id="${n}" class="${a.separator}"><hr></li>`, o = g(i);
+  const i = `<li id="${n}" class="${r.separator}"><hr></li>`, o = g(i);
   s.append(o);
   const c = s.lastChild;
   return E.emit(
-    d.ADD_MENU_ENTRY,
+    p.ADD_MENU_ENTRY,
     {
@@ -150,11 +157,11 @@ id: n,
 }
-function v(s, t, e) {
+function M(s, t, e) {
   t.forEach((n) => {
     if (typeof n != "string" && "items" in n && Array.isArray(n.items)) {
-      const i = w(s, n, !0);
-      i.classList.add(a.submenu);
+      const i = C(s, n, !0);
+      i.classList.add(r.submenu);
       const o = document.createElement("ul");
-      o.classList.add(a.container), o.style.width = `${e}px`, i.append(o), v(o, n.items, e);
+      o.classList.add(r.container), o.style.width = `${e}px`, i.append(o), M(o, n.items, e);
     } else
-      w(s, n);
+      C(s, n);
   });
@@ -166,3 +173,3 @@ }
 }
-class R extends O {
+class B extends O {
   constructor(e = {}) {
@@ -172,21 +179,21 @@ y(typeof e == "object", "@param `opts` should be object type!");
     super({ element: n });
-    r(this, "map");
-    r(this, "container");
-    r(this, "coordinate", []);
-    r(this, "pixel", []);
-    r(this, "contextMenuEventListener");
-    r(this, "entryCallbackEventListener");
-    r(this, "mapMoveListener");
-    r(this, "lineHeight", 0);
-    r(this, "disabled");
-    r(this, "opened");
-    r(this, "items", []);
-    r(this, "menuEntries", /* @__PURE__ */ new Map());
-    r(this, "options");
+    a(this, "map");
+    a(this, "container");
+    a(this, "coordinate", []);
+    a(this, "pixel", []);
+    a(this, "contextMenuEventListener");
+    a(this, "entryCallbackEventListener");
+    a(this, "mapMoveListener");
+    a(this, "lineHeight", 0);
+    a(this, "disabled");
+    a(this, "opened");
+    a(this, "items", []);
+    a(this, "menuEntries", /* @__PURE__ */ new Map());
+    a(this, "options");
     this.options = { ..._, ...e };
     const i = document.createElement("ul");
     n.append(i), n.style.width = `${this.options.width}px`, n.classList.add(
-      a.container,
-      a.unselectable,
-      a.hidden
+      r.container,
+      r.unselectable,
+      r.hidden
     ), this.container = n, this.contextMenuEventListener = (o) => {
@@ -212,3 +219,3 @@ this.handleContextMenu(o);
   getDefaultItems() {
-    return L;
+    return w;
   }
@@ -219,3 +226,3 @@ countItems() {
   extend(e) {
-    y(Array.isArray(e), "@param `items` should be an Array."), v(
+    y(Array.isArray(e), "@param `items` should be an Array."), M(
       this.container.firstElementChild,
@@ -227,3 +234,3 @@ e,
   closeMenu() {
-    this.opened = !1, this.container.classList.add(a.hidden), this.dispatchEvent(d.CLOSE);
+    this.opened = !1, this.container.classList.add(r.hidden), this.dispatchEvent(p.CLOSE);
   }
@@ -252,3 +259,3 @@ isOpen() {
       }), E.on(
-        d.ADD_MENU_ENTRY,
+        p.ADD_MENU_ENTRY,
         (i, o) => {
@@ -258,3 +265,3 @@ this.handleAddMenuEntry(i, o);
         this
-      ), this.items = this.options.defaultItems ? this.options.items.concat(L) : this.options.items, v(
+      ), this.items = this.options.defaultItems ? this.options.items.concat(w) : this.options.items, M(
         this.container.firstElementChild,
@@ -265,3 +272,3 @@ this.items,
       const n = this.getMenuEntriesLength();
-      this.lineHeight = n > 0 ? this.container.offsetHeight / n : z(this.container);
+      this.lineHeight = n > 0 ? this.container.offsetHeight / n : P(this.container);
     } else
@@ -271,3 +278,3 @@ this.removeListeners(), this.clear();
   removeListeners() {
-    this.map.getViewport().removeEventListener(this.options.eventType, this.contextMenuEventListener, !1), E.off(d.ADD_MENU_ENTRY);
+    this.map.getViewport().removeEventListener(this.options.eventType, this.contextMenuEventListener, !1), E.off(p.ADD_MENU_ENTRY);
   }
@@ -280,8 +287,8 @@ removeMenuEntry(e) {
     this.coordinate = this.map.getEventCoordinate(e), this.pixel = this.map.getEventPixel(e), this.dispatchEvent(
-      new x({
-        type: d.BEFOREOPEN,
+      new L({
+        type: p.BEFOREOPEN,
         map: this.map,
         originalEvent: e
       })
-    ), !this.disabled && (this.options.eventType === M.CONTEXTMENU && (e.stopPropagation(), e.preventDefault()), setTimeout(() => {
+    ), !this.disabled && (this.options.eventType === b.CONTEXTMENU && (e.stopPropagation(), e.preventDefault()), setTimeout(() => {
       this.openMenu(e);
@@ -297,5 +304,5 @@ }), e.target?.addEventListener(
   openMenu(e) {
-    this.menuEntries.size !== 0 && (this.opened = !0, this.positionContainer(), this.container.classList.remove(a.hidden), this.dispatchEvent(
-      new x({
-        type: d.OPEN,
+    this.menuEntries.size !== 0 && (this.opened = !0, this.positionContainer(), this.container.classList.remove(r.hidden), this.dispatchEvent(
+      new L({
+        type: p.OPEN,
         map: this.map,
@@ -321,13 +328,13 @@ originalEvent: e
     const c = (l) => Array.from(l.children).filter(
-      (m) => m.tagName === "LI" && m.classList.contains(a.submenu)
+      (m) => m.tagName === "LI" && m.classList.contains(r.submenu)
     );
-    let p = 0;
+    let d = 0;
     const f = (l, m) => {
-      p += 1, c(l).forEach((A) => {
+      d += 1, c(l).forEach((A) => {
         const N = m >= i.w ? i.w - 8 : (i.w + 8) * -1, h = A.querySelector(
-          `ul.${a.container}`
+          `ul.${r.container}`
         ), $ = Math.round(
           this.lineHeight * Array.from(h.children).filter((S) => S.tagName === "LI").length
         );
-        h.style.left = `${N}px`, h.style.right = "auto", h.style.top = n.h >= $ + i.h ? "0" : `-${h.offsetHeight - 25}px`, h.style.bottom = "auto", h.style.zIndex = String(p), c(h).length > 0 && f(h, m - i.w);
+        h.style.left = `${N}px`, h.style.right = "auto", h.style.top = n.h >= $ + i.h ? "0" : `-${h.offsetHeight - 25}px`, h.style.bottom = "auto", h.style.zIndex = String(d), c(h).length > 0 && f(h, m - i.w);
       });
@@ -352,7 +359,7 @@ };
   handleAddMenuEntry(e, n) {
-    this.menuEntries.set(e.id, e), "callback" in e && typeof e.callback == "function" && n.addEventListener("click", this.entryCallbackEventListener, !1);
+    this.menuEntries.set(e.id, e), this.positionContainer(), "callback" in e && typeof e.callback == "function" && n.addEventListener("click", this.entryCallbackEventListener, !1);
   }
 }
 export {
-  R as default
+  B as default
 };

package.json

 {
     "name": "ol-contextmenu",
-    "version": "5.1.1",
+    "version": "5.1.2",
     "description": "Custom Context Menu for Openlayers",
@@ -45,23 +45,25 @@ "type": "module",
         "test": "jest",
-        "prepublishOnly": "npm run lint && npm test && npm run build"
+        "prepublishOnly": "npm run lint && npm test && npm run build",
+        "prepare": "husky install"
     },
     "devDependencies": {
-        "@swc/core": "^1.3.15",
-        "@swc/jest": "^0.2.23",
-        "@types/jest": "^29.2.2",
-        "eslint": "^8.27.0",
-        "eslint-config-jwalker": "^7.9.2",
+        "@swc/core": "^1.3.24",
+        "@swc/jest": "^0.2.24",
+        "@types/jest": "^29.2.4",
+        "eslint": "^8.30.0",
+        "eslint-config-jwalker": "^7.10.0",
         "eslint-config-prettier": "^8.5.0",
-        "eslint-plugin-jest": "^27.1.5",
+        "eslint-plugin-jest": "^27.1.7",
         "eslint-plugin-prettier": "^4.2.1",
+        "husky": "^8.0.2",
         "identity-obj-proxy": "^3.0.0",
         "jest": "^29.3.1",
         "jest-environment-jsdom": "^29.3.1",
-        "ol": "^7.1.0",
-        "prettier": "^2.7.1",
+        "ol": "^7.2.2",
+        "prettier": "^2.8.1",
         "rimraf": "^3.0.2",
-        "typescript": "^4.8.4",
-        "vite": "^3.2.3",
-        "vite-plugin-banner": "^0.6.1",
-        "vite-plugin-dts": "^1.7.0"
+        "typescript": "^4.9.4",
+        "vite": "^4.0.3",
+        "vite-plugin-banner": "^0.7.0",
+        "vite-plugin-dts": "^1.7.1"
     },
@@ -68,0 +70,0 @@ "peerDependencies": {

README.md

@@ -24,4 +24,6 @@ # OpenLayers Custom Context Menu
 
-[JSFiddle](https://jsfiddle.net/jonataswalker/ooxs1w5d/).
+[CodeSandbox](https://codesandbox.io/s/openlayers-custom-context-menu-5s99kb?file=/src/index.js)
 
+[JSFiddle](https://jsfiddle.net/jonataswalker/ooxs1w5d/)
+
 ## How to use it?
@@ -28,0 +30,0 @@

No alert changes

Improved metrics

Total package byte prevSize

47714

increased by0.43%

Lines of code

572

increased by1.24%

Number of lines in readme file

255

increased by0.79%

Worsened metrics

Dev dependency count

19

increased by5.56%

No dependency changes