tessl/npm-ag-grid-enterprise
Advanced data grid library providing enterprise features for building sophisticated tables and grids in web applications.
- Workspace
- tessl
- Visibility
- Public
- Created
- Last updated
- Describes
To install, run
npx @tessl/cli install tessl/npm-ag-grid-enterprise@34.1.0index.mddocs/
AG Grid Enterprise
AG Grid Enterprise is a comprehensive commercial data grid library that extends ag-grid-community with advanced features for building sophisticated data tables and grids in web applications. It provides enterprise-grade capabilities including advanced filtering, integrated charts, server-side data models, row grouping, pivoting, Excel export, and extensive customization options across React, Angular, Vue, and vanilla JavaScript/TypeScript frameworks.
Package Information
- Package Name: ag-grid-enterprise
- Package Type: npm
- Language: TypeScript
- Installation:
npm install ag-grid-enterprise - License: Commercial (requires license key for production use)
- Dependencies: ag-grid-community (34.1.2)
- Optional Dependencies: ag-charts-community, ag-charts-enterprise (for chart integration)
Core Imports
ES Modules:
import { createGrid, GridApi, ColDef } from "ag-grid-enterprise";Importing specific modules:
import {
AllEnterpriseModule,
LicenseManager,
ExcelExportModule,
ChartsModule
} from "ag-grid-enterprise";CommonJS:
const { createGrid, AllEnterpriseModule } = require("ag-grid-enterprise");License Management
AG Grid Enterprise requires a valid license key for production use:
import { LicenseManager } from "ag-grid-enterprise";
// Set license key before creating grids
LicenseManager.setLicenseKey("your-license-key-here");Basic Usage
import { createGrid, AllEnterpriseModule, ColDef, GridOptions } from "ag-grid-enterprise";
// Column definitions with enterprise features
const columnDefs: ColDef[] = [
{ field: "athlete", filter: "agSetColumnFilter" }, // Enterprise set filter
{ field: "age", filter: "agNumberColumnFilter" },
{ field: "country", rowGroup: true }, // Enterprise row grouping
{ field: "year", pivot: true }, // Enterprise pivoting
{ field: "gold", aggFunc: "sum" } // Enterprise aggregation
];
// Grid options with enterprise features
const gridOptions: GridOptions = {
columnDefs,
rowData: [], // Your data
modules: [AllEnterpriseModule], // Load all enterprise features
// Enterprise features
enableRangeSelection: true,
enableCharts: true,
sideBar: true,
statusBar: {
statusPanels: [
{ statusPanel: "agTotalRowCountComponent", align: "left" },
{ statusPanel: "agAggregationComponent" }
]
}
};
// Create the grid
const gridDiv = document.getElementById("myGrid");
const gridApi = createGrid(gridDiv!, gridOptions);Architecture
AG Grid Enterprise is built on a modular architecture with these key components:
- Core Framework: Extends ag-grid-community with enterprise-specific functionality
- Module System: Granular feature modules that can be imported individually or together
- License Management: Commercial license validation and watermarking system
- Integration Layer: Framework adapters for React, Angular, Vue, and vanilla JS
- Extension Points: Comprehensive API for customization and third-party integrations
Capabilities
Data Processing and Management
Core data handling capabilities including server-side processing, tree data structures, and advanced row models.
// Server-side row model for large datasets
interface IServerSideGetRowsParams {
request: IServerSideGetRowsRequest;
success: (params: IServerSideGetRowsSuccessParams) => void;
fail: () => void;
}
// Tree data structure support
interface TreeDataGridOptions {
treeData: boolean;
getDataPath: (data: any) => string[];
groupDefaultExpanded?: number;
}Filtering and Search
Advanced filtering capabilities including set filters, multi-column filters, and find functionality.
// Set filter with enterprise features
interface ISetFilter {
getModel(): ISetFilterModel | null;
setModel(model: ISetFilterModel | null): void;
selectEverything(): void;
selectNothing(): void;
getMiniFilter(): string;
setMiniFilter(newMiniFilter: string): void;
}
// Multi-column filter
interface IMultiFilter {
getChildFilterInstance(index: number): IFilterComp;
getFilterCount(): number;
}Charts and Visualization
Integrated charting capabilities with ag-charts integration for creating interactive visualizations from grid data.
// Chart creation from selected ranges
interface CreateRangeChartParams {
cellRange: CellRangeParams;
chartType: ChartType;
chartContainer?: HTMLElement;
suppressChartRanges?: boolean;
aggFunc?: string | IAggFunc;
}
// Chart management API
interface ChartRef {
chartId: string;
destroyChart(): void;
}Import and Export
Comprehensive data import/export capabilities including Excel export with multi-sheet support.
// Excel export functions
function exportMultipleSheetsAsExcel(params: ExcelExportMultipleSheetParams): void;
function getMultipleSheetsAsExcel(params: ExcelExportMultipleSheetParams): Blob | undefined;
// Excel export parameters
interface ExcelExportMultipleSheetParams {
data: ExcelSheetData[];
fileName?: string;
author?: string;
}Selection and Interaction
Enhanced selection capabilities including range selection, cell selection, and advanced clipboard operations.
// Range selection API
interface IRangeService {
getCellRanges(): CellRange[] | null;
addCellRange(params: CellRangeParams): void;
clearSelection(): void;
}
// Cell selection parameters
interface CellRangeParams {
rowStartIndex?: number;
rowEndIndex?: number;
columnStart?: string | Column;
columnEnd?: string | Column;
}UI Components and Layout
Enterprise UI components including tool panels, status bar, side bar, and enhanced menus.
// Side bar configuration
interface SideBarDef {
toolPanels?: (ToolPanelDef | string)[];
defaultToolPanel?: string;
hiddenByDefault?: boolean;
position?: "left" | "right";
}
// Tool panel definition
interface ToolPanelDef {
id: string;
labelDefault: string;
labelKey?: string;
iconKey: string;
toolPanel?: string;
toolPanelParams?: any;
}Row Operations
Advanced row manipulation including grouping, pivoting, aggregation, row numbers, and master-detail functionality.
// Row grouping configuration
interface RowGroupingDisplayType {
singleColumn?: boolean;
multipleColumns?: boolean;
groupRows?: boolean;
custom?: boolean;
}
// Pivot configuration
interface PivotColumnGroupDef extends ColGroupDef {
pivotKeys?: string[];
pivotTotalColumnIds?: string[];
}Module System
AG Grid Enterprise uses a modular architecture allowing selective feature inclusion:
// Individual modules
import {
ExcelExportModule,
SetFilterModule,
RangeSelectionModule,
ChartsModule,
TreeDataModule,
ServerSideRowModelModule,
RowNumbersModule
} from "ag-grid-enterprise";
// All enterprise features
import { AllEnterpriseModule } from "ag-grid-enterprise";
// Module registration
const gridOptions: GridOptions = {
modules: [ExcelExportModule, SetFilterModule, RangeSelectionModule]
// or use AllEnterpriseModule for everything
};Types
// License manager interface
interface GridLicenseManager {
setLicenseKey(licenseKey: string): void;
setChartsLicenseManager(chartsLicenseManager: any): void;
getLicenseDetails(licenseKey: string): any;
validateLicense(): void;
isDisplayWatermark(): boolean;
getWatermarkMessage(): string;
}
// Excel export types
interface ExcelSheetData {
sheetName: string;
data: any[];
}
interface ExcelExportMultipleSheetParams {
data: ExcelSheetData[];
fileName?: string;
author?: string;
}
// Chart types
type ChartType =
| "column"
| "groupedColumn"
| "stackedColumn"
| "normalizedColumn"
| "bar"
| "groupedBar"
| "stackedBar"
| "normalizedBar"
| "line"
| "scatter"
| "bubble"
| "pie"
| "doughnut"
| "area"
| "stackedArea"
| "normalizedArea";