@toolbox-web/grid 1.14.0 → 1.15.0

package/lib/plugins/context-menu/ContextMenuPlugin.d.ts

@@ -1,4 +1,4 @@
-import { BaseGridPlugin } from '../../core/plugin/base-plugin';
+import { PluginManifest, BaseGridPlugin } from '../../core/plugin/base-plugin';
 import { ContextMenuConfig, ContextMenuParams } from './types';
 /**
  * Context Menu Plugin for tbw-grid
@@ -81,6 +81,11 @@ import { ContextMenuConfig, ContextMenuParams } from './types';
  * @internal Extends BaseGridPlugin
  */
 export declare class ContextMenuPlugin extends BaseGridPlugin<ContextMenuConfig> {
+    /**
+     * Plugin manifest - declares queries used by this plugin.
+     * @internal
+     */
+    static readonly manifest: PluginManifest;
     /** @internal */
     readonly name = "contextMenu";
     /** @internal */
@@ -118,6 +123,20 @@ export declare class ContextMenuPlugin extends BaseGridPlugin<ContextMenuConfig>
      * Uses reference counting to ensure handlers persist while any grid uses the plugin.
      */
     private uninstallGlobalHandlers;
+    /**
+     * Query all plugins for context menu items via the query system.
+     * Each plugin that handles `getContextMenuItems` can return an array of HeaderContextMenuItem.
+     */
+    private collectPluginItems;
+    /**
+     * Insert separators between groups of items with different order ranges.
+     * Groups are defined by the tens digit (10-19, 20-29, etc.).
+     */
+    private insertGroupSeparators;
+    /**
+     * Convert plugin-contributed HeaderContextMenuItems to the internal ContextMenuItem format.
+     */
+    private convertPluginItems;
     /** @internal */
     afterRender(): void;
     /**

package/lib/plugins/context-menu/ContextMenuPlugin.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMenuPlugin.d.ts","sourceRoot":"","sources":["../../../../../../libs/grid/src/lib/plugins/context-menu/ContextMenuPlugin.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAG/D,OAAO,KAAK,EAAE,iBAAiB,EAAmB,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAkCrF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+EG;AACH,qBAAa,iBAAkB,SAAQ,cAAc,CAAC,iBAAiB,CAAC;IACtE,gBAAgB;IAChB,QAAQ,CAAC,IAAI,iBAAiB;IAE9B,gBAAgB;IAChB,cAAuB,aAAa,IAAI,OAAO,CAAC,iBAAiB,CAAC,CAIjE;IAGD,OAAO,CAAC,MAAM,CAAS;IACvB,OAAO,CAAC,QAAQ,CAAkB;IAClC,OAAO,CAAC,MAAM,CAAkC;IAChD,OAAO,CAAC,WAAW,CAA4B;IAK/C,gBAAgB;IACP,MAAM,CAAC,IAAI,EAAE,OAAO,+BAA+B,EAAE,WAAW,GAAG,IAAI;IAMhF,gBAAgB;IACP,MAAM,IAAI,IAAI;IAavB;;;;;;OAMG;IACH,OAAO,CAAC,0BAA0B;IAoBlC;;;OAGG;IACH,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,gBAAgB,CAoCtC;IAEF;;;;OAIG;IACH,OAAO,CAAC,cAAc;IA2BtB,OAAO,CAAC,qBAAqB;IAqC7B;;;OAGG;IACH,OAAO,CAAC,uBAAuB;IAsB/B,gBAAgB;IACP,WAAW,IAAI,IAAI;IAoG5B;;;;;OAKG;IACH,QAAQ,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,CAAC,iBAAiB,CAAC,GAAG,IAAI;IAqCxE;;OAEG;IACH,QAAQ,IAAI,IAAI;IAQhB;;;OAGG;IACH,UAAU,IAAI,OAAO;CAMtB"}
+{"version":3,"file":"ContextMenuPlugin.d.ts","sourceRoot":"","sources":["../../../../../../libs/grid/src/lib/plugins/context-menu/ContextMenuPlugin.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AACpE,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAG/D,OAAO,KAAK,EAAE,iBAAiB,EAAmB,iBAAiB,EAAyB,MAAM,SAAS,CAAC;AAqC5G;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+EG;AACH,qBAAa,iBAAkB,SAAQ,cAAc,CAAC,iBAAiB,CAAC;IACtE;;;OAGG;IACH,gBAAyB,QAAQ,EAAE,cAAc,CAO/C;IAEF,gBAAgB;IAChB,QAAQ,CAAC,IAAI,iBAAiB;IAE9B,gBAAgB;IAChB,cAAuB,aAAa,IAAI,OAAO,CAAC,iBAAiB,CAAC,CAIjE;IAGD,OAAO,CAAC,MAAM,CAAS;IACvB,OAAO,CAAC,QAAQ,CAAkB;IAClC,OAAO,CAAC,MAAM,CAAkC;IAChD,OAAO,CAAC,WAAW,CAA4B;IAK/C,gBAAgB;IACP,MAAM,CAAC,IAAI,EAAE,OAAO,+BAA+B,EAAE,WAAW,GAAG,IAAI;IAMhF,gBAAgB;IACP,MAAM,IAAI,IAAI;IAavB;;;;;;OAMG;IACH,OAAO,CAAC,0BAA0B;IAoBlC;;;OAGG;IACH,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,gBAAgB,CAoCtC;IAEF;;;;OAIG;IACH,OAAO,CAAC,cAAc;IA2BtB,OAAO,CAAC,qBAAqB;IAqC7B;;;OAGG;IACH,OAAO,CAAC,uBAAuB;IAmB/B;;;OAGG;IACH,OAAO,CAAC,kBAAkB;IAmB1B;;;OAGG;IACH,OAAO,CAAC,qBAAqB;IA6B7B;;OAEG;IACH,OAAO,CAAC,kBAAkB;IAgB1B,gBAAgB;IACP,WAAW,IAAI,IAAI;IAuH5B;;;;;OAKG;IACH,QAAQ,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,CAAC,iBAAiB,CAAC,GAAG,IAAI;IAkDxE;;OAEG;IACH,QAAQ,IAAI,IAAI;IAQhB;;;OAGG;IACH,UAAU,IAAI,OAAO;CAMtB"}

package/lib/plugins/context-menu/index.d.ts

@@ -5,5 +5,5 @@
  * @module Plugins/Context Menu
  */
 export { ContextMenuPlugin } from './ContextMenuPlugin';
-export type { ContextMenuConfig, ContextMenuItem, ContextMenuParams } from './types';
+export type { ContextMenuConfig, ContextMenuItem, ContextMenuParams, HeaderContextMenuItem } from './types';
 //# sourceMappingURL=index.d.ts.map

package/lib/plugins/context-menu/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../libs/grid/src/lib/plugins/context-menu/index.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,YAAY,EAAE,iBAAiB,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../libs/grid/src/lib/plugins/context-menu/index.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,YAAY,EAAE,iBAAiB,EAAE,eAAe,EAAE,iBAAiB,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC"}

package/lib/plugins/context-menu/index.js

@@ -1,4 +1,4 @@
-const E = '<svg viewBox="0 0 16 16" width="12" height="12"><path fill="currentColor" d="M6 10.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/></svg>', I = {
+const C = '<svg viewBox="0 0 16 16" width="12" height="12"><path fill="currentColor" d="M6 10.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/></svg>', R = {
   expand: "▶",
   collapse: "▼",
   sortAsc: "▲",
@@ -7,11 +7,11 @@ const E = '<svg viewBox="0 0 16 16" width="12" height="12"><path fill="currentCo
   submenuArrow: "▶",
   dragHandle: "⋮⋮",
   toolPanel: "☰",
-  filter: E,
-  filterActive: E,
+  filter: C,
+  filterActive: C,
   print: "🖨️"
 };
-class R {
+class z {
   /**
    * Plugin dependencies - declare other plugins this one requires.
    *
@@ -301,7 +301,7 @@ class R {
    */
   get gridIcons() {
     const e = this.grid?.gridConfig?.icons ?? {};
-    return { ...I, ...e };
+    return { ...R, ...e };
   }
   // #region Animation Helpers
   /**
@@ -377,83 +377,106 @@ class R {
   }
   // #endregion
 }
-const g = "@layer tbw-plugins{.tbw-context-menu{position:fixed;background:var(--tbw-context-menu-bg, var(--tbw-color-panel-bg));color:var(--tbw-context-menu-fg, var(--tbw-color-fg));border:1px solid var(--tbw-context-menu-border, var(--tbw-color-border));border-radius:var(--tbw-context-menu-radius, var(--tbw-border-radius));box-shadow:var(--tbw-context-menu-shadow, 0 2px 10px var(--tbw-color-shadow));min-width:var(--tbw-context-menu-min-width, var(--tbw-menu-min-width));padding:var(--tbw-spacing-xs) 0;z-index:10000;font-size:var(--tbw-context-menu-font-size, var(--tbw-font-size-sm));font-family:var(--tbw-context-menu-font-family, var(--tbw-font-family))}.tbw-context-menu-item{display:flex;align-items:center;padding:var(--tbw-context-menu-item-padding, var(--tbw-menu-item-padding));cursor:pointer;gap:var(--tbw-context-menu-item-gap, var(--tbw-menu-item-gap))}.tbw-context-menu-item:hover:not(.disabled){background:var(--tbw-context-menu-hover, var(--tbw-color-row-hover))}.tbw-context-menu-item.disabled{opacity:.5;cursor:default}.tbw-context-menu-item.danger{color:var(--tbw-context-menu-danger, var(--tbw-color-danger))}.tbw-context-menu-icon{width:var(--tbw-context-menu-icon-size, var(--tbw-icon-size));text-align:center}.tbw-context-menu-label{flex:1}.tbw-context-menu-shortcut{color:var(--tbw-context-menu-muted, var(--tbw-color-fg-muted));font-size:var(--tbw-context-menu-shortcut-size, var(--tbw-font-size-xs))}.tbw-context-menu-arrow{font-size:var(--tbw-context-menu-arrow-size, var(--tbw-font-size-2xs));color:var(--tbw-context-menu-muted, var(--tbw-color-fg-muted))}.tbw-context-menu-separator{height:1px;background:var(--tbw-context-menu-border, var(--tbw-color-border));margin:var(--tbw-spacing-xs) 0}}";
-function x(r, e) {
-  return (typeof r == "function" ? r(e) : r).filter((n) => !(n.hidden === !0 || typeof n.hidden == "function" && n.hidden(e)));
+const p = "@layer tbw-plugins{.tbw-context-menu{position:fixed;background:var(--tbw-context-menu-bg, var(--tbw-color-panel-bg));color:var(--tbw-context-menu-fg, var(--tbw-color-fg));border:1px solid var(--tbw-context-menu-border, var(--tbw-color-border));border-radius:var(--tbw-context-menu-radius, var(--tbw-border-radius));box-shadow:var(--tbw-context-menu-shadow, 0 2px 10px var(--tbw-color-shadow));min-width:var(--tbw-context-menu-min-width, var(--tbw-menu-min-width));padding:var(--tbw-spacing-xs) 0;z-index:10000;font-size:var(--tbw-context-menu-font-size, var(--tbw-font-size-sm));font-family:var(--tbw-context-menu-font-family, var(--tbw-font-family))}.tbw-context-menu-item{display:flex;align-items:center;padding:var(--tbw-context-menu-item-padding, var(--tbw-menu-item-padding));cursor:pointer;gap:var(--tbw-context-menu-item-gap, var(--tbw-menu-item-gap))}.tbw-context-menu-item:hover:not(.disabled){background:var(--tbw-context-menu-hover, var(--tbw-color-row-hover))}.tbw-context-menu-item.disabled{opacity:.5;cursor:default}.tbw-context-menu-item.danger{color:var(--tbw-context-menu-danger, var(--tbw-color-danger))}.tbw-context-menu-icon{width:var(--tbw-context-menu-icon-size, var(--tbw-icon-size));text-align:center}.tbw-context-menu-label{flex:1}.tbw-context-menu-shortcut{color:var(--tbw-context-menu-muted, var(--tbw-color-fg-muted));font-size:var(--tbw-context-menu-shortcut-size, var(--tbw-font-size-xs))}.tbw-context-menu-arrow{font-size:var(--tbw-context-menu-arrow-size, var(--tbw-font-size-2xs));color:var(--tbw-context-menu-muted, var(--tbw-color-fg-muted))}.tbw-context-menu-separator{height:1px;background:var(--tbw-context-menu-border, var(--tbw-color-border));margin:var(--tbw-spacing-xs) 0}}";
+function v(l, e) {
+  return (typeof l == "function" ? l(e) : l).filter((n) => !(n.hidden === !0 || typeof n.hidden == "function" && n.hidden(e)));
 }
-function z(r, e) {
-  return r.disabled === !0 ? !0 : typeof r.disabled == "function" ? r.disabled(e) : !1;
+function I(l) {
+  const e = [];
+  for (const t of l)
+    t.separator && (e.length === 0 || e[e.length - 1].separator) || e.push(t);
+  return e.length > 0 && e[e.length - 1].separator && e.pop(), e;
 }
-function v(r, e, t, n = I.submenuArrow) {
+function H(l, e) {
+  return l.disabled === !0 ? !0 : typeof l.disabled == "function" ? l.disabled(e) : !1;
+}
+function y(l, e, t, n = R.submenuArrow) {
   const s = document.createElement("div");
   s.className = "tbw-context-menu", s.setAttribute("role", "menu");
-  for (const o of r) {
+  const u = l.some((o) => !o.separator && o.icon);
+  for (const o of l) {
     if (o.separator) {
-      const l = document.createElement("div");
-      l.className = "tbw-context-menu-separator", l.setAttribute("role", "separator"), s.appendChild(l);
+      const r = document.createElement("div");
+      r.className = "tbw-context-menu-separator", r.setAttribute("role", "separator"), s.appendChild(r);
       continue;
     }
     const i = document.createElement("div");
     i.className = "tbw-context-menu-item", o.cssClass && i.classList.add(o.cssClass), i.setAttribute("role", "menuitem"), i.setAttribute("data-id", o.id);
-    const u = z(o, e);
-    if (u && (i.classList.add("disabled"), i.setAttribute("aria-disabled", "true")), o.icon) {
-      const l = document.createElement("span");
-      l.className = "tbw-context-menu-icon", l.innerHTML = o.icon, i.appendChild(l);
+    const a = H(o, e);
+    if (a && (i.classList.add("disabled"), i.setAttribute("aria-disabled", "true")), o.icon) {
+      const r = document.createElement("span");
+      r.className = "tbw-context-menu-icon", r.innerHTML = o.icon, i.appendChild(r);
+    } else if (u) {
+      const r = document.createElement("span");
+      r.className = "tbw-context-menu-icon", r.innerHTML = "&nbsp;", i.appendChild(r);
     }
-    const a = document.createElement("span");
-    if (a.className = "tbw-context-menu-label", a.textContent = o.name, i.appendChild(a), o.shortcut) {
-      const l = document.createElement("span");
-      l.className = "tbw-context-menu-shortcut", l.textContent = o.shortcut, i.appendChild(l);
+    const b = document.createElement("span");
+    if (b.className = "tbw-context-menu-label", b.textContent = o.name, i.appendChild(b), o.shortcut) {
+      const r = document.createElement("span");
+      r.className = "tbw-context-menu-shortcut", r.textContent = o.shortcut, i.appendChild(r);
     }
     if (o.subMenu?.length) {
-      const l = document.createElement("span");
-      l.className = "tbw-context-menu-arrow", typeof n == "string" ? l.innerHTML = n : n instanceof HTMLElement && l.appendChild(n.cloneNode(!0)), i.appendChild(l), i.addEventListener("mouseenter", () => {
+      const r = document.createElement("span");
+      r.className = "tbw-context-menu-arrow", typeof n == "string" ? r.innerHTML = n : n instanceof HTMLElement && r.appendChild(n.cloneNode(!0)), i.appendChild(r), i.addEventListener("mouseenter", () => {
         if (i.querySelector(".tbw-context-menu") || !o.subMenu) return;
-        const b = x(o.subMenu, e), d = v(b, e, t, n);
+        const h = v(o.subMenu, e), d = y(h, e, t, n);
         d.classList.add("tbw-context-submenu"), d.style.position = "absolute", d.style.left = "100%", d.style.top = "0", i.style.position = "relative", i.appendChild(d);
       }), i.addEventListener("mouseleave", () => {
         const c = i.querySelector(".tbw-context-menu");
         c && c.remove();
       });
     }
-    !u && o.action && !o.subMenu && i.addEventListener("click", (l) => {
-      l.stopPropagation(), t(o);
+    !a && o.action && !o.subMenu && i.addEventListener("click", (r) => {
+      r.stopPropagation(), t(o);
     }), s.appendChild(i);
   }
   return s;
 }
-function C(r, e, t) {
-  r.style.position = "fixed", r.style.left = `${e}px`, r.style.top = `${t}px`, r.style.visibility = "hidden", r.style.zIndex = "10000";
-  const n = r.getBoundingClientRect(), s = window.innerWidth, o = window.innerHeight;
-  let i = e, u = t;
-  e + n.width > s && (i = e - n.width), t + n.height > o && (u = t - n.height), i = Math.max(0, i), u = Math.max(0, u), r.style.left = `${i}px`, r.style.top = `${u}px`, r.style.visibility = "visible";
+function S(l, e, t) {
+  l.style.position = "fixed", l.style.left = `${e}px`, l.style.top = `${t}px`, l.style.visibility = "hidden", l.style.zIndex = "10000";
+  const n = l.getBoundingClientRect(), s = window.innerWidth, u = window.innerHeight;
+  let o = e, i = t;
+  e + n.width > s && (o = e - n.width), t + n.height > u && (i = t - n.height), o = Math.max(0, o), i = Math.max(0, i), l.style.left = `${o}px`, l.style.top = `${i}px`, l.style.visibility = "visible";
 }
-let h = null, f = null, m = null, w = 0;
-const p = [
+const M = "getContextMenuItems";
+let f = null, g = null, m = null, w = 0;
+const x = [
   {
     id: "copy",
     name: "Copy",
     shortcut: "Ctrl+C",
-    action: (r) => {
-      r.grid?.plugins?.clipboard?.copy?.();
+    action: (l) => {
+      l.grid?.plugins?.clipboard?.copy?.();
     }
   },
   { separator: !0, id: "sep1", name: "" },
   {
     id: "export-csv",
     name: "Export CSV",
-    action: (r) => {
-      r.grid?.plugins?.export?.exportCsv?.();
+    action: (l) => {
+      l.grid?.plugins?.export?.exportCsv?.();
     }
   }
 ];
-class S extends R {
+class _ extends z {
+  /**
+   * Plugin manifest - declares queries used by this plugin.
+   * @internal
+   */
+  static manifest = {
+    queries: [
+      {
+        type: M,
+        description: "Collects context menu items from other plugins for header right-click menus"
+      }
+    ]
+  };
   /** @internal */
   name = "contextMenu";
   /** @internal */
   get defaultConfig() {
     return {
-      items: p
+      items: x
     };
   }
   // #region Internal State
@@ -534,30 +557,80 @@ class S extends R {
   copyGridStyles(e) {
     const t = this.gridElement;
     if (!t) return;
-    const n = getComputedStyle(t), s = [], o = n.getPropertyValue("color-scheme").trim();
-    o && s.push(`color-scheme: ${o}`);
-    for (const i of S.CSS_VARS_TO_COPY) {
-      const u = n.getPropertyValue(i).trim();
-      u && s.push(`${i}: ${u}`);
+    const n = getComputedStyle(t), s = [], u = n.getPropertyValue("color-scheme").trim();
+    u && s.push(`color-scheme: ${u}`);
+    for (const o of _.CSS_VARS_TO_COPY) {
+      const i = n.getPropertyValue(o).trim();
+      i && s.push(`${o}: ${i}`);
     }
     if (s.length > 0) {
-      const i = e.getAttribute("style") || "";
-      e.setAttribute("style", i + s.join("; ") + ";");
+      const o = e.getAttribute("style") || "";
+      e.setAttribute("style", o + s.join("; ") + ";");
     }
   }
   installGlobalHandlers() {
-    !m && typeof document < "u" && typeof g == "string" && g && (m = document.createElement("style"), m.id = "tbw-context-menu-styles", m.textContent = g, document.head.appendChild(m)), h || (h = () => {
+    !m && typeof document < "u" && typeof p == "string" && p && (m = document.createElement("style"), m.id = "tbw-context-menu-styles", m.textContent = p, document.head.appendChild(m)), f || (f = () => {
       document.querySelectorAll(".tbw-context-menu").forEach((t) => t.remove());
-    }, document.addEventListener("click", h)), f || (f = (e) => {
+    }, document.addEventListener("click", f)), g || (g = (e) => {
       e.key === "Escape" && document.querySelectorAll(".tbw-context-menu").forEach((n) => n.remove());
-    }, document.addEventListener("keydown", f));
+    }, document.addEventListener("keydown", g));
   }
   /**
    * Clean up global handlers when the last instance detaches.
    * Uses reference counting to ensure handlers persist while any grid uses the plugin.
    */
   uninstallGlobalHandlers() {
-    w--, !(w > 0) && (h && (document.removeEventListener("click", h), h = null), f && (document.removeEventListener("keydown", f), f = null), m && (m.remove(), m = null));
+    w--, !(w > 0) && (f && (document.removeEventListener("click", f), f = null), g && (document.removeEventListener("keydown", g), g = null), m && (m.remove(), m = null));
+  }
+  /**
+   * Query all plugins for context menu items via the query system.
+   * Each plugin that handles `getContextMenuItems` can return an array of HeaderContextMenuItem.
+   */
+  collectPluginItems(e) {
+    if (!this.grid) return [];
+    const t = this.grid.query(M, e), n = [];
+    for (const s of t)
+      Array.isArray(s) && n.push(...s);
+    return n.sort((s, u) => (s.order ?? 100) - (u.order ?? 100)), this.insertGroupSeparators(n);
+  }
+  /**
+   * Insert separators between groups of items with different order ranges.
+   * Groups are defined by the tens digit (10-19, 20-29, etc.).
+   */
+  insertGroupSeparators(e) {
+    if (e.length <= 1) return e;
+    const t = [];
+    let n = -1;
+    for (const s of e) {
+      if (s.separator) {
+        t.push(s);
+        continue;
+      }
+      const u = Math.floor((s.order ?? 100) / 10);
+      n >= 0 && u !== n && t.push({
+        id: `__sep-${n}-${u}`,
+        label: "",
+        separator: !0,
+        action: () => {
+        }
+      }), n = u, t.push(s);
+    }
+    return t;
+  }
+  /**
+   * Convert plugin-contributed HeaderContextMenuItems to the internal ContextMenuItem format.
+   */
+  convertPluginItems(e) {
+    return e.map((t) => ({
+      id: t.id,
+      name: t.label,
+      icon: t.icon,
+      shortcut: t.shortcut,
+      disabled: t.disabled ?? !1,
+      action: () => t.action(),
+      separator: t.separator,
+      cssClass: t.cssClass
+    }));
   }
   // #endregion
   // #region Hooks
@@ -569,29 +642,29 @@ class S extends R {
     t && t.getAttribute("data-context-menu-bound") !== "true" && (t.setAttribute("data-context-menu-bound", "true"), t.addEventListener("contextmenu", (n) => {
       const s = n;
       s.preventDefault();
-      const o = s.target, i = o.closest("[data-row][data-col]"), u = o.closest(".header-cell");
+      const u = s.target, o = u.closest("[data-row][data-col]"), i = u.closest('[part~="header-cell"]');
       let a;
-      if (i) {
-        const c = parseInt(i.getAttribute("data-row") ?? "-1", 10), b = parseInt(i.getAttribute("data-col") ?? "-1", 10), d = this.columns[b], y = this.rows[c], M = this.syncSelectionOnContextMenu(c);
+      if (o) {
+        const c = parseInt(o.getAttribute("data-row") ?? "-1", 10), h = parseInt(o.getAttribute("data-col") ?? "-1", 10), d = this.visibleColumns[h], E = this.rows[c], A = this.syncSelectionOnContextMenu(c);
         a = {
-          row: y,
+          row: E,
           rowIndex: c,
           column: d,
-          columnIndex: b,
+          columnIndex: h,
           field: d?.field ?? "",
-          value: y?.[d?.field] ?? null,
+          value: E?.[d?.field] ?? null,
           isHeader: !1,
           event: s,
-          selectedRows: M
+          selectedRows: A
         };
-      } else if (u) {
-        const c = parseInt(u.getAttribute("data-col") ?? "-1", 10), b = this.columns[c];
+      } else if (i) {
+        const c = parseInt(i.getAttribute("data-col") ?? "-1", 10), h = this.visibleColumns[c];
         a = {
           row: null,
           rowIndex: -1,
-          column: b,
+          column: h,
           columnIndex: c,
-          field: b?.field ?? "",
+          field: h?.field ?? "",
           value: null,
           isHeader: !0,
           event: s,
@@ -600,15 +673,20 @@ class S extends R {
       } else
         return;
       this.params = a, this.position = { x: s.clientX, y: s.clientY };
-      const l = x(this.config.items ?? p, a);
-      l.length && (this.menuElement && this.menuElement.remove(), this.menuElement = v(
-        l,
+      const b = this.collectPluginItems(a);
+      let r = v(this.config.items ?? x, a);
+      if (b.length > 0) {
+        const c = this.convertPluginItems(b);
+        r.length > 0 && c.length > 0 ? r = [...r, { id: "__plugin-sep", name: "", separator: !0 }, ...c] : r = [...r, ...c];
+      }
+      r = I(r), r.length && (this.menuElement && this.menuElement.remove(), this.menuElement = y(
+        r,
         a,
         (c) => {
           c.action && c.action(a), this.menuElement?.remove(), this.menuElement = null, this.isOpen = !1;
         },
         this.gridIcons.submenuArrow
-      ), document.body.appendChild(this.menuElement), this.copyGridStyles(this.menuElement), C(this.menuElement, s.clientX, s.clientY), this.isOpen = !0, this.emit("context-menu-open", { params: a, items: l }));
+      ), document.body.appendChild(this.menuElement), this.copyGridStyles(this.menuElement), S(this.menuElement, s.clientX, s.clientY), this.isOpen = !0, this.emit("context-menu-open", { params: a, items: r }));
     }));
   }
   // #endregion
@@ -630,15 +708,20 @@ class S extends R {
       isHeader: n.isHeader ?? !1,
       event: n.event ?? new MouseEvent("contextmenu"),
       selectedRows: n.selectedRows ?? []
-    }, o = x(this.config.items ?? p, s);
-    this.menuElement && this.menuElement.remove(), this.menuElement = v(
+    }, u = this.collectPluginItems(s);
+    let o = v(this.config.items ?? x, s);
+    if (u.length > 0) {
+      const i = this.convertPluginItems(u);
+      o.length > 0 && i.length > 0 ? o = [...o, { id: "__plugin-sep", name: "", separator: !0 }, ...i] : o = [...o, ...i];
+    }
+    o = I(o), this.menuElement && this.menuElement.remove(), this.menuElement = y(
       o,
       s,
       (i) => {
         i.action && i.action(s), this.menuElement?.remove(), this.menuElement = null, this.isOpen = !1;
       },
       this.gridIcons.submenuArrow
-    ), document.body.appendChild(this.menuElement), this.copyGridStyles(this.menuElement), C(this.menuElement, e, t), this.isOpen = !0;
+    ), document.body.appendChild(this.menuElement), this.copyGridStyles(this.menuElement), S(this.menuElement, e, t), this.isOpen = !0;
   }
   /**
    * Hide the context menu.
@@ -657,6 +740,6 @@ class S extends R {
   // Styles are injected globally via installGlobalHandlers() since menu renders in document.body
 }
 export {
-  S as ContextMenuPlugin
+  _ as ContextMenuPlugin
 };
 //# sourceMappingURL=index.js.map