ai-progress-controls 0.1.0

package/dist/index.d.ts

@@ -0,0 +1,2212 @@
+/**
+ * Base class for all AI Progress Controls
+ * Provides common functionality for Web Components including:
+ * - Theme management
+ * - Event handling
+ * - Accessibility features
+ * - Debug logging
+ *
+ * @example
+ * ```typescript
+ * class MyControl extends AIControl {
+ *   constructor() {
+ *     super();
+ *     this.attachShadow({ mode: 'open' });
+ *   }
+ *
+ *   protected render() {
+ *     // Your rendering logic
+ *   }
+ * }
+ * ```
+ */
+export declare abstract class AIControl extends HTMLElement {
+    protected config: AIControlConfig;
+    protected _disabled: boolean;
+    protected startTime: number;
+    constructor(config?: AIControlConfig);
+    /**
+     * Called when the element is connected to the DOM
+     */
+    connectedCallback(): void;
+    /**
+     * Called when the element is disconnected from the DOM
+     */
+    disconnectedCallback(): void;
+    /**
+     * Called when an observed attribute changes
+     */
+    attributeChangedCallback(name: string, oldValue: string, newValue: string): void;
+    /**
+     * Apply theme using CSS custom properties
+     */
+    protected applyTheme(theme?: ThemeConfig): void;
+    /**
+     * Set up accessibility features (ARIA attributes, keyboard navigation)
+     */
+    protected setupAccessibility(): void;
+    /**
+     * Emit a custom event
+     */
+    protected emit<T>(eventName: string, detail?: T): void;
+    /**
+     * Log debug messages (only if debug mode is enabled)
+     */
+    protected log(message: string, ...args: unknown[]): void;
+    /**
+     * Log errors (always logged)
+     */
+    protected logError(message: string, error?: Error): void;
+    /**
+     * Start timing an operation
+     */
+    protected startTimer(): void;
+    /**
+     * Get elapsed time since timer started
+     */
+    protected getElapsedTime(): number;
+    /**
+     * Format numbers for display (e.g., 1234 -> "1.2K")
+     */
+    protected formatNumber(num: number): string;
+    /**
+     * Format duration in milliseconds to human-readable string
+     */
+    protected formatDuration(ms: number): string;
+    /**
+     * Calculate percentage safely
+     */
+    protected calculatePercentage(current: number, total: number): number;
+    /**
+     * Get/Set disabled state
+     */
+    get disabled(): boolean;
+    set disabled(value: boolean);
+    /**
+     * Abstract method to render the component
+     * Must be implemented by subclasses
+     */
+    protected abstract render(): void;
+    /**
+     * Get the default ARIA role for this component
+     * Can be overridden by subclasses
+     */
+    protected getDefaultRole(): string;
+    /**
+     * Handle attribute changes
+     * Can be overridden by subclasses to handle specific attributes
+     */
+    protected handleAttributeChange(_name: string, _oldValue: string, _newValue: string): void;
+    /**
+     * Cleanup resources when component is destroyed
+     * Can be overridden by subclasses
+     */
+    protected cleanup(): void;
+}
+
+/**
+ * Base configuration for all AI Progress Controls
+ */
+export declare interface AIControlConfig {
+    /** Enable/disable console logging for debugging */
+    debug?: boolean;
+    /** Custom CSS class names to apply */
+    className?: string;
+    /** Whether the control is disabled */
+    disabled?: boolean;
+    /** ARIA label for accessibility */
+    ariaLabel?: string;
+    /** Enable automatic cursor feedback based on state (default: true) */
+    cursorFeedback?: boolean;
+    /** Size variant: compact, default, or large */
+    size?: SizeVariant;
+    /** Visual style variant: default, minimal, gradient, or glassmorphic */
+    variant?: VisualVariant;
+    /** Animation effect: none, striped, pulse, or glow */
+    animation?: AnimationEffect_2;
+}
+
+/**
+ * Animation effect for progress indicators
+ */
+declare type AnimationEffect_2 = 'none' | 'striped' | 'pulse' | 'glow';
+export { AnimationEffect_2 as AnimationEffect }
+
+/**
+ * Event detail for batch cancel
+ */
+export declare interface BatchCancelEvent {
+    completedCount: number;
+    failedCount: number;
+    cancelledCount: number;
+    reason?: string;
+}
+
+/**
+ * Event detail for batch complete
+ */
+export declare interface BatchCompleteEvent {
+    totalItems: number;
+    successCount: number;
+    failedCount: number;
+    duration: number;
+    averageRate: number;
+    startTime: number;
+    endTime: number;
+}
+
+/**
+ * Individual batch item
+ */
+export declare interface BatchItem {
+    id: string;
+    label?: string;
+    status: BatchItemStatus;
+    progress?: number;
+    error?: string;
+    result?: any;
+    startTime?: number;
+    endTime?: number;
+}
+
+/**
+ * Event detail for batch item complete
+ */
+export declare interface BatchItemCompleteEvent {
+    item: BatchItem;
+    totalCompleted: number;
+    remainingItems: number;
+}
+
+/**
+ * Event detail for batch item failed
+ */
+export declare interface BatchItemFailedEvent {
+    item: BatchItem;
+    error: string;
+    totalFailed: number;
+}
+
+/**
+ * Status of a batch item
+ */
+export declare type BatchItemStatus = 'pending' | 'processing' | 'completed' | 'failed' | 'cancelled';
+
+/**
+ * Event detail for batch item update
+ */
+export declare interface BatchItemUpdateEvent extends BatchItem {
+    totalCompleted: number;
+    totalFailed: number;
+    overallProgress: number;
+}
+
+/**
+ * BatchProgress Component
+ *
+ * Displays progress for batch operations processing multiple items.
+ * Perfect for processing multiple AI requests, documents, or images in parallel.
+ *
+ * @example
+ * ```typescript
+ * // Create batch progress
+ * const batch = new BatchProgress({
+ *   totalItems: 50,
+ *   concurrency: 5,
+ *   showItems: true,
+ *   showStats: true
+ * });
+ *
+ * document.body.appendChild(batch);
+ *
+ * // Start batch
+ * batch.start();
+ *
+ * // Add items
+ * for (let i = 0; i < 50; i++) {
+ *   batch.addItem(`item-${i}`, `Process item ${i}`);
+ * }
+ *
+ * // Update item progress
+ * batch.updateItem({
+ *   itemId: 'item-0',
+ *   status: 'processing',
+ *   progress: 50
+ * });
+ *
+ * // Complete item
+ * batch.completeItem('item-0', { result: 'success' });
+ *
+ * // Listen to events
+ * batch.addEventListener('batchcomplete', (e) => {
+ *   console.log(`Completed ${e.detail.successCount}/${e.detail.totalItems}`);
+ * });
+ * ```
+ *
+ * @fires batchstart - Fired when batch processing starts
+ * @fires itemupdate - Fired when batch item is updated
+ * @fires itemcomplete - Fired when batch item completes
+ * @fires itemfailed - Fired when batch item fails
+ * @fires batchcomplete - Fired when all items are processed
+ * @fires batchcancel - Fired when batch is cancelled
+ */
+export declare class BatchProgress extends AIControl {
+    protected config: Required<BatchProgressConfig>;
+    private readonly state;
+    private updateThrottleTimer;
+    static get observedAttributes(): string[];
+    constructor(config?: BatchProgressConfig);
+    connectedCallback(): void;
+    attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
+    /**
+     * Update cursor based on component state
+     */
+    private updateCursor;
+    /**
+     * Start batch processing
+     */
+    start(message?: string): void;
+    /**
+     * Add item to batch
+     */
+    addItem(itemId: string, label?: string): void;
+    /**
+     * Update batch item
+     */
+    updateItem(update: BatchProgressUpdate): void;
+    /**
+     * Complete a batch item
+     */
+    completeItem(itemId: string, result?: any): void;
+    /**
+     * Fail a batch item
+     */
+    failItem(itemId: string, error: string): void;
+    /**
+     * Complete batch processing
+     */
+    complete(): void;
+    /**
+     * Cancel batch processing
+     */
+    cancel(reason?: string): void;
+    /**
+     * Reset batch to initial state
+     */
+    reset(): void;
+    /**
+     * Get overall progress percentage
+     */
+    getOverallProgress(): number;
+    /**
+     * Get processing rate (items/second)
+     */
+    getRate(): number;
+    /**
+     * Get batch statistics
+     */
+    getStats(): {
+        total: number;
+        completed: number;
+        success: number;
+        failed: number;
+        pending: number;
+        progress: number;
+        rate: number;
+        duration: number;
+    };
+    /**
+     * Throttled render to avoid excessive updates
+     */
+    private throttledRender;
+    /**
+     * Calculate duration based on state
+     */
+    private _calculateDuration;
+    /**
+     * Get rate display HTML
+     */
+    private _getRateDisplay;
+    /**
+     * Sync config attributes to host element
+     */
+    private _syncAttributes;
+    /**
+     * Get status badge CSS class
+     */
+    private _getStatusBadgeClass;
+    /**
+     * Get status display text
+     */
+    private _getStatusText;
+    /**
+     * Get stats section HTML
+     */
+    private _getStatsHtml;
+    /**
+     * Get progress bar HTML
+     */
+    private _getProgressBarHtml;
+    /**
+     * Get controls HTML
+     */
+    private _getControlsHtml;
+    /**
+     * Attach event listeners to rendered elements
+     */
+    private _attachEventListeners;
+    /**
+     * Render the component
+     */
+    protected render(): void;
+    /**
+     * Render batch items
+     */
+    private renderItems;
+    /**
+     * Get status icon
+     */
+    private getStatusIcon;
+    /**
+     * Get/set disabled state
+     */
+    get disabled(): boolean;
+    set disabled(value: boolean);
+}
+
+/**
+ * Configuration options for BatchProgress
+ */
+export declare interface BatchProgressConfig {
+    /** Total number of items in batch */
+    totalItems?: number;
+    /** Maximum concurrent operations */
+    concurrency?: number;
+    /** Show individual item progress */
+    showItems?: boolean;
+    /** Maximum items to display */
+    maxDisplayItems?: number;
+    /** Show overall progress bar */
+    showProgressBar?: boolean;
+    /** Show statistics (success/fail counts) */
+    showStats?: boolean;
+    /** Show elapsed time */
+    showTime?: boolean;
+    /** Show processing rate (items/sec) */
+    showRate?: boolean;
+    /** Allow cancellation */
+    allowCancel?: boolean;
+    /** Cancel button label */
+    cancelLabel?: string;
+    /** Automatically collapse completed items */
+    collapseCompleted?: boolean;
+    /** Status message */
+    message?: string;
+    /** Enable automatic cursor state changes based on component state */
+    cursorFeedback?: boolean;
+    /** Component size variant */
+    size?: 'compact' | 'default' | 'large';
+    /** Visual style variant */
+    variant?: 'default' | 'minimal' | 'gradient' | 'glassmorphic';
+    /** Animation style */
+    animation?: 'none' | 'striped' | 'pulse' | 'glow';
+    /** Disabled state */
+    disabled?: boolean;
+    /** Enable debug logging */
+    debug?: boolean;
+    /** Additional CSS class */
+    className?: string;
+    /** ARIA label for accessibility */
+    ariaLabel?: string;
+}
+
+/**
+ * Internal state of the BatchProgress
+ */
+export declare interface BatchProgressState {
+    status: 'idle' | 'processing' | 'completed' | 'paused' | 'cancelled';
+    items: Map<string, BatchItem>;
+    totalItems: number;
+    completedCount: number;
+    failedCount: number;
+    successCount: number;
+    currentConcurrency: number;
+    startTime: number | null;
+    endTime: number | null;
+    message: string;
+}
+
+/**
+ * Update parameters for batch progress
+ */
+export declare interface BatchProgressUpdate {
+    itemId: string;
+    status?: BatchItemStatus;
+    progress?: number;
+    error?: string;
+    result?: any;
+    label?: string;
+}
+
+/**
+ * Event detail for batch start
+ */
+export declare interface BatchStartEvent {
+    totalItems: number;
+    startTime: number;
+}
+
+/**
+ * Calculate estimated time remaining
+ */
+export declare function calculateETA(current: number, total: number, startTime: number): number;
+
+/**
+ * Clamp a number between min and max
+ */
+export declare function clamp(value: number, min: number, max: number): number;
+
+/**
+ * Event detail for completion
+ */
+export declare interface CompleteEvent {
+    duration: number;
+    timestamp: number;
+    metadata?: Record<string, unknown>;
+}
+
+/**
+ * Event detail when configuration is exported
+ */
+export declare interface ConfigExportEvent {
+    /** Exported configuration */
+    config: ExportedConfig;
+    /** Export format */
+    format: 'json' | 'url';
+    /** Timestamp */
+    timestamp: number;
+}
+
+/**
+ * Event detail when configuration is imported
+ */
+export declare interface ConfigImportEvent {
+    /** Imported configuration */
+    config: ExportedConfig;
+    /** Previous values */
+    previousValues: Record<string, number>;
+    /** Timestamp */
+    timestamp: number;
+}
+
+/**
+ * Create a style element with CSS
+ */
+export declare function createStyle(css: string): HTMLStyleElement;
+
+/**
+ * Utility functions for AI Progress Controls
+ */
+/**
+ * Debounce function calls
+ */
+export declare function debounce<T extends (...args: any[]) => any>(func: T, wait: number): (...args: Parameters<T>) => void;
+
+/**
+ * Easing function for smooth animations
+ */
+export declare function easeOutCubic(t: number): number;
+
+/**
+ * Event detail for errors
+ */
+declare interface ErrorEvent_2 {
+    message: string;
+    code?: string;
+    timestamp: number;
+}
+export { ErrorEvent_2 as ErrorEvent }
+
+/**
+ * Exported configuration format
+ */
+export declare interface ExportedConfig {
+    /** Format version */
+    version: string;
+    /** Preset name if applicable */
+    preset?: string;
+    /** Parameter values */
+    parameters: Record<string, number>;
+    /** Metadata */
+    metadata?: {
+        /** Creation timestamp */
+        created: string;
+        /** Configuration name */
+        name?: string;
+        /** Description */
+        description?: string;
+    };
+}
+
+/**
+ * Format bytes to human-readable string
+ */
+export declare function formatBytes(bytes: number, decimals?: number): string;
+
+/**
+ * Format currency (USD)
+ */
+export declare function formatCurrency(amount: number, decimals?: number): string;
+
+/**
+ * Format seconds to human-readable time string
+ */
+export declare function formatTime(seconds: number): string;
+
+/**
+ * Generate a unique ID
+ */
+export declare function generateId(prefix?: string): string;
+
+/**
+ * Check if an element is in viewport
+ */
+export declare function isInViewport(element: HTMLElement): boolean;
+
+/**
+ * Linear interpolation
+ */
+export declare function lerp(start: number, end: number, t: number): number;
+
+/**
+ * Event data for completion
+ */
+export declare interface LoadCompleteEvent {
+    duration: number;
+    memoryUsage?: number;
+    stages: Record<ModelStage, StageState>;
+}
+
+/**
+ * Event data for error
+ */
+export declare interface LoadErrorEvent {
+    stage: ModelStage;
+    message: string;
+    timestamp: number;
+}
+
+/**
+ * Event detail for manual retry trigger
+ */
+export declare interface ManualRetryEvent {
+    attempt: number;
+    timestamp: number;
+}
+
+/**
+ * ModelLoader Component
+ *
+ * Displays multi-stage progress for AI model loading operations.
+ * Shows download progress, initialization stages, memory usage, and ETA.
+ *
+ * @example
+ * ```typescript
+ * // Create the component
+ * const loader = new ModelLoader({
+ *   modelName: 'GPT-4 Vision',
+ *   stages: ['download', 'load', 'initialize', 'ready'],
+ *   showBytes: true,
+ *   showMemoryUsage: true,
+ *   showETA: true,
+ * });
+ *
+ * document.body.appendChild(loader);
+ *
+ * // Start loading
+ * loader.start();
+ *
+ * // Update download stage
+ * loader.updateStage('download', {
+ *   bytesLoaded: 50000000,
+ *   totalBytes: 100000000,
+ *   message: 'Downloading model weights...'
+ * });
+ *
+ * // Move to next stage
+ * loader.setStage('load', { message: 'Loading into memory...' });
+ *
+ * // Complete
+ * loader.complete();
+ *
+ * // Listen to events
+ * loader.addEventListener('stagechange', (e) => {
+ *   console.log('Stage changed', e.detail);
+ * });
+ * ```
+ *
+ * @fires loadstart - Fired when loading starts
+ * @fires stagechange - Fired when stage changes
+ * @fires stageupdate - Fired when stage progress updates
+ * @fires loadcomplete - Fired when loading completes
+ * @fires loaderror - Fired when an error occurs
+ */
+export declare class ModelLoader extends AIControl {
+    protected config: Required<ModelLoaderConfig>;
+    private state;
+    private readonly updateThrottled;
+    static get observedAttributes(): string[];
+    constructor(config?: ModelLoaderConfig);
+    connectedCallback(): void;
+    protected getDefaultRole(): string;
+    /**
+     * Update cursor based on component state
+     */
+    private updateCursor;
+    protected handleAttributeChange(name: string, _oldValue: string, newValue: string): void;
+    /**
+     * Start loading
+     */
+    start(initialMessage?: string): void;
+    /**
+     * Update current stage progress
+     */
+    updateStage(stage: ModelStage, update: Omit<StageUpdate, 'stage'>): void;
+    private _updateStageInternal;
+    /**
+     * Move to a specific stage
+     */
+    setStage(stage: ModelStage, options?: {
+        message?: string;
+        progress?: number;
+    }): void;
+    /**
+     * Mark current stage as completed and move to next
+     */
+    completeStage(nextMessage?: string): void;
+    /**
+     * Complete loading
+     */
+    complete(): void;
+    /**
+     * Set error state
+     */
+    error(message: string, stage?: ModelStage): void;
+    /**
+     * Retry loading from the beginning
+     */
+    retry(): void;
+    /**
+     * Reset the component
+     */
+    reset(): void;
+    /**
+     * Get status icon for a stage
+     */
+    private getStageIcon;
+    /**
+     * Calculate ETA for remaining stages
+     */
+    private calculateETA;
+    /**
+     * Get overall status for rendering
+     */
+    private getOverallStatus;
+    /**
+     * Get status badge text
+     */
+    private getStatusBadgeText;
+    /**
+     * Generate HTML for all stages
+     */
+    private generateStagesHtml;
+    /**
+     * Generate HTML for stats section
+     */
+    private generateStatsHtml;
+    /**
+     * Render the component
+     */
+    protected render(): void;
+    /**
+     * Get current state (for debugging/inspection)
+     */
+    getState(): Readonly<ModelLoaderState>;
+    /**
+     * Get current configuration
+     */
+    getConfig(): Readonly<Required<ModelLoaderConfig>>;
+}
+
+/**
+ * Configuration for ModelLoader component
+ */
+export declare interface ModelLoaderConfig {
+    /** Stages to show (default: all) */
+    stages?: ModelStage[];
+    /** Model name to display */
+    modelName?: string;
+    /** Show bytes downloaded/total */
+    showBytes?: boolean;
+    /** Show memory usage */
+    showMemoryUsage?: boolean;
+    /** Show estimated time remaining */
+    showETA?: boolean;
+    /** Show retry button on error */
+    showRetryButton?: boolean;
+    /** Enable smooth progress animation */
+    smoothProgress?: boolean;
+    /** Update throttle in milliseconds */
+    updateThrottle?: number;
+    /** Custom retry button label */
+    retryLabel?: string;
+    /** Enable automatic cursor state changes based on component state */
+    cursorFeedback?: boolean;
+    /** Component size variant */
+    size?: 'compact' | 'default' | 'large';
+    /** Visual style variant */
+    variant?: 'default' | 'minimal' | 'gradient' | 'glassmorphic';
+    /** Animation style */
+    animation?: 'none' | 'striped' | 'pulse' | 'glow';
+    /** Debug mode */
+    debug?: boolean;
+    /** Custom CSS class */
+    className?: string;
+    /** Aria label */
+    ariaLabel?: string;
+}
+
+/**
+ * Overall ModelLoader state
+ */
+export declare interface ModelLoaderState {
+    currentStage: ModelStage;
+    stages: Record<ModelStage, StageState>;
+    isLoading: boolean;
+    hasError: boolean;
+    errorMessage?: string;
+    memoryUsage?: number;
+    startTime: number;
+}
+
+/**
+ * Loading stages for model initialization
+ */
+export declare type ModelStage = 'download' | 'load' | 'initialize' | 'ready';
+
+/**
+ * Event detail when any parameter changes
+ */
+export declare interface PanelChangeEvent {
+    /** Changed parameter ID */
+    parameterId: string;
+    /** New value */
+    value: number;
+    /** Previous value */
+    previousValue: number;
+    /** All current values */
+    allValues: Record<string, number>;
+    /** Source of change */
+    source: 'slider' | 'input' | 'preset' | 'reset' | 'import';
+    /** Timestamp */
+    timestamp: number;
+}
+
+/**
+ * Event detail when panel is reset
+ */
+export declare interface PanelResetEvent {
+    /** Previous values before reset */
+    previousValues: Record<string, number>;
+    /** New values after reset */
+    newValues: Record<string, number>;
+    /** Timestamp */
+    timestamp: number;
+}
+
+/**
+ * Parameter definition for a single slider in the panel
+ */
+export declare interface ParameterDefinition {
+    /** Unique parameter ID */
+    id: string;
+    /** Display label */
+    label: string;
+    /** Minimum value */
+    min: number;
+    /** Maximum value */
+    max: number;
+    /** Current/default value */
+    value: number;
+    /** Step size for slider */
+    step?: number;
+    /** Number of decimal places to display */
+    decimals?: number;
+    /** Parameter description/help text */
+    description?: string;
+    /** Unit suffix (e.g., '%', 'tokens') */
+    unit?: string;
+    /** Preset values for this parameter */
+    presets?: PresetValue[];
+    /** Show manual input field */
+    showInput?: boolean;
+    /** Show reset button */
+    showReset?: boolean;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Validation function */
+    validate?: (value: number, allValues: Record<string, number>) => boolean | string;
+}
+
+/**
+ * ParameterPanel Component
+ *
+ * Manages multiple AI parameters as a coordinated group with presets, validation, and export/import.
+ * Automatically creates and manages child ParameterSlider instances.
+ *
+ * @example
+ * ```typescript
+ * // Create LLM configuration panel
+ * const panel = new ParameterPanel({
+ *   title: 'Model Configuration',
+ *   parameters: [
+ *     { id: 'temperature', label: 'Temperature', min: 0, max: 2, value: 0.7, step: 0.1 },
+ *     { id: 'topP', label: 'Top-P', min: 0, max: 1, value: 0.9, step: 0.05 },
+ *     { id: 'maxTokens', label: 'Max Tokens', min: 100, max: 4000, value: 2000, step: 100 }
+ *   ],
+ *   presets: {
+ *     chatgpt: {
+ *       name: 'ChatGPT',
+ *       description: 'Balanced configuration',
+ *       values: { temperature: 0.7, topP: 0.9, maxTokens: 2000 }
+ *     },
+ *     code: {
+ *       name: 'Code Generation',
+ *       description: 'More focused for code',
+ *       values: { temperature: 0.2, topP: 0.8, maxTokens: 1000 }
+ *     }
+ *   }
+ * });
+ *
+ * document.body.appendChild(panel);
+ *
+ * // Get all values
+ * const config = panel.getAllValues();
+ * // { temperature: 0.7, topP: 0.9, maxTokens: 2000 }
+ *
+ * // Load preset
+ * panel.loadPreset('code');
+ *
+ * // Listen to changes
+ * panel.addEventListener('panelchange', (e) => {
+ *   console.log('Changed parameter:', e.detail.parameterId);
+ *   console.log('All values:', e.detail.allValues);
+ * });
+ * ```
+ *
+ * @fires panelchange - Fired when any parameter changes
+ * @fires presetload - Fired when preset is loaded
+ * @fires configexport - Fired when configuration is exported
+ * @fires configimport - Fired when configuration is imported
+ * @fires panelreset - Fired when panel is reset
+ * @fires validationerror - Fired when validation fails
+ */
+export declare class ParameterPanel extends AIControl {
+    private readonly state;
+    private readonly parameters;
+    private readonly parameterDefinitions;
+    private readonly presets;
+    private readonly panelConfig;
+    constructor(config: ParameterPanelConfig);
+    /**
+     * Get all parameter values
+     */
+    getAllValues(): Record<string, number>;
+    /**
+     * Get specific parameter value
+     */
+    getValue(parameterId: string): number | undefined;
+    /**
+     * Set specific parameter value
+     */
+    setValue(parameterId: string, value: number, source?: 'slider' | 'input' | 'preset' | 'reset' | 'import'): void;
+    /**
+     * Load preset values
+     */
+    loadPreset(presetId: string): void;
+    /**
+     * Reset all parameters to default values
+     */
+    resetAll(): void;
+    /**
+     * Export configuration as JSON
+     */
+    exportConfig(): ExportedConfig;
+    /**
+     * Import configuration from JSON
+     */
+    importConfig(config: ExportedConfig): void;
+    /**
+     * Toggle collapsed state
+     */
+    toggleCollapse(): void;
+    /**
+     * Validate all parameters
+     */
+    validateAll(): boolean;
+    /**
+     * Add custom preset
+     */
+    addPreset(id: string, name: string, values: Record<string, number>, description?: string): void;
+    /**
+     * Remove custom preset
+     */
+    removePreset(id: string): void;
+    private dispatchPanelChange;
+    private dispatchPresetLoad;
+    private dispatchConfigExport;
+    private dispatchConfigImport;
+    private dispatchPanelReset;
+    private dispatchValidationError;
+    private saveToStorage;
+    private loadFromStorage;
+    private savePresetsToStorage;
+    private loadPresetsFromStorage;
+    protected render(): void;
+    private renderHeader;
+    private renderErrors;
+    private renderPresets;
+    private renderParameters;
+    private renderActions;
+    private attachEventListeners;
+    private createParameterSliders;
+    private handleExport;
+    private handleImport;
+    /**
+     * Clean up when component is removed
+     */
+    disconnectedCallback(): void;
+}
+
+/**
+ * Configuration options for ParameterPanel
+ */
+export declare interface ParameterPanelConfig {
+    /** Array of parameter definitions */
+    parameters: ParameterDefinition[];
+    /** Built-in and custom presets */
+    presets?: Record<string, PresetConfiguration>;
+    /** Default preset to load on initialization */
+    defaultPreset?: string;
+    /** Layout style: grid or vertical */
+    layout?: 'grid' | 'vertical';
+    /** Number of columns for grid layout */
+    columns?: number;
+    /** Panel title */
+    title?: string;
+    /** Show preset selector buttons */
+    showPresets?: boolean;
+    /** Show reset all button */
+    showResetAll?: boolean;
+    /** Show export/import buttons */
+    showExportImport?: boolean;
+    /** Enable value persistence to localStorage */
+    persistValues?: boolean;
+    /** Enable preset persistence to localStorage */
+    persistPresets?: boolean;
+    /** LocalStorage key for persistence */
+    storageKey?: string;
+    /** Make panel collapsible */
+    collapsible?: boolean;
+    /** Start collapsed */
+    startCollapsed?: boolean;
+    /** Validate parameters on change */
+    validateOnChange?: boolean;
+    /** Emit change events */
+    emitChangeEvents?: boolean;
+    /** Disabled state for entire panel */
+    disabled?: boolean;
+    /** Enable debug logging */
+    debug?: boolean;
+    /** Additional CSS class */
+    className?: string;
+    /** ARIA label for accessibility */
+    ariaLabel?: string;
+}
+
+/**
+ * Internal state of the ParameterPanel
+ */
+export declare interface ParameterPanelState {
+    /** Current values for all parameters */
+    values: Record<string, number>;
+    /** Currently active preset name */
+    activePreset: string | null;
+    /** Is panel collapsed */
+    isCollapsed: boolean;
+    /** Validation errors by parameter ID */
+    errors: Record<string, string>;
+    /** Are any parameters being modified */
+    isDirty: boolean;
+}
+
+/**
+ * ParameterSlider Component
+ *
+ * Interactive slider for AI parameter configuration (temperature, top-p, penalties, etc.).
+ * Supports presets, manual input, keyboard navigation, and accessibility.
+ *
+ * @example
+ * ```typescript
+ * // Create temperature slider
+ * const slider = new ParameterSlider({
+ *   label: 'Temperature',
+ *   min: 0,
+ *   max: 2,
+ *   value: 0.7,
+ *   step: 0.1,
+ *   description: 'Controls randomness in responses',
+ *   presets: [
+ *     { value: 0, label: 'Focused' },
+ *     { value: 0.7, label: 'Balanced' },
+ *     { value: 1.5, label: 'Creative' }
+ *   ]
+ * });
+ *
+ * document.body.appendChild(slider);
+ *
+ * // Listen to value changes
+ * slider.addEventListener('valuechange', (e) => {
+ *   console.log('New value:', e.detail.value);
+ * });
+ *
+ * // Get current value
+ * const value = slider.getValue();
+ *
+ * // Set value programmatically
+ * slider.setValue(1.2);
+ * ```
+ *
+ * @fires valuechange - Fired when value changes
+ * @fires presetselect - Fired when preset is selected
+ */
+export declare class ParameterSlider extends AIControl {
+    protected config: Required<ParameterSliderConfig>;
+    private readonly state;
+    private sliderTrack;
+    private sliderThumb;
+    static get observedAttributes(): string[];
+    constructor(config?: ParameterSliderConfig);
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    protected getDefaultRole(): string;
+    protected handleAttributeChange(name: string, _oldValue: string, newValue: string): void;
+    /**
+     * Get current value
+     */
+    getValue(): number;
+    /**
+     * Set value programmatically
+     */
+    setValue(value: number, source?: 'slider' | 'input' | 'preset' | 'reset'): void;
+    /**
+     * Reset to default value
+     */
+    reset(): void;
+    /**
+     * Select a preset value
+     */
+    selectPreset(preset: PresetValue): void;
+    /**
+     * Attach event listeners to slider elements
+     */
+    private attachEventListeners;
+    /**
+     * Remove event listeners
+     */
+    private removeEventListeners;
+    /**
+     * Handle track click
+     */
+    private handleTrackClick;
+    /**
+     * Handle thumb mouse down
+     */
+    private handleThumbMouseDown;
+    /**
+     * Handle thumb mouse move
+     */
+    private readonly handleThumbMouseMove;
+    /**
+     * Handle thumb mouse up
+     */
+    private readonly handleThumbMouseUp;
+    /**
+     * Handle thumb touch start
+     */
+    private handleThumbTouchStart;
+    /**
+     * Handle thumb touch move
+     */
+    private readonly handleThumbTouchMove;
+    /**
+     * Handle thumb touch end
+     */
+    private readonly handleThumbTouchEnd;
+    /**
+     * Handle keyboard navigation
+     */
+    private handleThumbKeyDown;
+    /**
+     * Handle input field change
+     */
+    private handleInputChange;
+    /**
+     * Handle input field blur (validate)
+     */
+    private handleInputBlur;
+    /**
+     * Update slider thumb position based on current value
+     */
+    private updateSliderPosition;
+    /**
+     * Update cursor based on slider state
+     */
+    private updateCursor;
+    /**
+     * Update active preset button
+     */
+    private updateActivePreset;
+    /**
+     * Render input controls section
+     */
+    private renderInputControls;
+    /**
+     * Render the component
+     */
+    protected render(): void;
+    /**
+     * Get current state (for debugging)
+     */
+    getState(): Readonly<ParameterSliderState>;
+    /**
+     * Get current configuration
+     */
+    getConfig(): Readonly<Required<ParameterSliderConfig>>;
+}
+
+/**
+ * Configuration options for ParameterSlider
+ */
+export declare interface ParameterSliderConfig {
+    /** Parameter label */
+    label?: string;
+    /** Minimum value */
+    min?: number;
+    /** Maximum value */
+    max?: number;
+    /** Current value */
+    value?: number;
+    /** Default value to reset to */
+    defaultValue?: number;
+    /** Step size for slider */
+    step?: number;
+    /** Number of decimal places to display */
+    decimals?: number;
+    /** Parameter description/help text */
+    description?: string;
+    /** Show preset value buttons */
+    showPresets?: boolean;
+    /** Preset values with labels */
+    presets?: PresetValue[];
+    /** Show manual input field */
+    showInput?: boolean;
+    /** Show reset button */
+    showReset?: boolean;
+    /** Show range labels (min/max) */
+    showRangeLabels?: boolean;
+    /** Unit suffix (e.g., '%', 'tokens') */
+    unit?: string;
+    /** Enable automatic cursor state changes based on component state */
+    cursorFeedback?: boolean;
+    /** Component size variant */
+    size?: 'compact' | 'default' | 'large';
+    /** Visual style variant */
+    variant?: 'default' | 'minimal' | 'gradient' | 'glassmorphic';
+    /** Animation style */
+    animation?: 'none' | 'striped' | 'pulse' | 'glow';
+    /** Disabled state */
+    disabled?: boolean;
+    /** Enable debug logging */
+    debug?: boolean;
+    /** Additional CSS class */
+    className?: string;
+    /** ARIA label for accessibility */
+    ariaLabel?: string;
+}
+
+/**
+ * Internal state of the ParameterSlider
+ */
+export declare interface ParameterSliderState {
+    currentValue: number;
+    isDragging: boolean;
+    isFocused: boolean;
+}
+
+/**
+ * Parse CSS color to RGB
+ */
+export declare function parseColor(color: string): {
+    r: number;
+    g: number;
+    b: number;
+} | null;
+
+/**
+ * Event data for position change
+ */
+export declare interface PositionChangeEvent {
+    previousPosition: number;
+    currentPosition: number;
+    queueSize: number;
+    estimatedWait: number;
+    timestamp: number;
+}
+
+/**
+ * Check if reduced motion is preferred
+ */
+export declare function prefersReducedMotion(): boolean;
+
+/**
+ * Preset configuration containing values for all parameters
+ */
+export declare interface PresetConfiguration {
+    /** Preset name (display) */
+    name: string;
+    /** Preset description */
+    description?: string;
+    /** Parameter values */
+    values: Record<string, number>;
+    /** Optional icon/emoji */
+    icon?: string;
+    /** Is this a built-in preset? */
+    isBuiltIn?: boolean;
+}
+
+/**
+ * Event detail when preset is loaded
+ */
+export declare interface PresetLoadEvent {
+    /** Preset name/ID */
+    presetId: string;
+    /** Preset configuration */
+    preset: PresetConfiguration;
+    /** Previous values before preset load */
+    previousValues: Record<string, number>;
+    /** Timestamp */
+    timestamp: number;
+}
+
+/**
+ * Event detail for preset selection
+ */
+export declare interface PresetSelectEvent {
+    preset: PresetValue;
+    previousValue: number;
+    timestamp: number;
+}
+
+/**
+ * Preset configuration for common values
+ */
+export declare interface PresetValue {
+    value: number;
+    label: string;
+    description?: string;
+}
+
+/**
+ * Event detail for progress updates
+ */
+export declare interface ProgressUpdateEvent {
+    current: number;
+    total?: number;
+    percentage?: number;
+    message?: string;
+}
+
+/**
+ * Event data for queue complete
+ */
+export declare interface QueueCompleteEvent {
+    totalWaitTime: number;
+    startPosition: number;
+    timestamp: number;
+}
+
+/**
+ * Event data for queue error
+ */
+export declare interface QueueErrorEvent {
+    message: string;
+    position: number;
+    timestamp: number;
+}
+
+/**
+ * QueueProgress Component
+ *
+ * Displays queue position and estimated wait time for rate-limited AI APIs.
+ * Shows position updates, processing rate, and estimated wait time.
+ *
+ * @example
+ * ```typescript
+ * // Create the component
+ * const queue = new QueueProgress({
+ *   position: 47,
+ *   queueSize: 120,
+ *   estimatedWait: 180, // 3 minutes
+ *   processingRate: 3, // 3 requests per second
+ * });
+ *
+ * document.body.appendChild(queue);
+ *
+ * // Start tracking
+ * queue.start();
+ *
+ * // Update position
+ * queue.update({
+ *   position: 25,
+ *   estimatedWait: 90
+ * });
+ *
+ * // Complete
+ * queue.complete();
+ *
+ * // Listen to events
+ * queue.addEventListener('positionchange', (e) => {
+ *   console.log('Position changed', e.detail);
+ * });
+ * ```
+ *
+ * @fires queuestart - Fired when queue tracking starts
+ * @fires positionchange - Fired when position updates
+ * @fires queuecomplete - Fired when processing begins
+ * @fires queueerror - Fired when an error occurs
+ */
+export declare class QueueProgress extends AIControl {
+    protected config: Required<QueueProgressConfig>;
+    private state;
+    private readonly updateThrottled;
+    private timerInterval;
+    private initialPosition;
+    static get observedAttributes(): string[];
+    constructor(config?: QueueProgressConfig);
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    protected getDefaultRole(): string;
+    protected handleAttributeChange(name: string, _oldValue: string, newValue: string): void;
+    /**
+     * Start queue tracking
+     */
+    start(message?: string): void;
+    /**
+     * Update queue position
+     */
+    update(update: QueueUpdate): void;
+    private _updateInternal;
+    /**
+     * Mark as processing (reached front of queue)
+     */
+    complete(): void;
+    /**
+     * Cancel queue
+     */
+    cancel(reason?: string): void;
+    /**
+     * Handle error
+     */
+    error(errorMessage: string): void;
+    /**
+     * Reset to initial state
+     */
+    reset(): void;
+    /**
+     * Get current position
+     */
+    getPosition(): number;
+    /**
+     * Get current status
+     */
+    getStatus(): QueueStatus;
+    /**
+     * Start elapsed time timer
+     */
+    protected startTimer(): void;
+    /**
+     * Stop timer
+     */
+    private stopTimer;
+    /**
+     * Calculate progress percentage
+     */
+    private getProgressPercentage;
+    /**
+     * Update cursor based on queue state
+     */
+    private updateCursor;
+    /**
+     * Render metrics section
+     */
+    private renderMetrics;
+    /**
+     * Render component
+     */
+    protected render(): void;
+    private getStatusIcon;
+    private getStatusText;
+}
+
+/**
+ * Configuration for QueueProgress component
+ */
+export declare interface QueueProgressConfig {
+    /** Initial position in queue */
+    position?: number;
+    /** Total queue size */
+    queueSize?: number;
+    /** Estimated wait time in seconds */
+    estimatedWait?: number;
+    /** Processing rate (items per second) */
+    processingRate?: number;
+    /** Show position counter */
+    showPosition?: boolean;
+    /** Show estimated wait time */
+    showWaitTime?: boolean;
+    /** Show processing rate */
+    showRate?: boolean;
+    /** Show queue size */
+    showQueueSize?: boolean;
+    /** Show visual progress bar */
+    showProgressBar?: boolean;
+    /** Custom message */
+    message?: string;
+    /** Enable animations */
+    animate?: boolean;
+    /** Update throttle in milliseconds */
+    updateThrottle?: number;
+    /** Enable automatic cursor state changes based on component state */
+    cursorFeedback?: boolean;
+    /** Component size variant */
+    size?: 'compact' | 'default' | 'large';
+    /** Visual style variant */
+    variant?: 'default' | 'minimal' | 'gradient' | 'glassmorphic';
+    /** Animation style */
+    animation?: 'none' | 'striped' | 'pulse' | 'glow';
+    /** Debug mode */
+    debug?: boolean;
+    /** Custom CSS class */
+    className?: string;
+    /** Aria label */
+    ariaLabel?: string;
+}
+
+/**
+ * QueueProgress state
+ */
+export declare interface QueueProgressState {
+    status: QueueStatus;
+    position: number;
+    queueSize: number;
+    estimatedWait: number;
+    processingRate: number;
+    startTime: number;
+    message?: string;
+    elapsedTime: number;
+}
+
+/**
+ * Event data for queue start
+ */
+export declare interface QueueStartEvent {
+    position: number;
+    queueSize: number;
+    estimatedWait: number;
+    timestamp: number;
+}
+
+/**
+ * Queue status types
+ */
+export declare type QueueStatus = 'waiting' | 'processing' | 'completed' | 'cancelled' | 'error';
+
+/**
+ * Update data for queue position
+ */
+export declare interface QueueUpdate {
+    position?: number;
+    queueSize?: number;
+    estimatedWait?: number;
+    processingRate?: number;
+    message?: string;
+}
+
+/**
+ * Event detail for retry attempt start
+ */
+export declare interface RetryAttemptEvent {
+    attempt: number;
+    maxAttempts: number;
+    message: string;
+    timestamp: number;
+}
+
+/**
+ * Data for retry attempt updates
+ */
+export declare interface RetryAttemptUpdate {
+    /** New attempt number */
+    attempt?: number;
+    /** Operation message */
+    message?: string;
+    /** Error from last attempt */
+    error?: Error;
+    /** Override calculated delay (ms) */
+    delay?: number;
+}
+
+/**
+ * Event detail for retry cancellation
+ */
+export declare interface RetryCancelEvent {
+    attempt: number;
+    reason?: string;
+    timestamp: number;
+}
+
+/**
+ * Event detail for retry failure (max attempts reached)
+ */
+export declare interface RetryFailureEvent {
+    totalAttempts: number;
+    lastError?: Error;
+    elapsedTime: number;
+    timestamp: number;
+}
+
+/**
+ * RetryProgress Component
+ *
+ * Displays retry progress with exponential backoff, attempt tracking, and error handling.
+ * Perfect for handling transient failures in API calls, network requests, or AI operations.
+ *
+ * @example
+ * ```typescript
+ * // Create the component
+ * const retry = new RetryProgress({
+ *   maxAttempts: 5,
+ *   initialDelay: 1000,
+ *   strategy: 'exponential',
+ *   allowManualRetry: true,
+ * });
+ *
+ * document.body.appendChild(retry);
+ *
+ * // Start first attempt
+ * retry.attempt('Connecting to API...');
+ *
+ * // If it fails, start waiting for retry
+ * retry.waitForRetry({
+ *   attempt: 2,
+ *   error: new Error('Connection timeout'),
+ * });
+ *
+ * // On success
+ * retry.success('Connected successfully!');
+ *
+ * // Listen to events
+ * retry.addEventListener('retryattempt', (e) => {
+ *   console.log('Attempting:', e.detail);
+ * });
+ * ```
+ *
+ * @fires retryattempt - Fired when a retry attempt starts
+ * @fires retrywaiting - Fired when waiting for next retry
+ * @fires retrysuccess - Fired when operation succeeds
+ * @fires retryfailure - Fired when max attempts reached
+ * @fires retrycancel - Fired when retry is cancelled
+ * @fires manualretry - Fired when user manually triggers retry
+ */
+export declare class RetryProgress extends AIControl {
+    protected config: Required<RetryProgressConfig>;
+    private state;
+    private waitTimer?;
+    private elapsedTimer?;
+    private progressTimer?;
+    constructor(config?: RetryProgressConfig);
+    /**
+     * Read max-attempts attribute
+     */
+    private _readMaxAttemptsAttribute;
+    /**
+     * Read initial-delay attribute
+     */
+    private _readInitialDelayAttribute;
+    /**
+     * Read max-delay attribute
+     */
+    private _readMaxDelayAttribute;
+    /**
+     * Read backoff-multiplier attribute
+     */
+    private _readBackoffMultiplierAttribute;
+    /**
+     * Read strategy attribute
+     */
+    private _readStrategyAttribute;
+    /**
+     * Read boolean attributes
+     */
+    private _readBooleanAttributes;
+    /**
+     * Connected callback - read initial attributes
+     */
+    connectedCallback(): void;
+    /**
+     * Calculate delay for retry attempt based on strategy
+     */
+    private calculateDelay;
+    /**
+     * Calculate fibonacci number
+     */
+    private fibonacci;
+    /**
+     * Start a retry attempt
+     */
+    attempt(message?: string): void;
+    /**
+     * Wait for next retry with optional error
+     */
+    waitForRetry(update?: RetryAttemptUpdate): void;
+    /**
+     * Mark operation as successful
+     */
+    success(message?: string): void;
+    /**
+     * Mark operation as failed (max attempts reached)
+     */
+    failure(error?: Error): void;
+    /**
+     * Cancel retry operation
+     */
+    cancel(reason?: string): void;
+    /**
+     * Reset to initial state
+     */
+    reset(): void;
+    /**
+     * Get current attempt number
+     */
+    getAttempt(): number;
+    /**
+     * Get current status
+     */
+    getStatus(): RetryStatus;
+    /**
+     * Get time until next retry (ms)
+     */
+    getTimeUntilRetry(): number;
+    /**
+     * Start elapsed time timer
+     */
+    private startElapsedTimer;
+    /**
+     * Start wait timer for automatic retry
+     */
+    private startWaitTimer;
+    /**
+     * Start progress bar timer
+     */
+    private startProgressTimer;
+    /**
+     * Stop all timers
+     */
+    private stopTimers;
+    /**
+     * Handle manual retry button click
+     */
+    private handleManualRetry;
+    /**
+     * Handle cancel button click
+     */
+    private handleCancel;
+    /**
+     * Update state and re-render
+     */
+    private setState;
+    /**
+     * Update cursor based on retry state
+     */
+    private updateCursor;
+    /**
+     * Get status icon
+     */
+    private getStatusIcon;
+    /**
+     * Get status text
+     */
+    private getStatusText;
+    /**
+     * Calculate progress percentage
+     */
+    private getProgressPercentage;
+    /**
+     * Render success message
+     */
+    private renderSuccessMessage;
+    /**
+     * Render action buttons
+     */
+    private renderActions;
+    /**
+     * Sync config attributes to host element
+     */
+    private _syncAttributes;
+    /**
+     * Get attempt counter HTML
+     */
+    private _getAttemptCounterHtml;
+    /**
+     * Get metrics grid HTML
+     */
+    private _getMetricsGridHtml;
+    /**
+     * Get progress bar HTML
+     */
+    private _getProgressBarHtml;
+    /**
+     * Get error display HTML
+     */
+    private _getErrorDisplayHtml;
+    /**
+     * Attach event listeners to rendered elements
+     */
+    private _attachEventListeners;
+    /**
+     * Render component
+     */
+    protected render(): void;
+    /**
+     * Cleanup on disconnect
+     */
+    disconnectedCallback(): void;
+    /**
+     * Observed attributes
+     */
+    static get observedAttributes(): string[];
+    /**
+     * Handle attribute changes
+     */
+    protected handleAttributeChange(name: string, _oldValue: string, newValue: string): void;
+}
+
+/**
+ * Configuration for RetryProgress component
+ */
+export declare interface RetryProgressConfig {
+    /** Current attempt number (1-indexed) */
+    attempt?: number;
+    /** Maximum number of retry attempts */
+    maxAttempts?: number;
+    /** Initial delay in milliseconds */
+    initialDelay?: number;
+    /** Maximum delay in milliseconds */
+    maxDelay?: number;
+    /** Backoff multiplier for exponential strategy */
+    backoffMultiplier?: number;
+    /** Retry strategy */
+    strategy?: RetryStrategy;
+    /** Operation message */
+    message?: string;
+    /** Show attempt count */
+    showAttemptCount?: boolean;
+    /** Show next retry time */
+    showNextRetry?: boolean;
+    /** Show progress bar for wait time */
+    showProgressBar?: boolean;
+    /** Show elapsed time */
+    showElapsedTime?: boolean;
+    /** Enable manual retry button */
+    allowManualRetry?: boolean;
+    /** Enable cancel button */
+    allowCancel?: boolean;
+    /** Enable animations */
+    animate?: boolean;
+    /** Enable automatic cursor state changes based on component state */
+    cursorFeedback?: boolean;
+    /** Component size variant */
+    size?: 'compact' | 'default' | 'large';
+    /** Visual style variant */
+    variant?: 'default' | 'minimal' | 'gradient' | 'glassmorphic';
+    /** Animation style */
+    animation?: 'none' | 'striped' | 'pulse' | 'glow';
+    /** Custom CSS class */
+    className?: string;
+    /** ARIA label for accessibility */
+    ariaLabel?: string;
+    /** Debug mode */
+    debug?: boolean;
+    /** Disabled state */
+    disabled?: boolean;
+}
+
+/**
+ * Internal state for RetryProgress
+ */
+export declare interface RetryProgressState {
+    status: RetryStatus;
+    attempt: number;
+    maxAttempts: number;
+    currentDelay: number;
+    nextRetryTime: number;
+    startTime: number;
+    elapsedTime: number;
+    message: string;
+    errorMessage?: string;
+    lastError?: Error;
+}
+
+/**
+ * Types for RetryProgress component
+ */
+/**
+ * Retry status
+ */
+export declare type RetryStatus = 'idle' | 'attempting' | 'waiting' | 'success' | 'failed' | 'cancelled';
+
+/**
+ * Retry strategy for backoff calculation
+ */
+export declare type RetryStrategy = 'exponential' | 'linear' | 'fixed' | 'fibonacci';
+
+/**
+ * Event detail for retry success
+ */
+export declare interface RetrySuccessEvent {
+    attempt: number;
+    totalAttempts: number;
+    elapsedTime: number;
+    message: string;
+    timestamp: number;
+}
+
+/**
+ * Event detail for retry waiting period
+ */
+export declare interface RetryWaitingEvent {
+    attempt: number;
+    delay: number;
+    nextRetryTime: number;
+    strategy: RetryStrategy;
+    timestamp: number;
+}
+
+/**
+ * Size variant for components
+ */
+export declare type SizeVariant = 'compact' | 'default' | 'large';
+
+/**
+ * Event data for stage change
+ */
+export declare interface StageChangeEvent {
+    previousStage: ModelStage;
+    currentStage: ModelStage;
+    timestamp: number;
+}
+
+/**
+ * State for each stage
+ */
+export declare interface StageState {
+    status: StageStatus;
+    progress: number;
+    message?: string;
+    bytesLoaded?: number;
+    totalBytes?: number;
+    startTime?: number;
+    endTime?: number;
+}
+
+/**
+ * Status of each stage
+ */
+export declare type StageStatus = 'pending' | 'in-progress' | 'completed' | 'error';
+
+/**
+ * Update data for a stage
+ */
+export declare interface StageUpdate {
+    stage: ModelStage;
+    progress?: number;
+    bytesLoaded?: number;
+    totalBytes?: number;
+    message?: string;
+    memoryUsage?: number;
+}
+
+/**
+ * Event data for stream cancellation
+ */
+export declare interface StreamCancelEvent {
+    tokensGenerated: number;
+    duration: number;
+    reason: 'user' | 'error' | 'timeout';
+}
+
+/**
+ * Event data for stream completion
+ */
+export declare interface StreamCompleteEvent {
+    tokensGenerated: number;
+    duration: number;
+    totalCost: number;
+    averageRate: number;
+}
+
+/**
+ * StreamProgress Component
+ *
+ * Displays real-time progress for streaming AI responses (e.g., LLM token generation).
+ * Shows token count, generation rate, cost estimation, and provides cancel functionality.
+ *
+ * @example
+ * ```typescript
+ * // Create the component
+ * const progress = new StreamProgress({
+ *   maxTokens: 2000,
+ *   costPerToken: 0.00002,
+ *   showRate: true,
+ *   showCost: true,
+ * });
+ *
+ * document.body.appendChild(progress);
+ *
+ * // Start streaming
+ * progress.start();
+ *
+ * // Update as tokens stream in
+ * progress.update({
+ *   tokensGenerated: 150,
+ *   tokensPerSecond: 25,
+ *   message: 'Generating response...'
+ * });
+ *
+ * // Complete the stream
+ * progress.complete();
+ *
+ * // Listen to events
+ * progress.addEventListener('cancel', (e) => {
+ *   console.log('Stream cancelled', e.detail);
+ * });
+ * ```
+ *
+ * @fires streamstart - Fired when streaming starts
+ * @fires streamupdate - Fired when progress is updated
+ * @fires streamcomplete - Fired when streaming completes
+ * @fires streamcancel - Fired when streaming is cancelled
+ */
+export declare class StreamProgress extends AIControl {
+    protected config: Required<StreamProgressConfig>;
+    private state;
+    private readonly updateThrottled;
+    private animationFrame;
+    private displayTokens;
+    static get observedAttributes(): string[];
+    constructor(config?: StreamProgressConfig);
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    protected cleanup(): void;
+    /**
+     * Update cursor based on component state
+     */
+    private updateCursor;
+    protected getDefaultRole(): string;
+    protected handleAttributeChange(name: string, _oldValue: string, newValue: string): void;
+    /**
+     * Start streaming
+     */
+    start(message?: string): void;
+    /**
+     * Update progress
+     */
+    update(update: StreamProgressUpdate): void;
+    private _updateInternal;
+    /**
+     * Smooth animation for progress
+     */
+    private animateProgress;
+    /**
+     * Complete streaming
+     */
+    complete(): void;
+    /**
+     * Cancel streaming
+     */
+    cancel(reason?: 'user' | 'error' | 'timeout'): void;
+    /**
+     * Reset the component
+     */
+    reset(): void;
+    /**
+     * Sync config attributes to host element
+     */
+    private _syncAttributes;
+    /**
+     * Get progress bar HTML
+     */
+    private _getProgressBarHtml;
+    /**
+     * Get stats HTML
+     */
+    private _getStatsHtml;
+    /**
+     * Get cancel button HTML
+     */
+    private _getCancelButtonHtml;
+    /**
+     * Get status CSS class
+     */
+    private _getStatusClass;
+    /**
+     * Attach event listeners to rendered elements
+     */
+    private _attachEventListeners;
+    /**
+     * Render the component
+     */
+    protected render(): void;
+    /**
+     * Get current state (for debugging/inspection)
+     */
+    getState(): Readonly<StreamProgressState>;
+    /**
+     * Get current configuration
+     */
+    getConfig(): Readonly<Required<StreamProgressConfig>>;
+}
+
+/**
+ * Configuration for StreamProgress component
+ */
+export declare interface StreamProgressConfig {
+    /** Maximum tokens allowed */
+    maxTokens?: number;
+    /** Cost per token (for cost estimation) */
+    costPerToken?: number;
+    /** Currency symbol */
+    currency?: string;
+    /** Show tokens per second */
+    showRate?: boolean;
+    /** Show cost estimation */
+    showCost?: boolean;
+    /** Show progress bar */
+    showProgressBar?: boolean;
+    /** Show cancel button */
+    showCancelButton?: boolean;
+    /** Enable smooth progress animation */
+    smoothProgress?: boolean;
+    /** Update throttle in milliseconds */
+    updateThrottle?: number;
+    /** Custom cancel button label */
+    cancelLabel?: string;
+    /** Enable automatic cursor state changes based on component state */
+    cursorFeedback?: boolean;
+    /** Component size variant */
+    size?: 'compact' | 'default' | 'large';
+    /** Visual style variant */
+    variant?: 'default' | 'minimal' | 'gradient' | 'glassmorphic';
+    /** Animation style */
+    animation?: 'none' | 'striped' | 'pulse' | 'glow';
+    /** Debug mode */
+    debug?: boolean;
+    /** Custom CSS class */
+    className?: string;
+    /** Aria label */
+    ariaLabel?: string;
+}
+
+/**
+ * State for StreamProgress
+ */
+export declare interface StreamProgressState {
+    tokensGenerated: number;
+    tokensPerSecond: number;
+    totalCost: number;
+    isStreaming: boolean;
+    isPaused: boolean;
+    isCancelled: boolean;
+    startTime: number;
+    lastUpdateTime: number;
+    message?: string;
+}
+
+/**
+ * Event data for progress updates
+ */
+export declare interface StreamProgressUpdate {
+    tokensGenerated: number;
+    tokensPerSecond?: number;
+    message?: string;
+}
+
+/**
+ * Theme configuration using CSS custom properties
+ */
+export declare interface ThemeConfig {
+    primaryColor?: string;
+    secondaryColor?: string;
+    backgroundColor?: string;
+    textColor?: string;
+    borderRadius?: string;
+    fontSize?: string;
+    fontFamily?: string;
+}
+
+/**
+ * Throttle function calls
+ */
+export declare function throttle<T extends (...args: any[]) => any>(func: T, limit: number): (...args: Parameters<T>) => void;
+
+/**
+ * Event detail when validation fails
+ */
+export declare interface ValidationErrorEvent {
+    /** Parameter ID with error */
+    parameterId: string;
+    /** Error message */
+    error: string;
+    /** Current value */
+    value: number;
+    /** Timestamp */
+    timestamp: number;
+}
+
+/**
+ * Event detail for value change
+ */
+export declare interface ValueChangeEvent {
+    value: number;
+    previousValue: number;
+    source: 'slider' | 'input' | 'preset' | 'reset';
+    timestamp: number;
+}
+
+/**
+ * Visual style variant for components
+ */
+export declare type VisualVariant = 'default' | 'minimal' | 'gradient' | 'glassmorphic';
+
+export { }