@tradecanvas/chart 0.8.1 → 0.9.0

package/dist/{Chart-Cn_TSMO7.js → DragDropImporter-6QOjnfSj.js}

@@ -1,57 +1,57 @@
 import { DARK_THEME as e, DEFAULT_PANEL_HEIGHT as t, LIGHT_THEME as n, LayerType as r, MIN_PANEL_HEIGHT as i, PRICE_AXIS_WIDTH as a, TIME_AXIS_HEIGHT as o, computePriceLimits as s, mergeBar as c, setLocale as l, timeframeToMs as u } from "@tradecanvas/commons";
-import { AlertManager as d, Animator as f, AreaRenderer as p, BarCountdown as m, BarRenderer as ee, BaselineRenderer as h, CandlestickRenderer as g, ChartLegend as te, ChartStateManager as _, CompareRenderer as v, CrosshairHandler as ne, CrosshairTooltip as re, CurrentPriceLine as ie, DataExporter as y, DrawingManager as ae, DrawingRenderer as oe, EquivolumeRenderer as se, EventBus as ce, GridRenderer as le, HLCAreaRenderer as ue, HollowCandleRenderer as de, IndicatorEngine as b, InteractionManager as fe, KagiRenderer as x, KeyboardHandler as S, LineRenderer as C, LineWithMarkersRenderer as w, PanHandler as T, PointAndFigureRenderer as E, PriceAxis as D, RenderEngine as O, RenkoRenderer as k, ReplayManager as A, Screenshot as j, SessionBreaks as M, SignalMarkerManager as N, StepLineRenderer as P, StreamManager as F, TimeAxis as I, TradeZoneManager as L, TradingManager as R, TradingRenderer as z, UndoRedoManager as B, Viewport as V, VolumeCandleRenderer as pe, VolumeRenderer as me, Watermark as he, ZoomHandler as ge, registerBuiltInDrawingTools as _e, registerBuiltInIndicators as H, toHeikinAshi as ve, toKagi as ye, toLineBreak as be, toPointAndFigure as xe, toRangeBars as Se, toRenko as Ce } from "@tradecanvas/core";
+import { AlertManager as d, Animator as f, AreaRenderer as p, AxisDragHandler as m, BarCountdown as ee, BarRenderer as te, BaselineRenderer as ne, CandlestickRenderer as h, ChartLegend as g, ChartStateManager as _, CompareRenderer as re, CrosshairHandler as ie, CrosshairTooltip as ae, CurrentPriceLine as oe, DataExporter as v, DrawingManager as se, DrawingRenderer as ce, EquivolumeRenderer as le, EventBus as ue, GridRenderer as de, HLCAreaRenderer as fe, HollowCandleRenderer as pe, IndicatorEngine as y, InteractionManager as me, KagiRenderer as he, KeyboardHandler as ge, LineRenderer as _e, LineWithMarkersRenderer as ve, MeasureOverlay as ye, PanHandler as be, PinnedTooltip as xe, PointAndFigureRenderer as Se, PriceAxis as Ce, RenderEngine as we, RenkoRenderer as Te, ReplayManager as b, Screenshot as x, SessionBreaks as S, SignalMarkerManager as C, StepLineRenderer as w, StreamManager as T, TimeAxis as E, TradeZoneManager as D, TradingManager as O, TradingRenderer as Ee, UndoRedoManager as De, Viewport as Oe, VolumeCandleRenderer as ke, VolumeProfileRenderer as Ae, VolumeRenderer as je, Watermark as Me, ZoomHandler as Ne, registerBuiltInDrawingTools as Pe, registerBuiltInIndicators as k, toHeikinAshi as Fe, toKagi as Ie, toLineBreak as Le, toPointAndFigure as Re, toRangeBars as ze, toRenko as Be } from "@tradecanvas/core";
 //#region src/charts/ChartTypeStrategy.ts
-function we(e) {
+function Ve(e) {
 	switch (e) {
 		case "candlestick":
 		case "heikinAshi":
 		case "lineBreak":
-		case "rangeBars": return new g();
-		case "line": return new C();
+		case "rangeBars": return new h();
+		case "line": return new _e();
 		case "area": return new p();
-		case "bar": return new ee();
-		case "hollowCandle": return new de();
-		case "baseline": return new h();
-		case "renko": return new k();
-		case "kagi": return new x();
-		case "pointAndFigure": return new E();
-		case "volumeCandles": return new pe();
-		case "equivolume": return new se();
-		case "hlcArea": return new ue();
-		case "stepLine": return new P();
-		case "lineWithMarkers": return new w();
-		default: return new g();
+		case "bar": return new te();
+		case "hollowCandle": return new pe();
+		case "baseline": return new ne();
+		case "renko": return new Te();
+		case "kagi": return new he();
+		case "pointAndFigure": return new Se();
+		case "volumeCandles": return new ke();
+		case "equivolume": return new le();
+		case "hlcArea": return new fe();
+		case "stepLine": return new w();
+		case "lineWithMarkers": return new ve();
+		default: return new h();
 	}
 }
-function Te(e, t) {
+function He(e, t) {
 	if (t.length === 0) return t;
 	switch (e) {
-		case "heikinAshi": return ve(t);
-		case "renko": return Ce(t, {
+		case "heikinAshi": return Fe(t);
+		case "renko": return Be(t, {
 			brickSize: 0,
 			useATR: !0,
 			atrPeriod: 14
 		});
-		case "lineBreak": return be(t, 3);
-		case "kagi": return ye(t, 4);
-		case "pointAndFigure": return xe(t, U(t) * .01, 3);
-		case "rangeBars": return Se(t, { rangeSize: U(t) * .005 });
+		case "lineBreak": return Le(t, 3);
+		case "kagi": return Ie(t, 4);
+		case "pointAndFigure": return Re(t, A(t) * .01, 3);
+		case "rangeBars": return ze(t, { rangeSize: A(t) * .005 });
 		default: return t;
 	}
 }
-function U(e) {
+function A(e) {
 	let t = 0;
 	for (let n of e) t += n.close;
 	return t / e.length;
 }
 //#endregion
 //#region src/charts/IndicatorPriceRange.ts
-var W = {
+var j = {
 	min: 0,
 	max: 100
-}, G = .1;
-function Ee(e, t, n) {
-	if (!e) return { ...W };
+}, M = .1;
+function Ue(e, t, n) {
+	if (!e) return { ...j };
 	let r = Infinity, i = -Infinity, a = 0;
 	for (let [, o] of e.values) {
 		if (a >= t && a <= n) for (let e in o) {
@@ -60,16 +60,16 @@ function Ee(e, t, n) {
 		}
 		a++;
 	}
-	if (r === Infinity) return { ...W };
+	if (r === Infinity) return { ...j };
 	let o = i - r || 1;
 	return {
-		min: r - o * G,
-		max: i + o * G
+		min: r - o * M,
+		max: i + o * M
 	};
 }
 //#endregion
 //#region src/state/AutoSaveScheduler.ts
-var De = class {
+var We = class {
 	timer = null;
 	delayMs = 0;
 	key = null;
@@ -99,12 +99,12 @@ var De = class {
 };
 //#endregion
 //#region src/DataManager.ts
-function K(e) {
+function N(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) {
+function P(e) {
 	return {
 		...e,
 		high: Math.max(e.open, e.high, e.low, e.close),
@@ -112,20 +112,20 @@ function q(e) {
 		volume: e.volume === void 0 ? 0 : Math.max(0, e.volume)
 	};
 }
-var J = class {
+var F = class {
 	data = [];
 	getData() {
 		return this.data;
 	}
 	setData(e) {
-		this.data = e.filter(K).map(q);
+		this.data = e.filter(N).map(P);
 	}
 	appendBar(e) {
-		K(e) && this.data.push(q(e));
+		N(e) && this.data.push(P(e));
 	}
 	updateLastBar(e) {
-		if (!K(e)) return;
-		let t = q(e);
+		if (!N(e)) return;
+		let t = P(e);
 		if (this.data.length === 0) {
 			this.data.push(t);
 			return;
@@ -141,7 +141,7 @@ var J = class {
 	clear() {
 		this.data = [];
 	}
-}, Y = class {
+}, I = class {
 	theme;
 	constructor(t) {
 		!t || t === "dark" ? this.theme = { ...e } : t === "light" ? this.theme = { ...n } : this.theme = { ...t };
@@ -152,7 +152,7 @@ var J = class {
 	setTheme(t) {
 		t === "dark" ? this.theme = { ...e } : t === "light" ? this.theme = { ...n } : this.theme = { ...t };
 	}
-}, X = 200, Z = 80, Q = class {
+}, L = 200, R = 80, z = class {
 	panels = [];
 	containerWidth = 0;
 	containerHeight = 0;
@@ -164,8 +164,8 @@ var J = class {
 		this.panels.push({
 			id: e,
 			position: n,
-			size: r ?? (a ? X : t),
-			minSize: a ? Z : i,
+			size: r ?? (a ? L : t),
+			minSize: a ? R : i,
 			content: {
 				type: "indicator",
 				indicatorInstanceId: e
@@ -179,7 +179,7 @@ var J = class {
 		let r = this.panels.find((t) => t.id === e);
 		if (r) {
 			let e = r.position === "left" || r.position === "right", a = n === "left" || n === "right";
-			r.position = n, e !== a && (r.size = a ? X : t, r.minSize = a ? Z : i);
+			r.position = n, e !== a && (r.size = a ? L : t, r.minSize = a ? R : i);
 		}
 	}
 	setPanelSize(e, t) {
@@ -280,14 +280,14 @@ var J = class {
 	getMainChartRect() {
 		return this.resolve().mainChartRect;
 	}
-}, $ = class {
+}, B = class {
 	constructor(e) {
 		this.indicatorEngine = e;
 	}
 	registerIndicator(e) {
 		this.indicatorEngine.register(e);
 	}
-}, Oe = class {
+}, Ge = class {
 	static version = "0.7.0";
 	engine;
 	viewport;
@@ -316,14 +316,17 @@ var J = class {
 	compareRenderer;
 	countdownInterval = null;
 	volumeRenderer;
+	volumeProfile;
 	alertManager;
 	signalMarkerManager;
 	tradeZoneManager;
+	measureOverlay;
 	replayManager;
 	undoRedoManager;
-	autoSaveScheduler = new De((e) => this.saveState(e));
+	autoSaveScheduler = new We((e) => this.saveState(e));
 	animator;
 	crosshairTooltip;
+	pinnedTooltip;
 	interactionManager;
 	crosshairHandler;
 	chartRenderer;
@@ -372,36 +375,36 @@ var J = 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 J(), this.themeManager = new Y(t.theme), this.layoutManager = new Q(), this.indicatorEngine = new b(), this.pluginManager = new $(this.indicatorEngine), this.eventBus = new ce(), H(this.indicatorEngine), this.drawingManager = new ae(), _e(this.drawingManager), this.drawingRenderer = new oe(this.drawingManager), this.drawingManager.setRequestRender(() => {
+		}, e.style.position = "relative", e.style.overflow = "hidden", e.tabIndex = 0, e.style.outline = "none", this.dataManager = new F(), this.themeManager = new I(t.theme), this.layoutManager = new z(), this.indicatorEngine = new y(), this.pluginManager = new B(this.indicatorEngine), this.eventBus = new ue(), k(this.indicatorEngine), this.drawingManager = new se(), Pe(this.drawingManager), this.drawingRenderer = new ce(this.drawingManager), this.drawingManager.setRequestRender(() => {
 			this.syncRenderContext(), this.engine.requestRender(r.Overlay), this.scheduleAutoSave();
 		}), this.drawingManager.setEventCallback((e, t) => {
 			this.eventBus.emit(e, t);
-		}), this.undoRedoManager = new B(), 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 R({
+		}), this.undoRedoManager = new De(), 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 O({
 			enabled: this.features.trading,
 			contextMenu: { enabled: this.features.tradingContextMenu }
-		}), this.tradingRenderer = new z(this.tradingManager), this.tradingManager.setContainer(e), this.tradingManager.setRequestRender(() => this.engine.requestRender(r.Overlay)), this.tradingManager.setEventCallback((e, t) => {
+		}), this.tradingRenderer = new Ee(this.tradingManager), this.tradingManager.setContainer(e), this.tradingManager.setRequestRender(() => this.engine.requestRender(r.Overlay)), this.tradingManager.setEventCallback((e, t) => {
 			this.eventBus.emit(e, t);
-		}), this.engine = new O(e);
+		}), this.engine = new we(e);
 		let i = this.engine.dprManager.getContainerSize();
-		this.viewport = new V(i.width, i.height, t.minBarSpacing ?? 2, t.maxBarSpacing ?? 30, t.rightMargin ?? 5), this.layoutManager.resize(i.width, i.height), this.engine.onContainerResize = (e) => {
+		if (this.viewport = new Oe(i.width, i.height, t.minBarSpacing ?? 2, t.maxBarSpacing ?? 30, t.rightMargin ?? 5), this.layoutManager.resize(i.width, i.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 le(), t.grid?.visible === !1 && this.gridRenderer.setVisible(!1), this.priceAxis = new D(), this.priceAxis.setLocale(this.numberLocale), this.timeAxis = new I(), this.crosshairHandler = new ne(), 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 de(), t.grid?.visible === !1 && this.gridRenderer.setVisible(!1), this.priceAxis = new Ce(), this.priceAxis.setLocale(this.numberLocale), this.timeAxis = new E(), this.crosshairHandler = new ie(), 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", {
+				this.chartLegend.setHoverBar(r ?? null), r && this.crosshairTooltip.show(t, r, this.themeManager.getTheme(), this.cachedContainerSize()), this.pinnedTooltip.isPinned() && this.pinnedTooltip.reposition(this.viewport.getState(), r ?? null, e, this.themeManager.getTheme()), this.eventBus.emit("crosshairMove", {
 					point: t,
 					bar: r,
 					barIndex: e
 				});
 			} else this.crosshairTooltip.hide(), this.chartLegend.setHoverBar(null);
-		}), this.chartLegend = new te(), this.chartLegend.setChartType(t.chartType), this.watermark = new he(), t.watermark && this.watermark.setConfig(t.watermark), this.volumeRenderer = new me(), this.barCountdown = new m(), this.sessionBreaks = new M(), this.compareRenderer = new v(), t.sessionBreaks ? this.sessionBreaks.setConfig({
+		}), this.chartLegend = new g(), this.chartLegend.setChartType(t.chartType), this.watermark = new Me(), t.watermark && this.watermark.setConfig(t.watermark), this.volumeRenderer = new je(), this.volumeProfile = new Ae(), this.barCountdown = new ee(), this.sessionBreaks = new S(), this.compareRenderer = new re(), 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 f(), this.crosshairTooltip = new re(), this.crosshairTooltip.create(e), this.keyboardHandler = new S({
+		}) : t.features?.sessionBreaks !== !1 && this.sessionBreaks.setVisible(!0), t.logScale && this.viewport.setLogScale(!0), this.animator = new f(), this.crosshairTooltip = new ae(), this.crosshairTooltip.create(e), this.pinnedTooltip = new xe(), this.pinnedTooltip.create(e), this.keyboardHandler = new ge({
 			scrollBars: (e) => {
 				let t = this.viewport.getState().barWidth + this.viewport.getState().barSpacing;
 				this.viewport.scrollBy(e * t), this.updateViewportAndRender();
@@ -421,14 +424,14 @@ var J = 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 ie(), this.alertManager = new d(), this.alertManager.setRequestRender(() => this.engine.requestRender(r.Overlay)), this.alertManager.on("triggered", (e) => {
+		}, window.addEventListener("keydown", this.onWindowKeyDown), this.currentPriceLine = new oe(), this.alertManager = new d(), this.alertManager.setRequestRender(() => this.engine.requestRender(r.Overlay)), this.alertManager.on("triggered", (e) => {
 			this.eventBus.emit("dataUpdate", {
 				alert: "triggered",
 				alertId: e.id,
 				price: e.price,
 				message: e.message
 			});
-		}), this.signalMarkerManager = new N(), this.signalMarkerManager.setRequestRender(() => this.engine.requestRender(r.Overlay)), this.signalMarkerManager.setDataGetter(() => this.dataManager.getData()), this.signalMarkerManager.on("added", (e) => {
+		}), this.signalMarkerManager = new C(), this.signalMarkerManager.setRequestRender(() => this.engine.requestRender(r.Overlay)), this.signalMarkerManager.setDataGetter(() => this.dataManager.getData()), this.signalMarkerManager.on("added", (e) => {
 			this.eventBus.emit("signalMarkerAdd", {
 				id: e.id,
 				source: e.source,
@@ -436,25 +439,54 @@ var J = class {
 			});
 		}), this.signalMarkerManager.on("removed", (e) => {
 			this.eventBus.emit("signalMarkerRemove", { id: e });
-		}), this.tradeZoneManager = new L(), this.tradeZoneManager.setRequestRender(() => this.engine.requestRender(r.Overlay)), this.tradeZoneManager.setDataGetter(() => this.dataManager.getData()), this.tradeZoneManager.on("added", (e) => {
+		}), this.tradeZoneManager = new D(), this.tradeZoneManager.setRequestRender(() => this.engine.requestRender(r.Overlay)), this.tradeZoneManager.setDataGetter(() => this.dataManager.getData()), this.tradeZoneManager.on("added", (e) => {
 			this.eventBus.emit("tradeZoneAdd", {
 				id: e.id,
 				direction: e.direction
 			});
 		}), this.tradeZoneManager.on("removed", (e) => {
 			this.eventBus.emit("tradeZoneRemove", { id: e });
-		}), this.replayManager = new A(), this.interactionManager = new fe(e), this.features.panning && this.interactionManager.setPanHandler(new T((e) => {
+		}), this.replayManager = new b(), this.measureOverlay = new ye(), this.interactionManager = new me(e), this.features.panning && this.interactionManager.setPanHandler(new be((e) => {
 			this.viewport.scrollBy(e), this.updateViewportAndRender();
-		})), this.features.zooming && this.interactionManager.setZoomHandler(new ge((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.features.zooming) {
+			this.interactionManager.setZoomHandler(new Ne((e, t) => {
+				this.viewport.zoom(e, t), this.updateViewportAndRender();
+			}));
+			let e = new m((e) => {
+				this.options.autoScale = !1, this.viewport.scalePriceRange(e), this.syncRenderContext(), this.engine.requestRender();
+			}, (e) => {
+				let t = this.viewport.getState().chartRect.width;
+				this.viewport.zoom(1 / e - 1, t / 2), this.updateViewportAndRender();
+			});
+			this.interactionManager.setAxisDragHandler(e, () => this.viewport.getState(), (e) => {
+				e === "price" ? (this.options.autoScale = !0, this.updateViewportAndRender()) : this.fitContent();
+			});
+		}
+		this.features.crosshair && this.interactionManager.setCrosshairHandler(this.crosshairHandler), this.features.drawings && this.interactionManager.setDrawingManager(this.drawingManager, () => ({
 			...this.viewport.getState(),
 			data: this.getDisplayData()
 		})), this.features.trading && this.interactionManager.setTradingManager(this.tradingManager, () => ({
 			...this.viewport.getState(),
 			data: this.getDisplayData()
-		})), this.interactionManager.setOverlayDirtyCallback(() => {
-			this.engine.requestRender(r.Overlay), this.layoutManager.getPanels().length > 0 && this.engine.requestRender(r.UI);
+		})), this.interactionManager.setAltClickHandler((e) => {
+			let t = this.getDisplayData();
+			if (t.length === 0) return;
+			let n = this.viewport.getState(), i = n.barWidth + n.barSpacing, a = Math.round((n.offset + e.x) / i);
+			a < 0 || a >= t.length || (this.pinnedTooltip.isPinned() && this.pinnedTooltip.getPinnedIndex() === a ? this.pinnedTooltip.unpin() : this.pinnedTooltip.pin(t[a], a, this.themeManager.getTheme()), this.pinnedTooltip.reposition(this.viewport.getState(), this.dataManager.getData()[a] ?? null, a, this.themeManager.getTheme()), this.engine.requestRender(r.Overlay));
+		}), this.interactionManager.setEscapeHandler(() => {
+			this.pinnedTooltip.isPinned() && (this.pinnedTooltip.unpin(), this.engine.requestRender(r.Overlay));
+		}), this.interactionManager.setMeasureHandlers({
+			begin: (e) => {
+				this.measureOverlay.begin(e, this.viewport.getState(), this.getDisplayData());
+			},
+			move: (e) => {
+				this.measureOverlay.update(e, this.viewport.getState(), this.getDisplayData());
+			},
+			end: () => {
+				this.measureOverlay.end();
+			}
+		}), this.interactionManager.setOverlayDirtyCallback(() => {
+			this.engine.requestRender(r.Overlay), this.engine.requestRender(r.UI);
 		}), this.interactionManager.attach(), this.syncRenderContext(), this.engine.start();
 	}
 	setData(e) {
@@ -500,8 +532,8 @@ var J = class {
 		this.pluginManager.registerIndicator(e);
 	}
 	static indicators() {
-		let e = new b();
-		return H(e), e.getAvailableIndicators();
+		let e = new y();
+		return k(e), e.getAvailableIndicators();
 	}
 	setPanelPosition(e, t) {
 		this.layoutManager.setPanelPosition(e, t), this.engine.requestRender();
@@ -567,21 +599,21 @@ var J = class {
 	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 = y.toJSON(o);
-			y.download(e, t ?? "chart-data.json", "application/json");
+			let e = v.toJSON(o);
+			v.download(e, t ?? "chart-data.json", "application/json");
 		} else {
-			let e = y.toCSV(o);
-			y.download(e, t ?? "chart-data.csv", "text/csv");
+			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 = y.toJSON(n);
-			y.download(e, t ?? "chart-data.json", "application/json");
+			let e = v.toJSON(n);
+			v.download(e, t ?? "chart-data.json", "application/json");
 		} else {
-			let e = y.toCSV(n);
-			y.download(e, t ?? "chart-data.csv", "text/csv");
+			let e = v.toCSV(n);
+			v.download(e, t ?? "chart-data.csv", "text/csv");
 		}
 	}
 	setAutoSave(e, t = 5e3) {
@@ -632,7 +664,7 @@ var J = class {
 		this.features.trading && this.tradingManager.setConfig(e);
 	}
 	async connect(e) {
-		this.disconnectStream(), this.streamManager = new F(), this.streamManager.on("snapshot", (e) => {
+		this.disconnectStream(), this.streamManager = new T(), 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();
@@ -799,6 +831,15 @@ var J = class {
 	setVolumeVisible(e) {
 		this.volumeRenderer.setVisible(e), this.engine.requestRender(r.Main);
 	}
+	setVolumeProfileVisible(e) {
+		this.volumeProfile.setVisible(e), this.engine.requestRender(r.Main);
+	}
+	isVolumeProfileVisible() {
+		return this.volumeProfile.isVisible();
+	}
+	setVolumeProfileConfig(e) {
+		e.buckets !== void 0 && this.volumeProfile.setBuckets(e.buckets), e.widthRatio !== void 0 && this.volumeProfile.setWidthRatio(e.widthRatio), e.opacity !== void 0 && this.volumeProfile.setOpacity(e.opacity), e.highlightPoC !== void 0 && this.volumeProfile.setHighlightPoC(e.highlightPoC), this.engine.requestRender(r.Main);
+	}
 	setTooltipVisible(e) {
 		e || this.crosshairTooltip.hide();
 	}
@@ -812,13 +853,13 @@ var J = class {
 		this.chartLegend.setStatusText(e), this.engine.requestRender(r.UI);
 	}
 	screenshot(e) {
-		this.features.screenshot && j.download(this.container, e, this.themeManager.getTheme().background);
+		this.features.screenshot && x.download(this.container, e, this.themeManager.getTheme().background);
 	}
 	screenshotDataURL() {
-		return this.features.screenshot ? j.toDataURL(this.container, this.themeManager.getTheme().background) : null;
+		return this.features.screenshot ? x.toDataURL(this.container, this.themeManager.getTheme().background) : null;
 	}
 	async screenshotBlob() {
-		return this.features.screenshot ? j.toBlob(this.container, this.themeManager.getTheme().background) : null;
+		return this.features.screenshot ? x.toBlob(this.container, this.themeManager.getTheme().background) : null;
 	}
 	addAlert(e, t = "crossing", n) {
 		if (!this.features.alerts) return null;
@@ -993,16 +1034,16 @@ var J = class {
 		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.onWindowKeyDown &&= (window.removeEventListener("keydown", this.onWindowKeyDown), null), this.keyboardHandler = null, 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 = "";
+		this.countdownInterval && clearInterval(this.countdownInterval), this.disableAutoSave(), this.disconnectStream(), this.onWindowKeyDown &&= (window.removeEventListener("keydown", this.onWindowKeyDown), null), this.keyboardHandler = null, this.interactionManager.detach(), this.tradingManager.destroy(), this.animator.dispose(), this.crosshairTooltip.destroy(), this.pinnedTooltip.destroy(), this.replayManager.dispose(), this.undoRedoManager.clear(), this.engine.destroy(), this.eventBus.destroy(), this.container.innerHTML = "";
 	}
 	createChartRenderer(e) {
-		return we(e);
+		return Ve(e);
 	}
 	getDisplayData() {
 		if (this.displayDataCache) return this.displayDataCache;
 		let e = this.dataManager.getData();
 		if (e.length === 0) return e;
-		let t = Te(this.options.chartType, e);
+		let t = He(this.options.chartType, e);
 		return this.displayDataCache = t, t;
 	}
 	scheduleRender() {
@@ -1039,7 +1080,7 @@ var J = class {
 	buildPanelRenderInfos() {
 		if (this.panelInfoCache) return this.panelInfoCache;
 		let e = this.getResolvedLayout(), t = this.viewport.getState(), { from: n, to: r } = t.visibleRange, i = e.panels.map((e) => {
-			let i = Ee(this.indicatorEngine.getOutput(e.config.id), n, r), a = {
+			let i = Ue(this.indicatorEngine.getOutput(e.config.id), n, r), a = {
 				x: e.rect.x,
 				y: e.rect.y + 20,
 				width: e.rect.width,
@@ -1058,6 +1099,7 @@ var J = class {
 		return this.panelInfoCache = i, i;
 	}
 	syncRenderContext() {
+		this.pinnedTooltip.isPinned() && this.pinnedTooltip.reposition(this.viewport.getState(), null, null, this.themeManager.getTheme());
 		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, i = this.getDisplayData();
 		this.engine.setRenderContext({
 			chartRenderer: this.chartRenderer,
@@ -1071,11 +1113,13 @@ var J = class {
 			currentPriceLine: this.streamManager?.priceLine ?? this.currentPriceLine,
 			chartLegend: this.features.legend ? this.chartLegend : null,
 			volumeRenderer: this.features.volume ? this.volumeRenderer : null,
+			volumeProfile: this.volumeProfile,
 			watermark: this.features.watermark ? this.watermark : null,
 			barCountdown: this.barCountdown,
 			sessionBreaks: this.sessionBreaks,
 			compareRenderer: this.compareRenderer,
 			alertManager: this.features.alerts ? this.alertManager : null,
+			measureOverlay: this.measureOverlay,
 			signalMarkerManager: this.signalMarkerManager,
 			tradeZoneManager: this.tradeZoneManager,
 			panels: t,
@@ -1102,8 +1146,240 @@ var J = class {
 			} : void 0
 		} : null;
 	}
+}, V = [
+	"time",
+	"timestamp",
+	"date",
+	"datetime",
+	"t"
+], H = ["open", "o"], U = ["high", "h"], W = ["low", "l"], G = ["close", "c"], K = [
+	"volume",
+	"vol",
+	"v"
+];
+function q(e) {
+	let t = e.trim();
+	return t ? t[0] === "[" || t[0] === "{" ? Ke(t) : qe(t) : {
+		data: [],
+		rowCount: 0,
+		skipped: 0
+	};
+}
+function Ke(e) {
+	let t;
+	try {
+		t = JSON.parse(e);
+	} catch (e) {
+		throw Error(`Invalid JSON: ${e.message}`);
+	}
+	if (!Array.isArray(t)) throw Error("Expected a JSON array of OHLCV rows");
+	let n = [], r = 0;
+	for (let e of t) {
+		let t = Array.isArray(e) ? Xe(e) : Ye(e);
+		t ? n.push(t) : r++;
+	}
+	return Q(n, t.length, r);
+}
+function qe(e) {
+	let t = e.split(/\r?\n/).filter((e) => e.trim().length > 0);
+	if (t.length === 0) return {
+		data: [],
+		rowCount: 0,
+		skipped: 0
+	};
+	let n = Je(t[0]), r = J(t[0], n).map((e) => e.trim().toLowerCase()), i = r.some((e) => isNaN(Number(e)) && e.length > 0), a = i ? Y(r) : {
+		time: 0,
+		open: 1,
+		high: 2,
+		low: 3,
+		close: 4,
+		volume: 5
+	};
+	if (a.time < 0 || a.open < 0 || a.high < 0 || a.low < 0 || a.close < 0) throw Error("CSV is missing required column(s): time, open, high, low, close");
+	let o = [], s = 0;
+	for (let e = +!!i; e < t.length; e++) {
+		let r = J(t[e], n), i = Z(r[a.time]), c = X(r[a.open]), l = X(r[a.high]), u = X(r[a.low]), d = X(r[a.close]), f = a.volume >= 0 ? Number(r[a.volume]) : 0;
+		if (i === null || ![
+			c,
+			l,
+			u,
+			d
+		].every(Number.isFinite)) {
+			s++;
+			continue;
+		}
+		o.push({
+			time: i,
+			open: c,
+			high: l,
+			low: u,
+			close: d,
+			volume: Number.isFinite(f) ? f : 0
+		});
+	}
+	return Q(o, t.length - +!!i, s);
+}
+function Je(e) {
+	let t = {
+		",": 0,
+		";": 0,
+		"	": 0,
+		"|": 0
+	};
+	for (let n of e) n in t && t[n]++;
+	let n = ",", r = 0;
+	for (let [e, i] of Object.entries(t)) i > r && (n = e, r = i);
+	return n;
+}
+function J(e, t) {
+	let n = [], r = "", i = !1;
+	for (let a = 0; a < e.length; a++) {
+		let o = e[a];
+		o === "\"" ? i && e[a + 1] === "\"" ? (r += "\"", a++) : i = !i : o === t && !i ? (n.push(r), r = "") : r += o;
+	}
+	return n.push(r), n;
+}
+function Y(e) {
+	let t = (t) => e.findIndex((e) => t.includes(e));
+	return {
+		time: t(V),
+		open: t(H),
+		high: t(U),
+		low: t(W),
+		close: t(G),
+		volume: t(K)
+	};
+}
+function Ye(e) {
+	let t = (t) => {
+		for (let n of t) {
+			if (e[n] !== void 0) return e[n];
+			let t = n.toUpperCase();
+			if (e[t] !== void 0) return e[t];
+		}
+	}, n = Z(String(t(V) ?? "")), r = Number(t(H)), i = Number(t(U)), a = Number(t(W)), o = Number(t(G)), s = Number(t(K) ?? 0);
+	return n === null || ![
+		r,
+		i,
+		a,
+		o
+	].every(Number.isFinite) ? null : {
+		time: n,
+		open: r,
+		high: i,
+		low: a,
+		close: o,
+		volume: Number.isFinite(s) ? s : 0
+	};
+}
+function Xe(e) {
+	if (e.length < 5) return null;
+	let t = Z(String(e[0])), n = Number(e[1]), r = Number(e[2]), i = Number(e[3]), a = Number(e[4]), o = e.length >= 6 ? Number(e[5]) : 0;
+	return t === null || ![
+		n,
+		r,
+		i,
+		a
+	].every(Number.isFinite) ? null : {
+		time: t,
+		open: n,
+		high: r,
+		low: i,
+		close: a,
+		volume: Number.isFinite(o) ? o : 0
+	};
+}
+function X(e) {
+	return e === void 0 || e.trim() === "" ? NaN : Number(e);
+}
+function Z(e) {
+	let t = e.trim();
+	if (!t) return null;
+	let n = Number(t);
+	if (Number.isFinite(n) && n > 0) return n < 0xe8d4a51000 ? n * 1e3 : n;
+	let r = Date.parse(t);
+	return Number.isFinite(r) ? r : null;
+}
+function Q(e, t, n) {
+	e.sort((e, t) => e.time - t.time);
+	let r = [];
+	for (let t of e) r.length > 0 && r[r.length - 1].time === t.time ? r[r.length - 1] = t : r.push(t);
+	return {
+		data: r,
+		rowCount: t,
+		skipped: n
+	};
+}
+//#endregion
+//#region src/io/DragDropImporter.ts
+var Ze = class {
+	host;
+	overlay = null;
+	callbacks;
+	bound;
+	depth = 0;
+	constructor(e, t) {
+		this.host = e, this.callbacks = t, this.bound = {
+			dragenter: (e) => this.onDragEnter(e),
+			dragover: (e) => this.onDragOver(e),
+			dragleave: (e) => this.onDragLeave(e),
+			drop: (e) => this.onDrop(e)
+		};
+	}
+	attach() {
+		this.host.addEventListener("dragenter", this.bound.dragenter), this.host.addEventListener("dragover", this.bound.dragover), this.host.addEventListener("dragleave", this.bound.dragleave), this.host.addEventListener("drop", this.bound.drop);
+	}
+	detach() {
+		this.host.removeEventListener("dragenter", this.bound.dragenter), this.host.removeEventListener("dragover", this.bound.dragover), this.host.removeEventListener("dragleave", this.bound.dragleave), this.host.removeEventListener("drop", this.bound.drop), this.hideOverlay();
+	}
+	onDragEnter(e) {
+		$(e) && (e.preventDefault(), this.depth++, this.showOverlay());
+	}
+	onDragOver(e) {
+		$(e) && (e.preventDefault(), e.dataTransfer && (e.dataTransfer.dropEffect = "copy"));
+	}
+	onDragLeave(e) {
+		$(e) && (this.depth = Math.max(0, this.depth - 1), this.depth === 0 && this.hideOverlay());
+	}
+	async onDrop(e) {
+		e.preventDefault(), this.depth = 0, this.hideOverlay();
+		let t = e.dataTransfer?.files?.[0];
+		if (t) try {
+			let e = q(await t.text());
+			if (e.data.length === 0) throw Error(`No valid OHLCV rows found in "${t.name}"`);
+			this.callbacks.onData(e.data, e, t);
+		} catch (e) {
+			this.callbacks.onError?.(e, t);
+		}
+	}
+	showOverlay() {
+		this.overlay || (this.overlay = document.createElement("div"), Object.assign(this.overlay.style, {
+			position: "absolute",
+			inset: "8px",
+			zIndex: "90",
+			pointerEvents: "none",
+			borderRadius: "10px",
+			border: "2px dashed var(--tcw-accent, #4f88ff)",
+			background: "rgba(79, 136, 255, 0.06)",
+			display: "flex",
+			alignItems: "center",
+			justifyContent: "center",
+			color: "var(--tcw-accent, #4f88ff)",
+			fontSize: "14px",
+			fontWeight: "600",
+			letterSpacing: "-0.005em",
+			fontFamily: "inherit",
+			backdropFilter: "blur(2px)"
+		}), this.overlay.textContent = "Drop CSV or JSON to load chart data", getComputedStyle(this.host).position === "static" && (this.host.style.position = "relative"), this.host.appendChild(this.overlay));
+	}
+	hideOverlay() {
+		this.overlay?.remove(), this.overlay = null;
+	}
 };
+function $(e) {
+	return e.dataTransfer?.types?.includes("Files") ?? !1;
+}
 //#endregion
-export { J as a, Y as i, $ as n, Q as r, Oe as t };
+export { z as a, B as i, q as n, I as o, Ge as r, F as s, Ze as t };
 
-//# sourceMappingURL=Chart-Cn_TSMO7.js.map
+//# sourceMappingURL=DragDropImporter-6QOjnfSj.js.map