@363045841yyt/klinechart 0.5.0 → 0.5.1

package/dist/index.js

@@ -8891,6 +8891,14 @@ var Ls = class {
 	hoveredSeparatorUpperPaneId = null;
 	hoveredRightAxisPaneId = null;
 	isTouchSession = !1;
+	activePointers = /* @__PURE__ */ new Map();
+	lastPinchDistance = 0;
+	pinchCenter = {
+		x: 0,
+		y: 0
+	};
+	isPinching = !1;
+	onPinchZoomCallback;
 	crosshairPos = null;
 	crosshairIndex = null;
 	crosshairPrice = null;
@@ -8922,6 +8930,9 @@ var Ls = class {
 	constructor(e) {
 		this.chart = e;
 	}
+	setOnPinchZoom(e) {
+		this.onPinchZoomCallback = e;
+	}
 	getInteractionSnapshot() {
 		return {
 			crosshairPos: this.crosshairPos ? { ...this.crosshairPos } : null,
@@ -8947,8 +8958,19 @@ var Ls = class {
 		this.onInteractionChangeCallback?.(this.getInteractionSnapshot());
 	}
 	onPointerDown(e) {
-		if (e.isPrimary === !1) return;
-		this.isTouchSession = e.pointerType === "touch";
+		if (this.isTouchSession = e.pointerType === "touch", this.activePointers.set(e.pointerId, {
+			x: e.clientX,
+			y: e.clientY
+		}), this.activePointers.size === 2 && this.isTouchSession) {
+			this.isPinching = !0, this.isDragging = !1, this.dragMode = "none";
+			let e = Array.from(this.activePointers.values()), t = e[0], n = e[1];
+			this.lastPinchDistance = Math.hypot(n.x - t.x, n.y - t.y), this.pinchCenter = {
+				x: (t.x + n.x) / 2,
+				y: (t.y + n.y) / 2
+			};
+			return;
+		}
+		if (e.isPrimary === !1 || this.isPinching || this.activePointers.size > 1) return;
 		let t = this.getPlotPointerLocation(e.clientX, e.clientY);
 		if (!t) return;
 		let n = this.chart.getDom().container, { mouseX: r, mouseY: i } = t, a = n.scrollLeft, o = this.chart.getMarkerManager(), s = a + r, c = o.hitTest(s, i, 3);
@@ -8971,15 +8993,26 @@ var Ls = class {
 		this.useTooltipAnchorPositioning = e;
 	}
 	onPointerUp(e) {
-		e.isPrimary !== !1 && (this.isDragging = !1, this.dragMode = "none", this.activePaneIdOnDrag = null, this.activeSeparatorUpperPaneId = null, this.notifyInteractionChange());
+		this.activePointers.delete(e.pointerId), this.isPinching && this.activePointers.size < 2 && (this.isPinching = !1, this.lastPinchDistance = 0), e.isPrimary !== !1 && (this.isDragging = !1, this.dragMode = "none", this.activePaneIdOnDrag = null, this.activeSeparatorUpperPaneId = null, this.notifyInteractionChange());
 	}
 	onPointerLeave(e) {
-		e.isPrimary !== !1 && (this.isDragging = !1, this.dragMode = "none", this.activePaneIdOnDrag = null, this.clearSeparatorState(), this.isTouchSession = !1, this.clearHover(), this.chart.scheduleDraw(), this.notifyInteractionChange());
+		this.activePointers.delete(e.pointerId), this.activePointers.size < 2 && (this.isPinching = !1, this.lastPinchDistance = 0), e.isPrimary !== !1 && (this.isDragging = !1, this.dragMode = "none", this.activePaneIdOnDrag = null, this.clearSeparatorState(), this.isTouchSession = !1, this.clearHover(), this.chart.scheduleDraw(), this.notifyInteractionChange());
 	}
 	onScroll() {
 		this.kLinePositions = null, this.visibleRange = null, this.clearHover(), this.chart.scheduleDraw(), this.notifyInteractionChange();
 	}
 	onPointerMove(e) {
+		if (this.activePointers.has(e.pointerId) && this.activePointers.set(e.pointerId, {
+			x: e.clientX,
+			y: e.clientY
+		}), this.isPinching && this.activePointers.size === 2) {
+			let e = Array.from(this.activePointers.values()), t = e[0], n = e[1], r = Math.hypot(n.x - t.x, n.y - t.y), i = r - this.lastPinchDistance;
+			if (Math.abs(i) > 10) {
+				let e = i > 0 ? 1 : -1, a = (t.x + n.x) / 2;
+				this.onPinchZoomCallback?.(e, a), this.lastPinchDistance = r;
+			}
+			return;
+		}
 		if (!e.isPrimary) return;
 		e.pointerType === "touch" && (this.isTouchSession = !0);
 		let t = this.chart.getDom().container;
@@ -9172,7 +9205,7 @@ var Ls = class {
 		};
 	}
 	reset() {
-		this.isDragging = !1, this.dragMode = "none", this.dragStartX = 0, this.dragStartY = 0, this.scrollStartX = 0, this.activePaneIdOnDrag = null, this.clearSeparatorState(), this.isTouchSession = !1, this.crosshairPos = null, this.crosshairIndex = null, this.crosshairPrice = null, this.hoveredIndex = null, this.activePaneId = null, this.hoveredMarkerId = null, this.clickedMarkerId = null, this.hoveredMarkerData = null, this.clickedMarkerData = null, this.hoveredCustomMarker = null, this.kLinePositions = null, this.visibleRange = null, this.kWidthPx = null;
+		this.isDragging = !1, this.dragMode = "none", this.dragStartX = 0, this.dragStartY = 0, this.scrollStartX = 0, this.activePaneIdOnDrag = null, this.clearSeparatorState(), this.isTouchSession = !1, this.activePointers.clear(), this.isPinching = !1, this.lastPinchDistance = 0, this.crosshairPos = null, this.crosshairIndex = null, this.crosshairPrice = null, this.hoveredIndex = null, this.activePaneId = null, this.hoveredMarkerId = null, this.clickedMarkerId = null, this.hoveredMarkerData = null, this.clickedMarkerData = null, this.hoveredCustomMarker = null, this.kLinePositions = null, this.visibleRange = null, this.kWidthPx = null;
 	}
 	getCrosshairIndex() {
 		return this.crosshairIndex;
@@ -13290,20 +13323,61 @@ var Tu = d({
 	name: "tabler-minimize",
 	render: wu
 }), Eu = {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em"
+};
+function Du(e, t) {
+	return _(), o("svg", Eu, [...t[0] ||= [s("path", {
+		fill: "none",
+		stroke: "currentColor",
+		"stroke-linecap": "round",
+		"stroke-linejoin": "round",
+		"stroke-width": "2",
+		d: "M3 10a7 7 0 1 0 14 0a7 7 0 1 0-14 0m4 0h6m-3-3v6m11 8l-6-6"
+	}, null, -1)]]);
+}
+var Ou = d({
+	name: "tabler-zoom-in",
+	render: Du
+}), ku = {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em"
+};
+function Au(e, t) {
+	return _(), o("svg", ku, [...t[0] ||= [s("path", {
+		fill: "none",
+		stroke: "currentColor",
+		"stroke-linecap": "round",
+		"stroke-linejoin": "round",
+		"stroke-width": "2",
+		d: "M3 10a7 7 0 1 0 14 0a7 7 0 1 0-14 0m4 0h6m8 11l-6-6"
+	}, null, -1)]]);
+}
+var ju = d({
+	name: "tabler-zoom-out",
+	render: Au
+}), Mu = {
 	class: "left-toolbar",
 	"aria-label": "图表工具栏"
-}, Du = { class: "left-toolbar__group" }, Ou = [
+}, Nu = { class: "left-toolbar__group" }, Pu = [
 	"title",
 	"aria-label",
 	"onClick"
-], ku = ["onClick"], Au = [
+], Fu = ["onClick"], Iu = [
 	"title",
 	"aria-label",
 	"onClick"
-], ju = { class: "left-toolbar__group" }, Mu = ["title", "aria-label"], Nu = /* @__PURE__ */ Oo(/* @__PURE__ */ u({
+], Lu = { class: "left-toolbar__group" }, Ru = { class: "left-toolbar__group" }, zu = ["title", "aria-label"], Bu = /* @__PURE__ */ Oo(/* @__PURE__ */ u({
 	__name: "LeftToolbar",
 	props: { isFullscreen: { type: Boolean } },
-	emits: ["selectTool", "toggleFullscreen"],
+	emits: [
+		"selectTool",
+		"toggleFullscreen",
+		"zoomIn",
+		"zoomOut"
+	],
 	setup(t, { emit: r }) {
 		let c = r, u = [{
 			id: "cursor",
@@ -13378,8 +13452,8 @@ var Tu = d({
 			document.addEventListener("click", T, !0);
 		}), g(() => {
 			document.removeEventListener("click", T, !0);
-		}), (r, c) => (_(), o("nav", Eu, [
-			s("div", Du, [(_(), o(e, null, b(u, (t) => s("div", {
+		}), (r, c) => (_(), o("nav", Mu, [
+			s("div", Nu, [(_(), o(e, null, b(u, (t) => s("div", {
 				key: t.id,
 				class: "tool-item"
 			}, [s("button", {
@@ -13399,7 +13473,7 @@ var Tu = d({
 				class: p(["corner-indicator", { open: f.value === t.id }]),
 				onClick: D((e) => C(t.id), ["stop"]),
 				"aria-label": "展开子菜单"
-			}, null, 10, ku)) : a("", !0)], 42, Ou), l(n, { name: "dropdown" }, {
+			}, null, 10, Fu)) : a("", !0)], 42, Pu), l(n, { name: "dropdown" }, {
 				default: E(() => [f.value === t.id && t.children && t.children.length ? (_(), o("div", {
 					key: 0,
 					class: "tool-dropdown",
@@ -13416,19 +13490,45 @@ var Tu = d({
 				}, [(_(), i(x(e.icon), {
 					class: "tool-icon",
 					"aria-hidden": "true"
-				}))], 10, Au))), 128))], 32)) : a("", !0)]),
+				}))], 10, Iu))), 128))], 32)) : a("", !0)]),
 				_: 2
 			}, 1024)])), 64))]),
-			c[10] ||= s("span", { class: "left-toolbar__divider" }, null, -1),
-			s("div", ju, [s("button", {
+			c[18] ||= s("span", { class: "left-toolbar__divider" }, null, -1),
+			s("div", Lu, [s("button", {
 				type: "button",
 				class: "left-toolbar__button",
-				title: t.isFullscreen ? "退出全屏" : "全屏显示",
-				"aria-label": t.isFullscreen ? "退出全屏" : "全屏显示",
-				onClick: c[6] ||= (e) => r.$emit("toggleFullscreen"),
+				title: "放大",
+				"aria-label": "放大",
+				onClick: c[6] ||= (e) => r.$emit("zoomIn"),
 				onPointerdown: c[7] ||= D(() => {}, ["stop"]),
 				onPointermove: c[8] ||= D(() => {}, ["stop"]),
 				onPointerup: c[9] ||= D(() => {}, ["stop"])
+			}, [l(w(Ou), {
+				class: "tool-icon",
+				"aria-hidden": "true"
+			})], 32), s("button", {
+				type: "button",
+				class: "left-toolbar__button",
+				title: "缩小",
+				"aria-label": "缩小",
+				onClick: c[10] ||= (e) => r.$emit("zoomOut"),
+				onPointerdown: c[11] ||= D(() => {}, ["stop"]),
+				onPointermove: c[12] ||= D(() => {}, ["stop"]),
+				onPointerup: c[13] ||= D(() => {}, ["stop"])
+			}, [l(w(ju), {
+				class: "tool-icon",
+				"aria-hidden": "true"
+			})], 32)]),
+			c[19] ||= s("span", { class: "left-toolbar__divider" }, null, -1),
+			s("div", Ru, [s("button", {
+				type: "button",
+				class: "left-toolbar__button",
+				title: t.isFullscreen ? "退出全屏" : "全屏显示",
+				"aria-label": t.isFullscreen ? "退出全屏" : "全屏显示",
+				onClick: c[14] ||= (e) => r.$emit("toggleFullscreen"),
+				onPointerdown: c[15] ||= D(() => {}, ["stop"]),
+				onPointermove: c[16] ||= D(() => {}, ["stop"]),
+				onPointerup: c[17] ||= D(() => {}, ["stop"])
 			}, [t.isFullscreen ? (_(), i(w(Tu), {
 				key: 0,
 				class: "tool-icon",
@@ -13437,13 +13537,13 @@ var Tu = d({
 				key: 1,
 				class: "tool-icon",
 				"aria-hidden": "true"
-			}))], 40, Mu)])
+			}))], 40, zu)])
 		]));
 	}
-}), [["__scopeId", "data-v-42a7d005"]]), Pu = { class: "chart-wrapper" }, Fu = { class: "chart-main" }, Iu = {
+}), [["__scopeId", "data-v-b530debe"]]), Vu = { class: "chart-wrapper" }, Hu = { class: "chart-main" }, Uu = {
 	class: "pane-separator-layer",
 	"aria-hidden": "true"
-}, Lu = 4, Ru = /* @__PURE__ */ Oo(/* @__PURE__ */ u({
+}, Wu = 4, Gu = /* @__PURE__ */ Oo(/* @__PURE__ */ u({
 	__name: "KLineChart",
 	props: {
 		semanticConfig: {},
@@ -13675,7 +13775,7 @@ var Tu = d({
 			return { ...Ne[e].defaultParams };
 		}
 		function Le(e = "VOLUME", t) {
-			if (U.value.length >= Lu) return !1;
+			if (U.value.length >= Wu) return !1;
 			let n = `sub_${e}`;
 			if (U.value.some((e) => e.id === n)) return !0;
 			if (!D.value?.createSubPane(e, t ?? Ie(e))) return !1;
@@ -14001,11 +14101,13 @@ var Tu = d({
 			}), a.setOnPaneLayoutChange((e) => {
 				let t = {};
 				for (let n of e) t[n.id] = n.ratio;
-				k.actions.setPaneRatios(t), ae.value = a.getPaneRenderers().slice(0, -1).map((e) => {
+				k.actions.setPaneRatios(t);
+				let n = a.getPaneRenderers(), r = E.value && parseInt(getComputedStyle(E.value).borderTopWidth) || 0;
+				ae.value = n.slice(0, -1).map((e) => {
 					let t = e.getPane();
 					return {
 						id: t.id,
-						top: t.top + t.height
+						top: t.top + t.height + r
 					};
 				});
 			}), a.setOnDataChange((e) => {
@@ -14020,6 +14122,21 @@ var Tu = d({
 				}
 			}), a.interaction.setTooltipAnchorPositioning(L.value), a.interaction.setOnInteractionChange((e) => {
 				R.value = e;
+			}), a.interaction.setOnPinchZoom((e, t) => {
+				let n = E.value;
+				if (!n || !a) return;
+				let r = t - n.getBoundingClientRect().left, i = n.scrollLeft, o = a.getCurrentDpr(), s = gl(e, r, i, A.value, j.value, M.value, {
+					minKWidth: u.minKWidth,
+					maxKWidth: u.maxKWidth,
+					zoomLevelCount: u.zoomLevels,
+					dpr: o
+				});
+				s && (k.actions.setZoomState(s.targetLevel, s.newKWidth, s.newKGap), a.interaction.clearHover(), f(() => {
+					let e = E.value;
+					if (!e) return;
+					let t = Math.max(0, e.scrollWidth - e.clientWidth), n = Math.min(Math.max(0, s.newScrollLeft), t);
+					e.scrollLeft = Math.round(n * o) / o, a.applyRenderState(s.newKWidth, s.newKGap, s.targetLevel), d("zoomLevelChange", s.targetLevel, s.newKWidth);
+				}));
 			}), R.value = a.interaction.getInteractionSnapshot(), k.actions.setViewportDpr(a.getCurrentDpr()), a.resize(), O.value = new $i(a), O.value.on("config:error", (e) => {
 				console.error("Semantic config error:", e);
 			}), O.value.on("config:ready", () => {
@@ -14041,18 +14158,20 @@ var Tu = d({
 				let t = await O.value?.applyConfig(e);
 				t && !t.success && console.error("Semantic config apply failed:", t.errors);
 			}
-		}, { deep: !0 }), (n, r) => (_(), o("div", Pu, [s("div", { class: p(["chart-stage", {
+		}, { deep: !0 }), (n, r) => (_(), o("div", Vu, [s("div", { class: p(["chart-stage", {
 			"is-dragging": ce.value,
 			"is-resizing-pane": le.value,
 			"is-hovering-pane-separator": ue.value,
 			"is-hovering-right-axis": fe.value,
 			"is-hovering-kline": pe.value !== null
-		}]) }, [l(Nu, {
+		}]) }, [l(Bu, {
 			"is-fullscreen": t.isFullscreen,
 			onSelectTool: be,
-			onToggleFullscreen: r[0] ||= (e) => n.$emit("toggleFullscreen")
-		}, null, 8, ["is-fullscreen"]), s("div", Fu, [
-			s("div", Iu, [(_(!0), o(e, null, b(ae.value, (e) => (_(), o("div", {
+			onToggleFullscreen: r[0] ||= (e) => n.$emit("toggleFullscreen"),
+			onZoomIn: r[1] ||= (e) => Ze(A.value + 1),
+			onZoomOut: r[2] ||= (e) => Ze(A.value - 1)
+		}, null, 8, ["is-fullscreen"]), s("div", Hu, [
+			s("div", Uu, [(_(!0), o(e, null, b(ae.value, (e) => (_(), o("div", {
 				key: e.id,
 				class: p(["pane-separator-line", { "is-active": de.value === e.id }]),
 				style: m({ top: `${e.top}px` })
@@ -14150,8 +14269,8 @@ var Tu = d({
 			onReorderSubIndicators: qe
 		}, null, 8, ["active-indicators", "indicator-params"])]));
 	}
-}), [["__scopeId", "data-v-eede0b8f"]]), zu = { install(e) {
-	e.component("KLineChart", Ru);
+}), [["__scopeId", "data-v-3f35943c"]]), Ku = { install(e) {
+	e.component("KLineChart", Gu);
 } };
 //#endregion
-export { ya as ConfigManager, I as EventBus, ga as GLOBAL_PANE_ID, va as HookSystem, Ru as KLineChart, zu as KMapPlugin, xa as PluginHostImpl, _a as PluginRegistry, ma as PluginState, X as RENDERER_PRIORITY, wa as RendererPluginManager, Sa as createPluginHost, ha as wrapPaneInfo };
+export { ya as ConfigManager, I as EventBus, ga as GLOBAL_PANE_ID, va as HookSystem, Gu as KLineChart, Ku as KMapPlugin, xa as PluginHostImpl, _a as PluginRegistry, ma as PluginState, X as RENDERER_PRIORITY, wa as RendererPluginManager, Sa as createPluginHost, ha as wrapPaneInfo };

package/dist/klinechart.css

@@ -1,2 +1,2 @@
-.kline-tooltip[data-v-d0fe85e6]{z-index:10;color:#000000c7;pointer-events:none;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#ffffffeb;border:1px solid #0000001f;border-radius:8px;min-width:200px;max-width:260px;padding:10px 12px;font-size:12px;line-height:1.4;position:absolute;box-shadow:0 6px 18px #0000001f}.kline-tooltip__title[data-v-d0fe85e6]{justify-content:space-between;gap:10px;margin-bottom:6px;font-weight:600;display:flex}.kline-tooltip__grid[data-v-d0fe85e6]{grid-template-columns:1fr;gap:2px;display:grid}.kline-tooltip__grid .row[data-v-d0fe85e6]{justify-content:space-between;gap:10px;display:flex}.kline-tooltip__grid .row span[data-v-d0fe85e6]:first-child{color:#0000008f}@supports (anchor-name:--kmap-anchor) and (position-anchor:--kmap-anchor){.kline-tooltip.use-anchor[data-v-d0fe85e6]{position-anchor:--kline-tooltip-anchor;left:anchor(left);top:anchor(top);position:absolute}.kline-tooltip.use-anchor.anchor-right-bottom[data-v-d0fe85e6]{transform:translate(14px,14px)}.kline-tooltip.use-anchor.anchor-left-bottom[data-v-d0fe85e6]{transform:translate(calc(-100% - 14px),14px)}}.marker-tooltip[data-v-5574cc25]{z-index:10;color:#000000c7;pointer-events:none;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#ffffffeb;border:1px solid #0000001f;border-radius:8px;min-width:180px;max-width:260px;padding:10px 12px;font-size:12px;line-height:1.4;position:absolute;box-shadow:0 6px 18px #0000001f}.marker-tooltip__title[data-v-5574cc25]{justify-content:space-between;gap:10px;margin-bottom:6px;font-weight:600;display:flex}.marker-tooltip__content[data-v-5574cc25]{grid-template-columns:1fr;gap:2px;display:grid}.marker-tooltip__content .row[data-v-5574cc25]{justify-content:space-between;gap:10px;display:flex}.marker-tooltip__content .row span[data-v-5574cc25]:first-child{color:#0000008f}@supports (anchor-name:--kmap-anchor) and (position-anchor:--kmap-anchor){.marker-tooltip.use-anchor[data-v-5574cc25]{position-anchor:--marker-tooltip-anchor;left:anchor(left);top:anchor(top);position:absolute}.marker-tooltip.use-anchor.anchor-right-bottom[data-v-5574cc25]{transform:translate(12px,12px)}.marker-tooltip.use-anchor.anchor-left-bottom[data-v-5574cc25]{transform:translate(calc(-100% - 12px),12px)}}.params-overlay[data-v-c14eedcc]{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background:#0000004d;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.indicator-params[data-v-c14eedcc]{background:#fff;border:1px solid #e0e0e0;border-radius:12px;width:90vw;min-width:340px;max-width:420px;overflow:hidden;box-shadow:0 8px 40px #00000026}.params-header[data-v-c14eedcc]{background:#f8f8f8;border-bottom:1px solid #e8e8e8;justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.header-left[data-v-c14eedcc]{align-items:baseline;gap:8px;display:flex}.header-right[data-v-c14eedcc]{align-items:center;gap:8px;display:flex}.params-title[data-v-c14eedcc]{color:#1a1a1a;letter-spacing:.2px;font-size:14px;font-weight:600}.params-subtitle[data-v-c14eedcc]{color:#999;font-size:11px}.toggle-desc-btn[data-v-c14eedcc]{cursor:pointer;color:#888;background:#fff;border:1px solid #e0e0e0;border-radius:6px;justify-content:center;align-items:center;width:28px;height:28px;padding:0;transition:all .2s;display:flex}.toggle-desc-btn[data-v-c14eedcc]:hover{color:#555;background:#f0f0f0;border-color:#ccc}.toggle-desc-btn.active[data-v-c14eedcc]{color:#fff;background:#1a1a1a;border-color:#1a1a1a}.toggle-desc-btn svg[data-v-c14eedcc]{width:14px;height:14px}.params-close[data-v-c14eedcc]{cursor:pointer;color:#888;background:#fff;border:1px solid #e0e0e0;border-radius:6px;justify-content:center;align-items:center;width:28px;height:28px;padding:0;transition:background .15s,color .15s,border-color .15s;display:flex}.params-close[data-v-c14eedcc]:hover{color:#333;background:#f0f0f0;border-color:#ccc}.params-close svg[data-v-c14eedcc]{width:14px;height:14px}.indicator-description[data-v-c14eedcc]{background:#f0f7ff;border-bottom:1px solid #d6e8f5;padding:12px 20px}.indicator-description p[data-v-c14eedcc]{color:#2c5282;margin:0;font-size:12px;line-height:1.6}.params-body[data-v-c14eedcc]{flex-direction:column;gap:10px;padding:16px 20px;display:flex}.param-item[data-v-c14eedcc]{background:#f8f8f8;border:1px solid #e8e8e8;border-radius:8px;padding:10px 14px;transition:border-color .2s}.param-item[data-v-c14eedcc]:has(.param-input:focus){border-color:#bbb}.param-item.has-desc[data-v-c14eedcc]{padding:10px 14px 8px}.param-header[data-v-c14eedcc]{justify-content:space-between;align-items:center;gap:16px;display:flex}.param-label[data-v-c14eedcc]{flex-direction:column;gap:3px;display:flex}.param-label-text[data-v-c14eedcc]{color:#333;font-size:13px;font-weight:500}.param-range[data-v-c14eedcc]{color:#999;font-size:11px}.param-description[data-v-c14eedcc]{color:#666;border-top:1px dashed #e0e0e0;margin-top:8px;padding-top:8px;font-size:11px;line-height:1.5}.input-wrapper[data-v-c14eedcc]{background:#fff;border:1px solid #d0d0d0;border-radius:7px;align-items:stretch;height:32px;transition:border-color .2s;display:flex;overflow:hidden}.input-wrapper[data-v-c14eedcc]:focus-within{border-color:#999}.stepper-btn[data-v-c14eedcc]{cursor:pointer;color:#666;background:#f0f0f0;border:none;flex-shrink:0;justify-content:center;align-items:center;width:28px;font-size:15px;font-weight:400;line-height:1;transition:background .15s,color .15s;display:flex}.stepper-btn[data-v-c14eedcc]:hover:not(:disabled){color:#333;background:#e0e0e0}.stepper-btn[data-v-c14eedcc]:disabled{color:#ccc;cursor:not-allowed}.param-input[data-v-c14eedcc]{text-align:center;color:#1a1a1a;appearance:textfield;background:0 0;border:none;border-left:1px solid #e8e8e8;border-right:1px solid #e8e8e8;width:60px;font-size:13px;font-weight:600}.param-input[data-v-c14eedcc]::-webkit-inner-spin-button{-webkit-appearance:none}.param-input[data-v-c14eedcc]::-webkit-outer-spin-button{-webkit-appearance:none}.param-input[data-v-c14eedcc]:focus{outline:none}.params-footer[data-v-c14eedcc]{background:#f8f8f8;border-top:1px solid #e8e8e8;justify-content:space-between;align-items:center;padding:12px 20px;display:flex}.footer-right[data-v-c14eedcc]{gap:8px;display:flex}.params-btn[data-v-c14eedcc]{cursor:pointer;border:1px solid #0000;border-radius:7px;align-items:center;gap:5px;padding:6px 14px;font-size:13px;font-weight:500;line-height:1.4;transition:all .15s;display:flex}.params-btn svg[data-v-c14eedcc]{flex-shrink:0;width:12px;height:12px}.params-btn.reset[data-v-c14eedcc]{color:#666;background:0 0;border-color:#d0d0d0}.params-btn.reset[data-v-c14eedcc]:hover{color:#e74c3c;background:#e74c3c14;border-color:#c0392b}.params-btn.cancel[data-v-c14eedcc]{color:#666;background:0 0;border-color:#d0d0d0}.params-btn.cancel[data-v-c14eedcc]:hover{color:#333;background:#f0f0f0;border-color:#bbb}.params-btn.confirm[data-v-c14eedcc]{color:#fff;background:#1a1a1a;border-color:#1a1a1a}.params-btn.confirm[data-v-c14eedcc]:hover{background:#333;border-color:#333;transform:translateY(-1px);box-shadow:0 2px 10px #00000026}.params-btn.confirm[data-v-c14eedcc]:active{box-shadow:none;transform:translateY(0)}.overlay-enter-active[data-v-c14eedcc],.overlay-leave-active[data-v-c14eedcc]{transition:opacity .2s}.overlay-enter-from[data-v-c14eedcc],.overlay-leave-to[data-v-c14eedcc]{opacity:0}.modal-enter-active[data-v-c14eedcc]{transition:all .22s cubic-bezier(.34,1.56,.64,1)}.modal-leave-active[data-v-c14eedcc]{transition:all .16s ease-in}.modal-enter-from[data-v-c14eedcc]{opacity:0;transform:scale(.88)translateY(-16px)}.modal-leave-to[data-v-c14eedcc]{opacity:0;transform:scale(.94)translateY(8px)}.slide-enter-active[data-v-c14eedcc],.slide-leave-active[data-v-c14eedcc]{transition:all .2s;overflow:hidden}.slide-enter-from[data-v-c14eedcc],.slide-leave-to[data-v-c14eedcc]{opacity:0;max-height:0;margin-top:0;padding-top:0;padding-bottom:0}.indicator-selector[data-v-4b90c954]{width:80%;margin:20px;position:relative}.indicator-scroll-container[data-v-4b90c954]{scrollbar-width:none;-webkit-overflow-scrolling:touch;text-align:center;width:100%;overflow:auto hidden}.indicator-scroll-container[data-v-4b90c954]::-webkit-scrollbar{display:none}.indicator-list[data-v-4b90c954]{gap:8px;margin:0 auto;padding:2px;display:inline-flex}.indicator-divider[data-v-4b90c954]{background:#d9d9d9;align-self:center;width:1px;height:20px}.indicator-item[data-v-4b90c954]{align-items:center;gap:4px;display:flex}.indicator-item.draggable[data-v-4b90c954],.indicator-item.draggable .indicator-btn[data-v-4b90c954],.indicator-item.draggable[data-v-4b90c954]:hover,.indicator-item.draggable:hover .indicator-btn[data-v-4b90c954]{cursor:move}.indicator-item.is-dragging[data-v-4b90c954]{opacity:.6}.indicator-item.drag-over .indicator-btn[data-v-4b90c954]{border-color:#1a1a1a;box-shadow:0 0 0 2px #1a1a1a1f}.indicator-btn-wrapper[data-v-4b90c954]{position:relative}.indicator-btn[data-v-4b90c954]{color:#666;cursor:pointer;white-space:nowrap;background:#fff;border:1px solid #e0e0e0;border-radius:16px;flex-shrink:0;justify-content:center;align-items:center;gap:4px;padding:6px 16px;font-size:13px;font-weight:500;transition:all .3s;display:flex;position:relative;overflow:hidden}.indicator-btn[data-v-4b90c954]:hover:not(.hovering){color:#333;background:#f8f8f8;border-color:#ccc}.indicator-btn.active[data-v-4b90c954]{color:#1a1a1a;background:#f8f8f8;border-color:#1a1a1a}.indicator-btn.active[data-v-4b90c954]:hover:not(.hovering){background:#f0f0f0;border-color:#333}.btn-content[data-v-4b90c954]{z-index:1;position:relative}.param-hint[data-v-4b90c954]{opacity:.85;font-size:11px}.hover-overlay[data-v-4b90c954]{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:2;background:#ffffffd9;border-radius:16px;justify-content:center;align-items:center;gap:4px;display:flex;position:absolute;inset:0}.action-btn[data-v-4b90c954]{color:#666;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;padding:0;transition:all .2s;display:flex}.action-btn[data-v-4b90c954]:hover{color:#333;background:#0000000f}.settings-btn[data-v-4b90c954]:hover{color:#1a1a1a}.remove-btn[data-v-4b90c954]:hover{color:#ff4d4f}.divider[data-v-4b90c954]{background:#e0e0e0;width:1px;height:14px}.add-btn[data-v-4b90c954]{anchor-name:--indicator-add-btn;color:#999;cursor:pointer;background:0 0;border:1px dashed #d9d9d9;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;padding:0;transition:all .3s;display:flex}.add-btn[data-v-4b90c954]:hover{color:#1a1a1a;background:#1a1a1a0a;border-color:#1a1a1a}.add-menu[data-v-4b90c954]{white-space:nowrap;z-index:9999;background:#fff;border-radius:8px;padding:8px 0;position:fixed;transform:translate(-50%);box-shadow:0 6px 16px #00000014,0 3px 6px -4px #0000001f,0 9px 28px 8px #0000000d}@supports (anchor-name:--kmap-anchor) and (position-anchor:--kmap-anchor){.add-menu.use-anchor[data-v-4b90c954]{position-anchor:--indicator-add-btn;left:anchor(center);top:anchor(top);max-width:calc(100vw - 16px);position:fixed;transform:translate(-50%,calc(-100% - 8px))}}.menu-section[data-v-4b90c954]{padding:4px 0}.menu-section[data-v-4b90c954]:not(:last-child){border-bottom:1px solid #f0f0f0}.menu-title[data-v-4b90c954]{color:#999;padding:4px 16px;font-size:12px;font-weight:500}.menu-items[data-v-4b90c954]{flex-direction:column;gap:2px;display:flex}.menu-item[data-v-4b90c954]{text-align:left;color:#333;cursor:pointer;background:0 0;border:none;align-items:center;gap:8px;width:100%;padding:8px 16px;font-size:13px;transition:background .2s;display:flex}.menu-item[data-v-4b90c954]:hover:not(.disabled){background:#f5f5f5}.menu-item.disabled[data-v-4b90c954]{color:#999;cursor:not-allowed}.menu-item .param-hint[data-v-4b90c954]{color:#999;font-size:11px}.active-tag[data-v-4b90c954]{color:#1a1a1a;align-items:center;margin-left:auto;display:flex}.fade-enter-active[data-v-4b90c954],.fade-leave-active[data-v-4b90c954]{transition:opacity .2s}.fade-enter-from[data-v-4b90c954],.fade-leave-to[data-v-4b90c954]{opacity:0}.slide-enter-active[data-v-4b90c954],.slide-leave-active[data-v-4b90c954]{transition:all .2s}.slide-enter-from[data-v-4b90c954],.slide-leave-to[data-v-4b90c954]{opacity:0;transform:translate(-50%)translateY(8px)}.drawing-style-toolbar[data-v-088ccef5]{-webkit-backdrop-filter:blur(8px);z-index:100;-webkit-user-select:none;user-select:none;pointer-events:auto;background:#fafbfce0;border:1px solid #e5e7eb;border-radius:6px;align-items:center;gap:6px;height:32px;padding:4px 8px;display:flex;position:absolute;top:8px;left:50%;transform:translate(-50%);box-shadow:0 1px 3px #0000000f}.toolbar-item[data-v-088ccef5]{justify-content:center;align-items:center;display:inline-flex}.color-item[data-v-088ccef5]{width:24px;height:24px;position:relative}.color-swatch[data-v-088ccef5]{cursor:pointer;border:1px solid #d1d5db;border-radius:4px;width:100%;height:100%;display:block}.color-input[data-v-088ccef5]{opacity:0;cursor:pointer;width:100%;height:100%;position:absolute;inset:0}.toolbar-select[data-v-088ccef5]{color:#374151;cursor:pointer;background:#fff;border:1px solid #d1d5db;border-radius:4px;outline:none;height:24px;padding:0 4px;font-size:12px}.toolbar-select[data-v-088ccef5]:hover{border-color:#9ca3af}.toolbar-btn[data-v-088ccef5]{color:#6b7280;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:4px;justify-content:center;align-items:center;width:24px;height:24px;padding:0;transition:border-color .15s,background .15s,color .15s;display:inline-flex}.toolbar-btn[data-v-088ccef5]:hover{color:#374151;background:#f3f4f6;border-color:#d1d5db}.delete-btn[data-v-088ccef5]:hover{color:#dc2626;background:#fef2f2;border-color:#fca5a5}.delete-icon[data-v-088ccef5]{width:14px;height:14px}.left-toolbar[data-v-42a7d005]{box-sizing:border-box;-webkit-user-select:none;user-select:none;background:#fafbfc;border:1px solid #e5e7eb;border-radius:6px;flex-direction:column;flex:0 0 40px;align-items:center;gap:6px;padding:8px 5px;display:flex;box-shadow:0 1px 3px #0000000f}.left-toolbar__group[data-v-42a7d005]{flex-direction:column;gap:4px;display:flex}.left-toolbar__divider[data-v-42a7d005]{background:#e5e7eb;width:18px;height:1px}.left-toolbar__button[data-v-42a7d005]{color:#6b7280;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:4px;justify-content:center;align-items:center;width:28px;height:28px;padding:0;transition:border-color .15s,background .15s,color .15s;display:inline-flex;position:relative}.left-toolbar__button[data-v-42a7d005]:hover{color:#374151;background:#f3f4f6;border-color:#d1d5db}.left-toolbar__button.active[data-v-42a7d005]{color:#1f2937;background:#e5e7eb;border-color:#9ca3af}.left-toolbar__button[data-v-42a7d005]:focus-visible{border-color:#6b7280;outline:none}.tool-icon[data-v-42a7d005]{width:16px;height:16px}.corner-indicator[data-v-42a7d005]{cursor:pointer;width:8px;height:8px;position:absolute;bottom:0;right:0;overflow:hidden}.corner-indicator[data-v-42a7d005]:after{content:"";opacity:.45;border-bottom:5px solid;border-left:5px solid #0000;width:0;height:0;transition:opacity .15s;position:absolute;bottom:0;right:0}.left-toolbar__button:hover .corner-indicator[data-v-42a7d005]:after,.left-toolbar__button.active .corner-indicator[data-v-42a7d005]:after{opacity:.7}.corner-indicator.open[data-v-42a7d005]:after{opacity:.8}.tool-dropdown[data-v-42a7d005]{-webkit-backdrop-filter:blur(8px);box-sizing:border-box;z-index:100;background:#fafbfcd1;border:1px solid #e5e7eb;border-radius:6px;flex-direction:row;align-items:center;gap:4px;height:40px;padding:0 5px;display:flex;position:absolute;top:50%;left:calc(100% + 13px);transform:translateY(-50%);box-shadow:0 1px 3px #0000000f}.tool-item[data-v-42a7d005]{position:relative}.dropdown-enter-active[data-v-42a7d005],.dropdown-leave-active[data-v-42a7d005]{transition:opacity .15s,transform .15s}.dropdown-enter-from[data-v-42a7d005],.dropdown-leave-to[data-v-42a7d005]{opacity:0;transform:translateY(-50%)translate(-6px)}@media (width<=768px),(height<=640px){.left-toolbar[data-v-42a7d005]{border-radius:5px;flex-basis:36px;gap:5px;padding:6px 4px}.left-toolbar__group[data-v-42a7d005]{gap:3px}.left-toolbar__button[data-v-42a7d005]{border-radius:3px;width:26px;height:26px}.left-toolbar__divider[data-v-42a7d005]{width:16px}.corner-indicator[data-v-42a7d005]{width:7px;height:7px}.corner-indicator[data-v-42a7d005]:after{border-bottom-width:4px;border-left-width:4px}.tool-dropdown[data-v-42a7d005]{height:36px}}.chart-wrapper[data-v-eede0b8f]{--kmap-height:var(--kmap-chart-height,100%);--kmap-width:var(--kmap-chart-width,100%);width:var(--kmap-width);height:var(--kmap-height);flex-direction:column;justify-content:center;align-items:center;min-height:300px;display:flex}.chart-stage[data-v-eede0b8f]{align-items:stretch;gap:8px;width:95%;height:85%;min-height:255px;display:flex}.chart-main[data-v-eede0b8f]{flex:auto;align-items:stretch;gap:0;min-width:0;height:100%;display:flex;position:relative}.pane-separator-layer[data-v-eede0b8f]{pointer-events:none;z-index:20;position:absolute;inset:0}.pane-separator-line[data-v-eede0b8f]{opacity:1;background:#e5e7eb;height:1px;transition:background-color .12s,box-shadow .12s,opacity .12s;position:absolute;left:1px;right:1px;transform:translateY(-.5px)}.pane-separator-line.is-active[data-v-eede0b8f]{background:#3b82f6;box-shadow:0 0 0 .5px #3b82f6e6,0 0 6px #3b82f673,0 0 12px #3b82f640}.chart-stage.is-resizing-pane[data-v-eede0b8f],.chart-stage.is-hovering-pane-separator[data-v-eede0b8f]{cursor:ns-resize}.chart-stage.is-hovering-kline[data-v-eede0b8f]{cursor:pointer}.chart-stage.is-hovering-right-axis[data-v-eede0b8f]{cursor:ns-resize}.chart-stage.is-dragging[data-v-eede0b8f]{cursor:grabbing}.chart-container[data-v-eede0b8f]{height:100%;min-height:inherit;scrollbar-width:none;-ms-overflow-style:none;box-sizing:border-box;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;touch-action:none;background:#fff;border:1px solid #e5e7eb;border-right:0;border-radius:6px 0 0 6px;flex:auto;position:relative;overflow:auto hidden}.chart-container[data-v-eede0b8f]::-webkit-scrollbar{display:none}.chart-container[data-v-eede0b8f]:hover{cursor:crosshair}.chart-stage.is-resizing-pane .chart-container[data-v-eede0b8f],.chart-stage.is-hovering-pane-separator .chart-container[data-v-eede0b8f]{cursor:ns-resize}.chart-stage.is-hovering-kline .chart-container[data-v-eede0b8f]{cursor:pointer}.chart-stage.is-dragging .chart-container[data-v-eede0b8f]{cursor:grabbing}.right-axis-host[data-v-eede0b8f]{height:100%;min-height:inherit;box-sizing:border-box;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;touch-action:none;background:#fff;border-top-right-radius:6px;border-bottom-right-radius:6px;flex:none;position:relative;overflow:visible}.right-axis-host[data-v-eede0b8f]:after{content:"";pointer-events:none;box-sizing:border-box;border:1px solid #e5e7eb;border-top-right-radius:6px;border-bottom-right-radius:6px;position:absolute;inset:0}.scroll-content[data-v-eede0b8f]{height:100%;min-height:inherit;position:relative}.canvas-layer[data-v-eede0b8f]{pointer-events:none;position:sticky;top:0;left:0}.tooltip-anchor[data-v-eede0b8f]{pointer-events:none;width:1px;height:1px;position:absolute}.tooltip-anchor.kline-tooltip-anchor.use-anchor[data-v-eede0b8f]{anchor-name:--kline-tooltip-anchor}.tooltip-anchor.marker-tooltip-anchor.use-anchor[data-v-eede0b8f]{anchor-name:--marker-tooltip-anchor}@media (width<=768px),(height<=640px){.chart-stage[data-v-eede0b8f]{gap:6px}}.plot-canvas{display:block;position:absolute;top:0;left:0}.right-axis{display:block;position:absolute;left:0}.x-axis-canvas{z-index:10;display:block;position:absolute;bottom:0;left:0}.right-axis{z-index:999}
+.kline-tooltip[data-v-d0fe85e6]{z-index:10;color:#000000c7;pointer-events:none;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#ffffffeb;border:1px solid #0000001f;border-radius:8px;min-width:200px;max-width:260px;padding:10px 12px;font-size:12px;line-height:1.4;position:absolute;box-shadow:0 6px 18px #0000001f}.kline-tooltip__title[data-v-d0fe85e6]{justify-content:space-between;gap:10px;margin-bottom:6px;font-weight:600;display:flex}.kline-tooltip__grid[data-v-d0fe85e6]{grid-template-columns:1fr;gap:2px;display:grid}.kline-tooltip__grid .row[data-v-d0fe85e6]{justify-content:space-between;gap:10px;display:flex}.kline-tooltip__grid .row span[data-v-d0fe85e6]:first-child{color:#0000008f}@supports (anchor-name:--kmap-anchor) and (position-anchor:--kmap-anchor){.kline-tooltip.use-anchor[data-v-d0fe85e6]{position-anchor:--kline-tooltip-anchor;left:anchor(left);top:anchor(top);position:absolute}.kline-tooltip.use-anchor.anchor-right-bottom[data-v-d0fe85e6]{transform:translate(14px,14px)}.kline-tooltip.use-anchor.anchor-left-bottom[data-v-d0fe85e6]{transform:translate(calc(-100% - 14px),14px)}}.marker-tooltip[data-v-5574cc25]{z-index:10;color:#000000c7;pointer-events:none;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#ffffffeb;border:1px solid #0000001f;border-radius:8px;min-width:180px;max-width:260px;padding:10px 12px;font-size:12px;line-height:1.4;position:absolute;box-shadow:0 6px 18px #0000001f}.marker-tooltip__title[data-v-5574cc25]{justify-content:space-between;gap:10px;margin-bottom:6px;font-weight:600;display:flex}.marker-tooltip__content[data-v-5574cc25]{grid-template-columns:1fr;gap:2px;display:grid}.marker-tooltip__content .row[data-v-5574cc25]{justify-content:space-between;gap:10px;display:flex}.marker-tooltip__content .row span[data-v-5574cc25]:first-child{color:#0000008f}@supports (anchor-name:--kmap-anchor) and (position-anchor:--kmap-anchor){.marker-tooltip.use-anchor[data-v-5574cc25]{position-anchor:--marker-tooltip-anchor;left:anchor(left);top:anchor(top);position:absolute}.marker-tooltip.use-anchor.anchor-right-bottom[data-v-5574cc25]{transform:translate(12px,12px)}.marker-tooltip.use-anchor.anchor-left-bottom[data-v-5574cc25]{transform:translate(calc(-100% - 12px),12px)}}.params-overlay[data-v-c14eedcc]{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background:#0000004d;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.indicator-params[data-v-c14eedcc]{background:#fff;border:1px solid #e0e0e0;border-radius:12px;width:90vw;min-width:340px;max-width:420px;overflow:hidden;box-shadow:0 8px 40px #00000026}.params-header[data-v-c14eedcc]{background:#f8f8f8;border-bottom:1px solid #e8e8e8;justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.header-left[data-v-c14eedcc]{align-items:baseline;gap:8px;display:flex}.header-right[data-v-c14eedcc]{align-items:center;gap:8px;display:flex}.params-title[data-v-c14eedcc]{color:#1a1a1a;letter-spacing:.2px;font-size:14px;font-weight:600}.params-subtitle[data-v-c14eedcc]{color:#999;font-size:11px}.toggle-desc-btn[data-v-c14eedcc]{cursor:pointer;color:#888;background:#fff;border:1px solid #e0e0e0;border-radius:6px;justify-content:center;align-items:center;width:28px;height:28px;padding:0;transition:all .2s;display:flex}.toggle-desc-btn[data-v-c14eedcc]:hover{color:#555;background:#f0f0f0;border-color:#ccc}.toggle-desc-btn.active[data-v-c14eedcc]{color:#fff;background:#1a1a1a;border-color:#1a1a1a}.toggle-desc-btn svg[data-v-c14eedcc]{width:14px;height:14px}.params-close[data-v-c14eedcc]{cursor:pointer;color:#888;background:#fff;border:1px solid #e0e0e0;border-radius:6px;justify-content:center;align-items:center;width:28px;height:28px;padding:0;transition:background .15s,color .15s,border-color .15s;display:flex}.params-close[data-v-c14eedcc]:hover{color:#333;background:#f0f0f0;border-color:#ccc}.params-close svg[data-v-c14eedcc]{width:14px;height:14px}.indicator-description[data-v-c14eedcc]{background:#f0f7ff;border-bottom:1px solid #d6e8f5;padding:12px 20px}.indicator-description p[data-v-c14eedcc]{color:#2c5282;margin:0;font-size:12px;line-height:1.6}.params-body[data-v-c14eedcc]{flex-direction:column;gap:10px;padding:16px 20px;display:flex}.param-item[data-v-c14eedcc]{background:#f8f8f8;border:1px solid #e8e8e8;border-radius:8px;padding:10px 14px;transition:border-color .2s}.param-item[data-v-c14eedcc]:has(.param-input:focus){border-color:#bbb}.param-item.has-desc[data-v-c14eedcc]{padding:10px 14px 8px}.param-header[data-v-c14eedcc]{justify-content:space-between;align-items:center;gap:16px;display:flex}.param-label[data-v-c14eedcc]{flex-direction:column;gap:3px;display:flex}.param-label-text[data-v-c14eedcc]{color:#333;font-size:13px;font-weight:500}.param-range[data-v-c14eedcc]{color:#999;font-size:11px}.param-description[data-v-c14eedcc]{color:#666;border-top:1px dashed #e0e0e0;margin-top:8px;padding-top:8px;font-size:11px;line-height:1.5}.input-wrapper[data-v-c14eedcc]{background:#fff;border:1px solid #d0d0d0;border-radius:7px;align-items:stretch;height:32px;transition:border-color .2s;display:flex;overflow:hidden}.input-wrapper[data-v-c14eedcc]:focus-within{border-color:#999}.stepper-btn[data-v-c14eedcc]{cursor:pointer;color:#666;background:#f0f0f0;border:none;flex-shrink:0;justify-content:center;align-items:center;width:28px;font-size:15px;font-weight:400;line-height:1;transition:background .15s,color .15s;display:flex}.stepper-btn[data-v-c14eedcc]:hover:not(:disabled){color:#333;background:#e0e0e0}.stepper-btn[data-v-c14eedcc]:disabled{color:#ccc;cursor:not-allowed}.param-input[data-v-c14eedcc]{text-align:center;color:#1a1a1a;appearance:textfield;background:0 0;border:none;border-left:1px solid #e8e8e8;border-right:1px solid #e8e8e8;width:60px;font-size:13px;font-weight:600}.param-input[data-v-c14eedcc]::-webkit-inner-spin-button{-webkit-appearance:none}.param-input[data-v-c14eedcc]::-webkit-outer-spin-button{-webkit-appearance:none}.param-input[data-v-c14eedcc]:focus{outline:none}.params-footer[data-v-c14eedcc]{background:#f8f8f8;border-top:1px solid #e8e8e8;justify-content:space-between;align-items:center;padding:12px 20px;display:flex}.footer-right[data-v-c14eedcc]{gap:8px;display:flex}.params-btn[data-v-c14eedcc]{cursor:pointer;border:1px solid #0000;border-radius:7px;align-items:center;gap:5px;padding:6px 14px;font-size:13px;font-weight:500;line-height:1.4;transition:all .15s;display:flex}.params-btn svg[data-v-c14eedcc]{flex-shrink:0;width:12px;height:12px}.params-btn.reset[data-v-c14eedcc]{color:#666;background:0 0;border-color:#d0d0d0}.params-btn.reset[data-v-c14eedcc]:hover{color:#e74c3c;background:#e74c3c14;border-color:#c0392b}.params-btn.cancel[data-v-c14eedcc]{color:#666;background:0 0;border-color:#d0d0d0}.params-btn.cancel[data-v-c14eedcc]:hover{color:#333;background:#f0f0f0;border-color:#bbb}.params-btn.confirm[data-v-c14eedcc]{color:#fff;background:#1a1a1a;border-color:#1a1a1a}.params-btn.confirm[data-v-c14eedcc]:hover{background:#333;border-color:#333;transform:translateY(-1px);box-shadow:0 2px 10px #00000026}.params-btn.confirm[data-v-c14eedcc]:active{box-shadow:none;transform:translateY(0)}.overlay-enter-active[data-v-c14eedcc],.overlay-leave-active[data-v-c14eedcc]{transition:opacity .2s}.overlay-enter-from[data-v-c14eedcc],.overlay-leave-to[data-v-c14eedcc]{opacity:0}.modal-enter-active[data-v-c14eedcc]{transition:all .22s cubic-bezier(.34,1.56,.64,1)}.modal-leave-active[data-v-c14eedcc]{transition:all .16s ease-in}.modal-enter-from[data-v-c14eedcc]{opacity:0;transform:scale(.88)translateY(-16px)}.modal-leave-to[data-v-c14eedcc]{opacity:0;transform:scale(.94)translateY(8px)}.slide-enter-active[data-v-c14eedcc],.slide-leave-active[data-v-c14eedcc]{transition:all .2s;overflow:hidden}.slide-enter-from[data-v-c14eedcc],.slide-leave-to[data-v-c14eedcc]{opacity:0;max-height:0;margin-top:0;padding-top:0;padding-bottom:0}.indicator-selector[data-v-4b90c954]{width:80%;margin:20px;position:relative}.indicator-scroll-container[data-v-4b90c954]{scrollbar-width:none;-webkit-overflow-scrolling:touch;text-align:center;width:100%;overflow:auto hidden}.indicator-scroll-container[data-v-4b90c954]::-webkit-scrollbar{display:none}.indicator-list[data-v-4b90c954]{gap:8px;margin:0 auto;padding:2px;display:inline-flex}.indicator-divider[data-v-4b90c954]{background:#d9d9d9;align-self:center;width:1px;height:20px}.indicator-item[data-v-4b90c954]{align-items:center;gap:4px;display:flex}.indicator-item.draggable[data-v-4b90c954],.indicator-item.draggable .indicator-btn[data-v-4b90c954],.indicator-item.draggable[data-v-4b90c954]:hover,.indicator-item.draggable:hover .indicator-btn[data-v-4b90c954]{cursor:move}.indicator-item.is-dragging[data-v-4b90c954]{opacity:.6}.indicator-item.drag-over .indicator-btn[data-v-4b90c954]{border-color:#1a1a1a;box-shadow:0 0 0 2px #1a1a1a1f}.indicator-btn-wrapper[data-v-4b90c954]{position:relative}.indicator-btn[data-v-4b90c954]{color:#666;cursor:pointer;white-space:nowrap;background:#fff;border:1px solid #e0e0e0;border-radius:16px;flex-shrink:0;justify-content:center;align-items:center;gap:4px;padding:6px 16px;font-size:13px;font-weight:500;transition:all .3s;display:flex;position:relative;overflow:hidden}.indicator-btn[data-v-4b90c954]:hover:not(.hovering){color:#333;background:#f8f8f8;border-color:#ccc}.indicator-btn.active[data-v-4b90c954]{color:#1a1a1a;background:#f8f8f8;border-color:#1a1a1a}.indicator-btn.active[data-v-4b90c954]:hover:not(.hovering){background:#f0f0f0;border-color:#333}.btn-content[data-v-4b90c954]{z-index:1;position:relative}.param-hint[data-v-4b90c954]{opacity:.85;font-size:11px}.hover-overlay[data-v-4b90c954]{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:2;background:#ffffffd9;border-radius:16px;justify-content:center;align-items:center;gap:4px;display:flex;position:absolute;inset:0}.action-btn[data-v-4b90c954]{color:#666;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;padding:0;transition:all .2s;display:flex}.action-btn[data-v-4b90c954]:hover{color:#333;background:#0000000f}.settings-btn[data-v-4b90c954]:hover{color:#1a1a1a}.remove-btn[data-v-4b90c954]:hover{color:#ff4d4f}.divider[data-v-4b90c954]{background:#e0e0e0;width:1px;height:14px}.add-btn[data-v-4b90c954]{anchor-name:--indicator-add-btn;color:#999;cursor:pointer;background:0 0;border:1px dashed #d9d9d9;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;padding:0;transition:all .3s;display:flex}.add-btn[data-v-4b90c954]:hover{color:#1a1a1a;background:#1a1a1a0a;border-color:#1a1a1a}.add-menu[data-v-4b90c954]{white-space:nowrap;z-index:9999;background:#fff;border-radius:8px;padding:8px 0;position:fixed;transform:translate(-50%);box-shadow:0 6px 16px #00000014,0 3px 6px -4px #0000001f,0 9px 28px 8px #0000000d}@supports (anchor-name:--kmap-anchor) and (position-anchor:--kmap-anchor){.add-menu.use-anchor[data-v-4b90c954]{position-anchor:--indicator-add-btn;left:anchor(center);top:anchor(top);max-width:calc(100vw - 16px);position:fixed;transform:translate(-50%,calc(-100% - 8px))}}.menu-section[data-v-4b90c954]{padding:4px 0}.menu-section[data-v-4b90c954]:not(:last-child){border-bottom:1px solid #f0f0f0}.menu-title[data-v-4b90c954]{color:#999;padding:4px 16px;font-size:12px;font-weight:500}.menu-items[data-v-4b90c954]{flex-direction:column;gap:2px;display:flex}.menu-item[data-v-4b90c954]{text-align:left;color:#333;cursor:pointer;background:0 0;border:none;align-items:center;gap:8px;width:100%;padding:8px 16px;font-size:13px;transition:background .2s;display:flex}.menu-item[data-v-4b90c954]:hover:not(.disabled){background:#f5f5f5}.menu-item.disabled[data-v-4b90c954]{color:#999;cursor:not-allowed}.menu-item .param-hint[data-v-4b90c954]{color:#999;font-size:11px}.active-tag[data-v-4b90c954]{color:#1a1a1a;align-items:center;margin-left:auto;display:flex}.fade-enter-active[data-v-4b90c954],.fade-leave-active[data-v-4b90c954]{transition:opacity .2s}.fade-enter-from[data-v-4b90c954],.fade-leave-to[data-v-4b90c954]{opacity:0}.slide-enter-active[data-v-4b90c954],.slide-leave-active[data-v-4b90c954]{transition:all .2s}.slide-enter-from[data-v-4b90c954],.slide-leave-to[data-v-4b90c954]{opacity:0;transform:translate(-50%)translateY(8px)}.drawing-style-toolbar[data-v-088ccef5]{-webkit-backdrop-filter:blur(8px);z-index:100;-webkit-user-select:none;user-select:none;pointer-events:auto;background:#fafbfce0;border:1px solid #e5e7eb;border-radius:6px;align-items:center;gap:6px;height:32px;padding:4px 8px;display:flex;position:absolute;top:8px;left:50%;transform:translate(-50%);box-shadow:0 1px 3px #0000000f}.toolbar-item[data-v-088ccef5]{justify-content:center;align-items:center;display:inline-flex}.color-item[data-v-088ccef5]{width:24px;height:24px;position:relative}.color-swatch[data-v-088ccef5]{cursor:pointer;border:1px solid #d1d5db;border-radius:4px;width:100%;height:100%;display:block}.color-input[data-v-088ccef5]{opacity:0;cursor:pointer;width:100%;height:100%;position:absolute;inset:0}.toolbar-select[data-v-088ccef5]{color:#374151;cursor:pointer;background:#fff;border:1px solid #d1d5db;border-radius:4px;outline:none;height:24px;padding:0 4px;font-size:12px}.toolbar-select[data-v-088ccef5]:hover{border-color:#9ca3af}.toolbar-btn[data-v-088ccef5]{color:#6b7280;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:4px;justify-content:center;align-items:center;width:24px;height:24px;padding:0;transition:border-color .15s,background .15s,color .15s;display:inline-flex}.toolbar-btn[data-v-088ccef5]:hover{color:#374151;background:#f3f4f6;border-color:#d1d5db}.delete-btn[data-v-088ccef5]:hover{color:#dc2626;background:#fef2f2;border-color:#fca5a5}.delete-icon[data-v-088ccef5]{width:14px;height:14px}.left-toolbar[data-v-b530debe]{box-sizing:border-box;-webkit-user-select:none;user-select:none;background:#fafbfc;border:1px solid #e5e7eb;border-radius:6px;flex-direction:column;flex:0 0 40px;align-items:center;gap:6px;padding:8px 5px;display:flex;box-shadow:0 1px 3px #0000000f}.left-toolbar__group[data-v-b530debe]{flex-direction:column;gap:4px;display:flex}.left-toolbar__divider[data-v-b530debe]{background:#e5e7eb;width:18px;height:1px}.left-toolbar__button[data-v-b530debe]{color:#6b7280;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:4px;justify-content:center;align-items:center;width:28px;height:28px;padding:0;transition:border-color .15s,background .15s,color .15s;display:inline-flex;position:relative}.left-toolbar__button[data-v-b530debe]:hover{color:#374151;background:#f3f4f6;border-color:#d1d5db}.left-toolbar__button.active[data-v-b530debe]{color:#1f2937;background:#e5e7eb;border-color:#9ca3af}.left-toolbar__button[data-v-b530debe]:focus-visible{border-color:#6b7280;outline:none}.tool-icon[data-v-b530debe]{width:16px;height:16px}.corner-indicator[data-v-b530debe]{cursor:pointer;width:8px;height:8px;position:absolute;bottom:0;right:0;overflow:hidden}.corner-indicator[data-v-b530debe]:after{content:"";opacity:.45;border-bottom:5px solid;border-left:5px solid #0000;width:0;height:0;transition:opacity .15s;position:absolute;bottom:0;right:0}.left-toolbar__button:hover .corner-indicator[data-v-b530debe]:after,.left-toolbar__button.active .corner-indicator[data-v-b530debe]:after{opacity:.7}.corner-indicator.open[data-v-b530debe]:after{opacity:.8}.tool-dropdown[data-v-b530debe]{-webkit-backdrop-filter:blur(8px);box-sizing:border-box;z-index:100;background:#fafbfcd1;border:1px solid #e5e7eb;border-radius:6px;flex-direction:row;align-items:center;gap:4px;height:40px;padding:0 5px;display:flex;position:absolute;top:50%;left:calc(100% + 13px);transform:translateY(-50%);box-shadow:0 1px 3px #0000000f}.tool-item[data-v-b530debe]{position:relative}.dropdown-enter-active[data-v-b530debe],.dropdown-leave-active[data-v-b530debe]{transition:opacity .15s,transform .15s}.dropdown-enter-from[data-v-b530debe],.dropdown-leave-to[data-v-b530debe]{opacity:0;transform:translateY(-50%)translate(-6px)}@media (width<=768px),(height<=640px){.left-toolbar[data-v-b530debe]{border-radius:5px;flex-basis:36px;gap:5px;padding:6px 4px}.left-toolbar__group[data-v-b530debe]{gap:3px}.left-toolbar__button[data-v-b530debe]{border-radius:3px;width:26px;height:26px}.left-toolbar__divider[data-v-b530debe]{width:16px}.corner-indicator[data-v-b530debe]{width:7px;height:7px}.corner-indicator[data-v-b530debe]:after{border-bottom-width:4px;border-left-width:4px}.tool-dropdown[data-v-b530debe]{height:36px}}.chart-wrapper[data-v-3f35943c]{--kmap-height:var(--kmap-chart-height,100%);--kmap-width:var(--kmap-chart-width,100%);width:var(--kmap-width);height:var(--kmap-height);flex-direction:column;justify-content:center;align-items:center;min-height:300px;display:flex}.chart-stage[data-v-3f35943c]{align-items:stretch;gap:8px;width:95%;height:85%;min-height:255px;display:flex}.chart-main[data-v-3f35943c]{flex:auto;align-items:stretch;gap:0;min-width:0;height:100%;display:flex;position:relative}.pane-separator-layer[data-v-3f35943c]{pointer-events:none;z-index:20;position:absolute;inset:0}.pane-separator-line[data-v-3f35943c]{opacity:1;background:#fff;height:3px;transition:background-color .12s,box-shadow .12s,opacity .12s;position:absolute;left:1px;right:1px;transform:translateY(-50%);box-shadow:inset 0 1px #e5e7eb}.pane-separator-line.is-active[data-v-3f35943c]{height:2px;box-shadow:none;background:#3b82f6;transform:translateY(-50%)}.chart-stage.is-resizing-pane[data-v-3f35943c],.chart-stage.is-hovering-pane-separator[data-v-3f35943c]{cursor:ns-resize}.chart-stage.is-hovering-kline[data-v-3f35943c]{cursor:pointer}.chart-stage.is-hovering-right-axis[data-v-3f35943c]{cursor:ns-resize}.chart-stage.is-dragging[data-v-3f35943c]{cursor:grabbing}.chart-container[data-v-3f35943c]{height:100%;min-height:inherit;scrollbar-width:none;-ms-overflow-style:none;box-sizing:border-box;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;touch-action:none;background:#fff;border:1px solid #e5e7eb;border-right:0;border-radius:6px 0 0 6px;flex:auto;position:relative;overflow:auto hidden}.chart-container[data-v-3f35943c]::-webkit-scrollbar{display:none}.chart-container[data-v-3f35943c]:hover{cursor:crosshair}.chart-stage.is-resizing-pane .chart-container[data-v-3f35943c],.chart-stage.is-hovering-pane-separator .chart-container[data-v-3f35943c]{cursor:ns-resize}.chart-stage.is-hovering-kline .chart-container[data-v-3f35943c]{cursor:pointer}.chart-stage.is-dragging .chart-container[data-v-3f35943c]{cursor:grabbing}.right-axis-host[data-v-3f35943c]{height:100%;min-height:inherit;box-sizing:border-box;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;touch-action:none;background:#fff;border-top-right-radius:6px;border-bottom-right-radius:6px;flex:none;position:relative;overflow:visible}.right-axis-host[data-v-3f35943c]:after{content:"";pointer-events:none;box-sizing:border-box;border:1px solid #e5e7eb;border-top-right-radius:6px;border-bottom-right-radius:6px;position:absolute;inset:0}.scroll-content[data-v-3f35943c]{height:100%;min-height:inherit;position:relative}.canvas-layer[data-v-3f35943c]{pointer-events:none;position:sticky;top:0;left:0}.tooltip-anchor[data-v-3f35943c]{pointer-events:none;width:1px;height:1px;position:absolute}.tooltip-anchor.kline-tooltip-anchor.use-anchor[data-v-3f35943c]{anchor-name:--kline-tooltip-anchor}.tooltip-anchor.marker-tooltip-anchor.use-anchor[data-v-3f35943c]{anchor-name:--marker-tooltip-anchor}@media (width<=768px),(height<=640px){.chart-stage[data-v-3f35943c]{gap:6px}}.plot-canvas{display:block;position:absolute;top:0;left:0}.right-axis{display:block;position:absolute;left:0}.x-axis-canvas{z-index:10;display:block;position:absolute;bottom:0;left:0}.right-axis{z-index:999}
 /*$vite$:1*/

package/dist/src/components/LeftToolbar.vue.d.ts

@@ -10,8 +10,12 @@ type __VLS_Props = {
 declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
     selectTool: (toolId: string) => any;
     toggleFullscreen: () => any;
+    zoomIn: () => any;
+    zoomOut: () => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
     onSelectTool?: ((toolId: string) => any) | undefined;
     onToggleFullscreen?: (() => any) | undefined;
+    onZoomIn?: (() => any) | undefined;
+    onZoomOut?: (() => any) | undefined;
 }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLElement>;
 export default _default;

package/dist/src/core/controller/interaction.d.ts

@@ -42,6 +42,13 @@ export declare class InteractionController {
     private hoveredRightAxisPaneId;
     /** [触屏]:触摸会话标记，避免触摸触发的模拟 mouse 事件干扰 */
     private isTouchSession;
+    /** [触屏]:多点触摸跟踪，用于双指捏合缩放 */
+    private activePointers;
+    private lastPinchDistance;
+    private pinchCenter;
+    private isPinching;
+    /** 捏合缩放回调 */
+    private onPinchZoomCallback?;
     /** 十字线位置 */
     crosshairPos: {
         x: number;
@@ -96,6 +103,8 @@ export declare class InteractionController {
     /** K 线宽度（物理像素），用于计算 K 线中心偏移 */
     private kWidthPx;
     constructor(chart: Chart);
+    /** 设置捏合缩放回调 */
+    setOnPinchZoom(callback: (delta: number, centerX: number) => void): void;
     getInteractionSnapshot(): InteractionSnapshot;
     setOnInteractionChange(callback: (snapshot: InteractionSnapshot) => void): void;
     private notifyInteractionChange;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@363045841yyt/klinechart",
-  "version": "0.5.0",
+  "version": "0.5.1",
   "license": "MIT",
   "type": "module",
   "engines": {