@luxalgo/vela 0.6.14 → 0.6.15

package/dist/index.cjs

@@ -300,6 +300,7 @@ var SERIES_LINE = "#3b82f6";
 var CROSSHAIR = "#9aa0ad";
 var SLATE_DEEP = "#1e293b";
 var SLATE = "#475569";
+var CHIP_PLATE = "#595959";
 var TRADE_LONG = ACCENT;
 var TRADE_SHORT = BEARISH;
 var TRADE_EXIT = "#d500f9";
@@ -527,6 +528,10 @@ registerIcon(
   "market-post",
   svg24('<path d="M12 10V2"/><path d="m4.93 10.93 1.41 1.41"/><path d="M2 18h2"/><path d="M20 18h2"/><path d="m19.07 10.93-1.41 1.41"/><path d="M22 22H2"/><path d="m16 14-4 4-4-4"/><path d="M16 6a4 4 0 0 0-8 0"/>')
 );
+registerIcon(
+  "market-extended",
+  svg24('<path d="M22 22H2"/><path d="M12 3a5 5 0 0 0 7.5 7.5A7.5 7.5 0 1 1 12 3Z"/>')
+);
 registerIcon("market-closed", svg24('<path d="M12 3a6 6 0 0 0 9 9 9 9 0 1 1-9-9Z"/>'));
 registerIcon(
   "market-holiday",
@@ -540,6 +545,8 @@ registerIcon("chevrons-right", S('<path d="m4 3.5 4.5 4.5L4 12.5"/><path d="m8.5
 registerIcon("chevrons-left", S('<path d="M12 3.5 7.5 8l4.5 4.5"/><path d="M7.5 3.5 3 8l4.5 4.5"/>'));
 registerIcon("check", S('<path d="m2.8 8.4 3.4 3.4 7-7.6"/>'));
 registerIcon("close", S('<path d="m3.8 3.8 8.4 8.4M12.2 3.8l-8.4 8.4"/>'));
+registerIcon("pin", S('<path d="M5.6 2.5h4.8M6.4 2.5v3.6L4.4 8.4v.9h7.2v-.9L9.6 6.1V2.5M8 9.3v4.2"/>'));
+registerIcon("pin-filled", S('<path d="M5.6 2.5h4.8M6.4 2.5v3.6L4.4 8.4v.9h7.2v-.9L9.6 6.1V2.5M8 9.3v4.2"/><path d="M6.4 2.5h3.2v3.6l2 2.3v.9H4.4v-.9l2-2.3z" fill="currentColor" stroke="none"/>'));
 registerIcon("eye", S('<path d="M1.5 8s2.5-5.4 6.5-5.4S14.5 8 14.5 8 12 13.4 8 13.4 1.5 8 1.5 8z"/><circle cx="8" cy="8" r="1.8"/>'));
 registerIcon("eye-off", S('<path d="M1.5 8s2.5-5.4 6.5-5.4S14.5 8 14.5 8 12 13.4 8 13.4 1.5 8 1.5 8z" opacity="0.45"/><path d="m3 13 10-10"/>'));
 registerIcon("lock", S('<rect x="3.2" y="7" width="9.6" height="6.6" rx="1.2"/><path d="M5.6 7V5.2a2.4 2.4 0 0 1 4.8 0V7"/>'));
@@ -9296,6 +9303,15 @@ var RendererControl = class {
     console.warn(`[vela] renderer "${this.renderer.name}" does not support screenshot().`);
     return null;
   }
+  /**
+   * Raster of the current chart onto a canvas (same pixels as {@link screenshot}),
+   * or null if the renderer has no canvas export. Silent — a host compositing
+   * several charts skips a renderer that cannot contribute.
+   */
+  screenshotCanvas() {
+    if (typeof this.renderer.screenshotCanvas === "function") return this.renderer.screenshotCanvas();
+    return null;
+  }
   /**
    * The active renderer's full cosmetic config as a serializable, versioned JSON
    * document — persist it (templates, saved settings) and feed it back to
@@ -10914,6 +10930,12 @@ ${STATIC_DECLS}
 .vela-ui *, .vela-ui-layer * { box-sizing: border-box; }
 /* Text ENTRY is the one exception: selection is part of editing. */
 .vela-ui :is(input, textarea), .vela-ui-layer :is(input, textarea) { user-select: text; -webkit-user-select: text; }
+/* iOS Safari zooms the page when a focused field is under 16px, and often
+   keeps that zoom after the field blurs or a dialog closes. The shell's
+   mobile size class is the honest gate \u2014 not a media query \u2014 so an embedded
+   chart on a wide desktop still gets the rule when it is in the phone layout.
+   Scoped to the kit root so a host page's own [data-layout] is never touched. */
+.vela-ui[data-layout='mobile'] :is(input, textarea, select) { font-size: 16px; }
 .vela-icon { display: inline-flex; align-items: center; flex: none; }
 .vela-icon svg { display: block; }
 `;
@@ -15345,6 +15367,66 @@ function candleGeometry(xCss, spacing, dpr, bodyScale = 1) {
     center: (wickLeftDev + wickDev / 2) / dpr
   };
 }
+function aggregateCandleColumns(bars, i0, i1, xOf, yOf) {
+  const out = [];
+  let col = NaN;
+  let intervals = [];
+  const flush = () => {
+    if (intervals.length === 0) return;
+    const merged = [intervals[0]];
+    for (let k = 1; k < intervals.length; k += 1) {
+      const prev2 = merged[merged.length - 1];
+      const next = intervals[k];
+      if (Math.abs(yOf(prev2.hi) - yOf(next.lo)) < 1) {
+        prev2.hi = next.hi;
+        if (next.headIdx < prev2.headIdx) {
+          prev2.headIdx = next.headIdx;
+          prev2.headTime = next.headTime;
+          prev2.open = next.open;
+        }
+        if (next.lastIdx > prev2.lastIdx) {
+          prev2.lastIdx = next.lastIdx;
+          prev2.close = next.close;
+        }
+      } else {
+        merged.push(next);
+      }
+    }
+    for (const iv of merged) out.push({ x: col, hi: iv.hi, lo: iv.lo, headTime: iv.headTime, open: iv.open, close: iv.close });
+    intervals = [];
+  };
+  for (let i = i0; i <= i1; i += 1) {
+    const b = bars[i];
+    if (!b || b.high <= b.low) continue;
+    const x = Math.round(xOf(i));
+    if (x !== col) {
+      flush();
+      col = x;
+    }
+    let lo = b.low;
+    let hi = b.high;
+    let headIdx = i;
+    let headTime = b.time;
+    let open2 = b.open;
+    for (let k = intervals.length - 1; k >= 0; k -= 1) {
+      const iv = intervals[k];
+      if (iv.lo > hi || iv.hi < lo) continue;
+      if (iv.lo < lo) lo = iv.lo;
+      if (iv.hi > hi) hi = iv.hi;
+      if (iv.headIdx < headIdx) {
+        headIdx = iv.headIdx;
+        headTime = iv.headTime;
+        open2 = iv.open;
+      }
+      intervals.splice(k, 1);
+    }
+    let insertAt = 0;
+    while (insertAt < intervals.length && intervals[insertAt].lo < lo) insertAt += 1;
+    intervals.splice(insertAt, 0, { lo, hi, headIdx, headTime, open: open2, lastIdx: i, close: b.close });
+  }
+  flush();
+  return out;
+}
 
 // src/renderers/native/core/chartConfig.ts
 var CHART_CONFIG_VERSION = 1;
@@ -15355,6 +15437,7 @@ var BASELINE_FILL_ALPHA_FAR = 0.05;
 var BASELINE_LEVEL_DEFAULT = 50;
 var PREMARKET_SHADE = withAlpha(WARNING, 0.08);
 var POSTMARKET_SHADE = withAlpha(ACCENT, 0.08);
+var EXTENDED_SHADE = POSTMARKET_SHADE;
 function defaultChartStyle() {
   return {
     chartTypes: {},
@@ -15363,7 +15446,7 @@ function defaultChartStyle() {
     gridHorz: { visible: true, color: null },
     borderColor: null,
     separatorColor: null,
-    crosshair: { color: CROSSHAIR, width: 1, style: "dashed", opacity: 0.4, labelBackground: SLATE },
+    crosshair: { color: CROSSHAIR, width: 1, style: "dashed", opacity: 0.4, labelBackground: CHIP_PLATE },
     candle: {
       bodyVisible: true,
       borderVisible: false,
@@ -15386,7 +15469,7 @@ function defaultChartStyle() {
       width: 2,
       baselineLevel: BASELINE_LEVEL_DEFAULT
     },
-    sessions: { premarketColor: PREMARKET_SHADE, postmarketColor: POSTMARKET_SHADE }
+    sessions: { premarketColor: PREMARKET_SHADE, postmarketColor: POSTMARKET_SHADE, extendedColor: EXTENDED_SHADE }
   };
 }
 var LINE_STYLES = ["solid", "dashed", "dotted"];
@@ -15615,7 +15698,8 @@ function mergeConfig(base, patch) {
     },
     sessions: {
       premarketColor: isColor(sessions.premarketColor) ? sessions.premarketColor : base.sessions.premarketColor,
-      postmarketColor: isColor(sessions.postmarketColor) ? sessions.postmarketColor : base.sessions.postmarketColor
+      postmarketColor: isColor(sessions.postmarketColor) ? sessions.postmarketColor : base.sessions.postmarketColor,
+      extendedColor: isColor(sessions.extendedColor) ? sessions.extendedColor : base.sessions.extendedColor
     },
     stacking: {
       candles: isNum(stacking.candles) ? stacking.candles : base.stacking.candles,
@@ -16600,44 +16684,19 @@ var WebGL2Backend = class {
     }
   }
   /**
-   * Sub-pixel LOD (mirrors Canvas2dBackend.drawCandlesAggregated): bucket bars
-   * sharing a rounded pixel column into one high-low stick → draw cost bounded by
-   * screen width, not bar count. Bucket color follows first-open→last-close.
+   * Sub-pixel LOD (mirrors Canvas2dBackend.drawCandlesAggregated): bars sharing a
+   * rounded pixel column collapse into high-low sticks — one per contiguous
+   * coverage run (see {@link aggregateCandleColumns}), so a price gap inside the
+   * column stays a void. Draw cost stays bounded by screen width, not bar count;
+   * stick color follows its own first-open→last-close.
    */
   emitCandlesAggregated(b, bars, i0, i1, coords, pane, up, down, barColors) {
-    let px = NaN;
-    let lo = Infinity;
-    let hi = -Infinity;
-    let openV = 0;
-    let closeV = 0;
-    let headTime = 0;
-    let active = false;
-    const flush = () => {
-      if (!active) return;
-      const c = parseColor(barColors.get(headTime) ?? (closeV >= openV ? up : down));
-      const hY = coords.priceToY(hi, pane.scale, pane.bounds);
-      const lY = coords.priceToY(lo, pane.scale, pane.bounds);
-      b.rect(px - 0.5, hY, 1, lY - hY, c);
-    };
-    for (let i = i0; i <= i1; i += 1) {
-      const bar = bars[i];
-      if (!bar || bar.high <= bar.low) continue;
-      const x = Math.round(coords.logicalToX(i));
-      if (!active || x !== px) {
-        flush();
-        px = x;
-        lo = bar.low;
-        hi = bar.high;
-        openV = bar.open;
-        headTime = bar.time;
-        active = true;
-      } else {
-        if (bar.low < lo) lo = bar.low;
-        if (bar.high > hi) hi = bar.high;
-      }
-      closeV = bar.close;
+    const yOf = (price) => coords.priceToY(price, pane.scale, pane.bounds);
+    for (const s of aggregateCandleColumns(bars, i0, i1, (i) => coords.logicalToX(i), yOf)) {
+      const c = parseColor(barColors.get(s.headTime) ?? (s.close >= s.open ? up : down));
+      const hY = yOf(s.hi);
+      b.rect(s.x - 0.5, hY, 1, yOf(s.lo) - hY, c);
     }
-    flush();
   }
   emitSeries(b, spec, pane, coords, i0, i1, theme, off = 0) {
     if (spec.kind === "candle" || spec.kind === "bar") {
@@ -17935,13 +17994,15 @@ var SceneGraph = class {
     if (!this.orderedCache) this.orderedCache = [...this.panes.values()].sort((a, b) => a.order - b.order);
     return this.orderedCache;
   }
-  /** The session zones resolved into colored bands (pre/post-market washes from the
-   *  config's session colors) — consumed by the same painting path as {@link highlights}. */
+  /** The session zones resolved into colored bands (pre/post-market or extended-hours
+   *  washes from the config's session colors) — consumed by the same painting path as
+   *  {@link highlights}. */
   sessionHighlightBands() {
     if (!this.sessionZones) return [];
     const out = [];
     for (const [from, to] of this.sessionZones.pre) out.push({ from, to, color: this.style.sessions.premarketColor });
     for (const [from, to] of this.sessionZones.post) out.push({ from, to, color: this.style.sessions.postmarketColor });
+    for (const [from, to] of this.sessionZones.extended) out.push({ from, to, color: this.style.sessions.extendedColor });
     return out;
   }
   indicatorsForPane(paneId) {
@@ -18480,50 +18541,23 @@ var Canvas2dBackend = class {
     }
   }
   /**
-   * Sub-pixel LOD: bucket every bar sharing a rounded pixel column into ONE
-   * high-low stick, so draw cost is bounded by screen width (not bar count) when
-   * zoomed far out. The bucket's color follows its first-open→last-close
-   * direction (a barcolor() on the head bar still wins).
+   * Sub-pixel LOD: bars sharing a rounded pixel column collapse into high-low
+   * sticks (one per contiguous coverage run — see {@link aggregateCandleColumns}),
+   * so draw cost is bounded by screen width (not bar count) when zoomed far out
+   * and a price gap inside the column stays a void. Each stick's color follows
+   * its first-open→last-close direction (a barcolor() on the head bar still wins).
    */
   drawCandlesAggregated(ctx, bars, i0, i1, coords, pane, up, down, barColors) {
-    let px = NaN;
-    let lo = Infinity;
-    let hi = -Infinity;
-    let openV = 0;
-    let closeV = 0;
-    let headTime = 0;
-    let active = false;
-    const flush = () => {
-      if (!active) return;
-      const color = barColors.get(headTime) ?? (closeV >= openV ? up : down);
-      const hY = coords.priceToY(hi, pane.scale, pane.bounds);
-      const lY = coords.priceToY(lo, pane.scale, pane.bounds);
-      ctx.strokeStyle = color;
-      ctx.lineWidth = 1;
+    const yOf = (price) => coords.priceToY(price, pane.scale, pane.bounds);
+    ctx.lineWidth = 1;
+    for (const s of aggregateCandleColumns(bars, i0, i1, (i) => coords.logicalToX(i), yOf)) {
+      const x = s.x + 0.5;
+      ctx.strokeStyle = barColors.get(s.headTime) ?? (s.close >= s.open ? up : down);
       ctx.beginPath();
-      ctx.moveTo(px, hY);
-      ctx.lineTo(px, lY);
+      ctx.moveTo(x, yOf(s.hi));
+      ctx.lineTo(x, yOf(s.lo));
       ctx.stroke();
-    };
-    for (let i = i0; i <= i1; i += 1) {
-      const b = bars[i];
-      if (!b || b.high <= b.low) continue;
-      const x = Math.round(coords.logicalToX(i)) + 0.5;
-      if (!active || x !== px) {
-        flush();
-        px = x;
-        lo = b.low;
-        hi = b.high;
-        openV = b.open;
-        headTime = b.time;
-        active = true;
-      } else {
-        if (b.low < lo) lo = b.low;
-        if (b.high > hi) hi = b.high;
-      }
-      closeV = b.close;
     }
-    flush();
   }
   drawSeries(ctx, spec, pane, coords, i0, i1, theme, off = 0) {
     if (spec.kind === "candle" || spec.kind === "bar") {
@@ -19547,6 +19581,32 @@ var DrawingSceneRenderer = class {
   }
 };
 
+// src/renderers/native/chrome/tz.ts
+function tzOffsetMs(ms, timeZone) {
+  if (!timeZone || timeZone === "UTC") return 0;
+  try {
+    const dtf = new Intl.DateTimeFormat("en-US", {
+      timeZone,
+      hourCycle: "h23",
+      year: "numeric",
+      month: "2-digit",
+      day: "2-digit",
+      hour: "2-digit",
+      minute: "2-digit",
+      second: "2-digit"
+    });
+    const parts = dtf.formatToParts(new Date(ms));
+    const get = (t) => Number(parts.find((p) => p.type === t)?.value);
+    const asUTC = Date.UTC(get("year"), get("month") - 1, get("day"), get("hour") % 24, get("minute"), get("second"));
+    return asUTC - ms;
+  } catch {
+    return 0;
+  }
+}
+function zonedDate(ms, timeZone) {
+  return new Date(ms + tzOffsetMs(ms, timeZone));
+}
+
 // src/renderers/native/chrome/ticks.ts
 function priceTicks(min, max, target = 6) {
   if (!(max > min) || !Number.isFinite(min) || !Number.isFinite(max)) return [];
@@ -19694,7 +19754,14 @@ var STEP_LADDER = [
   YEAR
 ];
 var MONTHS = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
+var WEEKDAYS = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
 var pad2 = (n) => n < 10 ? `0${n}` : String(n);
+function formatTimeStamp(ms, timeZone, barIntervalMs) {
+  const d = zonedDate(ms, timeZone);
+  const date = `${WEEKDAYS[d.getUTCDay()]} ${d.getUTCDate()} ${MONTHS[d.getUTCMonth()]} '${pad2(d.getUTCFullYear() % 100)}`;
+  if (barIntervalMs >= DAY) return date;
+  return `${date} ${pad2(d.getUTCHours())}:${pad2(d.getUTCMinutes())}`;
+}
 function pickStep(targetMs) {
   for (const step of STEP_LADDER) if (step >= targetMs) return step;
   return STEP_LADDER[STEP_LADDER.length - 1];
@@ -19736,32 +19803,6 @@ function timeTicks(fromMs, toMs, target = 8, offsetMs = 0) {
   return out;
 }
 
-// src/renderers/native/chrome/tz.ts
-function tzOffsetMs(ms, timeZone) {
-  if (!timeZone || timeZone === "UTC") return 0;
-  try {
-    const dtf = new Intl.DateTimeFormat("en-US", {
-      timeZone,
-      hourCycle: "h23",
-      year: "numeric",
-      month: "2-digit",
-      day: "2-digit",
-      hour: "2-digit",
-      minute: "2-digit",
-      second: "2-digit"
-    });
-    const parts = dtf.formatToParts(new Date(ms));
-    const get = (t) => Number(parts.find((p) => p.type === t)?.value);
-    const asUTC = Date.UTC(get("year"), get("month") - 1, get("day"), get("hour") % 24, get("minute"), get("second"));
-    return asUTC - ms;
-  } catch {
-    return 0;
-  }
-}
-function zonedDate(ms, timeZone) {
-  return new Date(ms + tzOffsetMs(ms, timeZone));
-}
-
 // src/renderers/native/chrome/ChromeRenderer.ts
 var ChromeRenderer = class {
   constructor() {
@@ -20208,7 +20249,7 @@ var CrosshairRenderer = class {
       const price = coords.yToPrice(ch.y, pane.scale, pane.bounds);
       this.chip(ctx, dataW + 1, ch.y, formatAxisValue(pane.scale, pane.bounds.height, price, percentScaleFor(scene, pane), scene.priceMintick, pane.axisFormat), chipBg, "left", false, theme.background);
     }
-    this.chip(ctx, x, dataH + 1, formatStamp(coords.logicalToTime(logical), scene.timezone), chipBg, "center", true, theme.background);
+    this.chip(ctx, x, dataH + 1, formatTimeStamp(coords.logicalToTime(logical), scene.timezone, coords.barInterval), chipBg, "center", true, theme.background);
   }
   destroy() {
     this.canvas = null;
@@ -20256,7 +20297,7 @@ var CrosshairRenderer = class {
         this.chip(ctx, dataW + 1, ext.y, formatAxisValue(pane.scale, pane.bounds.height, ext.price, percentScaleFor(scene, pane), scene.priceMintick, pane.axisFormat), chipBg, "left", false, theme.background);
       }
     }
-    this.chip(ctx, x, dataH + 1, formatStamp(ext.time, scene.timezone), chipBg, "center", true, theme.background);
+    this.chip(ctx, x, dataH + 1, formatTimeStamp(ext.time, scene.timezone, coords.barInterval), chipBg, "center", true, theme.background);
     ctx.globalAlpha = 1;
   }
   /** A soft band + a brighter crisp center line over the hovered separator, so it reads as
@@ -20289,11 +20330,6 @@ function setDash3(ctx, style) {
   else if (style === "dotted") ctx.setLineDash([2, 3]);
   else ctx.setLineDash([]);
 }
-function formatStamp(ms, timeZone) {
-  const d = zonedDate(ms, timeZone);
-  const pad = (n) => n < 10 ? `0${n}` : String(n);
-  return `${pad(d.getUTCMonth() + 1)}-${pad(d.getUTCDate())} ${pad(d.getUTCHours())}:${pad(d.getUTCMinutes())}`;
-}
 
 // src/core/timezones.ts
 var TIMEZONES = [
@@ -26782,6 +26818,9 @@ function clipHighlightRect(x1, x2, left, right) {
   const end = Math.min(right, x2);
   return end > x ? { x, width: end - x } : null;
 }
+function bandEdgeSlot(logical) {
+  return Math.ceil(logical) - 0.5;
+}
 var BackdropRenderer = class {
   constructor() {
     this.canvas = null;
@@ -26812,21 +26851,22 @@ var BackdropRenderer = class {
     this.drawGrid(ctx, scene, coords, theme, coords.width, gridAlpha);
   }
   /** Renderer-owned session highlight bands: full-height (all panes), behind the grid.
-   *  Session-zone washes (pre/post-market) paint first, host highlights on top. */
+   *  Session-zone washes paint first (edges snapped to bar-slot boundaries so a band
+   *  never cuts a candle in two), host highlights on top (continuous time mapping —
+   *  hosts may paint sub-bar spans). */
   drawHighlights(ctx, scene, coords) {
     const sessions = scene.sessionHighlightBands();
     if (sessions.length > 0) {
       const left = Math.max(0, coords.logicalToX(-0.5));
       const right = Math.min(coords.width, coords.logicalToX(coords.barCount - 0.5));
-      this.drawHighlightSet(ctx, sessions, coords, left, right);
+      this.drawHighlightSet(ctx, sessions, coords, left, right, true);
     }
-    this.drawHighlightSet(ctx, scene.highlights, coords, 0, coords.width);
+    this.drawHighlightSet(ctx, scene.highlights, coords, 0, coords.width, false);
   }
-  drawHighlightSet(ctx, bands, coords, left, right) {
+  drawHighlightSet(ctx, bands, coords, left, right, snapToSlots) {
+    const edgeX = (ms) => snapToSlots ? coords.logicalToX(bandEdgeSlot(coords.timeToLogical(ms))) : coords.timeToX(ms);
     for (const band of bands) {
-      const x1 = coords.timeToX(band.from);
-      const x2 = coords.timeToX(band.to);
-      const rect = clipHighlightRect(x1, x2, left, right);
+      const rect = clipHighlightRect(edgeX(band.from), edgeX(band.to), left, right);
       if (!rect) continue;
       ctx.fillStyle = band.color;
       ctx.fillRect(rect.x, 0, rect.width, coords.height);
@@ -27085,6 +27125,7 @@ function createCustomMark(doc, html, background) {
   });
   el.style.color = attributionMarkColor(background);
   el.innerHTML = html;
+  el.dataset.velaScreenshot = "1";
   return el;
 }
 function createAttributionMark(doc, background) {
@@ -27103,6 +27144,7 @@ function createAttributionMark(doc, background) {
     cursor: "pointer"
   });
   applyAttributionMarkTheme(a, background);
+  a.dataset.velaScreenshot = "1";
   const symbol = doc.createElement("span");
   symbol.className = "vela-attr-symbol";
   symbol.setAttribute("aria-hidden", "true");
@@ -28107,7 +28149,7 @@ var NativeRenderer = class {
         };
       })(),
       series: { style: this.scene.priceStyle, baseline: this.scene.baselineValue, spacing: this.coords.spacingScale },
-      sessions: { premarketColor: s.sessions.premarketColor, postmarketColor: s.sessions.postmarketColor }
+      sessions: { premarketColor: s.sessions.premarketColor, postmarketColor: s.sessions.postmarketColor, extendedColor: s.sessions.extendedColor }
     };
   }
   /**
@@ -28189,7 +28231,7 @@ var NativeRenderer = class {
       width: next.baseline.width,
       baselineLevel: next.baseline.baselineLevel
     };
-    s.sessions = { premarketColor: next.sessions.premarketColor, postmarketColor: next.sessions.postmarketColor };
+    s.sessions = { premarketColor: next.sessions.premarketColor, postmarketColor: next.sessions.postmarketColor, extendedColor: next.sessions.extendedColor };
     this.setPriceStyle(next.series.style);
     this.scene.candleOverride = candleOverrideFor(this.scene.priceStyle, s.chartTypes);
     this.scene.baselineValue = next.series.baseline;
@@ -28411,9 +28453,10 @@ var NativeRenderer = class {
    * opts in with a `data-vela-screenshot` attribute on the mount container's
    * subtree (the widget marks its status line, and its symbol watermark with
    * `"under"` — drawn beneath the canvases, where it sits on screen). Only the
-   * crosshair (L2) is intentionally excluded.
+   * crosshair (L2) is intentionally excluded. {@link screenshot} is this canvas
+   * as a PNG data URL.
    */
-  screenshot() {
+  screenshotCanvas() {
     if (!this.dataCanvas) return null;
     this.computeScales();
     this.paintData();
@@ -28441,7 +28484,10 @@ var NativeRenderer = class {
         if (el.getAttribute("data-vela-screenshot") !== "under") rasterizeOverlay(ctx, el, frame);
       }
     }
-    return out.toDataURL("image/png");
+    return out;
+  }
+  screenshot() {
+    return this.screenshotCanvas()?.toDataURL("image/png") ?? null;
   }
   /**
    * The candles-first-appear reveal — animates the **candles themselves** (no extra
@@ -29836,7 +29882,7 @@ var NativeRenderer = class {
     const pricePane = this.dataWindowPricePane();
     const ohlc = this.dataWindowOHLC(bar, pricePane);
     const parts = [];
-    if (bar) parts.push(formatStamp2(bar.time, this.scene.timezone));
+    if (bar) parts.push(formatStamp(bar.time, this.scene.timezone));
     if (ohlc) parts.push(`Open ${ohlc.o}, High ${ohlc.h}, Low ${ohlc.l}, Close ${ohlc.c}`);
     for (const group of this.dataWindowGroups(idx, pricePane)) {
       for (const row of group.rows) parts.push(`${row.label} ${row.value}`);
@@ -30723,7 +30769,7 @@ function formatStampParts(ms, timeZone) {
     time: `${p(d.getUTCHours())}:${p(d.getUTCMinutes())}`
   };
 }
-function formatStamp2(ms, timeZone) {
+function formatStamp(ms, timeZone) {
   const { date, time } = formatStampParts(ms, timeZone);
   return `${date} ${time}`;
 }
@@ -30754,7 +30800,7 @@ function sanitizeSessionZones(value) {
     }
     return out.sort((a, b) => a[0] - b[0]);
   };
-  return { pre: windows(v.pre), post: windows(v.post) };
+  return { pre: windows(v.pre), post: windows(v.post), extended: windows(v.extended) };
 }
 function clamp012(v) {
   return Math.max(0, Math.min(1, v));
@@ -31431,6 +31477,7 @@ exports.BEARISH = BEARISH;
 exports.BULLISH = BULLISH;
 exports.BarStore = BarStore;
 exports.CATEGORICAL = CATEGORICAL;
+exports.CHIP_PLATE = CHIP_PLATE;
 exports.CROSSHAIR = CROSSHAIR;
 exports.CachingDataFeed = CachingDataFeed;
 exports.DARK_THEME = DARK_THEME;

package/dist/index.d.cts

@@ -1,10 +1,10 @@
-import { D as DrawingsDocument, R as Resolved } from './contributions-lPojhTxI.cjs';
-export { B as BarsChangeReason, C as CellStateContext, b as ContextSelect, c as DataControl, d as DrawingsControl, e as EngineAlert, f as EngineCapabilities, g as EngineContextSnapshot, h as EngineFactory, i as EngineWarning, j as ExecutionHandlers, k as ExecutionMarket, l as ExecutionRequest, m as ExecutionSession, E as ExternalIndicatorEntry, F as FetchSeries, n as IndicatorEventMap, I as IndicatorHandle, o as IndicatorSummary, L as LegendActionDescriptor, p as LegendCalloutContent, q as LegendCalloutDescriptor, r as LegendCalloutItem, s as LegendCalloutSpec, t as LegendIndicatorInfo, N as NativeIndicator, u as NativeIndicatorContext, v as NativeIndicatorDescriptor, w as NativeIndicatorInfo, x as NativeIndicatorOutput, O as OVERRIDABLE_TOPBAR_IDS, P as ParsedSymbol, y as PreparedScript, z as RendererControl, A as RunIndicatorResult, G as SceneInspection, a as ScriptRun, H as ScriptRunCause, J as ScriptRunResult, S as ScriptingEngine, K as SidePanelButton, M as SidePanelDescriptor, Q as SidePanelHandle, T as SidePanelHeader, U as StatePersistenceHandler, X as StrategyFill, Y as StrategyState, Z as StrategyTrade, _ as SymbolRankingHook, $ as TypedEventBus, V as Vela, a0 as VelaDeps, a1 as VelaEventMap, a2 as VisibleBarRange, a3 as WidgetActionDescriptor, a4 as WidgetActionTarget, a5 as WidgetAttachment, W as WidgetContext, a6 as getNativeIndicator, a7 as legendActions, a8 as legendCallouts, a9 as nativeIndicatorDescriptors, aa as nativeIndicatorTypes, ab as registerDefaultEngine, ac as registerLegendAction, ad as registerLegendCallout, ae as registerNativeIndicator, af as registerSidePanel, ag as registerStatePersistence, ah as registerSymbolRanking, ai as registerWidgetAction, aj as registerWidgetAttachment, ak as resolveEngines, al as sidePanels, am as statePersistenceHandlers, an as symbolRanking, ao as topbarActionOverride, ap as unregisterDefaultEngine, aq as unregisterLegendAction, ar as unregisterLegendCallout, as as unregisterNativeIndicator, at as unregisterSidePanel, au as unregisterStatePersistence, av as unregisterWidgetAction, aw as unregisterWidgetAttachment, ax as widgetActions, ay as widgetAttachments } from './contributions-lPojhTxI.cjs';
-import { D as Drawing, S as SerializedDrawing, U as Unsubscribe, L as LineStyle, P as PriceStyle, e as IChartRenderer, R as RendererCapabilities, f as RendererDisplayOptions, g as IndicatorRenderHandle, h as IndicatorStatus, c as VelaTheme, O as OHLCV, i as Pane, j as PaneAction, k as MoveTarget, l as IndicatorModel, m as ScenePatch, I as InputValue, n as SymbolPickerFn, o as LegendActionView, p as LegendCalloutView, q as InputChangeEvent, T as ThemeName, C as CrosshairEvent, r as ClickEvent, A as AxisLongPressEvent, a as VisibleRange, s as DataWindowReadout, t as IDrawingsRendererPort, u as Millis, v as SnapMode, w as DrawingTypeKey, x as ToolbarDefinition, M as MarketConfig } from './options-CYS5Wmlx.cjs';
-export { y as AddIndicatorOptions, B as Background, z as BoxFontFamily, E as BoxHAlign, F as BoxTextSize, G as BoxVAlign, H as CandleBarColor, J as CandleSeries, K as CandleStyle, Q as DataWindowGroup, W as DataWindowOHLC, X as DataWindowRow, Y as DirtyRange, Z as DrawingBox, _ as DrawingExtend, $ as DrawingIntent, a0 as DrawingLabel, a1 as DrawingLine, a2 as DrawingLinefill, a3 as DrawingMode, a4 as DrawingPoint, a5 as DrawingPolyline, a6 as DrawingSeriesBar, a7 as DrawingSeriesGateway, a8 as DrawingSeriesState, a9 as DrawingStyle, aa as DrawingTable, ab as DrawingText, ac as DrawingXLoc, ad as DrawingsOption, ae as Fill, af as FillGradientStop, ag as IndicatorMeta, ah as InputCondition, ai as InputSchema, aj as InputType, ak as InputWhen, al as LabelStyle, am as LabelYLoc, an as LineLikeKind, ao as LineLikeSeries, ap as LineLikeStyle, aq as MarkerPoint, ar as MarkerSeries, as as MarketSnapshot, at as MarketSwitch, au as PaneAxis, av as PaneAxisBand, aw as PaneHint, ax as PaneKind, ay as PolylinePoint, az as PriceLine, aA as Projector, aB as ProviderName, aC as RendererConstructor, aD as Scene, aE as SchemaPatch, aF as SeriesKind, aG as SeriesPoint, aH as SeriesSpec, aI as SeriesValueDelta, aJ as SettingsField, aK as SettingsSchema, aL as SettingsVisibilityPolicy, aM as TableCell, aN as TableMerge, aO as TablePosition, aP as ToolbarGroupConfig, aQ as TradeExecution, aR as ValuePatch, b as VelaOptions, V as VisibleRangePreset, aS as buildToolbar, aT as defaultToolbar, aU as inputDeltas, aV as inputVisible } from './options-CYS5Wmlx.cjs';
-import { M as MarketDataFeed, D as DataProvider, P as ProviderInfo, a as SymbolDescriptor, S as SymbolInfo, b as ProviderCapabilities, B as BarRange } from './DataProvider-DlMtrwqM.cjs';
-export { A as ACCENT, a as ACCENT_BRIGHT, B as BEARISH, b as BULLISH, c as BarTransform, d as BasePaintingModulation, C as CATEGORICAL, e as CROSSHAIR, f as ChartTypeDefinition, g as ChartTypeSettingsInstance, h as ChartTypeSettingsSection, i as ChartTypeSettingsSubsection, D as DrawingTypeMeta, H as HIGHLIGHT, I as INFO, j as INVALID, k as IdentifiableKind, M as MARKER, N as NEUTRAL, l as NormalizedSettingsRow, R as RendererLayerArgs, m as RendererLayerDefinition, n as RendererLayerInstance, S as SERIES_LINE, o as SESSION_OFF, p as SESSION_POST, q as SESSION_PRE, r as SLATE, s as SLATE_DEEP, t as SeriesDataEngine, u as SeriesDataEngineHost, v as SettingsInlineControl, w as SettingsRowCondition, x as SettingsRowDescriptor, y as SettingsRowInlineNumber, z as SettingsRowSwatch, E as SettingsRowValueKey, F as SettingsRowWhen, G as SettingsRowWidth, J as SettingsSelectOption, K as SettingsValueRow, T as TRADE_EXIT, L as TRADE_LONG, O as TRADE_SHORT, V as VALID, W as WARNING, P as categoricalColor, Q as chartType, U as chartTypes, X as createDrawing, Y as deserializeDrawing, Z as drawingTypes, _ as getDrawingType, $ as normalizeSettingsRow, a0 as registerChartType, a1 as registerDrawingType, a2 as registerRendererDefaults, a3 as registerRendererLayer, a4 as rendererDefaults, a5 as rendererLayers, a6 as settingsRowValueKeys, a7 as stableSeriesId, a8 as tickerModifierIds, a9 as unregisterChartType, aa as unregisterRendererDefaults, ab as unregisterRendererLayer } from './plugin-Cwikpz1m.cjs';
-export { D as DEFAULT_PANEL_MAX_WIDTH, a as DEFAULT_PANEL_MIN_WIDTH, b as DEFAULT_PANEL_WIDTH, S as SidePanelOptions, c as clampPanelWidth } from './side-panel-CT9ZwIGz.cjs';
+import { D as DrawingsDocument, R as Resolved } from './contributions-x7iamlnd.cjs';
+export { B as BarsChangeReason, C as CellStateContext, b as ContextSelect, c as DataControl, d as DrawingsControl, e as EngineAlert, f as EngineCapabilities, g as EngineContextSnapshot, h as EngineFactory, i as EngineWarning, j as ExecutionHandlers, k as ExecutionMarket, l as ExecutionRequest, m as ExecutionSession, E as ExternalIndicatorEntry, F as FetchSeries, n as IndicatorEventMap, I as IndicatorHandle, o as IndicatorSummary, L as LegendActionDescriptor, p as LegendCalloutContent, q as LegendCalloutDescriptor, r as LegendCalloutItem, s as LegendCalloutSpec, t as LegendIndicatorInfo, N as NativeIndicator, u as NativeIndicatorContext, v as NativeIndicatorDescriptor, w as NativeIndicatorInfo, x as NativeIndicatorOutput, O as OVERRIDABLE_TOPBAR_IDS, P as ParsedSymbol, y as PreparedScript, z as RendererControl, A as RunIndicatorResult, G as SceneInspection, a as ScriptRun, H as ScriptRunCause, J as ScriptRunResult, S as ScriptingEngine, K as SidePanelButton, M as SidePanelDescriptor, Q as SidePanelHandle, T as SidePanelHeader, U as StatePersistenceHandler, X as StrategyFill, Y as StrategyState, Z as StrategyTrade, _ as SymbolRankingHook, $ as TypedEventBus, V as Vela, a0 as VelaDeps, a1 as VelaEventMap, a2 as VisibleBarRange, a3 as WidgetActionDescriptor, a4 as WidgetActionTarget, a5 as WidgetAttachment, W as WidgetContext, a6 as getNativeIndicator, a7 as legendActions, a8 as legendCallouts, a9 as nativeIndicatorDescriptors, aa as nativeIndicatorTypes, ab as registerDefaultEngine, ac as registerLegendAction, ad as registerLegendCallout, ae as registerNativeIndicator, af as registerSidePanel, ag as registerStatePersistence, ah as registerSymbolRanking, ai as registerWidgetAction, aj as registerWidgetAttachment, ak as resolveEngines, al as sidePanels, am as statePersistenceHandlers, an as symbolRanking, ao as topbarActionOverride, ap as unregisterDefaultEngine, aq as unregisterLegendAction, ar as unregisterLegendCallout, as as unregisterNativeIndicator, at as unregisterSidePanel, au as unregisterStatePersistence, av as unregisterWidgetAction, aw as unregisterWidgetAttachment, ax as widgetActions, ay as widgetAttachments } from './contributions-x7iamlnd.cjs';
+import { D as Drawing, S as SerializedDrawing, U as Unsubscribe, L as LineStyle, P as PriceStyle, e as IChartRenderer, R as RendererCapabilities, f as RendererDisplayOptions, g as IndicatorRenderHandle, h as IndicatorStatus, c as VelaTheme, O as OHLCV, i as Pane, j as PaneAction, k as MoveTarget, l as IndicatorModel, m as ScenePatch, I as InputValue, n as SymbolPickerFn, o as LegendActionView, p as LegendCalloutView, q as InputChangeEvent, T as ThemeName, C as CrosshairEvent, r as ClickEvent, A as AxisLongPressEvent, a as VisibleRange, s as DataWindowReadout, t as IDrawingsRendererPort, u as Millis, v as SnapMode, w as DrawingTypeKey, x as ToolbarDefinition, M as MarketConfig } from './options-bdSAtp7y.cjs';
+export { y as AddIndicatorOptions, B as Background, z as BoxFontFamily, E as BoxHAlign, F as BoxTextSize, G as BoxVAlign, H as CandleBarColor, J as CandleSeries, K as CandleStyle, Q as DataWindowGroup, W as DataWindowOHLC, X as DataWindowRow, Y as DirtyRange, Z as DrawingBox, _ as DrawingExtend, $ as DrawingIntent, a0 as DrawingLabel, a1 as DrawingLine, a2 as DrawingLinefill, a3 as DrawingMode, a4 as DrawingPoint, a5 as DrawingPolyline, a6 as DrawingSeriesBar, a7 as DrawingSeriesGateway, a8 as DrawingSeriesState, a9 as DrawingStyle, aa as DrawingTable, ab as DrawingText, ac as DrawingXLoc, ad as DrawingsOption, ae as Fill, af as FillGradientStop, ag as IndicatorMeta, ah as InputCondition, ai as InputSchema, aj as InputType, ak as InputWhen, al as LabelStyle, am as LabelYLoc, an as LineLikeKind, ao as LineLikeSeries, ap as LineLikeStyle, aq as MarkerPoint, ar as MarkerSeries, as as MarketSnapshot, at as MarketSwitch, au as PaneAxis, av as PaneAxisBand, aw as PaneHint, ax as PaneKind, ay as PolylinePoint, az as PriceLine, aA as Projector, aB as ProviderName, aC as RendererConstructor, aD as Scene, aE as SchemaPatch, aF as SeriesKind, aG as SeriesPoint, aH as SeriesSpec, aI as SeriesValueDelta, aJ as SettingsField, aK as SettingsSchema, aL as SettingsVisibilityPolicy, aM as TableCell, aN as TableMerge, aO as TablePosition, aP as ToolbarGroupConfig, aQ as TradeExecution, aR as ValuePatch, b as VelaOptions, V as VisibleRangePreset, aS as buildToolbar, aT as defaultToolbar, aU as inputDeltas, aV as inputVisible } from './options-bdSAtp7y.cjs';
+import { M as MarketDataFeed, D as DataProvider, P as ProviderInfo, a as SymbolDescriptor, S as SymbolInfo, b as ProviderCapabilities, B as BarRange } from './DataProvider-xH2VBcFT.cjs';
+export { A as ACCENT, a as ACCENT_BRIGHT, B as BEARISH, b as BULLISH, c as BarTransform, d as BasePaintingModulation, C as CATEGORICAL, e as CHIP_PLATE, f as CROSSHAIR, g as ChartTypeDefinition, h as ChartTypeSettingsInstance, i as ChartTypeSettingsSection, j as ChartTypeSettingsSubsection, D as DrawingTypeMeta, H as HIGHLIGHT, I as INFO, k as INVALID, l as IdentifiableKind, M as MARKER, N as NEUTRAL, m as NormalizedSettingsRow, R as RendererLayerArgs, n as RendererLayerDefinition, o as RendererLayerInstance, S as SERIES_LINE, p as SESSION_OFF, q as SESSION_POST, r as SESSION_PRE, s as SLATE, t as SLATE_DEEP, u as SeriesDataEngine, v as SeriesDataEngineHost, w as SettingsInlineControl, x as SettingsRowCondition, y as SettingsRowDescriptor, z as SettingsRowInlineNumber, E as SettingsRowSwatch, F as SettingsRowValueKey, G as SettingsRowWhen, J as SettingsRowWidth, K as SettingsSelectOption, L as SettingsValueRow, T as TRADE_EXIT, O as TRADE_LONG, P as TRADE_SHORT, V as VALID, W as WARNING, Q as categoricalColor, U as chartType, X as chartTypes, Y as createDrawing, Z as deserializeDrawing, _ as drawingTypes, $ as getDrawingType, a0 as normalizeSettingsRow, a1 as registerChartType, a2 as registerDrawingType, a3 as registerRendererDefaults, a4 as registerRendererLayer, a5 as rendererDefaults, a6 as rendererLayers, a7 as settingsRowValueKeys, a8 as stableSeriesId, a9 as tickerModifierIds, aa as unregisterChartType, ab as unregisterRendererDefaults, ac as unregisterRendererLayer } from './plugin-2sJcf5mk.cjs';
+export { D as DEFAULT_PANEL_MAX_WIDTH, a as DEFAULT_PANEL_MIN_WIDTH, b as DEFAULT_PANEL_WIDTH, S as SidePanelOptions, c as clampPanelWidth } from './side-panel-HF0IAzwf.cjs';
 export { i as iconMarkup, r as registerIcon } from './icons-BZYbJXSV.cjs';
 export { a as KeyBindingDescriptor, R as ResolvedBinding } from './keymap-CGOz5F5f.cjs';
 
@@ -129,11 +129,14 @@ interface BaselineSeriesStyle {
     /** Baseline position as a percent of the visible pane price range (0 = low, 100 = high). */
     baselineLevel: number;
 }
-/** Session-zone shading (the `sessionZones` feature): the wash painted over
- *  pre-market and post-market time bands. Alpha belongs in the color itself. */
+/** Session-zone shading (the `sessionZones` feature): the washes painted over
+ *  pre-market and post-market time bands on day-split tapes, and the single
+ *  extended-hours band on overnight roll tapes. Alpha belongs in the
+ *  color itself. */
 interface SessionShadeStyle {
     premarketColor: string;
     postmarketColor: string;
+    extendedColor: string;
 }
 interface ChartStyle {
     /** Per-chart-type settings (plugin SDK sections), keyed by type id then row key. */
@@ -256,11 +259,14 @@ interface ChartConfig {
          *  center-to-center pitch (and the crosshair step) without changing body width. 1 = default. */
         spacing: number;
     };
-    /** Session-zone shading — the washes painted over the pre/post-market bands a host
-     *  pushes through the `sessionZones` feature (no bands ⇒ the colors are dormant). */
+    /** Session-zone shading — the washes painted over the session bands a host pushes
+     *  through the `sessionZones` feature: pre/post-market on day-split tapes, the
+     *  single extended-hours phase on overnight roll tapes (no bands ⇒ the colors are
+     *  dormant). */
     sessions: {
         premarketColor: string;
         postmarketColor: string;
+        extendedColor: string;
     };
     /** Draw-order keys — what paints in front of what. The candles' own key plus one per
      *  indicator id; user drawings persist their keys in the drawings document, in the same
@@ -575,8 +581,10 @@ declare class NativeRenderer implements IChartRenderer {
      * opts in with a `data-vela-screenshot` attribute on the mount container's
      * subtree (the widget marks its status line, and its symbol watermark with
      * `"under"` — drawn beneath the canvases, where it sits on screen). Only the
-     * crosshair (L2) is intentionally excluded.
+     * crosshair (L2) is intentionally excluded. {@link screenshot} is this canvas
+     * as a PNG data URL.
      */
+    screenshotCanvas(): HTMLCanvasElement | null;
     screenshot(): string | null;
     /**
      * The candles-first-appear reveal — animates the **candles themselves** (no extra