/** * Custom Widget Tool - 88% token reduction through template caching and widget definition compression * * Features: * - Create and manage custom dashboard widgets * - Support for 8 widget types: chart, metric, table, gauge, status, timeline, heatmap, custom * - Reusable widget templates * - Configuration validation * - Schema generation * - HTML/JSON/React rendering * - Aggressive caching for templates and configurations */ import { CacheEngine } from '../../core/cache-engine.js'; import { TokenCounter } from '../../core/token-counter.js'; import { MetricsCollector } from '../../core/metrics.js'; export interface CustomWidgetOptions { operation: 'create' | 'update' | 'delete' | 'list' | 'render' | 'create-template' | 'validate' | 'get-schema'; widgetId?: string; widgetName?: string; type?: 'chart' | 'metric' | 'table' | 'gauge' | 'status' | 'timeline' | 'heatmap' | 'custom'; config?: WidgetConfig; dataSource?: DataSourceConfig; templateName?: string; templateDescription?: string; templateConfig?: any; renderFormat?: 'html' | 'json' | 'react'; includeData?: boolean; useCache?: boolean; cacheTTL?: number; } export interface WidgetConfig { chartType?: 'line' | 'bar' | 'pie' | 'scatter' | 'area' | 'radar'; xAxis?: AxisConfig; yAxis?: AxisConfig; series?: SeriesConfig[]; metric?: string; threshold?: ThresholdConfig; format?: string; sparkline?: boolean; columns?: ColumnConfig[]; pagination?: PaginationConfig; min?: number; max?: number; ranges?: RangeConfig[]; html?: string; css?: string; javascript?: string; title?: string; description?: string; refreshInterval?: number; height?: number; width?: number; } export interface AxisConfig { field: string; label?: string; format?: string; } export interface SeriesConfig { field: string; label?: string; color?: string; } export interface ThresholdConfig { warning?: number; critical?: number; } export interface ColumnConfig { field: string; label: string; format?: string; sortable?: boolean; } export interface PaginationConfig { pageSize: number; showSizeChanger?: boolean; } export interface RangeConfig { min: number; max: number; color: string; label?: string; } export interface DataSourceConfig { type: 'static' | 'api' | 'query' | 'mcp-tool'; data?: any; url?: string; query?: string; tool?: string; transform?: string; } export interface Widget { id: string; name: string; type: string; config: WidgetConfig; dataSource?: DataSourceConfig; createdAt: number; updatedAt: number; version: number; } export interface WidgetTemplate { name: string; description: string; type: string; config: any; createdAt: number; version: number; } export interface CustomWidgetResult { success: boolean; data?: { widget?: Widget; widgets?: Widget[]; rendered?: string | any; template?: WidgetTemplate; schema?: any; validation?: ValidationResult; }; metadata: { tokensUsed?: number; tokensSaved?: number; cacheHit: boolean; widgetCount?: number; }; error?: string; } export interface ValidationResult { valid: boolean; errors?: string[]; } /** * Custom Widget Tool - Create and manage dashboard widgets */ export declare class CustomWidget { private cache; private tokenCounter; private metricsCollector; private widgets; private templates; constructor(cache: CacheEngine, tokenCounter: TokenCounter, metricsCollector: MetricsCollector); /** * Main entry point for all widget operations */ run(options: CustomWidgetOptions): Promise; /** * Create a new widget */ private createWidget; /** * Update an existing widget */ private updateWidget; /** * Delete a widget */ private deleteWidget; /** * List all widgets */ private listWidgets; /** * Render a widget to specified format */ private renderWidget; /** * Create a reusable widget template */ private createTemplate; /** * Validate widget configuration */ private validateWidget; /** * Get widget configuration schema */ private getSchema; /** * Render widget to HTML */ private renderToHTML; /** * Render chart widget HTML */ private renderChartHTML; /** * Render metric widget HTML */ private renderMetricHTML; /** * Render table widget HTML */ private renderTableHTML; /** * Render gauge widget HTML */ private renderGaugeHTML; /** * Render status widget HTML */ private renderStatusHTML; /** * Render timeline widget HTML */ private renderTimelineHTML; /** * Render heatmap widget HTML */ private renderHeatmapHTML; /** * Render custom widget HTML */ private renderCustomHTML; /** * Render widget to JSON */ private renderToJSON; /** * Render widget to React component */ private renderToReact; /** * Validation methods */ private validateChartWidget; private validateMetricWidget; private validateTableWidget; private validateGaugeWidget; private validateStatusWidget; private validateTimelineWidget; private validateHeatmapWidget; private validateCustomWidget; /** * Get schema for all widget types */ private getAllSchemas; /** * Get schema for specific widget type */ private getSchemaForType; /** * Helper methods */ private generateCacheKey; private isReadOnlyOperation; private generateWidgetId; private invalidateWidgetCache; private invalidateListCache; private estimateCompressedSize; private getThresholdClass; private toPascalCase; } export declare function getCustomWidget(cache: CacheEngine, tokenCounter: TokenCounter, metricsCollector: MetricsCollector): CustomWidget; export declare const CUSTOM_WIDGET_TOOL_DEFINITION: { name: string; description: string; inputSchema: { type: string; properties: { operation: { type: string; enum: string[]; description: string; }; widgetId: { type: string; description: string; }; widgetName: { type: string; description: string; }; type: { type: string; enum: string[]; description: string; }; config: { type: string; description: string; properties: { chartType: { type: string; enum: string[]; }; xAxis: { type: string; properties: { field: { type: string; }; label: { type: string; }; format: { type: string; }; }; required: string[]; }; yAxis: { type: string; properties: { field: { type: string; }; label: { type: string; }; format: { type: string; }; }; required: string[]; }; series: { type: string; items: { type: string; properties: { field: { type: string; }; label: { type: string; }; color: { type: string; }; }; required: string[]; }; }; metric: { type: string; }; threshold: { type: string; properties: { warning: { type: string; }; critical: { type: string; }; }; }; format: { type: string; }; sparkline: { type: string; }; columns: { type: string; items: { type: string; properties: { field: { type: string; }; label: { type: string; }; format: { type: string; }; sortable: { type: string; }; }; required: string[]; }; }; pagination: { type: string; properties: { pageSize: { type: string; }; showSizeChanger: { type: string; }; }; required: string[]; }; min: { type: string; }; max: { type: string; }; ranges: { type: string; items: { type: string; properties: { min: { type: string; }; max: { type: string; }; color: { type: string; }; label: { type: string; }; }; required: string[]; }; }; html: { type: string; }; css: { type: string; }; javascript: { type: string; }; title: { type: string; }; description: { type: string; }; refreshInterval: { type: string; }; height: { type: string; }; width: { type: string; }; }; }; dataSource: { type: string; description: string; properties: { type: { type: string; enum: string[]; }; data: { description: string; }; url: { type: string; }; query: { type: string; }; tool: { type: string; }; transform: { type: string; description: string; }; }; required: string[]; }; templateName: { type: string; description: string; }; templateDescription: { type: string; description: string; }; templateConfig: { type: string; description: string; }; renderFormat: { type: string; enum: string[]; description: string; default: string; }; includeData: { type: string; description: string; default: boolean; }; useCache: { type: string; description: string; default: boolean; }; cacheTTL: { type: string; description: string; }; }; required: string[]; }; }; //# sourceMappingURL=custom-widget.d.ts.map