@devexperts/dxcharts-lite 2.7.15 → 2.7.17

package/dist/chart/model/scale.model.js

@@ -4,13 +4,20 @@
  * If a copy of the MPL was not distributed with this file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 import { Subject } from 'rxjs';
-import { startViewportModelAnimation } from '../animation/viewport-model-animation';
+import { throttleTime } from 'rxjs/operators';
+import { animationFrameScheduler } from 'rxjs';
 import { cloneUnsafe } from '../utils/object.utils';
 import { AutoScaleViewportSubModel } from './scaling/auto-scale.model';
 import { changeXToKeepRatio, changeYToKeepRatio } from './scaling/lock-ratio.model';
 import { moveXStart, moveYStart } from './scaling/move-chart.functions';
 import { ViewportModel, calculateZoom, compareStates, } from './scaling/viewport.model';
 import { zoomXToEndViewportCalculator, zoomXToPercentViewportCalculator } from './scaling/x-zooming.functions';
+import { VIEWPORT_ANIMATION_ID } from '../animation/canvas-animation';
+import { startViewportModelAnimation, startViewportModelAnimationSafari } from '../animation/viewport-model-animation';
+import { ONE_FRAME_MS } from '../utils/numeric-constants.utils';
+import { isSafari } from '../utils/device/touchpad.utils';
+const autoScaleZoomSubject = new Subject();
+const autoScalePanSubject = new Subject();
 export const getDefaultHighLowWithIndex = () => ({
     high: Number.NEGATIVE_INFINITY,
     low: Number.POSITIVE_INFINITY,
@@ -40,6 +47,8 @@ export class ScaleModel extends ViewportModel {
         // TODO rework, make a new history based on units
         this.history = [];
         this.xConstraints = [];
+        this.autoScaleZoomSubscription = null;
+        this.autoScalePanSubscription = null;
         this.scalePostProcessor = (initialState, state) => {
             // for now <s>reduceRight<s/> reduce bcs ChartModel#getZoomConstrait should be invoked first
             // if we will need more complex order handling -> add some managing
@@ -48,6 +57,7 @@ export class ScaleModel extends ViewportModel {
         this.state = cloneUnsafe(config.scale);
         this.autoScaleModel = new AutoScaleViewportSubModel(this);
         this.offsets = this.config.components.offsets;
+        this.initAutoScaleThrottling();
     }
     doActivate() {
         super.doActivate();
@@ -59,6 +69,15 @@ export class ScaleModel extends ViewportModel {
         }));
     }
     doDeactivate() {
+        // Clean up auto-scale throttling subscriptions to prevent memory leaks
+        if (this.autoScaleZoomSubscription) {
+            this.autoScaleZoomSubscription.unsubscribe();
+            this.autoScaleZoomSubscription = null;
+        }
+        if (this.autoScalePanSubscription) {
+            this.autoScalePanSubscription.unsubscribe();
+            this.autoScalePanSubscription = null;
+        }
         super.doDeactivate();
         this.scaleInversedSubject.complete();
         this.beforeStartAnimationSubject.complete();
@@ -119,8 +138,13 @@ export class ScaleModel extends ViewportModel {
     }
     haltAnimation() {
         var _a;
+        // Stop current animation if it exists
         if ((_a = this.currentAnimation) === null || _a === void 0 ? void 0 : _a.animationInProgress) {
             this.currentAnimation.finishAnimation();
+            // Clear the current animation reference
+            this.currentAnimation = undefined;
+            // CRITICAL: Force stop all viewport animations in the animation system to prevent accumulation
+            this.canvasAnimation.forceStopAnimation(VIEWPORT_ANIMATION_ID);
             this.doAutoScale();
         }
     }
@@ -196,9 +220,27 @@ export class ScaleModel extends ViewportModel {
         }
         else {
             (_a = this.currentAnimation) === null || _a === void 0 ? void 0 : _a.tick();
-            startViewportModelAnimation(this.canvasAnimation, this, constrainedState);
+            // Big profit in performance for safari
+            isSafari
+                ? startViewportModelAnimationSafari(this.canvasAnimation, this, constrainedState, this.state.auto ? this.autoScaleModel : undefined)
+                : startViewportModelAnimation(this.canvasAnimation, this, constrainedState);
         }
     }
+    setXScaleWithoutYScale(visualCandleSource) {
+        var _a;
+        const initialStateCopy = this.export();
+        const vCandles = visualCandleSource.slice(Math.max(visualCandleSource.length - this.state.defaultViewportItems, 0));
+        const endCandle = vCandles[vCandles.length - 1];
+        const xEnd = endCandle.startUnit + endCandle.width + this.offsets.right;
+        const xStart = xEnd - (this.getBounds().width * this.zoomX);
+        const state = Object.assign(Object.assign({}, initialStateCopy), { xStart, xEnd });
+        const constrainedState = this.scalePostProcessor(initialStateCopy, state);
+        if (this.state.auto) {
+            this.autoScaleModel.doAutoYScale(constrainedState);
+        }
+        (_a = this.currentAnimation) === null || _a === void 0 ? void 0 : _a.tick();
+        startViewportModelAnimation(this.canvasAnimation, this, constrainedState);
+    }
     setYScale(yStart, yEnd, fire = false) {
         const initialState = this.export();
         if (initialState.yStart === yStart && initialState.yEnd === yEnd && initialState.zoomY > 0) {
@@ -238,15 +280,19 @@ export class ScaleModel extends ViewportModel {
     moveXStart(xStart) {
         const state = this.export();
         const initialStateCopy = Object.assign({}, state);
-        // always stop the animations
         this.haltAnimation();
         moveXStart(state, xStart);
         // there we need only candles constraint
         const constrainedState = this.scalePostProcessor(initialStateCopy, state);
-        if (this.state.auto) {
-            this.autoScaleModel.doAutoYScale(constrainedState);
+        if (isSafari) {
+            startViewportModelAnimationSafari(this.canvasAnimation, this, constrainedState, this.state.auto ? this.autoScaleModel : undefined);
+        }
+        else {
+            if (this.state.auto) {
+                this.autoScaleModel.doAutoYScale(constrainedState);
+            }
+            this.apply(constrainedState);
         }
-        this.apply(constrainedState);
     }
     /**
      * Moves both yStart and yEnd without changing the viewport height (zoom).
@@ -358,6 +404,26 @@ export class ScaleModel extends ViewportModel {
         }
         this.state.lockPriceToBarRatio = value;
     }
+    initAutoScaleThrottling() {
+        // Throttle zoom auto-scale to ONE_FRAME_MS
+        this.autoScaleZoomSubscription = autoScaleZoomSubject
+            .pipe(throttleTime(ONE_FRAME_MS, animationFrameScheduler, { trailing: true, leading: false }))
+            .subscribe(() => {
+            const state = this.export();
+            const initialStateCopy = Object.assign({}, state);
+            const constrainedState = this.scalePostProcessor(initialStateCopy, state);
+            this.autoScaleModel.doAutoYScale(constrainedState);
+        });
+        // Throttle pan auto-scale to 250ms
+        this.autoScalePanSubscription = autoScalePanSubject
+            .pipe(throttleTime(ONE_FRAME_MS, animationFrameScheduler, { trailing: true, leading: false }))
+            .subscribe(() => {
+            const state = this.export();
+            const initialStateCopy = Object.assign({}, state);
+            const constrainedState = this.scalePostProcessor(initialStateCopy, state);
+            this.autoScaleModel.doAutoYScale(constrainedState);
+        });
+    }
 }
 /**
  * The SyncedByXScaleModel class extends the ScaleModel class and adds support for synchronization with other ScaleModel instance, so both instances maintain the same X-axis bounds.

package/dist/chart/utils/device/touchpad.utils.d.ts

@@ -4,6 +4,7 @@
  * If a copy of the MPL was not distributed with this file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 import { PriceAxisType } from '../../components/labels_generator/numeric-axis-labels.generator';
+export declare const isSafari: boolean;
 export declare const isFirefox: boolean;
 /**
  * this function determines whether the event was triggered with the mouse or the touchpad

package/dist/chart/utils/device/touchpad.utils.js

@@ -3,7 +3,7 @@
  * 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/.
  */
-const isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
+export const isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
 //@ts-ignore
 const isChrome = !!window.chrome;
 //@ts-ignore

package/dist/chart/utils/math.utils.js

@@ -113,7 +113,7 @@ export function clamp(value, min, max) {
     return Math.max(min, Math.min(value, max));
 }
 export function easeExpOut(value) {
-    return 1 - (Math.pow(2, -5 * value) - 0.0009765625) * 1.0009775171065494;
+    return 1 - (Math.pow(2, -10 * value) - 0.0009765625) * 1.0009775171065494;
 }
 /**
  * Returns the first finite number in a list of numbers. If no finite number is found,

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;
+}