@devexperts/dxcharts-lite 2.7.1 → 2.7.3

package/dist/chart/drawers/chart-type-drawers/scatter-plot.drawer.d.ts

@@ -5,9 +5,9 @@
  */
 import { ScatterPlotStyle } from '../../chart.config';
 import { DataSeriesModel, VisualSeriesPoint } from '../../model/data-series.model';
-import { ChartDrawerConfig, SeriesDrawer } from '../data-series.drawer';
+import { HTSeriesDrawerConfig, SeriesDrawer } from '../data-series.drawer';
 export declare class ScatterPlotDrawer implements SeriesDrawer {
     private config;
     constructor(config: ScatterPlotStyle);
-    draw(ctx: CanvasRenderingContext2D, points: VisualSeriesPoint[][], model: DataSeriesModel, drawerConfig: ChartDrawerConfig): void;
+    draw(ctx: CanvasRenderingContext2D, points: VisualSeriesPoint[][], model: DataSeriesModel, hitTestDrawerConfig: HTSeriesDrawerConfig): void;
 }

package/dist/chart/drawers/chart-type-drawers/scatter-plot.drawer.js

@@ -9,14 +9,15 @@ export class ScatterPlotDrawer {
     constructor(config) {
         this.config = config;
     }
-    draw(ctx, points, model, drawerConfig) {
+    draw(ctx, points, model, hitTestDrawerConfig) {
         var _a;
-        ctx.fillStyle = (_a = drawerConfig.singleColor) !== null && _a !== void 0 ? _a : this.config.mainColor;
+        const radius = hitTestDrawerConfig.hoverWidth ? hitTestDrawerConfig.hoverWidth / 2 : SCATTER_PLOT_RADIUS;
+        ctx.fillStyle = (_a = hitTestDrawerConfig.color) !== null && _a !== void 0 ? _a : this.config.mainColor;
         for (const visualCandle of flat(points)) {
             ctx.beginPath();
             const lineX = model.view.toX(visualCandle.centerUnit);
             const closeY = model.view.toY(visualCandle.close);
-            ctx.arc(lineX, closeY, SCATTER_PLOT_RADIUS, 0, Math.PI * 2, true);
+            ctx.arc(lineX, closeY, radius, 0, Math.PI * 2, true);
             ctx.fill();
         }
     }

package/dist/chart/drawers/data-series-drawers/candle-series-wrapper.d.ts

@@ -6,7 +6,7 @@
 import { BarType, FullChartConfig } from '../../chart.config';
 import { BoundsProvider } from '../../model/bounds.model';
 import { DataSeriesModel, VisualSeriesPoint } from '../../model/data-series.model';
-import { ChartDrawerConfig, SeriesDrawer } from '../data-series.drawer';
+import { HTSeriesDrawerConfig, SeriesDrawer } from '../data-series.drawer';
 export declare const candleTypesList: BarType[];
 /**
  * A decorator for drawers, that draw something depending on visual candles
@@ -16,7 +16,7 @@ export declare class CandleSeriesWrapper implements SeriesDrawer {
     private config;
     private chartBounds;
     constructor(drawer: SeriesDrawer, config: FullChartConfig, chartBounds: BoundsProvider);
-    draw(ctx: CanvasRenderingContext2D, allPoints: VisualSeriesPoint[][], model: DataSeriesModel, config: ChartDrawerConfig): void;
+    draw(ctx: CanvasRenderingContext2D, allPoints: VisualSeriesPoint[][], model: DataSeriesModel, hitTestDrawerConfig: HTSeriesDrawerConfig): void;
     private beforeDraw;
     private isChartTypeAllowed;
     private afterDraw;

package/dist/chart/drawers/data-series-drawers/candle-series-wrapper.js

@@ -24,10 +24,10 @@ export class CandleSeriesWrapper {
         this.config = config;
         this.chartBounds = chartBounds;
     }
-    draw(ctx, allPoints, model, config) {
+    draw(ctx, allPoints, model, hitTestDrawerConfig) {
         if (this.isChartTypeAllowed()) {
             this.beforeDraw(ctx);
-            this.drawer.draw(ctx, allPoints, model, config);
+            this.drawer.draw(ctx, allPoints, model, hitTestDrawerConfig);
             this.afterDraw(ctx, model);
         }
     }

package/dist/chart/drawers/data-series-drawers/color-candle.drawer.d.ts

@@ -5,7 +5,7 @@
  */
 import { ChartModel } from '../../components/chart/chart.model';
 import { DataSeriesModel, VisualSeriesPoint } from '../../model/data-series.model';
-import { ChartDrawerConfig, SeriesDrawer } from '../data-series.drawer';
+import { HTSeriesDrawerConfig, SeriesDrawer } from '../data-series.drawer';
 /**
  * Some series have candles which are highlighted.
  * This drawer draws the candle box on top of original candles.
@@ -13,5 +13,5 @@ import { ChartDrawerConfig, SeriesDrawer } from '../data-series.drawer';
 export declare class ColorCandleDrawer implements SeriesDrawer {
     private chartModel;
     constructor(chartModel: ChartModel);
-    draw(ctx: CanvasRenderingContext2D, allPoints: VisualSeriesPoint[][], model: DataSeriesModel, drawerConfig: ChartDrawerConfig): void;
+    draw(ctx: CanvasRenderingContext2D, allPoints: VisualSeriesPoint[][], model: DataSeriesModel, hitTestDrawerConfig: HTSeriesDrawerConfig): void;
 }

package/dist/chart/drawers/data-series-drawers/color-candle.drawer.js

@@ -5,7 +5,7 @@
  */
 import { unitToPixels } from '../../model/scaling/viewport.model';
 import { floorToDPR } from '../../utils/device/device-pixel-ratio.utils';
-import { round } from '../../utils/math.utils';
+import { floor } from '../../utils/math.utils';
 /**
  * Some series have candles which are highlighted.
  * This drawer draws the candle box on top of original candles.
@@ -14,13 +14,13 @@ export class ColorCandleDrawer {
     constructor(chartModel) {
         this.chartModel = chartModel;
     }
-    draw(ctx, allPoints, model, drawerConfig) {
+    draw(ctx, allPoints, model, hitTestDrawerConfig) {
         allPoints.forEach((points, idx) => {
             var _a;
             const config = model.getPaintConfig(idx);
-            ctx.fillStyle = (_a = drawerConfig.singleColor) !== null && _a !== void 0 ? _a : config.color;
+            ctx.fillStyle = (_a = hitTestDrawerConfig.color) !== null && _a !== void 0 ? _a : config.color;
             points.forEach(p => {
-                const visualCandle = this.chartModel.getVisualCandle(round(p.centerUnit));
+                const visualCandle = this.chartModel.getVisualCandle(floor(p.centerUnit));
                 const value = p.close;
                 if (visualCandle && value === 1) {
                     const zoomX = this.chartModel.scale.zoomX;

package/dist/chart/drawers/data-series-drawers/difference-cloud.drawer.d.ts

@@ -4,7 +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 { DataSeriesModel, VisualSeriesPoint } from '../../model/data-series.model';
-import { ChartDrawerConfig, SeriesDrawer } from '../data-series.drawer';
+import { HTSeriesDrawerConfig, SeriesDrawer } from '../data-series.drawer';
 /**
  * Point used to draw difference type indicator (clouds) (e.g. Ichimoku indicator)
  */
@@ -13,7 +13,7 @@ export interface DifferencePoint {
 }
 export declare class DifferenceCloudDrawer implements SeriesDrawer {
     constructor();
-    draw(ctx: CanvasRenderingContext2D, allPoints: VisualSeriesPoint[][], model: DataSeriesModel, drawerConfig: ChartDrawerConfig): void;
+    draw(ctx: CanvasRenderingContext2D, allPoints: VisualSeriesPoint[][], model: DataSeriesModel, hitTestDrawerConfig: HTSeriesDrawerConfig): void;
     private drawLine;
     private drawDifference;
     private fillCloud;

package/dist/chart/drawers/data-series-drawers/difference-cloud.drawer.js

@@ -9,14 +9,14 @@ import { firstOf, lastOf } from '../../utils/array.utils';
 import { toRGBA } from '../../utils/color.utils';
 export class DifferenceCloudDrawer {
     constructor() { }
-    draw(ctx, allPoints, model, drawerConfig) {
+    draw(ctx, allPoints, model, hitTestDrawerConfig) {
         if (model.config.visible) {
             // draw main line
             allPoints.forEach((points, idx) => {
                 var _a;
                 const config = model.getPaintConfig(idx);
-                setLineWidth(ctx, config.lineWidth, model, drawerConfig, config.hoveredLineWidth);
-                const lineColor = (_a = drawerConfig.singleColor) !== null && _a !== void 0 ? _a : config.color;
+                setLineWidth(ctx, config.lineWidth, model, hitTestDrawerConfig, config.hoveredLineWidth);
+                const lineColor = (_a = hitTestDrawerConfig.color) !== null && _a !== void 0 ? _a : config.color;
                 ctx.strokeStyle = lineColor;
                 this.drawLine(ctx, points, model.view);
             });
@@ -42,7 +42,7 @@ export class DifferenceCloudDrawer {
                         }
                         const curSeriesColor = mainSeries.getPaintConfig(idx).color;
                         const nextSeriesColor = linkedSeries.getPaintConfig(linkedSeriesIdx).color;
-                        this.drawDifference(ctx, curSeriesColor, nextSeriesColor, differencePoints, mainSeries, linkedSeries, drawerConfig);
+                        this.drawDifference(ctx, curSeriesColor, nextSeriesColor, differencePoints, mainSeries, linkedSeries, hitTestDrawerConfig);
                     });
                 }
             });
@@ -53,7 +53,7 @@ export class DifferenceCloudDrawer {
         buildLinePath(points, ctx, view);
         ctx.stroke();
     }
-    drawDifference(ctx, lineColor, nextLineColor, diffPoints, curSeries, nextSeries, drawerConfig) {
+    drawDifference(ctx, lineColor, nextLineColor, diffPoints, curSeries, nextSeries, hitTestDrawerConfig) {
         const [linePoints, nextLinePoints] = [[], []];
         diffPoints.forEach(points => {
             const [point, nextPoint] = points.diffPoints;
@@ -62,10 +62,10 @@ export class DifferenceCloudDrawer {
         });
         const curSeriesPoints = mapDataSeriesDiffPointsIntoPoints(linePoints, curSeries.view);
         const nextSeriesPoints = mapDataSeriesDiffPointsIntoPoints(nextLinePoints, nextSeries.view);
-        this.fillCloud(ctx, nextLineColor, curSeriesPoints, nextSeriesPoints, drawerConfig);
-        this.fillCloud(ctx, lineColor, nextSeriesPoints, curSeriesPoints, drawerConfig);
+        this.fillCloud(ctx, nextLineColor, curSeriesPoints, nextSeriesPoints, hitTestDrawerConfig);
+        this.fillCloud(ctx, lineColor, nextSeriesPoints, curSeriesPoints, hitTestDrawerConfig);
     }
-    fillCloud(ctx, color, linePoints, nextLinePoints, drawerConfig) {
+    fillCloud(ctx, color, linePoints, nextLinePoints, hitTestDrawerConfig) {
         var _a, _b, _c, _d;
         ctx.save();
         // clip above lowerLine
@@ -95,7 +95,7 @@ export class DifferenceCloudDrawer {
             ctx.lineTo(p.x, p.y);
         });
         ctx.closePath();
-        ctx.fillStyle = drawerConfig.singleColor ? drawerConfig.singleColor : toRGBA(color ? color : '#383838', 0.3);
+        ctx.fillStyle = hitTestDrawerConfig.color ? hitTestDrawerConfig.color : toRGBA(color ? color : '#383838', 0.3);
         ctx.fill();
         ctx.restore();
     }

package/dist/chart/drawers/data-series-drawers/histogram.drawer.d.ts

@@ -4,8 +4,8 @@
  * If a copy of the MPL was not distributed with this file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 import { DataSeriesModel, VisualSeriesPoint } from '../../model/data-series.model';
-import { ChartDrawerConfig, SeriesDrawer } from '../data-series.drawer';
+import { HTSeriesDrawerConfig, SeriesDrawer } from '../data-series.drawer';
 export declare class HistogramDrawer implements SeriesDrawer {
     constructor();
-    draw(ctx: CanvasRenderingContext2D, allPoints: VisualSeriesPoint[][], model: DataSeriesModel, drawerConfig: ChartDrawerConfig): void;
+    draw(ctx: CanvasRenderingContext2D, allPoints: VisualSeriesPoint[][], model: DataSeriesModel, hitTestDrawerConfig: HTSeriesDrawerConfig): void;
 }

package/dist/chart/drawers/data-series-drawers/histogram.drawer.js

@@ -7,14 +7,14 @@ import { floor } from '../../utils/math.utils';
 import { setLineWidth } from '../data-series.drawer';
 export class HistogramDrawer {
     constructor() { }
-    draw(ctx, allPoints, model, drawerConfig) {
+    draw(ctx, allPoints, model, hitTestDrawerConfig) {
         const zero = model.view.toY(0);
         allPoints.forEach((points, idx) => {
             var _a;
             // odd width is crucial to draw histogram without antialiasing
             const config = model.getPaintConfig(idx);
-            setLineWidth(ctx, config.lineWidth, model, drawerConfig, config.hoveredLineWidth);
-            ctx.strokeStyle = (_a = drawerConfig.singleColor) !== null && _a !== void 0 ? _a : config.color;
+            setLineWidth(ctx, config.lineWidth, model, hitTestDrawerConfig, config.hoveredLineWidth);
+            ctx.strokeStyle = (_a = hitTestDrawerConfig.color) !== null && _a !== void 0 ? _a : config.color;
             ctx.beginPath();
             points.forEach(p => {
                 const x = model.view.toX(p.centerUnit);

package/dist/chart/drawers/data-series-drawers/linear.drawer.d.ts

@@ -4,9 +4,9 @@
  * If a copy of the MPL was not distributed with this file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 import { DataSeriesModel, VisualSeriesPoint } from '../../model/data-series.model';
-import { ChartDrawerConfig, SeriesDrawer } from '../data-series.drawer';
+import { HTSeriesDrawerConfig, SeriesDrawer } from '../data-series.drawer';
 export declare class LinearDrawer implements SeriesDrawer {
     constructor();
-    draw(ctx: CanvasRenderingContext2D, allPoints: VisualSeriesPoint[][], model: DataSeriesModel, drawerConfig: ChartDrawerConfig): void;
+    draw(ctx: CanvasRenderingContext2D, allPoints: VisualSeriesPoint[][], model: DataSeriesModel, hitTestDrawerConfig: HTSeriesDrawerConfig): void;
     private drawLinePath;
 }

package/dist/chart/drawers/data-series-drawers/linear.drawer.js

@@ -7,12 +7,12 @@ import { setLineWidth } from '../data-series.drawer';
 import { buildLinePath } from './data-series-drawers.utils';
 export class LinearDrawer {
     constructor() { }
-    draw(ctx, allPoints, model, drawerConfig) {
+    draw(ctx, allPoints, model, hitTestDrawerConfig) {
         allPoints.forEach((points, idx) => {
             var _a;
             const config = model.getPaintConfig(idx);
-            setLineWidth(ctx, config.lineWidth, model, drawerConfig, config.hoveredLineWidth);
-            ctx.strokeStyle = (_a = drawerConfig.singleColor) !== null && _a !== void 0 ? _a : config.color;
+            setLineWidth(ctx, config.lineWidth, model, hitTestDrawerConfig, config.hoveredLineWidth);
+            ctx.strokeStyle = (_a = hitTestDrawerConfig.color) !== null && _a !== void 0 ? _a : config.color;
             this.drawLinePath(ctx, points, model.view);
         });
     }

package/dist/chart/drawers/data-series-drawers/points.drawer.d.ts

@@ -4,8 +4,8 @@
  * If a copy of the MPL was not distributed with this file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 import { DataSeriesModel, VisualSeriesPoint } from '../../model/data-series.model';
-import { ChartDrawerConfig, SeriesDrawer } from '../data-series.drawer';
+import { HTSeriesDrawerConfig, SeriesDrawer } from '../data-series.drawer';
 export declare class PointsDrawer implements SeriesDrawer {
     constructor();
-    draw(ctx: CanvasRenderingContext2D, allPoints: VisualSeriesPoint[][], model: DataSeriesModel, drawerConfig: ChartDrawerConfig): void;
+    draw(ctx: CanvasRenderingContext2D, allPoints: VisualSeriesPoint[][], model: DataSeriesModel, hitTestDrawerConfig: HTSeriesDrawerConfig): void;
 }

package/dist/chart/drawers/data-series-drawers/points.drawer.js

@@ -5,12 +5,12 @@
  */
 export class PointsDrawer {
     constructor() { }
-    draw(ctx, allPoints, model, drawerConfig) {
+    draw(ctx, allPoints, model, hitTestDrawerConfig) {
         allPoints.forEach((points, idx) => {
             var _a;
             const config = model.getPaintConfig(idx);
-            const radius = config.lineWidth;
-            ctx.fillStyle = (_a = drawerConfig.singleColor) !== null && _a !== void 0 ? _a : config.color;
+            const radius = hitTestDrawerConfig.hoverWidth ? hitTestDrawerConfig.hoverWidth / 2 : config.lineWidth;
+            ctx.fillStyle = (_a = hitTestDrawerConfig.color) !== null && _a !== void 0 ? _a : config.color;
             ctx.lineWidth = 1;
             points.forEach(p => {
                 ctx.beginPath();

package/dist/chart/drawers/data-series-drawers/text.drawer.d.ts

@@ -5,9 +5,9 @@
  */
 import { FullChartConfig } from '../../chart.config';
 import { DataSeriesModel, VisualSeriesPoint } from '../../model/data-series.model';
-import { ChartDrawerConfig, SeriesDrawer } from '../data-series.drawer';
+import { HTSeriesDrawerConfig, SeriesDrawer } from '../data-series.drawer';
 export declare class TextDrawer implements SeriesDrawer {
     private config;
     constructor(config: FullChartConfig);
-    draw(ctx: CanvasRenderingContext2D, allPoints: VisualSeriesPoint[][], model: DataSeriesModel, drawerConfig: ChartDrawerConfig): void;
+    draw(ctx: CanvasRenderingContext2D, allPoints: VisualSeriesPoint[][], model: DataSeriesModel, hitTestDrawerConfig: HTSeriesDrawerConfig): void;
 }

package/dist/chart/drawers/data-series-drawers/text.drawer.js

@@ -8,12 +8,12 @@ export class TextDrawer {
     constructor(config) {
         this.config = config;
     }
-    draw(ctx, allPoints, model, drawerConfig) {
+    draw(ctx, allPoints, model, hitTestDrawerConfig) {
         ctx.save();
         allPoints.forEach((points, idx) => {
             var _a;
             const config = model.getPaintConfig(idx);
-            ctx.fillStyle = (_a = drawerConfig.singleColor) !== null && _a !== void 0 ? _a : config.color;
+            ctx.fillStyle = (_a = hitTestDrawerConfig.color) !== null && _a !== void 0 ? _a : config.color;
             const font = config.lineWidth + 'px ' + this.config.components.yAxis.fontFamily;
             ctx.font = font;
             points.forEach(p => {

package/dist/chart/drawers/data-series-drawers/trend-histogram.drawer.d.ts

@@ -4,9 +4,9 @@
  * If a copy of the MPL was not distributed with this file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 import { VisualSeriesPoint, DataSeriesModel } from '../../model/data-series.model';
-import { SeriesDrawer } from '../data-series.drawer';
+import { HTSeriesDrawerConfig, SeriesDrawer } from '../data-series.drawer';
 export declare class TrendHistogramDrawer implements SeriesDrawer {
     constructor();
-    draw(ctx: CanvasRenderingContext2D, allPoints: VisualSeriesPoint[][], model: DataSeriesModel): void;
+    draw(ctx: CanvasRenderingContext2D, allPoints: VisualSeriesPoint[][], model: DataSeriesModel, hitTestDrawerConfig: HTSeriesDrawerConfig): void;
     private previousValue;
 }

package/dist/chart/drawers/data-series-drawers/trend-histogram.drawer.js

@@ -4,25 +4,26 @@
  * If a copy of the MPL was not distributed with this file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 import { flat } from '../../utils/array.utils';
+import { setLineWidth } from '../data-series.drawer';
 export class TrendHistogramDrawer {
     constructor() { }
-    draw(ctx, allPoints, model) {
+    draw(ctx, allPoints, model, hitTestDrawerConfig) {
         const zero = model.view.toY(0);
         //  here I do flat, thinks that there is no more that 1 series
         const allPointsFlat = flat(allPoints);
         const config = model.getPaintConfig(0);
+        setLineWidth(ctx, config.lineWidth, model, hitTestDrawerConfig, config.hoveredLineWidth);
         allPointsFlat.forEach((point, idx) => {
-            var _a, _b;
+            var _a, _b, _c, _d, _e, _f, _g, _h;
             // odd width is crucial to draw histogram without antialiasing
             // 2 colors: Negative and Positive
             if (((_a = config.multiplyColors) === null || _a === void 0 ? void 0 : _a.length) === 2) {
                 ctx.strokeStyle =
-                    (point.close < this.previousValue(allPointsFlat, idx)
+                    (_b = hitTestDrawerConfig.color) !== null && _b !== void 0 ? _b : ((point.close < this.previousValue(allPointsFlat, idx)
                         ? config.multiplyColors[1]
                         : config.multiplyColors[0]) ||
                         config.color ||
-                        '#FF00FF';
-                ctx.lineWidth = config.lineWidth;
+                        '#FF00FF');
                 ctx.beginPath();
                 const x = model.view.toX(point.centerUnit);
                 const y = model.view.toY(point.close);
@@ -32,21 +33,24 @@ export class TrendHistogramDrawer {
                 return;
             }
             // 4 colors: Negative and Down, Negative and Up, Positive and Down, Positive and Up
-            if (((_b = config.multiplyColors) === null || _b === void 0 ? void 0 : _b.length) === 4) {
+            if (((_c = config.multiplyColors) === null || _c === void 0 ? void 0 : _c.length) === 4) {
                 const prevPointClose = this.previousValue(allPointsFlat, idx);
                 if (point.close < prevPointClose && point.close < 0) {
-                    ctx.strokeStyle = config.multiplyColors[0] || config.color || '#FF00FF';
+                    ctx.strokeStyle =
+                        (_d = hitTestDrawerConfig.color) !== null && _d !== void 0 ? _d : (config.multiplyColors[0] || config.color || '#FF00FF');
                 }
                 if (point.close > prevPointClose && point.close < 0) {
-                    ctx.strokeStyle = config.multiplyColors[1] || config.color || '#FF00FF';
+                    ctx.strokeStyle =
+                        (_e = hitTestDrawerConfig.color) !== null && _e !== void 0 ? _e : (config.multiplyColors[1] || config.color || '#FF00FF');
                 }
                 if (point.close < prevPointClose && point.close > 0) {
-                    ctx.strokeStyle = config.multiplyColors[2] || config.color || '#FF00FF';
+                    ctx.strokeStyle =
+                        (_f = hitTestDrawerConfig.color) !== null && _f !== void 0 ? _f : (config.multiplyColors[2] || config.color || '#FF00FF');
                 }
                 if (point.close > prevPointClose && point.close > 0) {
-                    ctx.strokeStyle = config.multiplyColors[3] || config.color || '#FF00FF';
+                    ctx.strokeStyle =
+                        (_g = hitTestDrawerConfig.color) !== null && _g !== void 0 ? _g : (config.multiplyColors[3] || config.color || '#FF00FF');
                 }
-                ctx.lineWidth = config.lineWidth;
                 ctx.beginPath();
                 const x = model.view.toX(point.centerUnit);
                 const y = model.view.toY(point.close);
@@ -56,8 +60,7 @@ export class TrendHistogramDrawer {
                 return;
             }
             // 1 color
-            ctx.strokeStyle = config.color || '#FF00FF';
-            ctx.lineWidth = config.lineWidth;
+            ctx.strokeStyle = (_h = hitTestDrawerConfig.color) !== null && _h !== void 0 ? _h : (config.color || '#FF00FF');
             ctx.beginPath();
             const x = model.view.toX(point.centerUnit);
             const y = model.view.toY(point.close);

package/dist/chart/drawers/data-series-drawers/triangle.drawer.d.ts

@@ -4,9 +4,9 @@
  * If a copy of the MPL was not distributed with this file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 import { DataSeriesModel, VisualSeriesPoint } from '../../model/data-series.model';
-import { ChartDrawerConfig, SeriesDrawer } from '../data-series.drawer';
+import { HTSeriesDrawerConfig, SeriesDrawer } from '../data-series.drawer';
 export declare class TriangleDrawer implements SeriesDrawer {
     constructor();
-    draw(ctx: CanvasRenderingContext2D, allPoints: VisualSeriesPoint[][], model: DataSeriesModel, drawerConfig: ChartDrawerConfig): void;
+    draw(ctx: CanvasRenderingContext2D, allPoints: VisualSeriesPoint[][], model: DataSeriesModel, hitTestDrawerConfig: HTSeriesDrawerConfig): void;
     private drawCandleTriangle;
 }

package/dist/chart/drawers/data-series-drawers/triangle.drawer.js

@@ -5,11 +5,11 @@
  */
 export class TriangleDrawer {
     constructor() { }
-    draw(ctx, allPoints, model, drawerConfig) {
+    draw(ctx, allPoints, model, hitTestDrawerConfig) {
         allPoints.forEach((points, idx) => {
             var _a;
             const config = model.getPaintConfig(idx);
-            ctx.fillStyle = (_a = drawerConfig.singleColor) !== null && _a !== void 0 ? _a : config.color;
+            ctx.fillStyle = (_a = hitTestDrawerConfig.color) !== null && _a !== void 0 ? _a : config.color;
             points.forEach(p => {
                 const x = model.view.toX(p.centerUnit);
                 const y = model.view.toY(p.close);

package/dist/chart/drawers/data-series.drawer.d.ts

@@ -7,16 +7,16 @@ import { DynamicModelDrawer } from '../components/dynamic-objects/dynamic-object
 import { PaneManager } from '../components/pane/pane-manager.component';
 import { CanvasModel } from '../model/canvas.model';
 import { DataSeriesModel, VisualSeriesPoint } from '../model/data-series.model';
-export interface ChartDrawerConfig {
-    singleColor?: string;
-    forceBold?: number;
+export interface HTSeriesDrawerConfig {
+    color?: string;
+    hoverWidth?: number;
 }
 export interface SeriesDrawer {
     draw: (ctx: CanvasRenderingContext2D, 
     /**
      * You can pass two-dimension array to divide series into multiple parts
      */
-    points: VisualSeriesPoint[][], model: DataSeriesModel, drawerConfig: ChartDrawerConfig) => void;
+    points: VisualSeriesPoint[][], model: DataSeriesModel, hitTestDrawerConfig: HTSeriesDrawerConfig) => void;
 }
 export declare const transformToTwoDimension: (points: VisualSeriesPoint[] | VisualSeriesPoint[][]) => VisualSeriesPoint[][];
 /**
@@ -32,4 +32,4 @@ export declare class DataSeriesDrawer implements DynamicModelDrawer<DataSeriesMo
     draw(canvasModel: CanvasModel, model: DataSeriesModel, paneUUID?: string): void;
     drawSeries(ctx: CanvasRenderingContext2D, series: DataSeriesModel): void;
 }
-export declare const setLineWidth: (ctx: CanvasRenderingContext2D, lineWidth: number, dataSeries: DataSeriesModel, drawerConfig: ChartDrawerConfig, seriesSelectedWidth?: number) => void;
+export declare const setLineWidth: (ctx: CanvasRenderingContext2D, lineWidth: number, dataSeries: DataSeriesModel, hitTestDrawerConfig: HTSeriesDrawerConfig, seriesSelectedWidth?: number) => void;

package/dist/chart/drawers/data-series.drawer.js

@@ -43,9 +43,9 @@ export class DataSeriesDrawer {
         }
     }
 }
-export const setLineWidth = (ctx, lineWidth, dataSeries, drawerConfig, seriesSelectedWidth = lineWidth) => {
-    if (drawerConfig.forceBold) {
-        ctx.lineWidth = drawerConfig.forceBold;
+export const setLineWidth = (ctx, lineWidth, dataSeries, hitTestDrawerConfig, seriesSelectedWidth = lineWidth) => {
+    if (hitTestDrawerConfig.hoverWidth) {
+        ctx.lineWidth = hitTestDrawerConfig.hoverWidth;
     }
     else if (dataSeries.highlighted) {
         ctx.lineWidth = lineWidth !== seriesSelectedWidth ? lineWidth + 1 : seriesSelectedWidth;

package/dist/chart/drawers/ht-data-series.drawer.js

@@ -31,8 +31,8 @@ export class HTDataSeriesDrawer {
             const drawer = this.seriesDrawers[paintTool];
             if (drawer) {
                 const drawConfig = {
-                    singleColor: this.canvasModel.idToColor(series.htId),
-                    forceBold: 7,
+                    color: this.canvasModel.idToColor(series.htId),
+                    hoverWidth: 7,
                 };
                 // +- 1 to correctly draw points which are partly inside bounds
                 drawer.draw(ctx, series.getSeriesInViewport(series.scale.xStart - 1, series.scale.xEnd + 1), series, drawConfig);

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

@@ -125,6 +125,7 @@ export class ScaleModel extends ViewportModel {
         }
     }
     zoomXTo(state, zoomIn, forceNoAnimation) {
+        var _a;
         const initialStateCopy = this.export();
         const constrainedState = this.scalePostProcessor(initialStateCopy, state);
         this.zoomReached = this.calculateZoomReached(constrainedState.zoomX, zoomIn);
@@ -141,6 +142,7 @@ export class ScaleModel extends ViewportModel {
             this.apply(constrainedState);
         }
         else {
+            (_a = this.currentAnimation) === null || _a === void 0 ? void 0 : _a.tick();
             startViewportModelAnimation(this.canvasAnimation, this, constrainedState);
         }
     }
@@ -169,6 +171,7 @@ export class ScaleModel extends ViewportModel {
      * @param forceNoAutoScale - force NOT apply auto-scaling (for lazy loading)
      */
     setXScale(xStart, xEnd, forceNoAnimation = true) {
+        var _a;
         const initialState = this.export();
         const zoomX = this.calculateZoomX(xStart, xEnd);
         if (initialState.xStart === xStart && initialState.xEnd === xEnd && initialState.zoomX > 0) {
@@ -192,6 +195,7 @@ export class ScaleModel extends ViewportModel {
             this.apply(constrainedState);
         }
         else {
+            (_a = this.currentAnimation) === null || _a === void 0 ? void 0 : _a.tick();
             startViewportModelAnimation(this.canvasAnimation, this, constrainedState);
         }
     }

package/dist/chart/utils/numeric-constants.utils.d.ts

@@ -0,0 +1,6 @@
+/*
+ * 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 declare const ONE_FRAME_MS = 16;

package/dist/chart/utils/numeric-constants.utils.js

@@ -0,0 +1,6 @@
+/*
+ * 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 const ONE_FRAME_MS = 16; // 60 frames per second is ~16ms