@tradecanvas/chart 0.4.0 → 0.5.0

package/dist/index.js

@@ -1,12 +1,12 @@
-import { DARK_THEME as e, DARK_THEME as t, DEFAULT_DRAWING_STYLE as n, DEFAULT_PANEL_HEIGHT as r, DEFAULT_RECONNECT as i, DEFAULT_STREAM_CONFIG as a, DEFAULT_TIMEFRAME_FAVORITES as o, DEFAULT_TRADING_CONFIG as s, LIGHT_THEME as c, LIGHT_THEME as l, LayerType as u, MARKET_CRYPTO as d, MARKET_HNX as f, MARKET_HOSE as ee, MARKET_NYSE as p, MARKET_UPCOM as te, MIN_PANEL_HEIGHT as m, PRICE_AXIS_WIDTH as h, TIMEFRAMES_CRYPTO as g, TIMEFRAMES_FOREX as _, TIMEFRAMES_STOCK as ne, TIME_AXIS_HEIGHT as v, VN_COLORS as re, computePriceLimits as ie, computePriceLimits as y, createVNTheme as ae, formatNumber as oe, formatVND as se, formatVolumeLoc as ce, getCurrentSession as le, getLocale as ue, mergeBar as de, registerLocale as fe, setLocale as pe, setLocale as me, t as b } from "@tradecanvas/commons";
-import { AlertManager as x, AlertManager as S, Animator as C, Animator as w, AreaRenderer as T, BarCountdown as E, BarCountdown as D, BarRenderer as O, BaseFinanceChart as k, BaselineRenderer as A, BinanceAdapter as j, CandlestickRenderer as M, ChartLegend as N, ChartLegend as P, ChartStateManager as F, ChartStateManager as I, CompareRenderer as L, CompareRenderer as R, CrosshairHandler as z, CrosshairTooltip as he, CrosshairTooltip as ge, CurrentPriceLine as _e, CurrentPriceLine as ve, DEFAULT_LEGEND_CONFIG as ye, DataExporter as be, DataExporter as B, DrawingBase as xe, DrawingManager as Se, DrawingRenderer as Ce, Easing as we, EventBus as Te, FinanceCrosshair as V, GridRenderer as Ee, HollowCandleRenderer as De, IndicatorBase as Oe, IndicatorEngine as H, InteractionManager as ke, KagiRenderer as Ae, KeyboardHandler as je, KeyboardHandler as Me, LineRenderer as Ne, MockAdapter as Pe, PanHandler as Fe, PointAndFigureRenderer as Ie, PriceAxis as Le, RenderEngine as Re, RenkoRenderer as ze, ReplayManager as Be, ReplayManager as Ve, Screenshot as He, Screenshot as U, SessionBreaks as Ue, SessionBreaks as We, StreamManager as Ge, StreamManager as Ke, TickAggregator as qe, TimeAxis as Je, TradingManager as Ye, TradingRenderer as Xe, UndoRedoManager as Ze, UndoRedoManager as Qe, Viewport as $e, VolumeRenderer as et, VolumeRenderer as tt, Watermark as nt, Watermark as rt, ZoomHandler as it, layoutSquarifiedTreemap as at, layoutUniformGrid as ot, registerBuiltInDrawingTools as st, registerBuiltInIndicators as W, renderDepthChart as ct, renderEquityCurve as lt, renderGauge as ut, renderHeatmap as dt, renderSparkline as ft, renderWaterfall as pt, toHeikinAshi as mt, toHeikinAshi as ht, toKagi as gt, toKagi as _t, toLineBreak as vt, toLineBreak as yt, toPointAndFigure as bt, toPointAndFigure as xt, toRenko as St, toRenko as Ct } from "@tradecanvas/core";
+import { DARK_TERMINAL as e, DARK_THEME as t, DARK_THEME as n, DEFAULT_DRAWING_STYLE as r, DEFAULT_PANEL_HEIGHT as i, DEFAULT_RECONNECT as a, DEFAULT_STREAM_CONFIG as o, DEFAULT_TIMEFRAME_FAVORITES as s, DEFAULT_TRADING_CONFIG as c, LIGHT_THEME as l, LIGHT_THEME as u, LayerType as d, MARKET_CRYPTO as f, MARKET_HNX as ee, MARKET_HOSE as p, MARKET_NYSE as m, MARKET_UPCOM as h, MIN_PANEL_HEIGHT as g, PRICE_AXIS_WIDTH as _, TIMEFRAMES_CRYPTO as te, TIMEFRAMES_FOREX as ne, TIMEFRAMES_STOCK as re, TIME_AXIS_HEIGHT as v, VN_COLORS as ie, computePriceLimits as ae, computePriceLimits as y, createVNTheme as oe, formatNumber as se, formatVND as ce, formatVolumeLoc as le, getCurrentSession as ue, getLocale as de, mergeBar as fe, normalizeBar as pe, normalizeBarTime as me, registerLocale as b, setLocale as x, setLocale as S, t as C } from "@tradecanvas/commons";
+import { AlertManager as w, AlertManager as T, Animator as E, Animator as D, AreaRenderer as O, BarCountdown as k, BarCountdown as A, BarRenderer as j, BaseFinanceChart as M, BaselineRenderer as N, BinanceAdapter as P, CandlestickRenderer as F, ChartLegend as I, ChartLegend as L, ChartStateManager as R, ChartStateManager as z, CompareRenderer as he, CompareRenderer as ge, CrosshairHandler as _e, CrosshairTooltip as ve, CrosshairTooltip as ye, CurrentPriceLine as be, CurrentPriceLine as xe, DEFAULT_LEGEND_CONFIG as Se, DataExporter as Ce, DataExporter as B, DrawingBase as we, DrawingManager as Te, DrawingRenderer as Ee, Easing as De, EventBus as Oe, FinanceCrosshair as V, GridRenderer as ke, HollowCandleRenderer as Ae, IndicatorBase as je, IndicatorEngine as H, InteractionManager as Me, KagiRenderer as Ne, KeyboardHandler as Pe, KeyboardHandler as Fe, LineRenderer as Ie, MockAdapter as Le, PanHandler as Re, PointAndFigureRenderer as ze, PriceAxis as Be, RenderEngine as Ve, RenkoRenderer as He, ReplayManager as Ue, ReplayManager as U, Screenshot as We, Screenshot as W, SessionBreaks as Ge, SessionBreaks as Ke, StreamManager as qe, StreamManager as Je, TickAggregator as Ye, TimeAxis as Xe, TradingManager as Ze, TradingRenderer as Qe, UndoRedoManager as $e, UndoRedoManager as et, Viewport as tt, VolumeRenderer as nt, VolumeRenderer as rt, Watermark as it, Watermark as at, ZoomHandler as ot, layoutSquarifiedTreemap as st, layoutUniformGrid as ct, registerBuiltInDrawingTools as lt, registerBuiltInIndicators as G, renderDepthChart as ut, renderEquityCurve as dt, renderGauge as ft, renderHeatmap as pt, renderSparkline as mt, renderWaterfall as ht, toHeikinAshi as gt, toHeikinAshi as _t, toKagi as vt, toKagi as yt, toLineBreak as bt, toLineBreak as xt, toPointAndFigure as St, toPointAndFigure as Ct, toRenko as wt, toRenko as Tt } from "@tradecanvas/core";
 //#region src/DataManager.ts
-function G(e) {
+function K(e) {
 	if (!e || typeof e.time != "number") return !1;
 	let { open: t, high: n, low: r, close: i } = e;
 	return !(!isFinite(t) || !isFinite(n) || !isFinite(r) || !isFinite(i) || t < 0 || n < 0 || r < 0 || i < 0 || n < r || e.volume !== void 0 && (!isFinite(e.volume) || e.volume < 0));
 }
-function K(e) {
+function q(e) {
 	return {
 		...e,
 		high: Math.max(e.open, e.high, e.low, e.close),
@@ -14,20 +14,20 @@ function K(e) {
 		volume: e.volume === void 0 ? 0 : Math.max(0, e.volume)
 	};
 }
-var q = class {
+var J = class {
 	data = [];
 	getData() {
 		return this.data;
 	}
 	setData(e) {
-		this.data = e.filter(G).map(K);
+		this.data = e.filter(K).map(q);
 	}
 	appendBar(e) {
-		G(e) && this.data.push(K(e));
+		K(e) && this.data.push(q(e));
 	}
 	updateLastBar(e) {
-		if (!G(e)) return;
-		let t = K(e);
+		if (!K(e)) return;
+		let t = q(e);
 		if (this.data.length === 0) {
 			this.data.push(t);
 			return;
@@ -35,7 +35,7 @@ var q = class {
 		this.data[this.data.length - 1] = t;
 	}
 	updateLastBarFromTick(e) {
-		this.data.length !== 0 && (!isFinite(e.price) || e.price < 0 || e.volume !== void 0 && (!isFinite(e.volume) || e.volume < 0) || (this.data[this.data.length - 1] = de(this.data[this.data.length - 1], e)));
+		this.data.length !== 0 && (!isFinite(e.price) || e.price < 0 || e.volume !== void 0 && (!isFinite(e.volume) || e.volume < 0) || (this.data[this.data.length - 1] = fe(this.data[this.data.length - 1], e)));
 	}
 	getLength() {
 		return this.data.length;
@@ -43,18 +43,18 @@ var q = class {
 	clear() {
 		this.data = [];
 	}
-}, J = class {
+}, Y = class {
 	theme;
 	constructor(e) {
-		!e || e === "dark" ? this.theme = { ...t } : e === "light" ? this.theme = { ...l } : this.theme = { ...e };
+		!e || e === "dark" ? this.theme = { ...n } : e === "light" ? this.theme = { ...u } : this.theme = { ...e };
 	}
 	getTheme() {
 		return this.theme;
 	}
 	setTheme(e) {
-		e === "dark" ? this.theme = { ...t } : e === "light" ? this.theme = { ...l } : this.theme = { ...e };
+		e === "dark" ? this.theme = { ...n } : e === "light" ? this.theme = { ...u } : this.theme = { ...e };
 	}
-}, Y = 200, X = 80, Z = class {
+}, X = 200, Z = 80, Q = class {
 	panels = [];
 	containerWidth = 0;
 	containerHeight = 0;
@@ -62,12 +62,12 @@ var q = class {
 		this.containerWidth = e, this.containerHeight = t;
 	}
 	addPanel(e, t = "bottom", n) {
-		let i = t === "left" || t === "right";
+		let r = t === "left" || t === "right";
 		this.panels.push({
 			id: e,
 			position: t,
-			size: n ?? (i ? Y : r),
-			minSize: i ? X : m,
+			size: n ?? (r ? X : i),
+			minSize: r ? Z : g,
 			content: {
 				type: "indicator",
 				indicatorInstanceId: e
@@ -80,8 +80,8 @@ var q = class {
 	setPanelPosition(e, t) {
 		let n = this.panels.find((t) => t.id === e);
 		if (n) {
-			let e = n.position === "left" || n.position === "right", i = t === "left" || t === "right";
-			n.position = t, e !== i && (n.size = i ? Y : r, n.minSize = i ? X : m);
+			let e = n.position === "left" || n.position === "right", r = t === "left" || t === "right";
+			n.position = t, e !== r && (n.size = r ? X : i, n.minSize = r ? Z : g);
 		}
 	}
 	setPanelSize(e, t) {
@@ -95,7 +95,7 @@ var q = class {
 		let e = this.panels.filter((e) => e.position === "left"), t = this.panels.filter((e) => e.position === "right"), n = this.panels.filter((e) => e.position === "top"), r = this.panels.filter((e) => e.position === "bottom"), i = e.reduce((e, t) => e + t.size, 0), a = t.reduce((e, t) => e + t.size, 0), o = n.reduce((e, t) => e + t.size, 0), s = r.reduce((e, t) => e + t.size, 0), c = {
 			x: i,
 			y: o,
-			width: Math.max(0, this.containerWidth - i - a - h),
+			width: Math.max(0, this.containerWidth - i - a - _),
 			height: Math.max(0, this.containerHeight - o - s - v)
 		}, l = [], u = [], d = 0;
 		for (let t of e) l.push({
@@ -154,7 +154,7 @@ var q = class {
 			},
 			orientation: "horizontal"
 		}), f += e.size;
-		d = i + c.width + h;
+		d = i + c.width + _;
 		for (let e of t) l.push({
 			config: e,
 			rect: {
@@ -182,14 +182,14 @@ var q = class {
 	getMainChartRect() {
 		return this.resolve().mainChartRect;
 	}
-}, Q = class {
+}, $ = class {
 	constructor(e) {
 		this.indicatorEngine = e;
 	}
 	registerIndicator(e) {
 		this.indicatorEngine.register(e);
 	}
-}, wt = class {
+}, Et = class {
 	static version = "0.3.0";
 	engine;
 	viewport;
@@ -240,6 +240,7 @@ var q = class {
 	numberLocale;
 	keyboardHandler = null;
 	onWindowKeyDown = null;
+	currentSymbol = "";
 	constructor(e, t) {
 		this.container = e, this.options = t, this.numberLocale = t.numberLocale ?? "en-US";
 		let n = t.features ?? {};
@@ -273,19 +274,19 @@ var q = class {
 			logScale: n.logScale ?? !0,
 			timeframes: n.timeframes ?? [],
 			defaultTimeframeFavorites: n.defaultTimeframeFavorites ?? []
-		}, e.style.position = "relative", e.style.overflow = "hidden", e.tabIndex = 0, e.style.outline = "none", this.dataManager = new q(), this.themeManager = new J(t.theme), this.layoutManager = new Z(), this.indicatorEngine = new H(), this.pluginManager = new Q(this.indicatorEngine), this.eventBus = new Te(), W(this.indicatorEngine), this.drawingManager = new Se(), st(this.drawingManager), this.drawingRenderer = new Ce(this.drawingManager), this.drawingManager.setRequestRender(() => {
-			this.syncRenderContext(), this.engine.requestRender(u.Overlay), this.scheduleAutoSave();
+		}, e.style.position = "relative", e.style.overflow = "hidden", e.tabIndex = 0, e.style.outline = "none", this.dataManager = new J(), this.themeManager = new Y(t.theme), this.layoutManager = new Q(), this.indicatorEngine = new H(), this.pluginManager = new $(this.indicatorEngine), this.eventBus = new Oe(), G(this.indicatorEngine), this.drawingManager = new Te(), lt(this.drawingManager), this.drawingRenderer = new Ee(this.drawingManager), this.drawingManager.setRequestRender(() => {
+			this.syncRenderContext(), this.engine.requestRender(d.Overlay), this.scheduleAutoSave();
 		}), this.drawingManager.setEventCallback((e, t) => {
 			this.eventBus.emit(e, t);
-		}), this.undoRedoManager = new Qe(), this.drawingManager.setUndoRedoManager(this.undoRedoManager), this.drawingManager.setDataGetter(() => this.dataManager.getData()), this.drawingManager.setDisplayDataGetter(() => this.getDisplayData()), t.crosshair?.mode === "magnet" && this.drawingManager.setMagnetMode("magnet"), this.tradingManager = new Ye(), this.tradingRenderer = new Xe(this.tradingManager), this.tradingManager.setContainer(e), this.tradingManager.setRequestRender(() => this.engine.requestRender(u.Overlay)), this.tradingManager.setEventCallback((e, t) => {
+		}), this.undoRedoManager = new et(), this.drawingManager.setUndoRedoManager(this.undoRedoManager), this.drawingManager.setDataGetter(() => this.dataManager.getData()), this.drawingManager.setDisplayDataGetter(() => this.getDisplayData()), t.crosshair?.mode === "magnet" && this.drawingManager.setMagnetMode("magnet"), this.tradingManager = new Ze(), this.tradingRenderer = new Qe(this.tradingManager), this.tradingManager.setContainer(e), this.tradingManager.setRequestRender(() => this.engine.requestRender(d.Overlay)), this.tradingManager.setEventCallback((e, t) => {
 			this.eventBus.emit(e, t);
-		}), this.engine = new Re(e);
+		}), this.engine = new Ve(e);
 		let r = this.engine.dprManager.getContainerSize();
-		this.viewport = new $e(r.width, r.height, t.minBarSpacing ?? 2, t.maxBarSpacing ?? 30, t.rightMargin ?? 5), this.layoutManager.resize(r.width, r.height), this.engine.onContainerResize = (e) => {
+		this.viewport = new tt(r.width, r.height, t.minBarSpacing ?? 2, t.maxBarSpacing ?? 30, t.rightMargin ?? 5), this.layoutManager.resize(r.width, r.height), this.engine.onContainerResize = (e) => {
 			if (e.width <= 0 || e.height <= 0) return;
 			let t = this.viewport.isAtEnd();
 			this.viewport.resize(e.width, e.height), this.layoutManager.resize(e.width, e.height), this.updateViewportAndRender(t);
-		}, this.chartRenderer = this.createChartRenderer(t.chartType), this.gridRenderer = new Ee(), t.grid?.visible === !1 && this.gridRenderer.setVisible(!1), this.priceAxis = new Le(), this.priceAxis.setLocale(this.numberLocale), this.timeAxis = new Je(), this.crosshairHandler = new z(), this.crosshairHandler.setLocale(this.numberLocale), t.crosshair?.mode && this.crosshairHandler.setMode(t.crosshair.mode), this.crosshairHandler.setCallback((e, t) => {
+		}, this.chartRenderer = this.createChartRenderer(t.chartType), this.gridRenderer = new ke(), t.grid?.visible === !1 && this.gridRenderer.setVisible(!1), this.priceAxis = new Be(), this.priceAxis.setLocale(this.numberLocale), this.timeAxis = new Xe(), this.crosshairHandler = new _e(), this.crosshairHandler.setLocale(this.numberLocale), t.crosshair?.mode && this.crosshairHandler.setMode(t.crosshair.mode), this.crosshairHandler.setCallback((e, t) => {
 			if (e !== null && t) {
 				let n = this.dataManager.getData(), r = e < n.length ? n[e] : void 0;
 				this.chartLegend.setHoverBar(r ?? null), r && this.crosshairTooltip.show(t, r, this.themeManager.getTheme(), this.cachedContainerSize()), this.eventBus.emit("crosshairMove", {
@@ -294,12 +295,12 @@ var q = class {
 					barIndex: e
 				});
 			} else this.crosshairTooltip.hide(), this.chartLegend.setHoverBar(null);
-		}), this.chartLegend = new P(), this.chartLegend.setChartType(t.chartType), this.watermark = new rt(), t.watermark && this.watermark.setConfig(t.watermark), this.volumeRenderer = new tt(), this.barCountdown = new D(), this.sessionBreaks = new We(), this.compareRenderer = new R(), t.sessionBreaks ? this.sessionBreaks.setConfig({
+		}), this.chartLegend = new L(), this.chartLegend.setChartType(t.chartType), this.watermark = new at(), t.watermark && this.watermark.setConfig(t.watermark), this.volumeRenderer = new rt(), this.barCountdown = new A(), this.sessionBreaks = new Ke(), this.compareRenderer = new ge(), t.sessionBreaks ? this.sessionBreaks.setConfig({
 			visible: t.sessionBreaks.visible ?? !0,
 			color: t.sessionBreaks.color,
 			lineStyle: t.sessionBreaks.lineStyle,
 			lineWidth: t.sessionBreaks.lineWidth
-		}) : t.features?.sessionBreaks !== !1 && this.sessionBreaks.setVisible(!0), t.logScale && this.viewport.setLogScale(!0), this.animator = new w(), this.crosshairTooltip = new ge(), this.crosshairTooltip.create(e), this.keyboardHandler = new Me({
+		}) : t.features?.sessionBreaks !== !1 && this.sessionBreaks.setVisible(!0), t.logScale && this.viewport.setLogScale(!0), this.animator = new D(), this.crosshairTooltip = new ye(), this.crosshairTooltip.create(e), this.keyboardHandler = new Fe({
 			scrollBars: (e) => {
 				let t = this.viewport.getState().barWidth + this.viewport.getState().barSpacing;
 				this.viewport.scrollBy(e * t), this.updateViewportAndRender();
@@ -319,19 +320,19 @@ var q = class {
 			if (!this.keyboardHandler) return;
 			let t = document.activeElement;
 			t && t !== this.container && !this.container.contains(t) || t && (t.tagName === "INPUT" || t.tagName === "TEXTAREA" || t.isContentEditable) || this.keyboardHandler.handleKey(e) && e.preventDefault();
-		}, window.addEventListener("keydown", this.onWindowKeyDown), this.currentPriceLine = new ve(), this.alertManager = new S(), this.alertManager.setRequestRender(() => this.engine.requestRender(u.Overlay)), this.alertManager.on("triggered", (e) => {
+		}, window.addEventListener("keydown", this.onWindowKeyDown), this.currentPriceLine = new xe(), this.alertManager = new T(), this.alertManager.setRequestRender(() => this.engine.requestRender(d.Overlay)), this.alertManager.on("triggered", (e) => {
 			this.eventBus.emit("dataUpdate", {
 				alert: "triggered",
 				alertId: e.id,
 				price: e.price,
 				message: e.message
 			});
-		}), this.replayManager = new Ve(), this.interactionManager = new ke(e), this.features.panning && this.interactionManager.setPanHandler(new Fe((e) => {
+		}), this.replayManager = new U(), this.interactionManager = new Me(e), this.features.panning && this.interactionManager.setPanHandler(new Re((e) => {
 			this.viewport.scrollBy(e), this.updateViewportAndRender();
-		})), this.features.zooming && this.interactionManager.setZoomHandler(new it((e, t) => {
+		})), this.features.zooming && this.interactionManager.setZoomHandler(new ot((e, t) => {
 			this.viewport.zoom(e, t), this.updateViewportAndRender();
 		})), this.features.crosshair && this.interactionManager.setCrosshairHandler(this.crosshairHandler), this.features.drawings && this.interactionManager.setDrawingManager(this.drawingManager, () => this.viewport.getState()), this.features.trading && this.interactionManager.setTradingManager(this.tradingManager, () => this.viewport.getState()), this.interactionManager.setOverlayDirtyCallback(() => {
-			this.engine.requestRender(u.Overlay), this.layoutManager.getPanels().length > 0 && this.engine.requestRender(u.UI);
+			this.engine.requestRender(d.Overlay), this.layoutManager.getPanels().length > 0 && this.engine.requestRender(d.UI);
 		}), this.interactionManager.attach(), this.syncRenderContext(), this.engine.start();
 	}
 	setData(e) {
@@ -340,6 +341,12 @@ var q = class {
 	appendBar(e) {
 		this.dataManager.appendBar(e), this.crosshairHandler.setData(this.dataManager.getData()), this.displayDataCache = null, this.autoScrollOnNewBar && this.viewport.scrollToEnd(), this.indicatorEngine.recalculateAll(this.dataManager.getData()), this.updateViewportAndRender();
 	}
+	appendBars(e) {
+		if (e.length !== 0) {
+			for (let t of e) this.dataManager.appendBar(t);
+			this.displayDataCache = null, this.indicatorEngine.recalculateAll(this.dataManager.getData()), this.crosshairHandler.setData(this.dataManager.getData()), this.updateViewportAndRender(this.viewport.isAtEnd());
+		}
+	}
 	updateLastBar(e) {
 		this.dataManager.updateLastBar(e), this.currentPriceLine.setPrice(e.close), this.options.chartType !== "candlestick" && this.options.chartType !== "line" && this.options.chartType !== "area" && this.options.chartType !== "bar" && this.options.chartType !== "hollowCandle" && (this.displayDataCache = null), this.indicatorEngine.recalculateAll(this.dataManager.getData()), this.scheduleRender();
 	}
@@ -372,7 +379,7 @@ var q = class {
 	}
 	static indicators() {
 		let e = new H();
-		return W(e), e.getAvailableIndicators();
+		return G(e), e.getAvailableIndicators();
 	}
 	setPanelPosition(e, t) {
 		this.layoutManager.setPanelPosition(e, t), this.engine.requestRender();
@@ -498,42 +505,46 @@ var q = class {
 	setDepthData(e) {
 		this.features.trading && this.tradingManager.setDepthData(e);
 	}
-	setCurrentPrice(e) {
+	setCurrentPrice(e, t) {
 		this.tradingManager.setCurrentPrice(e), this.currentPriceLine.setPrice(e), this.scheduleRender(), this.features.alerts && this.alertManager.checkPrice(e);
 	}
 	setTradingConfig(e) {
 		this.features.trading && this.tradingManager.setConfig(e);
 	}
 	async connect(e) {
-		this.disconnectStream(), this.streamManager = new Ke(), this.streamManager.on("snapshot", (e) => {
+		this.disconnectStream(), this.streamManager = new Je(), this.streamManager.on("snapshot", (e) => {
 			this.setData(e);
 		}), this.streamManager.on("barClose", (e) => {
 			this.dataManager.appendBar(e), this.crosshairHandler.setData(this.dataManager.getData()), this.autoScrollOnNewBar && this.viewport.scrollToEnd(), this.indicatorEngine.recalculateAll(this.dataManager.getData()), this.updateViewportAndRender();
 		}), this.streamManager.on("barUpdate", (e) => {
 			this.dataManager.updateLastBar(e), this.currentPriceLine.setPrice(e.close), this.indicatorEngine.recalculateAll(this.dataManager.getData()), this.scheduleRender();
 		}), this.streamManager.on("priceChange", ({ price: e }) => {
-			this.tradingManager.setCurrentPrice(e), this.currentPriceLine.setPrice(e), this.engine.requestRender(u.Overlay), this.engine.requestRender(u.UI);
+			this.tradingManager.setCurrentPrice(e), this.currentPriceLine.setPrice(e), this.engine.requestRender(d.Overlay), this.engine.requestRender(d.UI);
 		}), this.streamManager.on("connectionChange", (e) => {
 			this.eventBus.emit("dataUpdate", { connection: e });
 		}), this.streamManager.on("error", (e) => {
 			this.eventBus.emit("dataUpdate", { error: e.message });
-		}), this.autoScrollOnNewBar = e.autoScroll !== !1, await this.streamManager.connect(e);
+		}), this.autoScrollOnNewBar = e.autoScroll !== !1, this.currentSymbol = e.symbol, await this.streamManager.connect(e);
 		let t = this.timeframeToMs(e.timeframe);
 		this.barCountdown.setTimeframeMs(t), this.countdownInterval && clearInterval(this.countdownInterval), this.countdownInterval = setInterval(() => {
-			this.barCountdown.isVisible() && this.engine.requestRender(u.UI);
+			this.barCountdown.isVisible() && this.engine.requestRender(d.UI);
 		}, 1e3);
 	}
 	async switchStream(e, t) {
-		this.streamManager && await this.streamManager.switchTo(e, t);
+		this.streamManager && (this.currentSymbol = e, await this.streamManager.switchTo(e, t));
+	}
+	async setTimeframe(e) {
+		if (!this.streamManager) throw Error("No active stream. Call connect() first.");
+		await this.switchStream(this.currentSymbol, e);
 	}
 	disconnectStream() {
 		this.streamManager &&= (this.streamManager.dispose(), null);
 	}
 	setBarCountdownVisible(e) {
-		this.barCountdown.setVisible(e), this.engine.requestRender(u.UI);
+		this.barCountdown.setVisible(e), this.engine.requestRender(d.UI);
 	}
 	setSessionBreaksVisible(e) {
-		this.sessionBreaks.setVisible(e), this.engine.requestRender(u.Background);
+		this.sessionBreaks.setVisible(e), this.engine.requestRender(d.Background);
 	}
 	addCompareSymbol(e, t, n, r) {
 		this.compareRenderer.addSymbol({
@@ -542,19 +553,19 @@ var q = class {
 			data: n,
 			color: r,
 			visible: !0
-		}), this.engine.requestRender(u.Main);
+		}), this.engine.requestRender(d.Main);
 	}
 	removeCompareSymbol(e) {
-		this.compareRenderer.removeSymbol(e), this.engine.requestRender(u.Main);
+		this.compareRenderer.removeSymbol(e), this.engine.requestRender(d.Main);
 	}
 	updateCompareData(e, t) {
-		this.compareRenderer.setSymbolData(e, t), this.engine.requestRender(u.Main);
+		this.compareRenderer.setSymbolData(e, t), this.engine.requestRender(d.Main);
 	}
 	setCompareMode(e) {
-		this.compareRenderer.setMode(e), this.engine.requestRender(u.Main);
+		this.compareRenderer.setMode(e), this.engine.requestRender(d.Main);
 	}
 	clearCompareSymbols() {
-		this.compareRenderer.clear(), this.engine.requestRender(u.Main);
+		this.compareRenderer.clear(), this.engine.requestRender(d.Main);
 	}
 	setLogScale(e) {
 		this.viewport.setLogScale(e), this.updateViewportAndRender();
@@ -563,7 +574,7 @@ var q = class {
 		return this.viewport.isLogScale();
 	}
 	setSessionBreaksConfig(e) {
-		this.sessionBreaks.setConfig(e), this.engine.requestRender(u.Background);
+		this.sessionBreaks.setConfig(e), this.engine.requestRender(d.Background);
 	}
 	getConnectionState() {
 		return this.streamManager?.getConnectionState() ?? "disconnected";
@@ -639,7 +650,7 @@ var q = class {
 		this.watermark.setConfig({
 			text: e,
 			...t
-		}), this.engine.requestRender(u.Background);
+		}), this.engine.requestRender(d.Background);
 	}
 	setAutoScale(e) {
 		this.options.autoScale = e, this.updateViewportAndRender();
@@ -648,37 +659,40 @@ var q = class {
 		return this.options.autoScale !== !1;
 	}
 	setCrosshairMode(e) {
-		this.crosshairHandler.setMode(e), this.engine.requestRender(u.Overlay);
+		this.crosshairHandler.setMode(e), this.engine.requestRender(d.Overlay);
 	}
 	getCrosshairMode() {
 		return this.crosshairHandler.getMode();
 	}
 	setGridVisible(e) {
-		this.gridRenderer.setVisible(e), this.engine.requestRender(u.Background);
+		this.gridRenderer.setVisible(e), this.engine.requestRender(d.Background);
 	}
 	isGridVisible() {
 		return this.gridRenderer.isVisible();
 	}
 	setVolumeVisible(e) {
-		this.volumeRenderer.setVisible(e), this.engine.requestRender(u.Main);
+		this.volumeRenderer.setVisible(e), this.engine.requestRender(d.Main);
 	}
 	setTooltipVisible(e) {
 		e || this.crosshairTooltip.hide();
 	}
 	setLegend(e) {
-		this.chartLegend.setConfig(e), this.engine.requestRender(u.UI);
+		this.chartLegend.setConfig(e), this.engine.requestRender(d.UI);
 	}
 	setSymbolName(e) {
-		this.chartLegend.setSymbol(e), this.engine.requestRender(u.UI);
+		this.chartLegend.setSymbol(e), this.engine.requestRender(d.UI);
+	}
+	setStatusText(e) {
+		this.chartLegend.setStatusText(e), this.engine.requestRender(d.UI);
 	}
 	screenshot(e) {
-		this.features.screenshot && U.download(this.container, e, this.themeManager.getTheme().background);
+		this.features.screenshot && W.download(this.container, e, this.themeManager.getTheme().background);
 	}
 	screenshotDataURL() {
-		return this.features.screenshot ? U.toDataURL(this.container, this.themeManager.getTheme().background) : null;
+		return this.features.screenshot ? W.toDataURL(this.container, this.themeManager.getTheme().background) : null;
 	}
 	async screenshotBlob() {
-		return this.features.screenshot ? U.toBlob(this.container, this.themeManager.getTheme().background) : null;
+		return this.features.screenshot ? W.toBlob(this.container, this.themeManager.getTheme().background) : null;
 	}
 	addAlert(e, t = "crossing", n) {
 		if (!this.features.alerts) return null;
@@ -698,7 +712,7 @@ var q = class {
 		this.alertManager.saveToStorage(e);
 	}
 	loadAlerts(e) {
-		this.alertManager.loadFromStorage(e), this.engine.requestRender(u.Overlay);
+		this.alertManager.loadFromStorage(e), this.engine.requestRender(d.Overlay);
 	}
 	replay(e) {
 		if (!this.features.replay) return;
@@ -731,16 +745,16 @@ var q = class {
 	}
 	saveState(e) {
 		if (!this.features.saveLoad) return null;
-		let t = I.capture({
+		let t = z.capture({
 			getDrawings: () => this.getDrawings(),
 			getTheme: () => this.getTheme(),
 			getAlerts: () => this.getAlerts()
-		}, { chartType: this.options.chartType }), n = I.serialize(t);
-		return e && I.saveToStorage(e, t), n;
+		}, { chartType: this.options.chartType }), n = z.serialize(t);
+		return e && z.saveToStorage(e, t), n;
 	}
 	loadState(e) {
 		if (!this.features.saveLoad) return;
-		let t = I.deserialize(e);
+		let t = z.deserialize(e);
 		if (t.chartType && this.setChartType(t.chartType), t.drawings && this.setDrawings(t.drawings), t.theme && this.setTheme(t.theme), t.alerts) {
 			this.clearAlerts();
 			for (let e of t.alerts) this.addAlert(e.price, e.condition, e.message);
@@ -748,25 +762,25 @@ var q = class {
 	}
 	loadStateFromStorage(e) {
 		if (!this.features.saveLoad) return !1;
-		let t = I.loadFromStorage(e);
-		return t ? (this.loadState(I.serialize(t)), !0) : !1;
+		let t = z.loadFromStorage(e);
+		return t ? (this.loadState(z.serialize(t)), !0) : !1;
 	}
 	downloadState(e) {
 		if (!this.features.saveLoad) return;
-		let t = I.capture({
+		let t = z.capture({
 			getDrawings: () => this.getDrawings(),
 			getTheme: () => this.getTheme(),
 			getAlerts: () => this.getAlerts()
 		}, { chartType: this.options.chartType });
-		I.downloadFile(t, e);
+		z.downloadFile(t, e);
 	}
 	async loadStateFromFile() {
 		if (!this.features.saveLoad) return;
-		let e = await I.loadFromFile();
-		this.loadState(I.serialize(e));
+		let e = await z.loadFromFile();
+		this.loadState(z.serialize(e));
 	}
 	setLocale(e) {
-		me(e), this.engine.requestRender();
+		S(e), this.engine.requestRender();
 	}
 	setNumberLocale(e) {
 		this.numberLocale = e, this.priceAxis.setLocale(e), this.crosshairHandler.setLocale(e), this.syncRenderContext(), this.engine.requestRender();
@@ -802,7 +816,7 @@ var q = class {
 		return this.features;
 	}
 	setFeatures(e) {
-		Object.assign(this.features, e), e.crosshair === !1 && this.crosshairTooltip.hide(), e.grid !== void 0 && this.engine.requestRender(u.Background), e.volume !== void 0 && (this.volumeRenderer.setVisible(e.volume), this.engine.requestRender(u.Main)), e.drawings === !1 && this.drawingManager.setActiveTool(null), e.trading === !1 && (this.tradingManager.setOrders([]), this.tradingManager.setPositions([])), e.keyboard !== void 0 && this.keyboardHandler?.setEnabled(e.keyboard), this.engine.requestRender();
+		Object.assign(this.features, e), e.crosshair === !1 && this.crosshairTooltip.hide(), e.grid !== void 0 && this.engine.requestRender(d.Background), e.volume !== void 0 && (this.volumeRenderer.setVisible(e.volume), this.engine.requestRender(d.Main)), e.drawings === !1 && this.drawingManager.setActiveTool(null), e.trading === !1 && (this.tradingManager.setOrders([]), this.tradingManager.setPositions([])), e.keyboard !== void 0 && this.keyboardHandler?.setEnabled(e.keyboard), this.engine.requestRender();
 	}
 	resize() {
 		let e = this.engine.dprManager.readContainerSize();
@@ -818,18 +832,18 @@ var q = class {
 	}
 	createChartRenderer(e) {
 		switch (e) {
-			case "candlestick": return new M();
-			case "heikinAshi": return new M();
-			case "line": return new Ne();
-			case "area": return new T();
-			case "bar": return new O();
-			case "hollowCandle": return new De();
-			case "baseline": return new A();
-			case "renko": return new ze();
-			case "lineBreak": return new M();
-			case "kagi": return new Ae();
-			case "pointAndFigure": return new Ie();
-			default: return new M();
+			case "candlestick": return new F();
+			case "heikinAshi": return new F();
+			case "line": return new Ie();
+			case "area": return new O();
+			case "bar": return new j();
+			case "hollowCandle": return new Ae();
+			case "baseline": return new N();
+			case "renko": return new He();
+			case "lineBreak": return new F();
+			case "kagi": return new Ne();
+			case "pointAndFigure": return new ze();
+			default: return new F();
 		}
 	}
 	getDisplayData() {
@@ -839,23 +853,23 @@ var q = class {
 		let t;
 		switch (this.options.chartType) {
 			case "heikinAshi":
-				t = ht(e);
+				t = _t(e);
 				break;
 			case "renko":
-				t = Ct(e, {
+				t = Tt(e, {
 					brickSize: 0,
 					useATR: !0,
 					atrPeriod: 14
 				});
 				break;
 			case "lineBreak":
-				t = yt(e, 3);
+				t = xt(e, 3);
 				break;
 			case "kagi":
-				t = _t(e, 4);
+				t = yt(e, 4);
 				break;
 			case "pointAndFigure":
-				t = xt(e, e.reduce((e, t) => e + t.close, 0) / e.length * .01, 3);
+				t = Ct(e, e.reduce((e, t) => e + t.close, 0) / e.length * .01, 3);
 				break;
 			default: t = e;
 		}
@@ -984,13 +998,13 @@ var q = class {
 			} : void 0
 		} : null;
 	}
-}, Tt = class extends k {
+}, Dt = class extends M {
 	options;
 	constructor(e, t) {
 		super(e, t.theme), this.options = t, this.requestRender();
 	}
 	renderChart(e, t, n, r) {
-		ft(e, t, n, this.options, r);
+		mt(e, t, n, this.options, r);
 	}
 	update(e) {
 		this.options = {
@@ -1004,7 +1018,7 @@ var q = class {
 			...e
 		}, this.requestRender();
 	}
-}, $ = class extends k {
+}, Ot = class extends M {
 	options;
 	crosshair = null;
 	constructor(e, t) {
@@ -1012,7 +1026,7 @@ var q = class {
 	}
 	renderChart(e, t, n, r) {
 		let i = this.crosshair?.getPosition() ?? null;
-		ct(e, t, n, this.options, r, i);
+		ut(e, t, n, this.options, r, i);
 	}
 	update(e) {
 		this.options = {
@@ -1029,7 +1043,7 @@ var q = class {
 	destroy() {
 		this.crosshair?.destroy(), super.destroy();
 	}
-}, Et = class extends k {
+}, kt = class extends M {
 	options;
 	crosshair = null;
 	constructor(e, t) {
@@ -1037,7 +1051,7 @@ var q = class {
 	}
 	renderChart(e, t, n, r) {
 		let i = this.crosshair?.getPosition() ?? null;
-		lt(e, t, n, this.options, r, i);
+		dt(e, t, n, this.options, r, i);
 	}
 	update(e, t) {
 		this.options = {
@@ -1057,7 +1071,7 @@ var q = class {
 	destroy() {
 		this.crosshair?.destroy(), super.destroy();
 	}
-}, Dt = class extends k {
+}, At = class extends M {
 	options;
 	crosshair = null;
 	cachedRects = [];
@@ -1078,10 +1092,10 @@ var q = class {
 			width: this.width,
 			height: this.height
 		}, t = this.options.cellPadding ?? 2;
-		this.lastLayoutWidth = this.width, this.lastLayoutHeight = this.height, this.options.weighted ? this.cachedRects = at(this.currentData.map((e) => ({
+		this.lastLayoutWidth = this.width, this.lastLayoutHeight = this.height, this.options.weighted ? this.cachedRects = st(this.currentData.map((e) => ({
 			id: e.id,
 			weight: e.weight ?? (Math.abs(e.value) || 1)
-		})), e, t) : this.cachedRects = ot(this.currentData.map((e) => ({ id: e.id })), e, t);
+		})), e, t) : this.cachedRects = ct(this.currentData.map((e) => ({ id: e.id })), e, t);
 	}
 	onCanvasClick(e, t) {
 		if (this.options.onCellClick) for (let n of this.cachedRects) {
@@ -1096,7 +1110,7 @@ var q = class {
 	renderChart(e, t, n, r) {
 		(t !== this.lastLayoutWidth || n !== this.lastLayoutHeight) && this.recomputeLayout();
 		let i = this.crosshair?.getPosition() ?? null;
-		dt(e, t, n, this.currentData, this.cachedRects, this.options, r, i);
+		pt(e, t, n, this.currentData, this.cachedRects, this.options, r, i);
 	}
 	update(e) {
 		this.currentData = e, this.options = {
@@ -1113,7 +1127,7 @@ var q = class {
 	destroy() {
 		this.crosshair?.destroy(), this.handleClick && this.canvas.removeEventListener("click", this.handleClick), super.destroy();
 	}
-}, Ot = class extends k {
+}, jt = class extends M {
 	options;
 	crosshair = null;
 	constructor(e, t) {
@@ -1121,7 +1135,7 @@ var q = class {
 	}
 	renderChart(e, t, n, r) {
 		let i = this.crosshair?.getPosition() ?? null;
-		pt(e, t, n, this.options, r, i);
+		ht(e, t, n, this.options, r, i);
 	}
 	update(e) {
 		this.options = {
@@ -1138,12 +1152,12 @@ var q = class {
 	destroy() {
 		this.crosshair?.destroy(), super.destroy();
 	}
-}, kt = 500;
-function At(e) {
+}, Mt = 500;
+function Nt(e) {
 	let t = 1 - e;
 	return 1 - t * t * t;
 }
-var jt = class extends k {
+var Pt = class extends M {
 	options;
 	currentValue;
 	targetValue;
@@ -1154,7 +1168,7 @@ var jt = class extends k {
 		super(e, t.theme), this.options = t, this.currentValue = t.value, this.targetValue = t.value, this.requestRender();
 	}
 	renderChart(e, t, n, r) {
-		ut(e, t, n, this.options, r, this.currentValue);
+		ft(e, t, n, this.options, r, this.currentValue);
 	}
 	setValue(e) {
 		if (this.options.animate === !1) {
@@ -1184,7 +1198,7 @@ var jt = class extends k {
 		if (this.animationFrameId !== null) return;
 		let e = () => {
 			if (this.animationFrameId = null, this.animationStart === null) return;
-			let t = this.options.animationDuration ?? kt, n = performance.now() - this.animationStart, r = Math.min(1, n / Math.max(1, t)), i = At(r);
+			let t = this.options.animationDuration ?? Mt, n = performance.now() - this.animationStart, r = Math.min(1, n / Math.max(1, t)), i = Nt(r);
 			this.currentValue = this.animationFrom + (this.targetValue - this.animationFrom) * i, this.requestRender(), r < 1 ? this.animationFrameId = requestAnimationFrame(e) : (this.currentValue = this.targetValue, this.animationStart = null);
 		};
 		this.animationFrameId = requestAnimationFrame(e);
@@ -1197,6 +1211,6 @@ var jt = class extends k {
 	}
 };
 //#endregion
-export { x as AlertManager, C as Animator, E as BarCountdown, j as BinanceAdapter, wt as Chart, N as ChartLegend, F as ChartStateManager, L as CompareRenderer, he as CrosshairTooltip, _e as CurrentPriceLine, e as DARK_THEME, n as DEFAULT_DRAWING_STYLE, ye as DEFAULT_LEGEND_CONFIG, i as DEFAULT_RECONNECT, a as DEFAULT_STREAM_CONFIG, o as DEFAULT_TIMEFRAME_FAVORITES, s as DEFAULT_TRADING_CONFIG, be as DataExporter, q as DataManager, $ as DepthChart, xe as DrawingBase, we as Easing, Et as EquityCurveChart, jt as GaugeChart, Dt as HeatmapChart, Oe as IndicatorBase, je as KeyboardHandler, c as LIGHT_THEME, Z as LayoutManager, d as MARKET_CRYPTO, f as MARKET_HNX, ee as MARKET_HOSE, p as MARKET_NYSE, te as MARKET_UPCOM, Pe as MockAdapter, Q as PluginManager, Be as ReplayManager, He as Screenshot, Ue as SessionBreaks, Tt as SparklineChart, Ge as StreamManager, g as TIMEFRAMES_CRYPTO, _ as TIMEFRAMES_FOREX, ne as TIMEFRAMES_STOCK, J as ThemeManager, qe as TickAggregator, Ze as UndoRedoManager, re as VN_COLORS, et as VolumeRenderer, Ot as WaterfallChart, nt as Watermark, ie as computePriceLimits, ae as createVNTheme, oe as formatNumber, se as formatVND, ce as formatVolumeLoc, le as getCurrentSession, ue as getLocale, fe as registerLocale, pe as setLocale, b as t, mt as toHeikinAshi, gt as toKagi, vt as toLineBreak, bt as toPointAndFigure, St as toRenko };
+export { w as AlertManager, E as Animator, k as BarCountdown, P as BinanceAdapter, Et as Chart, I as ChartLegend, R as ChartStateManager, he as CompareRenderer, ve as CrosshairTooltip, be as CurrentPriceLine, e as DARK_TERMINAL, t as DARK_THEME, r as DEFAULT_DRAWING_STYLE, Se as DEFAULT_LEGEND_CONFIG, a as DEFAULT_RECONNECT, o as DEFAULT_STREAM_CONFIG, s as DEFAULT_TIMEFRAME_FAVORITES, c as DEFAULT_TRADING_CONFIG, Ce as DataExporter, J as DataManager, Ot as DepthChart, we as DrawingBase, De as Easing, kt as EquityCurveChart, Pt as GaugeChart, At as HeatmapChart, je as IndicatorBase, Pe as KeyboardHandler, l as LIGHT_THEME, Q as LayoutManager, f as MARKET_CRYPTO, ee as MARKET_HNX, p as MARKET_HOSE, m as MARKET_NYSE, h as MARKET_UPCOM, Le as MockAdapter, $ as PluginManager, Ue as ReplayManager, We as Screenshot, Ge as SessionBreaks, Dt as SparklineChart, qe as StreamManager, te as TIMEFRAMES_CRYPTO, ne as TIMEFRAMES_FOREX, re as TIMEFRAMES_STOCK, Y as ThemeManager, Ye as TickAggregator, $e as UndoRedoManager, ie as VN_COLORS, nt as VolumeRenderer, jt as WaterfallChart, it as Watermark, ae as computePriceLimits, oe as createVNTheme, se as formatNumber, ce as formatVND, le as formatVolumeLoc, ue as getCurrentSession, de as getLocale, pe as normalizeBar, me as normalizeBarTime, b as registerLocale, x as setLocale, C as t, gt as toHeikinAshi, vt as toKagi, bt as toLineBreak, St as toPointAndFigure, wt as toRenko };
 
 //# sourceMappingURL=index.js.map