@luxalgo/vela 0.6.11 → 0.6.12

package/dist/{chunk-IO3NYSQV.js → chunk-IZV3CW5N.js}

@@ -1,8 +1,8 @@
-import { parseSymbol, priceStyleIds, BUILTIN_PRICE_STYLES, tzButtonLabel, TIMEZONES, normalizeTimezone, tzMenuLabel, isGroupRow, defaultMemberOf, groupKeyOf, groupMembers, LEGEND_AT_TOP_ATTR, Vela, TypedEventBus, MultiProviderFeed, registerBuiltinChartTypes, resolveTheme, buildToolbar, createCustomMark, createAttributionMark, DrawingToolbar, applyAttributionMarkTheme, sharedBarStore, timeframeToMs } from './chunk-73PEA4MU.js';
-import { chartType, resolveTopbarComposition, topbarActionOverride, TOPBAR_BUILTIN_IDS, widgetActions, SidePanel, sidePanels, DEFAULT_PANEL_ORDER, symbolRanking, resolveEngines, legendActionsProviderFor, legendCalloutsProviderFor, statePersistenceHandlers, topbarHas, rendererDefaults, widgetAttachments, getDrawingType, inputDeltas } from './chunk-MTLJKZDZ.js';
+import { parseSymbol, priceStyleIds, BUILTIN_PRICE_STYLES, tzButtonLabel, TIMEZONES, normalizeTimezone, tzMenuLabel, isGroupRow, defaultMemberOf, groupKeyOf, groupMembers, LEGEND_AT_TOP_ATTR, Vela, TypedEventBus, MultiProviderFeed, registerBuiltinChartTypes, resolveTheme, buildToolbar, createCustomMark, createAttributionMark, DrawingToolbar, applyAttributionMarkTheme, sharedBarStore, timeframeToMs } from './chunk-KV7FDWSL.js';
+import { chartType, resolveTopbarComposition, topbarActionOverride, TOPBAR_BUILTIN_IDS, widgetActions, SidePanel, sidePanels, DEFAULT_PANEL_ORDER, symbolRanking, resolveEngines, legendActionsProviderFor, legendCalloutsProviderFor, statePersistenceHandlers, topbarHas, rendererDefaults, widgetAttachments, getDrawingType, inputDeltas } from './chunk-F4M24ANM.js';
 import { Tooltip, KeymapManager, isEditableTarget, Drawer } from './chunk-G77Y7LK2.js';
 import { Menu, Dialog, CalloutBubble, applyPlotOverlayTokens, ensureUIHost } from './chunk-MHY7MVXH.js';
-import { registerIcon, svg16, injectStyles, iconEl, iconMarkup, SESSION_OFF, SESSION_POST, SESSION_PRE, icon, categoricalColor } from './chunk-KG4YT3TI.js';
+import { registerIcon, svg16, injectStyles, iconEl, iconMarkup, iconAt, SESSION_OFF, SESSION_POST, SESSION_PRE, icon, categoricalColor } from './chunk-KG4YT3TI.js';
 import { baseOf } from './chunk-W4EJWLEO.js';
 
 // src/widget/timeframe.ts
@@ -3988,6 +3988,21 @@ function fmtChange(open, close) {
   return `${sign}${fmtPrice(diff, decimalsFor(close))} (${sign}${pct.toFixed(2)}%)`;
 }
 
+// src/widget/statusline-model.ts
+function segmentVisibility(parts, chartHidden = false) {
+  return { avatar: parts.logo, symbol: parts.name, meta: parts.name, market: parts.market, ohlc: parts.ohlc && !chartHidden, change: parts.change && !chartHidden, eye: chartHidden };
+}
+function statuslineMenuItems(parts, chartVisible) {
+  return [
+    { id: "part:logo", label: "Symbol logo", checked: parts.logo },
+    { id: "part:name", label: "Symbol name", checked: parts.name },
+    { id: "part:market", label: "Market status", checked: parts.market },
+    { id: "part:ohlc", label: "OHLC values", checked: parts.ohlc },
+    { id: "part:change", label: "Bar change values", checked: parts.change },
+    { id: "chart", label: chartVisible ? "Hide chart" : "Show chart", separatorBefore: true }
+  ];
+}
+
 // src/widget/statusline.ts
 var STYLE_ID10 = "vela-widget-statusline";
 var CSS10 = `
@@ -4017,7 +4032,13 @@ var CSS10 = `
     padding: 2px 7px;
     margin-left: -7px;
 }
-.vela-statusline:hover { background: var(--vela-bg); }
+/* Hovering opens the chip the same way a legend row opens: solid chart background
+ * plus the same inset neutral outline the indicator rows wear (InputsUI's
+ * setRowHighlighted) \u2014 the two columns read as one family. */
+.vela-statusline:hover { background: var(--vela-bg); box-shadow: inset 0 0 0 1px var(--vela-border); }
+/* Chart hidden (the price series' eye \u2014 renderer 'candleVisible'): the line dims to
+ * the same 0.5 wash a hidden indicator's legend row wears. */
+.vela-statusline.vela-sl-chart-hidden { opacity: 0.5; }
 .vela-statusline .vela-sl-avatar {
     width: 18px;
     height: 18px;
@@ -4042,6 +4063,24 @@ var CSS10 = `
  * these are the pre-ink fallbacks only. */
 .vela-statusline .vela-sl-change[data-dir='up'] { color: var(--vela-up); }
 .vela-statusline .vela-sl-change[data-dir='down'] { color: var(--vela-down); }
+/* The show-chart eye \u2014 out only while the chart is hidden (syncParts drives display),
+ * replacing the value readout it took away. Same footprint as a legend action button. */
+.vela-statusline .vela-sl-eye {
+    align-self: center;
+    align-items: center;
+    justify-content: center;
+    width: 18px;
+    height: 18px;
+    padding: 0;
+    border: none;
+    border-radius: 3px;
+    background: none;
+    color: var(--vela-fg-muted);
+    cursor: pointer;
+    line-height: 0;
+    flex: none;
+}
+.vela-statusline .vela-sl-eye:hover { color: var(--vela-fg); background: color-mix(in srgb, var(--vela-fg) 12%, transparent); }
 /* Stack the TOP pane's legend below the status line (lower study panes stay put).
  * The renderer marks whichever legend sits at the plot's top edge \u2014 the price pane
  * normally, or a maximized study pane filling the plot \u2014 so the legend never merges
@@ -4151,7 +4190,12 @@ var Statusline = class {
   constructor(host, symbol, iconFor) {
     this.host = host;
     this.iconFor = iconFor;
-    this.parts = { name: true, market: true, ohlc: true, change: true };
+    this.parts = { logo: true, name: true, market: true, ohlc: true, change: true };
+    /** The right-click action menu — present once a host wires it via {@link attachMenu}. */
+    this.menu = null;
+    this.menuHooks = null;
+    /** Mirror of the renderer's `candleVisible` — see {@link setChartHidden}. */
+    this.chartHidden = false;
     this.lastBar = null;
     this.hoverBar = null;
     this.unsubs = [];
@@ -4167,6 +4211,15 @@ var Statusline = class {
     /** Fit mode (multi-chart cells): one row, overflowing segments hidden — see {@link setFitMode}. */
     this.fitMode = false;
     this.fitRO = null;
+    this.onContextMenu = (e) => {
+      if (!this.menu || !this.menuHooks) return;
+      e.preventDefault();
+      e.stopPropagation();
+      const chartVisible = this.menuHooks.chartVisible();
+      this.setChartHidden(!chartVisible);
+      this.menu.setItems(statuslineMenuItems(this.parts, chartVisible));
+      this.menu.openAt(e.clientX, e.clientY);
+    };
     const doc = host.ownerDocument;
     injectStyles(STYLE_ID10, CSS10, doc);
     host.classList.add("vela-has-statusline");
@@ -4193,9 +4246,21 @@ var Statusline = class {
     this.ohlcEl.className = "vela-sl-ohlc";
     this.changeEl = doc.createElement("span");
     this.changeEl.className = "vela-sl-change";
-    this.el.append(this.avatarEl, this.symbolEl, this.metaEl, this.marketEl, this.ohlcEl, this.changeEl);
+    this.eyeEl = doc.createElement("button");
+    this.eyeEl.type = "button";
+    this.eyeEl.className = "vela-sl-eye";
+    this.eyeEl.innerHTML = iconAt("eye-off", 14);
+    this.eyeEl.setAttribute("aria-label", "Show chart");
+    this.eyeEl.style.display = "none";
+    this.eyeEl.addEventListener("click", (e) => {
+      e.stopPropagation();
+      this.menuHooks?.setChartVisible(true);
+      this.setChartHidden(false);
+    });
+    this.el.append(this.avatarEl, this.symbolEl, this.metaEl, this.marketEl, this.ohlcEl, this.changeEl, this.eyeEl);
     host.appendChild(this.el);
     this.marketTip = new Tooltip(this.marketEl, { content: MARKET_LABELS.open, placement: "bottom" });
+    this.eyeTip = new Tooltip(this.eyeEl, { content: "Show chart", placement: "bottom" });
     this.setMarketStatus("open");
     this.render();
   }
@@ -4205,6 +4270,7 @@ var Statusline = class {
     const fresh = tickerIconEl(this.el.ownerDocument, baseOfTicker(ticker), ticker, "vela-sl-avatar", this.iconFor?.(symbol));
     this.avatarEl.replaceWith(fresh);
     this.avatarEl = fresh;
+    this.syncParts();
     this.fit();
   }
   /**
@@ -4232,20 +4298,25 @@ var Statusline = class {
   }
   /** Project the parts config onto the segments (the baseline fit() prunes from). */
   syncParts() {
-    this.symbolEl.style.display = this.parts.name ? "" : "none";
-    this.marketEl.style.display = this.parts.market ? "" : "none";
-    this.ohlcEl.style.display = this.parts.ohlc ? "" : "none";
-    this.changeEl.style.display = this.parts.change ? "" : "none";
+    const seg = segmentVisibility(this.parts, this.chartHidden);
+    this.avatarEl.style.display = seg.avatar ? "" : "none";
+    this.symbolEl.style.display = seg.symbol ? "" : "none";
+    this.metaEl.style.display = seg.meta ? "" : "none";
+    this.marketEl.style.display = seg.market ? "" : "none";
+    this.ohlcEl.style.display = seg.ohlc ? "" : "none";
+    this.changeEl.style.display = seg.change ? "" : "none";
+    this.eyeEl.style.display = seg.eye ? "inline-flex" : "none";
   }
   /** Hide overflowing segments until the row fits its max-width (fit mode only). */
   fit() {
     if (!this.fitMode) return;
     this.syncParts();
+    const seg = segmentVisibility(this.parts, this.chartHidden);
     const order = [
-      [this.ohlcEl, this.parts.ohlc],
-      [this.changeEl, this.parts.change],
-      [this.metaEl, true],
-      [this.marketEl, this.parts.market]
+      [this.ohlcEl, seg.ohlc],
+      [this.changeEl, seg.change],
+      [this.metaEl, seg.meta],
+      [this.marketEl, seg.market]
     ];
     for (const [el, shown] of order) {
       if (this.el.scrollWidth <= this.el.clientWidth) break;
@@ -4266,7 +4337,6 @@ var Statusline = class {
     this.readout = readout;
     this.render();
   }
-  /** Show/hide one part (the settings dialog's Status line tab drives these). */
   /** The "· BINANCE · 1h" segment after the symbol — venue first, then resolution. */
   setMeta(timeframe, provider) {
     this.metaEl.textContent = `${provider ? `\xB7 ${provider.toUpperCase()} ` : ""}\xB7 ${timeframeLabel(timeframe)}`;
@@ -4285,6 +4355,9 @@ var Statusline = class {
     });
     this.marketTip.setContent(MARKET_LABELS[status]);
   }
+  /** Show/hide one part — the settings dialog's Status line tab and the right-click
+   *  menu both drive these. 'name' owns the venue/timeframe meta too (see
+   *  {@link segmentVisibility}). */
   setPartVisible(part, visible) {
     this.parts[part] = visible;
     this.syncParts();
@@ -4293,6 +4366,47 @@ var Statusline = class {
   partVisible(part) {
     return this.parts[part];
   }
+  /** Mirror the chart's (price series') visibility: dim the whole line like a hidden
+   *  indicator's legend row, drop the value readout (OHLC + bar change — values of a
+   *  series that isn't painted), and put the show-chart eye out in its place. The
+   *  parts config is untouched, so showing the chart restores the readout exactly as
+   *  configured. Idempotent; {@link render} re-syncs it from the live renderer, so
+   *  toggles made elsewhere (the object tree's eye) converge too. */
+  setChartHidden(hidden) {
+    if (hidden === this.chartHidden) return;
+    this.chartHidden = hidden;
+    this.el.classList.toggle("vela-sl-chart-hidden", hidden);
+    this.syncParts();
+    this.fit();
+  }
+  /** Wire the right-click action menu: one checkable toggle per part plus hide/show
+   *  for the chart itself. The menu is built once; later calls just swap the hooks. */
+  attachMenu(hooks) {
+    this.menuHooks = hooks;
+    if (this.menu) return;
+    this.menu = new Menu({
+      host: this.host,
+      items: [],
+      placement: "bottom-start",
+      // Pointer-anchored action menu — checked state reads as a leading ✓ (the
+      // same shape as the chart's own context menu).
+      checkmarks: true,
+      onSelect: (id) => this.runMenuItem(id)
+    });
+    this.el.addEventListener("contextmenu", this.onContextMenu);
+  }
+  runMenuItem(id) {
+    const hooks = this.menuHooks;
+    if (!hooks) return;
+    if (id.startsWith("part:")) {
+      const part = id.slice("part:".length);
+      hooks.setPart(part, !this.parts[part]);
+    } else if (id === "chart") {
+      const next = !hooks.chartVisible();
+      hooks.setChartVisible(next);
+      this.setChartHidden(!next);
+    }
+  }
   /** (Re)bind to a chart instance — called after every widget rebuild. */
   onChart(chart) {
     this.detach();
@@ -4314,7 +4428,11 @@ var Statusline = class {
     this.detach();
     this.fitRO?.disconnect();
     this.fitRO = null;
+    this.el.removeEventListener("contextmenu", this.onContextMenu);
+    this.menu?.destroy();
+    this.menu = null;
     this.marketTip.destroy();
+    this.eyeTip.destroy();
     this.marketBubble.destroy();
     this.host.classList.remove("vela-has-statusline", "vela-sl-fit-host");
     this.el.remove();
@@ -4324,6 +4442,7 @@ var Statusline = class {
     this.unsubs = [];
   }
   render() {
+    if (this.menuHooks) this.setChartHidden(!this.menuHooks.chartVisible());
     const bar = this.hoverBar ?? this.lastBar;
     if (!bar) {
       this.ohlcEl.replaceChildren();
@@ -5304,7 +5423,14 @@ var ChartCell = class {
     this.destroyed = false;
     this.appTheme = deps.theme;
     const symbol = prefixedSymbol(seed);
-    this.state = { symbol, provider: parseSymbol(symbol ?? "").provider ?? void 0, timeframe: seed.timeframe, priceStyle: seed.priceStyle, bars: seed.bars, session: normalizeSession(seed.session) };
+    this.state = {
+      symbol,
+      provider: parseSymbol(symbol ?? "").provider ?? void 0,
+      timeframe: seed.timeframe,
+      priceStyle: seed.priceStyle,
+      bars: seed.bars,
+      session: normalizeSession(seed.session)
+    };
     const doc = gridHost.ownerDocument;
     this.host = doc.createElement("div");
     this.host.className = "vela-cell";
@@ -5392,6 +5518,11 @@ var ChartCell = class {
     this.statusline = deps.statusline ? new Statusline(this.host, symbol ?? "", (sym) => this.inner?.data.symbolIcon(sym)) : null;
     this.statusline?.setMeta(seed.timeframe ?? "60", this.state.provider ?? "");
     this.statusline?.onChart(this.inner);
+    this.statusline?.attachMenu({
+      setPart: (part, visible) => this.setStatuslinePart(part, visible),
+      chartVisible: () => this.inner?.renderer.get("candleVisible") !== false,
+      setChartVisible: (visible) => this.inner?.renderer.set("candleVisible", visible)
+    });
     this.marketStatus = this.statusline ? new MarketStatusTracker((s) => this.statusline?.setMarketStatus(s)) : null;
     void this.inner.data.ready().then(() => {
       if (this.inner && this.state.symbol) {
@@ -5599,7 +5730,7 @@ var ChartCell = class {
           kind: "select",
           label: "Bars to fetch",
           id: "bars",
-          options: ["500", "1000", "2000", "5000", "10000", "20000"],
+          options: ["500", "1000", "2000", "5000", "10000", "20000", "50000", "60000", "80000", "100000"],
           get: () => String(this.state.bars ?? 1e3),
           set: (v) => {
             this.state.bars = Number(v);
@@ -5631,10 +5762,34 @@ var ChartCell = class {
         id: "status-line",
         rows: [
           { kind: "heading", label: "Status line", id: "parts" },
-          { kind: "toggle", label: "Symbol name", id: "name", get: () => sl.partVisible("name"), set: (v) => this.setStatuslinePart("name", v) },
-          { kind: "toggle", label: "Market status", id: "market", get: () => sl.partVisible("market"), set: (v) => this.setStatuslinePart("market", v) },
-          { kind: "toggle", label: "OHLC values", id: "ohlc", get: () => sl.partVisible("ohlc"), set: (v) => this.setStatuslinePart("ohlc", v) },
-          { kind: "toggle", label: "Bar change values", id: "change", get: () => sl.partVisible("change"), set: (v) => this.setStatuslinePart("change", v) },
+          {
+            kind: "toggle",
+            label: "Symbol name",
+            id: "name",
+            get: () => sl.partVisible("name"),
+            set: (v) => this.setStatuslinePart("name", v)
+          },
+          {
+            kind: "toggle",
+            label: "Market status",
+            id: "market",
+            get: () => sl.partVisible("market"),
+            set: (v) => this.setStatuslinePart("market", v)
+          },
+          {
+            kind: "toggle",
+            label: "OHLC values",
+            id: "ohlc",
+            get: () => sl.partVisible("ohlc"),
+            set: (v) => this.setStatuslinePart("ohlc", v)
+          },
+          {
+            kind: "toggle",
+            label: "Bar change values",
+            id: "change",
+            get: () => sl.partVisible("change"),
+            set: (v) => this.setStatuslinePart("change", v)
+          },
           { kind: "heading", label: "Indicators", id: "indicators" },
           {
             kind: "toggle",
@@ -5687,7 +5842,7 @@ var ChartCell = class {
   statusPrefs() {
     const sl = this.statusline;
     return {
-      parts: sl ? { name: sl.partVisible("name"), market: sl.partVisible("market"), ohlc: sl.partVisible("ohlc"), change: sl.partVisible("change") } : null,
+      parts: sl ? { logo: sl.partVisible("logo"), name: sl.partVisible("name"), market: sl.partVisible("market"), ohlc: sl.partVisible("ohlc"), change: sl.partVisible("change") } : null,
       indicatorTitles: this.indicatorTitlesOn,
       indicatorValues: this.indicatorValuesOn
     };
@@ -5861,7 +6016,8 @@ var ChartCell = class {
       if (this.manifest.length > 0) {
         for (const item of led.manifest) {
           const entry = this.manifest.find((e) => e.name === ledgerEntryName(item));
-          if (entry) this.addManifestInstance(entry, { record: false, ...typeof item === "object" ? { inputs: item.inputs, props: item.props } : {} });
+          if (entry)
+            this.addManifestInstance(entry, { record: false, ...typeof item === "object" ? { inputs: item.inputs, props: item.props } : {} });
         }
         this.pendingManifestNames = null;
       } else if (!this.deps.manifestSettled()) {
@@ -5910,7 +6066,10 @@ var ChartCell = class {
    * a persistence handler's `restore` runs silently, a user-driven call records.
    */
   addExternalIndicator(entry) {
-    this.addManifestInstance({ ...entry, enabled: true }, { external: true, ...entry.inputs ? { inputs: entry.inputs } : {}, ...entry.props ? { props: entry.props } : {} });
+    this.addManifestInstance(
+      { ...entry, enabled: true },
+      { external: true, ...entry.inputs ? { inputs: entry.inputs } : {}, ...entry.props ? { props: entry.props } : {} }
+    );
   }
   /** Add ONE instance of a manifest entry (repeatable — duplicates are legitimate). */
   addManifestInstance(entry, opts = {}) {
@@ -7661,7 +7820,7 @@ function buildContext(host) {
 }
 
 // src/workspace/VelaWorkspace.ts
-var DEFAULT_TIMEFRAMES = ["1", "5", "15", "60", "240", "D", "W"];
+var DEFAULT_TIMEFRAMES = ["1", "5", "15", "30", "60", "240", "D", "W", "M"];
 var GAP_PX = 2;
 var POOL_CAP = 16;
 var TIME_AXIS_H3 = 22;