@devexperts/dxcharts-lite 1.0.1 → 2.0.0

package/dist/chart/components/chart/data-series.high-low-provider.d.ts

@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2002 - 2023 Devexperts LLC
+ * Copyright (C) 2019 - 2023 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/components/chart/data-series.high-low-provider.js

@@ -1,6 +1,39 @@
 /*
- * Copyright (C) 2002 - 2023 Devexperts LLC
+ * Copyright (C) 2019 - 2023 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 createHighLowOffsetCalculator=e=>t=>{const{top:c,bottom:s}=e(),o=t.high-t.low,n=o===0?1:o,r=n*c/100,l=n*s/100,a=t.low-l,f=t.high+r;return{low:a,high:f}},createCandlesOffsetProvider=(e,t)=>{const c=createHighLowOffsetCalculator(e);return{isHighLowActive:()=>!0,calculateHighLow:s=>{const o=t.calculateHighLow(s);return c(o)}}};
+/**
+ * Constraint on top of high low provider - makes additional offset bounds.
+ * @doc-tags viewport,scaling
+ * @param offsetsProvider
+ * @doc-tags viewport,scaling,offsets
+ */
+export const createHighLowOffsetCalculator = (offsetsProvider) => (highLow) => {
+    const { top, bottom } = offsetsProvider();
+    const _height = highLow.high - highLow.low;
+    // TODO what should we do if height is 0?
+    const height = _height === 0 ? 1 : _height;
+    const offsetTop = (height * top) / 100;
+    const offsetBottom = (height * bottom) / 100;
+    const low = highLow.low - offsetBottom;
+    const high = highLow.high + offsetTop;
+    return { low, high };
+};
+/**
+ * Constraint on top of high low provider - makes additional offset bounds.
+ * @doc-tags viewport,scaling
+ * @param offsetsProvider
+ * @param highLowProvider
+ * @doc-tags viewport,scaling,offsets
+ */
+export const createCandlesOffsetProvider = (offsetsProvider, highLowProvider) => {
+    const offsetsCalculator = createHighLowOffsetCalculator(offsetsProvider);
+    return {
+        isHighLowActive: () => true,
+        calculateHighLow: (state) => {
+            const highLow = highLowProvider.calculateHighLow(state);
+            return offsetsCalculator(highLow);
+        },
+    };
+};

package/dist/chart/components/chart/fake-candles.d.ts

@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2002 - 2023 Devexperts LLC
+ * Copyright (C) 2019 - 2023 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/components/chart/fake-candles.js

@@ -1,6 +1,102 @@
 /*
- * Copyright (C) 2002 - 2023 Devexperts LLC
+ * Copyright (C) 2019 - 2023 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{nameDirection as u}from"../../model/candle.model";import{VisualSeriesPoint as g}from"../../model/data-series.model";import C from"../../model/visual-candle";import{firstOf as N,lastOf as w}from"../../utils/array.utils";import{round as h}from"../../utils/math.utils";const m=60;export const fakeVisualCandle=(n,t,o,e,l=m)=>{const r=fakeCandle(n,e,l);r.volume=o;let s;if(t.length===0)s=0;else if(e>=t.length){const c=t[t.length-1],f=(e-(t.length-1))*o;s=c.centerUnit+f}else{const c=t[0],f=-e*o;s=c.centerUnit-f}return new C(s,o,r.open,r.close,r.lo,r.hi,u(r.open,r.close),r)},fakeVisualPoint=(n,t,o,e,l=m)=>{const r=fakeDataPoint(n,e,l);let s;if(t.length===0)s=0;else if(e>=t.length){const c=t[t.length-1],f=(e-(t.length-1))*o;s=c.centerUnit+f}else{const c=t[0],f=-e*o;s=c.centerUnit-f}return new g(s,r.close)},fakeCandle=(n,t,o=m)=>({hi:NaN,lo:NaN,open:NaN,close:NaN,timestamp:i(n,t,o),volume:NaN,expansion:!0,idx:t}),fakeDataPoint=(n,t,o=m)=>({close:NaN,timestamp:i(n,t,o)});function i(n,t,o=m){var e,l;const r=h(t);if(n.length===0)return 0;const s=w(n);if(r>=n.length&&s)return p(s,n.length-1,r,o);const c=N(n);return r<0&&c?p(c,0,r,o):(l=(e=n[r])===null||e===void 0?void 0:e.timestamp)!==null&&l!==void 0?l:0}const p=(n,t,o,e=m)=>n.timestamp+(o-(t!=null?t:0))*e;
+import { nameDirection } from '../../model/candle.model';
+import { VisualSeriesPoint } from '../../model/data-series.model';
+import VisualCandle from '../../model/visual-candle';
+import { firstOf, lastOf } from '../../utils/array.utils';
+import { round } from '../../utils/math.utils';
+const DEFAULT_PERIOD = 60; // 1 minute
+/**
+ * Generates fake candle for left and right "out of data range" zones.
+ * Requires period to calculate the fake timestamp.
+ * The timestamp won't take session breaks or holidays into account.
+ */
+export const fakeVisualCandle = (dataPoints, visualCandles, candleWidth, index, period = DEFAULT_PERIOD) => {
+    const candle = fakeCandle(dataPoints, index, period);
+    // in case we have equivolume
+    candle.volume = candleWidth;
+    let x;
+    if (visualCandles.length === 0) {
+        x = 0;
+    }
+    else if (index >= visualCandles.length) {
+        const lastCandle = visualCandles[visualCandles.length - 1];
+        const candlesCountInBetween = index - (visualCandles.length - 1);
+        const offsetFromLast = candlesCountInBetween * candleWidth;
+        x = lastCandle.centerUnit + offsetFromLast;
+    }
+    else {
+        const firstCandle = visualCandles[0];
+        const candlesCountInBetween = -index;
+        const offsetFromFirst = candlesCountInBetween * candleWidth;
+        x = firstCandle.centerUnit - offsetFromFirst;
+    }
+    return new VisualCandle(x, candleWidth, candle.open, candle.close, candle.lo, candle.hi, nameDirection(candle.open, candle.close), candle);
+};
+export const fakeVisualPoint = (dataPoints, visualPoints, meanDataWidth, index, period = DEFAULT_PERIOD) => {
+    const candle = fakeDataPoint(dataPoints, index, period);
+    let x;
+    if (visualPoints.length === 0) {
+        x = 0;
+    }
+    else if (index >= visualPoints.length) {
+        const lastCandle = visualPoints[visualPoints.length - 1];
+        const candlesCountInBetween = index - (visualPoints.length - 1);
+        const offsetFromLast = candlesCountInBetween * meanDataWidth;
+        x = lastCandle.centerUnit + offsetFromLast;
+    }
+    else {
+        const firstCandle = visualPoints[0];
+        const candlesCountInBetween = -index;
+        const offsetFromFirst = candlesCountInBetween * meanDataWidth;
+        x = firstCandle.centerUnit - offsetFromFirst;
+    }
+    return new VisualSeriesPoint(x, candle.close);
+};
+export const fakeCandle = (candles, index, period = DEFAULT_PERIOD) => {
+    const t = getTimestampOfIndex(candles, index, period);
+    return {
+        hi: NaN,
+        lo: NaN,
+        open: NaN,
+        close: NaN,
+        timestamp: t,
+        volume: NaN,
+        expansion: true,
+        idx: index,
+    };
+};
+export const fakeDataPoint = (candles, index, period = DEFAULT_PERIOD) => {
+    const t = getTimestampOfIndex(candles, index, period);
+    return {
+        close: NaN,
+        timestamp: t,
+    };
+};
+/**
+ * Returns the timestamp of a given index in an array of candles.
+ * @param {Candle[]} candles - An array of candles.
+ * @param {Index} index - The index of the candle to get the timestamp from.
+ * @param {number} [period=DEFAULT_PERIOD] - The period of the candles in milliseconds.
+ * @returns {Timestamp} The timestamp of the candle at the given index or 0 if the array is empty or the index is out of bounds.
+ */
+function getTimestampOfIndex(candles, index, period = DEFAULT_PERIOD) {
+    var _a, _b;
+    const _index = round(index);
+    if (candles.length === 0) {
+        return 0;
+    }
+    const lastCandle = lastOf(candles);
+    if (_index >= candles.length && lastCandle) {
+        return fakeTimestamp(lastCandle, candles.length - 1, _index, period);
+    }
+    const firstCandle = firstOf(candles);
+    if (_index < 0 && firstCandle) {
+        return fakeTimestamp(firstCandle, 0, _index, period);
+    }
+    return (_b = (_a = candles[_index]) === null || _a === void 0 ? void 0 : _a.timestamp) !== null && _b !== void 0 ? _b : 0;
+}
+const fakeTimestamp = (candle, candleIdx, index, period = DEFAULT_PERIOD) => candle.timestamp + (index - (candleIdx !== null && candleIdx !== void 0 ? candleIdx : 0)) * period;

package/dist/chart/components/chart/price.formatter.d.ts

@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2002 - 2023 Devexperts LLC
+ * Copyright (C) 2019 - 2023 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/components/chart/price.formatter.js

@@ -1,6 +1,40 @@
 /*
- * Copyright (C) 2002 - 2023 Devexperts LLC
+ * Copyright (C) 2019 - 2023 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{unitToPercent as a}from"../../model/scaling/viewport.model";import{PriceIncrementsUtils as s}from"../../utils/price-increments.utils";export const createRegularPriceFormatter=t=>r=>{let e;if(typeof r=="number")e=r;else if(typeof r=="string")e=Number(r);else return"\u2014";const[n]=t.dataSeries;if(n!==void 0){const i=s.getPricePrecision(e,n.pricePrecisions);return e.toFixed(i)}return`${e}`},createPercentFormatter=t=>(r,e)=>{const[n]=t.dataSeries;let i=r;const o=e!=null?e:n;o!==void 0&&(i=a(r,o.getBaseLine()));const c=i.toFixed(s.DEFAULT_PRECISION).replace("-","\u2212")+" %";return c==="\u22120.00 %"?"0.00 %":c},createYExtentFormatters=t=>({percent:createPercentFormatter(t),regular:createRegularPriceFormatter(t)});
+import { unitToPercent } from '../../model/scaling/viewport.model';
+import { PriceIncrementsUtils } from '../../utils/price-increments.utils';
+export const createRegularPriceFormatter = (extent) => (value) => {
+    let checkedValue;
+    if (typeof value === 'number') {
+        checkedValue = value;
+    }
+    else if (typeof value === 'string') {
+        checkedValue = Number(value);
+    }
+    else {
+        return '—';
+    }
+    const [mainDataSeries] = extent.dataSeries;
+    if (mainDataSeries !== undefined) {
+        const precision = PriceIncrementsUtils.getPricePrecision(checkedValue, mainDataSeries.pricePrecisions);
+        return checkedValue.toFixed(precision);
+    }
+    return `${checkedValue}`;
+};
+export const createPercentFormatter = (extent) => (value, dataSeries) => {
+    const [mainDataSeries] = extent.dataSeries;
+    let valueUnit = value;
+    const series = dataSeries !== null && dataSeries !== void 0 ? dataSeries : mainDataSeries;
+    if (series !== undefined) {
+        valueUnit = unitToPercent(value, series.getBaseline());
+    }
+    // always apply default precision for percent
+    const formatted = valueUnit.toFixed(PriceIncrementsUtils.DEFAULT_PRECISION).replace('-', '−') + ' %';
+    return formatted === '−0.00 %' ? '0.00 %' : formatted;
+};
+export const createYExtentFormatters = (extent) => ({
+    percent: createPercentFormatter(extent),
+    regular: createRegularPriceFormatter(extent),
+});

package/dist/chart/components/chart/secondary-chart-colors-pool.d.ts

@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2002 - 2023 Devexperts LLC
+ * Copyright (C) 2019 - 2023 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/components/chart/secondary-chart-colors-pool.js

@@ -1,6 +1,73 @@
 /*
- * Copyright (C) 2002 - 2023 Devexperts LLC
+ * Copyright (C) 2019 - 2023 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{cloneUnsafe as a}from"../../utils/object.utils";export class SecondaryChartColorsPool{constructor(e){this.config=e,this.usedChartColors={},this.symbolsToColorKeys={},this.secondaryChartColorsPool=this.createColorPool(this.config.colors.secondaryChartTheme),this.usedChartColors=Object.keys(this.secondaryChartColorsPool).reduce((o,s)=>Object.assign(Object.assign({},o),{[s]:0}),{})}createColorPool(e){return e.reduce((o,s,r)=>(o[`color${r}`]=Object.assign(Object.assign({},a(this.config.colors)),{lineTheme:Object.assign({},s.lineTheme),areaTheme:Object.assign({},s.areaTheme)}),o),{})}takeColorFromPool(e){let o=Number.MAX_SAFE_INTEGER,s="";for(const[r,t]of Object.entries(this.usedChartColors))t<o&&(o=t,s=r);return this.usedChartColors[s]=this.usedChartColors[s]+1,this.symbolsToColorKeys[e]=s,this.secondaryChartColorsPool[s]}addColorToPool(e){const o=this.symbolsToColorKeys[e];this.usedChartColors[o]&&(this.usedChartColors[o]=this.usedChartColors[o]-1)}updateColorConfig(e,o){var s,r;const t=this.secondaryChartColorsPool[this.usedChartColors[e]];if(t){const l=o;this.secondaryChartColorsPool[this.usedChartColors[e]]=Object.assign(Object.assign({},o),{lineTheme:Object.assign(t.lineTheme,(s=l.lineTheme)!==null&&s!==void 0?s:{}),areaTheme:Object.assign(t.areaTheme,(r=l.areaTheme)!==null&&r!==void 0?r:{})})}}}
+import { cloneUnsafe } from '../../utils/object.utils';
+export class SecondaryChartColorsPool {
+    constructor(config) {
+        this.config = config;
+        this.usedChartColors = {};
+        this.symbolsToColorKeys = {};
+        this.secondaryChartColorsPool = this.createColorPool(this.config.colors.secondaryChartTheme);
+        this.usedChartColors = Object.keys(this.secondaryChartColorsPool).reduce((acc, key) => (Object.assign(Object.assign({}, acc), { [key]: 0 })), {});
+    }
+    /**
+     * Creates a color pool object based on the provided color array
+     * @param {SecondaryChartTheme[]} colorArray - An array of SecondaryChartTheme objects
+     * @returns {Object} - An object containing a key-value pair for each color in the colorArray
+     * The key is a string in the format "colorX" where X is the index of the color in the array
+     * The value is an object containing the FullChartColors for the color, with lineTheme and areaTheme properties
+     */
+    createColorPool(colorArray) {
+        return colorArray.reduce((acc, item, index) => {
+            acc[`color${index}`] = Object.assign(Object.assign({}, cloneUnsafe(this.config.colors)), { lineTheme: Object.assign({}, item.lineTheme), areaTheme: Object.assign({}, item.areaTheme) });
+            return acc;
+        }, {});
+    }
+    /**
+     * Takes a color from the secondaryChartColorsPool and assigns it to a symbol.
+     * @param {string} symbol - The symbol to assign the color to.
+     * @returns {string} The color assigned to the symbol.
+     */
+    takeColorFromPool(symbol) {
+        let minColors = Number.MAX_SAFE_INTEGER;
+        let minColorKey = '';
+        for (const [key, value] of Object.entries(this.usedChartColors)) {
+            if (value < minColors) {
+                minColors = value;
+                minColorKey = key;
+            }
+        }
+        this.usedChartColors[minColorKey] = this.usedChartColors[minColorKey] + 1;
+        this.symbolsToColorKeys[symbol] = minColorKey;
+        return this.secondaryChartColorsPool[minColorKey];
+    }
+    /**
+     * Adds a color to the chart color pool.
+     *
+     * @param {string} symbol - The symbol of the color to be added.
+     *
+     * @returns {void}
+     */
+    addColorToPool(symbol) {
+        const key = this.symbolsToColorKeys[symbol];
+        if (this.usedChartColors[key]) {
+            this.usedChartColors[key] = this.usedChartColors[key] - 1;
+        }
+    }
+    /**
+     * Updates the color configuration for a given symbol in the chart.
+     * @param {string} symbol - The symbol for which the color configuration needs to be updated.
+     * @param {CandleSeriesColors} config - The new color configuration for the symbol.
+     * @returns {void}
+     */
+    updateColorConfig(symbol, config) {
+        var _a, _b;
+        const existColorConfig = this.secondaryChartColorsPool[this.usedChartColors[symbol]];
+        if (existColorConfig) {
+            const colors = config;
+            this.secondaryChartColorsPool[this.usedChartColors[symbol]] = Object.assign(Object.assign({}, config), { lineTheme: Object.assign(existColorConfig.lineTheme, (_a = colors.lineTheme) !== null && _a !== void 0 ? _a : {}), areaTheme: Object.assign(existColorConfig.areaTheme, (_b = colors.areaTheme) !== null && _b !== void 0 ? _b : {}) });
+        }
+    }
+}

package/dist/chart/components/cross_tool/cross-tool.component.d.ts

@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2002 - 2023 Devexperts LLC
+ * Copyright (C) 2019 - 2023 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/components/cross_tool/cross-tool.component.js

@@ -1,6 +1,90 @@
 /*
- * Copyright (C) 2002 - 2023 Devexperts LLC
+ * Copyright (C) 2019 - 2023 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{ClearCanvasDrawer as p}from"../../drawers/clear-canvas.drawer";import{CompositeDrawer as c}from"../../drawers/composite.drawer";import{ChartBaseElement as d}from"../../model/chart-base-element";import{CrossToolDrawer as w}from"./cross-tool.drawer";import{CrossToolModel as C}from"./cross-tool.model";import{CrossAndLabelsDrawerType as o}from"./types/cross-and-labels.drawer";import{NoneDrawerType as m}from"./types/none.drawer";export class CrossToolComponent extends d{constructor(s,e,t,a,n,i,l){super(),this.config=s,this.crossToolCanvasModel=e,this.canvasBoundsContainer=t,this.drawingManager=a,this.paneManager=n,this.crossToolTypeDrawers={},this.model=new C(s.components.crossTool,this.crossToolCanvasModel,i,l),this.addChildEntity(this.model);const T=new p(this.crossToolCanvasModel);this.registerDefaultDrawerTypes();const h=new w(this.model,this.crossToolCanvasModel,this.crossToolTypeDrawers),r=new c;r.addDrawer(T,"CLEAR_CANVAS"),r.addDrawer(h,"CROSS_TOOL_DRAWER"),this.drawingManager.addDrawer(r,"CROSS_TOOL")}registerDefaultDrawerTypes(){this.registerCrossToolTypeDrawer("cross-and-labels",new o(this.config,this.canvasBoundsContainer,this.paneManager,()=>!0)),this.registerCrossToolTypeDrawer("just-labels",new o(this.config,this.canvasBoundsContainer,this.paneManager,()=>!0,!0)),this.registerCrossToolTypeDrawer("none",new m)}setVisible(s){this.model.setType(s?"cross-and-labels":"none")}setType(s){this.model.setType(s)}observeCrossToolChanged(){return this.model.currentHoverSubject}setMagnetTarget(s){this.config.components.crossTool.magnetTarget=s}registerCrossToolTypeDrawer(s,e){this.crossToolTypeDrawers[s]=e}}
+import { ClearCanvasDrawer } from '../../drawers/clear-canvas.drawer';
+import { CompositeDrawer } from '../../drawers/composite.drawer';
+import { ChartBaseElement } from '../../model/chart-base-element';
+import { CrossToolDrawer } from './cross-tool.drawer';
+import { CrossToolModel } from './cross-tool.model';
+import { CrossAndLabelsDrawerType } from './types/cross-and-labels.drawer';
+import { NoneDrawerType } from './types/none.drawer';
+/**
+ * Default bundled chart cross tool.
+ */
+export class CrossToolComponent extends ChartBaseElement {
+    constructor(config, crossToolCanvasModel, canvasBoundsContainer, drawingManager, paneManager, crossEventProducer, hoverProducer) {
+        super();
+        this.config = config;
+        this.crossToolCanvasModel = crossToolCanvasModel;
+        this.canvasBoundsContainer = canvasBoundsContainer;
+        this.drawingManager = drawingManager;
+        this.paneManager = paneManager;
+        this.crossToolTypeDrawers = {};
+        this.model = new CrossToolModel(config.components.crossTool, this.crossToolCanvasModel, crossEventProducer, hoverProducer);
+        this.addChildEntity(this.model);
+        const clearCanvasDrawer = new ClearCanvasDrawer(this.crossToolCanvasModel);
+        this.registerDefaultDrawerTypes();
+        const crossToolDrawer = new CrossToolDrawer(this.model, this.crossToolCanvasModel, this.crossToolTypeDrawers);
+        const compositeDrawer = new CompositeDrawer();
+        compositeDrawer.addDrawer(clearCanvasDrawer, 'CLEAR_CANVAS');
+        compositeDrawer.addDrawer(crossToolDrawer, 'CROSS_TOOL_DRAWER');
+        this.drawingManager.addDrawer(compositeDrawer, 'CROSS_TOOL');
+    }
+    /**
+     * Registers default drawer types for the chart.
+     * @private
+     * @function
+     * @name registerDefaultDrawerTypes
+     *
+     * @returns {void}
+     */
+    registerDefaultDrawerTypes() {
+        this.registerCrossToolTypeDrawer('cross-and-labels', new CrossAndLabelsDrawerType(this.config, this.canvasBoundsContainer, this.paneManager, () => true));
+        this.registerCrossToolTypeDrawer('just-labels', new CrossAndLabelsDrawerType(this.config, this.canvasBoundsContainer, this.paneManager, () => true, true));
+        this.registerCrossToolTypeDrawer('none', new NoneDrawerType());
+    }
+    //#region public methods
+    /**
+     * Sets the cross tool visibility.
+     * @param visible
+     */
+    setVisible(visible) {
+        this.model.setType(visible ? 'cross-and-labels' : 'none');
+    }
+    /**
+     * Sets the crosstool type.
+     * - cross-and-labels - both the crosshair and X/Y labels
+     * - only-labels - only the X/Y label
+     * - none
+     * @param type
+     */
+    setType(type) {
+        this.model.setType(type);
+    }
+    /**
+     * Returns an Observable that emits the current hover subject.
+     */
+    observeCrossToolChanged() {
+        return this.model.currentHoverSubject;
+    }
+    /**
+     * Sets magnet target for cross tool.
+     * Supported only for 'cross-and-labels' type.
+     * Default magnet target is none.
+     * @param target
+     */
+    setMagnetTarget(target) {
+        this.config.components.crossTool.magnetTarget = target;
+    }
+    /**
+     * Adds a new drawer type for cross tool, so you can add your own implementation of cross tool
+     * (or override existing)
+     * @param drawerName - an unique drawer type name
+     * @param drawerImpl - CrossToolTypeDrawer object
+     */
+    registerCrossToolTypeDrawer(drawerName, drawerImpl) {
+        this.crossToolTypeDrawers[drawerName] = drawerImpl;
+    }
+}

package/dist/chart/components/cross_tool/cross-tool.drawer.d.ts

@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2002 - 2023 Devexperts LLC
+ * Copyright (C) 2019 - 2023 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/components/cross_tool/cross-tool.drawer.js

@@ -1,6 +1,37 @@
 /*
- * Copyright (C) 2002 - 2023 Devexperts LLC
+ * Copyright (C) 2019 - 2023 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 class CrossToolDrawer{constructor(o,s,r){this.model=o,this.crossToolCanvasModel=s,this.crossToolTypeDrawers=r}draw(){const o=this.crossToolTypeDrawers[this.model.type];o?this.model.currentHover&&o.draw(this.crossToolCanvasModel.ctx,this.model.currentHover):console.error(`No cross tool drawer type registered for drawer type ${this.model.type}`)}getCanvasIds(){return[this.crossToolCanvasModel.canvasId]}}
+export class CrossToolDrawer {
+    constructor(model, crossToolCanvasModel, crossToolTypeDrawers) {
+        this.model = model;
+        this.crossToolCanvasModel = crossToolCanvasModel;
+        this.crossToolTypeDrawers = crossToolTypeDrawers;
+    }
+    /**
+     * Draws the cross tool on the canvas.
+     * @function
+     * @name draw
+     * @memberof CrossToolCanvasView
+     * @instance
+     * @returns {void}
+     */
+    draw() {
+        const drawer = this.crossToolTypeDrawers[this.model.type];
+        if (drawer) {
+            this.model.currentHover && drawer.draw(this.crossToolCanvasModel.ctx, this.model.currentHover);
+        }
+        else {
+            console.error(`No cross tool drawer type registered for drawer type ${this.model.type}`);
+        }
+    }
+    /**
+     * Returns an array of string containing the canvas ID of the crossToolCanvasModel.
+     *
+     * @returns {Array<string>} An array of string containing the canvas ID of the crossToolCanvasModel.
+     */
+    getCanvasIds() {
+        return [this.crossToolCanvasModel.canvasId];
+    }
+}

package/dist/chart/components/cross_tool/cross-tool.model.d.ts

@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2002 - 2023 Devexperts LLC
+ * Copyright (C) 2019 - 2023 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/components/cross_tool/cross-tool.model.js

@@ -1,6 +1,112 @@
 /*
- * Copyright (C) 2002 - 2023 Devexperts LLC
+ * Copyright (C) 2019 - 2023 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 as c}from"rxjs";import{ChartBaseElement as o}from"../../model/chart-base-element";import{CHART_UUID as i}from"../../canvas/canvas-bounds-container";export class CrossToolModel extends o{get currentHover(){return this.currentHoverSubject.getValue()}set currentHover(e){this.currentHoverSubject.next(e)}constructor(e,r,t,s){super(),this.config=e,this.crossToolCanvasModel=r,this.crossEventProducer=t,this.hoverProducer=s,this.currentHoverSubject=new c(null),this.type="cross-and-labels",this.type=e.type}setType(e){this.type=e}doActivate(){super.doActivate(),this.addRxSubscription(this.hoverProducer.hoverSubject.subscribe(e=>{this.crossEventProducer.crossSubject.getValue()!==null&&e!==null?this.updateHover(e):this.currentHover=null,this.fireDraw()}))}fireDraw(){this.type!=="none"&&this.crossToolCanvasModel.fireDraw()}updateHover(e,r=this.config.magnetTarget){if(this.currentHover===null?this.currentHover={x:e.x,y:0,time:e.timeFormatted,paneId:e.paneId}:(this.currentHover.x=e.x,this.currentHover.time=e.timeFormatted),e.candleHover&&e.paneId===i)switch(r){case"O":this.currentHover.y=e.candleHover.openY;break;case"C":this.currentHover.y=e.candleHover.closeY;break;case"H":this.currentHover.y=e.candleHover.highY;break;case"L":this.currentHover.y=e.candleHover.lowY;break;case"OHLC":this.currentHover.y=e.candleHover.closestOHLCY;break;case"none":this.currentHover.y=e.y;break}else this.currentHover.y=e.y;this.currentHoverSubject.next(this.currentHover)}}
+import { BehaviorSubject } from 'rxjs';
+import { ChartBaseElement } from '../../model/chart-base-element';
+import { CHART_UUID } from '../../canvas/canvas-bounds-container';
+export class CrossToolModel extends ChartBaseElement {
+    get currentHover() {
+        return this.currentHoverSubject.getValue();
+    }
+    set currentHover(value) {
+        this.currentHoverSubject.next(value);
+    }
+    constructor(config, crossToolCanvasModel, crossEventProducer, hoverProducer) {
+        super();
+        this.config = config;
+        this.crossToolCanvasModel = crossToolCanvasModel;
+        this.crossEventProducer = crossEventProducer;
+        this.hoverProducer = hoverProducer;
+        // the main hover object which will be presented on UI
+        this.currentHoverSubject = new BehaviorSubject(null);
+        this.type = 'cross-and-labels';
+        this.type = config.type;
+    }
+    /**
+     * Sets the type of the CrossTool object.
+     *
+     * @param {CrossToolType} type - The type of the CrossTool object.
+     * @returns {void}
+     */
+    setType(type) {
+        this.type = type;
+    }
+    /**
+     * Method to activate the cross tool.
+     * It subscribes to the canvasInputListener's mouse move event and fires the draw event.
+     * It also subscribes to the eventBus's hover and close hover events and updates the hover and fires the draw event accordingly.
+     * It also subscribes to the chartModel's candlesSetSubject and timeZoneModel's observeTimeZoneChanged events and recalculates the cross tool X formatter.
+     */
+    doActivate() {
+        super.doActivate();
+        this.addRxSubscription(this.hoverProducer.hoverSubject.subscribe(hover => {
+            if (this.crossEventProducer.crossSubject.getValue() !== null && hover !== null) {
+                this.updateHover(hover);
+            }
+            else {
+                this.currentHover = null;
+            }
+            this.fireDraw();
+        }));
+    }
+    /**
+     * This method is used to fire the draw event of the crossToolCanvasModel if the type is not 'none'.
+     * @private
+     */
+    fireDraw() {
+        if (this.type !== 'none') {
+            this.crossToolCanvasModel.fireDraw();
+        }
+    }
+    /**
+     * Updates the current hover position with the provided hover object.
+     * @param {Object} hover - The hover object containing the x and y coordinates and time formatted.
+     * @param {number} hover.x - The x coordinate of the hover.
+     * @param {number} hover.y - The y coordinate of the hover.
+     * @param {string} hover.timeFormatted - The formatted time of the hover.
+     * @param {Object} hover.candleHover - The candle hover object containing the open, close, high, low and closestOHLCY coordinates.
+     * @param {number} hover.candleHover.openY - The y coordinate of the open price of the candle.
+     * @param {number} hover.candleHover.closeY - The y coordinate of the close price of the candle.
+     * @param {number} hover.candleHover.highY - The y coordinate of the high price of the candle.
+     * @param {number} hover.candleHover.lowY - The y coordinate of the low price of the candle.
+     * @param {number} hover.candleHover.closestOHLCY - The y coordinate of the closest OHLC price of the candle.
+     * @returns {void}
+     */
+    updateHover(hover, magnetTarget = this.config.magnetTarget) {
+        if (this.currentHover === null) {
+            this.currentHover = { x: hover.x, y: 0, time: hover.timeFormatted, paneId: hover.paneId };
+        }
+        else {
+            this.currentHover.x = hover.x;
+            this.currentHover.time = hover.timeFormatted;
+        }
+        if (hover.candleHover && hover.paneId === CHART_UUID) {
+            switch (magnetTarget) {
+                case 'O':
+                    this.currentHover.y = hover.candleHover.openY;
+                    break;
+                case 'C':
+                    this.currentHover.y = hover.candleHover.closeY;
+                    break;
+                case 'H':
+                    this.currentHover.y = hover.candleHover.highY;
+                    break;
+                case 'L':
+                    this.currentHover.y = hover.candleHover.lowY;
+                    break;
+                case 'OHLC':
+                    this.currentHover.y = hover.candleHover.closestOHLCY;
+                    break;
+                case 'none':
+                    this.currentHover.y = hover.y;
+                    break;
+            }
+        }
+        else {
+            this.currentHover.y = hover.y;
+        }
+        this.currentHoverSubject.next(this.currentHover);
+    }
+}

package/dist/chart/components/cross_tool/types/cross-and-labels.drawer.d.ts

@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2002 - 2023 Devexperts LLC
+ * Copyright (C) 2019 - 2023 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/.
  */