npm - @devexperts/dxcharts-lite - Versions diffs - 2.0.0 → 2.0.2 - Mend

@devexperts/dxcharts-lite 2.0.0 → 2.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (32) hide show

package/README.md CHANGED Viewed

@@ -23,7 +23,7 @@
     <img src="https://img.shields.io/static/v1?label=PRs&message=Welcome&color=blue" alt="PRs: Welcome" />
   </a>&nbsp;
   <a href="https://devexperts.com/dxcharts-demo/?lang=en">
-    <img src="https://img.shields.io/static/v1?label=Latest%20version&message=1.0.0&color=blue" alt="Version" />
+    <img src="https://img.shields.io/static/v1?label=Latest%20version&message=2.0.2&color=blue" alt="Version" />
   </a>
 </p>
@@ -97,16 +97,11 @@ Now you should have empty chart on screen.
 Let's pass in some data i.e. `Candles`. You can use bundled function to generate some mock data.
 Import `generateCandlesData` and call it to generate candles.
-Also, you would need `Instrument` object - it is required to show instrument description on chart and show correct price precisions on Y axis.
 ```js
 export const generateMockData = () => {
-	const mockCandles = generateCandlesData();
-	const mockInstrument = {
-		symbol: 'AAPL',
-		priceIncrements: [0.01],
-	};
-	chart.setData({ candles: mockCandles, instrument: mockInstrument });
+	const candles = generateCandlesData();
+	chart.setData({ candles });
 };
 ```
@@ -120,28 +115,32 @@ Now you should see chart just like image below:
 Here is full quick-start code example:
-```markup
+```html
 <html>
-    <head>
-        <script src="https://www.unpkg.com/@devexperts/dxcharts-lite@1.0.1/dist/dxchart.min.js"></script>
-    </head>
-    <body>
-        <div id="chart_container"></div>
-    </body>
-    <script type="module">
-        import generateCandlesData from 'https://www.unpkg.com/@devexperts/dxcharts-lite@1.0.1/dist/chart/utils/candles-generator.utils.js';
-        // create chart instance, pass parent container as 1st argument
-        const container = document.getElementById("chart_container");
-        const chartInstance = DXChart.createChart(container);
-        // create and set candles data
-        const mockCandles = generateCandlesData();
-        const mockInstrument = {
-            symbol: 'AAPL',
-            priceIncrements: [0.01],
-        };
-        chart.setData({ candles: mockCandles, instrument: mockInstrument });
-  </script>
+	<head>
+		<script src="https://www.unpkg.com/@devexperts/dxcharts-lite@2.0.1/dist/dxchart.min.js"></script>
+		<script type="importmap">
+			{
+				"imports": {
+					"@devexperts/dxcharts-lite/": "https://www.unpkg.com/@devexperts/dxcharts-lite@2.0.1/"
+				}
+			}
+		</script>
+	</head>
+	<body>
+		<div id="chart_container"></div>
+	</body>
+	<script type="module">
+		import generateCandlesData from '@devexperts/dxcharts-lite/dist/chart/utils/candles-generator.utils';
+		// create chart instance, pass parent container as 1st argument
+		const container = document.getElementById('chart_container');
+		const chart = DXChart.createChart(container);
+		// create and set candles data
+		const candles = generateCandlesData();
+		chart.setData({ candles });
+	</script>
+</html>
 ```
 ## Configuration

package/dist/chart/bootstrap.d.ts CHANGED Viewed

@@ -7,7 +7,6 @@ import { CanvasAnimation } from './animation/canvas-animation';
 import { CanvasBoundsContainer } from './canvas/canvas-bounds-container';
 import { ValidatedChartElements } from './canvas/chart-elements';
 import { CursorHandler } from './canvas/cursor.handler';
-import ChartContainer from './chart-container';
 import { ChartColors, ChartConfigComponentsOffsets, FullChartConfig, GridComponentConfig, PartialChartConfig } from './chart.config';
 import { ChartBaseModel } from './components/chart/chart-base.model';
 import { ChartComponent } from './components/chart/chart.component';
@@ -43,7 +42,7 @@ export type FitType = 'studies' | 'orders' | 'positions';
 /**
  * @deprecated use {Chart} instead
  */
-export default class ChartBootstrap implements ChartContainer {
+export default class ChartBootstrap {
     id: string;
     bus: EventBus;
     config: FullChartConfig;
@@ -89,6 +88,9 @@ export default class ChartBootstrap implements ChartContainer {
     mainCanvasModel: CanvasModel;
     dynamicObjectsCanvasModel: CanvasModel;
     hitTestCanvasModel: HitTestCanvasModel;
+    /**
+     * @deprecated use {bounds} instead
+     */
     canvasBoundsContainer: CanvasBoundsContainer;
     canvasInputListener: CanvasInputListenerComponent;
     /**
@@ -117,6 +119,9 @@ export default class ChartBootstrap implements ChartContainer {
      */
     chartPanComponent: ChartPanComponent;
     paneManager: PaneManager;
+    /**
+     * @deprecated use {hover} instead
+     */
     hoverProducer: HoverProducerComponent;
     canvasModels: CanvasModel[];
     chartResizeHandler: ChartResizeHandler;

package/dist/chart/bootstrap.js CHANGED Viewed

@@ -8,7 +8,7 @@ import { CanvasAnimation } from './animation/canvas-animation';
 import { CHART_UUID, CanvasBoundsContainer, CanvasElement } from './canvas/canvas-bounds-container';
 import { CursorHandler } from './canvas/cursor.handler';
 import { createDefaultLayoutTemplate, extractElements } from './canvas/layout-creator';
-import { mergeWithDefaultConfig } from './chart.config';
+import { mergeWithDefaultConfig, } from './chart.config';
 import { ChartBaseModel } from './components/chart/chart-base.model';
 import { ChartComponent } from './components/chart/chart.component';
 import { ChartModel } from './components/chart/chart.model';
@@ -170,7 +170,7 @@ export default class ChartBootstrap {
         this.initYAxisDrawer(yAxisLabelsCanvasModel);
         this.yAxisComponent = mainPane.mainExtent.yAxis;
         // default labels provider
-        const lastCandleLabelsProvider = new LastCandleLabelsProvider(this.chartModel, this.config, this.chartModel.lastCandleLabelsByChartType, this.yAxisComponent.getLabelsColorResolver.bind(this.yAxisComponent));
+        const lastCandleLabelsProvider = new LastCandleLabelsProvider(this.chartModel, this.config, mainPane.mainExtent.yAxis.state, this.chartModel.lastCandleLabelsByChartType, this.yAxisComponent.getLabelsColorResolver.bind(this.yAxisComponent));
         this.yAxisComponent.registerYAxisLabelsProvider(lastCandleLabelsProvider, LabelsGroups.MAIN);
         this.volumesComponent = new VolumesComponent(this.dynamicObjectsCanvasModel, chartComponent, scaleModel, canvasBoundsContainer, drawingManager, config, paneManager, this.dynamicObjects);
         this.chartComponents.push(this.volumesComponent);

package/dist/chart/chart.d.ts CHANGED Viewed

@@ -24,6 +24,8 @@ export declare class Chart extends ChartBootstrap {
     data: import("./components/chart/chart.component").ChartComponent;
     scale: import("./model/scale.model").ScaleModel;
     panning: import("./components/pan/chart-pan.component").ChartPanComponent;
+    bounds: import("./canvas/canvas-bounds-container").CanvasBoundsContainer;
+    hover: import("./inputhandlers/hover-producer.component").HoverProducerComponent;
     constructor(element: HTMLElement, config?: PartialChartConfig);
     /**
      * Registers number formatters for pane

package/dist/chart/chart.js CHANGED Viewed

@@ -23,6 +23,8 @@ export class Chart extends ChartBootstrap {
         this.data = this.chartComponent;
         this.scale = this.scaleModel;
         this.panning = this.chartPanComponent;
+        this.bounds = this.canvasBoundsContainer;
+        this.hover = this.hoverProducer;
     }
     /**
      * Registers number formatters for pane
@@ -53,7 +55,7 @@ export class Chart extends ChartBootstrap {
     showSeparateVolumes(separate = false) {
         if (this.volumes) {
             this.volumes.setShowVolumesSeparatly(separate);
-            this.canvasBoundsContainer.updateYAxisWidths();
+            this.bounds.updateYAxisWidths();
         }
     }
     setData(data) {

package/dist/chart/components/chart/candle-transformer.functions.d.ts CHANGED Viewed

@@ -8,4 +8,5 @@ import { Candle } from '../../model/candle.model';
 export declare const defaultCandleTransformer: VisualCandleCalculator;
 export declare const hollowCandleTransformer: VisualCandleCalculator;
 export declare const trendCandleTransformer: VisualCandleCalculator;
+export declare const lineCandleTransformer: VisualCandleCalculator;
 export declare const getCandleIsActive: (candle: Candle, activeCandle?: Candle) => boolean;

package/dist/chart/components/chart/candle-transformer.functions.js CHANGED Viewed

@@ -14,6 +14,7 @@ export const trendCandleTransformer = (candle, { x, width, activeCandle, prevCan
     var _a;
     return new VisualCandle(x, width, candle.open, candle.close, candle.hi, candle.lo, nameDirection((_a = prevCandle === null || prevCandle === void 0 ? void 0 : prevCandle.close) !== null && _a !== void 0 ? _a : candle.close, candle.close), candle, true, getCandleIsActive(candle, activeCandle), candle.close > candle.open);
 };
+export const lineCandleTransformer = trendCandleTransformer;
 export const getCandleIsActive = (candle, activeCandle) => {
     const isActive = activeCandle && activeCandle.idx === candle.idx;
     return isActive !== null && isActive !== void 0 ? isActive : false;

package/dist/chart/components/chart/chart-base.model.d.ts CHANGED Viewed

@@ -40,7 +40,7 @@ export declare class ChartBaseModel<T extends BaseType = 'point'> {
      * For given timestamp finds the closest candle in dataset.
      * @param timestamp
      */
-    dataFromTimestamp(timestamp: Timestamp, shouldExtrapolate?: boolean): VisualPoint<T>;
+    dataFromTimestamp(timestamp: Timestamp, shouldExtrapolate?: boolean, selectedDataPoints?: DataPoint<T>[]): VisualPoint<T>;
     /**
      * Recalculates the period of the main candle series based on the data points.
      * If a period is detected, it is set as the new period.

package/dist/chart/components/chart/chart-base.model.js CHANGED Viewed

@@ -34,8 +34,8 @@ export class ChartBaseModel {
      * @param timestamp
      */
     // TODO think how to make this function like candleFromX
-    dataFromTimestamp(timestamp, shouldExtrapolate = true) {
-        const result = searchCandleIndex(timestamp, shouldExtrapolate, this.mainDataPoints, this.period);
+    dataFromTimestamp(timestamp, shouldExtrapolate = true, selectedDataPoints = this.mainDataPoints) {
+        const result = searchCandleIndex(timestamp, shouldExtrapolate, selectedDataPoints, this.period);
         return this.dataFromIdx(result.index);
     }
     /**

package/dist/chart/components/chart/chart.component.d.ts CHANGED Viewed

@@ -190,6 +190,12 @@ export declare class ChartComponent extends ChartBaseElement {
      * @param instrument - name of the instrument to update
      */
     addLastCandle(candle: Candle, instrumentSymbol?: string): void;
+    /**
+     * Remove candle by idx and recaculate indexes
+     * @param idx - candle index
+     * @param instrument - name of the instrument to update
+     */
+    removeCandleByIdx(idx: number, instrumentSymbol?: string): void;
     /**
      * Updates last candle value
      * @param candle - updated candle

package/dist/chart/components/chart/chart.component.js CHANGED Viewed

@@ -27,7 +27,7 @@ import { HTDataSeriesDrawer } from '../../drawers/ht-data-series.drawer';
 import { BaselineModel } from '../../model/baseline.model';
 import { keys } from '../../utils/object.utils';
 import { PriceIncrementsUtils } from '../../utils/price-increments.utils';
-import { defaultCandleTransformer, hollowCandleTransformer, trendCandleTransformer, } from './candle-transformer.functions';
+import { defaultCandleTransformer, hollowCandleTransformer, lineCandleTransformer, trendCandleTransformer, } from './candle-transformer.functions';
 import { deleteCandlesIndex } from './candle.functions';
 import { TrendHistogramDrawer } from '../../drawers/data-series-drawers/trend-histogram.drawer';
 /**
@@ -105,6 +105,7 @@ export class ChartComponent extends ChartBaseElement {
         this.registerCandlesTransformer('candle', defaultCandleTransformer);
         this.registerCandlesTransformer('trend', trendCandleTransformer);
         this.registerCandlesTransformer('hollow', hollowCandleTransformer);
+        this.registerCandlesTransformer('line', lineCandleTransformer);
     }
     get barTypeValues() {
         // @ts-ignore
@@ -319,6 +320,14 @@ export class ChartComponent extends ChartBaseElement {
     addLastCandle(candle, instrumentSymbol) {
         this.chartModel.addLastCandle(candle, instrumentSymbol);
     }
+    /**
+     * Remove candle by idx and recaculate indexes
+     * @param idx - candle index
+     * @param instrument - name of the instrument to update
+     */
+    removeCandleByIdx(idx, instrumentSymbol) {
+        this.chartModel.removeCandleByIdx(idx, instrumentSymbol);
+    }
     /**
      * Updates last candle value
      * @param candle - updated candle

package/dist/chart/components/chart/chart.model.d.ts CHANGED Viewed

@@ -250,7 +250,7 @@ export declare class ChartModel extends ChartBaseElement {
      * For given timestamp finds the closest candle in dataset.
      * @param timestamp
      */
-    candleFromTimestamp(timestamp: Timestamp, shouldExtrapolate?: boolean): VisualCandle;
+    candleFromTimestamp(timestamp: Timestamp, extrapolate?: boolean, selectedCandleSeries?: CandleSeriesModel): VisualCandle;
     /**
      * For given index returns the closest visual candle, or fake candle with correct X coordinate.
      * @param idx - index of candle
@@ -432,6 +432,12 @@ export declare class ChartModel extends ChartBaseElement {
      * @param instrument - name of the instrument to update
      */
     updateLastCandle(candle: Candle, instrumentSymbol?: string): void;
+    /**
+     * Remove candle by idx and recaculate indexes
+     * @param candle - new candle
+     * @param instrument - name of the instrument to update
+     */
+    removeCandleByIdx(idx: number, instrumentSymbol?: string): void;
 }
 export interface UpdateCandlesResult {
     prepended: number;

package/dist/chart/components/chart/chart.model.js CHANGED Viewed

@@ -183,7 +183,7 @@ export class ChartModel extends ChartBaseElement {
             // now the visual candles
             candleSeriesModel.recalculateVisualPoints();
             this.candlesSetSubject.next();
-            this.bus.fireDraw([this.canvasModel.canvasId]);
+            this.canvasModel.fireDraw();
         }
         return candleSeriesModel;
     }
@@ -220,7 +220,7 @@ export class ChartModel extends ChartBaseElement {
         this.autoScaleOnCandles();
         this.scale.doAutoScale();
         this.candlesSetSubject.next();
-        this.bus.fireDraw([this.canvasModel.canvasId]);
+        this.canvasModel.fireDraw();
     }
     /**
      * This function checks if the autoScaleOnCandles state is true. If it is, it calls the doBasicScale() function and then calls the autoScale() function with a true parameter.
@@ -410,7 +410,6 @@ export class ChartModel extends ChartBaseElement {
         if (seriesToUpdate) {
             seriesToUpdate.config.type = chartType;
             seriesToUpdate.updateCandleSeriesColors(candleSeriesConfig);
-            this.bus.fireDraw([this.canvasModel.canvasId]);
         }
         this.bus.fireDraw([this.canvasModel.canvasId]);
     }
@@ -549,8 +548,9 @@ export class ChartModel extends ChartBaseElement {
      * For given timestamp finds the closest candle in dataset.
      * @param timestamp
      */
-    candleFromTimestamp(timestamp, shouldExtrapolate = true) {
-        return this.chartBaseModel.dataFromTimestamp(timestamp, shouldExtrapolate);
+    candleFromTimestamp(timestamp, extrapolate = true, selectedCandleSeries = this.mainCandleSeries) {
+        const dataPointsSource = selectedCandleSeries.dataPoints;
+        return this.chartBaseModel.dataFromTimestamp(timestamp, extrapolate, dataPointsSource);
     }
     /**
      * For given index returns the closest visual candle, or fake candle with correct X coordinate.
@@ -803,7 +803,7 @@ export class ChartModel extends ChartBaseElement {
                 // can apply some optimization
                 // series.recalculateOnlyLastVisualCandle();
                 // TODO apply optimization
-                this.bus.fireDraw([this.canvasModel.canvasId]);
+                this.canvasModel.fireDraw();
             }
             else {
                 series.recalculateVisualPoints();
@@ -910,6 +910,26 @@ export class ChartModel extends ChartBaseElement {
     updateLastCandle(candle, instrumentSymbol = this.mainCandleSeries.instrument.symbol) {
         this.updateCandles([candle], instrumentSymbol);
     }
+    /**
+     * Remove candle by idx and recaculate indexes
+     * @param candle - new candle
+     * @param instrument - name of the instrument to update
+     */
+    removeCandleByIdx(idx, instrumentSymbol = this.mainCandleSeries.instrument.symbol) {
+        const seriesList = this.findSeriesBySymbol(instrumentSymbol);
+        if (seriesList.length === 0) {
+            console.warn("removeCandle by id failed. Can't find series", instrumentSymbol);
+            return;
+        }
+        seriesList.forEach(series => {
+            series.dataPoints = series.dataPoints.slice(0, idx).concat(series.dataPoints.slice(idx + 1));
+            reindexCandles(series.dataPoints);
+            series.recalculateVisualPoints();
+        });
+        this.candlesRemovedSubject.next();
+        this.candlesUpdatedSubject.next();
+        this.canvasModel.fireDraw();
+    }
 }
 const sortCandles = (candles) => candles.slice().sort((a, b) => (a.timestamp === b.timestamp ? 0 : a.timestamp > b.timestamp ? 1 : -1));
 const findFirstNotEmptyCandle = (candles, startIdx, iterateStep) => {

package/dist/chart/components/pane/pane-hit-test.controller.d.ts CHANGED Viewed

@@ -8,10 +8,10 @@ import { DataSeriesModel, DataSeriesPoint, VisualSeriesPoint } from '../../model
 import { HitTestSubscriber } from '../../model/hit-test-canvas.model';
 import { PaneComponent } from './pane.component';
 export declare class PaneHitTestController implements HitTestSubscriber<DataSeriesModel> {
-    private readonly paneComponents;
+    private readonly panes;
     private canvasModel;
     private dataSeriesIdCounter;
-    constructor(paneComponents: Record<string, PaneComponent>, canvasModel: CanvasModel);
+    constructor(panes: Record<string, PaneComponent>, canvasModel: CanvasModel);
     getNewDataSeriesHitTestId: () => number;
     /**
      * Returns an array with two numbers representing the range of IDs for data series.

package/dist/chart/components/pane/pane-hit-test.controller.js CHANGED Viewed

@@ -6,8 +6,8 @@
 import { HIT_TEST_ID_RANGE } from '../../model/hit-test-canvas.model';
 import { flatMap } from '../../utils/array.utils';
 export class PaneHitTestController {
-    constructor(paneComponents, canvasModel) {
-        this.paneComponents = paneComponents;
+    constructor(panes, canvasModel) {
+        this.panes = panes;
         this.canvasModel = canvasModel;
         // used in hit test for creating series
         this.dataSeriesIdCounter = HIT_TEST_ID_RANGE.DATA_SERIES[0];
@@ -23,7 +23,7 @@ export class PaneHitTestController {
         return HIT_TEST_ID_RANGE.DATA_SERIES;
     }
     get allDataSeries() {
-        return flatMap(flatMap(Object.values(this.paneComponents), c => c.yExtentComponents), p => Array.from(p.dataSeries));
+        return flatMap(flatMap(Object.values(this.panes), c => c.yExtentComponents), p => Array.from(p.dataSeries));
     }
     /**
      * Looks up a data series by its ID.
@@ -51,10 +51,10 @@ export class PaneHitTestController {
         this.handleYExtentDragEnd();
     }
     handleYExtentDragStart(model) {
-        Object.values(this.paneComponents).forEach(p => p.yExtentComponents.forEach(y => y.dragNDrop.deactivate()));
+        Object.values(this.panes).forEach(p => p.yExtentComponents.forEach(y => y.dragNDrop.deactivate()));
         model.extentComponent.dragNDrop.activate();
     }
     handleYExtentDragEnd() {
-        Object.values(this.paneComponents).forEach(p => p.yExtentComponents.forEach(y => y.dragNDrop.activate()));
+        Object.values(this.panes).forEach(p => p.yExtentComponents.forEach(y => y.dragNDrop.activate()));
     }
 }

package/dist/chart/components/pane/pane-manager.component.d.ts CHANGED Viewed

@@ -39,7 +39,8 @@ export declare class PaneManager extends ChartBaseElement {
     private mainCanvasModel;
     private yAxisLabelsCanvasModel;
     panes: Record<string, PaneComponent>;
-    panesChangedSubject: Subject<Record<string, PaneComponent>>;
+    paneRemovedSubject: Subject<PaneComponent>;
+    paneAddedSubject: Subject<Record<string, PaneComponent>>;
     hitTestController: PaneHitTestController;
     dataSeriesAddedSubject: Subject<DataSeriesModel>;
     dataSeriesRemovedSubject: Subject<DataSeriesModel>;

package/dist/chart/components/pane/pane-manager.component.js CHANGED Viewed

@@ -38,7 +38,8 @@ export class PaneManager extends ChartBaseElement {
         this.mainCanvasModel = mainCanvasModel;
         this.yAxisLabelsCanvasModel = yAxisLabelsCanvasModel;
         this.panes = {};
-        this.panesChangedSubject = new Subject();
+        this.paneRemovedSubject = new Subject();
+        this.paneAddedSubject = new Subject();
         this.dataSeriesAddedSubject = new Subject();
         this.dataSeriesRemovedSubject = new Subject();
         this.hitTestController = new PaneHitTestController(this.panes, this.dynamicObjectsCanvasModel);
@@ -104,7 +105,7 @@ export class PaneManager extends ChartBaseElement {
         paneComponent.activate();
         this.recalculateState();
         paneComponent.mainExtent.scale.autoScale(true);
-        this.panesChangedSubject.next(this.panes);
+        this.paneAddedSubject.next(this.panes);
         return paneComponent;
     }
     /**
@@ -114,11 +115,11 @@ export class PaneManager extends ChartBaseElement {
     removePane(uuid) {
         const pane = this.panes[uuid];
         if (pane !== undefined) {
+            this.paneRemovedSubject.next(pane);
             pane.disable();
             pane.yExtentComponents.forEach(yExtentComponent => yExtentComponent.disable());
             delete this.panes[uuid];
             this.recalculateState();
-            this.panesChangedSubject.next(this.panes);
         }
     }
     /**

package/dist/chart/components/watermark/water-mark.component.js CHANGED Viewed

@@ -18,7 +18,7 @@ export class WaterMarkComponent extends ChartBaseElement {
         this.waterMarkConfig = this.config.components.waterMark;
         this.waterMarkData = this.getWaterMarkData();
         this.waterMarkDrawer = new WaterMarkDrawer(this.config, canvasBoundsContainer, canvasModel, () => this.waterMarkConfig, () => this.waterMarkData);
-        this.addRxSubscription(merge(canvasBoundsContainer.observeBoundsChanged(CanvasElement.PANE_UUID(CHART_UUID)), this.paneManager.panesChangedSubject).subscribe((bounds) => {
+        this.addRxSubscription(merge(canvasBoundsContainer.observeBoundsChanged(CanvasElement.PANE_UUID(CHART_UUID)), this.paneManager.paneAddedSubject).subscribe((bounds) => {
             this.waterMarkConfig = this.recalculateTextSize(bounds.width, bounds.height);
         }));
         this.addRxSubscription(this.chartModel.candlesSetSubject.subscribe(() => {

package/dist/chart/components/y_axis/price_labels/last-candle-labels.provider.d.ts CHANGED Viewed

@@ -3,17 +3,18 @@
  * 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 { FullChartConfig } from '../../../chart.config';
+import { FullChartConfig, YAxisConfig } from '../../../chart.config';
 import { DataSeriesType } from '../../../model/data-series.config';
 import { ChartModel, LastCandleLabelHandler } from '../../chart/chart.model';
 import { LabelGroup, YAxisLabelsProvider } from './y-axis-labels.model';
 import { LabelColorResolver } from '../y-axis.component';
 export declare class LastCandleLabelsProvider implements YAxisLabelsProvider {
     private chartModel;
-    private config;
+    private fullConfig;
+    private yAxisConfig;
     private lastCandleLabelsByChartType;
     private resolveLabelColorFn;
-    constructor(chartModel: ChartModel, config: FullChartConfig, lastCandleLabelsByChartType: Partial<Record<DataSeriesType, LastCandleLabelHandler>>, resolveLabelColorFn: (chartType: DataSeriesType) => LabelColorResolver);
+    constructor(chartModel: ChartModel, fullConfig: FullChartConfig, yAxisConfig: YAxisConfig, lastCandleLabelsByChartType: Partial<Record<DataSeriesType, LastCandleLabelHandler>>, resolveLabelColorFn: (chartType: DataSeriesType) => LabelColorResolver);
     /**
      * Returns an array of LabelGroup objects that contain the labels for the yAxis of the chart.
      * @returns {LabelGroup[]} An array of LabelGroup objects that contain the labels for the yAxis of the chart.

package/dist/chart/components/y_axis/price_labels/last-candle-labels.provider.js CHANGED Viewed

@@ -7,9 +7,10 @@ import { getPrimaryLabelTextColor } from '../label-color.functions';
 import { lastOf } from '../../../utils/array.utils';
 import { getLabelTextColorByBackgroundColor } from '../../../utils/canvas/canvas-text-functions.utils';
 export class LastCandleLabelsProvider {
-    constructor(chartModel, config, lastCandleLabelsByChartType, resolveLabelColorFn) {
+    constructor(chartModel, fullConfig, yAxisConfig, lastCandleLabelsByChartType, resolveLabelColorFn) {
         this.chartModel = chartModel;
-        this.config = config;
+        this.fullConfig = fullConfig;
+        this.yAxisConfig = yAxisConfig;
         this.lastCandleLabelsByChartType = lastCandleLabelsByChartType;
         this.resolveLabelColorFn = resolveLabelColorFn;
     }
@@ -19,7 +20,7 @@ export class LastCandleLabelsProvider {
      */
     getUnorderedLabels() {
         const collectedLabels = [];
-        const visible = this.config.components.yAxis.labels.settings.lastPrice.mode !== 'none';
+        const visible = this.yAxisConfig.labels.settings.lastPrice.mode !== 'none';
         if (visible) {
             // main candle series
             const yAxisVisualLabel = this.getYAxisVisualLabel(this.chartModel.mainCandleSeries);
@@ -27,7 +28,7 @@ export class LastCandleLabelsProvider {
                 ? Object.assign(Object.assign({}, yAxisVisualLabel), this.getLabelDrawConfig(this.chartModel.mainCandleSeries, true)) : yAxisVisualLabel;
             if (mainCandleSeriesVisualLabel) {
                 const mainCandleSeriesLabels = { labels: [mainCandleSeriesVisualLabel] };
-                const handler = this.lastCandleLabelsByChartType[this.config.components.chart.type];
+                const handler = this.lastCandleLabelsByChartType[this.fullConfig.components.chart.type];
                 handler === null || handler === void 0 ? void 0 : handler(mainCandleSeriesLabels, this.chartModel.mainCandleSeries);
                 collectedLabels.push(mainCandleSeriesLabels);
             }
@@ -61,8 +62,8 @@ export class LastCandleLabelsProvider {
         if (lastCandle) {
             const y = series.view.toY(lastCandle.close);
             if (isFinite(y)) {
-                const mode = this.config.components.yAxis.labels.settings.lastPrice.mode;
-                const appearanceType = this.config.components.yAxis.labels.settings.lastPrice.type;
+                const mode = this.yAxisConfig.labels.settings.lastPrice.mode;
+                const appearanceType = this.yAxisConfig.labels.settings.lastPrice.type;
                 return {
                     y,
                     labelWeight: 0,

package/dist/chart/components/y_axis/y-axis.model.d.ts CHANGED Viewed

@@ -17,6 +17,7 @@ export declare class YAxisModel extends ChartBaseElement {
     private paneUUID;
     private state;
     private canvasBoundsContainer;
+    private extentIdx;
     labelsGenerator: NumericYAxisLabelsGenerator;
     baseLabelsModel: YAxisBaseLabelsModel;
     fancyLabelsModel: FancyYAxisLabelsModel;

package/dist/chart/components/y_axis/y-axis.model.js CHANGED Viewed

@@ -13,6 +13,7 @@ export class YAxisModel extends ChartBaseElement {
         this.paneUUID = paneUUID;
         this.state = state;
         this.canvasBoundsContainer = canvasBoundsContainer;
+        this.extentIdx = extentIdx;
         this.labelsGenerator = new NumericYAxisLabelsGenerator(null, dataSeriesProvider, scale, valueFormatter, () => this.state.type, state.labelHeight);
         this.baseLabelsModel = new YAxisBaseLabelsModel(scale, this.labelsGenerator, this.canvasBoundsContainer, paneUUID, extentIdx);
         this.addChildEntity(this.baseLabelsModel);
@@ -28,7 +29,7 @@ export class YAxisModel extends ChartBaseElement {
                     .concat(this.fancyLabelsModel.orderedLabels.flatMap(l => l.labels).map(l => l.labelText))
                     .reduce((maxLengthText, label) => (label.length > maxLengthText.length ? label : maxLengthText), '');
             },
-            getYAxisIndex: () => 0,
+            getYAxisIndex: () => this.extentIdx,
             getYAxisState: () => this.state,
             getPaneUUID: () => this.paneUUID,
         };

package/dist/chart/inputlisteners/canvas-input-listener.component.d.ts CHANGED Viewed

@@ -38,6 +38,7 @@ export declare class CanvasInputListenerComponent extends ChartBaseElement {
     private clickSubject;
     private clickDocumentSubject;
     private dbClickSubject;
+    private dbTapSubject;
     private mouseDownSubject;
     private mouseUpSubject;
     private mouseUpDocumentSubject;
@@ -224,6 +225,12 @@ export declare class CanvasInputListenerComponent extends ChartBaseElement {
      * @returns {Observable<Point>} An Observable that emits a Point object when a double click event occurs within the bounds of the current point.
      */
     observeDbClick(hitBoundsTest?: HitBoundsTest): Observable<Point>;
+    /**
+     * Returns an Observable that emits a Point object when a double tap event occurs within the bounds of the current point.
+     * @param {HitBoundsTest} [hitBoundsTest=() => true] - A function that tests if the double click event occurred within the bounds of the current point.
+     * @returns {Observable<Point>} An Observable that emits a Point object when a double tap event occurs within the bounds of the current point.
+     */
+    observeDbTap(hitBoundsTest?: HitBoundsTest): Observable<Point>;
     /**
      * Returns an Observable that emits WheelEvent objects when the wheelSubject emits a new value.
      * The emitted events are filtered by the hitBoundsTest function, which is passed as an optional parameter.

package/dist/chart/inputlisteners/canvas-input-listener.component.js CHANGED Viewed

@@ -46,6 +46,7 @@ class CanvasInputListenerComponent extends ChartBaseElement {
         this.clickSubject = new Subject();
         this.clickDocumentSubject = new Subject();
         this.dbClickSubject = new Subject();
+        this.dbTapSubject = new Subject();
         this.mouseDownSubject = new Subject();
         this.mouseUpSubject = new Subject();
         this.mouseUpDocumentSubject = new Subject();
@@ -196,7 +197,7 @@ class CanvasInputListenerComponent extends ChartBaseElement {
                 let timeoutId = null;
                 return () => {
                     if (timeoutId) {
-                        this.dbClickSubject.next(this.currentPoint);
+                        this.dbTapSubject.next(this.currentPoint);
                         clearTimeout(timeoutId);
                         timeoutId = null;
                     }
@@ -508,6 +509,16 @@ class CanvasInputListenerComponent extends ChartBaseElement {
             .asObservable()
             .pipe(filter(() => hitBoundsTest(this.currentPoint.x, this.currentPoint.y)));
     }
+    /**
+     * Returns an Observable that emits a Point object when a double tap event occurs within the bounds of the current point.
+     * @param {HitBoundsTest} [hitBoundsTest=() => true] - A function that tests if the double click event occurred within the bounds of the current point.
+     * @returns {Observable<Point>} An Observable that emits a Point object when a double tap event occurs within the bounds of the current point.
+     */
+    observeDbTap(hitBoundsTest = () => true) {
+        return this.dbTapSubject
+            .asObservable()
+            .pipe(filter(() => hitBoundsTest(this.currentPoint.x, this.currentPoint.y)));
+    }
     /**
      * Returns an Observable that emits WheelEvent objects when the wheelSubject emits a new value.
      * The emitted events are filtered by the hitBoundsTest function, which is passed as an optional parameter.

package/dist/chart/model/scale.model.d.ts CHANGED Viewed

@@ -50,7 +50,7 @@ export declare class ScaleModel extends ViewportModel {
     constructor(config: FullChartConfig, getBounds: BoundsProvider, canvasAnimation: CanvasAnimation);
     /**
      * The method adds a new "constraint" to the existing list of x-axis constraints for charting.
-     * The "constrait" is expected to be an object containing information about the constraints, such as the minimum and maximum values for the x-axis.
+     * The "constraint" is expected to be an object containing information about the constraints, such as the minimum and maximum values for the x-axis.
      * @param constraint
      */
     addXConstraint(constraint: Constraints): void;