react-open-source-grid 1.5.0 → 1.5.2

package/dist/assets/components/DataGrid/useMarketData.d.ts

@@ -0,0 +1,57 @@
+/**
+ * useMarketData.ts
+ *
+ * React hook for managing market data subscriptions, WebSocket connections,
+ * and integrating with MarketDataEngine.
+ *
+ * Features:
+ * - WebSocket connection management
+ * - Auto-reconnect with exponential backoff
+ * - Data ingestion pipeline
+ * - Subscription management
+ * - Connection state tracking
+ */
+import { MarketDataEngine } from './MarketDataEngine';
+import type { RowUpdate, MarketDataRow } from './MarketDataEngine';
+export interface WebSocketConfig {
+    url: string;
+    reconnect?: boolean;
+    reconnectDelay?: number;
+    maxReconnectDelay?: number;
+    reconnectAttempts?: number;
+    onConnect?: () => void;
+    onDisconnect?: () => void;
+    onError?: (error: Event) => void;
+    onMessage?: (data: any) => void;
+}
+export interface MarketDataSubscription {
+    symbols: string[];
+    onUpdate?: (update: RowUpdate) => void;
+}
+export type ConnectionState = 'disconnected' | 'connecting' | 'connected' | 'reconnecting' | 'failed';
+export interface UseMarketDataOptions {
+    engine: MarketDataEngine;
+    wsConfig?: WebSocketConfig;
+    initialData?: MarketDataRow[];
+    autoConnect?: boolean;
+    subscription?: MarketDataSubscription;
+}
+export interface UseMarketDataReturn {
+    rows: MarketDataRow[];
+    connectionState: ConnectionState;
+    isConnected: boolean;
+    connect: () => void;
+    disconnect: () => void;
+    subscribe: (symbols: string[]) => void;
+    unsubscribe: (symbols: string[]) => void;
+    sendMessage: (message: any) => void;
+    metrics: {
+        updatesPerSecond: number;
+        totalUpdates: number;
+        reconnectCount: number;
+    };
+}
+/**
+ * Hook for managing market data with WebSocket connection and engine integration
+ */
+export declare function useMarketData(options: UseMarketDataOptions): UseMarketDataReturn;

package/dist/assets/components/DataGrid/useScreenReaderAnnouncements.d.ts

@@ -0,0 +1,23 @@
+/**
+ * useScreenReaderAnnouncements Hook
+ *
+ * Manages live region announcements for screen readers.
+ * Provides accessible feedback for grid actions like sorting, filtering, selection, and navigation.
+ */
+import React from 'react';
+export declare const useScreenReaderAnnouncements: () => {
+    announcementRef: React.RefObject<string>;
+    announce: (message: string, options?: {
+        priority?: "polite" | "assertive";
+        delay?: number;
+    }) => void;
+    announceSorting: (columnName: string, direction: "asc" | "desc" | null) => void;
+    announceSelection: (count: number) => void;
+    announceFiltering: (columnName: string, hasFilter: boolean, resultCount?: number) => void;
+    announcePagination: (currentPage: number, totalPages: number, rowCount: number) => void;
+    announceFocus: (rowIndex: number, columnName: string, value?: any) => void;
+    announceEditing: (columnName: string, isStarting: boolean) => void;
+    announceRowReorder: (fromIndex: number, toIndex: number) => void;
+    announceColumnVisibility: (columnName: string, isVisible: boolean) => void;
+    announceLoading: (isLoading: boolean, message?: string) => void;
+};

package/dist/assets/components/DataGrid/useTooltip.d.ts

@@ -0,0 +1,21 @@
+import type { TooltipState, TooltipConfig, Row, Column } from './types';
+interface UseTooltipProps {
+    config?: TooltipConfig;
+}
+interface TooltipHandlers {
+    onCellMouseEnter: (event: React.MouseEvent, row: Row, column: Column, value: any) => void;
+    onCellMouseLeave: () => void;
+    onRowMouseEnter: (event: React.MouseEvent, row: Row, rowIndex: number) => void;
+    onRowMouseLeave: () => void;
+}
+/**
+ * useTooltip Hook
+ *
+ * Manages tooltip state with hover detection, delay handling, and smart positioning.
+ */
+export declare const useTooltip: ({ config }?: UseTooltipProps) => {
+    tooltipState: TooltipState;
+    tooltipHandlers: TooltipHandlers;
+    hideTooltip: () => void;
+};
+export {};

package/dist/assets/components/DemoGridPage.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const DemoGridPage: React.FC;

package/dist/assets/components/DensityModeDemo.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+/**
+ * DensityModeDemo - Showcase of DataGrid Density Modes
+ *
+ * Demonstrates:
+ * - Compact mode: Minimal spacing for maximum data density
+ * - Normal mode: Balanced spacing for general use
+ * - Comfortable mode: Generous spacing for accessibility
+ * - Persistent density preference (localStorage)
+ * - Segmented control UI
+ */
+export declare const DensityModeDemo: React.FC;

package/dist/assets/components/FacetedSearchDemo.d.ts

@@ -0,0 +1,8 @@
+/**
+ * FacetedSearchDemo Component
+ *
+ * Demonstrates the FacetedSearch feature with e-commerce and analytics use cases.
+ */
+import React from 'react';
+export declare const FacetedSearchDemo: React.FC;
+export default FacetedSearchDemo;

package/dist/assets/components/FeatureGallery.d.ts

@@ -0,0 +1,2 @@
+export declare const FeatureGallery: () => import("react/jsx-runtime").JSX.Element;
+export default FeatureGallery;

package/dist/assets/components/FilteredSearchDemo.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+/**
+ * FilteredSearchDemo - Showcase of Advanced Search with Token-Based Filtering
+ * Similar to GitLab/GitHub's advanced search interface
+ */
+export declare const FilteredSearchDemo: React.FC;
+export default FilteredSearchDemo;

package/dist/assets/components/GridApiDemoPage.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const GridApiDemoPage: React.FC;

package/dist/assets/components/HomePage.d.ts

@@ -0,0 +1 @@
+export declare function HomePage(): import("react/jsx-runtime").JSX.Element;

package/dist/assets/components/InfiniteScrollDemo.d.ts

@@ -0,0 +1,13 @@
+/**
+ * InfiniteScrollDemo Component
+ *
+ * Demonstrates infinite scrolling with server-side data source
+ * handling 100M+ rows with:
+ * - Server-side filtering
+ * - Server-side sorting
+ * - Block caching
+ * - Virtual scrolling
+ */
+import React from 'react';
+export declare const InfiniteScrollDemo: React.FC;
+export default InfiniteScrollDemo;

package/dist/assets/components/LayoutPersistenceDemo.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const LayoutPersistenceDemo: React.FC;

package/dist/assets/components/LiveMarketDemo.d.ts

@@ -0,0 +1,18 @@
+/**
+ * LiveMarketDemo.tsx
+ *
+ * Full demo page showcasing high-performance market data grid with:
+ * - Live streaming data (WebSocket mock feed)
+ * - 50 symbols with continuous updates
+ * - Pause/Resume controls
+ * - Performance metrics
+ * - Connection status
+ * - Density mode toggle
+ * - Flash animations
+ */
+import React from 'react';
+import './LiveMarketDemo.css';
+/**
+ * LiveMarketDemo Component
+ */
+export declare const LiveMarketDemo: React.FC;

package/dist/assets/components/MarketDataExamples.d.ts

@@ -0,0 +1,42 @@
+/**
+ * MARKET_DATA_EXAMPLE.tsx
+ *
+ * Complete working example of Market Data Mode implementation.
+ * Copy this file to get started quickly with live market data.
+ */
+import React from 'react';
+/**
+ * Simple Market Data Example
+ *
+ * This example demonstrates:
+ * - Creating a market data engine
+ * - Setting up a mock WebSocket feed
+ * - Configuring columns for market data
+ * - Rendering the grid with live updates
+ */
+export declare const SimpleMarketExample: React.FC;
+/**
+ * Advanced Market Data Example
+ *
+ * This example demonstrates:
+ * - Full control panel with pause/resume
+ * - Performance metrics display
+ * - Density mode toggle
+ * - Flash animation toggle
+ * - Connection status
+ */
+export declare const AdvancedMarketExample: React.FC;
+/**
+ * Real WebSocket Example
+ *
+ * This example shows how to connect to a real WebSocket server.
+ * Replace the URL with your actual WebSocket endpoint.
+ */
+export declare const RealWebSocketExample: React.FC;
+/**
+ * Custom Formatting Example
+ *
+ * Shows how to customize cell rendering for market data.
+ */
+export declare const CustomFormattingExample: React.FC;
+export default SimpleMarketExample;

package/dist/assets/components/RowDraggingDemo.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+export declare const RowDraggingDemo: React.FC;
+export default RowDraggingDemo;

package/dist/assets/components/RowPinningDemo.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+/**
+ * RowPinningDemo - Demonstrates row pinning feature
+ *
+ * This demo showcases:
+ * - Pin rows to top or bottom
+ * - Pinned rows remain sticky during scroll
+ * - Works with sorting and filtering
+ * - Works with virtual scrolling
+ * - Context menu integration
+ */
+export declare const RowPinningDemo: React.FC;

package/dist/assets/components/ThemesDemo.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+/**
+ * ThemesDemo - Showcase of DataGrid Theme System
+ *
+ * Demonstrates all available themes:
+ * - Quartz (Modern White)
+ * - Alpine (Classic Business)
+ * - Material
+ * - Dark Mode
+ * - Nord (Arctic)
+ * - Dracula
+ * - Solarized Light
+ * - Solarized Dark
+ * - Monokai
+ * - One Dark
+ */
+export declare const ThemesDemo: React.FC;

package/dist/assets/components/TooltipDemo.d.ts

@@ -0,0 +1 @@
+export declare const TooltipDemo: () => import("react/jsx-runtime").JSX.Element;

package/dist/assets/components/TreeDataDemo.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+export declare const TreeDataDemo: React.FC;
+export default TreeDataDemo;

package/dist/assets/components/VirtualScrollDemo.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+/**
+ * VirtualScrollDemo - Demonstrates virtual scrolling with large datasets
+ *
+ * This demo showcases:
+ * - 50,000+ rows
+ * - 200+ columns
+ * - Ultra-fast rendering with windowing
+ * - Dynamic row heights
+ * - Cell recycling
+ */
+export declare const VirtualScrollDemo: React.FC;
+export default VirtualScrollDemo;