gantt-task-react-v 1.2.14 → 1.3.2

package/dist/helpers/use-optimized-svg-rendering.d.ts

@@ -0,0 +1,117 @@
+import React from "react";
+import { RenderTask, TaskCoordinates } from "../types";
+export interface SVGBatch {
+    tasks: RenderTask[];
+    dependencies: string[];
+    selectedTasks: string[];
+    holidays: string[];
+}
+export interface SVGRenderContext {
+    additionalLeftSpace: number;
+    fullRowHeight: number;
+    taskHeight: number;
+    svgWidth: number;
+    svgHeight: number;
+}
+/**
+ * Hook for batched SVG rendering to reduce DOM operations
+ */
+export declare const useBatchedSVGRenderer: () => {
+    clearBatch: () => void;
+    addTaskToBatch: (task: RenderTask) => void;
+    addDependencyToBatch: (dependency: string) => void;
+    addSelectedTaskToBatch: (selectedTask: string) => void;
+    addHolidayToBatch: (holiday: string) => void;
+    getBatchData: () => {
+        tasks: RenderTask[];
+        dependencies: string[];
+        selectedTasks: string[];
+        holidays: string[];
+    };
+    currentBatch: SVGBatch;
+};
+/**
+ * Hook for SVG element pooling to reuse DOM elements
+ */
+export declare const useSVGElementPool: () => {
+    acquireRect: () => SVGRectElement;
+    releaseRect: (rect: SVGRectElement) => void;
+    acquirePath: () => SVGPathElement;
+    releasePath: (path: SVGPathElement) => void;
+    acquireText: () => SVGTextElement;
+    releaseText: (text: SVGTextElement) => void;
+    acquireGroup: () => SVGGElement;
+    releaseGroup: (group: SVGGElement) => void;
+    clearPools: () => void;
+};
+/**
+ * Hook for virtual SVG rendering - only renders visible elements
+ */
+export declare const useVirtualSVGRenderer: (allTasks: RenderTask[], getTaskCoordinates: (task: RenderTask) => TaskCoordinates, viewportBounds: {
+    minX: number;
+    maxX: number;
+    minY: number;
+    maxY: number;
+}) => {
+    visibleTasks: RenderTask[];
+    getVisibleTasksInRange: (startIndex: number, endIndex: number) => RenderTask[];
+    totalVisibleCount: number;
+};
+/**
+ * Hook for optimized SVG coordinate transformations
+ */
+export declare const useSVGCoordinateTransforms: () => {
+    getTransform: (x: number, y: number) => string;
+    getScaleTransform: (scaleX: number, scaleY: number) => string;
+    clearTransformCache: () => void;
+};
+/**
+ * Hook for Level-of-Detail (LOD) rendering
+ * Reduces rendering complexity based on zoom level
+ */
+export declare const useLODRenderer: (zoomLevel: number, taskCount: number) => {
+    showLabels: boolean;
+    showProgress: boolean;
+    showDependencies: boolean;
+    taskDetail: "minimal";
+    maxVisibleTasks: number;
+} | {
+    showLabels: boolean;
+    showProgress: boolean;
+    showDependencies: boolean;
+    taskDetail: "reduced";
+    maxVisibleTasks: number;
+} | {
+    showLabels: boolean;
+    showProgress: boolean;
+    showDependencies: boolean;
+    taskDetail: "full";
+    maxVisibleTasks: number;
+};
+/**
+ * Hook for efficient SVG path generation
+ */
+export declare const useSVGPathGenerator: () => {
+    generateTaskPath: (x: number, y: number, width: number, height: number, cornerRadius?: number) => string;
+    generateProgressPath: (x: number, y: number, width: number, height: number, progressPercent: number) => string;
+    generateArrowPath: (fromX: number, fromY: number, toX: number, toY: number, arrowSize?: number) => string;
+    clearPathCache: () => void;
+};
+/**
+ * Hook for SVG performance optimization
+ */
+export declare const useSVGPerformanceOptimizer: () => {
+    optimizeRenderList: (elements: React.ReactElement[]) => React.ReactElement<any, string | React.JSXElementConstructor<any>>[];
+    batchSVGUpdates: (updates: Array<() => void>) => void;
+    shouldSkipRender: (bounds: {
+        x: number;
+        y: number;
+        width?: number;
+        height?: number;
+    }, viewportBounds: {
+        minX: number;
+        maxX: number;
+        minY: number;
+        maxY: number;
+    }) => boolean;
+};

package/dist/helpers/use-performance-monitor.d.ts

@@ -0,0 +1,106 @@
+export interface PerformanceMetrics {
+    renderTime: number;
+    coordinateCalculationTime: number;
+    dependencyCalculationTime: number;
+    sortingTime: number;
+    totalTasks: number;
+    visibleTasks: number;
+    fps: number;
+    memoryUsage: number;
+    timestamp: number;
+}
+export interface PerformanceBenchmark {
+    name: string;
+    startTime: number;
+    endTime?: number;
+    duration?: number;
+    metadata?: Record<string, unknown>;
+}
+/**
+ * Performance monitor for tracking Gantt chart performance metrics
+ */
+export declare const usePerformanceMonitor: (enabled?: boolean) => {
+    startMeasurement: (name: string, metadata?: Record<string, unknown>) => void;
+    endMeasurement: (name: string) => number;
+    measureFunction: <T extends unknown[], R>(name: string, fn: (...args: T) => R, metadata?: Record<string, unknown>) => (...args: T) => R;
+    measureAsyncFunction: <T_1 extends unknown[], R_1>(name: string, fn: (...args: T_1) => Promise<R_1>, metadata?: Record<string, unknown>) => (...args: T_1) => Promise<R_1>;
+    getPerformanceReport: () => {
+        measurements: Record<string, {
+            count: number;
+            totalTime: number;
+            avgTime: number;
+            maxTime: number;
+            minTime: number;
+        }>;
+        fps: number;
+        currentMetrics: PerformanceMetrics;
+        allMetrics: PerformanceMetrics[];
+    };
+    addMetrics: (metrics: Omit<PerformanceMetrics, "timestamp">) => void;
+    clearMeasurements: () => void;
+    updateFPS: () => void;
+    getFPS: () => number;
+    getMemoryUsage: () => number;
+    enabled: boolean;
+};
+/**
+ * Hook for measuring render performance
+ */
+export declare const useRenderPerformance: (componentName: string) => {
+    measureRender: (fn: () => void) => () => void;
+    renderCount: number;
+    lastRenderTime: number;
+};
+/**
+ * Hook for performance budgeting
+ */
+export declare const usePerformanceBudget: (budgets: Record<string, number>) => {
+    checkBudgets: () => {
+        operation: string;
+        actual: number;
+        budget: number;
+        timestamp: number;
+    }[];
+    getBudgetStatus: () => Record<string, {
+        budget: number;
+        actual: number;
+        status: "ok" | "warning" | "violation";
+    }>;
+    violations: {
+        operation: string;
+        actual: number;
+        budget: number;
+        timestamp: number;
+    }[];
+};
+/**
+ * Hook for performance-aware rendering
+ * Automatically reduces quality when performance is poor
+ */
+export declare const useAdaptivePerformance: (thresholds: {
+    fpsThreshold: number;
+    renderTimeThreshold: number;
+}) => {
+    performanceLevel: "medium" | "high" | "low";
+    updatePerformanceLevel: () => "medium" | "high" | "low";
+    getQualitySettings: () => {
+        enableAnimations: boolean;
+        renderQuality: string;
+        maxVisibleTasks: number;
+        updateFrequency: number;
+    };
+};
+/**
+ * Hook for throttling expensive operations based on performance
+ */
+export declare const usePerformanceThrottling: () => {
+    throttle: <T extends unknown[], R>(key: string, fn: (...args: T) => R, baseDelay?: number) => (...args: T) => R | undefined;
+};
+/**
+ * Development-only performance debugging utilities
+ */
+export declare const usePerformanceDebugger: () => {
+    logPerformanceReport: () => void;
+    exportPerformanceData: () => void;
+    clearMeasurements: () => void;
+};

package/dist/helpers/use-progressive-loading.d.ts

@@ -0,0 +1,63 @@
+import { RenderTask } from "../types";
+import type { OptimizedListParams } from "./use-optimized-list";
+export interface ProgressiveLoadingConfig {
+    /** Number of tasks to load per chunk */
+    chunkSize: number;
+    /** Buffer size for preloading (in chunks) */
+    preloadBuffer: number;
+    /** Function to load a chunk of tasks */
+    loadTaskChunk: (startIndex: number, endIndex: number) => Promise<RenderTask[]>;
+    /** Total number of tasks available */
+    totalTaskCount: number;
+    /** Enable progressive loading */
+    enabled: boolean;
+}
+export interface ProgressiveLoadingState {
+    /** Currently loaded tasks */
+    loadedTasks: readonly RenderTask[];
+    /** Loading state */
+    isLoading: boolean;
+    /** Error state */
+    error: Error | null;
+    /** Loaded chunk ranges */
+    loadedRanges: Set<string>;
+    /** Currently loading chunks */
+    loadingChunks: Set<string>;
+}
+/**
+ * Hook for progressive loading of large task datasets
+ * Loads tasks in chunks based on viewport visibility
+ */
+export declare const useProgressiveLoading: (initialTasks: readonly RenderTask[], config: Partial<ProgressiveLoadingConfig>, renderedIndexes: OptimizedListParams | null) => ProgressiveLoadingState & {
+    /** Force load a specific range */
+    loadRange: (startIndex: number, endIndex: number) => Promise<void>;
+    /** Preload next chunks based on scroll direction */
+    preloadNext: (direction: "up" | "down") => Promise<void>;
+    /** Clear loaded data and reset */
+    reset: () => void;
+};
+/**
+ * Hook for chunked task processing
+ * Processes large task arrays in smaller chunks to avoid blocking the main thread
+ */
+export declare const useChunkedProcessing: <T, R>(data: T[], processor: (chunk: T[]) => R[], chunkSize?: number) => {
+    processedData: R[];
+    isProcessing: boolean;
+    progress: number;
+};
+/**
+ * Enhanced progressive loading with smart caching
+ */
+export declare const useSmartProgressiveLoading: (config: Partial<ProgressiveLoadingConfig> & {
+    /** Cache expiry time in milliseconds */
+    cacheExpiry?: number;
+    /** Maximum cache size (number of chunks) */
+    maxCacheSize?: number;
+}, renderedIndexes: OptimizedListParams | null) => ProgressiveLoadingState & {
+    /** Force load a specific range */
+    loadRange: (startIndex: number, endIndex: number) => Promise<void>;
+    /** Preload next chunks based on scroll direction */
+    preloadNext: (direction: "up" | "down") => Promise<void>;
+    /** Clear loaded data and reset */
+    reset: () => void;
+};

package/dist/helpers/use-spatial-dependency-map.d.ts

@@ -0,0 +1,49 @@
+import { DependencyMap, DependentMap, DependencyMargins, ExpandedDependency, ExpandedDependent, MapTaskToCoordinates, TaskMapByLevel, RenderTask, TaskCoordinates } from "../types";
+import type { OptimizedListParams } from "./use-optimized-list";
+interface SpatialBounds {
+    minX: number;
+    maxX: number;
+    minY: number;
+    maxY: number;
+}
+interface SpatialNode {
+    taskId: string;
+    bounds: SpatialBounds;
+    dependencies: ExpandedDependency[];
+    dependents: ExpandedDependent[];
+}
+/**
+ * Spatial hash map for efficient spatial queries
+ * Divides space into grid cells for O(1) spatial lookups
+ */
+declare class SpatialHashMap {
+    private cellSize;
+    private grid;
+    private taskNodes;
+    constructor(cellSize?: number);
+    private getBoundsFromCoordinates;
+    insert(taskId: string, coordinates: TaskCoordinates, dependencies?: ExpandedDependency[], dependents?: ExpandedDependent[]): void;
+    query(bounds: SpatialBounds): SpatialNode[];
+    private boundsIntersect;
+    getNode(taskId: string): SpatialNode | undefined;
+    clear(): void;
+    remove(taskId: string): void;
+}
+/**
+ * Hook for optimized dependency calculations using spatial indexing
+ */
+export declare const useSpatialDependencyMap: (tasks: readonly RenderTask[], visibleTasksMirror: Readonly<Record<string, true>>, tasksMap: TaskMapByLevel, mapTaskToCoordinates: MapTaskToCoordinates, fullRowHeight: number, isShowCriticalPath: boolean, renderedRowIndexes: OptimizedListParams | null, renderedColumnIndexes: OptimizedListParams | null) => [DependencyMap, DependentMap, DependencyMargins, SpatialHashMap];
+/**
+ * Hook for querying dependencies in a specific spatial region
+ */
+export declare const useSpatialDependencyQuery: (spatialMap: SpatialHashMap, queryBounds: SpatialBounds) => SpatialNode[];
+/**
+ * Hook for optimized dependency updates
+ * Only recalculates dependencies for tasks that actually changed
+ */
+export declare const useIncrementalDependencyUpdate: (spatialMap: SpatialHashMap, changedTaskIds: Set<string>, allTasks: readonly RenderTask[]) => (newTaskCoordinates: Map<string, TaskCoordinates>) => void;
+/**
+ * Utility function to create viewport bounds from rendered indexes
+ */
+export declare const createViewportBounds: (renderedRowIndexes: OptimizedListParams | null, renderedColumnIndexes: OptimizedListParams | null, fullRowHeight: number, columnWidth: number) => SpatialBounds | null;
+export {};

package/dist/helpers/use-web-worker.d.ts

@@ -0,0 +1,50 @@
+import { RenderTask, ViewMode, Distances, TaskCoordinates } from "../types";
+export interface WorkerMessage {
+    id: string;
+    type: "calculate-coordinates" | "process-dependencies" | "sort-tasks" | "filter-tasks";
+    data: unknown;
+}
+export interface WorkerResponse {
+    id: string;
+    type: string;
+    result?: unknown;
+    error?: string;
+}
+export interface CoordinateCalculationData {
+    tasks: RenderTask[];
+    startDate: number;
+    viewMode: ViewMode;
+    rtl: boolean;
+    fullRowHeight: number;
+    taskHeight: number;
+    taskYOffset: number;
+    distances: Distances;
+    svgWidth: number;
+}
+/**
+ * Hook for managing Web Worker communications for heavy calculations
+ */
+export declare const useGanttWebWorker: () => {
+    isWorkerAvailable: boolean;
+    sendMessage: (message: Omit<WorkerMessage, "id">, timeoutMs?: number) => Promise<unknown>;
+};
+/**
+ * Hook for calculating task coordinates using Web Worker
+ */
+export declare const useWorkerCoordinateCalculation: (tasks: readonly RenderTask[], startDate: Date, viewMode: ViewMode, rtl: boolean, fullRowHeight: number, taskHeight: number, taskYOffset: number, distances: Distances, svgWidth: number) => {
+    coordinates: Map<string, TaskCoordinates>;
+    isCalculating: boolean;
+    recalculate: () => Promise<Map<string, TaskCoordinates>>;
+};
+/**
+ * Hook for sorting tasks using Web Worker
+ */
+export declare const useWorkerTaskSorting: () => {
+    sortTasks: (tasks: RenderTask[]) => Promise<RenderTask[]>;
+};
+/**
+ * Hook for filtering tasks using Web Worker
+ */
+export declare const useWorkerTaskFiltering: () => {
+    filterTasks: (tasks: RenderTask[], filterFn: string) => Promise<RenderTask[]>;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gantt-task-react-v",
-  "version": "1.2.14",
+  "version": "1.3.2",
   "description": "Interactive Gantt Chart for React with TypeScript.",
   "author": "aguilanbon",
   "homepage": "https://github.com/aguilanbon/gantt-task-react-v",
@@ -43,8 +43,9 @@
     "@floating-ui/dom": "1.6.3",
     "@floating-ui/react": "0.26.11",
     "date-fns": "3.6.0",
-    "i18next": "^24.0.5",
-    "react-i18next": "^15.1.3"
+    "i18next": "^25.5.2",
+    "react-i18next": "^15.7.3",
+    "react-window": "^2.1.1"
   },
   "peerDependencies": {
     "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc",
@@ -61,11 +62,11 @@
     "@storybook/addon-onboarding": "8.2.10",
     "@storybook/blocks": "8.2.10",
     "@storybook/cli": "8.2.10",
+    "@storybook/core-server": "8.2.10",
+    "@storybook/jest": "0.2.3",
     "@storybook/react": "8.2.10",
     "@storybook/react-vite": "8.2.10",
     "@storybook/test": "8.2.10",
-    "@storybook/core-server": "8.2.10",
-    "@storybook/jest": "0.2.3",
     "@storybook/test-runner": "0.23.0",
     "@storybook/testing-library": "^0.2.2",
     "@testing-library/jest-dom": "^6.4.2",
@@ -75,6 +76,7 @@
     "@types/node": "^20.12.4",
     "@types/react": "^18.2.74",
     "@types/react-dom": "^18.2.24",
+    "@types/react-window": "^1.8.8",
     "@typescript-eslint/eslint-plugin": "^7.5.0",
     "@typescript-eslint/parser": "^7.5.0",
     "@vitejs/plugin-react": "4.2.1",