@tradecanvas/chart 0.1.0

package/dist/index.js

@@ -0,0 +1,966 @@
+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 ne, TIMEFRAMES_STOCK as re, TIME_AXIS_HEIGHT as _, VN_COLORS as ie, computePriceLimits as ae, computePriceLimits as v, createVNTheme as oe, formatNumber as se, formatVND as ce, formatVolumeLoc as le, getCurrentSession as ue, getLocale as de, mergeBar as fe, registerLocale as pe, setLocale as y, setLocale as b, t as x } from "@tradecanvas/commons";
+import { AlertManager as S, AlertManager as C, Animator as w, Animator as T, AreaRenderer as E, BarCountdown as D, BarCountdown as O, BarRenderer 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 B, CrosshairTooltip as me, CurrentPriceLine as he, CurrentPriceLine as ge, DEFAULT_LEGEND_CONFIG as _e, DataExporter as ve, DataExporter as V, DrawingBase as ye, DrawingManager as be, DrawingRenderer as xe, Easing as Se, EventBus as Ce, GridRenderer as we, HollowCandleRenderer as Te, IndicatorBase as Ee, IndicatorEngine as H, InteractionManager as De, KagiRenderer as Oe, KeyboardHandler as ke, KeyboardHandler as Ae, LineRenderer as je, MockAdapter as Me, PanHandler as Ne, PointAndFigureRenderer as Pe, PriceAxis as Fe, RenderEngine as Ie, RenkoRenderer as Le, ReplayManager as Re, ReplayManager as ze, Screenshot as Be, Screenshot as U, SessionBreaks as Ve, SessionBreaks as He, StreamManager as Ue, StreamManager as We, TickAggregator as Ge, TimeAxis as Ke, TradingManager as qe, TradingRenderer as Je, UndoRedoManager as Ye, UndoRedoManager as Xe, Viewport as Ze, VolumeRenderer as Qe, VolumeRenderer as $e, Watermark as et, Watermark as tt, ZoomHandler as nt, registerBuiltInDrawingTools as rt, registerBuiltInIndicators as W, toHeikinAshi as it, toHeikinAshi as at, toKagi as ot, toKagi as st, toLineBreak as ct, toLineBreak as lt, toPointAndFigure as G, toPointAndFigure as ut, toRenko as dt, toRenko as ft } from "@tradecanvas/core";
+//#region src/DataManager.ts
+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 q(e) {
+	return {
+		...e,
+		high: Math.max(e.open, e.high, e.low, e.close),
+		low: Math.min(e.open, e.high, e.low, e.close),
+		volume: e.volume === void 0 ? 0 : Math.max(0, e.volume)
+	};
+}
+var J = class {
+	data = [];
+	getData() {
+		return this.data;
+	}
+	setData(e) {
+		this.data = e.filter(K).map(q);
+	}
+	appendBar(e) {
+		K(e) && this.data.push(q(e));
+	}
+	updateLastBar(e) {
+		if (!K(e)) return;
+		let t = q(e);
+		if (this.data.length === 0) {
+			this.data.push(t);
+			return;
+		}
+		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] = fe(this.data[this.data.length - 1], e)));
+	}
+	getLength() {
+		return this.data.length;
+	}
+	clear() {
+		this.data = [];
+	}
+}, Y = class {
+	theme;
+	constructor(e) {
+		!e || e === "dark" ? this.theme = { ...t } : e === "light" ? this.theme = { ...l } : this.theme = { ...e };
+	}
+	getTheme() {
+		return this.theme;
+	}
+	setTheme(e) {
+		e === "dark" ? this.theme = { ...t } : e === "light" ? this.theme = { ...l } : this.theme = { ...e };
+	}
+}, X = 200, Z = 80, Q = class {
+	panels = [];
+	containerWidth = 0;
+	containerHeight = 0;
+	resize(e, t) {
+		this.containerWidth = e, this.containerHeight = t;
+	}
+	addPanel(e, t = "bottom", n) {
+		let i = t === "left" || t === "right";
+		this.panels.push({
+			id: e,
+			position: t,
+			size: n ?? (i ? X : r),
+			minSize: i ? Z : m,
+			content: {
+				type: "indicator",
+				indicatorInstanceId: e
+			}
+		});
+	}
+	removePanel(e) {
+		this.panels = this.panels.filter((t) => t.id !== e);
+	}
+	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 ? X : r, n.minSize = i ? Z : m);
+		}
+	}
+	setPanelSize(e, t) {
+		let n = this.panels.find((t) => t.id === e);
+		n && (n.size = Math.max(n.minSize, t));
+	}
+	getPanels() {
+		return this.panels;
+	}
+	resolve() {
+		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),
+			height: Math.max(0, this.containerHeight - o - s - _)
+		}, l = [], u = [], d = 0;
+		for (let t of e) l.push({
+			config: t,
+			rect: {
+				x: d,
+				y: 0,
+				width: t.size,
+				height: this.containerHeight - _
+			}
+		}), u.push({
+			panelId: t.id,
+			rect: {
+				x: d + t.size - 2,
+				y: 0,
+				width: 4,
+				height: this.containerHeight
+			},
+			orientation: "vertical"
+		}), d += t.size;
+		let f = 0;
+		for (let e of n) l.push({
+			config: e,
+			rect: {
+				x: i,
+				y: f,
+				width: c.width,
+				height: e.size
+			}
+		}), u.push({
+			panelId: e.id,
+			rect: {
+				x: i,
+				y: f + e.size - 2,
+				width: c.width,
+				height: 4
+			},
+			orientation: "horizontal"
+		}), f += e.size;
+		f = c.y + c.height;
+		for (let e of r) l.push({
+			config: e,
+			rect: {
+				x: i,
+				y: f,
+				width: c.width,
+				height: e.size
+			}
+		}), u.push({
+			panelId: e.id,
+			rect: {
+				x: i,
+				y: f - 2,
+				width: c.width,
+				height: 4
+			},
+			orientation: "horizontal"
+		}), f += e.size;
+		d = i + c.width + h;
+		for (let e of t) l.push({
+			config: e,
+			rect: {
+				x: d,
+				y: 0,
+				width: e.size,
+				height: this.containerHeight - _
+			}
+		}), u.push({
+			panelId: e.id,
+			rect: {
+				x: d - 2,
+				y: 0,
+				width: 4,
+				height: this.containerHeight
+			},
+			orientation: "vertical"
+		}), d += e.size;
+		return {
+			mainChartRect: c,
+			panels: l,
+			dividers: u
+		};
+	}
+	getMainChartRect() {
+		return this.resolve().mainChartRect;
+	}
+}, $ = class {
+	constructor(e) {
+		this.indicatorEngine = e;
+	}
+	registerIndicator(e) {
+		this.indicatorEngine.register(e);
+	}
+}, pt = class {
+	static version = "0.3.0";
+	engine;
+	viewport;
+	dataManager;
+	themeManager;
+	layoutManager;
+	pluginManager;
+	indicatorEngine;
+	drawingManager;
+	drawingRenderer;
+	tradingManager;
+	tradingRenderer;
+	eventBus;
+	streamManager = null;
+	autoScrollOnNewBar = !0;
+	displayDataCache = null;
+	resolvedLayoutCache = null;
+	panelInfoCache = null;
+	renderScheduled = !1;
+	containerSizeCache = null;
+	containerSizeCacheTime = 0;
+	chartLegend;
+	watermark;
+	barCountdown;
+	sessionBreaks;
+	compareRenderer;
+	countdownInterval = null;
+	volumeRenderer;
+	alertManager;
+	replayManager;
+	undoRedoManager;
+	autoSaveTimer = null;
+	autoSaveDelay = 0;
+	autoSaveKey = null;
+	animator;
+	crosshairTooltip;
+	interactionManager;
+	crosshairHandler;
+	chartRenderer;
+	gridRenderer;
+	priceAxis;
+	timeAxis;
+	options;
+	features;
+	marketConfig = null;
+	container;
+	currentPriceLine;
+	constructor(e, t) {
+		this.container = e, this.options = t;
+		let n = t.features ?? {};
+		this.features = {
+			drawings: n.drawings ?? !0,
+			drawingTools: n.drawingTools ?? [],
+			drawingMagnet: n.drawingMagnet ?? !0,
+			drawingUndoRedo: n.drawingUndoRedo ?? !0,
+			trading: n.trading ?? !0,
+			tradingContextMenu: n.tradingContextMenu ?? !0,
+			indicators: n.indicators ?? !0,
+			indicatorIds: n.indicatorIds ?? [],
+			panning: n.panning ?? !0,
+			zooming: n.zooming ?? !0,
+			crosshair: n.crosshair ?? !0,
+			keyboard: n.keyboard ?? !0,
+			priceAxis: n.priceAxis ?? !0,
+			timeAxis: n.timeAxis ?? !0,
+			grid: n.grid ?? t.grid?.visible ?? !0,
+			legend: n.legend ?? !0,
+			volume: n.volume ?? !0,
+			watermark: n.watermark ?? !0,
+			saveLoad: n.saveLoad ?? !0,
+			screenshot: n.screenshot ?? !0,
+			alerts: n.alerts ?? !0,
+			replay: n.replay ?? !0,
+			sessionBreaks: n.sessionBreaks ?? !0,
+			barCountdown: n.barCountdown ?? !0,
+			compareSymbols: n.compareSymbols ?? !0,
+			dataExport: n.dataExport ?? !0,
+			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 J(), this.themeManager = new Y(t.theme), this.layoutManager = new Q(), this.indicatorEngine = new H(), this.pluginManager = new $(this.indicatorEngine), this.eventBus = new Ce(), W(this.indicatorEngine), this.drawingManager = new be(), rt(this.drawingManager), this.drawingRenderer = new xe(this.drawingManager), this.drawingManager.setRequestRender(() => {
+			this.syncRenderContext(), this.engine.requestRender(u.Overlay), this.scheduleAutoSave();
+		}), this.drawingManager.setEventCallback((e, t) => {
+			this.eventBus.emit(e, t);
+		}), this.undoRedoManager = new Xe(), 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 qe(), this.tradingRenderer = new Je(this.tradingManager), this.tradingManager.setContainer(e), this.tradingManager.setRequestRender(() => this.engine.requestRender(u.Overlay)), this.tradingManager.setEventCallback((e, t) => {
+			this.eventBus.emit(e, t);
+		}), this.engine = new Ie(e);
+		let r = this.engine.dprManager.getContainerSize();
+		this.viewport = new Ze(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 we(), t.grid?.visible === !1 && this.gridRenderer.setVisible(!1), this.priceAxis = new Fe(), this.timeAxis = new Ke(), this.crosshairHandler = new z(), 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", {
+					point: t,
+					bar: r,
+					barIndex: e
+				});
+			} else this.crosshairTooltip.hide(), this.chartLegend.setHoverBar(null);
+		}), this.chartLegend = new P(), this.chartLegend.setChartType(t.chartType), this.watermark = new tt(), t.watermark && this.watermark.setConfig(t.watermark), this.volumeRenderer = new $e(), this.barCountdown = new O(), this.sessionBreaks = new He(), this.compareRenderer = new R(), 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 T(), this.crosshairTooltip = new me(), this.crosshairTooltip.create(e), new Ae({
+			scrollBars: (e) => {
+				let t = this.viewport.getState().barWidth + this.viewport.getState().barSpacing;
+				this.viewport.scrollBy(e * t), this.updateViewportAndRender();
+			},
+			zoom: (e) => {
+				let t = this.viewport.getState().chartRect.width;
+				this.viewport.zoom(e, t / 2), this.updateViewportAndRender();
+			},
+			goToStart: () => {
+				this.viewport.scrollBy(-Infinity), this.updateViewportAndRender();
+			},
+			goToEnd: () => {
+				this.viewport.scrollToEnd(), this.updateViewportAndRender();
+			},
+			fitContent: () => this.fitContent()
+		}), this.currentPriceLine = new ge(), this.alertManager = new C(), this.alertManager.setRequestRender(() => this.engine.requestRender(u.Overlay)), this.alertManager.on("triggered", (e) => {
+			this.eventBus.emit("dataUpdate", {
+				alert: "triggered",
+				alertId: e.id,
+				price: e.price,
+				message: e.message
+			});
+		}), this.replayManager = new ze(), this.interactionManager = new De(e), this.features.panning && this.interactionManager.setPanHandler(new Ne((e) => {
+			this.viewport.scrollBy(e), this.updateViewportAndRender();
+		})), this.features.zooming && this.interactionManager.setZoomHandler(new nt((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.interactionManager.attach(), this.syncRenderContext(), this.engine.start();
+	}
+	setData(e) {
+		this.dataManager.setData(e), this.crosshairHandler.setData(this.dataManager.getData()), this.displayDataCache = null, this.sessionBreaks.invalidateCache(), this.indicatorEngine.recalculateAll(this.dataManager.getData()), e.length > 0 && this.currentPriceLine.setPrice(e[e.length - 1].close), this.updateViewportAndRender(!0), this.eventBus.emit("dataUpdate", { length: e.length });
+	}
+	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();
+	}
+	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.scheduleRender();
+	}
+	updateLastBarFromTick(e) {
+		this.dataManager.updateLastBarFromTick(e), this.currentPriceLine.setPrice(e.price), this.options.chartType !== "candlestick" && this.options.chartType !== "line" && this.options.chartType !== "area" && this.options.chartType !== "bar" && this.options.chartType !== "hollowCandle" && (this.displayDataCache = null), this.scheduleRender();
+	}
+	setChartType(e) {
+		this.options.chartType = e, this.chartRenderer = this.createChartRenderer(e), this.chartLegend.setChartType(e), this.displayDataCache = null, this.updateViewportAndRender(!0);
+	}
+	addIndicator(e, t = {}, n = "bottom") {
+		if (!this.features.indicators || this.features.indicatorIds.length > 0 && !this.features.indicatorIds.includes(e)) return null;
+		let r = this.indicatorEngine.addIndicator(e, t, this.dataManager.getData());
+		return this.indicatorEngine.getAvailableIndicators().find((t) => t.id === e)?.placement === "panel" && this.layoutManager.addPanel(r, n), this.eventBus.emit("indicatorAdd", {
+			instanceId: r,
+			id: e
+		}), this.engine.requestRender(), r;
+	}
+	updateIndicator(e, t) {
+		this.indicatorEngine.updateIndicator(e, t, this.dataManager.getData()), this.engine.requestRender();
+	}
+	removeIndicator(e) {
+		this.indicatorEngine.removeIndicator(e), this.layoutManager.removePanel(e), this.eventBus.emit("indicatorRemove", { instanceId: e }), this.engine.requestRender();
+	}
+	getIndicatorOutput(e) {
+		return this.indicatorEngine.getOutput(e);
+	}
+	registerIndicator(e) {
+		this.pluginManager.registerIndicator(e);
+	}
+	static indicators() {
+		let e = new H();
+		return W(e), e.getAvailableIndicators();
+	}
+	setPanelPosition(e, t) {
+		this.layoutManager.setPanelPosition(e, t), this.engine.requestRender();
+	}
+	setPanelSize(e, t) {
+		this.layoutManager.setPanelSize(e, t), this.engine.requestRender();
+	}
+	setDrawingTool(e) {
+		this.features.drawings && (e && this.features.drawingTools.length > 0 && !this.features.drawingTools.includes(e) || this.drawingManager.setActiveTool(e));
+	}
+	getDrawingTool() {
+		return this.drawingManager.getActiveTool();
+	}
+	setDrawingStyle(e) {
+		this.drawingManager.setStyle(e);
+	}
+	getDrawings() {
+		return this.drawingManager.getDrawings();
+	}
+	setDrawings(e) {
+		this.drawingManager.setDrawings(e);
+	}
+	removeDrawing(e) {
+		this.drawingManager.removeDrawing(e);
+	}
+	clearDrawings() {
+		this.drawingManager.clearDrawings();
+	}
+	registerDrawingTool(e) {
+		this.drawingManager.register(e);
+	}
+	undo() {
+		return this.features.drawingUndoRedo ? this.drawingManager.undo() : !1;
+	}
+	redo() {
+		return this.features.drawingUndoRedo ? this.drawingManager.redo() : !1;
+	}
+	getUndoRedoState() {
+		return this.undoRedoManager.getState();
+	}
+	setDrawingMagnet(e) {
+		this.drawingManager.setMagnetMode(e ? "magnet" : "none");
+	}
+	getDrawingMagnet() {
+		return this.drawingManager.getMagnetMode() === "magnet";
+	}
+	lockAllDrawings() {
+		this.drawingManager.lockAllDrawings();
+	}
+	unlockAllDrawings() {
+		this.drawingManager.unlockAllDrawings();
+	}
+	hideAllDrawings() {
+		this.drawingManager.hideAllDrawings();
+	}
+	showAllDrawings() {
+		this.drawingManager.showAllDrawings();
+	}
+	duplicateDrawing(e) {
+		let t = e ?? this.drawingManager.getSelectedDrawingId();
+		return t ? this.drawingManager.duplicateDrawing(t) : null;
+	}
+	exportVisibleData(e = "csv", t) {
+		let n = this.viewport.getState(), r = this.dataManager.getData(), i = Math.max(0, n.visibleRange.from), a = Math.min(r.length - 1, n.visibleRange.to), o = r.slice(i, a + 1);
+		if (e === "json") {
+			let e = V.toJSON(o);
+			V.download(e, t ?? "chart-data.json", "application/json");
+		} else {
+			let e = V.toCSV(o);
+			V.download(e, t ?? "chart-data.csv", "text/csv");
+		}
+	}
+	exportAllData(e = "csv", t) {
+		let n = this.dataManager.getData();
+		if (e === "json") {
+			let e = V.toJSON(n);
+			V.download(e, t ?? "chart-data.json", "application/json");
+		} else {
+			let e = V.toCSV(n);
+			V.download(e, t ?? "chart-data.csv", "text/csv");
+		}
+	}
+	setAutoSave(e, t = 5e3) {
+		this.autoSaveKey = e, this.autoSaveDelay = t;
+	}
+	disableAutoSave() {
+		this.autoSaveDelay = 0, this.autoSaveKey = null, this.autoSaveTimer &&= (clearTimeout(this.autoSaveTimer), null);
+	}
+	scheduleAutoSave() {
+		this.autoSaveDelay <= 0 || !this.autoSaveKey || (this.autoSaveTimer && clearTimeout(this.autoSaveTimer), this.autoSaveTimer = setTimeout(() => {
+			this.autoSaveTimer = null, this.autoSaveKey && this.saveState(this.autoSaveKey);
+		}, this.autoSaveDelay));
+	}
+	getAvailableIndicators() {
+		return this.indicatorEngine.getAvailableIndicators();
+	}
+	getIndicatorInputs(e) {
+		let t = this.indicatorEngine.getAvailableIndicators().find((t) => t.id === e);
+		return t ? {
+			id: t.id,
+			params: t.defaultConfig
+		} : null;
+	}
+	getActiveIndicators() {
+		return this.indicatorEngine.getActiveIndicators();
+	}
+	getIndicatorConfig(e) {
+		let t = this.indicatorEngine.getIndicatorConfig(e);
+		return t ? {
+			id: t.id,
+			params: { ...t.params }
+		} : null;
+	}
+	updateIndicatorStyle(e, t) {
+		this.indicatorEngine.updateIndicatorStyle(e, t), this.engine.requestRender();
+	}
+	setOrders(e) {
+		this.features.trading && this.tradingManager.setOrders(e);
+	}
+	setPositions(e) {
+		this.features.trading && this.tradingManager.setPositions(e);
+	}
+	setDepthData(e) {
+		this.features.trading && this.tradingManager.setDepthData(e);
+	}
+	setCurrentPrice(e) {
+		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 We(), 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.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.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);
+		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);
+		}, 1e3);
+	}
+	async switchStream(e, t) {
+		this.streamManager && await this.streamManager.switchTo(e, t);
+	}
+	disconnectStream() {
+		this.streamManager &&= (this.streamManager.dispose(), null);
+	}
+	setBarCountdownVisible(e) {
+		this.barCountdown.setVisible(e), this.engine.requestRender(u.UI);
+	}
+	setSessionBreaksVisible(e) {
+		this.sessionBreaks.setVisible(e), this.engine.requestRender(u.Background);
+	}
+	addCompareSymbol(e, t, n, r) {
+		this.compareRenderer.addSymbol({
+			id: e,
+			label: t,
+			data: n,
+			color: r,
+			visible: !0
+		}), this.engine.requestRender(u.Main);
+	}
+	removeCompareSymbol(e) {
+		this.compareRenderer.removeSymbol(e), this.engine.requestRender(u.Main);
+	}
+	updateCompareData(e, t) {
+		this.compareRenderer.setSymbolData(e, t), this.engine.requestRender(u.Main);
+	}
+	setCompareMode(e) {
+		this.compareRenderer.setMode(e), this.engine.requestRender(u.Main);
+	}
+	clearCompareSymbols() {
+		this.compareRenderer.clear(), this.engine.requestRender(u.Main);
+	}
+	setLogScale(e) {
+		this.viewport.setLogScale(e), this.updateViewportAndRender();
+	}
+	isLogScale() {
+		return this.viewport.isLogScale();
+	}
+	setSessionBreaksConfig(e) {
+		this.sessionBreaks.setConfig(e), this.engine.requestRender(u.Background);
+	}
+	getConnectionState() {
+		return this.streamManager?.getConnectionState() ?? "disconnected";
+	}
+	getConnectionInfo() {
+		return this.streamManager?.getConnectionInfo() ?? { state: "disconnected" };
+	}
+	setAutoScroll(e) {
+		this.autoScrollOnNewBar = e;
+	}
+	scrollTo(e) {
+		let t = this.dataManager.getData();
+		for (let n = 0; n < t.length; n++) if (t[n].time >= e) {
+			let e = this.viewport.getState().barWidth + this.viewport.getState().barSpacing;
+			this.viewport.scrollBy(n * e - this.viewport.getState().offset), this.updateViewportAndRender();
+			return;
+		}
+	}
+	scrollToEnd() {
+		this.viewport.scrollToEnd(), this.updateViewportAndRender();
+	}
+	setVisibleRange(e, t) {
+		let n = this.dataManager.getData(), r = 0, i = n.length - 1;
+		for (let t = 0; t < n.length; t++) if (n[t].time >= e) {
+			r = t;
+			break;
+		}
+		for (let e = n.length - 1; e >= 0; e--) if (n[e].time <= t) {
+			i = e;
+			break;
+		}
+		let a = i - r + 1;
+		if (a > 0) {
+			let e = this.viewport.getState().chartRect.width, t = e / a, n = Math.max(2, t - this.viewport.getState().barSpacing);
+			this.viewport.zoom((n - this.viewport.getState().barWidth) / this.viewport.getState().barWidth, e / 2);
+		}
+		this.updateViewportAndRender();
+	}
+	zoomIn() {
+		let e = this.viewport.getState().chartRect.width;
+		this.viewport.zoom(.2, e / 2), this.updateViewportAndRender();
+	}
+	zoomOut() {
+		let e = this.viewport.getState().chartRect.width;
+		this.viewport.zoom(-.2, e / 2), this.updateViewportAndRender();
+	}
+	fitContent() {
+		let e = this.dataManager.getData();
+		e.length !== 0 && this.setVisibleRange(e[0].time, e[e.length - 1].time);
+	}
+	on(e, t) {
+		this.eventBus.on(e, t);
+	}
+	off(e, t) {
+		this.eventBus.off(e, t);
+	}
+	enableTauriBridge(e) {
+		this.eventBus.enableTauriBridge({
+			enabled: !0,
+			...e
+		});
+	}
+	disableTauriBridge() {
+		this.eventBus.disableTauriBridge();
+	}
+	setTheme(e) {
+		this.themeManager.setTheme(e), this.syncRenderContext(), this.container.style.backgroundColor = this.themeManager.getTheme().background, this.engine.requestRender(), this.eventBus.emit("themeChange", { theme: e });
+	}
+	getTheme() {
+		return this.themeManager.getTheme();
+	}
+	setWatermark(e, t) {
+		this.watermark.setConfig({
+			text: e,
+			...t
+		}), this.engine.requestRender(u.Background);
+	}
+	setAutoScale(e) {
+		this.options.autoScale = e, this.updateViewportAndRender();
+	}
+	isAutoScale() {
+		return this.options.autoScale !== !1;
+	}
+	setCrosshairMode(e) {
+		this.crosshairHandler.setMode(e), this.engine.requestRender(u.Overlay);
+	}
+	getCrosshairMode() {
+		return this.crosshairHandler.getMode();
+	}
+	setGridVisible(e) {
+		this.gridRenderer.setVisible(e), this.engine.requestRender(u.Background);
+	}
+	isGridVisible() {
+		return this.gridRenderer.isVisible();
+	}
+	setVolumeVisible(e) {
+		this.volumeRenderer.setVisible(e), this.engine.requestRender(u.Main);
+	}
+	setTooltipVisible(e) {
+		e || this.crosshairTooltip.hide();
+	}
+	setLegend(e) {
+		this.chartLegend.setConfig(e), this.engine.requestRender(u.UI);
+	}
+	setSymbolName(e) {
+		this.chartLegend.setSymbol(e), this.engine.requestRender(u.UI);
+	}
+	screenshot(e) {
+		this.features.screenshot && U.download(this.container, e, this.themeManager.getTheme().background);
+	}
+	screenshotDataURL() {
+		return this.features.screenshot ? U.toDataURL(this.container, this.themeManager.getTheme().background) : null;
+	}
+	async screenshotBlob() {
+		return this.features.screenshot ? U.toBlob(this.container, this.themeManager.getTheme().background) : null;
+	}
+	addAlert(e, t = "crossing", n) {
+		if (!this.features.alerts) return null;
+		let r = this.alertManager.addAlert(e, t, n);
+		return this.scheduleAutoSave(), r;
+	}
+	removeAlert(e) {
+		this.alertManager.removeAlert(e), this.scheduleAutoSave();
+	}
+	getAlerts() {
+		return this.alertManager.getAlerts();
+	}
+	clearAlerts() {
+		this.alertManager.clearAlerts(), this.scheduleAutoSave();
+	}
+	saveAlerts(e) {
+		this.alertManager.saveToStorage(e);
+	}
+	loadAlerts(e) {
+		this.alertManager.loadFromStorage(e), this.engine.requestRender(u.Overlay);
+	}
+	replay(e) {
+		if (!this.features.replay) return;
+		let t = this.dataManager.getData();
+		this.replayManager.load(t), this.replayManager.on("bar", ({ bar: e, index: n }) => {
+			let r = t.slice(0, n + 1);
+			this.dataManager.setData(r), this.crosshairHandler.setData(r), this.indicatorEngine.recalculateAll(r), this.updateViewportAndRender();
+		}), this.replayManager.play(e);
+	}
+	replayPause() {
+		this.replayManager.pause();
+	}
+	replayResume() {
+		this.replayManager.resume();
+	}
+	replayStop() {
+		this.replayManager.stop();
+	}
+	replaySeek(e) {
+		this.replayManager.seekTo(e);
+	}
+	setReplaySpeed(e) {
+		this.replayManager.setSpeed(e);
+	}
+	getReplayState() {
+		return this.replayManager.getState();
+	}
+	getReplayProgress() {
+		return this.replayManager.getProgress();
+	}
+	saveState(e) {
+		if (!this.features.saveLoad) return null;
+		let t = I.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;
+	}
+	loadState(e) {
+		if (!this.features.saveLoad) return;
+		let t = I.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);
+		}
+	}
+	loadStateFromStorage(e) {
+		if (!this.features.saveLoad) return !1;
+		let t = I.loadFromStorage(e);
+		return t ? (this.loadState(I.serialize(t)), !0) : !1;
+	}
+	downloadState(e) {
+		if (!this.features.saveLoad) return;
+		let t = I.capture({
+			getDrawings: () => this.getDrawings(),
+			getTheme: () => this.getTheme(),
+			getAlerts: () => this.getAlerts()
+		}, { chartType: this.options.chartType });
+		I.downloadFile(t, e);
+	}
+	async loadStateFromFile() {
+		if (!this.features.saveLoad) return;
+		let e = await I.loadFromFile();
+		this.loadState(I.serialize(e));
+	}
+	setLocale(e) {
+		b(e), this.engine.requestRender();
+	}
+	setMarket(e) {
+		if (this.marketConfig = e, e.colorScheme) {
+			let t = {
+				...this.themeManager.getTheme(),
+				candleUp: e.colorScheme.up,
+				candleDown: e.colorScheme.down,
+				candleUpWick: e.colorScheme.up,
+				candleDownWick: e.colorScheme.down,
+				volumeUp: e.colorScheme.up.replace(")", ", 0.3)").replace("rgb(", "rgba(") || `${e.colorScheme.up}4D`,
+				volumeDown: e.colorScheme.down.replace(")", ", 0.3)").replace("rgb(", "rgba(") || `${e.colorScheme.down}4D`
+			};
+			this.themeManager.setTheme(t);
+		}
+		e.pricePrecision !== void 0 && (this.tradingManager.setConfig({ pricePrecision: e.pricePrecision }), this.alertManager.setPricePrecision(e.pricePrecision), this.streamManager?.priceLine.setPricePrecision(e.pricePrecision), this.crosshairHandler.setPricePrecision(e.pricePrecision)), this.syncRenderContext(), this.engine.requestRender();
+	}
+	getMarket() {
+		return this.marketConfig;
+	}
+	setPriceLimits(e) {
+		this.marketConfig && (v(e, this.marketConfig) && (this.marketConfig.priceLimits = {
+			...this.marketConfig.priceLimits,
+			referencePrice: e
+		}), this.engine.requestRender());
+	}
+	getFeatures() {
+		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([])), this.engine.requestRender();
+	}
+	resize() {
+		let e = this.engine.dprManager.readContainerSize();
+		if (e.width <= 0 || e.height <= 0) return;
+		this.containerSizeCache = e, this.containerSizeCacheTime = Date.now();
+		let t = this.engine.dprManager.getDpr();
+		this.engine.layerManager.resize(e, t);
+		let n = this.viewport.isAtEnd();
+		this.viewport.resize(e.width, e.height), this.layoutManager.resize(e.width, e.height), this.updateViewportAndRender(n), this.eventBus.emit("resize", e);
+	}
+	destroy() {
+		this.countdownInterval && clearInterval(this.countdownInterval), this.disableAutoSave(), this.disconnectStream(), this.interactionManager.detach(), this.tradingManager.destroy(), this.animator.dispose(), this.crosshairTooltip.destroy(), this.replayManager.dispose(), this.undoRedoManager.clear(), this.engine.destroy(), this.eventBus.destroy(), this.container.innerHTML = "";
+	}
+	createChartRenderer(e) {
+		switch (e) {
+			case "candlestick": return new M();
+			case "heikinAshi": return new M();
+			case "line": return new je();
+			case "area": return new E();
+			case "bar": return new k();
+			case "hollowCandle": return new Te();
+			case "baseline": return new A();
+			case "renko": return new Le();
+			case "lineBreak": return new M();
+			case "kagi": return new Oe();
+			case "pointAndFigure": return new Pe();
+			default: return new M();
+		}
+	}
+	getDisplayData() {
+		if (this.displayDataCache) return this.displayDataCache;
+		let e = this.dataManager.getData();
+		if (e.length === 0) return e;
+		let t;
+		switch (this.options.chartType) {
+			case "heikinAshi":
+				t = at(e);
+				break;
+			case "renko":
+				t = ft(e, {
+					brickSize: 0,
+					useATR: !0,
+					atrPeriod: 14
+				});
+				break;
+			case "lineBreak":
+				t = lt(e, 3);
+				break;
+			case "kagi":
+				t = st(e, 4);
+				break;
+			case "pointAndFigure":
+				t = ut(e, e.reduce((e, t) => e + t.close, 0) / e.length * .01, 3);
+				break;
+			default: t = e;
+		}
+		return this.displayDataCache = t, t;
+	}
+	scheduleRender() {
+		this.renderScheduled || (this.renderScheduled = !0, requestAnimationFrame(() => {
+			this.renderScheduled = !1;
+			let e = this.getDisplayData();
+			this.viewport.updateData(e, this.options.autoScale !== !1), this.syncRenderContext(), this.engine.requestRender();
+		}));
+	}
+	updateViewportAndRender(e = !1) {
+		this.resolvedLayoutCache = null, this.panelInfoCache = null;
+		let t = this.getResolvedLayout();
+		this.viewport.setChartRect(t.mainChartRect);
+		let n = this.getDisplayData();
+		this.viewport.updateData(n, this.options.autoScale !== !1), e && this.viewport.scrollToEnd(), this.syncRenderContext(), this.engine.requestRender();
+	}
+	getResolvedLayout() {
+		return this.resolvedLayoutCache ||= this.layoutManager.resolve(), this.resolvedLayoutCache;
+	}
+	cachedContainerSize() {
+		let e = Date.now();
+		return (!this.containerSizeCache || e - this.containerSizeCacheTime > 500) && (this.containerSizeCache = this.engine.dprManager.getContainerSize(), this.containerSizeCacheTime = e), this.containerSizeCache;
+	}
+	buildPanelRenderInfos() {
+		if (this.panelInfoCache) return this.panelInfoCache;
+		let e = this.getResolvedLayout(), t = this.viewport.getState(), n = e.panels.map((e) => {
+			let n = this.indicatorEngine.getOutput(e.config.id), r = 0, i = 100;
+			if (n) {
+				let e = Infinity, a = -Infinity, { from: o, to: s } = t.visibleRange, c = 0;
+				for (let [, t] of n.values) {
+					if (c >= o && c <= s) for (let n in t) {
+						let r = t[n];
+						r !== void 0 && (r < e && (e = r), r > a && (a = r));
+					}
+					c++;
+				}
+				if (e !== Infinity) {
+					let t = a - e || 1;
+					r = e - t * .1, i = a + t * .1;
+				}
+			}
+			let a = {
+				x: e.rect.x,
+				y: e.rect.y + 20,
+				width: e.rect.width,
+				height: Math.max(0, e.rect.height - 20)
+			};
+			return {
+				instanceId: e.config.id,
+				rect: e.rect,
+				viewport: {
+					...t,
+					chartRect: a,
+					priceRange: {
+						min: r,
+						max: i
+					}
+				}
+			};
+		});
+		return this.panelInfoCache = n, n;
+	}
+	syncRenderContext() {
+		let e = this.getResolvedLayout(), t = this.features.indicators ? this.buildPanelRenderInfos() : [], n = e.panels.filter((e) => e.config.position === "bottom").reduce((e, t) => e + t.rect.height, 0), r = e.mainChartRect.y + e.mainChartRect.height + n;
+		this.engine.setRenderContext({
+			chartRenderer: this.chartRenderer,
+			gridRenderer: this.features.grid ? this.gridRenderer : null,
+			priceAxis: this.features.priceAxis ? this.priceAxis : null,
+			timeAxis: this.features.timeAxis ? this.timeAxis : null,
+			crosshairHandler: this.features.crosshair ? this.crosshairHandler : null,
+			indicatorEngine: this.features.indicators ? this.indicatorEngine : null,
+			drawingRenderer: this.features.drawings ? this.drawingRenderer : null,
+			tradingRenderer: this.features.trading ? this.tradingRenderer : null,
+			currentPriceLine: this.streamManager?.priceLine ?? this.currentPriceLine,
+			chartLegend: this.features.legend ? this.chartLegend : null,
+			volumeRenderer: this.features.volume ? this.volumeRenderer : null,
+			watermark: this.features.watermark ? this.watermark : null,
+			barCountdown: this.barCountdown,
+			sessionBreaks: this.sessionBreaks,
+			compareRenderer: this.compareRenderer,
+			panels: t,
+			priceLimits: this.buildPriceLimits(),
+			timeAxisY: r,
+			viewport: this.viewport.getState(),
+			theme: this.themeManager.getTheme(),
+			data: this.getDisplayData()
+		});
+	}
+	timeframeToMs(e) {
+		let t = e.match(/^(\d+)([smhdwMy])$/);
+		if (!t) return 0;
+		let n = parseInt(t[1], 10);
+		switch (t[2]) {
+			case "s": return n * 1e3;
+			case "m": return n * 6e4;
+			case "h": return n * 36e5;
+			case "d": return n * 864e5;
+			case "w": return n * 6048e5;
+			case "M": return n * 2592e6;
+			default: return 0;
+		}
+	}
+	buildPriceLimits() {
+		if (!this.marketConfig?.priceLimits?.enabled || !this.marketConfig.priceLimits.referencePrice) return null;
+		let e = v(this.marketConfig.priceLimits.referencePrice, this.marketConfig);
+		return e ? {
+			...e,
+			colors: this.marketConfig.colorScheme ? {
+				ceiling: this.marketConfig.colorScheme.ceiling,
+				floor: this.marketConfig.colorScheme.floor,
+				reference: this.marketConfig.colorScheme.reference
+			} : void 0
+		} : null;
+	}
+};
+//#endregion
+export { S as AlertManager, w as Animator, D as BarCountdown, j as BinanceAdapter, pt as Chart, N as ChartLegend, F as ChartStateManager, L as CompareRenderer, B as CrosshairTooltip, he as CurrentPriceLine, e as DARK_THEME, n as DEFAULT_DRAWING_STYLE, _e as DEFAULT_LEGEND_CONFIG, i as DEFAULT_RECONNECT, a as DEFAULT_STREAM_CONFIG, o as DEFAULT_TIMEFRAME_FAVORITES, s as DEFAULT_TRADING_CONFIG, ve as DataExporter, J as DataManager, ye as DrawingBase, Se as Easing, Ee as IndicatorBase, ke as KeyboardHandler, c as LIGHT_THEME, Q as LayoutManager, d as MARKET_CRYPTO, f as MARKET_HNX, ee as MARKET_HOSE, p as MARKET_NYSE, te as MARKET_UPCOM, Me as MockAdapter, $ as PluginManager, Re as ReplayManager, Be as Screenshot, Ve as SessionBreaks, Ue as StreamManager, g as TIMEFRAMES_CRYPTO, ne as TIMEFRAMES_FOREX, re as TIMEFRAMES_STOCK, Y as ThemeManager, Ge as TickAggregator, Ye as UndoRedoManager, ie as VN_COLORS, Qe as VolumeRenderer, et 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 registerLocale, y as setLocale, x as t, it as toHeikinAshi, ot as toKagi, ct as toLineBreak, G as toPointAndFigure, dt as toRenko };
+
+//# sourceMappingURL=index.js.map