@tradecanvas/chart 0.5.0 → 0.7.0

package/dist/widget/index.js

@@ -0,0 +1,1316 @@
+import { t as e } from "../Chart-BodmeuC5.js";
+import { DARK_THEME as t, LIGHT_THEME as n } from "@tradecanvas/commons";
+//#region src/widget/widgetConfig.ts
+var r = [
+	{
+		label: "1m",
+		value: "1m"
+	},
+	{
+		label: "5m",
+		value: "5m"
+	},
+	{
+		label: "15m",
+		value: "15m"
+	},
+	{
+		label: "1H",
+		value: "1h"
+	},
+	{
+		label: "4H",
+		value: "4h"
+	},
+	{
+		label: "1D",
+		value: "1d"
+	}
+], i = [
+	{
+		label: "Candlestick",
+		value: "candlestick"
+	},
+	{
+		label: "Line",
+		value: "line"
+	},
+	{
+		label: "Area",
+		value: "area"
+	},
+	{
+		label: "Bar",
+		value: "bar"
+	},
+	{
+		label: "Heikin-Ashi",
+		value: "heikinAshi"
+	},
+	{
+		label: "Hollow Candle",
+		value: "hollowCandle"
+	},
+	{
+		label: "Baseline",
+		value: "baseline"
+	},
+	{
+		label: "Volume Candles",
+		value: "volumeCandles"
+	},
+	{
+		label: "HLC Area",
+		value: "hlcArea"
+	},
+	{
+		label: "Step Line",
+		value: "stepLine"
+	},
+	{
+		label: "Line + Markers",
+		value: "lineWithMarkers"
+	}
+], a = [
+	{
+		label: "Lines",
+		tools: [
+			{
+				label: "Trend Line",
+				value: "trendLine"
+			},
+			{
+				label: "Ray",
+				value: "ray"
+			},
+			{
+				label: "Extended Line",
+				value: "extendedLine"
+			}
+		]
+	},
+	{
+		label: "Horizontal/Vertical",
+		tools: [{
+			label: "Horizontal Line",
+			value: "horizontalLine"
+		}, {
+			label: "Vertical Line",
+			value: "verticalLine"
+		}]
+	},
+	{
+		label: "Channels",
+		tools: [{
+			label: "Parallel Channel",
+			value: "parallelChannel"
+		}, {
+			label: "Regression Channel",
+			value: "regressionChannel"
+		}]
+	},
+	{
+		label: "Fibonacci",
+		tools: [{
+			label: "Fib Retracement",
+			value: "fibRetracement"
+		}, {
+			label: "Fib Extension",
+			value: "fibExtension"
+		}]
+	},
+	{
+		label: "Shapes",
+		tools: [
+			{
+				label: "Rectangle",
+				value: "rectangle"
+			},
+			{
+				label: "Ellipse",
+				value: "ellipse"
+			},
+			{
+				label: "Triangle",
+				value: "triangle"
+			}
+		]
+	},
+	{
+		label: "Gann & Advanced",
+		tools: [
+			{
+				label: "Pitchfork",
+				value: "pitchfork"
+			},
+			{
+				label: "Gann Fan",
+				value: "gannFan"
+			},
+			{
+				label: "Gann Box",
+				value: "gannBox"
+			},
+			{
+				label: "Elliott Wave",
+				value: "elliottWave"
+			}
+		]
+	},
+	{
+		label: "Measure",
+		tools: [
+			{
+				label: "Price Range",
+				value: "priceRange"
+			},
+			{
+				label: "Date Range",
+				value: "dateRange"
+			},
+			{
+				label: "Measure",
+				value: "measure"
+			}
+		]
+	},
+	{
+		label: "Annotation",
+		tools: [{
+			label: "Text",
+			value: "text"
+		}, {
+			label: "Arrow",
+			value: "arrow"
+		}]
+	}
+], o = [
+	{
+		id: "sma",
+		name: "SMA",
+		type: "overlay"
+	},
+	{
+		id: "ema",
+		name: "EMA",
+		type: "overlay"
+	},
+	{
+		id: "hma",
+		name: "Hull MA",
+		type: "overlay"
+	},
+	{
+		id: "bb",
+		name: "Bollinger Bands",
+		type: "overlay"
+	},
+	{
+		id: "vwap",
+		name: "VWAP",
+		type: "overlay"
+	},
+	{
+		id: "avwap",
+		name: "Anchored VWAP",
+		type: "overlay"
+	},
+	{
+		id: "ichimoku",
+		name: "Ichimoku Cloud",
+		type: "overlay"
+	},
+	{
+		id: "psar",
+		name: "Parabolic SAR",
+		type: "overlay"
+	},
+	{
+		id: "supertrend",
+		name: "Supertrend",
+		type: "overlay"
+	},
+	{
+		id: "keltner",
+		name: "Keltner Channel",
+		type: "overlay"
+	},
+	{
+		id: "donchian",
+		name: "Donchian Channel",
+		type: "overlay"
+	},
+	{
+		id: "pivots",
+		name: "Pivot Points",
+		type: "overlay"
+	},
+	{
+		id: "zigzag",
+		name: "ZigZag",
+		type: "overlay"
+	},
+	{
+		id: "lrc",
+		name: "Linear Regression Channel",
+		type: "overlay"
+	},
+	{
+		id: "rsi",
+		name: "RSI",
+		type: "panel"
+	},
+	{
+		id: "macd",
+		name: "MACD",
+		type: "panel"
+	},
+	{
+		id: "stochastic",
+		name: "Stochastic",
+		type: "panel"
+	},
+	{
+		id: "atr",
+		name: "ATR",
+		type: "panel"
+	},
+	{
+		id: "adx",
+		name: "ADX",
+		type: "panel"
+	},
+	{
+		id: "obv",
+		name: "OBV",
+		type: "panel"
+	},
+	{
+		id: "williamsR",
+		name: "Williams %R",
+		type: "panel"
+	},
+	{
+		id: "cci",
+		name: "CCI",
+		type: "panel"
+	},
+	{
+		id: "mfi",
+		name: "MFI",
+		type: "panel"
+	},
+	{
+		id: "roc",
+		name: "ROC",
+		type: "panel"
+	},
+	{
+		id: "tsi",
+		name: "TSI",
+		type: "panel"
+	},
+	{
+		id: "cmf",
+		name: "CMF",
+		type: "panel"
+	},
+	{
+		id: "aroon",
+		name: "Aroon",
+		type: "panel"
+	},
+	{
+		id: "stddev",
+		name: "Std Deviation",
+		type: "panel"
+	},
+	{
+		id: "vroc",
+		name: "Volume ROC",
+		type: "panel"
+	},
+	{
+		id: "ad",
+		name: "Acc/Dist",
+		type: "panel"
+	},
+	{
+		id: "ao",
+		name: "Awesome Oscillator",
+		type: "panel"
+	},
+	{
+		id: "chaikinOsc",
+		name: "Chaikin Oscillator",
+		type: "panel"
+	},
+	{
+		id: "volumeProfile",
+		name: "Volume Profile",
+		type: "panel"
+	}
+], s = [
+	"sma",
+	"ema",
+	"bb",
+	"rsi",
+	"macd",
+	"stochastic",
+	"vwap",
+	"atr",
+	"obv",
+	"ichimoku"
+], c = [
+	"BTCUSDT",
+	"ETHUSDT",
+	"SOLUSDT",
+	"BNBUSDT"
+], l = {
+	candleUpColor: "#26A69A",
+	candleDownColor: "#EF5350",
+	candleUpWick: "#26A69A",
+	candleDownWick: "#EF5350",
+	backgroundColor: "#131722",
+	gridColor: "#1E222D",
+	gridVisible: !0,
+	volumeVisible: !0,
+	legendVisible: !0,
+	barCountdown: !0,
+	logScale: !1,
+	autoScale: !0,
+	crosshairMode: "magnet",
+	numberLocale: "en-US"
+}, u = "/* === TradeCanvas Widget Styles === */\r\n\r\n.tcw-root {\r\n  display: flex;\r\n  flex-direction: column;\r\n  width: 100%;\r\n  height: 100%;\r\n  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;\r\n  font-size: 13px;\r\n  color: #d1d4dc;\r\n  background: #131722;\r\n  position: relative;\r\n  overflow: hidden;\r\n\r\n  /* Dark theme tokens (default) */\r\n  --tcw-bg: #131722;\r\n  --tcw-bg-elevated: #1E222D;\r\n  --tcw-border: #2A2E39;\r\n  --tcw-text: #d1d4dc;\r\n  --tcw-text-dim: #b2b5be;\r\n  --tcw-text-muted: #787b86;\r\n  --tcw-accent: #2962ff;\r\n  --tcw-accent-dim: rgba(41,98,255,0.15);\r\n  --tcw-accent-glow: rgba(41,98,255,0.12);\r\n  --tcw-red: #ef5350;\r\n  --tcw-green: #26a69a;\r\n  --tcw-transition: 0.15s ease;\r\n  --tcw-radius-lg: 8px;\r\n  --tcw-font-mono: 'SF Mono', 'Fira Code', 'Consolas', monospace;\r\n  --tcw-hover-bg: rgba(255,255,255,0.04);\r\n}\r\n\r\n.tcw-root[data-tcw-theme=\"light\"] {\r\n  color: #131722;\r\n  background: #ffffff;\r\n\r\n  --tcw-bg: #ffffff;\r\n  --tcw-bg-elevated: #f0f3fa;\r\n  --tcw-border: #e0e3eb;\r\n  --tcw-text: #131722;\r\n  --tcw-text-dim: #434651;\r\n  --tcw-text-muted: #787b86;\r\n  --tcw-accent: #2962ff;\r\n  --tcw-accent-dim: rgba(41,98,255,0.1);\r\n  --tcw-accent-glow: rgba(41,98,255,0.08);\r\n  --tcw-red: #ef5350;\r\n  --tcw-green: #26a69a;\r\n  --tcw-hover-bg: rgba(0,0,0,0.04);\r\n}\r\n\r\n/* === Toolbar === */\r\n\r\n.tcw-toolbar {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 0;\r\n  padding: 0 12px;\r\n  height: 40px;\r\n  border-bottom: 1px solid var(--tcw-border);\r\n  background: var(--tcw-bg-elevated);\r\n  flex-shrink: 0;\r\n  position: relative;\r\n  z-index: 20;\r\n}\r\n\r\n.tcw-toolbar-symbol {\r\n  font-size: 13px;\r\n  font-weight: 700;\r\n  color: var(--tcw-text);\r\n  padding: 0 10px;\r\n  white-space: nowrap;\r\n  letter-spacing: -0.01em;\r\n  cursor: pointer;\r\n  border: none;\r\n  background: none;\r\n  font-family: inherit;\r\n}\r\n\r\n.tcw-toolbar-sep {\r\n  width: 1px;\r\n  height: 20px;\r\n  background: var(--tcw-border);\r\n  flex-shrink: 0;\r\n}\r\n\r\n.tcw-toolbar-group {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 2px;\r\n  padding: 0 8px;\r\n}\r\n\r\n.tcw-toolbar-spacer {\r\n  flex: 1;\r\n}\r\n\r\n.tcw-btn {\r\n  padding: 4px 8px;\r\n  font-size: 12px;\r\n  font-family: inherit;\r\n  border: none;\r\n  border-radius: 4px;\r\n  background: transparent;\r\n  color: var(--tcw-text-dim);\r\n  cursor: pointer;\r\n  transition: all var(--tcw-transition);\r\n  white-space: nowrap;\r\n  line-height: 1;\r\n}\r\n\r\n.tcw-btn:hover {\r\n  background: var(--tcw-hover-bg);\r\n  color: var(--tcw-text);\r\n}\r\n\r\n.tcw-btn.tcw-active {\r\n  background: var(--tcw-accent);\r\n  color: white;\r\n}\r\n\r\n.tcw-btn-icon {\r\n  width: 32px;\r\n  height: 32px;\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  font-family: inherit;\r\n  border: none;\r\n  border-radius: 4px;\r\n  background: transparent;\r\n  color: var(--tcw-text-muted);\r\n  cursor: pointer;\r\n  transition: all var(--tcw-transition);\r\n  line-height: 1;\r\n  position: relative;\r\n}\r\n\r\n.tcw-btn-icon:hover {\r\n  background: var(--tcw-hover-bg);\r\n  color: var(--tcw-text);\r\n}\r\n\r\n.tcw-badge-count {\r\n  font-size: 10px;\r\n  color: var(--tcw-accent);\r\n  background: var(--tcw-accent-dim);\r\n  padding: 0 4px;\r\n  border-radius: 8px;\r\n  font-weight: 600;\r\n}\r\n\r\n.tcw-indicator-chips {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 4px;\r\n  padding: 0 4px;\r\n  flex-wrap: nowrap;\r\n  overflow: hidden;\r\n}\r\n\r\n.tcw-indicator-chip {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 4px;\r\n  padding: 2px 6px 2px 8px;\r\n  font-size: 11px;\r\n  font-weight: 500;\r\n  background: var(--tcw-accent-dim);\r\n  color: var(--tcw-accent);\r\n  border-radius: 4px;\r\n  white-space: nowrap;\r\n  line-height: 1.4;\r\n}\r\n\r\n.tcw-chip-remove {\r\n  cursor: pointer;\r\n  opacity: 0.6;\r\n  padding: 0 2px;\r\n  transition: opacity var(--tcw-transition);\r\n  border: none;\r\n  background: none;\r\n  color: inherit;\r\n  display: inline-flex;\r\n  align-items: center;\r\n}\r\n\r\n.tcw-chip-remove:hover {\r\n  opacity: 1;\r\n}\r\n\r\n/* === Dropdown === */\r\n\r\n.tcw-dropdown-trigger {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 4px;\r\n  padding: 4px 8px;\r\n  font-size: 12px;\r\n  font-family: inherit;\r\n  border: none;\r\n  border-radius: 4px;\r\n  background: transparent;\r\n  color: var(--tcw-text-dim);\r\n  cursor: pointer;\r\n  transition: all var(--tcw-transition);\r\n  white-space: nowrap;\r\n  line-height: 1;\r\n}\r\n\r\n.tcw-dropdown-trigger:hover {\r\n  background: var(--tcw-hover-bg);\r\n  color: var(--tcw-text);\r\n}\r\n\r\n.tcw-dropdown {\r\n  position: absolute;\r\n  top: 100%;\r\n  margin-top: 4px;\r\n  background: var(--tcw-bg-elevated);\r\n  border: 1px solid var(--tcw-border);\r\n  border-radius: var(--tcw-radius-lg);\r\n  box-shadow: 0 8px 32px rgba(0,0,0,0.4);\r\n  z-index: 50;\r\n  padding: 4px 0;\r\n  max-height: 400px;\r\n  overflow-y: auto;\r\n}\r\n\r\n.tcw-dropdown-item {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  padding: 6px 12px;\r\n  font-size: 12px;\r\n  color: var(--tcw-text-dim);\r\n  cursor: pointer;\r\n  transition: background var(--tcw-transition), color var(--tcw-transition);\r\n  width: 100%;\r\n  border: none;\r\n  background: none;\r\n  font-family: inherit;\r\n  text-align: left;\r\n}\r\n\r\n.tcw-dropdown-item:hover {\r\n  background: var(--tcw-hover-bg);\r\n  color: var(--tcw-text);\r\n}\r\n\r\n.tcw-dropdown-item.tcw-active {\r\n  color: var(--tcw-accent);\r\n}\r\n\r\n.tcw-dropdown-label {\r\n  text-transform: uppercase;\r\n  font-size: 10px;\r\n  color: var(--tcw-text-muted);\r\n  letter-spacing: 0.05em;\r\n  padding: 6px 12px;\r\n  font-weight: 600;\r\n}\r\n\r\n.tcw-dropdown-divider {\r\n  border-top: 1px solid var(--tcw-border);\r\n  margin: 4px 0;\r\n}\r\n\r\n.tcw-tag {\r\n  font-size: 10px;\r\n  color: var(--tcw-text-muted);\r\n  padding: 1px 5px;\r\n  border-radius: 3px;\r\n  background: var(--tcw-hover-bg);\r\n}\r\n\r\n/* === Body === */\r\n\r\n.tcw-body {\r\n  display: flex;\r\n  flex: 1;\r\n  min-height: 0;\r\n}\r\n\r\n.tcw-chart-container {\r\n  flex: 1;\r\n  min-width: 0;\r\n  min-height: 0;\r\n  width: 100%;\r\n  height: 100%;\r\n}\r\n\r\n/* === Sidebar === */\r\n\r\n.tcw-sidebar {\r\n  width: 36px;\r\n  flex-shrink: 0;\r\n  background: var(--tcw-bg-elevated);\r\n  border-right: 1px solid var(--tcw-border);\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  padding: 4px 0;\r\n  overflow: visible;\r\n}\r\n\r\n.tcw-tool-group-wrap {\r\n  position: relative;\r\n}\r\n\r\n.tcw-sidebar-btn {\r\n  width: 36px;\r\n  height: 32px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  border: none;\r\n  background: transparent;\r\n  color: var(--tcw-text-muted);\r\n  cursor: pointer;\r\n  font-family: inherit;\r\n  transition: all var(--tcw-transition);\r\n  position: relative;\r\n  flex-shrink: 0;\r\n  line-height: 1;\r\n}\r\n\r\n.tcw-sidebar-btn:hover {\r\n  color: var(--tcw-text);\r\n  background: var(--tcw-hover-bg);\r\n}\r\n\r\n.tcw-sidebar-btn.tcw-active {\r\n  color: var(--tcw-accent);\r\n  background: var(--tcw-accent-glow);\r\n}\r\n\r\n.tcw-sidebar-btn.tcw-danger:hover {\r\n  color: var(--tcw-red);\r\n  background: rgba(239,68,68,0.1);\r\n}\r\n\r\n.tcw-multi-dot {\r\n  position: absolute;\r\n  bottom: 2px;\r\n  right: 2px;\r\n  width: 4px;\r\n  height: 4px;\r\n  border-radius: 50%;\r\n  background: var(--tcw-text-muted);\r\n}\r\n\r\n.tcw-sidebar-divider {\r\n  width: 20px;\r\n  height: 1px;\r\n  background: var(--tcw-border);\r\n  margin: 4px 0;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.tcw-sidebar-spacer {\r\n  flex: 1;\r\n}\r\n\r\n/* === Flyout === */\r\n\r\n.tcw-flyout {\r\n  position: absolute;\r\n  left: 100%;\r\n  top: 0;\r\n  margin-left: 2px;\r\n  min-width: 160px;\r\n  background: var(--tcw-bg-elevated);\r\n  border: 1px solid var(--tcw-border);\r\n  border-radius: var(--tcw-radius-lg);\r\n  box-shadow: 0 8px 32px rgba(0,0,0,0.4);\r\n  z-index: 30;\r\n  padding: 4px 0;\r\n}\r\n\r\n.tcw-flyout-header {\r\n  text-transform: uppercase;\r\n  font-size: 10px;\r\n  color: var(--tcw-text-muted);\r\n  letter-spacing: 0.05em;\r\n  padding: 6px 12px;\r\n  font-weight: 600;\r\n}\r\n\r\n.tcw-flyout-item {\r\n  padding: 6px 12px;\r\n  font-size: 12px;\r\n  color: var(--tcw-text-dim);\r\n  cursor: pointer;\r\n  width: 100%;\r\n  display: block;\r\n  border: none;\r\n  background: none;\r\n  text-align: left;\r\n  font-family: inherit;\r\n  transition: background var(--tcw-transition), color var(--tcw-transition);\r\n}\r\n\r\n.tcw-flyout-item:hover {\r\n  background: var(--tcw-hover-bg);\r\n  color: var(--tcw-text);\r\n}\r\n\r\n.tcw-flyout-item.tcw-active {\r\n  color: var(--tcw-accent);\r\n}\r\n\r\n/* === Modal === */\r\n\r\n.tcw-modal-backdrop {\r\n  position: fixed;\r\n  inset: 0;\r\n  background: rgba(0,0,0,0.5);\r\n  backdrop-filter: blur(4px);\r\n  -webkit-backdrop-filter: blur(4px);\r\n  z-index: 100;\r\n}\r\n\r\n.tcw-modal {\r\n  position: fixed;\r\n  z-index: 101;\r\n  top: 50%;\r\n  left: 50%;\r\n  transform: translate(-50%, -50%);\r\n  background: var(--tcw-bg-elevated);\r\n  border: 1px solid var(--tcw-border);\r\n  border-radius: var(--tcw-radius-lg);\r\n  width: 480px;\r\n  max-width: 90vw;\r\n  max-height: 80vh;\r\n  display: flex;\r\n  flex-direction: column;\r\n  box-shadow: 0 24px 64px rgba(0,0,0,0.5);\r\n}\r\n\r\n.tcw-modal-header {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  padding: 16px 20px;\r\n  border-bottom: 1px solid var(--tcw-border);\r\n}\r\n\r\n.tcw-modal-header h3 {\r\n  font-size: 15px;\r\n  font-weight: 600;\r\n  margin: 0;\r\n  color: var(--tcw-text);\r\n}\r\n\r\n.tcw-modal-close {\r\n  width: 28px;\r\n  height: 28px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  border: none;\r\n  background: transparent;\r\n  color: var(--tcw-text-muted);\r\n  cursor: pointer;\r\n  border-radius: 4px;\r\n  transition: all var(--tcw-transition);\r\n}\r\n\r\n.tcw-modal-close:hover {\r\n  background: var(--tcw-hover-bg);\r\n  color: var(--tcw-text);\r\n}\r\n\r\n.tcw-modal-tabs {\r\n  display: flex;\r\n  gap: 0;\r\n  padding: 0 20px;\r\n  border-bottom: 1px solid var(--tcw-border);\r\n}\r\n\r\n.tcw-modal-tab {\r\n  padding: 10px 16px;\r\n  font-size: 12px;\r\n  font-weight: 500;\r\n  color: var(--tcw-text-muted);\r\n  border: none;\r\n  background: none;\r\n  cursor: pointer;\r\n  border-bottom: 2px solid transparent;\r\n  margin-bottom: -1px;\r\n  transition: color var(--tcw-transition);\r\n  font-family: inherit;\r\n  text-transform: capitalize;\r\n}\r\n\r\n.tcw-modal-tab:hover {\r\n  color: var(--tcw-text-dim);\r\n}\r\n\r\n.tcw-modal-tab.tcw-active {\r\n  color: var(--tcw-accent);\r\n  border-bottom-color: var(--tcw-accent);\r\n}\r\n\r\n.tcw-modal-body {\r\n  padding: 20px;\r\n  overflow-y: auto;\r\n  flex: 1;\r\n}\r\n\r\n.tcw-settings-section {\r\n  margin-bottom: 20px;\r\n}\r\n\r\n.tcw-settings-section:last-child {\r\n  margin-bottom: 0;\r\n}\r\n\r\n.tcw-settings-section-title {\r\n  font-size: 11px;\r\n  font-weight: 600;\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.05em;\r\n  color: var(--tcw-text-muted);\r\n  margin-bottom: 12px;\r\n}\r\n\r\n.tcw-settings-row {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  padding: 8px 0;\r\n}\r\n\r\n.tcw-settings-row + .tcw-settings-row {\r\n  border-top: 1px solid rgba(255,255,255,0.03);\r\n}\r\n\r\n.tcw-root[data-tcw-theme=\"light\"] .tcw-settings-row + .tcw-settings-row {\r\n  border-top: 1px solid rgba(0,0,0,0.04);\r\n}\r\n\r\n.tcw-settings-label {\r\n  font-size: 13px;\r\n  color: var(--tcw-text-dim);\r\n}\r\n\r\n.tcw-color-picker-wrap {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 6px;\r\n}\r\n\r\n.tcw-color-picker-wrap input[type='color'] {\r\n  width: 28px;\r\n  height: 28px;\r\n  border: 1px solid var(--tcw-border);\r\n  border-radius: 4px;\r\n  background: none;\r\n  cursor: pointer;\r\n  padding: 2px;\r\n}\r\n\r\n.tcw-color-picker-wrap input[type='color']::-webkit-color-swatch-wrapper {\r\n  padding: 0;\r\n}\r\n\r\n.tcw-color-picker-wrap input[type='color']::-webkit-color-swatch {\r\n  border: none;\r\n  border-radius: 2px;\r\n}\r\n\r\n.tcw-color-hex {\r\n  font-size: 11px;\r\n  font-family: var(--tcw-font-mono);\r\n  color: var(--tcw-text-muted);\r\n  min-width: 60px;\r\n}\r\n\r\n.tcw-toggle {\r\n  width: 36px;\r\n  height: 20px;\r\n  background: rgba(255,255,255,0.1);\r\n  border-radius: 10px;\r\n  position: relative;\r\n  cursor: pointer;\r\n  transition: background var(--tcw-transition);\r\n  border: none;\r\n  padding: 0;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.tcw-toggle::after {\r\n  content: '';\r\n  position: absolute;\r\n  top: 2px;\r\n  left: 2px;\r\n  width: 16px;\r\n  height: 16px;\r\n  border-radius: 50%;\r\n  background: var(--tcw-text-muted);\r\n  transition: all var(--tcw-transition);\r\n}\r\n\r\n.tcw-toggle.tcw-on {\r\n  background: var(--tcw-accent);\r\n}\r\n\r\n.tcw-toggle.tcw-on::after {\r\n  left: 18px;\r\n  background: white;\r\n}\r\n\r\n.tcw-root[data-tcw-theme=\"light\"] .tcw-toggle {\r\n  background: rgba(0,0,0,0.1);\r\n}\r\n\r\n.tcw-root[data-tcw-theme=\"light\"] .tcw-toggle::after {\r\n  background: #888;\r\n}\r\n\r\n.tcw-root[data-tcw-theme=\"light\"] .tcw-toggle.tcw-on {\r\n  background: var(--tcw-accent);\r\n}\r\n\r\n.tcw-root[data-tcw-theme=\"light\"] .tcw-toggle.tcw-on::after {\r\n  background: white;\r\n}\r\n\r\n.tcw-settings-select {\r\n  padding: 4px 8px;\r\n  font-size: 12px;\r\n  font-family: inherit;\r\n  background: var(--tcw-bg);\r\n  border: 1px solid var(--tcw-border);\r\n  border-radius: 4px;\r\n  color: var(--tcw-text);\r\n  cursor: pointer;\r\n}\r\n\r\n.tcw-modal-footer {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  padding: 12px 20px;\r\n  border-top: 1px solid var(--tcw-border);\r\n}\r\n\r\n.tcw-reset-link {\r\n  font-size: 12px;\r\n  color: var(--tcw-text-muted);\r\n  cursor: pointer;\r\n  border: none;\r\n  background: none;\r\n  font-family: inherit;\r\n  text-decoration: underline;\r\n  text-underline-offset: 2px;\r\n  transition: color var(--tcw-transition);\r\n}\r\n\r\n.tcw-reset-link:hover {\r\n  color: var(--tcw-text-dim);\r\n}\r\n\r\n.tcw-done-btn {\r\n  padding: 6px 16px;\r\n  font-size: 12px;\r\n  font-weight: 500;\r\n  background: var(--tcw-accent);\r\n  color: white;\r\n  border: none;\r\n  border-radius: 4px;\r\n  cursor: pointer;\r\n  font-family: inherit;\r\n  transition: background var(--tcw-transition);\r\n}\r\n\r\n.tcw-done-btn:hover {\r\n  background: #2563eb;\r\n}\r\n\r\n/* === Status Bar === */\r\n\r\n.tcw-statusbar {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  padding: 6px 16px;\r\n  border-top: 1px solid var(--tcw-border);\r\n  background: var(--tcw-bg-elevated);\r\n  font-size: 11px;\r\n  color: var(--tcw-text-muted);\r\n  flex-shrink: 0;\r\n}\r\n\r\n.tcw-status-indicator {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 6px;\r\n}\r\n\r\n.tcw-status-dot {\r\n  width: 6px;\r\n  height: 6px;\r\n  border-radius: 50%;\r\n  background: var(--tcw-text-muted);\r\n  transition: background 0.3s;\r\n}\r\n\r\n.tcw-status-dot.tcw-connected {\r\n  background: var(--tcw-green);\r\n}\r\n\r\n.tcw-status-dot.tcw-error {\r\n  background: var(--tcw-red);\r\n}\r\n\r\n/* === Command Palette === */\r\n\r\n.tcw-cmd-palette {\r\n  position: fixed;\r\n  z-index: 102;\r\n  top: 20%;\r\n  left: 50%;\r\n  transform: translateX(-50%);\r\n  background: var(--tcw-bg-elevated);\r\n  border: 1px solid var(--tcw-border);\r\n  border-radius: var(--tcw-radius-lg);\r\n  width: 520px;\r\n  max-width: 90vw;\r\n  max-height: 60vh;\r\n  display: flex;\r\n  flex-direction: column;\r\n  box-shadow: 0 24px 64px rgba(0,0,0,0.5);\r\n  overflow: hidden;\r\n}\r\n\r\n.tcw-cmd-header {\r\n  display: flex;\r\n  align-items: center;\r\n  padding: 12px 16px;\r\n  border-bottom: 1px solid var(--tcw-border);\r\n  gap: 10px;\r\n}\r\n\r\n.tcw-cmd-icon {\r\n  font-size: 18px;\r\n  color: var(--tcw-text-muted);\r\n  flex-shrink: 0;\r\n}\r\n\r\n.tcw-cmd-input {\r\n  flex: 1;\r\n  background: none;\r\n  border: none;\r\n  outline: none;\r\n  font-size: 14px;\r\n  font-family: inherit;\r\n  color: var(--tcw-text);\r\n  caret-color: var(--tcw-accent);\r\n}\r\n\r\n.tcw-cmd-input::placeholder {\r\n  color: var(--tcw-text-muted);\r\n}\r\n\r\n.tcw-cmd-hint {\r\n  font-size: 10px;\r\n  color: var(--tcw-text-muted);\r\n  border: 1px solid var(--tcw-border);\r\n  padding: 2px 6px;\r\n  border-radius: 3px;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.tcw-cmd-list {\r\n  overflow-y: auto;\r\n  flex: 1;\r\n  padding: 4px 0;\r\n  max-height: 360px;\r\n}\r\n\r\n.tcw-cmd-category {\r\n  text-transform: uppercase;\r\n  font-size: 10px;\r\n  color: var(--tcw-text-muted);\r\n  letter-spacing: 0.05em;\r\n  padding: 8px 16px 4px;\r\n  font-weight: 600;\r\n}\r\n\r\n.tcw-cmd-item {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  padding: 8px 16px;\r\n  font-size: 13px;\r\n  color: var(--tcw-text-dim);\r\n  cursor: pointer;\r\n  width: 100%;\r\n  border: none;\r\n  background: none;\r\n  font-family: inherit;\r\n  text-align: left;\r\n  transition: background 80ms ease;\r\n  gap: 8px;\r\n}\r\n\r\n.tcw-cmd-item:hover,\r\n.tcw-cmd-item.tcw-selected {\r\n  background: var(--tcw-hover-bg);\r\n  color: var(--tcw-text);\r\n}\r\n\r\n.tcw-cmd-item.tcw-active .tcw-cmd-item-label {\r\n  color: var(--tcw-accent);\r\n}\r\n\r\n.tcw-cmd-item-label {\r\n  flex: 1;\r\n}\r\n\r\n.tcw-cmd-check {\r\n  color: var(--tcw-accent);\r\n  font-size: 14px;\r\n  font-weight: 600;\r\n}\r\n\r\n.tcw-cmd-kbd {\r\n  font-size: 10px;\r\n  font-family: var(--tcw-font-mono);\r\n  color: var(--tcw-text-muted);\r\n  background: var(--tcw-bg);\r\n  border: 1px solid var(--tcw-border);\r\n  padding: 1px 5px;\r\n  border-radius: 3px;\r\n}\r\n\r\n.tcw-cmd-empty {\r\n  padding: 24px 16px;\r\n  text-align: center;\r\n  color: var(--tcw-text-muted);\r\n  font-size: 13px;\r\n}\r\n\r\n.tcw-cmd-footer {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 16px;\r\n  padding: 8px 16px;\r\n  border-top: 1px solid var(--tcw-border);\r\n  font-size: 11px;\r\n  color: var(--tcw-text-muted);\r\n}\r\n\r\n/* === Responsive === */\r\n\r\n@media (max-width: 768px) {\r\n  .tcw-toolbar {\r\n    padding: 0 8px;\r\n    height: 36px;\r\n  }\r\n  .tcw-toolbar-sep {\r\n    display: none;\r\n  }\r\n  .tcw-indicator-chips {\r\n    display: none;\r\n  }\r\n  .tcw-sidebar {\r\n    width: 32px;\r\n  }\r\n  .tcw-sidebar-btn {\r\n    width: 32px;\r\n    height: 28px;\r\n  }\r\n}\r\n", d = 0, f = "tcw-styles";
+function p() {
+	if (d++, d > 1 || document.getElementById(f)) return;
+	let e = document.createElement("style");
+	e.id = f, e.textContent = u, document.head.appendChild(e);
+}
+function m() {
+	if (d--, d > 0) return;
+	let e = document.getElementById(f);
+	e && e.remove();
+}
+//#endregion
+//#region src/widget/icons.ts
+var h = {
+	cursor: "<path d=\"M3 3l7.07 16.97 2.51-7.39 7.39-2.51L3 3z\"/><path d=\"M13 13l6 6\"/>",
+	trendingUp: "<polyline points=\"22 7 13.5 15.5 8.5 10.5 2 17\"/><polyline points=\"16 7 22 7 22 13\"/>",
+	minus: "<path d=\"M5 12h14\"/>",
+	penLine: "<path d=\"M12 20h9\"/><path d=\"M16.5 3.5a2.12 2.12 0 0 1 3 3L7 19l-4 1 1-4Z\"/>",
+	hash: "<line x1=\"4\" y1=\"9\" x2=\"20\" y2=\"9\"/><line x1=\"4\" y1=\"15\" x2=\"20\" y2=\"15\"/><line x1=\"10\" y1=\"3\" x2=\"8\" y2=\"21\"/><line x1=\"16\" y1=\"3\" x2=\"14\" y2=\"21\"/>",
+	square: "<rect width=\"18\" height=\"18\" x=\"3\" y=\"3\" rx=\"2\"/>",
+	gitBranch: "<line x1=\"6\" y1=\"3\" x2=\"6\" y2=\"15\"/><circle cx=\"18\" cy=\"6\" r=\"3\"/><circle cx=\"6\" cy=\"18\" r=\"3\"/><path d=\"M18 9a9 9 0 0 1-9 9\"/>",
+	ruler: "<path d=\"M21.3 15.3a2.4 2.4 0 0 1 0 3.4l-2.6 2.6a2.4 2.4 0 0 1-3.4 0L2.7 8.7a2.41 2.41 0 0 1 0-3.4l2.6-2.6a2.41 2.41 0 0 1 3.4 0Z\"/><path d=\"m14.5 12.5 2-2\"/><path d=\"m11.5 9.5 2-2\"/><path d=\"m8.5 6.5 2-2\"/><path d=\"m17.5 15.5 2-2\"/>",
+	type: "<polyline points=\"4 7 4 4 20 4 20 7\"/><line x1=\"9\" y1=\"20\" x2=\"15\" y2=\"20\"/><line x1=\"12\" y1=\"4\" x2=\"12\" y2=\"20\"/>",
+	magnet: "<path d=\"m6 15-4-4 6.75-6.77a7.79 7.79 0 0 1 11 11L13 22l-4-4 6.39-6.36a2.14 2.14 0 0 0-3-3L6 15\"/><path d=\"m5 8 4 4\"/><path d=\"m12 15 4 4\"/>",
+	undo: "<path d=\"M3 7v6h6\"/><path d=\"M21 17a9 9 0 0 0-9-9 9 9 0 0 0-6 2.3L3 13\"/>",
+	redo: "<path d=\"M21 7v6h-6\"/><path d=\"M3 17a9 9 0 0 1 9-9 9 9 0 0 1 6 2.3L21 13\"/>",
+	trash: "<path d=\"M3 6h18\"/><path d=\"M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6\"/><path d=\"M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2\"/><line x1=\"10\" y1=\"11\" x2=\"10\" y2=\"17\"/><line x1=\"14\" y1=\"11\" x2=\"14\" y2=\"17\"/>",
+	camera: "<path d=\"M14.5 4h-5L7 7H4a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2h-3l-2.5-3z\"/><circle cx=\"12\" cy=\"13\" r=\"3\"/>",
+	settings: "<path d=\"M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z\"/><circle cx=\"12\" cy=\"12\" r=\"3\"/>",
+	moon: "<path d=\"M12 3a6 6 0 0 0 9 9 9 9 0 1 1-9-9Z\"/>",
+	sun: "<circle cx=\"12\" cy=\"12\" r=\"4\"/><path d=\"M12 2v2\"/><path d=\"M12 20v2\"/><path d=\"m4.93 4.93 1.41 1.41\"/><path d=\"m17.66 17.66 1.41 1.41\"/><path d=\"M2 12h2\"/><path d=\"M20 12h2\"/><path d=\"m6.34 17.66-1.41 1.41\"/><path d=\"m19.07 4.93-1.41 1.41\"/>",
+	chevronDown: "<path d=\"m6 9 6 6 6-6\"/>",
+	chevronUp: "<path d=\"m18 15-6-6-6 6\"/>",
+	barChart: "<line x1=\"12\" y1=\"20\" x2=\"12\" y2=\"10\"/><line x1=\"18\" y1=\"20\" x2=\"18\" y2=\"4\"/><line x1=\"6\" y1=\"20\" x2=\"6\" y2=\"16\"/>",
+	x: "<path d=\"M18 6 6 18\"/><path d=\"m6 6 12 12\"/>",
+	play: "<polygon points=\"6 3 20 12 6 21 6 3\"/>",
+	pause: "<rect width=\"4\" height=\"16\" x=\"6\" y=\"4\"/><rect width=\"4\" height=\"16\" x=\"14\" y=\"4\"/>",
+	stop: "<rect width=\"14\" height=\"14\" x=\"5\" y=\"5\" rx=\"1\"/>",
+	receipt: "<path d=\"M4 2v20l2-1 2 1 2-1 2 1 2-1 2 1 2-1 2 1V2l-2 1-2-1-2 1-2-1-2 1-2-1-2 1Z\"/><path d=\"M16 8h-6a2 2 0 1 0 0 4h4a2 2 0 1 1 0 4H8\"/><path d=\"M12 17.5v-11\"/>"
+};
+function g(e, t = 14) {
+	let n = h[e];
+	return n ? `<svg xmlns="http://www.w3.org/2000/svg" width="${t}" height="${t}" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">${n}</svg>` : "";
+}
+//#endregion
+//#region src/widget/WidgetDropdown.ts
+var _ = class {
+	trigger;
+	panel;
+	_isOpen = !1;
+	onOutsideClick;
+	onEscapeKey;
+	onTriggerClick;
+	constructor(e, t = {}) {
+		this.trigger = e, this.panel = document.createElement("div"), this.panel.className = "tcw-dropdown", this.panel.style.width = t.width ?? "200px", t.align === "right" ? this.panel.style.right = "0" : this.panel.style.left = "0", this.panel.style.display = "none", e.style.position = "relative", e.appendChild(this.panel), this.onTriggerClick = () => {
+			this._isOpen ? this.close() : this.open();
+		}, this.onOutsideClick = (e) => {
+			this.trigger.contains(e.target) || this.close();
+		}, this.onEscapeKey = (e) => {
+			e.key === "Escape" && this.close();
+		}, e.addEventListener("click", this.onTriggerClick);
+	}
+	setContent(e) {
+		this.panel.innerHTML = e;
+	}
+	open() {
+		this._isOpen || (this._isOpen = !0, this.panel.style.display = "", document.addEventListener("mousedown", this.onOutsideClick), document.addEventListener("keydown", this.onEscapeKey));
+	}
+	close() {
+		this._isOpen && (this._isOpen = !1, this.panel.style.display = "none", document.removeEventListener("mousedown", this.onOutsideClick), document.removeEventListener("keydown", this.onEscapeKey));
+	}
+	isOpen() {
+		return this._isOpen;
+	}
+	destroy() {
+		this.trigger.removeEventListener("click", this.onTriggerClick), document.removeEventListener("mousedown", this.onOutsideClick), document.removeEventListener("keydown", this.onEscapeKey), this.panel.remove();
+	}
+}, v = class {
+	config;
+	callbacks;
+	el;
+	chartTypeDropdown = null;
+	indicatorDropdown = null;
+	tfButtons = [];
+	chipsContainer = null;
+	themeBtn = null;
+	constructor(e, t, n) {
+		this.config = t, this.callbacks = n, this.el = document.createElement("div"), this.el.className = "tcw-toolbar", this.build(), e.appendChild(this.el);
+	}
+	build() {
+		let { config: e, callbacks: t, el: n } = this, r = document.createElement("button");
+		r.className = "tcw-toolbar-symbol", r.dataset.role = "symbol", r.addEventListener("click", t.onSymbolClick), n.appendChild(r), n.appendChild(this.sep());
+		let i = document.createElement("div");
+		i.className = "tcw-toolbar-group";
+		for (let n of e.timeframes) {
+			let e = document.createElement("button");
+			e.className = "tcw-btn", e.textContent = n.label, e.dataset.tf = n.value, e.addEventListener("click", () => t.onTimeframe(n.value)), i.appendChild(e), this.tfButtons.push(e);
+		}
+		n.appendChild(i), n.appendChild(this.sep());
+		let a = document.createElement("div");
+		a.style.position = "relative", a.style.display = "inline-flex";
+		let o = document.createElement("button");
+		o.className = "tcw-dropdown-trigger", o.dataset.role = "charttype", a.appendChild(o), n.appendChild(a), this.chartTypeDropdown = new _(a, { width: "160px" }), this.buildChartTypeMenu(), n.appendChild(this.sep());
+		let s = document.createElement("div");
+		s.style.position = "relative", s.style.display = "inline-flex";
+		let c = document.createElement("button");
+		c.className = "tcw-dropdown-trigger", c.dataset.role = "indicators", s.appendChild(c), n.appendChild(s), this.indicatorDropdown = new _(s, { width: "280px" }), this.buildIndicatorMenu(), this.chipsContainer = document.createElement("div"), this.chipsContainer.className = "tcw-indicator-chips", n.appendChild(this.chipsContainer), n.appendChild(this.spacer());
+		let l = this.iconBtn("camera", "Screenshot", t.onScreenshot);
+		n.appendChild(l);
+		let u = this.iconBtn("settings", "Chart Settings", t.onSettings);
+		n.appendChild(u), this.themeBtn = this.iconBtn("moon", "Toggle theme", t.onToggleTheme), this.themeBtn.dataset.role = "theme", n.appendChild(this.themeBtn);
+	}
+	buildChartTypeMenu() {
+		if (!this.chartTypeDropdown) return;
+		let e = this.config.chartTypes.map((e) => `<button class="tcw-dropdown-item" data-ct="${e.value}">${e.label}</button>`).join("");
+		this.chartTypeDropdown.setContent(e), this.chartTypeDropdown.panel.querySelectorAll(".tcw-dropdown-item").forEach((e) => {
+			e.addEventListener("click", (e) => {
+				let t = e.currentTarget.dataset.ct;
+				this.callbacks.onChartType(t), this.chartTypeDropdown?.close();
+			});
+		});
+	}
+	buildIndicatorMenu() {
+		if (!this.indicatorDropdown) return;
+		let { indicators: e, popularIndicatorIds: t } = this.config, n = e.filter((e) => t.includes(e.id)), r = e.filter((e) => !t.includes(e.id)), i = "<div class=\"tcw-dropdown-label\">Popular</div>";
+		for (let e of n) i += `<button class="tcw-dropdown-item" data-ind="${e.id}"><span>${e.name}</span><span class="tcw-tag">${e.type}</span></button>`;
+		i += "<div class=\"tcw-dropdown-divider\"></div>", i += "<div class=\"tcw-dropdown-label\">All</div>";
+		for (let e of r) i += `<button class="tcw-dropdown-item" data-ind="${e.id}"><span>${e.name}</span><span class="tcw-tag">${e.type}</span></button>`;
+		this.indicatorDropdown.setContent(i), this.indicatorDropdown.panel.querySelectorAll(".tcw-dropdown-item[data-ind]").forEach((e) => {
+			e.addEventListener("click", (e) => {
+				let t = e.currentTarget.dataset.ind;
+				this.callbacks.onAddIndicator(t);
+			});
+		});
+	}
+	update(e) {
+		let t = this.el.querySelector("[data-role=\"symbol\"]");
+		t && (t.textContent = e.symbol);
+		for (let t of this.tfButtons) t.classList.toggle("tcw-active", t.dataset.tf === e.timeframe);
+		let n = this.el.querySelector("[data-role=\"charttype\"]");
+		if (n) {
+			let t = this.config.chartTypes.find((t) => t.value === e.chartType)?.label ?? "Candles";
+			n.innerHTML = `${g("barChart", 14)} ${t} ${g("chevronDown", 12)}`;
+		}
+		let r = this.el.querySelector("[data-role=\"indicators\"]");
+		if (r) {
+			let t = e.activeIndicators.size, n = `${g("trendingUp", 14)} Indicators`;
+			t > 0 && (n += ` <span class="tcw-badge-count">${t}</span>`), r.innerHTML = n;
+		}
+		if (this.chipsContainer) {
+			let t = this.getActiveIndicatorList(e);
+			this.chipsContainer.innerHTML = "";
+			for (let e of t) {
+				let t = document.createElement("div");
+				t.className = "tcw-indicator-chip";
+				let n = document.createElement("span");
+				n.textContent = e.label, t.appendChild(n);
+				let r = document.createElement("button");
+				r.className = "tcw-chip-remove", r.innerHTML = g("x", 10), r.addEventListener("click", () => this.callbacks.onRemoveIndicator(e.instanceId)), t.appendChild(r), this.chipsContainer.appendChild(t);
+			}
+		}
+		this.themeBtn && (this.themeBtn.innerHTML = e.isDark ? g("moon", 14) : g("sun", 14));
+	}
+	getActiveIndicatorList(e) {
+		let t = [];
+		for (let [n, r] of e.activeIndicators.entries()) t.push({
+			instanceId: r,
+			id: n,
+			label: n.toUpperCase()
+		});
+		return t;
+	}
+	sep() {
+		let e = document.createElement("span");
+		return e.className = "tcw-toolbar-sep", e;
+	}
+	spacer() {
+		let e = document.createElement("span");
+		return e.className = "tcw-toolbar-spacer", e;
+	}
+	iconBtn(e, t, n) {
+		let r = document.createElement("button");
+		return r.className = "tcw-btn-icon", r.title = t, r.innerHTML = g(e, 14), r.addEventListener("click", n), r;
+	}
+	destroy() {
+		this.chartTypeDropdown?.destroy(), this.indicatorDropdown?.destroy(), this.el.remove();
+	}
+}, y = [
+	"trendingUp",
+	"minus",
+	"penLine",
+	"hash",
+	"square",
+	"gitBranch",
+	"ruler",
+	"type"
+], b = class {
+	config;
+	callbacks;
+	el;
+	groupWraps = [];
+	groupButtons = [];
+	cursorBtn = null;
+	magnetBtn = null;
+	flyoutEl = null;
+	constructor(e, t, n) {
+		this.config = t, this.callbacks = n, this.el = document.createElement("div"), this.el.className = "tcw-sidebar", this.build(), e.appendChild(this.el);
+	}
+	build() {
+		let { config: e, callbacks: t, el: n } = this;
+		this.cursorBtn = document.createElement("button"), this.cursorBtn.className = "tcw-sidebar-btn", this.cursorBtn.title = "Cursor", this.cursorBtn.innerHTML = g("cursor", 14), this.cursorBtn.addEventListener("click", t.onCancelDrawing), n.appendChild(this.cursorBtn), n.appendChild(this.divider()), e.drawingToolGroups.forEach((e, r) => {
+			let i = document.createElement("div");
+			i.className = "tcw-tool-group-wrap";
+			let a = document.createElement("button");
+			if (a.className = "tcw-sidebar-btn", a.title = e.label, a.innerHTML = g(y[r] ?? "square", 14), e.tools.length > 1) {
+				let e = document.createElement("span");
+				e.className = "tcw-multi-dot", a.appendChild(e);
+			}
+			a.addEventListener("click", () => t.onDrawingTool(e.tools[0].value)), i.appendChild(a), i.addEventListener("mouseenter", () => this.showFlyout(r)), i.addEventListener("mouseleave", () => this.hideFlyout()), n.appendChild(i), this.groupWraps.push(i), this.groupButtons.push(a);
+		});
+		let r = document.createElement("div");
+		r.className = "tcw-sidebar-spacer", n.appendChild(r), n.appendChild(this.divider()), this.magnetBtn = document.createElement("button"), this.magnetBtn.className = "tcw-sidebar-btn", this.magnetBtn.title = "Magnet", this.magnetBtn.innerHTML = g("magnet", 14), this.magnetBtn.addEventListener("click", t.onToggleMagnet), n.appendChild(this.magnetBtn);
+		let i = document.createElement("button");
+		i.className = "tcw-sidebar-btn", i.title = "Undo", i.innerHTML = g("undo", 14), i.addEventListener("click", t.onUndo), n.appendChild(i);
+		let a = document.createElement("button");
+		a.className = "tcw-sidebar-btn", a.title = "Redo", a.innerHTML = g("redo", 14), a.addEventListener("click", t.onRedo), n.appendChild(a);
+		let o = document.createElement("button");
+		o.className = "tcw-sidebar-btn tcw-danger", o.title = "Clear all", o.innerHTML = g("trash", 14), o.addEventListener("click", t.onClearDrawings), n.appendChild(o);
+	}
+	showFlyout(e) {
+		let t = this.config.drawingToolGroups[e];
+		if (!t || t.tools.length <= 1) return;
+		this.hideFlyout();
+		let n = document.createElement("div");
+		n.className = "tcw-flyout";
+		let r = document.createElement("div");
+		r.className = "tcw-flyout-header", r.textContent = t.label, n.appendChild(r);
+		for (let e of t.tools) {
+			let t = document.createElement("button");
+			t.className = "tcw-flyout-item", t.textContent = e.label, t.dataset.toolValue = e.value, t.addEventListener("click", () => {
+				this.callbacks.onDrawingTool(e.value), this.hideFlyout();
+			}), n.appendChild(t);
+		}
+		this.flyoutEl = n, this.groupWraps[e].appendChild(n);
+	}
+	hideFlyout() {
+		this.flyoutEl &&= (this.flyoutEl.remove(), null);
+	}
+	update(e) {
+		this.cursorBtn && this.cursorBtn.classList.toggle("tcw-active", e.activeTool === null);
+		let { drawingToolGroups: t } = this.config;
+		for (let n = 0; n < t.length; n++) {
+			let r = t[n].tools.some((t) => t.value === e.activeTool);
+			this.groupButtons[n].classList.toggle("tcw-active", r);
+		}
+		this.flyoutEl && this.flyoutEl.querySelectorAll(".tcw-flyout-item").forEach((t) => {
+			let n = t;
+			n.classList.toggle("tcw-active", n.dataset.toolValue === e.activeTool);
+		}), this.magnetBtn && (this.magnetBtn.classList.toggle("tcw-active", e.magnetEnabled), this.magnetBtn.title = e.magnetEnabled ? "Magnet ON" : "Magnet OFF");
+	}
+	divider() {
+		let e = document.createElement("div");
+		return e.className = "tcw-sidebar-divider", e;
+	}
+	destroy() {
+		this.hideFlyout(), this.el.remove();
+	}
+}, x = [
+	"style",
+	"display",
+	"scale"
+], S = class {
+	callbacks;
+	backdrop = null;
+	modal = null;
+	currentTab = "style";
+	currentSettings = null;
+	bodyEl = null;
+	tabButtons = [];
+	constructor(e) {
+		this.callbacks = e;
+	}
+	open(e) {
+		this.currentSettings = { ...e }, this.currentTab = "style", this.buildModal();
+	}
+	close() {
+		this.backdrop?.remove(), this.modal?.remove(), this.backdrop = null, this.modal = null, this.bodyEl = null, this.tabButtons = [];
+	}
+	buildModal() {
+		this.backdrop = document.createElement("div"), this.backdrop.className = "tcw-modal-backdrop", this.backdrop.addEventListener("click", () => {
+			this.callbacks.onClose(), this.close();
+		}), document.body.appendChild(this.backdrop), this.modal = document.createElement("div"), this.modal.className = "tcw-modal";
+		let e = document.createElement("div");
+		e.className = "tcw-modal-header";
+		let t = document.createElement("h3");
+		t.textContent = "Chart Settings", e.appendChild(t);
+		let n = document.createElement("button");
+		n.className = "tcw-modal-close", n.innerHTML = g("x", 16), n.addEventListener("click", () => {
+			this.callbacks.onClose(), this.close();
+		}), e.appendChild(n), this.modal.appendChild(e);
+		let r = document.createElement("div");
+		r.className = "tcw-modal-tabs", this.tabButtons = [];
+		for (let e of x) {
+			let t = document.createElement("button");
+			t.className = "tcw-modal-tab", t.textContent = e, t.dataset.tab = e, e === this.currentTab && t.classList.add("tcw-active"), t.addEventListener("click", () => {
+				this.currentTab = e, this.tabButtons.forEach((t) => t.classList.toggle("tcw-active", t.dataset.tab === e)), this.renderTabContent();
+			}), r.appendChild(t), this.tabButtons.push(t);
+		}
+		this.modal.appendChild(r), this.bodyEl = document.createElement("div"), this.bodyEl.className = "tcw-modal-body", this.modal.appendChild(this.bodyEl), this.renderTabContent();
+		let i = document.createElement("div");
+		i.className = "tcw-modal-footer";
+		let a = document.createElement("button");
+		a.className = "tcw-reset-link", a.textContent = "Reset to defaults", a.addEventListener("click", () => this.callbacks.onReset()), i.appendChild(a);
+		let o = document.createElement("button");
+		o.className = "tcw-done-btn", o.textContent = "Done", o.addEventListener("click", () => {
+			this.callbacks.onClose(), this.close();
+		}), i.appendChild(o), this.modal.appendChild(i), document.body.appendChild(this.modal);
+		let s = (e) => {
+			e.key === "Escape" && (document.removeEventListener("keydown", s), this.callbacks.onClose(), this.close());
+		};
+		document.addEventListener("keydown", s);
+	}
+	renderTabContent() {
+		if (!(!this.bodyEl || !this.currentSettings)) switch (this.bodyEl.innerHTML = "", this.currentTab) {
+			case "style":
+				this.renderStyleTab();
+				break;
+			case "display":
+				this.renderDisplayTab();
+				break;
+			case "scale":
+				this.renderScaleTab();
+				break;
+		}
+	}
+	renderStyleTab() {
+		if (!this.bodyEl || !this.currentSettings) return;
+		let e = this.currentSettings, t = this.section("Candle Colors");
+		t.appendChild(this.colorRow("Up Body", e.candleUpColor, (e) => this.patch({ candleUpColor: e }))), t.appendChild(this.colorRow("Down Body", e.candleDownColor, (e) => this.patch({ candleDownColor: e }))), t.appendChild(this.colorRow("Up Wick", e.candleUpWick, (e) => this.patch({ candleUpWick: e }))), t.appendChild(this.colorRow("Down Wick", e.candleDownWick, (e) => this.patch({ candleDownWick: e }))), this.bodyEl.appendChild(t);
+		let n = this.section("Background");
+		n.appendChild(this.colorRow("Background", e.backgroundColor, (e) => this.patch({ backgroundColor: e }))), n.appendChild(this.colorRow("Grid", e.gridColor, (e) => this.patch({ gridColor: e }))), this.bodyEl.appendChild(n);
+	}
+	renderDisplayTab() {
+		if (!this.bodyEl || !this.currentSettings) return;
+		let e = this.currentSettings, t = this.section();
+		t.appendChild(this.toggleRow("Grid Lines", e.gridVisible, (e) => this.patch({ gridVisible: e }))), t.appendChild(this.toggleRow("Volume", e.volumeVisible, (e) => this.patch({ volumeVisible: e }))), t.appendChild(this.toggleRow("OHLC Legend", e.legendVisible, (e) => this.patch({ legendVisible: e }))), t.appendChild(this.toggleRow("Bar Countdown", e.barCountdown, (e) => this.patch({ barCountdown: e }))), t.appendChild(this.selectRow("Crosshair Mode", e.crosshairMode, [
+			{
+				label: "Magnet",
+				value: "magnet"
+			},
+			{
+				label: "Normal",
+				value: "normal"
+			},
+			{
+				label: "Hidden",
+				value: "hidden"
+			}
+		], (e) => this.patch({ crosshairMode: e }))), t.appendChild(this.selectRow("Number Locale", e.numberLocale, [
+			{
+				label: "en-US (65,234.00)",
+				value: "en-US"
+			},
+			{
+				label: "de-DE (65.234,00)",
+				value: "de-DE"
+			},
+			{
+				label: "fr-FR (65 234,00)",
+				value: "fr-FR"
+			},
+			{
+				label: "vi-VN (65.234,00)",
+				value: "vi-VN"
+			},
+			{
+				label: "en-IN (65,234.00)",
+				value: "en-IN"
+			},
+			{
+				label: "ja-JP (65,234.00)",
+				value: "ja-JP"
+			}
+		], (e) => this.patch({ numberLocale: e }))), this.bodyEl.appendChild(t);
+	}
+	renderScaleTab() {
+		if (!this.bodyEl || !this.currentSettings) return;
+		let e = this.currentSettings, t = this.section();
+		t.appendChild(this.toggleRow("Auto Scale", e.autoScale, (e) => this.patch({ autoScale: e }))), t.appendChild(this.toggleRow("Log Scale", e.logScale, (e) => this.patch({ logScale: e }))), this.bodyEl.appendChild(t);
+	}
+	patch(e) {
+		this.currentSettings && Object.assign(this.currentSettings, e), this.callbacks.onChange(e);
+	}
+	section(e) {
+		let t = document.createElement("div");
+		if (t.className = "tcw-settings-section", e) {
+			let n = document.createElement("div");
+			n.className = "tcw-settings-section-title", n.textContent = e, t.appendChild(n);
+		}
+		return t;
+	}
+	colorRow(e, t, n) {
+		let r = document.createElement("div");
+		r.className = "tcw-settings-row";
+		let i = document.createElement("span");
+		i.className = "tcw-settings-label", i.textContent = e, r.appendChild(i);
+		let a = document.createElement("div");
+		a.className = "tcw-color-picker-wrap";
+		let o = document.createElement("input");
+		o.type = "color", o.value = t;
+		let s = document.createElement("span");
+		return s.className = "tcw-color-hex", s.textContent = t, o.addEventListener("input", () => {
+			s.textContent = o.value, n(o.value);
+		}), a.appendChild(o), a.appendChild(s), r.appendChild(a), r;
+	}
+	toggleRow(e, t, n) {
+		let r = document.createElement("div");
+		r.className = "tcw-settings-row";
+		let i = document.createElement("span");
+		i.className = "tcw-settings-label", i.textContent = e, r.appendChild(i);
+		let a = document.createElement("button");
+		return a.className = `tcw-toggle${t ? " tcw-on" : ""}`, a.addEventListener("click", () => {
+			let e = !a.classList.contains("tcw-on");
+			a.classList.toggle("tcw-on", e), n(e);
+		}), r.appendChild(a), r;
+	}
+	selectRow(e, t, n, r) {
+		let i = document.createElement("div");
+		i.className = "tcw-settings-row";
+		let a = document.createElement("span");
+		a.className = "tcw-settings-label", a.textContent = e, i.appendChild(a);
+		let o = document.createElement("select");
+		o.className = "tcw-settings-select";
+		for (let e of n) {
+			let n = document.createElement("option");
+			n.value = e.value, n.textContent = e.label, e.value === t && (n.selected = !0), o.appendChild(n);
+		}
+		return o.addEventListener("change", () => r(o.value)), i.appendChild(o), i;
+	}
+	destroy() {
+		this.close();
+	}
+}, C = class {
+	el;
+	dotEl;
+	messageEl;
+	infoEl;
+	constructor(e) {
+		this.el = document.createElement("div"), this.el.className = "tcw-statusbar";
+		let t = document.createElement("div");
+		t.className = "tcw-status-indicator", this.dotEl = document.createElement("span"), this.dotEl.className = "tcw-status-dot", t.appendChild(this.dotEl), this.messageEl = document.createElement("span"), t.appendChild(this.messageEl), this.el.appendChild(t), this.infoEl = document.createElement("span"), this.el.appendChild(this.infoEl), e.appendChild(this.el);
+	}
+	update(e) {
+		this.dotEl.className = "tcw-status-dot", e.connectionState === "connected" ? this.dotEl.classList.add("tcw-connected") : e.connectionState === "error" && this.dotEl.classList.add("tcw-error"), this.messageEl.textContent = e.message, this.infoEl.textContent = `${e.symbol} ${e.timeframe}`;
+	}
+	destroy() {
+		this.el.remove();
+	}
+}, w = class {
+	backdrop = null;
+	modal = null;
+	input = null;
+	list = null;
+	items = [];
+	filtered = [];
+	selectedIndex = 0;
+	callbacks;
+	boundKeydown;
+	constructor(e) {
+		this.callbacks = e, this.boundKeydown = this.handleKeydown.bind(this);
+	}
+	open(e) {
+		if (this.backdrop) return;
+		this.items = e, this.filtered = e, this.selectedIndex = 0, this.backdrop = document.createElement("div"), this.backdrop.className = "tcw-modal-backdrop", this.backdrop.addEventListener("click", () => this.close()), this.modal = document.createElement("div"), this.modal.className = "tcw-cmd-palette";
+		let t = document.createElement("div");
+		t.className = "tcw-cmd-header";
+		let n = document.createElement("span");
+		n.className = "tcw-cmd-icon", n.textContent = "⌕", t.appendChild(n), this.input = document.createElement("input"), this.input.className = "tcw-cmd-input", this.input.type = "text", this.input.placeholder = "Search indicators, chart types, tools...", this.input.addEventListener("input", () => this.filter()), t.appendChild(this.input);
+		let r = document.createElement("span");
+		r.className = "tcw-cmd-hint", r.textContent = "ESC", t.appendChild(r), this.modal.appendChild(t), this.list = document.createElement("div"), this.list.className = "tcw-cmd-list", this.modal.appendChild(this.list);
+		let i = document.createElement("div");
+		i.className = "tcw-cmd-footer", i.innerHTML = "<span>↑↓ Navigate</span><span>⏎ Select</span><span>Esc Close</span>", this.modal.appendChild(i), document.body.appendChild(this.backdrop), document.body.appendChild(this.modal), this.renderList(), this.input.focus(), document.addEventListener("keydown", this.boundKeydown);
+	}
+	close() {
+		document.removeEventListener("keydown", this.boundKeydown), this.backdrop?.remove(), this.modal?.remove(), this.backdrop = null, this.modal = null, this.input = null, this.list = null, this.callbacks.onClose();
+	}
+	isOpen() {
+		return this.backdrop !== null;
+	}
+	filter() {
+		let e = this.input?.value.toLowerCase().trim() ?? "";
+		e ? this.filtered = this.items.filter((t) => t.label.toLowerCase().includes(e) || t.category.toLowerCase().includes(e) || t.id.toLowerCase().includes(e)) : this.filtered = this.items, this.selectedIndex = 0, this.renderList();
+	}
+	renderList() {
+		if (!this.list) return;
+		if (this.list.innerHTML = "", this.filtered.length === 0) {
+			let e = document.createElement("div");
+			e.className = "tcw-cmd-empty", e.textContent = "No results found", this.list.appendChild(e);
+			return;
+		}
+		let e = "";
+		for (let t = 0; t < this.filtered.length; t++) {
+			let n = this.filtered[t];
+			if (n.category !== e) {
+				e = n.category;
+				let t = document.createElement("div");
+				t.className = "tcw-cmd-category", t.textContent = this.categoryLabel(e), this.list.appendChild(t);
+			}
+			let r = document.createElement("button");
+			r.className = "tcw-cmd-item", t === this.selectedIndex && r.classList.add("tcw-selected"), n.active && r.classList.add("tcw-active"), r.dataset.index = String(t);
+			let i = document.createElement("span");
+			if (i.className = "tcw-cmd-item-label", i.textContent = n.label, r.appendChild(i), n.active) {
+				let e = document.createElement("span");
+				e.className = "tcw-cmd-check", e.textContent = "✓", r.appendChild(e);
+			}
+			if (n.shortcut) {
+				let e = document.createElement("kbd");
+				e.className = "tcw-cmd-kbd", e.textContent = n.shortcut, r.appendChild(e);
+			}
+			r.addEventListener("click", () => this.select(t)), r.addEventListener("mouseenter", () => {
+				this.selectedIndex = t, this.updateSelection();
+			}), this.list.appendChild(r);
+		}
+	}
+	updateSelection() {
+		if (!this.list) return;
+		let e = this.list.querySelectorAll(".tcw-cmd-item");
+		e.forEach((e, t) => {
+			e.classList.toggle("tcw-selected", t === this.selectedIndex);
+		}), e[this.selectedIndex]?.scrollIntoView({ block: "nearest" });
+	}
+	select(e) {
+		let t = this.filtered[e];
+		if (t) {
+			switch (t.category) {
+				case "indicator":
+					this.callbacks.onIndicator(t.id);
+					break;
+				case "chartType":
+					this.callbacks.onChartType(t.id);
+					break;
+				case "drawing":
+					this.callbacks.onDrawingTool(t.id);
+					break;
+				case "timeframe":
+					this.callbacks.onTimeframe(t.id);
+					break;
+				case "action":
+					this.callbacks.onAction(t.id);
+					break;
+			}
+			this.close();
+		}
+	}
+	handleKeydown(e) {
+		switch (e.key) {
+			case "Escape":
+				e.preventDefault(), this.close();
+				break;
+			case "ArrowDown":
+				e.preventDefault(), this.filtered.length > 0 && (this.selectedIndex = (this.selectedIndex + 1) % this.filtered.length, this.updateSelection());
+				break;
+			case "ArrowUp":
+				e.preventDefault(), this.filtered.length > 0 && (this.selectedIndex = (this.selectedIndex - 1 + this.filtered.length) % this.filtered.length, this.updateSelection());
+				break;
+			case "Enter":
+				e.preventDefault(), this.select(this.selectedIndex);
+				break;
+		}
+	}
+	categoryLabel(e) {
+		switch (e) {
+			case "indicator": return "Indicators";
+			case "chartType": return "Chart Types";
+			case "drawing": return "Drawing Tools";
+			case "timeframe": return "Timeframes";
+			case "action": return "Actions";
+			default: return e;
+		}
+	}
+	destroy() {
+		this.close();
+	}
+}, T = class {
+	chart;
+	state;
+	toolbar = null;
+	sidebar = null;
+	settings = null;
+	statusBar = null;
+	commandPalette = null;
+	root;
+	chartContainer;
+	destroyed = !1;
+	options;
+	symbolIndex = 0;
+	symbols;
+	settingsState;
+	adapter = null;
+	boundGlobalKeydown = null;
+	constructor(t, n = {}) {
+		this.options = n, this.symbols = n.symbols ?? c, this.settingsState = { ...l };
+		let u = this.resolveIsDark(n.theme), d = this.resolveTheme(n.theme);
+		this.state = {
+			symbol: n.symbol ?? this.symbols[0] ?? "BTCUSDT",
+			timeframe: n.timeframe ?? "5m",
+			chartType: n.chartOptions?.chartType ?? "candlestick",
+			isDark: u,
+			activeIndicators: /* @__PURE__ */ new Map(),
+			activeTool: null,
+			magnetEnabled: !0,
+			connectionState: "connecting",
+			connectionMessage: "Connecting..."
+		};
+		let f = this.symbols.indexOf(this.state.symbol);
+		f >= 0 && (this.symbolIndex = f), p(), this.root = document.createElement("div"), this.root.className = "tcw-root", this.root.dataset.tcwTheme = u ? "dark" : "light", t.appendChild(this.root), n.toolbar !== !1 && (this.toolbar = new v(this.root, {
+			symbols: this.symbols,
+			timeframes: n.timeframes ? r.filter((e) => n.timeframes.includes(e.value)) : r,
+			chartTypes: n.chartTypes ? i.filter((e) => n.chartTypes.includes(e.value)) : i,
+			indicators: o,
+			popularIndicatorIds: s
+		}, {
+			onSymbolClick: () => this.handleSymbolClick(),
+			onTimeframe: (e) => this.handleTimeframe(e),
+			onChartType: (e) => this.handleChartType(e),
+			onAddIndicator: (e) => this.handleAddIndicator(e),
+			onRemoveIndicator: (e) => this.handleRemoveIndicator(e),
+			onScreenshot: () => this.chart.screenshot(),
+			onSettings: () => this.openSettings(),
+			onToggleTheme: () => this.handleToggleTheme()
+		}));
+		let m = document.createElement("div");
+		m.className = "tcw-body", n.drawingTools !== !1 && (this.sidebar = new b(m, { drawingToolGroups: a }, {
+			onDrawingTool: (e) => this.handleDrawingTool(e),
+			onCancelDrawing: () => this.handleCancelDrawing(),
+			onToggleMagnet: () => this.handleToggleMagnet(),
+			onUndo: () => this.chart.undo(),
+			onRedo: () => this.chart.redo(),
+			onClearDrawings: () => {
+				this.chart.clearDrawings(), this.state = {
+					...this.state,
+					activeTool: null
+				}, this.updateUI();
+			}
+		})), this.chartContainer = document.createElement("div"), this.chartContainer.className = "tcw-chart-container", m.appendChild(this.chartContainer), this.root.appendChild(m), this.chart = new e(this.chartContainer, {
+			chartType: this.state.chartType,
+			theme: d,
+			autoScale: !0,
+			crosshair: { mode: "magnet" },
+			features: {
+				drawings: !0,
+				drawingMagnet: !0,
+				drawingUndoRedo: !0,
+				indicators: !0,
+				trading: n.trading !== !1,
+				tradingContextMenu: n.trading !== !1,
+				volume: !0,
+				legend: !0,
+				crosshair: !0,
+				keyboard: !0,
+				screenshot: !0,
+				alerts: !0,
+				barCountdown: !0,
+				logScale: !0,
+				watermark: !0
+			},
+			...n.chartOptions
+		}), n.statusBar !== !1 && (this.statusBar = new C(this.root)), n.settings !== !1 && (this.settings = new S({
+			onChange: (e) => this.applySettings(e),
+			onReset: () => this.resetSettings(),
+			onClose: () => {}
+		})), this.commandPalette = new w({
+			onIndicator: (e) => this.handleAddIndicator(e),
+			onChartType: (e) => this.handleChartType(e),
+			onDrawingTool: (e) => this.handleDrawingTool(e),
+			onTimeframe: (e) => this.handleTimeframe(e),
+			onAction: (e) => this.handleAction(e),
+			onClose: () => {}
+		}), this.boundGlobalKeydown = (e) => {
+			(e.ctrlKey || e.metaKey) && e.key === "k" && (e.preventDefault(), this.toggleCommandPalette());
+		}, document.addEventListener("keydown", this.boundGlobalKeydown), n.adapter && (this.adapter = n.adapter, this.connectStream()), this.updateUI(), n.onReady?.(this.chart);
+	}
+	async setSymbol(e) {
+		this.state = {
+			...this.state,
+			symbol: e
+		};
+		let t = this.symbols.indexOf(e);
+		t >= 0 && (this.symbolIndex = t), this.options.onSymbolChange?.(e), this.updateUI(), this.adapter && await this.connectStream();
+	}
+	async setTimeframe(e) {
+		this.state = {
+			...this.state,
+			timeframe: e
+		}, this.options.onTimeframeChange?.(e), this.updateUI(), this.adapter && await this.connectStream();
+	}
+	setTheme(e) {
+		let t = this.resolveIsDark(e), n = this.resolveTheme(e);
+		this.state = {
+			...this.state,
+			isDark: t
+		}, this.root.dataset.tcwTheme = t ? "dark" : "light", this.chart.setTheme(n), this.updateUI();
+	}
+	getChart() {
+		return this.chart;
+	}
+	destroy() {
+		this.destroyed || (this.destroyed = !0, this.boundGlobalKeydown && document.removeEventListener("keydown", this.boundGlobalKeydown), this.commandPalette?.destroy(), this.toolbar?.destroy(), this.sidebar?.destroy(), this.settings?.destroy(), this.statusBar?.destroy(), this.chart.destroy(), this.root.remove(), m());
+	}
+	handleSymbolClick() {
+		this.symbolIndex = (this.symbolIndex + 1) % this.symbols.length;
+		let e = this.symbols[this.symbolIndex];
+		this.state = {
+			...this.state,
+			symbol: e
+		}, this.options.onSymbolChange?.(e), this.updateUI(), this.adapter && this.connectStream();
+	}
+	handleTimeframe(e) {
+		this.state = {
+			...this.state,
+			timeframe: e
+		}, this.options.onTimeframeChange?.(e), this.updateUI(), this.adapter && this.connectStream();
+	}
+	handleChartType(e) {
+		this.state = {
+			...this.state,
+			chartType: e
+		}, this.chart.setChartType(e), this.updateUI();
+	}
+	handleAddIndicator(e) {
+		if (this.state.activeIndicators.has(e)) {
+			let t = this.state.activeIndicators.get(e);
+			this.chart.removeIndicator(t);
+			let n = new Map(this.state.activeIndicators);
+			n.delete(e), this.state = {
+				...this.state,
+				activeIndicators: n
+			};
+		} else {
+			let t = this.chart.addIndicator(e);
+			if (t) {
+				let n = new Map(this.state.activeIndicators);
+				n.set(e, t), this.state = {
+					...this.state,
+					activeIndicators: n
+				};
+			}
+		}
+		this.updateUI();
+	}
+	handleRemoveIndicator(e) {
+		this.chart.removeIndicator(e);
+		let t = new Map(this.state.activeIndicators);
+		for (let [n, r] of t.entries()) if (r === e) {
+			t.delete(n);
+			break;
+		}
+		this.state = {
+			...this.state,
+			activeIndicators: t
+		}, this.updateUI();
+	}
+	toggleCommandPalette() {
+		if (this.commandPalette?.isOpen()) {
+			this.commandPalette.close();
+			return;
+		}
+		this.commandPalette?.open(this.buildCommandItems());
+	}
+	buildCommandItems() {
+		let e = [];
+		for (let t of o) e.push({
+			id: t.id,
+			label: t.name,
+			category: "indicator",
+			active: this.state.activeIndicators.has(t.id)
+		});
+		for (let t of i) e.push({
+			id: t.value,
+			label: t.label,
+			category: "chartType",
+			active: this.state.chartType === t.value
+		});
+		for (let t of a) for (let n of t.tools) e.push({
+			id: n.value,
+			label: n.label,
+			category: "drawing",
+			active: this.state.activeTool === n.value
+		});
+		for (let t of r) e.push({
+			id: t.value,
+			label: t.label,
+			category: "timeframe",
+			active: this.state.timeframe === t.value
+		});
+		return e.push({
+			id: "screenshot",
+			label: "Screenshot",
+			category: "action",
+			shortcut: ""
+		}, {
+			id: "toggleTheme",
+			label: "Toggle Theme",
+			category: "action"
+		}, {
+			id: "settings",
+			label: "Settings",
+			category: "action"
+		}, {
+			id: "clearDrawings",
+			label: "Clear All Drawings",
+			category: "action"
+		}), e;
+	}
+	handleAction(e) {
+		switch (e) {
+			case "screenshot":
+				this.chart.screenshot();
+				break;
+			case "toggleTheme":
+				this.handleToggleTheme();
+				break;
+			case "settings":
+				this.openSettings();
+				break;
+			case "clearDrawings":
+				this.chart.clearDrawings(), this.state = {
+					...this.state,
+					activeTool: null
+				}, this.updateUI();
+				break;
+		}
+	}
+	handleDrawingTool(e) {
+		this.state = {
+			...this.state,
+			activeTool: e
+		}, this.chart.setDrawingTool(e), this.updateUI();
+	}
+	handleCancelDrawing() {
+		this.state = {
+			...this.state,
+			activeTool: null
+		}, this.chart.setDrawingTool(null), this.updateUI();
+	}
+	handleToggleMagnet() {
+		let e = !this.state.magnetEnabled;
+		this.state = {
+			...this.state,
+			magnetEnabled: e
+		}, this.chart.setDrawingMagnet(e), this.updateUI();
+	}
+	handleToggleTheme() {
+		let e = !this.state.isDark;
+		this.state = {
+			...this.state,
+			isDark: e
+		}, this.root.dataset.tcwTheme = e ? "dark" : "light", this.chart.setTheme(e ? t : n), this.chart.setWatermark(this.state.symbol.replace("USDT", " / USDT"), {
+			fontSize: 48,
+			color: e ? "rgba(255,255,255,0.03)" : "rgba(0,0,0,0.03)"
+		}), this.updateUI();
+	}
+	openSettings() {
+		this.settings?.open(this.settingsState);
+	}
+	applySettings(e) {
+		this.settingsState = {
+			...this.settingsState,
+			...e
+		}, e.gridVisible !== void 0 && this.chart.setGridVisible(e.gridVisible), e.volumeVisible !== void 0 && this.chart.setVolumeVisible(e.volumeVisible), e.crosshairMode !== void 0 && this.chart.setCrosshairMode(e.crosshairMode), e.autoScale !== void 0 && this.chart.setAutoScale(e.autoScale), e.logScale !== void 0 && this.chart.setLogScale(e.logScale), e.numberLocale !== void 0 && this.chart.setNumberLocale(e.numberLocale);
+		let t = { ...this.chart.getTheme() }, n = !1;
+		e.candleUpColor !== void 0 && (t.candleUp = e.candleUpColor, n = !0), e.candleDownColor !== void 0 && (t.candleDown = e.candleDownColor, n = !0), e.candleUpWick !== void 0 && (t.candleUpWick = e.candleUpWick, n = !0), e.candleDownWick !== void 0 && (t.candleDownWick = e.candleDownWick, n = !0), e.backgroundColor !== void 0 && (t.background = e.backgroundColor, n = !0), e.gridColor !== void 0 && (t.grid = e.gridColor, n = !0), n && this.chart.setTheme(t);
+	}
+	resetSettings() {
+		this.settingsState = { ...l }, this.applySettings(this.settingsState);
+	}
+	async connectStream() {
+		if (this.adapter) {
+			this.state = {
+				...this.state,
+				connectionState: "connecting",
+				connectionMessage: "Connecting..."
+			}, this.updateUI();
+			try {
+				this.chart.disconnectStream(), await this.chart.connect({
+					adapter: this.adapter,
+					symbol: this.state.symbol,
+					timeframe: this.state.timeframe,
+					historyLimit: this.options.historyLimit ?? 500
+				}), this.chart.setWatermark(this.state.symbol.replace("USDT", " / USDT"), {
+					fontSize: 48,
+					color: this.state.isDark ? "rgba(255,255,255,0.03)" : "rgba(0,0,0,0.03)"
+				}), this.state = {
+					...this.state,
+					connectionState: "connected",
+					connectionMessage: "Live"
+				};
+			} catch (e) {
+				this.state = {
+					...this.state,
+					connectionState: "error",
+					connectionMessage: e instanceof Error ? e.message : "Connection failed"
+				};
+			}
+			this.updateUI();
+		}
+	}
+	updateUI() {
+		this.toolbar?.update(this.state), this.sidebar?.update(this.state), this.statusBar?.update({
+			connectionState: this.state.connectionState,
+			message: this.state.connectionMessage,
+			symbol: this.state.symbol,
+			timeframe: this.state.timeframe
+		});
+	}
+	resolveIsDark(e) {
+		return e === void 0 || e === "dark" ? !0 : e === "light" ? !1 : typeof e == "object" && e.background ? this.isColorDark(e.background) : !0;
+	}
+	resolveTheme(e) {
+		return e === void 0 || e === "dark" ? t : e === "light" ? n : typeof e == "object" ? e : t;
+	}
+	isColorDark(e) {
+		if (e.startsWith("#") && e.length >= 7) {
+			let t = parseInt(e.slice(1, 3), 16), n = parseInt(e.slice(3, 5), 16), r = parseInt(e.slice(5, 7), 16);
+			return t + n + r < 384;
+		}
+		return !0;
+	}
+};
+//#endregion
+export { T as ChartWidget };
+
+//# sourceMappingURL=index.js.map