Overlay

Module Extensions

HTMLRevoGridElementEventMap (Extended from global)

interface HTMLRevoGridElementEventMap {
  overlaynode: OverlayRegisterEvent;
  overlayclearnode: OverlayUnRegisterEvent
}

Plugin API

OverlayPlugin

OverlayPlugin, a plugin for RevoGrid that manages overlay content within the grid environment. It provides mechanisms to render, position, and update overlay elements dynamically based on grid events and interactions.

Key Features:

• Dynamic Overlay Management: Utilizes virtual nodes (VNode) to manage overlay content, allowing for flexible rendering and updating of overlay elements as grid data or layout changes.
• Position and Size Calculations: Calculates and sets the position and height of overlay elements relative to grid scroll and dimension changes, ensuring overlays are correctly aligned with grid content.
• Event Handling: Listens for and responds to various grid events such as scroll, node updates, and dimension changes, refreshing overlay content and adjusting positions as needed.
• Debounced Refreshing: Integrates debouncing to optimize performance by reducing unnecessary updates during rapid event sequences.

Usage:

• Integrate this plugin into a RevoGrid instance to enable advanced overlay management, enhancing the ability to display additional, context-sensitive information or controls over grid content.

Example

import { OverlayPlugin } from '@revolist/revogrid-pro'

const grid = document.createElement('revo-grid');
grid.plugins = [OverlayPlugin];

The OverlayPlugin is essential for applications that require dynamic and context-aware overlay content within RevoGrid, providing a robust solution for managing additional grid features or information layers.

class OverlayPlugin {
  destroy();
}

---

OverlayRegisterEvent

export type OverlayRegisterEvent =  {
  nodeId: string;
  vnode: ReturnType<typeof h>;
};

---

OverlayUnRegisterEvent

export type OverlayUnRegisterEvent =  {
  nodeIds: string[];
};