Module Extensions
HTMLRevoGridElementEventMap
(Extended from global
)
ts
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
typescript
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.
ts
class OverlayPlugin {
destroy();
}
OverlayRegisterEvent
ts
export type OverlayRegisterEvent = {
nodeId: string;
vnode: ReturnType<typeof h>;
};
OverlayUnRegisterEvent
ts
export type OverlayUnRegisterEvent = {
nodeIds: string[];
};