@toolbox-web/grid 0.2.8 → 0.3.0

package/lib/plugins/column-virtualization/types.d.ts

@@ -0,0 +1,41 @@
+/**
+ * Column Virtualization Plugin Types
+ *
+ * Type definitions for horizontal column virtualization feature.
+ */
+/** Configuration options for the column virtualization plugin */
+export interface ColumnVirtualizationConfig {
+    /** Auto-enable when column count exceeds threshold (default: true) */
+    autoEnable?: boolean;
+    /** Column count threshold for auto-enabling (default: 30) */
+    threshold?: number;
+    /** Extra columns to render on each side for smooth scrolling (default: 3) */
+    overscan?: number;
+}
+/** Internal state managed by the column virtualization plugin */
+export interface ColumnVirtualizationState {
+    /** Whether virtualization is currently active */
+    isVirtualized: boolean;
+    /** Index of first visible column */
+    startCol: number;
+    /** Index of last visible column */
+    endCol: number;
+    /** Current horizontal scroll position */
+    scrollLeft: number;
+    /** Total width of all columns */
+    totalWidth: number;
+    /** Array of individual column widths (px) */
+    columnWidths: number[];
+    /** Array of column left offsets (px) */
+    columnOffsets: number[];
+}
+/** Viewport information for visible columns */
+export interface ColumnVirtualizationViewport {
+    /** Index of first visible column */
+    startCol: number;
+    /** Index of last visible column */
+    endCol: number;
+    /** Array of visible column indices */
+    visibleColumns: number[];
+}
+//# sourceMappingURL=types.d.ts.map

package/lib/plugins/column-virtualization/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../../libs/grid/src/lib/plugins/column-virtualization/types.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,iEAAiE;AACjE,MAAM,WAAW,0BAA0B;IACzC,sEAAsE;IACtE,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,6DAA6D;IAC7D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,6EAA6E;IAC7E,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,iEAAiE;AACjE,MAAM,WAAW,yBAAyB;IACxC,iDAAiD;IACjD,aAAa,EAAE,OAAO,CAAC;IACvB,oCAAoC;IACpC,QAAQ,EAAE,MAAM,CAAC;IACjB,mCAAmC;IACnC,MAAM,EAAE,MAAM,CAAC;IACf,yCAAyC;IACzC,UAAU,EAAE,MAAM,CAAC;IACnB,iCAAiC;IACjC,UAAU,EAAE,MAAM,CAAC;IACnB,6CAA6C;IAC7C,YAAY,EAAE,MAAM,EAAE,CAAC;IACvB,wCAAwC;IACxC,aAAa,EAAE,MAAM,EAAE,CAAC;CACzB;AAED,+CAA+C;AAC/C,MAAM,WAAW,4BAA4B;IAC3C,oCAAoC;IACpC,QAAQ,EAAE,MAAM,CAAC;IACjB,mCAAmC;IACnC,MAAM,EAAE,MAAM,CAAC;IACf,sCAAsC;IACtC,cAAc,EAAE,MAAM,EAAE,CAAC;CAC1B"}

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

@@ -0,0 +1,52 @@
+import { BaseGridPlugin } from '../../core/plugin/base-plugin';
+import { ContextMenuConfig, ContextMenuParams } from './types';
+/**
+ * Context Menu Plugin for tbw-grid
+ *
+ * @example
+ * ```ts
+ * new ContextMenuPlugin({
+ *   enabled: true,
+ *   items: [
+ *     { id: 'edit', name: 'Edit', action: (params) => console.log('Edit', params) },
+ *     { separator: true, id: 'sep', name: '' },
+ *     { id: 'delete', name: 'Delete', action: (params) => console.log('Delete', params) },
+ *   ],
+ * })
+ * ```
+ */
+export declare class ContextMenuPlugin extends BaseGridPlugin<ContextMenuConfig> {
+    readonly name = "contextMenu";
+    readonly version = "1.0.0";
+    protected get defaultConfig(): Partial<ContextMenuConfig>;
+    private isOpen;
+    private position;
+    private params;
+    private menuElement;
+    attach(grid: import('../../core/plugin/base-plugin').GridElement): void;
+    detach(): void;
+    private installGlobalHandlers;
+    /**
+     * Clean up global handlers when the last instance detaches.
+     * Uses reference counting to ensure handlers persist while any grid uses the plugin.
+     */
+    private uninstallGlobalHandlers;
+    afterRender(): void;
+    /**
+     * Programmatically show the context menu at the specified position.
+     * @param x - X coordinate
+     * @param y - Y coordinate
+     * @param params - Partial context menu parameters
+     */
+    showMenu(x: number, y: number, params: Partial<ContextMenuParams>): void;
+    /**
+     * Hide the context menu.
+     */
+    hideMenu(): void;
+    /**
+     * Check if the context menu is currently open.
+     * @returns Whether the menu is open
+     */
+    isMenuOpen(): boolean;
+}
+//# sourceMappingURL=ContextMenuPlugin.d.ts.map

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

@@ -0,0 +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;;;;;;;;;;;;;;GAcG;AACH,qBAAa,iBAAkB,SAAQ,cAAc,CAAC,iBAAiB,CAAC;IACtE,QAAQ,CAAC,IAAI,iBAAiB;IAC9B,SAAkB,OAAO,WAAW;IAEpC,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;IAKtC,MAAM,CAAC,IAAI,EAAE,OAAO,+BAA+B,EAAE,WAAW,GAAG,IAAI;IAMvE,MAAM,IAAI,IAAI;IAavB,OAAO,CAAC,qBAAqB;IAqC7B;;;OAGG;IACH,OAAO,CAAC,uBAAuB;IAsBtB,WAAW,IAAI,IAAI;IA0F5B;;;;;OAKG;IACH,QAAQ,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,CAAC,iBAAiB,CAAC,GAAG,IAAI;IAmCxE;;OAEG;IACH,QAAQ,IAAI,IAAI;IAQhB;;;OAGG;IACH,UAAU,IAAI,OAAO;CAMtB"}

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

@@ -0,0 +1,7 @@
+/**
+ * Context Menu Plugin Entry Point
+ * Re-exports plugin class and types for tree-shakeable imports.
+ */
+export { ContextMenuPlugin } from './ContextMenuPlugin';
+export type { ContextMenuItem, ContextMenuConfig, ContextMenuParams } from './types';
+//# sourceMappingURL=index.d.ts.map

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

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

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

@@ -1,4 +1,4 @@
-const y = {
+const C = {
   expand: "▶",
   collapse: "▼",
   sortAsc: "▲",
@@ -8,7 +8,7 @@ const y = {
   dragHandle: "⋮⋮",
   toolPanel: "☰"
 };
-class C {
+class I {
   /** Plugin version - override in subclass if needed */
   version = "1.0.0";
   /** CSS styles to inject into the grid's shadow DOM */
@@ -133,7 +133,7 @@ class C {
    */
   get gridIcons() {
     const e = this.grid?.gridConfig?.icons ?? {};
-    return { ...y, ...e };
+    return { ...C, ...e };
   }
   /**
    * Resolve an icon value to string or HTMLElement.
@@ -164,14 +164,14 @@ class C {
   }
   // #endregion
 }
-const I = ".tbw-context-menu{position:fixed;background:light-dark(#f5f5f5,#2a2a2a);color:light-dark(#222,#eee);border:1px solid light-dark(#d0d0d4,#454545);border-radius:4px;box-shadow:0 2px 10px #00000026;min-width:160px;padding:4px 0;z-index:10000;font-size:13px;font-family:system-ui,sans-serif}.tbw-context-menu-item{display:flex;align-items:center;padding:6px 12px;cursor:pointer;gap:8px}.tbw-context-menu-item:hover:not(.disabled){background:light-dark(#e8e8e8,#3a3a3a)}.tbw-context-menu-item.disabled{opacity:.5;cursor:default}.tbw-context-menu-item.danger{color:light-dark(#c00,#f66)}.tbw-context-menu-icon{width:16px;text-align:center}.tbw-context-menu-label{flex:1}.tbw-context-menu-shortcut{color:light-dark(#888,#888);font-size:11px}.tbw-context-menu-arrow{font-size:10px;color:light-dark(#888,#888)}.tbw-context-menu-separator{height:1px;background:light-dark(#d0d0d4,#454545);margin:4px 0}";
-function x(s, e) {
+const g = ".tbw-context-menu{position:fixed;background:light-dark(#f5f5f5,#2a2a2a);color:light-dark(#222,#eee);border:1px solid light-dark(#d0d0d4,#454545);border-radius:4px;box-shadow:0 2px 10px #00000026;min-width:160px;padding:4px 0;z-index:10000;font-size:13px;font-family:system-ui,sans-serif}.tbw-context-menu-item{display:flex;align-items:center;padding:6px 12px;cursor:pointer;gap:8px}.tbw-context-menu-item:hover:not(.disabled){background:light-dark(#e8e8e8,#3a3a3a)}.tbw-context-menu-item.disabled{opacity:.5;cursor:default}.tbw-context-menu-item.danger{color:light-dark(#c00,#f66)}.tbw-context-menu-icon{width:16px;text-align:center}.tbw-context-menu-label{flex:1}.tbw-context-menu-shortcut{color:light-dark(#888,#888);font-size:11px}.tbw-context-menu-arrow{font-size:10px;color:light-dark(#888,#888)}.tbw-context-menu-separator{height:1px;background:light-dark(#d0d0d4,#454545);margin:4px 0}";
+function w(s, e) {
   return (typeof s == "function" ? s(e) : s).filter((i) => !(i.hidden === !0 || typeof i.hidden == "function" && i.hidden(e)));
 }
 function M(s, e) {
   return s.disabled === !0 ? !0 : typeof s.disabled == "function" ? s.disabled(e) : !1;
 }
-function w(s, e, n, i = y.submenuArrow) {
+function v(s, e, n, i = C.submenuArrow) {
   const r = document.createElement("div");
   r.className = "tbw-context-menu", r.setAttribute("role", "menu");
   for (const o of s) {
@@ -196,7 +196,7 @@ function w(s, e, n, i = y.submenuArrow) {
       const l = document.createElement("span");
       l.className = "tbw-context-menu-arrow", typeof i == "string" ? l.innerHTML = i : i instanceof HTMLElement && l.appendChild(i.cloneNode(!0)), t.appendChild(l), t.addEventListener("mouseenter", () => {
         if (t.querySelector(".tbw-context-menu") || !o.subMenu) return;
-        const h = x(o.subMenu, e), a = w(h, e, n, i);
+        const h = w(o.subMenu, e), a = v(h, e, n, i);
         a.classList.add("tbw-context-submenu"), a.style.position = "absolute", a.style.left = "100%", a.style.top = "0", t.style.position = "relative", t.appendChild(a);
       }), t.addEventListener("mouseleave", () => {
         const u = t.querySelector(".tbw-context-menu");
@@ -209,14 +209,14 @@ function w(s, e, n, i = y.submenuArrow) {
   }
   return r;
 }
-function E(s, e, n) {
+function y(s, e, n) {
   s.style.position = "fixed", s.style.left = `${e}px`, s.style.top = `${n}px`, s.style.visibility = "hidden", s.style.zIndex = "10000";
   const i = s.getBoundingClientRect(), r = window.innerWidth, o = window.innerHeight;
   let t = e, c = n;
   e + i.width > r && (t = e - i.width), n + i.height > o && (c = n - i.height), t = Math.max(0, t), c = Math.max(0, c), s.style.left = `${t}px`, s.style.top = `${c}px`, s.style.visibility = "visible";
 }
-let f = null, p = null, m = null, g = 0;
-const b = [
+let f = null, p = null, m = null, b = 0;
+const x = [
   {
     id: "copy",
     name: "Copy",
@@ -234,12 +234,12 @@ const b = [
     }
   }
 ];
-class H extends C {
+class H extends I {
   name = "contextMenu";
   version = "1.0.0";
   get defaultConfig() {
     return {
-      items: b
+      items: x
     };
   }
   // #region Internal State
@@ -250,7 +250,7 @@ class H extends C {
   // #endregion
   // #region Lifecycle
   attach(e) {
-    super.attach(e), this.installGlobalHandlers(), g++;
+    super.attach(e), this.installGlobalHandlers(), b++;
   }
   detach() {
     this.menuElement && (this.menuElement.remove(), this.menuElement = null), this.isOpen = !1, this.params = null, this.uninstallGlobalHandlers();
@@ -258,7 +258,7 @@ class H extends C {
   // #endregion
   // #region Private Methods
   installGlobalHandlers() {
-    !m && typeof document < "u" && (m = document.createElement("style"), m.id = "tbw-context-menu-styles", m.textContent = I, document.head.appendChild(m)), f || (f = () => {
+    !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)), f || (f = () => {
       document.querySelectorAll(".tbw-context-menu").forEach((n) => n.remove());
     }, document.addEventListener("click", f)), p || (p = (e) => {
       e.key === "Escape" && document.querySelectorAll(".tbw-context-menu").forEach((i) => i.remove());
@@ -269,7 +269,7 @@ class H extends C {
    * Uses reference counting to ensure handlers persist while any grid uses the plugin.
    */
   uninstallGlobalHandlers() {
-    g--, !(g > 0) && (f && (document.removeEventListener("click", f), f = null), p && (document.removeEventListener("keydown", p), p = null), m && (m.remove(), m = null));
+    b--, !(b > 0) && (f && (document.removeEventListener("click", f), f = null), p && (document.removeEventListener("keydown", p), p = null), m && (m.remove(), m = null));
   }
   // #endregion
   // #region Hooks
@@ -283,14 +283,14 @@ class H extends C {
       const o = r.target, t = o.closest("[data-row][data-col]"), c = o.closest(".header-cell");
       let d;
       if (t) {
-        const u = parseInt(t.getAttribute("data-row") ?? "-1", 10), h = parseInt(t.getAttribute("data-col") ?? "-1", 10), a = this.columns[h], v = this.rows[u];
+        const u = parseInt(t.getAttribute("data-row") ?? "-1", 10), h = parseInt(t.getAttribute("data-col") ?? "-1", 10), a = this.columns[h], E = this.rows[u];
         d = {
-          row: v,
+          row: E,
           rowIndex: u,
           column: a,
           columnIndex: h,
           field: a?.field ?? "",
-          value: v?.[a?.field] ?? null,
+          value: E?.[a?.field] ?? null,
           isHeader: !1,
           event: r
         };
@@ -309,15 +309,15 @@ class H extends C {
       } else
         return;
       this.params = d, this.position = { x: r.clientX, y: r.clientY };
-      const l = x(this.config.items ?? b, d);
-      l.length && (this.menuElement && this.menuElement.remove(), this.menuElement = w(
+      const l = w(this.config.items ?? x, d);
+      l.length && (this.menuElement && this.menuElement.remove(), this.menuElement = v(
         l,
         d,
         (u) => {
           u.action && u.action(d), this.menuElement?.remove(), this.menuElement = null, this.isOpen = !1;
         },
         this.gridIcons.submenuArrow
-      ), document.body.appendChild(this.menuElement), E(this.menuElement, r.clientX, r.clientY), this.isOpen = !0, this.emit("context-menu-open", { params: d, items: l }));
+      ), document.body.appendChild(this.menuElement), y(this.menuElement, r.clientX, r.clientY), this.isOpen = !0, this.emit("context-menu-open", { params: d, items: l }));
     }));
   }
   // #endregion
@@ -338,15 +338,15 @@ class H extends C {
       value: i.value ?? null,
       isHeader: i.isHeader ?? !1,
       event: i.event ?? new MouseEvent("contextmenu")
-    }, o = x(this.config.items ?? b, r);
-    this.menuElement && this.menuElement.remove(), this.menuElement = w(
+    }, o = w(this.config.items ?? x, r);
+    this.menuElement && this.menuElement.remove(), this.menuElement = v(
       o,
       r,
       (t) => {
         t.action && t.action(r), this.menuElement?.remove(), this.menuElement = null, this.isOpen = !1;
       },
       this.gridIcons.submenuArrow
-    ), document.body.appendChild(this.menuElement), E(this.menuElement, e, n), this.isOpen = !0;
+    ), document.body.appendChild(this.menuElement), y(this.menuElement, e, n), this.isOpen = !0;
   }
   /**
    * Hide the context menu.