@devexperts/dxcharts-lite 2.7.16 → 2.7.18

package/dist/chart/utils/performance/queue-microtask.utils.d.ts

@@ -0,0 +1,5 @@
+/*
+ * Copyright (C) 2019 - 2025 Devexperts Solutions IE Limited
+ * This Source Code Form is subject to the terms of the Mozilla Public License, v. 2.0.
+ * If a copy of the MPL was not distributed with this file, You can obtain one at https://mozilla.org/MPL/2.0/.
+ */

package/dist/chart/utils/performance/queue-microtask.utils.js

@@ -0,0 +1,12 @@
+/*
+ * Copyright (C) 2019 - 2025 Devexperts Solutions IE Limited
+ * This Source Code Form is subject to the terms of the Mozilla Public License, v. 2.0.
+ * If a copy of the MPL was not distributed with this file, You can obtain one at https://mozilla.org/MPL/2.0/.
+ */
+"use strict";
+// Polyfill for queueMicrotask in jsdom
+if (typeof window.queueMicrotask === 'undefined') {
+    window.queueMicrotask = (callback) => {
+        Promise.resolve().then(callback);
+    };
+}

package/dist/chart/utils/performance/request-animation-frame-throttle.utils.d.ts

@@ -6,6 +6,7 @@
 export declare let animationFrameId: number;
 export declare const animationFrameThrottled: (name: string, action: () => void) => void;
 export declare const cancelThrottledAnimationFrame: (name: string) => void;
+export declare const cancelThrottledAnimationFramePrior: (name: string) => void;
 /**
  * Prior actions will be called before regular actions
  * An example of regular action - draw event

package/dist/chart/utils/performance/request-animation-frame-throttle.utils.js

@@ -31,6 +31,9 @@ export const animationFrameThrottled = (name, action) => {
 export const cancelThrottledAnimationFrame = (name) => {
     actions.delete(name);
 };
+export const cancelThrottledAnimationFramePrior = (name) => {
+    priorActions.delete(name);
+};
 /**
  * Prior actions will be called before regular actions
  * An example of regular action - draw event

package/dist/chart/utils/performance/safari/components/animations/safari-canvas-animation.d.ts

@@ -0,0 +1,77 @@
+/*
+ * Copyright (C) 2019 - 2025 Devexperts Solutions IE Limited
+ * This Source Code Form is subject to the terms of the Mozilla Public License, v. 2.0.
+ * If a copy of the MPL was not distributed with this file, You can obtain one at https://mozilla.org/MPL/2.0/.
+ */
+import { BehaviorSubject } from 'rxjs';
+import EventBus from '../../../../../events/event-bus';
+import { ViewportModel } from '../../../../../model/scaling/viewport.model';
+import { ViewportMovementAnimation, ViewportMovementAnimationConfig } from '../../../../../animation/types/viewport-movement-animation';
+import { AnimationConfig, CanvasAnimation } from '../../../../../animation/canvas-animation';
+import { ColorAlphaAnimation, ColorAlphaAnimationConfig } from '../../../../../animation/types/color-alpha-animation';
+import { ColorTransitionAnimation, ColorTransitionAnimationConfig } from '../../../../../animation/types/color-transition-animation';
+export declare class SafariCanvasAnimation extends CanvasAnimation {
+    animations: Record<string, any>;
+    animFrameId: string;
+    animationInProgressSubject: BehaviorSubject<boolean>;
+    private microtaskQueued;
+    constructor(eventBus: EventBus);
+    /**
+     * Starts a viewport movement animation with the given configuration and adds it to the list of animations.
+     * @param {ViewportModel} viewportModel - The viewport model to animate.
+     * @param {ViewportMovementAnimationConfig} config - The configuration for the animation.
+     * @param {string} [uniqueAnimationId=VIEWPORT_ANIMATION_ID] - The unique ID for the animation.
+     * @param {Function} [onTickFunction] - The function to be called on each tick of the animation.
+     * @returns {ViewportMovementAnimation} The container for the created animation.
+     */
+    startViewportMovementAnimation(viewportModel: ViewportModel, config: ViewportMovementAnimationConfig, uniqueAnimationId: string | undefined, onTickFunction: {
+        (): boolean;
+        (): void;
+    }): ViewportMovementAnimation;
+    /**
+     * Starts a color alpha animation with the given configuration and adds it to the list of animations.
+     * @param {string} uniqueAnimationId - A unique identifier for the animation.
+     * @param {Array<ColorAlphaAnimationConfig>} colorConfigs - An array of color alpha animation configurations.
+     * @param {() => void} [onTickFunction] - A function to be called on each animation tick.
+     * @param {Partial<ACAnimationConfig>} [animationConfig] - An optional configuration for the animation.
+     * @returns {ColorAlphaAnimation} - The created animation container.
+     */
+    startColorAlphaAnimation(uniqueAnimationId: string, colorConfigs: Array<ColorAlphaAnimationConfig>, onTickFunction?: (() => void) | undefined, animationConfig?: AnimationConfig): ColorAlphaAnimation;
+    /**
+     * Starts a color transition animation with the given configurations and duration.
+     * @param {string} uniqueAnimationId - A unique identifier for the animation.
+     * @param {Array<ColorTransitionAnimationConfig>} colorConfigs - An array of color transition configurations.
+     * @param {number} [duration=DEFAULT_ANIMATION_TIME] - The duration of the animation in milliseconds.
+     * @param {Function} [onTickFunction] - A function to be called on each tick of the animation.
+     * @returns {ColorTransitionAnimation} - The created animation container.
+     */
+    startColorTransitionAnimation(uniqueAnimationId: string, colorConfigs: Array<ColorTransitionAnimationConfig>, duration?: number, onTickFunction?: () => void): ColorTransitionAnimation;
+    /**
+     * This function takes an id as a string and returns an animation container object of type T. It retrieves the animation container object from the animations object using the provided id. The @ts-ignore comment is used to ignore any TypeScript errors that may occur due to the dynamic nature of the function.
+     */
+    getAnimation(id: string | number): any;
+    /**
+     * Returns a ColorAlphaAnimation object for the given animation ID.
+     *
+     * @param {string} id - The ID of the animation to retrieve.
+     * @returns {ColorAlphaAnimation} - The ColorAlphaAnimation object for the given ID.
+     */
+    getColorAlphaAnimation(id: string): any;
+    /**
+     * Returns a ColorTransitionAnimation object for the given id.
+     * @param {string} id - The id of the animation to retrieve.
+     * @returns {ColorTransitionAnimation} - The ColorTransitionAnimation object for the given id.
+     */
+    getColorTransitionAnimation(id: string): any;
+    /**
+     * Stops the animation with the given ID.
+     * @param {string} id - The ID of the animation to be stopped.
+     * @returns {void}
+     */
+    forceStopAnimation(id: string): void;
+    /**
+     * This is a private method that iterates through all the animations in the container and calls their tick method. If any animation is still in progress, it sets the allCompleted flag to false. If all animations are completed, it stops the interval. If not, it fires the draw event.
+     */
+    tick(): void;
+    stopInterval(): void;
+}

package/dist/chart/utils/performance/safari/components/animations/safari-canvas-animation.js

@@ -0,0 +1,137 @@
+/*
+ * Copyright (C) 2019 - 2025 Devexperts Solutions IE Limited
+ * This Source Code Form is subject to the terms of the Mozilla Public License, v. 2.0.
+ * If a copy of the MPL was not distributed with this file, You can obtain one at https://mozilla.org/MPL/2.0/.
+ */
+import { BehaviorSubject } from 'rxjs';
+import { cancelThrottledAnimationFramePrior } from '../../../../../utils/performance/request-animation-frame-throttle.utils';
+import { ViewportMovementAnimation, } from '../../../../../animation/types/viewport-movement-animation';
+import { CanvasAnimation, DEFAULT_ANIMATION_TIME_MS, VIEWPORT_ANIMATION_ID, } from '../../../../../animation/canvas-animation';
+import { ColorAlphaAnimation } from '../../../../../animation/types/color-alpha-animation';
+import { ColorTransitionAnimation, } from '../../../../../animation/types/color-transition-animation';
+export class SafariCanvasAnimation extends CanvasAnimation {
+    constructor(eventBus) {
+        super(eventBus);
+        this.animations = {};
+        this.animFrameId = 'animation';
+        this.animationInProgressSubject = new BehaviorSubject(false);
+        this.microtaskQueued = false; // Flag to prevent accumulation of queueMicrotask calls
+    }
+    /**
+     * Starts a viewport movement animation with the given configuration and adds it to the list of animations.
+     * @param {ViewportModel} viewportModel - The viewport model to animate.
+     * @param {ViewportMovementAnimationConfig} config - The configuration for the animation.
+     * @param {string} [uniqueAnimationId=VIEWPORT_ANIMATION_ID] - The unique ID for the animation.
+     * @param {Function} [onTickFunction] - The function to be called on each tick of the animation.
+     * @returns {ViewportMovementAnimation} The container for the created animation.
+     */
+    startViewportMovementAnimation(viewportModel, config, uniqueAnimationId = VIEWPORT_ANIMATION_ID, onTickFunction) {
+        const animation = new ViewportMovementAnimation(viewportModel, config, onTickFunction);
+        this.animations[uniqueAnimationId] = animation;
+        this.processAnimation();
+        return animation;
+    }
+    /**
+     * Starts a color alpha animation with the given configuration and adds it to the list of animations.
+     * @param {string} uniqueAnimationId - A unique identifier for the animation.
+     * @param {Array<ColorAlphaAnimationConfig>} colorConfigs - An array of color alpha animation configurations.
+     * @param {() => void} [onTickFunction] - A function to be called on each animation tick.
+     * @param {Partial<ACAnimationConfig>} [animationConfig] - An optional configuration for the animation.
+     * @returns {ColorAlphaAnimation} - The created animation container.
+     */
+    startColorAlphaAnimation(uniqueAnimationId, colorConfigs, onTickFunction, animationConfig) {
+        const animation = new ColorAlphaAnimation(Object.assign(Object.assign({}, animationConfig), { duration: (animationConfig && animationConfig.duration) || DEFAULT_ANIMATION_TIME_MS }), colorConfigs, onTickFunction);
+        this.animations[uniqueAnimationId] = animation;
+        this.processAnimation();
+        return animation;
+    }
+    /**
+     * Starts a color transition animation with the given configurations and duration.
+     * @param {string} uniqueAnimationId - A unique identifier for the animation.
+     * @param {Array<ColorTransitionAnimationConfig>} colorConfigs - An array of color transition configurations.
+     * @param {number} [duration=DEFAULT_ANIMATION_TIME] - The duration of the animation in milliseconds.
+     * @param {Function} [onTickFunction] - A function to be called on each tick of the animation.
+     * @returns {ColorTransitionAnimation} - The created animation container.
+     */
+    startColorTransitionAnimation(uniqueAnimationId, colorConfigs, duration = DEFAULT_ANIMATION_TIME_MS, onTickFunction) {
+        const animation = new ColorTransitionAnimation({ duration }, colorConfigs, onTickFunction);
+        this.animations[uniqueAnimationId] = animation;
+        this.processAnimation();
+        return animation;
+    }
+    /**
+     * This function takes an id as a string and returns an animation container object of type T. It retrieves the animation container object from the animations object using the provided id. The @ts-ignore comment is used to ignore any TypeScript errors that may occur due to the dynamic nature of the function.
+     */
+    getAnimation(id) {
+        // @ts-ignore
+        return this.animations[id];
+    }
+    /**
+     * Returns a ColorAlphaAnimation object for the given animation ID.
+     *
+     * @param {string} id - The ID of the animation to retrieve.
+     * @returns {ColorAlphaAnimation} - The ColorAlphaAnimation object for the given ID.
+     */
+    getColorAlphaAnimation(id) {
+        return this.getAnimation(id);
+    }
+    /**
+     * Returns a ColorTransitionAnimation object for the given id.
+     * @param {string} id - The id of the animation to retrieve.
+     * @returns {ColorTransitionAnimation} - The ColorTransitionAnimation object for the given id.
+     */
+    getColorTransitionAnimation(id) {
+        return this.getAnimation(id);
+    }
+    /**
+     * Stops the animation with the given ID.
+     * @param {string} id - The ID of the animation to be stopped.
+     * @returns {void}
+     */
+    forceStopAnimation(id) {
+        const animation = this.animations[id];
+        if (animation) {
+            animation.animationInProgress = false;
+            animation.animationStartTime = 0;
+            // CRITICAL: Completely remove the animation to prevent it from being processed in tick()
+            delete this.animations[id];
+        }
+        // Stop the animation loop if no animations are running
+        if (Object.keys(this.animations).length === 0) {
+            this.stopInterval();
+        }
+    }
+    /**
+     * This is a private method that iterates through all the animations in the container and calls their tick method. If any animation is still in progress, it sets the allCompleted flag to false. If all animations are completed, it stops the interval. If not, it fires the draw event.
+     */
+    tick() {
+        let allCompleted = true;
+        for (const i of Object.keys(this.animations)) {
+            const animation = this.animations[i];
+            animation.tick();
+            if (animation.animationInProgress) {
+                allCompleted = false;
+            }
+        }
+        this.animationInProgressSubject.next(!allCompleted);
+        if (!allCompleted) {
+            // CRITICAL: Prevent accumulation of queueMicrotask calls during rapid animation updates
+            if (!this.microtaskQueued) {
+                this.microtaskQueued = true;
+                queueMicrotask(() => {
+                    this.microtaskQueued = false; // Reset flag when microtask executes
+                    this.processAnimation();
+                    this.eventBus.fireDraw();
+                });
+            }
+        }
+        else {
+            this.stopInterval();
+        }
+    }
+    stopInterval() {
+        cancelThrottledAnimationFramePrior(this.animFrameId);
+        // Reset microtask flag to ensure clean state
+        this.microtaskQueued = false;
+    }
+}

package/dist/chart/utils/performance/safari/components/chart-area-pan.handler/safari-chart-area-pan.handler.d.ts

@@ -0,0 +1,54 @@
+/*
+ * Copyright (C) 2019 - 2025 Devexperts Solutions IE Limited
+ * This Source Code Form is subject to the terms of the Mozilla Public License, v. 2.0.
+ * If a copy of the MPL was not distributed with this file, You can obtain one at https://mozilla.org/MPL/2.0/.
+ */
+import { CanvasAnimation } from '../../../../../animation/canvas-animation';
+import { CanvasBoundsContainer } from '../../../../../canvas/canvas-bounds-container';
+import { FullChartConfig } from '../../../../../chart.config';
+import EventBus from '../../../../../events/event-bus';
+import { CanvasInputListenerComponent, Point } from '../../../../../inputlisteners/canvas-input-listener.component';
+import { ScaleModel } from '../../../../../model/scale.model';
+import { HitTestCanvasModel } from '../../../../../model/hit-test-canvas.model';
+import { ChartPanComponent } from '../../../../../components/pan/chart-pan.component';
+import { ChartAreaPanHandler, ChartPanningOptions } from '../../../../../components/chart/chart-area-pan.handler';
+/**
+ * SafariChartAreaPanHandler is a class that handles the panning and zooming of the chart area for Safari.
+ */
+export declare class SafariChartAreaPanHandler extends ChartAreaPanHandler {
+    protected bus: EventBus;
+    protected config: FullChartConfig;
+    protected scale: ScaleModel;
+    protected canvasInputListener: CanvasInputListenerComponent;
+    protected canvasBoundsContainer: CanvasBoundsContainer;
+    protected canvasAnimation: CanvasAnimation;
+    protected chartPanComponent: ChartPanComponent;
+    protected hitTestCanvasModel: HitTestCanvasModel;
+    protected currentPoint: Point;
+    xDraggedCandlesDelta: number;
+    lastXStart: number;
+    wheelThrottleTime: number;
+    private wheelSubscription;
+    private initFrameId;
+    private isActivated;
+    private lastWheelTime;
+    private wheelCount;
+    private consecutiveLowWheelEvents;
+    chartPanningOptions: ChartPanningOptions;
+    constructor(bus: EventBus, config: FullChartConfig, scale: ScaleModel, canvasInputListener: CanvasInputListenerComponent, canvasBoundsContainer: CanvasBoundsContainer, canvasAnimation: CanvasAnimation, chartPanComponent: ChartPanComponent, hitTestCanvasModel: HitTestCanvasModel);
+    /**
+     * This method is used to activate the zoom functionality of the canvas. It extends the doActivate method of the parent class.
+     * @protected
+     * @returns {void}
+     */
+    protected doActivate(): void;
+    /**
+     * Creates wheel subscription with optimized throttling
+     */
+    private createWheelSubscription;
+    /**
+     * Manual cleanup trigger for immediate performance recovery
+     */
+    triggerPerformanceCleanup(): void;
+    protected doDeactivate(): void;
+}

package/dist/chart/utils/performance/safari/components/chart-area-pan.handler/safari-chart-area-pan.handler.js

@@ -0,0 +1,180 @@
+/*
+ * Copyright (C) 2019 - 2025 Devexperts Solutions IE Limited
+ * This Source Code Form is subject to the terms of the Mozilla Public License, v. 2.0.
+ * If a copy of the MPL was not distributed with this file, You can obtain one at https://mozilla.org/MPL/2.0/.
+ */
+import { animationFrameScheduler } from 'rxjs';
+import { throttleTime, filter, debounceTime } from 'rxjs/operators';
+import { CanvasElement } from '../../../../../canvas/canvas-bounds-container';
+import { pixelsToUnits } from '../../../../../model/scaling/viewport.model';
+import { deviceDetector } from '../../../../../utils/device/device-detector.utils';
+import { ONE_FRAME_MS } from '../../../../../utils/numeric-constants.utils';
+import { EVENT_RESIZED } from '../../../../../events/events';
+import { DEFAULT_THROTTLE_MS, LARGE_SCREEN_PIXEL_THRESHOLD, LARGE_SCREEN_THROTTLE_MS, LOW_WHEEL_EVENTS_THRESHOLD, SAFARI_THROTTLE_MS, WHEEL_MONITORING_INTERVAL_MS, } from '../../safari-performance.model';
+import { ChartAreaPanHandler } from '../../../../../components/chart/chart-area-pan.handler';
+/**
+ * SafariChartAreaPanHandler is a class that handles the panning and zooming of the chart area for Safari.
+ */
+export class SafariChartAreaPanHandler extends ChartAreaPanHandler {
+    constructor(bus, config, scale, canvasInputListener, canvasBoundsContainer, canvasAnimation, chartPanComponent, hitTestCanvasModel) {
+        super(bus, config, scale, canvasInputListener, canvasBoundsContainer, canvasAnimation, chartPanComponent, hitTestCanvasModel);
+        this.bus = bus;
+        this.config = config;
+        this.scale = scale;
+        this.canvasInputListener = canvasInputListener;
+        this.canvasBoundsContainer = canvasBoundsContainer;
+        this.canvasAnimation = canvasAnimation;
+        this.chartPanComponent = chartPanComponent;
+        this.hitTestCanvasModel = hitTestCanvasModel;
+        this.currentPoint = { x: 0, y: 0 };
+        this.xDraggedCandlesDelta = 0;
+        this.lastXStart = 0;
+        this.wheelThrottleTime = ONE_FRAME_MS;
+        this.wheelSubscription = null;
+        this.initFrameId = null;
+        this.isActivated = false;
+        this.lastWheelTime = 0;
+        this.wheelCount = 0;
+        this.consecutiveLowWheelEvents = 0;
+        this.chartPanningOptions = { horizontal: true, vertical: true };
+    }
+    /**
+     * This method is used to activate the zoom functionality of the canvas. It extends the doActivate method of the parent class.
+     * @protected
+     * @returns {void}
+     */
+    doActivate() {
+        if (this.isActivated) {
+            return;
+        }
+        this.isActivated = true;
+        super.doActivate();
+        this.canvasInputListener.initializeRectCache();
+        this.createWheelSubscription();
+        this.initFrameId = requestAnimationFrame(() => {
+            this.bus.fireDraw();
+        });
+        this.addRxSubscription(this.chartPanComponent.chartBaseModel.dataPrependSubject
+            .asObservable()
+            .subscribe(({ prependedCandlesWidth }) => {
+            this.lastXStart += prependedCandlesWidth;
+        }));
+        this.addRxSubscription(this.bus
+            .observe(EVENT_RESIZED)
+            .pipe(debounceTime(100))
+            .subscribe(() => {
+            if (this.scale && typeof this.scale.haltAnimation === 'function') {
+                this.scale.haltAnimation();
+            }
+        }));
+    }
+    /**
+     * Creates wheel subscription with optimized throttling
+     */
+    createWheelSubscription() {
+        if (this.wheelSubscription) {
+            this.wheelSubscription.unsubscribe();
+            this.wheelSubscription = null;
+        }
+        const allPanesHitTest = this.canvasBoundsContainer.getBoundsHitTest(CanvasElement.ALL_PANES);
+        const canvasBounds = this.canvasBoundsContainer.getBounds(CanvasElement.CANVAS);
+        const totalPixels = canvasBounds.width * canvasBounds.height;
+        if (totalPixels > 0) {
+            if (totalPixels > LARGE_SCREEN_PIXEL_THRESHOLD) {
+                this.wheelThrottleTime = LARGE_SCREEN_THROTTLE_MS;
+            }
+            else {
+                this.wheelThrottleTime = SAFARI_THROTTLE_MS;
+            }
+        }
+        else {
+            this.wheelThrottleTime = DEFAULT_THROTTLE_MS;
+        }
+        this.wheelSubscription = this.canvasInputListener
+            .observeWheel(allPanesHitTest)
+            .pipe(filter(() => this.chartPanningOptions.horizontal && this.chartPanningOptions.vertical), filter((e) => {
+            const device = deviceDetector();
+            if (device === 'apple') {
+                const minDelta = 1.0;
+                return Math.abs(e.deltaY) > minDelta || Math.abs(e.deltaX) > minDelta;
+            }
+            return true;
+        }), throttleTime(this.wheelThrottleTime, animationFrameScheduler, { trailing: true, leading: true }))
+            .subscribe(e => {
+            const now = performance.now();
+            if (!this.lastWheelTime) {
+                this.lastWheelTime = now;
+                this.wheelCount = 0;
+            }
+            this.wheelCount++;
+            if (now - this.lastWheelTime > WHEEL_MONITORING_INTERVAL_MS) {
+                const wheelEventsPerSecond = Math.round((this.wheelCount * 1000) / (now - this.lastWheelTime));
+                if (wheelEventsPerSecond < LOW_WHEEL_EVENTS_THRESHOLD) {
+                    this.consecutiveLowWheelEvents++;
+                    if (this.consecutiveLowWheelEvents >= 1) {
+                        this.triggerPerformanceCleanup();
+                        this.consecutiveLowWheelEvents = 0;
+                    }
+                }
+                else {
+                    this.consecutiveLowWheelEvents = 0;
+                }
+                this.lastWheelTime = now;
+                this.wheelCount = 0;
+            }
+            const device = deviceDetector();
+            const direction = device === 'apple' || device === 'mobile' ? -1 : 1;
+            const deltaX = 0 + e.deltaX * direction;
+            const deltaY = 0 + e.deltaY * direction;
+            if (e.ctrlKey) {
+                const zoomSensitivity = this.calculateDynamicSesitivity(e, this.config.scale.zoomSensitivity.wheel);
+                this.zoomXHandler(e, zoomSensitivity);
+                this.bus.fireDraw();
+                return;
+            }
+            if (deltaY !== 0 && Math.abs(deltaY) > Math.abs(deltaX)) {
+                const zoomSensitivity = this.calculateDynamicSesitivity(e, this.config.scale.zoomSensitivity.wheel);
+                this.zoomXHandler(e, zoomSensitivity);
+                this.bus.fireDraw();
+            }
+            if (deltaX !== 0 && Math.abs(deltaX) > Math.abs(deltaY)) {
+                const unitsDelta = pixelsToUnits(deltaX, this.scale.zoomX);
+                this.scale.moveXStart(this.scale.xStart - unitsDelta);
+                this.bus.fireDraw();
+                return;
+            }
+        });
+        this.addRxSubscription(this.wheelSubscription);
+    }
+    /**
+     * Manual cleanup trigger for immediate performance recovery
+     */
+    triggerPerformanceCleanup() {
+        window.dispatchEvent(new Event('resize'));
+        if (window.gc) {
+            window.gc();
+        }
+        if (this.initFrameId) {
+            cancelAnimationFrame(this.initFrameId);
+            this.initFrameId = null;
+        }
+        if (this.scale && typeof this.scale.haltAnimation === 'function') {
+            this.scale.haltAnimation();
+        }
+        this.consecutiveLowWheelEvents = 0;
+        this.wheelCount = 0;
+        this.lastWheelTime = 0;
+    }
+    doDeactivate() {
+        if (this.wheelSubscription) {
+            this.wheelSubscription.unsubscribe();
+            this.wheelSubscription = null;
+        }
+        if (this.initFrameId) {
+            cancelAnimationFrame(this.initFrameId);
+            this.initFrameId = null;
+        }
+        this.isActivated = false;
+        super.doDeactivate();
+    }
+}

package/dist/chart/utils/performance/safari/safari-performance.model.d.ts

@@ -0,0 +1,32 @@
+/*
+ * Copyright (C) 2019 - 2025 Devexperts Solutions IE Limited
+ * This Source Code Form is subject to the terms of the Mozilla Public License, v. 2.0.
+ * If a copy of the MPL was not distributed with this file, You can obtain one at https://mozilla.org/MPL/2.0/.
+ */
+export type SafariThrottleTimeMS = number;
+/**
+ * Safari canvas performance limits because of Safari's GPU limits
+ */
+export declare const SAFARI_CANVAS_LIMITS: {
+    readonly MAX_DIMENSION: 2048;
+    readonly MAX_TOTAL_PIXELS: 1800000;
+    readonly ZOOM_OPTIMIZED_PIXELS: 1200000;
+};
+export declare const LARGE_SCREEN_PIXEL_THRESHOLD = 2000000;
+export declare const LARGE_SCREEN_THROTTLE_MS = 24;
+export declare const SAFARI_THROTTLE_MS = 20;
+export declare const DEFAULT_THROTTLE_MS = 16;
+export declare const LOW_WHEEL_EVENTS_THRESHOLD = 10;
+export declare const WHEEL_MONITORING_INTERVAL_MS = 1000;
+/**
+ * Threshold for significant canvas area change to trigger subscription recreation
+ * Prevents unnecessary recreation for minor size adjustments
+ */
+export declare const CANVAS_AREA_CHANGE_THRESHOLD = 50000;
+export declare const SafariThrottleTimeMSMap: {
+    readonly MIN: 60;
+    readonly LOW: 80;
+    readonly MEDIUM: 100;
+    readonly HIGH: 120;
+    readonly MAX: 150;
+};

package/dist/chart/utils/performance/safari/safari-performance.model.js

@@ -0,0 +1,31 @@
+/*
+ * Copyright (C) 2019 - 2025 Devexperts Solutions IE Limited
+ * This Source Code Form is subject to the terms of the Mozilla Public License, v. 2.0.
+ * If a copy of the MPL was not distributed with this file, You can obtain one at https://mozilla.org/MPL/2.0/.
+ */
+/**
+ * Safari canvas performance limits because of Safari's GPU limits
+ */
+export const SAFARI_CANVAS_LIMITS = {
+    MAX_DIMENSION: 2048,
+    MAX_TOTAL_PIXELS: 1800000,
+    ZOOM_OPTIMIZED_PIXELS: 1200000,
+};
+export const LARGE_SCREEN_PIXEL_THRESHOLD = 2000000; // 2M pixels
+export const LARGE_SCREEN_THROTTLE_MS = 24;
+export const SAFARI_THROTTLE_MS = 20;
+export const DEFAULT_THROTTLE_MS = 16;
+export const LOW_WHEEL_EVENTS_THRESHOLD = 10; // Minimum wheel events per second
+export const WHEEL_MONITORING_INTERVAL_MS = 1000;
+/**
+ * Threshold for significant canvas area change to trigger subscription recreation
+ * Prevents unnecessary recreation for minor size adjustments
+ */
+export const CANVAS_AREA_CHANGE_THRESHOLD = 50000;
+export const SafariThrottleTimeMSMap = {
+    MIN: 60,
+    LOW: 80,
+    MEDIUM: 100,
+    HIGH: 120,
+    MAX: 150,
+};

package/dist/chart/utils/performance/safari/safari-performance.utils.d.ts

@@ -0,0 +1,18 @@
+/*
+ * Copyright (C) 2019 - 2025 Devexperts Solutions IE Limited
+ * This Source Code Form is subject to the terms of the Mozilla Public License, v. 2.0.
+ * If a copy of the MPL was not distributed with this file, You can obtain one at https://mozilla.org/MPL/2.0/.
+ */
+import { SafariThrottleTimeMS } from './safari-performance.model';
+/**
+ * Safari Performance Optimization Utilities
+ *
+ * This module contains utilities specifically designed to address Safari performance issues
+ * during drag/zoom operations on charts.
+ */
+/**
+ * Calculates optimal throttle time for hit-test wheel events based on canvas size and browser
+ * @param canvasArea - Total canvas area in pixels (width * height)
+ * @returns Throttle time in milliseconds
+ */
+export declare function calculateHitTestThrottleTime(canvasArea: number): SafariThrottleTimeMS;

package/dist/chart/utils/performance/safari/safari-performance.utils.js

@@ -0,0 +1,34 @@
+/*
+ * Copyright (C) 2019 - 2025 Devexperts Solutions IE Limited
+ * This Source Code Form is subject to the terms of the Mozilla Public License, v. 2.0.
+ * If a copy of the MPL was not distributed with this file, You can obtain one at https://mozilla.org/MPL/2.0/.
+ */
+import { SAFARI_CANVAS_LIMITS, SafariThrottleTimeMSMap } from './safari-performance.model';
+/**
+ * Safari Performance Optimization Utilities
+ *
+ * This module contains utilities specifically designed to address Safari performance issues
+ * during drag/zoom operations on charts.
+ */
+/**
+ * Calculates optimal throttle time for hit-test wheel events based on canvas size and browser
+ * @param canvasArea - Total canvas area in pixels (width * height)
+ * @returns Throttle time in milliseconds
+ */
+export function calculateHitTestThrottleTime(canvasArea) {
+    if (canvasArea > SAFARI_CANVAS_LIMITS.ZOOM_OPTIMIZED_PIXELS) {
+        return SafariThrottleTimeMSMap.MAX;
+    }
+    else if (canvasArea > SAFARI_CANVAS_LIMITS.ZOOM_OPTIMIZED_PIXELS * 0.75) {
+        return SafariThrottleTimeMSMap.HIGH;
+    }
+    else if (canvasArea > SAFARI_CANVAS_LIMITS.ZOOM_OPTIMIZED_PIXELS * 0.5) {
+        return SafariThrottleTimeMSMap.MEDIUM;
+    }
+    else if (canvasArea > SAFARI_CANVAS_LIMITS.ZOOM_OPTIMIZED_PIXELS * 0.25) {
+        return SafariThrottleTimeMSMap.LOW;
+    }
+    else {
+        return SafariThrottleTimeMSMap.MIN;
+    }
+}