@ne1410s/menu 0.1.195 → 1.0.0

package/LICENSE

@@ -1,21 +1,9 @@
-MIT License
-
-Copyright (c) 2020 ne1410s
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+MIT License
+
+Copyright (c) 2026 ne1410s
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

package/README.md

@@ -1,109 +1,109 @@
-# @ne1410s/demo
-
-## A lightweight and customisable context menu.
-
-```html
-<ne14-menu>
-  <li>Hello world</li>
-  <li class="split"></li>
-  <li>
-    <span>Nested Item</span>
-    <ul>
-      <li>Item 1</li>
-      <li class="disabled">Item 2</li>
-    </ul>
-  </li>
-</ne14-menu>
-```
-
-### What Does It Do?
-
-- Provides a context menu with sub-menu support, based on original markup
-- Supports `<a href target>` tags to navigate in new tab or in current tab accordingly
-- Appears and behaves like a browser's "default" context menu
-- Supports item disabling and hiding alike
-- Provides splitters for logical grouping, the presence of which is monitored to strip out orphaned zones / multiple splitters from appearing
-- Supports unicode charset (hex) for icons at either side of the item text, and/or `<img>` tags
-- Displays shortcut keys (the implementation of which is left to the author)
-- Inherits the font family and size (size is ~2/3 that of the html root)
-
-### How Do I Use It?
-
-1. Include the umd script in the head `<script src="PATH_TO_UMD_SCRIPT"></script>`
-2. Declare (or programatically construct) your markup (using below guide)
-   - Whatever click handling you have will be invoked when items are clicked
-3. Position the menu html inside whichever container element(s) the menu applies
-   - **Yes you can easily have different menus for different zones!**
-4. If your menu doesn't need to change, that's all you need to do
-5. But if you did wish to effect a change dynamically, then just alter the structure accordingly and call `.reload()` on the menu instance
-
-### Guidance, Please
-
-- Specify only `<li>` nodes as direct descendants
-- Provide some kind of node text (e.g. either directly or in a `<p>` or `<span>`)
-- Use `li.split` to make a divider line
-- Use `li.disabled` to "grey-out" an item
-- Use `li.hidden` to conceal an item entirely
-- Images & font icons can be included either side of the menu item text:
-  - Icons are unicode charset hex references, specified on the `<li>` as either `data-char-left` / `data-char-right`. If present, these supersede images. If _not_ present: ...
-  - The first nested `<img>` (to not have a `right` class) is used on the left
-  - The first nested `<img class='right'>` is used on the right
-- Use `aria-keyshortcuts` to show a command shortcut (this is _not_ implemented by this component however, it is just to display anything that has been)
-
-NB: To extend this library, or import it in node js, use: _npm i -S @ne1410s/menu_
-
-### Attributes
-
-- _There are no bespoke attributes exposed in this element_
-
-### Events
-
-```javascript
-const menu = document.querySelector('ne14-menu');
-
-// As mentioned, each item click is propagated on the original element.
-// Instead of (or as well as) dedicated handling, one may also proceed via the
-// following generic selection handler
-menu.addEventListener('itemselect', (event) => {
-  console.log('Item Selected!', event);
-});
-```
-
-- `itemselect` occurs when an item is clicked. The custom event detail contains the text of the menu item, its in-menu reference and the original html element
-- `itemhover` and `itemunhover` occur when mouse enters or leaves an item
-- `menuopen` and `menuclose` occur when the menu is opened or closed
-
-### Methods
-
-- `open()` Opens the menu (after closing any others)
-- `close()` Closes the menu
-- `reload()` Recreates the menu according to its current content
-
-### Properties
-
-- _There are no bespoke properties exposed in this element_
-
-### CSS Variables
-
-Some degree of custom styling can be optionally provided, by way of css variables:
-
-```css
-/* Example of 'dark mode': */
-ne14-menu {
-  --bg: #333;
-  --border: 1px solid #888;
-  --box-shadow: 2px 2px 3px #333;
-  --hover-item-bg: #666;
-  --fg: #eee;
-  --disabled-fg: #666;
-}
-```
-
-- **`--bg`** _Background for the menu. Defaults to: `#fff`_
-- **`--border`** _Border for the menu. Defaults to: `1px solid #bbb`_
-- **`--box-shadow`** _Box shadow for the menu. Defaults to: `2px 2px 3px #888`_
-- **`--font`** _Font for the menu. Defaults to: `0.65em inherit`_
-- **`--fg`** _Color for menu items. Defaults to: `#000`_
-- **`--disabled-fg`** _Color for disabled menu items. Defaults to: `#bbb`_
-- **`--split-border`** _Border for split lines. Defaults to: `--border` else `1px solid #bbb`_
-- **`--hover-item-bg`** _Background color for items in the hover state. Defaults to: `#bbb`_
+# @ne1410s/demo
+
+## A lightweight and customisable context menu.
+
+```html
+<ne14-menu>
+  <li>Hello world</li>
+  <li class="split"></li>
+  <li>
+    <span>Nested Item</span>
+    <ul>
+      <li>Item 1</li>
+      <li class="disabled">Item 2</li>
+    </ul>
+  </li>
+</ne14-menu>
+```
+
+### What Does It Do?
+
+- Provides a context menu with sub-menu support, based on original markup
+- Supports `<a href target>` tags to navigate in new tab or in current tab accordingly
+- Appears and behaves like a browser's "default" context menu
+- Supports item disabling and hiding alike
+- Provides splitters for logical grouping, the presence of which is monitored to strip out orphaned zones / multiple splitters from appearing
+- Supports unicode charset (hex) for icons at either side of the item text, and/or `<img>` tags
+- Displays shortcut keys (the implementation of which is left to the author)
+- Inherits the font family and size (size is ~2/3 that of the html root)
+
+### How Do I Use It?
+
+1. Include the umd script in the head `<script src="PATH_TO_UMD_SCRIPT"></script>`
+2. Declare (or programatically construct) your markup (using below guide)
+   - Whatever click handling you have will be invoked when items are clicked
+3. Position the menu html inside whichever container element(s) the menu applies
+   - **Yes you can easily have different menus for different zones!**
+4. If your menu doesn't need to change, that's all you need to do
+5. But if you did wish to effect a change dynamically, then just alter the structure accordingly and call `.reload()` on the menu instance
+
+### Guidance, Please
+
+- Specify only `<li>` nodes as direct descendants
+- Provide some kind of node text (e.g. either directly or in a `<p>` or `<span>`)
+- Use `li.split` to make a divider line
+- Use `li.disabled` to "grey-out" an item
+- Use `li.hidden` to conceal an item entirely
+- Images & font icons can be included either side of the menu item text:
+  - Icons are unicode charset hex references, specified on the `<li>` as either `data-char-left` / `data-char-right`. If present, these supersede images. If _not_ present: ...
+  - The first nested `<img>` (to not have a `right` class) is used on the left
+  - The first nested `<img class='right'>` is used on the right
+- Use `aria-keyshortcuts` to show a command shortcut (this is _not_ implemented by this component however, it is just to display anything that has been)
+
+NB: To extend this library, or import it in node js, use: _npm i -S @ne1410s/menu_
+
+### Attributes
+
+- _There are no bespoke attributes exposed in this element_
+
+### Events
+
+```javascript
+const menu = document.querySelector('ne14-menu');
+
+// As mentioned, each item click is propagated on the original element.
+// Instead of (or as well as) dedicated handling, one may also proceed via the
+// following generic selection handler
+menu.addEventListener('itemselect', (event) => {
+  console.log('Item Selected!', event);
+});
+```
+
+- `itemselect` occurs when an item is clicked. The custom event detail contains the text of the menu item, its in-menu reference and the original html element
+- `itemhover` and `itemunhover` occur when mouse enters or leaves an item
+- `menuopen` and `menuclose` occur when the menu is opened or closed
+
+### Methods
+
+- `open()` Opens the menu (after closing any others)
+- `close()` Closes the menu
+- `reload()` Recreates the menu according to its current content
+
+### Properties
+
+- _There are no bespoke properties exposed in this element_
+
+### CSS Variables
+
+Some degree of custom styling can be optionally provided, by way of css variables:
+
+```css
+/* Example of 'dark mode': */
+ne14-menu {
+  --bg: #333;
+  --border: 1px solid #888;
+  --box-shadow: 2px 2px 3px #333;
+  --hover-item-bg: #666;
+  --fg: #eee;
+  --disabled-fg: #666;
+}
+```
+
+- **`--bg`** _Background for the menu. Defaults to: `#fff`_
+- **`--border`** _Border for the menu. Defaults to: `1px solid #bbb`_
+- **`--box-shadow`** _Box shadow for the menu. Defaults to: `2px 2px 3px #888`_
+- **`--font`** _Font for the menu. Defaults to: `0.65em inherit`_
+- **`--fg`** _Color for menu items. Defaults to: `#000`_
+- **`--disabled-fg`** _Color for disabled menu items. Defaults to: `#bbb`_
+- **`--split-border`** _Border for split lines. Defaults to: `--border` else `1px solid #bbb`_
+- **`--hover-item-bg`** _Background color for items in the hover state. Defaults to: `#bbb`_

package/dist/index.d.ts

@@ -1,2 +1,3 @@
 import { NeMenu } from './menu/menu';
-export { NeMenu as ContextMenu };
+export { NeMenu };
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAMrC,OAAO,EAAE,MAAM,EAAE,CAAC"}

package/dist/index.iife.js

@@ -0,0 +1 @@
+"use strict";var ne_menu=(()=>{var A=Object.defineProperty;var z=Object.getOwnPropertyDescriptor;var F=Object.getOwnPropertyNames;var B=Object.prototype.hasOwnProperty;var j=(s,t)=>{for(var e in t)A(s,e,{get:t[e],enumerable:!0})},Q=(s,t,e,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of F(t))!B.call(s,i)&&i!==e&&A(s,i,{get:()=>t[i],enumerable:!(n=z(t,i))||n.enumerable});return s};var V=s=>Q(A({},"__esModule",{value:!0}),s);var K={};j(K,{NeMenu:()=>E});var N='@charset "UTF-8";li,ul{padding:0;margin:0;font:inherit}li.split .icon,slot{display:none}.top:not(.open),ul:not(.top){visibility:hidden}ul{border:var(--border,1px solid #bbb);background:var(--bg,#fff);box-shadow:var(--box-shadow,2px 2px 3px #888);transition:background-color .6s;z-index:9999999}.top{position:fixed;font-size:var(--font-size, .65rem);user-select:none}.icon.left{left:1em;transform:translate(-50%,-50%)}.icon.right{right:1em;transform:translate(50%,-50%)}.icon{max-width:1em;max-height:1em;position:absolute;top:50%;line-height:0}li>p:not(:empty){margin:0 1em;white-space:nowrap}li.disabled{color:var(--disabled-fg,#bbb)}li.split{border-top:var(--split-border,var(--border,1px solid #bbb));padding:0;margin:.3em}li.split+li.split,li.split:first-child,li.split:last-child{display:none}li.hover:not(.disabed):not(.split){background:var(--hover-item-bg,#bbb)}.top.open li.hover>ul{visibility:visible}li{margin:.2em 0;padding:.5em 1em;display:flex;justify-content:space-between;text-align:left;position:relative;cursor:default;color:var(--fg,#000)}li.group::after{content:"\u25B6";position:absolute;font-size:.65em;right:0;top:50%;transform:translate(-50%,-50%)}ul:not(.top){position:absolute;left:100%;top:-.25em}ul.nestle{left:.5em;top:100%}';var _='<slot></slot><ul class="top"></ul>';var f=class s{mapper;static WHITESPACE_RGX=/\s+/;_items=[];get targets(){return this._items.filter(t=>t instanceof EventTarget).map(t=>t)}get elements(){return this._items.filter(t=>t instanceof Element).map(t=>t)}get nodes(){return this._items.filter(t=>t instanceof Node).map(t=>t)}get containers(){return this._items.map(t=>t).filter(t=>typeof t.append=="function")}get length(){return this._items.length}constructor(t,...e){this.mapper=t,this.add(...e)}get=t=>this._items[t];add(...t){return this._items.push(...this.mapper.Map(t)),this}each(t){return this._items.forEach((e,n)=>t(e,n)),this}prop(t,e){return this.each(n=>{t in n&&(n[t]=e)})}fire(t,e){let n=new CustomEvent(t,{detail:e});return this.targets.forEach(i=>i.dispatchEvent(n)),this}on(t,e){let n=t.split(s.WHITESPACE_RGX);return this.targets.forEach(i=>{n.forEach(h=>i.addEventListener(h,e))}),this}attr(t,e,n){return this.elements.forEach(i=>{e!=null?i.setAttributeNS(n??null,t,e):i.removeAttributeNS(n??null,t)}),this}toggle(t,e){return this.elements.forEach(n=>{let i=typeof e=="function"?e(n):!!e;n.classList.toggle(t,i)}),this}empty(){return this.nodes.forEach(t=>{for(;t.firstChild;)t.removeChild(t.firstChild)}),this}remove(){return new s(this.mapper,...this._items.filter(t=>{let e=t instanceof Node;return e&&t?.parentNode?.removeChild(t),!e}))}append(...t){return this.appendIn(...t),this}appendIn(...t){return new s(this.mapper,...this.containers.reduce((e,n)=>{let i=new s(this.mapper,...t).nodes;return n.append(...i),e.push(...i),e},[]))}find(t){return new s(this.mapper,...this.containers.reduce((e,n)=>(e.push(...Array.from(n.querySelectorAll(t))),e),[]))}first(t){return new s(this.mapper,...this.containers.map(e=>e.querySelector(t)).filter(e=>!!e))}};var M=class s{static NAIVE_HTML_RGX=/^\s*<.*>\s*$/m;Map(t){return t.reduce((e,n)=>(typeof n=="string"?e.push(...s.NAIVE_HTML_RGX.test(n)?s.MapHTML(n):s.MapSelector(n)):n.tag?e.push(s.MapParam(n)):n instanceof Node||n instanceof EventTarget?e.push(n):n instanceof f?n.each(i=>e.push(i)):console.warn("Unrecognised item:",n),e),[])}static MapHTML(t){let e=document.createElement("template");return e.innerHTML=t,Array.from(e.content.childNodes)}static MapSelector(t){return Array.from(document.querySelectorAll(t))}static MapParam(t){let e=document.createElement(t.tag);t.text&&(e.textContent=t.text);for(let n in t.attr||{})t.attr?.[n]!=null&&e.setAttribute(n,t.attr[n]);for(let n in t.evts||{})typeof t.evts?.[n]=="function"&&e.addEventListener(n,t.evts[n]);return e}};var J=new M;function a(...s){return new f(J,...s)}var E=class s extends HTMLElement{constructor(){super();this._connected=!1;this.root=this.attachShadow({mode:"open"});let e=new CSSStyleSheet;e.replaceSync(N),this.shadowRoot.adoptedStyleSheets=[e],this.shadowRoot.innerHTML=_,this.top=this.root.querySelector("ul")}static{this.CHAR_REF_REGEX=/^[0-9a-f]{4,5}$/i}connectedCallback(){this._connected||(setTimeout(()=>this.reload()),a(this.parentNode).on("contextmenu",e=>this.onParentContext(e)),a(this,this.parentNode).on("contextmenu wheel",e=>{e.preventDefault(),e.stopPropagation()}),a(this).on("mousedown",e=>e.stopPropagation()),a(window).on("mousedown resize wheel",()=>this.close()),this._connected=!0)}open(){this.parentElement.getRootNode().querySelectorAll("new-demo").forEach(n=>n.close()),this.top.classList.add("open"),a(this).fire("menuopen")}close(){this.top.classList.contains("open")&&(this.top.classList.remove("open"),a(this).fire("menuclose"))}reload(){a(this.top).empty().append(...this.walk(this,!1))}onParentContext(e){if(this.isConnected){let n=e.clientY,i=this.top.offsetHeight,h=n+i+2>window.innerHeight?n-i:n;this.top.style.top=`${Math.max(0,h)}px`;let r=e.clientX,v=this.top.offsetWidth,c=r+v+2>window.innerWidth?r-v:r;this.top.style.left=`${Math.max(0,c)}px`,this.open()}}walk(e,n,i=""){let h=0;return Array.from(e.children).filter(r=>r instanceof HTMLLIElement&&!r.classList.contains("hidden")&&(r.textContent||r.classList.contains("split"))).reduce((r,v)=>{let c=v,L=Array.from(c.children).map(o=>o),b=L.find(o=>o instanceof HTMLAnchorElement),T=L.find(o=>o instanceof HTMLUListElement),l=c.classList.contains("split"),m=!l&&T&&T.querySelector("li"),g=!l&&(n||c.classList.contains("disabled")),P=Array.from(b?.children||[]).map(o=>o),R=L.concat(P).filter(o=>o instanceof HTMLImageElement).map(o=>o);l||h++;let d=[];l?d.push("split"):(g&&d.push("disabled"),m&&d.push("group"),b?.target==="_blank"?d.push("click-out"):b&&d.push("click-in"));let X=[...L,c].find(o=>o.innerText),u=l?void 0:X?.innerText??`Item ${h}`,H=l||m?null:c.getAttribute("aria-keyshortcuts"),S=`${i}${h}`,x={ref:S,title:u,origin:b||c},q=()=>{!g&&!m&&!l&&(x.origin.click(),a(this).fire("itemselect",x),this.close())},G=o=>{if(!g&&!l){let C=o.target;if(m){let $=Array.from(C.children).find(W=>W instanceof HTMLUListElement),D=C.getBoundingClientRect();$.classList.toggle("nestle",D.right+$.clientWidth+2>window.innerWidth)}C.classList.add("hover"),a(this).fire("itemhover",x)}},U=o=>{!g&&!l&&(o.target.classList.remove("hover"),a(this).fire("itemunhover",x))},p=a({tag:"li"}).attr("class",d.length?d.join(" "):null).attr("aria-keyshortcuts",H).on("click contextmenu",q).on("mouseenter",G).on("mouseleave",U),y=c.dataset.charLeft||"",w=c.dataset.charRight||"",k=R.find(o=>!o.classList.contains("right")),I=R.find(o=>o.classList.contains("right"));return!l&&!m&&u&&(s.CHAR_REF_REGEX.test(y)?p.append(`<span class='icon left'>&#x${y};</span>`):y?console.warn(`ne14-menu: Bad hex code '${y}' to left of '${u}'.`):k&&p.append(`<img class='icon left' src='${k.src}'/>`),s.CHAR_REF_REGEX.test(w)?p.append(`<span class='icon right'>&#x${w};</span>`):w?console.warn(`ne14-menu: Bad hex code '${w}' to right of '${u}'.`):I&&p.append(`<img class='icon right' src='${I.src}'/>`)),u&&p.append({tag:"p",text:u}),H&&p.append({tag:"p",text:H}),m&&p.appendIn({tag:"ul"}).append(...this.walk(T,g,`${S}-`)),(!l||!r[r.length-1]?.classList?.contains("split"))&&r.push(p.elements[0]),r},[])}};customElements.get("ne14-menu")||customElements.define("ne14-menu",E);return V(K);})();

package/dist/index.js

@@ -0,0 +1 @@
+var $='@charset "UTF-8";li,ul{padding:0;margin:0;font:inherit}li.split .icon,slot{display:none}.top:not(.open),ul:not(.top){visibility:hidden}ul{border:var(--border,1px solid #bbb);background:var(--bg,#fff);box-shadow:var(--box-shadow,2px 2px 3px #888);transition:background-color .6s;z-index:9999999}.top{position:fixed;font-size:var(--font-size, .65rem);user-select:none}.icon.left{left:1em;transform:translate(-50%,-50%)}.icon.right{right:1em;transform:translate(50%,-50%)}.icon{max-width:1em;max-height:1em;position:absolute;top:50%;line-height:0}li>p:not(:empty){margin:0 1em;white-space:nowrap}li.disabled{color:var(--disabled-fg,#bbb)}li.split{border-top:var(--split-border,var(--border,1px solid #bbb));padding:0;margin:.3em}li.split+li.split,li.split:first-child,li.split:last-child{display:none}li.hover:not(.disabed):not(.split){background:var(--hover-item-bg,#bbb)}.top.open li.hover>ul{visibility:visible}li{margin:.2em 0;padding:.5em 1em;display:flex;justify-content:space-between;text-align:left;position:relative;cursor:default;color:var(--fg,#000)}li.group::after{content:"\u25B6";position:absolute;font-size:.65em;right:0;top:50%;transform:translate(-50%,-50%)}ul:not(.top){position:absolute;left:100%;top:-.25em}ul.nestle{left:.5em;top:100%}';var N='<slot></slot><ul class="top"></ul>';var f=class o{mapper;static WHITESPACE_RGX=/\s+/;_items=[];get targets(){return this._items.filter(t=>t instanceof EventTarget).map(t=>t)}get elements(){return this._items.filter(t=>t instanceof Element).map(t=>t)}get nodes(){return this._items.filter(t=>t instanceof Node).map(t=>t)}get containers(){return this._items.map(t=>t).filter(t=>typeof t.append=="function")}get length(){return this._items.length}constructor(t,...e){this.mapper=t,this.add(...e)}get=t=>this._items[t];add(...t){return this._items.push(...this.mapper.Map(t)),this}each(t){return this._items.forEach((e,n)=>t(e,n)),this}prop(t,e){return this.each(n=>{t in n&&(n[t]=e)})}fire(t,e){let n=new CustomEvent(t,{detail:e});return this.targets.forEach(i=>i.dispatchEvent(n)),this}on(t,e){let n=t.split(o.WHITESPACE_RGX);return this.targets.forEach(i=>{n.forEach(h=>i.addEventListener(h,e))}),this}attr(t,e,n){return this.elements.forEach(i=>{e!=null?i.setAttributeNS(n??null,t,e):i.removeAttributeNS(n??null,t)}),this}toggle(t,e){return this.elements.forEach(n=>{let i=typeof e=="function"?e(n):!!e;n.classList.toggle(t,i)}),this}empty(){return this.nodes.forEach(t=>{for(;t.firstChild;)t.removeChild(t.firstChild)}),this}remove(){return new o(this.mapper,...this._items.filter(t=>{let e=t instanceof Node;return e&&t?.parentNode?.removeChild(t),!e}))}append(...t){return this.appendIn(...t),this}appendIn(...t){return new o(this.mapper,...this.containers.reduce((e,n)=>{let i=new o(this.mapper,...t).nodes;return n.append(...i),e.push(...i),e},[]))}find(t){return new o(this.mapper,...this.containers.reduce((e,n)=>(e.push(...Array.from(n.querySelectorAll(t))),e),[]))}first(t){return new o(this.mapper,...this.containers.map(e=>e.querySelector(t)).filter(e=>!!e))}};var w=class o{static NAIVE_HTML_RGX=/^\s*<.*>\s*$/m;Map(t){return t.reduce((e,n)=>(typeof n=="string"?e.push(...o.NAIVE_HTML_RGX.test(n)?o.MapHTML(n):o.MapSelector(n)):n.tag?e.push(o.MapParam(n)):n instanceof Node||n instanceof EventTarget?e.push(n):n instanceof f?n.each(i=>e.push(i)):console.warn("Unrecognised item:",n),e),[])}static MapHTML(t){let e=document.createElement("template");return e.innerHTML=t,Array.from(e.content.childNodes)}static MapSelector(t){return Array.from(document.querySelectorAll(t))}static MapParam(t){let e=document.createElement(t.tag);t.text&&(e.textContent=t.text);for(let n in t.attr||{})t.attr?.[n]!=null&&e.setAttribute(n,t.attr[n]);for(let n in t.evts||{})typeof t.evts?.[n]=="function"&&e.addEventListener(n,t.evts[n]);return e}};var z=new w;function a(...o){return new f(z,...o)}var M=class o extends HTMLElement{constructor(){super();this._connected=!1;this.root=this.attachShadow({mode:"open"});let e=new CSSStyleSheet;e.replaceSync($),this.shadowRoot.adoptedStyleSheets=[e],this.shadowRoot.innerHTML=N,this.top=this.root.querySelector("ul")}static{this.CHAR_REF_REGEX=/^[0-9a-f]{4,5}$/i}connectedCallback(){this._connected||(setTimeout(()=>this.reload()),a(this.parentNode).on("contextmenu",e=>this.onParentContext(e)),a(this,this.parentNode).on("contextmenu wheel",e=>{e.preventDefault(),e.stopPropagation()}),a(this).on("mousedown",e=>e.stopPropagation()),a(window).on("mousedown resize wheel",()=>this.close()),this._connected=!0)}open(){this.parentElement.getRootNode().querySelectorAll("new-demo").forEach(n=>n.close()),this.top.classList.add("open"),a(this).fire("menuopen")}close(){this.top.classList.contains("open")&&(this.top.classList.remove("open"),a(this).fire("menuclose"))}reload(){a(this.top).empty().append(...this.walk(this,!1))}onParentContext(e){if(this.isConnected){let n=e.clientY,i=this.top.offsetHeight,h=n+i+2>window.innerHeight?n-i:n;this.top.style.top=`${Math.max(0,h)}px`;let r=e.clientX,E=this.top.offsetWidth,c=r+E+2>window.innerWidth?r-E:r;this.top.style.left=`${Math.max(0,c)}px`,this.open()}}walk(e,n,i=""){let h=0;return Array.from(e.children).filter(r=>r instanceof HTMLLIElement&&!r.classList.contains("hidden")&&(r.textContent||r.classList.contains("split"))).reduce((r,E)=>{let c=E,v=Array.from(c.children).map(s=>s),L=v.find(s=>s instanceof HTMLAnchorElement),T=v.find(s=>s instanceof HTMLUListElement),l=c.classList.contains("split"),m=!l&&T&&T.querySelector("li"),g=!l&&(n||c.classList.contains("disabled")),_=Array.from(L?.children||[]).map(s=>s),A=v.concat(_).filter(s=>s instanceof HTMLImageElement).map(s=>s);l||h++;let d=[];l?d.push("split"):(g&&d.push("disabled"),m&&d.push("group"),L?.target==="_blank"?d.push("click-out"):L&&d.push("click-in"));let P=[...v,c].find(s=>s.innerText),u=l?void 0:P?.innerText??`Item ${h}`,H=l||m?null:c.getAttribute("aria-keyshortcuts"),R=`${i}${h}`,b={ref:R,title:u,origin:L||c},X=()=>{!g&&!m&&!l&&(b.origin.click(),a(this).fire("itemselect",b),this.close())},q=s=>{if(!g&&!l){let C=s.target;if(m){let I=Array.from(C.children).find(D=>D instanceof HTMLUListElement),U=C.getBoundingClientRect();I.classList.toggle("nestle",U.right+I.clientWidth+2>window.innerWidth)}C.classList.add("hover"),a(this).fire("itemhover",b)}},G=s=>{!g&&!l&&(s.target.classList.remove("hover"),a(this).fire("itemunhover",b))},p=a({tag:"li"}).attr("class",d.length?d.join(" "):null).attr("aria-keyshortcuts",H).on("click contextmenu",X).on("mouseenter",q).on("mouseleave",G),x=c.dataset.charLeft||"",y=c.dataset.charRight||"",S=A.find(s=>!s.classList.contains("right")),k=A.find(s=>s.classList.contains("right"));return!l&&!m&&u&&(o.CHAR_REF_REGEX.test(x)?p.append(`<span class='icon left'>&#x${x};</span>`):x?console.warn(`ne14-menu: Bad hex code '${x}' to left of '${u}'.`):S&&p.append(`<img class='icon left' src='${S.src}'/>`),o.CHAR_REF_REGEX.test(y)?p.append(`<span class='icon right'>&#x${y};</span>`):y?console.warn(`ne14-menu: Bad hex code '${y}' to right of '${u}'.`):k&&p.append(`<img class='icon right' src='${k.src}'/>`)),u&&p.append({tag:"p",text:u}),H&&p.append({tag:"p",text:H}),m&&p.appendIn({tag:"ul"}).append(...this.walk(T,g,`${R}-`)),(!l||!r[r.length-1]?.classList?.contains("split"))&&r.push(p.elements[0]),r},[])}};customElements.get("ne14-menu")||customElements.define("ne14-menu",M);export{M as NeMenu};

package/dist/menu/menu.d.ts

@@ -1,8 +1,7 @@
-import { CustomElementBase } from '@ne1410s/cust-elems';
-export declare class NeMenu extends CustomElementBase {
-    private static readonly Css;
-    private static readonly Html;
+/** Customisable context menu component. */
+export declare class NeMenu extends HTMLElement {
     private static readonly CHAR_REF_REGEX;
+    private readonly root;
     private readonly top;
     private _connected;
     constructor();
@@ -16,3 +15,4 @@ export declare class NeMenu extends CustomElementBase {
     private onParentContext;
     private walk;
 }
+//# sourceMappingURL=menu.d.ts.map

package/dist/menu/menu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../src/menu/menu.ts"],"names":[],"mappings":"AAUA,2CAA2C;AAC3C,qBAAa,MAAO,SAAQ,WAAW;IACrC,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAAsB;IAE5D,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAa;IAClC,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAmB;IACvC,OAAO,CAAC,UAAU,CAAkB;IAMpC,cAQC;IAED,iBAAiB,SAahB;IAED,uBAAuB;IACvB,IAAI,IAAI,IAAI,CAQX;IAED,uBAAuB;IACvB,KAAK,IAAI,IAAI,CAKZ;IAED,mDAAmD;IACnD,MAAM,IAAI,IAAI,CAIb;IAED,OAAO,CAAC,eAAe;IAmBvB,OAAO,CAAC,IAAI;CAuGb"}

package/package.json

@@ -1,57 +1,70 @@
-{
-  "name": "@ne1410s/menu",
-  "version": "0.1.195",
-  "description": "Lightweight ES context menu.",
-  "main": "dist/ne14_menu.cjs.min.js",
-  "module": "dist/ne14_menu.esm.min.js",
-  "browser": "dist/ne14_menu.umd.min.js",
-  "displayName": "ne_menu",
-  "types": "dist/index.d.ts",
-  "files": [
-    "dist"
-  ],
-  "scripts": {
-    "dev": "npx rollup -c rollup.browser.config.js -m -w",
-    "clean": "npx rimraf dist",
-    "is-pretty": "npx prettier -l .",
-    "prettify": "npx prettier -w .",
-    "build": "npm run clean && npx rollup -c",
-    "test": "npm run is-pretty",
-    "publish-local": "npm run test && npm run build && npm pack",
-    "publish-patch": "npm run test && npm run build && npm version patch && npm publish --access public",
-    "publish-minor": "npm run test && npm run build && npm version minor && npm publish --access public",
-    "publish-major": "npm run test && npm run build && npm version major && npm publish --access public"
-  },
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/ne14-fed/elem.menu.git"
-  },
-  "keywords": [
-    "Lightweight",
-    "ES",
-    "context",
-    "menu",
-    "contextmenu"
-  ],
-  "author": "ne1410s <pgj646@gmail.com> (http://ne1410s.co.uk)",
-  "license": "MIT",
-  "bugs": {
-    "url": "https://github.com/ne14-fed/elem.menu/issues"
-  },
-  "homepage": "https://github.com/ne14-fed/elem.menu#readme",
-  "devDependencies": {
-    "@rollup/plugin-commonjs": "^25.0.8",
-    "@rollup/plugin-json": "^6.1.0",
-    "@rollup/plugin-node-resolve": "^15.3.1",
-    "@rollup/plugin-url": "^8.0.2",
-    "prettier": "^3.7.4",
-    "rimraf": "^5.0.10",
-    "rollup": "^4.54.0",
-    "rollup-plugin-typescript2": "^0.36.0",
-    "typescript": "^5.9.3"
-  },
-  "dependencies": {
-    "@ne1410s/cust-elems": "^0.3.168",
-    "@ne1410s/dom": "^0.3.183"
-  }
-}
+{
+  "name": "@ne1410s/menu",
+  "version": "1.0.0",
+  "displayName": "ne_menu",
+  "type": "module",
+  "main": "dist/index.js",
+  "module": "dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "types": "./dist/index.d.ts"
+    },
+    "./iife": "./dist/index.iife.js"
+  },
+  "files": [
+    "dist"
+  ],
+  "description": "An element that provides customisable context menu.",
+  "author": "ne1410s <pgj646@gmail.com> (http://ne1410s.co.uk)",
+  "keywords": [
+    "Text",
+    "Utils"
+  ],
+  "homepage": "https://github.com/ne14-fed/elem.menu#readme",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/ne14-fed/elem.menu.git"
+  },
+  "bugs": {
+    "url": "https://github.com/ne14-fed/elem.menu/issues"
+  },
+  "engines": {
+    "node": ">=20"
+  },
+  "scripts": {
+    "dev": "npm link && concurrently \"npm run build:watch\" \"npm run demo:iife\" \"npm run demo:vite\"",
+    "clean": "del-cli dist",
+    "is-pretty": "prettier -l .",
+    "prettify": "prettier -w .",
+    "build": "npm run clean && tsc && node esbuild.mjs",
+    "build:watch": "concurrently \"tsc --watch\" \"node esbuild.mjs --watch\"",
+    "demo:vite": "cd demo/vite && npm i && npm link @ne1410s/menu && npx vite",
+    "demo:iife": "npx live-server demo/iife --mount=/package:dist --no-css-inject",
+    "test": "npm run typecheck && npm run is-pretty",
+    "typecheck": "tsc --noEmit",
+    "publish-local": "npm run build && npm pack",
+    "publish-patch": "npm run build && npm version patch && npm publish --access public",
+    "publish-minor": "npm run build && npm version minor && npm publish --access public",
+    "publish-major": "npm run build && npm version major && npm publish --access public"
+  },
+  "devDependencies": {
+    "clean-css": "^5.3.3",
+    "concurrently": "^10.0.4",
+    "del-cli": "^7.0.0",
+    "esbuild": "^0.28.2",
+    "esbuild-sass-plugin": "^3.7.0",
+    "html-minifier-terser": "^7.2.0",
+    "prettier": "^3.9.6",
+    "typescript": "^7.0.2"
+  },
+  "dependencies": {
+    "@ne1410s/dom": "^0.3.184"
+  },
+  "allowScripts": {
+    "esbuild@0.28.2": true,
+    "@parcel/watcher@2.6.0": true
+  }
+}

package/dist/models.d.ts

@@ -1,5 +0,0 @@
-export interface MenuEventDetail {
-    ref: string;
-    title: string;
-    origin: HTMLElement;
-}

package/dist/ne14_menu.cjs.min.js

@@ -1,176 +0,0 @@
-'use strict';
-
-var dom = require('@ne1410s/dom');
-var custElems = require('@ne1410s/cust-elems');
-
-var markupUrl = "data:text/html;base64,PHNsb3Q+PC9zbG90Pg0KPHVsIGNsYXNzPSJ0b3AiPjwvdWw+DQo=";
-
-var stylesUrl = "data:text/css;base64,dWwsDQpsaSB7DQogIHBhZGRpbmc6IDA7DQogIG1hcmdpbjogMDsNCiAgZm9udDogaW5oZXJpdDsNCn0NCnNsb3QsDQpsaS5zcGxpdCAuaWNvbiB7DQogIGRpc3BsYXk6IG5vbmU7DQp9DQoudG9wOm5vdCgub3BlbiksDQp1bDpub3QoLnRvcCkgew0KICB2aXNpYmlsaXR5OiBoaWRkZW47DQp9DQoNCnVsIHsNCiAgYm9yZGVyOiB2YXIoLS1ib3JkZXIsIDFweCBzb2xpZCAjYmJiKTsNCiAgYmFja2dyb3VuZDogdmFyKC0tYmcsICNmZmYpOw0KICBib3gtc2hhZG93OiB2YXIoLS1ib3gtc2hhZG93LCAycHggMnB4IDNweCAjODg4KTsNCiAgdHJhbnNpdGlvbjogYmFja2dyb3VuZCAwLjZzOw0KICB6LWluZGV4OiA5OTk5OTk5Ow0KfQ0KDQoudG9wIHsNCiAgcG9zaXRpb246IGZpeGVkOw0KICBmb250LXNpemU6IHZhcigtLWZvbnQtc2l6ZSwgMC42NXJlbSk7DQogIHVzZXItc2VsZWN0OiBub25lOw0KfQ0KDQouaWNvbi5sZWZ0IHsNCiAgbGVmdDogMWVtOw0KICB0cmFuc2Zvcm06IHRyYW5zbGF0ZSgtNTAlLCAtNTAlKTsNCn0NCi5pY29uLnJpZ2h0IHsNCiAgcmlnaHQ6IDFlbTsNCiAgdHJhbnNmb3JtOiB0cmFuc2xhdGUoNTAlLCAtNTAlKTsNCn0NCi5pY29uIHsNCiAgbWF4LXdpZHRoOiAxZW07DQogIG1heC1oZWlnaHQ6IDFlbTsNCiAgcG9zaXRpb246IGFic29sdXRlOw0KICB0b3A6IDUwJTsNCiAgbGluZS1oZWlnaHQ6IDA7DQp9DQoNCmxpID4gcDpub3QoOmVtcHR5KSB7DQogIG1hcmdpbjogMCAxZW07DQogIHdoaXRlLXNwYWNlOiBub3dyYXA7DQp9DQpsaS5kaXNhYmxlZCB7DQogIGNvbG9yOiB2YXIoLS1kaXNhYmxlZC1mZywgI2JiYik7DQp9DQpsaS5zcGxpdCB7DQogIGJvcmRlci10b3A6IHZhcigtLXNwbGl0LWJvcmRlciwgdmFyKC0tYm9yZGVyLCAxcHggc29saWQgI2JiYikpOw0KICBwYWRkaW5nOiAwOw0KICBtYXJnaW46IDAuM2VtOw0KfQ0KbGkuc3BsaXQ6Zmlyc3QtY2hpbGQsDQpsaS5zcGxpdDpsYXN0LWNoaWxkLA0KbGkuc3BsaXQgKyBsaS5zcGxpdCB7DQogIGRpc3BsYXk6IG5vbmU7DQp9DQpsaS5ob3Zlcjpub3QoLmRpc2FiZWQpOm5vdCguc3BsaXQpIHsNCiAgYmFja2dyb3VuZDogdmFyKC0taG92ZXItaXRlbS1iZywgI2JiYik7DQp9DQoudG9wLm9wZW4gbGkuaG92ZXIgPiB1bCB7DQogIHZpc2liaWxpdHk6IHZpc2libGU7DQp9DQpsaSB7DQogIG1hcmdpbjogMC4yZW0gMDsNCiAgcGFkZGluZzogMC41ZW0gMWVtOw0KICBkaXNwbGF5OiBmbGV4Ow0KICBqdXN0aWZ5LWNvbnRlbnQ6IHNwYWNlLWJldHdlZW47DQogIHRleHQtYWxpZ246IGxlZnQ7DQogIHBvc2l0aW9uOiByZWxhdGl2ZTsNCiAgY3Vyc29yOiBkZWZhdWx0Ow0KICBjb2xvcjogdmFyKC0tZmcsICMwMDApOw0KfQ0KDQpsaS5ncm91cDo6YWZ0ZXIgew0KICBjb250ZW50OiAnXDI1YjYnOw0KICBwb3NpdGlvbjogYWJzb2x1dGU7DQogIGZvbnQtc2l6ZTogMC42NWVtOw0KICByaWdodDogMDsNCiAgdG9wOiA1MCU7DQogIHRyYW5zZm9ybTogdHJhbnNsYXRlKC01MCUsIC01MCUpOw0KfQ0KDQp1bDpub3QoLnRvcCkgew0KICBwb3NpdGlvbjogYWJzb2x1dGU7DQogIGxlZnQ6IDEwMCU7DQogIHRvcDogLTAuMjVlbTsNCn0NCg0KdWwubmVzdGxlIHsNCiAgbGVmdDogMC41ZW07DQogIHRvcDogMTAwJTsNCn0NCg==";
-
-class NeMenu extends custElems.CustomElementBase {
-    constructor() {
-        super(NeMenu.Css, NeMenu.Html);
-        this.top = this.root.querySelector('ul');
-    }
-    connectedCallback() {
-        if (!this._connected) {
-            setTimeout(() => this.reload());
-            dom.q(this.parentNode).on('contextmenu', (e) => this.onParentContext(e));
-            dom.q(this, this.parentNode).on('contextmenu wheel', (e) => {
-                e.preventDefault();
-                e.stopPropagation();
-            });
-            dom.q(this).on('mousedown', (e) => e.stopPropagation());
-            dom.q(window).on('mousedown resize wheel', () => this.close());
-            this._connected = true;
-        }
-    }
-    /** Opens the menu.  */
-    open() {
-        // close all menus
-        const doc = this.parentElement.getRootNode();
-        doc.querySelectorAll('ne14-menu').forEach((m) => m.close());
-        // style this one as open
-        this.top.classList.add('open');
-        dom.q(this).fire('menuopen');
-    }
-    /** Closes the menu. */
-    close() {
-        if (this.top.classList.contains('open')) {
-            this.top.classList.remove('open');
-            dom.q(this).fire('menuclose');
-        }
-    }
-    /** Reloads active contents based on client dom. */
-    reload() {
-        dom.q(this.top)
-            .empty()
-            .append(...this.walk(this, false));
-    }
-    onParentContext(event) {
-        if (this.isConnected) {
-            // update position (y)
-            const y = event.clientY;
-            const height = this.top.offsetHeight;
-            const posY = y + height + 2 > window.innerHeight ? y - height : y;
-            this.top.style.top = `${Math.max(0, posY)}px`;
-            // update position (x)
-            const x = event.clientX;
-            const width = this.top.offsetWidth;
-            const posX = x + width + 2 > window.innerWidth ? x - width : x;
-            this.top.style.left = `${Math.max(0, posX)}px`;
-            // open
-            this.open();
-        }
-    }
-    walk(ul, parentDisabled, ref = '') {
-        let levelItemNo = 0;
-        return Array.from(ul.children)
-            .filter((c) => c instanceof HTMLLIElement &&
-            !c.classList.contains('hidden') &&
-            (c.textContent || c.classList.contains('split')))
-            .reduce((acc, li) => {
-            var _a, _b, _c;
-            const children = Array.from(li.children).map((el) => el);
-            const a = children.find((n) => n instanceof HTMLAnchorElement);
-            const ul = children.find((n) => n instanceof HTMLUListElement);
-            const isSplit = li.classList.contains('split');
-            const isGrouper = !isSplit && ul && ul.querySelector('li');
-            const isDisabled = !isSplit && (parentDisabled || li.classList.contains('disabled'));
-            const aChildren = Array.from((a === null || a === void 0 ? void 0 : a.children) || []).map((el) => el);
-            const imgs = children
-                .concat(aChildren)
-                .filter((n) => n instanceof HTMLImageElement)
-                .map((n) => n);
-            if (!isSplit)
-                levelItemNo++;
-            const classes = [];
-            if (isSplit)
-                classes.push('split');
-            else {
-                if (isDisabled)
-                    classes.push('disabled');
-                if (isGrouper)
-                    classes.push('group');
-                if ((a === null || a === void 0 ? void 0 : a.target) === '_blank')
-                    classes.push('click-out');
-                else if (a)
-                    classes.push('click-in');
-            }
-            const bestTextNode = [...children, li].find((c) => c.innerText);
-            const bestText = isSplit ? null : ((_a = bestTextNode === null || bestTextNode === void 0 ? void 0 : bestTextNode.innerText) !== null && _a !== void 0 ? _a : `Item ${levelItemNo}`);
-            const shortcut = isSplit || isGrouper ? null : li.getAttribute('aria-keyshortcuts');
-            const liRef = `${ref}${levelItemNo}`;
-            const eventDetail = { ref: liRef, title: bestText, origin: a || li };
-            const handleClick = () => {
-                if (!isDisabled && !isGrouper && !isSplit) {
-                    eventDetail.origin.click();
-                    dom.q(this).fire('itemselect', eventDetail);
-                    this.close();
-                }
-            };
-            const handleMouseEnter = (e) => {
-                if (!isDisabled && !isSplit) {
-                    const domLi = e.target;
-                    if (isGrouper) {
-                        const domUl = Array.from(domLi.children).find((n) => n instanceof HTMLUListElement);
-                        const liRect = domLi.getBoundingClientRect();
-                        domUl.classList.toggle('nestle', liRect.right + domUl.clientWidth + 2 > window.innerWidth);
-                    }
-                    domLi.classList.add('hover');
-                    dom.q(this).fire('itemhover', eventDetail);
-                }
-            };
-            const handleMouseLeave = (e) => {
-                if (!isDisabled && !isSplit) {
-                    e.target.classList.remove('hover');
-                    dom.q(this).fire('itemunhover', eventDetail);
-                }
-            };
-            const $domItem = dom.q({ tag: 'li' })
-                .attr('class', classes.length ? classes.join(' ') : null)
-                .attr('aria-keyshortcuts', shortcut)
-                .on('click contextmenu', handleClick)
-                .on('mouseenter', handleMouseEnter)
-                .on('mouseleave', handleMouseLeave);
-            const charLeft = li.dataset.charLeft;
-            const charRight = li.dataset.charRight;
-            const imgLeft = imgs.find((i) => !i.classList.contains('right'));
-            const imgRight = imgs.find((i) => i.classList.contains('right'));
-            if (!isSplit && !isGrouper && bestText) {
-                if (NeMenu.CHAR_REF_REGEX.test(charLeft))
-                    $domItem.append(`<span class='icon left'>&#x${charLeft};</span>`);
-                else if (charLeft)
-                    console.warn(`ne14-menu: Bad hex code '${charLeft}' to left of '${bestText}'.`);
-                else if (imgLeft)
-                    $domItem.append(`<img class='icon left' src='${imgLeft.src}'/>`);
-                if (NeMenu.CHAR_REF_REGEX.test(charRight))
-                    $domItem.append(`<span class='icon right'>&#x${charRight};</span>`);
-                else if (charRight)
-                    console.warn(`ne14-menu: Bad hex code '${charRight}' to right of '${bestText}'.`);
-                else if (imgRight)
-                    $domItem.append(`<img class='icon right' src='${imgRight.src}'/>`);
-            }
-            if (bestText)
-                $domItem.append({ tag: 'p', text: bestText });
-            if (shortcut)
-                $domItem.append({ tag: 'p', text: shortcut });
-            if (isGrouper)
-                $domItem.appendIn({ tag: 'ul' }).append(...this.walk(ul, isDisabled, `${liRef}-`));
-            // Do not push two consecutive splits
-            if (!isSplit || !((_c = (_b = acc[acc.length - 1]) === null || _b === void 0 ? void 0 : _b.classList) === null || _c === void 0 ? void 0 : _c.contains('split'))) {
-                acc.push($domItem.elements[0]);
-            }
-            return acc;
-        }, []);
-    }
-}
-NeMenu.Css = custElems.reduceCss(custElems.decode(stylesUrl));
-NeMenu.Html = custElems.reduceHtml(custElems.decode(markupUrl));
-NeMenu.CHAR_REF_REGEX = /^[0-9a-f]{4,5}$/i;
-
-if ('customElements' in window) {
-    window.customElements.define('ne14-menu', NeMenu);
-}
-
-exports.ContextMenu = NeMenu;

package/dist/ne14_menu.esm.min.js

@@ -1,174 +0,0 @@
-import { q } from '@ne1410s/dom';
-import { reduceCss, decode, reduceHtml, CustomElementBase } from '@ne1410s/cust-elems';
-
-var markupUrl = "data:text/html;base64,PHNsb3Q+PC9zbG90Pg0KPHVsIGNsYXNzPSJ0b3AiPjwvdWw+DQo=";
-
-var stylesUrl = "data:text/css;base64,dWwsDQpsaSB7DQogIHBhZGRpbmc6IDA7DQogIG1hcmdpbjogMDsNCiAgZm9udDogaW5oZXJpdDsNCn0NCnNsb3QsDQpsaS5zcGxpdCAuaWNvbiB7DQogIGRpc3BsYXk6IG5vbmU7DQp9DQoudG9wOm5vdCgub3BlbiksDQp1bDpub3QoLnRvcCkgew0KICB2aXNpYmlsaXR5OiBoaWRkZW47DQp9DQoNCnVsIHsNCiAgYm9yZGVyOiB2YXIoLS1ib3JkZXIsIDFweCBzb2xpZCAjYmJiKTsNCiAgYmFja2dyb3VuZDogdmFyKC0tYmcsICNmZmYpOw0KICBib3gtc2hhZG93OiB2YXIoLS1ib3gtc2hhZG93LCAycHggMnB4IDNweCAjODg4KTsNCiAgdHJhbnNpdGlvbjogYmFja2dyb3VuZCAwLjZzOw0KICB6LWluZGV4OiA5OTk5OTk5Ow0KfQ0KDQoudG9wIHsNCiAgcG9zaXRpb246IGZpeGVkOw0KICBmb250LXNpemU6IHZhcigtLWZvbnQtc2l6ZSwgMC42NXJlbSk7DQogIHVzZXItc2VsZWN0OiBub25lOw0KfQ0KDQouaWNvbi5sZWZ0IHsNCiAgbGVmdDogMWVtOw0KICB0cmFuc2Zvcm06IHRyYW5zbGF0ZSgtNTAlLCAtNTAlKTsNCn0NCi5pY29uLnJpZ2h0IHsNCiAgcmlnaHQ6IDFlbTsNCiAgdHJhbnNmb3JtOiB0cmFuc2xhdGUoNTAlLCAtNTAlKTsNCn0NCi5pY29uIHsNCiAgbWF4LXdpZHRoOiAxZW07DQogIG1heC1oZWlnaHQ6IDFlbTsNCiAgcG9zaXRpb246IGFic29sdXRlOw0KICB0b3A6IDUwJTsNCiAgbGluZS1oZWlnaHQ6IDA7DQp9DQoNCmxpID4gcDpub3QoOmVtcHR5KSB7DQogIG1hcmdpbjogMCAxZW07DQogIHdoaXRlLXNwYWNlOiBub3dyYXA7DQp9DQpsaS5kaXNhYmxlZCB7DQogIGNvbG9yOiB2YXIoLS1kaXNhYmxlZC1mZywgI2JiYik7DQp9DQpsaS5zcGxpdCB7DQogIGJvcmRlci10b3A6IHZhcigtLXNwbGl0LWJvcmRlciwgdmFyKC0tYm9yZGVyLCAxcHggc29saWQgI2JiYikpOw0KICBwYWRkaW5nOiAwOw0KICBtYXJnaW46IDAuM2VtOw0KfQ0KbGkuc3BsaXQ6Zmlyc3QtY2hpbGQsDQpsaS5zcGxpdDpsYXN0LWNoaWxkLA0KbGkuc3BsaXQgKyBsaS5zcGxpdCB7DQogIGRpc3BsYXk6IG5vbmU7DQp9DQpsaS5ob3Zlcjpub3QoLmRpc2FiZWQpOm5vdCguc3BsaXQpIHsNCiAgYmFja2dyb3VuZDogdmFyKC0taG92ZXItaXRlbS1iZywgI2JiYik7DQp9DQoudG9wLm9wZW4gbGkuaG92ZXIgPiB1bCB7DQogIHZpc2liaWxpdHk6IHZpc2libGU7DQp9DQpsaSB7DQogIG1hcmdpbjogMC4yZW0gMDsNCiAgcGFkZGluZzogMC41ZW0gMWVtOw0KICBkaXNwbGF5OiBmbGV4Ow0KICBqdXN0aWZ5LWNvbnRlbnQ6IHNwYWNlLWJldHdlZW47DQogIHRleHQtYWxpZ246IGxlZnQ7DQogIHBvc2l0aW9uOiByZWxhdGl2ZTsNCiAgY3Vyc29yOiBkZWZhdWx0Ow0KICBjb2xvcjogdmFyKC0tZmcsICMwMDApOw0KfQ0KDQpsaS5ncm91cDo6YWZ0ZXIgew0KICBjb250ZW50OiAnXDI1YjYnOw0KICBwb3NpdGlvbjogYWJzb2x1dGU7DQogIGZvbnQtc2l6ZTogMC42NWVtOw0KICByaWdodDogMDsNCiAgdG9wOiA1MCU7DQogIHRyYW5zZm9ybTogdHJhbnNsYXRlKC01MCUsIC01MCUpOw0KfQ0KDQp1bDpub3QoLnRvcCkgew0KICBwb3NpdGlvbjogYWJzb2x1dGU7DQogIGxlZnQ6IDEwMCU7DQogIHRvcDogLTAuMjVlbTsNCn0NCg0KdWwubmVzdGxlIHsNCiAgbGVmdDogMC41ZW07DQogIHRvcDogMTAwJTsNCn0NCg==";
-
-class NeMenu extends CustomElementBase {
-    constructor() {
-        super(NeMenu.Css, NeMenu.Html);
-        this.top = this.root.querySelector('ul');
-    }
-    connectedCallback() {
-        if (!this._connected) {
-            setTimeout(() => this.reload());
-            q(this.parentNode).on('contextmenu', (e) => this.onParentContext(e));
-            q(this, this.parentNode).on('contextmenu wheel', (e) => {
-                e.preventDefault();
-                e.stopPropagation();
-            });
-            q(this).on('mousedown', (e) => e.stopPropagation());
-            q(window).on('mousedown resize wheel', () => this.close());
-            this._connected = true;
-        }
-    }
-    /** Opens the menu.  */
-    open() {
-        // close all menus
-        const doc = this.parentElement.getRootNode();
-        doc.querySelectorAll('ne14-menu').forEach((m) => m.close());
-        // style this one as open
-        this.top.classList.add('open');
-        q(this).fire('menuopen');
-    }
-    /** Closes the menu. */
-    close() {
-        if (this.top.classList.contains('open')) {
-            this.top.classList.remove('open');
-            q(this).fire('menuclose');
-        }
-    }
-    /** Reloads active contents based on client dom. */
-    reload() {
-        q(this.top)
-            .empty()
-            .append(...this.walk(this, false));
-    }
-    onParentContext(event) {
-        if (this.isConnected) {
-            // update position (y)
-            const y = event.clientY;
-            const height = this.top.offsetHeight;
-            const posY = y + height + 2 > window.innerHeight ? y - height : y;
-            this.top.style.top = `${Math.max(0, posY)}px`;
-            // update position (x)
-            const x = event.clientX;
-            const width = this.top.offsetWidth;
-            const posX = x + width + 2 > window.innerWidth ? x - width : x;
-            this.top.style.left = `${Math.max(0, posX)}px`;
-            // open
-            this.open();
-        }
-    }
-    walk(ul, parentDisabled, ref = '') {
-        let levelItemNo = 0;
-        return Array.from(ul.children)
-            .filter((c) => c instanceof HTMLLIElement &&
-            !c.classList.contains('hidden') &&
-            (c.textContent || c.classList.contains('split')))
-            .reduce((acc, li) => {
-            var _a, _b, _c;
-            const children = Array.from(li.children).map((el) => el);
-            const a = children.find((n) => n instanceof HTMLAnchorElement);
-            const ul = children.find((n) => n instanceof HTMLUListElement);
-            const isSplit = li.classList.contains('split');
-            const isGrouper = !isSplit && ul && ul.querySelector('li');
-            const isDisabled = !isSplit && (parentDisabled || li.classList.contains('disabled'));
-            const aChildren = Array.from((a === null || a === void 0 ? void 0 : a.children) || []).map((el) => el);
-            const imgs = children
-                .concat(aChildren)
-                .filter((n) => n instanceof HTMLImageElement)
-                .map((n) => n);
-            if (!isSplit)
-                levelItemNo++;
-            const classes = [];
-            if (isSplit)
-                classes.push('split');
-            else {
-                if (isDisabled)
-                    classes.push('disabled');
-                if (isGrouper)
-                    classes.push('group');
-                if ((a === null || a === void 0 ? void 0 : a.target) === '_blank')
-                    classes.push('click-out');
-                else if (a)
-                    classes.push('click-in');
-            }
-            const bestTextNode = [...children, li].find((c) => c.innerText);
-            const bestText = isSplit ? null : ((_a = bestTextNode === null || bestTextNode === void 0 ? void 0 : bestTextNode.innerText) !== null && _a !== void 0 ? _a : `Item ${levelItemNo}`);
-            const shortcut = isSplit || isGrouper ? null : li.getAttribute('aria-keyshortcuts');
-            const liRef = `${ref}${levelItemNo}`;
-            const eventDetail = { ref: liRef, title: bestText, origin: a || li };
-            const handleClick = () => {
-                if (!isDisabled && !isGrouper && !isSplit) {
-                    eventDetail.origin.click();
-                    q(this).fire('itemselect', eventDetail);
-                    this.close();
-                }
-            };
-            const handleMouseEnter = (e) => {
-                if (!isDisabled && !isSplit) {
-                    const domLi = e.target;
-                    if (isGrouper) {
-                        const domUl = Array.from(domLi.children).find((n) => n instanceof HTMLUListElement);
-                        const liRect = domLi.getBoundingClientRect();
-                        domUl.classList.toggle('nestle', liRect.right + domUl.clientWidth + 2 > window.innerWidth);
-                    }
-                    domLi.classList.add('hover');
-                    q(this).fire('itemhover', eventDetail);
-                }
-            };
-            const handleMouseLeave = (e) => {
-                if (!isDisabled && !isSplit) {
-                    e.target.classList.remove('hover');
-                    q(this).fire('itemunhover', eventDetail);
-                }
-            };
-            const $domItem = q({ tag: 'li' })
-                .attr('class', classes.length ? classes.join(' ') : null)
-                .attr('aria-keyshortcuts', shortcut)
-                .on('click contextmenu', handleClick)
-                .on('mouseenter', handleMouseEnter)
-                .on('mouseleave', handleMouseLeave);
-            const charLeft = li.dataset.charLeft;
-            const charRight = li.dataset.charRight;
-            const imgLeft = imgs.find((i) => !i.classList.contains('right'));
-            const imgRight = imgs.find((i) => i.classList.contains('right'));
-            if (!isSplit && !isGrouper && bestText) {
-                if (NeMenu.CHAR_REF_REGEX.test(charLeft))
-                    $domItem.append(`<span class='icon left'>&#x${charLeft};</span>`);
-                else if (charLeft)
-                    console.warn(`ne14-menu: Bad hex code '${charLeft}' to left of '${bestText}'.`);
-                else if (imgLeft)
-                    $domItem.append(`<img class='icon left' src='${imgLeft.src}'/>`);
-                if (NeMenu.CHAR_REF_REGEX.test(charRight))
-                    $domItem.append(`<span class='icon right'>&#x${charRight};</span>`);
-                else if (charRight)
-                    console.warn(`ne14-menu: Bad hex code '${charRight}' to right of '${bestText}'.`);
-                else if (imgRight)
-                    $domItem.append(`<img class='icon right' src='${imgRight.src}'/>`);
-            }
-            if (bestText)
-                $domItem.append({ tag: 'p', text: bestText });
-            if (shortcut)
-                $domItem.append({ tag: 'p', text: shortcut });
-            if (isGrouper)
-                $domItem.appendIn({ tag: 'ul' }).append(...this.walk(ul, isDisabled, `${liRef}-`));
-            // Do not push two consecutive splits
-            if (!isSplit || !((_c = (_b = acc[acc.length - 1]) === null || _b === void 0 ? void 0 : _b.classList) === null || _c === void 0 ? void 0 : _c.contains('split'))) {
-                acc.push($domItem.elements[0]);
-            }
-            return acc;
-        }, []);
-    }
-}
-NeMenu.Css = reduceCss(decode(stylesUrl));
-NeMenu.Html = reduceHtml(decode(markupUrl));
-NeMenu.CHAR_REF_REGEX = /^[0-9a-f]{4,5}$/i;
-
-if ('customElements' in window) {
-    window.customElements.define('ne14-menu', NeMenu);
-}
-
-export { NeMenu as ContextMenu };

package/dist/ne14_menu.umd.min.js

@@ -1,450 +0,0 @@
-(function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
-    typeof define === 'function' && define.amd ? define(['exports'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.ne_menu = {}));
-})(this, (function (exports) { 'use strict';
-
-    /******************************************************************************
-    Copyright (c) Microsoft Corporation.
-
-    Permission to use, copy, modify, and/or distribute this software for any
-    purpose with or without fee is hereby granted.
-
-    THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
-    REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
-    AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
-    INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
-    LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
-    OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
-    PERFORMANCE OF THIS SOFTWARE.
-    ***************************************************************************** */
-    /* global Reflect, Promise, SuppressedError, Symbol, Iterator */
-
-
-    function __spreadArray(to, from, pack) {
-        if (arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-            if (ar || !(i in from)) {
-                if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-                ar[i] = from[i];
-            }
-        }
-        return to.concat(ar || Array.prototype.slice.call(from));
-    }
-
-    typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
-        var e = new Error(message);
-        return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
-    };
-
-    var ChainedQuery = /** @class */ (function () {
-        function ChainedQuery(mapper) {
-            var sources = [];
-            for (var _i = 1; _i < arguments.length; _i++) {
-                sources[_i - 1] = arguments[_i];
-            }
-            var _this = this;
-            this.mapper = mapper;
-            this._items = [];
-            this.get = function (index) { return _this._items[index]; };
-            this.add.apply(this, sources);
-        }
-        Object.defineProperty(ChainedQuery.prototype, "targets", {
-            get: function () {
-                return this._items.filter(function (it) { return it instanceof EventTarget; }).map(function (it) { return it; });
-            },
-            enumerable: false,
-            configurable: true
-        });
-        Object.defineProperty(ChainedQuery.prototype, "elements", {
-            get: function () {
-                return this._items.filter(function (it) { return it instanceof Element; }).map(function (it) { return it; });
-            },
-            enumerable: false,
-            configurable: true
-        });
-        Object.defineProperty(ChainedQuery.prototype, "nodes", {
-            get: function () {
-                return this._items.filter(function (it) { return it instanceof Node; }).map(function (it) { return it; });
-            },
-            enumerable: false,
-            configurable: true
-        });
-        Object.defineProperty(ChainedQuery.prototype, "containers", {
-            get: function () {
-                return this._items.map(function (it) { return it; }).filter(function (p) { return typeof p.append === 'function'; });
-            },
-            enumerable: false,
-            configurable: true
-        });
-        Object.defineProperty(ChainedQuery.prototype, "length", {
-            get: function () {
-                return this._items.length;
-            },
-            enumerable: false,
-            configurable: true
-        });
-        ChainedQuery.prototype.add = function () {
-            var _a;
-            var sources = [];
-            for (var _i = 0; _i < arguments.length; _i++) {
-                sources[_i] = arguments[_i];
-            }
-            (_a = this._items).push.apply(_a, this.mapper.Map(sources));
-            return this;
-        };
-        // TODO: This must not fall over if trying to perform an action
-        // on an inappropriate type. eg setting an attribute on window, or
-        // trying to query a non-parent node..
-        ChainedQuery.prototype.each = function (func) {
-            this._items.forEach(function (item, i) { return func(item, i); });
-            return this;
-        };
-        ChainedQuery.prototype.prop = function (name, value) {
-            return this.each(function (item) {
-                if (name in item) {
-                    item[name] = value;
-                }
-            });
-        };
-        //#region Targets
-        ChainedQuery.prototype.fire = function (eventName, detail) {
-            var evt = new CustomEvent(eventName, { detail: detail });
-            this.targets.forEach(function (t) { return t.dispatchEvent(evt); });
-            return this;
-        };
-        ChainedQuery.prototype.on = function (eventNames, func) {
-            var evts = eventNames.split(ChainedQuery.WHITESPACE_RGX);
-            this.targets.forEach(function (t) {
-                evts.forEach(function (name) { return t.addEventListener(name, func); });
-            });
-            return this;
-        };
-        //#endregion
-        //#region Elements
-        ChainedQuery.prototype.attr = function (name, value, ns) {
-            this.elements.forEach(function (elem) {
-                if (value != null)
-                    elem.setAttributeNS(ns, name, value);
-                else
-                    elem.removeAttributeNS(ns, name);
-            });
-            return this;
-        };
-        ChainedQuery.prototype.toggle = function (className, doSet) {
-            this.elements.forEach(function (elem) {
-                var force = typeof doSet === 'function' ? doSet(elem) : !!doSet;
-                elem.classList.toggle(className, force);
-            });
-            return this;
-        };
-        //#endregion
-        //#region Nodes
-        ChainedQuery.prototype.empty = function () {
-            this.nodes.forEach(function (n) {
-                while (n.firstChild) {
-                    n.removeChild(n.firstChild);
-                }
-            });
-            return this;
-        };
-        ChainedQuery.prototype.remove = function () {
-            return new (ChainedQuery.bind.apply(ChainedQuery, __spreadArray([void 0, this.mapper], this._items.filter(function (it) {
-                var handle = it instanceof Node;
-                if (handle)
-                    it.parentNode.removeChild(it);
-                return !handle;
-            }), false)))();
-        };
-        //#endregion
-        //#region Containers
-        ChainedQuery.prototype.append = function () {
-            var sources = [];
-            for (var _i = 0; _i < arguments.length; _i++) {
-                sources[_i] = arguments[_i];
-            }
-            this.appendIn.apply(this, sources);
-            return this;
-        };
-        ChainedQuery.prototype.appendIn = function () {
-            var _this = this;
-            var sources = [];
-            for (var _i = 0; _i < arguments.length; _i++) {
-                sources[_i] = arguments[_i];
-            }
-            return new (ChainedQuery.bind.apply(ChainedQuery, __spreadArray([void 0, this.mapper], this.containers.reduce(function (acc, parent) {
-                var nodes = new (ChainedQuery.bind.apply(ChainedQuery, __spreadArray([void 0, _this.mapper], sources, false)))().nodes;
-                parent.append.apply(parent, nodes);
-                acc.push.apply(acc, nodes);
-                return acc;
-            }, []), false)))();
-        };
-        ChainedQuery.prototype.find = function (selector) {
-            return new (ChainedQuery.bind.apply(ChainedQuery, __spreadArray([void 0, this.mapper], this.containers.reduce(function (acc, parent) {
-                acc.push.apply(acc, Array.from(parent.querySelectorAll(selector)));
-                return acc;
-            }, []), false)))();
-        };
-        ChainedQuery.prototype.first = function (selector) {
-            return new (ChainedQuery.bind.apply(ChainedQuery, __spreadArray([void 0, this.mapper], this.containers.map(function (parent) { return parent.querySelector(selector); }).filter(function (found) { return !!found; }), false)))();
-        };
-        ChainedQuery.WHITESPACE_RGX = /\s+/;
-        return ChainedQuery;
-    }());
-
-    var SourceMapper = /** @class */ (function () {
-        function SourceMapper() {
-        }
-        SourceMapper.prototype.Map = function (sources) {
-            return sources.reduce(function (acc, item) {
-                if (typeof item === 'string') {
-                    acc.push.apply(acc, (SourceMapper.NAIVE_HTML_RGX.test(item)
-                        ? SourceMapper.MapHTML(item)
-                        : SourceMapper.MapSelector(item)));
-                }
-                else if (item.tag)
-                    acc.push(SourceMapper.MapParam(item));
-                else if (item instanceof Node)
-                    acc.push(item);
-                else if (item instanceof EventTarget)
-                    acc.push(item);
-                else if (item instanceof ChainedQuery)
-                    item.each(function (i) { return acc.push(i); });
-                else
-                    console.warn('Unrecognised item:', item);
-                return acc;
-            }, []);
-        };
-        SourceMapper.MapHTML = function (html) {
-            var template = document.createElement('template');
-            template.innerHTML = html;
-            return Array.from(template.content.childNodes);
-        };
-        SourceMapper.MapSelector = function (selector) {
-            return Array.from(document.querySelectorAll(selector));
-        };
-        SourceMapper.MapParam = function (p) {
-            var n = document.createElement(p.tag);
-            if (p.text)
-                n.textContent = p.text;
-            for (var key in p.attr || {}) {
-                if (p.attr[key] != null) {
-                    n.setAttribute(key, p.attr[key]);
-                }
-            }
-            for (var key in p.evts || {}) {
-                if (typeof p.evts[key] === 'function') {
-                    n.addEventListener(key, p.evts[key]);
-                }
-            }
-            return n;
-        };
-        SourceMapper.NAIVE_HTML_RGX = /^\s*<.*>\s*$/m;
-        return SourceMapper;
-    }());
-    var mapper = new SourceMapper();
-    function q() {
-        var input = [];
-        for (var _i = 0; _i < arguments.length; _i++) {
-            input[_i] = arguments[_i];
-        }
-        return new (ChainedQuery.bind.apply(ChainedQuery, __spreadArray([void 0, mapper], input, false)))();
-    }
-
-    class CustomElementBase extends HTMLElement {
-        constructor(css, html, mode = 'closed') {
-            super();
-            this.root = this.attachShadow({ mode });
-            this.root.innerHTML = html;
-            const style = document.createElement('style');
-            style.textContent = css;
-            this.root.appendChild(style);
-        }
-    }
-
-    function decode(b64) {
-        const bIndex = (b64 + '').indexOf('base64,');
-        return bIndex === -1 ? b64 : window.atob(b64.substring(bIndex + 7));
-    }
-    function reduceCss(cssIn) {
-        return cssIn
-            .replace(/\s+/g, ' ')
-            .replace(/([,{}:;])\s/g, '$1')
-            .replace(/\s([{])/g, '$1');
-    }
-    function reduceHtml(htmlIn) {
-        return htmlIn.replace(/\s+/g, ' ').replace(/(^|>)\s+(<|$)/g, '$1$2');
-    }
-
-    var markupUrl = "data:text/html;base64,PHNsb3Q+PC9zbG90Pg0KPHVsIGNsYXNzPSJ0b3AiPjwvdWw+DQo=";
-
-    var stylesUrl = "data:text/css;base64,dWwsDQpsaSB7DQogIHBhZGRpbmc6IDA7DQogIG1hcmdpbjogMDsNCiAgZm9udDogaW5oZXJpdDsNCn0NCnNsb3QsDQpsaS5zcGxpdCAuaWNvbiB7DQogIGRpc3BsYXk6IG5vbmU7DQp9DQoudG9wOm5vdCgub3BlbiksDQp1bDpub3QoLnRvcCkgew0KICB2aXNpYmlsaXR5OiBoaWRkZW47DQp9DQoNCnVsIHsNCiAgYm9yZGVyOiB2YXIoLS1ib3JkZXIsIDFweCBzb2xpZCAjYmJiKTsNCiAgYmFja2dyb3VuZDogdmFyKC0tYmcsICNmZmYpOw0KICBib3gtc2hhZG93OiB2YXIoLS1ib3gtc2hhZG93LCAycHggMnB4IDNweCAjODg4KTsNCiAgdHJhbnNpdGlvbjogYmFja2dyb3VuZCAwLjZzOw0KICB6LWluZGV4OiA5OTk5OTk5Ow0KfQ0KDQoudG9wIHsNCiAgcG9zaXRpb246IGZpeGVkOw0KICBmb250LXNpemU6IHZhcigtLWZvbnQtc2l6ZSwgMC42NXJlbSk7DQogIHVzZXItc2VsZWN0OiBub25lOw0KfQ0KDQouaWNvbi5sZWZ0IHsNCiAgbGVmdDogMWVtOw0KICB0cmFuc2Zvcm06IHRyYW5zbGF0ZSgtNTAlLCAtNTAlKTsNCn0NCi5pY29uLnJpZ2h0IHsNCiAgcmlnaHQ6IDFlbTsNCiAgdHJhbnNmb3JtOiB0cmFuc2xhdGUoNTAlLCAtNTAlKTsNCn0NCi5pY29uIHsNCiAgbWF4LXdpZHRoOiAxZW07DQogIG1heC1oZWlnaHQ6IDFlbTsNCiAgcG9zaXRpb246IGFic29sdXRlOw0KICB0b3A6IDUwJTsNCiAgbGluZS1oZWlnaHQ6IDA7DQp9DQoNCmxpID4gcDpub3QoOmVtcHR5KSB7DQogIG1hcmdpbjogMCAxZW07DQogIHdoaXRlLXNwYWNlOiBub3dyYXA7DQp9DQpsaS5kaXNhYmxlZCB7DQogIGNvbG9yOiB2YXIoLS1kaXNhYmxlZC1mZywgI2JiYik7DQp9DQpsaS5zcGxpdCB7DQogIGJvcmRlci10b3A6IHZhcigtLXNwbGl0LWJvcmRlciwgdmFyKC0tYm9yZGVyLCAxcHggc29saWQgI2JiYikpOw0KICBwYWRkaW5nOiAwOw0KICBtYXJnaW46IDAuM2VtOw0KfQ0KbGkuc3BsaXQ6Zmlyc3QtY2hpbGQsDQpsaS5zcGxpdDpsYXN0LWNoaWxkLA0KbGkuc3BsaXQgKyBsaS5zcGxpdCB7DQogIGRpc3BsYXk6IG5vbmU7DQp9DQpsaS5ob3Zlcjpub3QoLmRpc2FiZWQpOm5vdCguc3BsaXQpIHsNCiAgYmFja2dyb3VuZDogdmFyKC0taG92ZXItaXRlbS1iZywgI2JiYik7DQp9DQoudG9wLm9wZW4gbGkuaG92ZXIgPiB1bCB7DQogIHZpc2liaWxpdHk6IHZpc2libGU7DQp9DQpsaSB7DQogIG1hcmdpbjogMC4yZW0gMDsNCiAgcGFkZGluZzogMC41ZW0gMWVtOw0KICBkaXNwbGF5OiBmbGV4Ow0KICBqdXN0aWZ5LWNvbnRlbnQ6IHNwYWNlLWJldHdlZW47DQogIHRleHQtYWxpZ246IGxlZnQ7DQogIHBvc2l0aW9uOiByZWxhdGl2ZTsNCiAgY3Vyc29yOiBkZWZhdWx0Ow0KICBjb2xvcjogdmFyKC0tZmcsICMwMDApOw0KfQ0KDQpsaS5ncm91cDo6YWZ0ZXIgew0KICBjb250ZW50OiAnXDI1YjYnOw0KICBwb3NpdGlvbjogYWJzb2x1dGU7DQogIGZvbnQtc2l6ZTogMC42NWVtOw0KICByaWdodDogMDsNCiAgdG9wOiA1MCU7DQogIHRyYW5zZm9ybTogdHJhbnNsYXRlKC01MCUsIC01MCUpOw0KfQ0KDQp1bDpub3QoLnRvcCkgew0KICBwb3NpdGlvbjogYWJzb2x1dGU7DQogIGxlZnQ6IDEwMCU7DQogIHRvcDogLTAuMjVlbTsNCn0NCg0KdWwubmVzdGxlIHsNCiAgbGVmdDogMC41ZW07DQogIHRvcDogMTAwJTsNCn0NCg==";
-
-    class NeMenu extends CustomElementBase {
-        constructor() {
-            super(NeMenu.Css, NeMenu.Html);
-            this.top = this.root.querySelector('ul');
-        }
-        connectedCallback() {
-            if (!this._connected) {
-                setTimeout(() => this.reload());
-                q(this.parentNode).on('contextmenu', (e) => this.onParentContext(e));
-                q(this, this.parentNode).on('contextmenu wheel', (e) => {
-                    e.preventDefault();
-                    e.stopPropagation();
-                });
-                q(this).on('mousedown', (e) => e.stopPropagation());
-                q(window).on('mousedown resize wheel', () => this.close());
-                this._connected = true;
-            }
-        }
-        /** Opens the menu.  */
-        open() {
-            // close all menus
-            const doc = this.parentElement.getRootNode();
-            doc.querySelectorAll('ne14-menu').forEach((m) => m.close());
-            // style this one as open
-            this.top.classList.add('open');
-            q(this).fire('menuopen');
-        }
-        /** Closes the menu. */
-        close() {
-            if (this.top.classList.contains('open')) {
-                this.top.classList.remove('open');
-                q(this).fire('menuclose');
-            }
-        }
-        /** Reloads active contents based on client dom. */
-        reload() {
-            q(this.top)
-                .empty()
-                .append(...this.walk(this, false));
-        }
-        onParentContext(event) {
-            if (this.isConnected) {
-                // update position (y)
-                const y = event.clientY;
-                const height = this.top.offsetHeight;
-                const posY = y + height + 2 > window.innerHeight ? y - height : y;
-                this.top.style.top = `${Math.max(0, posY)}px`;
-                // update position (x)
-                const x = event.clientX;
-                const width = this.top.offsetWidth;
-                const posX = x + width + 2 > window.innerWidth ? x - width : x;
-                this.top.style.left = `${Math.max(0, posX)}px`;
-                // open
-                this.open();
-            }
-        }
-        walk(ul, parentDisabled, ref = '') {
-            let levelItemNo = 0;
-            return Array.from(ul.children)
-                .filter((c) => c instanceof HTMLLIElement &&
-                !c.classList.contains('hidden') &&
-                (c.textContent || c.classList.contains('split')))
-                .reduce((acc, li) => {
-                var _a, _b, _c;
-                const children = Array.from(li.children).map((el) => el);
-                const a = children.find((n) => n instanceof HTMLAnchorElement);
-                const ul = children.find((n) => n instanceof HTMLUListElement);
-                const isSplit = li.classList.contains('split');
-                const isGrouper = !isSplit && ul && ul.querySelector('li');
-                const isDisabled = !isSplit && (parentDisabled || li.classList.contains('disabled'));
-                const aChildren = Array.from((a === null || a === void 0 ? void 0 : a.children) || []).map((el) => el);
-                const imgs = children
-                    .concat(aChildren)
-                    .filter((n) => n instanceof HTMLImageElement)
-                    .map((n) => n);
-                if (!isSplit)
-                    levelItemNo++;
-                const classes = [];
-                if (isSplit)
-                    classes.push('split');
-                else {
-                    if (isDisabled)
-                        classes.push('disabled');
-                    if (isGrouper)
-                        classes.push('group');
-                    if ((a === null || a === void 0 ? void 0 : a.target) === '_blank')
-                        classes.push('click-out');
-                    else if (a)
-                        classes.push('click-in');
-                }
-                const bestTextNode = [...children, li].find((c) => c.innerText);
-                const bestText = isSplit ? null : ((_a = bestTextNode === null || bestTextNode === void 0 ? void 0 : bestTextNode.innerText) !== null && _a !== void 0 ? _a : `Item ${levelItemNo}`);
-                const shortcut = isSplit || isGrouper ? null : li.getAttribute('aria-keyshortcuts');
-                const liRef = `${ref}${levelItemNo}`;
-                const eventDetail = { ref: liRef, title: bestText, origin: a || li };
-                const handleClick = () => {
-                    if (!isDisabled && !isGrouper && !isSplit) {
-                        eventDetail.origin.click();
-                        q(this).fire('itemselect', eventDetail);
-                        this.close();
-                    }
-                };
-                const handleMouseEnter = (e) => {
-                    if (!isDisabled && !isSplit) {
-                        const domLi = e.target;
-                        if (isGrouper) {
-                            const domUl = Array.from(domLi.children).find((n) => n instanceof HTMLUListElement);
-                            const liRect = domLi.getBoundingClientRect();
-                            domUl.classList.toggle('nestle', liRect.right + domUl.clientWidth + 2 > window.innerWidth);
-                        }
-                        domLi.classList.add('hover');
-                        q(this).fire('itemhover', eventDetail);
-                    }
-                };
-                const handleMouseLeave = (e) => {
-                    if (!isDisabled && !isSplit) {
-                        e.target.classList.remove('hover');
-                        q(this).fire('itemunhover', eventDetail);
-                    }
-                };
-                const $domItem = q({ tag: 'li' })
-                    .attr('class', classes.length ? classes.join(' ') : null)
-                    .attr('aria-keyshortcuts', shortcut)
-                    .on('click contextmenu', handleClick)
-                    .on('mouseenter', handleMouseEnter)
-                    .on('mouseleave', handleMouseLeave);
-                const charLeft = li.dataset.charLeft;
-                const charRight = li.dataset.charRight;
-                const imgLeft = imgs.find((i) => !i.classList.contains('right'));
-                const imgRight = imgs.find((i) => i.classList.contains('right'));
-                if (!isSplit && !isGrouper && bestText) {
-                    if (NeMenu.CHAR_REF_REGEX.test(charLeft))
-                        $domItem.append(`<span class='icon left'>&#x${charLeft};</span>`);
-                    else if (charLeft)
-                        console.warn(`ne14-menu: Bad hex code '${charLeft}' to left of '${bestText}'.`);
-                    else if (imgLeft)
-                        $domItem.append(`<img class='icon left' src='${imgLeft.src}'/>`);
-                    if (NeMenu.CHAR_REF_REGEX.test(charRight))
-                        $domItem.append(`<span class='icon right'>&#x${charRight};</span>`);
-                    else if (charRight)
-                        console.warn(`ne14-menu: Bad hex code '${charRight}' to right of '${bestText}'.`);
-                    else if (imgRight)
-                        $domItem.append(`<img class='icon right' src='${imgRight.src}'/>`);
-                }
-                if (bestText)
-                    $domItem.append({ tag: 'p', text: bestText });
-                if (shortcut)
-                    $domItem.append({ tag: 'p', text: shortcut });
-                if (isGrouper)
-                    $domItem.appendIn({ tag: 'ul' }).append(...this.walk(ul, isDisabled, `${liRef}-`));
-                // Do not push two consecutive splits
-                if (!isSplit || !((_c = (_b = acc[acc.length - 1]) === null || _b === void 0 ? void 0 : _b.classList) === null || _c === void 0 ? void 0 : _c.contains('split'))) {
-                    acc.push($domItem.elements[0]);
-                }
-                return acc;
-            }, []);
-        }
-    }
-    NeMenu.Css = reduceCss(decode(stylesUrl));
-    NeMenu.Html = reduceHtml(decode(markupUrl));
-    NeMenu.CHAR_REF_REGEX = /^[0-9a-f]{4,5}$/i;
-
-    if ('customElements' in window) {
-        window.customElements.define('ne14-menu', NeMenu);
-    }
-
-    exports.ContextMenu = NeMenu;
-
-}));