@forgecharts/sdk 1.5.82 → 1.5.84

package/dist/internal.js

@@ -1,4 +1,4 @@
-import { TextStyle, Application, Container, Graphics, Text, FillGradient, CanvasTextMetrics } from 'pixi.js';
+import { TextStyle, Application, Graphics, Container, Text, FillGradient, CanvasTextMetrics } from 'pixi.js';
 import { forwardRef, useRef, useState, useEffect, useImperativeHandle, useCallback, createContext, useMemo, useContext } from 'react';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import ReactDOM, { createPortal } from 'react-dom';
@@ -1383,6 +1383,7 @@ var Series = class _Series {
   // ─── ISeries implementation ──────────────────────────────────────────────────
   setData(data) {
     this._data = [...data].sort((a, b) => a.time - b.time);
+    this._cutoffView = null;
     this.onDataChanged?.();
   }
   /**
@@ -1422,11 +1423,47 @@ var Series = class _Series {
         this._data = this._data.slice(this._data.length - 1e5);
       }
     }
+    this._cutoffView = null;
     this.onDataChanged?.();
   }
-  data() {
+  /**
+   * Bar-replay display cutoff. When set, data() returns only bars at or
+   * before this time while the FULL tape keeps flowing underneath — the
+   * datafeed keeps writing live bars via setData/update, and everything
+   * downstream (renderers, indicators, crosshair, last-price) naturally sees
+   * the truncated past. Replay is not a mode the pipeline knows about; it is
+   * this clamp plus a controller that moves it.
+   */
+  _cutoffTime = null;
+  _cutoffView = null;
+  setCutoffTime(time) {
+    this._cutoffTime = time;
+    this._cutoffView = null;
+    this.onDataChanged?.();
+  }
+  cutoffTime() {
+    return this._cutoffTime;
+  }
+  /** The complete tape, ignoring any replay cutoff. Datafeed-side reads only. */
+  fullData() {
     return this._data;
   }
+  data() {
+    if (this._cutoffTime === null) return this._data;
+    const len = this._data.length;
+    const cached = this._cutoffView;
+    if (cached && cached.len === len && cached.cutoff === this._cutoffTime) return cached.view;
+    let lo = 0;
+    let hi = len;
+    while (lo < hi) {
+      const mid = lo + hi >>> 1;
+      if (this._data[mid].time <= this._cutoffTime) lo = mid + 1;
+      else hi = mid;
+    }
+    const view = this._data.slice(0, lo);
+    this._cutoffView = { len, cutoff: this._cutoffTime, view };
+    return view;
+  }
   applyOptions(options) {
     this._options = { ...this._options, ...options };
   }
@@ -4757,14 +4794,14 @@ var Chart = class {
   _crosshairEnabled = true;
   _magnetMode = "snap-xy";
   // ── Trading overlay ───────────────────────────────────────────────────────────
-  /** Current set of order lines supplied by TChart for canvas rendering. */
+  /** Current set of order lines supplied by ForgeCharts for canvas rendering. */
   _tradingOrders = [];
   /** Called whenever a drawing is committed (created or updated). */
   onDrawingCommitted;
   /** Fired when an EXISTING drawing is modified via drag (handle or body move). */
   onDrawingEdited;
   _drawingEditDirty = false;
-  /** Ctrl+Z / Ctrl+Y — drawing history is owned by TChart. */
+  /** Ctrl+Z / Ctrl+Y — drawing history is owned by ForgeCharts. */
   onUndoRequest;
   onRedoRequest;
   /** Called whenever a drawing is deleted. */
@@ -4780,7 +4817,7 @@ var Chart = class {
   /** Called when the user drags a TP/SL pill off an entry line to create a bracket leg. */
   onTpSlCreate;
   /**
-   * Called after every pan or zoom interaction so external code (e.g. TChart)
+   * Called after every pan or zoom interaction so external code (e.g. ForgeCharts)
    * can check whether the visible time range now extends past the oldest
    * loaded bar and trigger a lazy history fetch.
    */
@@ -5283,11 +5320,11 @@ var Chart = class {
     }
     ctx.restore();
   }
-  /** Provides the overlay renderer with the latest order list from TChart. */
+  /** Provides the overlay renderer with the latest order list from ForgeCharts. */
   setTradingOrders(orders) {
     this._tradingOrders = orders;
   }
-  /** Provides the overlay renderer with the latest position list from TChart. */
+  /** Provides the overlay renderer with the latest position list from ForgeCharts. */
   setTradingPositions(_positions) {
   }
   /** Sets contract switch markers for continuous futures roll dates. */
@@ -6114,9 +6151,17 @@ var PixiCandlestickRenderer = class {
     this._gfx = new Graphics();
     layer.addChild(this._gfx);
   }
+  /** Clear this renderer's graphics — used when another style takes over. */
+  clear() {
+    this._gfx.clear();
+  }
   draw(bars, transform, opts) {
     const gfx = this._gfx;
     gfx.clear();
+    if (opts?.type === "bar") {
+      this._drawBars(bars, transform, opts);
+      return;
+    }
     if (bars.length === 0) return;
     const { plotWidth: pw, plotHeight: ph } = transform;
     const upColor = hexToNum(opts && "upColor" in opts ? opts.upColor : void 0, UP_COLOR);
@@ -6247,6 +6292,36 @@ var PixiCandlestickRenderer = class {
   /**
    * Converts OHLCV bars to Heikin-Ashi values before drawing.
    */
+  /** Classic OHLC bars: high-low spine, open tick left, close tick right. */
+  _drawBars(bars, transform, opts) {
+    const gfx = this._gfx;
+    if (bars.length === 0) return;
+    const upColor = hexToNum(opts && "upColor" in opts ? opts.upColor : void 0, UP_COLOR);
+    const downColor = hexToNum(opts && "downColor" in opts ? opts.downColor : void 0, DOWN_COLOR);
+    const { plotWidth: pw } = transform;
+    let barPitch = pw / Math.max(1, bars.length);
+    if (bars.length >= 2) {
+      const dx = Math.abs(transform.timeToX(bars[1].time) - transform.timeToX(bars[0].time));
+      if (dx > 0) barPitch = dx;
+    }
+    const tick = Math.max(1.5, Math.min(barPitch * 0.35, 6));
+    const lineW = barPitch < 3 ? 1 : 1.5;
+    for (const bar of bars) {
+      const x = transform.timeToX(bar.time);
+      if (x < -barPitch || x > pw + barPitch) continue;
+      const yHigh = transform.priceToY(bar.high);
+      const yLow = transform.priceToY(bar.low);
+      const yOpen = transform.priceToY(bar.open);
+      const yClose = transform.priceToY(bar.close);
+      const color = bar.close >= bar.open ? upColor : downColor;
+      gfx.moveTo(x, yHigh).lineTo(x, yLow);
+      if (barPitch >= 3) {
+        gfx.moveTo(x - tick, yOpen).lineTo(x, yOpen);
+        gfx.moveTo(x, yClose).lineTo(x + tick, yClose);
+      }
+      gfx.stroke({ color, width: lineW });
+    }
+  }
   drawHeikinAshi(bars, transform, opts) {
     const first = bars[0];
     const last = bars[bars.length - 1];
@@ -7569,6 +7644,10 @@ var PixiLineRenderer = class {
     this._gradientCache = null;
     this._gfx.destroy(true);
   }
+  /** Clear this renderer's graphics — used when another style takes over. */
+  clear() {
+    this._gfx.clear();
+  }
   draw(bars, transform, options) {
     const gfx = this._gfx;
     gfx.clear();
@@ -7663,6 +7742,10 @@ var PixiHistogramRenderer = class {
   destroy() {
     this._gfx.destroy(true);
   }
+  /** Clear this renderer's graphics — used when another style takes over. */
+  clear() {
+    this._gfx.clear();
+  }
   draw(bars, transform) {
     const gfx = this._gfx;
     gfx.clear();
@@ -8642,7 +8725,7 @@ var PixiChart = class {
   /** Fired when an EXISTING drawing is modified via drag (handle or body move). */
   onDrawingEdited;
   _drawingEditDirty = false;
-  /** Ctrl+Z / Ctrl+Y — drawing history is owned by TChart. */
+  /** Ctrl+Z / Ctrl+Y — drawing history is owned by ForgeCharts. */
   onUndoRequest;
   onRedoRequest;
   /** Called whenever a drawing is deleted. */
@@ -8657,7 +8740,7 @@ var PixiChart = class {
   onDrawingContextMenu;
   /** Called when the user double-clicks a drawing. */
   onDrawingDoubleClick;
-  /** Called after every pan/zoom so TChart can trigger lazy history loading. */
+  /** Called after every pan/zoom so ForgeCharts can trigger lazy history loading. */
   onViewportChanged;
   constructor(container, options = {}) {
     this._container = container;
@@ -8764,6 +8847,12 @@ var PixiChart = class {
           this.onViewportChanged?.();
         },
         onCrosshairMove: (x, y) => {
+          if (this._replaySelect) {
+            const t = this._cursorBucketTime(x);
+            this._replayHoverTime = t;
+            this._replaySelect.onHover(t);
+            this._drawReplayDim(x);
+          }
           if (!this._crosshairEnabled) return;
           if (this._magnetMode === "off") {
             this._crosshairRenderer.update(x, y, this._cursorBucketTime(x));
@@ -9053,7 +9142,7 @@ var PixiChart = class {
     }).catch(() => {
     });
   }
-  // ─── Drawing objects (used by PixiChart directly; TChart uses DrawingManager) ─
+  // ─── Drawing objects (used by PixiChart directly; ForgeCharts uses DrawingManager) ─
   /** @internal Used by PixiChart when DrawingManager pushes an update. */
   setDrawings(drawings) {
     this._drawings = [...drawings];
@@ -9062,6 +9151,47 @@ var PixiChart = class {
   // ─── Rendering ───────────────────────────────────────────────────────────────
   /** Styles whose renderer has already logged a failure this session. */
   _renderErrorLogged = /* @__PURE__ */ new Set();
+  // ── Bar-replay anchor selection ─────────────────────────────────────────
+  _replaySelect = null;
+  _replayHoverTime = null;
+  _replayDimGfx = null;
+  _replayClickHandler = null;
+  setReplaySelect(cb) {
+    this._replaySelect = cb;
+    this._replayHoverTime = null;
+    if (cb) {
+      this._replayClickHandler = () => {
+        if (this._replayHoverTime !== null) this._replaySelect?.onCommit(this._replayHoverTime);
+      };
+      this._app.canvas.addEventListener("click", this._replayClickHandler);
+      this._app.canvas.style.cursor = "crosshair";
+    } else {
+      if (this._replayClickHandler) {
+        this._app.canvas.removeEventListener("click", this._replayClickHandler);
+        this._replayClickHandler = null;
+      }
+      this._app.canvas.style.cursor = "";
+      if (this._replayDimGfx) {
+        this._replayDimGfx.clear();
+        this._replayDimGfx.destroy();
+        this._replayDimGfx = null;
+      }
+    }
+  }
+  /** Translucent veil over the bars a replay-anchor click would remove. */
+  _drawReplayDim(x) {
+    if (!this._replayDimGfx) {
+      this._replayDimGfx = new Graphics();
+      this._layers.get(5 /* Interaction */).addChildAt(this._replayDimGfx, 0);
+    }
+    const gfx = this._replayDimGfx;
+    const { plotWidth, plotHeight } = this._transform;
+    gfx.clear();
+    if (x >= 0 && x < plotWidth) {
+      gfx.rect(x, 0, plotWidth - x, plotHeight).fill({ color: 8421520, alpha: 0.35 });
+    }
+    this._layers.dirty.mark(5 /* Interaction */);
+  }
   _renderFrame() {
     if (!this._ready || this._destroyed) return;
     const t = this._transform;
@@ -9071,6 +9201,9 @@ var PixiChart = class {
     if (dirty.isDirty(1 /* PriceSeries */)) {
       this._autoFitPriceRange();
       dirty.mark(0 /* Background */);
+      this._candleRenderer.clear();
+      this._lineRenderer.clear();
+      this._histogramRenderer.clear();
       for (const series of this._series) {
         const opts = series.options();
         if (opts.visible === false) continue;
@@ -9283,6 +9416,16 @@ var PixiChart = class {
     }
     this._markViewportDirty();
   }
+  /**
+   * Pans the viewport so the bar at `time` sits at the horizontal center.
+   * Used by bar replay: the anchor candle the trader picked becomes the
+   * chart's center, with the (empty, dimmed-away) future to its right.
+   */
+  centerOnTime(time) {
+    const px = this._transform.timeToX(time);
+    this._transform.pan(-(px - this._transform.plotWidth / 2), 0);
+    this._markViewportDirty();
+  }
   /** Pans the viewport so the latest bar sits near the right edge. */
   _scrollToLatestBar() {
     let latestTime = -Infinity;
@@ -11207,8 +11350,10 @@ var KIT_FEATURE_TO_CAPABILITY = {
   multi_chart_layout: "multiChartLayout"
 };
 var UNMAPPED_KIT_FEATURES = [
-  "delayed_data",
-  "ai_script_conversion"
+  "delayed_data"
+  // 'ai_script_conversion' (deleted in migration 028) and 'agent' (the
+  // ai_agent duplicate, deleted in migration 052) used to sit here; a key
+  // that no longer exists in the catalog needs no unmapped entry.
 ];
 var PACKAGE_GATED_CAPABILITIES = new Set(
   Object.values(KIT_FEATURE_TO_CAPABILITY)
@@ -12018,8 +12163,8 @@ var ManagedTradingController = class {
   }
 };
 
-// src/api/TChart.ts
-var TChart = class _TChart {
+// src/api/ForgeCharts.ts
+var ForgeCharts = class _ForgeCharts {
   _core;
   _bus;
   _indicators;
@@ -12410,7 +12555,7 @@ var TChart = class _TChart {
         "[ForgeCharts] ForgeScript indicators are not enabled on the active license. Contact your license provider to enable the forgeScript feature."
       );
     }
-    let finalConfig = _TChart.OVERLAY_ONLY.has(config.type) && config.overlay !== true ? { ...config, overlay: true } : config;
+    let finalConfig = _ForgeCharts.OVERLAY_ONLY.has(config.type) && config.overlay !== true ? { ...config, overlay: true } : config;
     if (finalConfig.overlay !== true && !canUseMultiPane()) {
       console.warn("[ForgeCharts] multiPane is not enabled on the active license \u2014 indicator added as a price-pane overlay instead.");
       finalConfig = { ...finalConfig, overlay: true };
@@ -12588,7 +12733,7 @@ var TChart = class _TChart {
    */
   startDrawingTool(type) {
     this._assertAlive();
-    if (_TChart.EXTENDED_DRAWING_TOOLS.has(type) && !canUseExtendedDrawings()) {
+    if (_ForgeCharts.EXTENDED_DRAWING_TOOLS.has(type) && !canUseExtendedDrawings()) {
       console.warn(`[ForgeCharts] Drawing tool '${type}' requires the extendedDrawings feature, which is not enabled on the active license.`);
       return;
     }
@@ -12626,6 +12771,14 @@ var TChart = class _TChart {
   /** Set contract switch roll markers for continuous futures. */
   setContractSwitches(switches) {
     this._assertAlive();
+    if (!canRenderOverlays()) {
+      if (switches.length > 0) {
+        console.warn("[ForgeCharts] Overlay rendering (overlays) is not enabled on the active plan \u2014 contract switch markers suppressed.");
+      }
+      this._core.setContractSwitches([]);
+      this._core.markDirty();
+      return;
+    }
     this._core.setContractSwitches(switches);
     this._core.markDirty();
   }
@@ -12669,7 +12822,7 @@ var TChart = class _TChart {
     const snap = this._drawings.all().map((d) => ({ ...d, points: [...d.points] }));
     this._drawHistory.splice(this._drawHistIdx + 1);
     this._drawHistory.push(snap);
-    if (this._drawHistory.length > _TChart._HIST_MAX) this._drawHistory.shift();
+    if (this._drawHistory.length > _ForgeCharts._HIST_MAX) this._drawHistory.shift();
     this._drawHistIdx = this._drawHistory.length - 1;
   }
   /** Steps drawing state one edit back (Ctrl+Z). */
@@ -13034,6 +13187,186 @@ var TChart = class _TChart {
     }
     return this._unmanagedIngestion;
   }
+  // ─── Bar replay ───────────────────────────────────────────────────────────────
+  //
+  // Replay is a display cutoff on the primary series (Series.setCutoffTime)
+  // plus this controller moving it. The full tape keeps flowing underneath —
+  // live bars land in fullData() and stay hidden until stepped over or the
+  // replay exits — so no datafeed, indicator, or renderer knows replay
+  // exists. Selection (the hover shadow of what a click would remove) is a
+  // backend surface only Pixi implements; ForgeCharts refuses replay elsewhere.
+  /** Playback speeds, in bars per second. */
+  static REPLAY_SPEEDS = [0.5, 1, 2, 5, 10, 15, 20];
+  _replay = {
+    selecting: false,
+    active: false,
+    playing: false,
+    speedIdx: 1,
+    timer: null
+  };
+  _emitReplayState() {
+    this._bus.emit("replayStateChanged", {
+      selecting: this._replay.selecting,
+      active: this._replay.active,
+      playing: this._replay.playing,
+      speed: _ForgeCharts.REPLAY_SPEEDS[this._replay.speedIdx],
+      cutoffTime: this._series.cutoffTime()
+    });
+  }
+  /** Current replay state — the control strip's render source. */
+  replayState() {
+    return {
+      selecting: this._replay.selecting,
+      active: this._replay.active,
+      playing: this._replay.playing,
+      speed: _ForgeCharts.REPLAY_SPEEDS[this._replay.speedIdx],
+      cutoffTime: this._series.cutoffTime()
+    };
+  }
+  /**
+   * Enter replay-anchor selection: the cursor shadows everything a click
+   * would remove; clicking commits that bucket as the replay head. Returns
+   * false (with a warning) when the plan lacks bar_replay or the backend
+   * has no selection surface.
+   */
+  replayEnterSelection() {
+    this._assertAlive();
+    if (!canUseBarReplay()) {
+      console.warn("[ForgeCharts] Bar replay (bar_replay) is not enabled on the active plan.");
+      return false;
+    }
+    if (!this._core.setReplaySelect) {
+      console.warn("[ForgeCharts] Bar replay requires the Pixi render backend.");
+      return false;
+    }
+    this._replayStopTimer();
+    this._replay.selecting = true;
+    this._replay.playing = false;
+    this._core.setReplaySelect({
+      onHover: () => {
+      },
+      onCommit: (time) => this._replayCommit(time)
+    });
+    this._emitReplayState();
+    return true;
+  }
+  /** Leave selection without committing (existing replay, if any, survives). */
+  replayCancelSelection() {
+    this._assertAlive();
+    if (!this._replay.selecting) return;
+    this._replay.selecting = false;
+    this._core.setReplaySelect?.(null);
+    this._emitReplayState();
+  }
+  _replayCommit(time) {
+    this._replay.selecting = false;
+    this._core.setReplaySelect?.(null);
+    this._series.setCutoffTime(time);
+    this._replay.active = true;
+    this._replay.playing = false;
+    this._core.centerOnTime?.(time);
+    this._core.markDirty();
+    this._emitReplayState();
+  }
+  replayPlay() {
+    this._assertAlive();
+    if (!this._replay.active || this._replay.playing) return;
+    this._replay.playing = true;
+    this._replayStartTimer();
+    this._emitReplayState();
+  }
+  replayPause() {
+    this._assertAlive();
+    if (!this._replay.playing) return;
+    this._replay.playing = false;
+    this._replayStopTimer();
+    this._emitReplayState();
+  }
+  /** Advance the replay head n bars. Pauses at the end of the tape. */
+  replayStepForward(n = 1) {
+    this._assertAlive();
+    if (!this._replay.active) return;
+    const full = this._series.fullData();
+    const shown = this._series.data().length;
+    const nextIdx = Math.min(shown + n, full.length) - 1;
+    if (nextIdx < shown) {
+      this.replayPause();
+      return;
+    }
+    this._series.setCutoffTime(full[nextIdx].time);
+    this._core.markDirty();
+    if (nextIdx >= full.length - 1) this.replayPause();
+    this._emitReplayState();
+  }
+  /** Rewind the replay head n bars back in time (default 10). */
+  replayRewind(n = 10) {
+    this._assertAlive();
+    if (!this._replay.active) return;
+    const full = this._series.fullData();
+    const shown = this._series.data().length;
+    const idx = Math.max(shown - 1 - n, 0);
+    if (full.length === 0) return;
+    this._series.setCutoffTime(full[idx].time);
+    this._core.markDirty();
+    this._emitReplayState();
+  }
+  /** Set an exact playback speed (nearest catalogued value). */
+  replaySetSpeed(speed) {
+    this._assertAlive();
+    let best = 0;
+    for (let i = 0; i < _ForgeCharts.REPLAY_SPEEDS.length; i++) {
+      if (Math.abs(_ForgeCharts.REPLAY_SPEEDS[i] - speed) < Math.abs(_ForgeCharts.REPLAY_SPEEDS[best] - speed)) best = i;
+    }
+    this._replay.speedIdx = best;
+    if (this._replay.playing) this._replayStartTimer();
+    this._emitReplayState();
+  }
+  /**
+   * Restore a persisted replay session (browser refresh mid-replay). Applies
+   * the same gate as entering selection; the cutoff simply lands where it
+   * was, paused, with the anchor centered. A cutoff at or beyond the tape's
+   * head means the replay had effectively finished — nothing is restored.
+   */
+  replayRestore(cutoffTime, speed) {
+    this._assertAlive();
+    if (!canUseBarReplay()) return false;
+    const full = this._series.fullData();
+    const last = full[full.length - 1];
+    if (!last || cutoffTime >= last.time) return false;
+    if (speed !== void 0) this.replaySetSpeed(speed);
+    this._replayCommit(cutoffTime);
+    return true;
+  }
+  /** Cycle to the next playback speed; restarts the timer when playing. */
+  replayCycleSpeed() {
+    this._assertAlive();
+    this._replay.speedIdx = (this._replay.speedIdx + 1) % _ForgeCharts.REPLAY_SPEEDS.length;
+    if (this._replay.playing) this._replayStartTimer();
+    this._emitReplayState();
+    return _ForgeCharts.REPLAY_SPEEDS[this._replay.speedIdx];
+  }
+  /** Exit replay entirely: the full tape (live head included) returns. */
+  replayExit() {
+    this._assertAlive();
+    this._replayStopTimer();
+    this._replay.selecting = false;
+    this._replay.active = false;
+    this._replay.playing = false;
+    this._core.setReplaySelect?.(null);
+    this._series.setCutoffTime(null);
+    this._core.markDirty();
+    this._core.scrollToEnd();
+    this._emitReplayState();
+  }
+  _replayStartTimer() {
+    this._replayStopTimer();
+    const speed = _ForgeCharts.REPLAY_SPEEDS[this._replay.speedIdx];
+    this._replay.timer = setInterval(() => this.replayStepForward(1), Math.max(1e3 / speed, 16));
+  }
+  _replayStopTimer() {
+    if (this._replay.timer) clearInterval(this._replay.timer);
+    this._replay.timer = null;
+  }
   // ─── Datafeed ─────────────────────────────────────────────────────────────────
   _buildConnector(datafeed) {
     return new DatafeedConnector(datafeed, this._series, {
@@ -13090,7 +13423,7 @@ function createChart(config) {
   if (!config.container) {
     throw new Error("[ForgeCharts] createChart() requires a valid container element.");
   }
-  return new TChart(config);
+  return new ForgeCharts(config);
 }
 
 // src/api/ReferenceAPI.ts
@@ -18645,10 +18978,7 @@ function useHostLicense(apiUrl, getAuthToken) {
 function useUserPackage(apiUrl, getAuthToken) {
   useEffect(() => {
     const resolver3 = ChartRuntimeResolver.getInstance();
-    if (!apiUrl || !getAuthToken) {
-      resolver3.setUserPackageFeatures(null);
-      return;
-    }
+    if (!apiUrl || !getAuthToken) return;
     let cancelled = false;
     void (async () => {
       try {
@@ -23244,6 +23574,8 @@ var ChartCanvas = forwardRef(
     onPointerToolChange,
     initialPointerTool,
     initialSeriesType,
+    initialReplay,
+    onReplayStateChange,
     initialMagnetMode,
     onMagnetModeChange,
     drawingFavorites: drawingFavoritesProp,
@@ -23363,6 +23695,14 @@ var ChartCanvas = forwardRef(
       },
       addIndicator: (config) => chartRef.current?.addIndicator(config) ?? null,
       setSeriesType: (type) => chartRef.current?.setSeriesType(type),
+      toggleReplay: () => {
+        const chart = chartRef.current;
+        if (!chart) return;
+        const st = chart.replayState();
+        if (st.selecting) chart.replayCancelSelection();
+        else if (st.active) chart.replayExit();
+        else chart.replayEnterSelection();
+      },
       removeIndicator: (id) => chartRef.current?.removeIndicator(id),
       moveIndicatorToOverlay: (id) => chartRef.current?.moveIndicatorToOverlay(id),
       moveIndicatorToPane: (id, targetPaneId) => chartRef.current?.moveIndicatorToPane(id, targetPaneId),
@@ -23410,7 +23750,7 @@ var ChartCanvas = forwardRef(
     useEffect(() => {
       const container = priceRef.current;
       if (!container) return;
-      const chart = new TChart({
+      const chart = new ForgeCharts({
         container,
         symbol,
         interval: timeframe,
@@ -23424,6 +23764,10 @@ var ChartCanvas = forwardRef(
       for (const config of initialIndicators) {
         chart.addIndicator(config);
       }
+      chart.on("replayStateChanged", (s) => {
+        setReplayState(s.selecting || s.active ? s : null);
+        onReplayStateChangeRef.current?.(s);
+      });
       transformRef.current = chart.getTransform();
       const syncChartState = () => {
         setBars([...chart.getBars()]);
@@ -24383,6 +24727,37 @@ var ChartCanvas = forwardRef(
     selectPointerToolRef.current = handleToolSelect;
     const initialPointerAppliedRef = useRef(false);
     const initialSeriesAppliedRef = useRef(false);
+    const [replayState, setReplayState] = useState(null);
+    const [replayBarOffset, setReplayBarOffset] = useState(0);
+    const replayDragRef = useRef(null);
+    const onReplayStateChangeRef = useRef(onReplayStateChange);
+    useEffect(() => {
+      onReplayStateChangeRef.current = onReplayStateChange;
+    }, [onReplayStateChange]);
+    const initialReplayAppliedRef = useRef(false);
+    useEffect(() => {
+      if (initialReplayAppliedRef.current || !initialReplay || bars.length === 0) return;
+      initialReplayAppliedRef.current = true;
+      chartRef.current?.replayRestore(initialReplay.cutoffTime, initialReplay.speed);
+    }, [initialReplay, bars]);
+    useEffect(() => {
+      const move = (e) => {
+        const d = replayDragRef.current;
+        if (!d) return;
+        const host = outerRef.current;
+        const max = host ? Math.max(0, host.clientHeight - 80) : 400;
+        setReplayBarOffset(Math.min(max, Math.max(0, d.startOffset + (d.startY - e.clientY))));
+      };
+      const up = () => {
+        replayDragRef.current = null;
+      };
+      window.addEventListener("pointermove", move);
+      window.addEventListener("pointerup", up);
+      return () => {
+        window.removeEventListener("pointermove", move);
+        window.removeEventListener("pointerup", up);
+      };
+    }, []);
     useEffect(() => {
       if (!initialSeriesAppliedRef.current && initialSeriesType && chartRef.current) {
         initialSeriesAppliedRef.current = true;
@@ -24391,7 +24766,7 @@ var ChartCanvas = forwardRef(
       if (initialPointerAppliedRef.current || !initialPointerTool) return;
       initialPointerAppliedRef.current = true;
       selectPointerToolRef.current(initialPointerTool);
-    }, [initialPointerTool]);
+    }, [initialPointerTool, initialSeriesType]);
     const handleMagnetModeChange = useCallback((mode) => {
       setMagnetMode(mode);
       chartRef.current?.setMagnetMode(mode);
@@ -24487,6 +24862,124 @@ var ChartCanvas = forwardRef(
                 crosshairXRef.current = null;
               },
               children: [
+                replayState && (() => {
+                  const dark = effectiveTheme !== "light";
+                  const bg = dark ? "#000000" : "#ffffff";
+                  const fg = dark ? "#ffffff" : "#000000";
+                  const line = dark ? "rgba(255,255,255,0.22)" : "rgba(0,0,0,0.22)";
+                  const btn = {
+                    background: "transparent",
+                    border: "none",
+                    color: fg,
+                    cursor: "pointer",
+                    padding: "6px 10px",
+                    borderRadius: 6,
+                    fontSize: 12,
+                    display: "inline-flex",
+                    alignItems: "center",
+                    gap: 5,
+                    lineHeight: 1
+                  };
+                  const sep = /* @__PURE__ */ jsx("span", { style: { width: 1, alignSelf: "stretch", background: line, margin: "6px 4px" } });
+                  const call = (fn) => () => {
+                    if (chartRef.current) fn(chartRef.current);
+                  };
+                  return /* @__PURE__ */ jsxs("div", { style: {
+                    position: "absolute",
+                    left: 0,
+                    right: 0,
+                    bottom: replayBarOffset,
+                    zIndex: 8,
+                    display: "flex",
+                    alignItems: "center",
+                    gap: 2,
+                    height: 38,
+                    padding: "0 8px",
+                    boxSizing: "border-box",
+                    background: bg,
+                    color: fg,
+                    borderTop: `1px solid ${line}`,
+                    borderBottom: `1px solid ${line}`,
+                    userSelect: "none"
+                  }, children: [
+                    /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        title: "Drag to move",
+                        onPointerDown: (e) => {
+                          e.preventDefault();
+                          replayDragRef.current = { startY: e.clientY, startOffset: replayBarOffset };
+                        },
+                        style: { cursor: "ns-resize", padding: "6px 6px", color: fg, opacity: 0.55, fontSize: 12, letterSpacing: 1 },
+                        children: "\u2059\u2059"
+                      }
+                    ),
+                    sep,
+                    /* @__PURE__ */ jsx("span", { style: { fontSize: 12, fontWeight: 600, letterSpacing: 0.3, padding: "0 6px" }, children: "Replay" }),
+                    sep,
+                    replayState.selecting ? /* @__PURE__ */ jsx("span", { style: { fontSize: 12, padding: "0 8px", opacity: 0.85 }, children: "Click a bar to start replay from there" }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                      /* @__PURE__ */ jsx(
+                        "button",
+                        {
+                          style: btn,
+                          title: "Pick a new starting bar",
+                          onClick: call((c) => c.replayEnterSelection()),
+                          children: "\u2506\u2190 Select bar"
+                        }
+                      ),
+                      sep,
+                      /* @__PURE__ */ jsx(
+                        "button",
+                        {
+                          style: btn,
+                          title: "Rewind 10 bars",
+                          onClick: call((c) => c.replayRewind(10)),
+                          children: "\u23EA"
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(
+                        "button",
+                        {
+                          style: btn,
+                          title: replayState.playing ? "Pause" : "Play",
+                          onClick: call((c) => replayState.playing ? c.replayPause() : c.replayPlay()),
+                          children: replayState.playing ? "\u23F8" : "\u25B6"
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(
+                        "button",
+                        {
+                          style: btn,
+                          title: "Forward one bar",
+                          onClick: call((c) => c.replayStepForward(1)),
+                          children: "\u23E9"
+                        }
+                      ),
+                      /* @__PURE__ */ jsxs(
+                        "button",
+                        {
+                          style: { ...btn, fontVariantNumeric: "tabular-nums", minWidth: 44, justifyContent: "center" },
+                          title: "Playback speed (0.5\u201320 bars per second)",
+                          onClick: call((c) => c.replayCycleSpeed()),
+                          children: [
+                            replayState.speed,
+                            "x"
+                          ]
+                        }
+                      )
+                    ] }),
+                    /* @__PURE__ */ jsx("span", { style: { flex: 1 } }),
+                    /* @__PURE__ */ jsx(
+                      "button",
+                      {
+                        style: btn,
+                        title: replayState.selecting ? "Cancel selection" : "Exit replay",
+                        onClick: call((c) => replayState.selecting ? c.replayCancelSelection() : c.replayExit()),
+                        children: "\u2715"
+                      }
+                    )
+                  ] });
+                })(),
                 /* @__PURE__ */ jsx(
                   "div",
                   {
@@ -24574,7 +25067,7 @@ var ChartCanvas = forwardRef(
                           symbol,
                           timeframe,
                           bars,
-                          theme,
+                          theme: effectiveTheme,
                           indicators,
                           overlayColors: OVERLAY_COLORS,
                           onRemove: handleRemoveIndicator,
@@ -25630,7 +26123,7 @@ var demonstrationTool = {
 };
 
 // src/version.ts
-var FORGECHARTS_VERSION = "1.5.82" ;
+var FORGECHARTS_VERSION = "1.5.84" ;
 
 // src/compatibility.ts
 var MIN_KIT_API = 1;
@@ -25687,6 +26180,6 @@ function checkKitCompatibility(kit) {
   return { ...base, level: "ok", message: `SDK ${sdkVersion} matches the Kit.` };
 }
 
-export { CROSSHAIR_LABEL, CROSSHAIR_STYLE, CURRENT_SCHEMA_VERSION, CURSOR_LABEL, CURSOR_STYLE, CandleEngine, Chart, ChartRuntimeResolver, CoordTransform, Crosshair, DEFAULT_SYNC_OPTIONS, DEMONSTRATION_COLOR, DEMONSTRATION_FILL, DEMONSTRATION_LABEL, DEMONSTRATION_RADIUS, DEMONSTRATION_STROKE, DEMONSTRATION_STYLE, DOT_COLOR, DOT_LABEL, DOT_RADIUS, DOT_STYLE, DatafeedConnector, DirtyFlags, ForgeScriptIndicator, ForgeScriptRuntime, Series2 as ForgeScriptSeries, GridChartContainer, GridSyncProvider, IndicatorDAG, InteractionManager, KIT_FEATURE_TO_CAPABILITY, LayerName, LayoutTemplateSelector, LicenseManager, MAX_KIT_API, MIN_KIT_API, ManagedTradingController, PACKAGE_GATED_CAPABILITIES, PRODUCT_TIERS, PaneManager, PixiBenchmark, PixiChart, PixiLayerManager, PriceScale, ReferenceAPI, Series, TChart, TimeScale, TradingOverlayStore, UNMAPPED_KIT_FEATURES, UnmanagedIngestion, assertCanPlaceOrders, assertCanUseBrackets, assertCanUseDraggableOrders, assertCanUseManagedTrading, assertManagedMode, canPlaceBrackets, canPlaceOrders, canRenderBracketControls, canRenderBuySellButtons, canRenderCandles, canRenderDrawings, canRenderExternalOverlayOnlyMode, canRenderFills, canRenderIndicators, canRenderManagedTradingControls, canRenderOrderEntry, canRenderOrderModificationControls, canRenderOrderTicket, canRenderOverlays, canRenderPositions, canUseAiAgent, canUseAlerts, canUseBarReplay, canUseBracketOrders, canUseChartTypes, canUseCustomIndicators, canUseCustomTimeframes, canUseDataExport, canUseDraggable, canUseDraggableOrders, canUseDrawingTools, canUseExtendedDrawings, canUseExternalIngestion, canUseForgeScript, canUseHistoricalData, canUseIndicators, canUseManagedTrading, canUseManagedTradingHook, canUseMultiChartLayout, canUseMultiPane, canUseMultipleProviders, canUseMultipleWorkspaces, canUseOrderEntry, canUsePositionsOverlay, canUseRealtimeData, canUseSavedLayouts, canUseTrailingStops, canUseWatchlists, checkKitCompatibility, clearTelemetryListeners, computeEMA, computeEMAFromSeries, computeMACD, computeRSI, computeSMA, computeSMAFromSeries, computeVolume, computeWMAFromSeries, createChart, crosshairTool, cursorTool, demonstrationTool, detectLanguage, detectLanguageWithFallback, dotTool, evaluateSaveGate, exchangeNow, extractField, getBucketStart2 as getBucketStart, getCapabilities, getDefaultCapabilities, getDefaultStyle, getGridTemplate, getGroupedTemplates, getMissingBarCount, getStyleSlots, hasFeature, initServerClock, isManagedCapable, isManagedMode, isUnmanagedMode, isValidCombination, lineStyleToDash, mergeBars, migrateLegacyPayload, onConversionEvent, packageAllows, resolveStyle, runSandbox, serverClockOffset, serverNow, timeframeToMs2 as timeframeToMs, toCapabilityFlags, useGridSync, validateForgeScript, validateLicensePolicy };
+export { CROSSHAIR_LABEL, CROSSHAIR_STYLE, CURRENT_SCHEMA_VERSION, CURSOR_LABEL, CURSOR_STYLE, CandleEngine, Chart, ChartRuntimeResolver, CoordTransform, Crosshair, DEFAULT_SYNC_OPTIONS, DEMONSTRATION_COLOR, DEMONSTRATION_FILL, DEMONSTRATION_LABEL, DEMONSTRATION_RADIUS, DEMONSTRATION_STROKE, DEMONSTRATION_STYLE, DOT_COLOR, DOT_LABEL, DOT_RADIUS, DOT_STYLE, DatafeedConnector, DirtyFlags, ForgeCharts, ForgeScriptIndicator, ForgeScriptRuntime, Series2 as ForgeScriptSeries, GridChartContainer, GridSyncProvider, IndicatorDAG, InteractionManager, KIT_FEATURE_TO_CAPABILITY, LayerName, LayoutTemplateSelector, LicenseManager, MAX_KIT_API, MIN_KIT_API, ManagedTradingController, PACKAGE_GATED_CAPABILITIES, PRODUCT_TIERS, PaneManager, PixiBenchmark, PixiChart, PixiLayerManager, PriceScale, ReferenceAPI, Series, ForgeCharts as TChart, TimeScale, TradingOverlayStore, UNMAPPED_KIT_FEATURES, UnmanagedIngestion, assertCanPlaceOrders, assertCanUseBrackets, assertCanUseDraggableOrders, assertCanUseManagedTrading, assertManagedMode, canPlaceBrackets, canPlaceOrders, canRenderBracketControls, canRenderBuySellButtons, canRenderCandles, canRenderDrawings, canRenderExternalOverlayOnlyMode, canRenderFills, canRenderIndicators, canRenderManagedTradingControls, canRenderOrderEntry, canRenderOrderModificationControls, canRenderOrderTicket, canRenderOverlays, canRenderPositions, canUseAiAgent, canUseAlerts, canUseBarReplay, canUseBracketOrders, canUseChartTypes, canUseCustomIndicators, canUseCustomTimeframes, canUseDataExport, canUseDraggable, canUseDraggableOrders, canUseDrawingTools, canUseExtendedDrawings, canUseExternalIngestion, canUseForgeScript, canUseHistoricalData, canUseIndicators, canUseManagedTrading, canUseManagedTradingHook, canUseMultiChartLayout, canUseMultiPane, canUseMultipleProviders, canUseMultipleWorkspaces, canUseOrderEntry, canUsePositionsOverlay, canUseRealtimeData, canUseSavedLayouts, canUseTrailingStops, canUseWatchlists, checkKitCompatibility, clearTelemetryListeners, computeEMA, computeEMAFromSeries, computeMACD, computeRSI, computeSMA, computeSMAFromSeries, computeVolume, computeWMAFromSeries, createChart, crosshairTool, cursorTool, demonstrationTool, detectLanguage, detectLanguageWithFallback, dotTool, evaluateSaveGate, exchangeNow, extractField, getBucketStart2 as getBucketStart, getCapabilities, getDefaultCapabilities, getDefaultStyle, getGridTemplate, getGroupedTemplates, getMissingBarCount, getStyleSlots, hasFeature, initServerClock, isManagedCapable, isManagedMode, isUnmanagedMode, isValidCombination, lineStyleToDash, mergeBars, migrateLegacyPayload, onConversionEvent, packageAllows, resolveStyle, runSandbox, serverClockOffset, serverNow, timeframeToMs2 as timeframeToMs, toCapabilityFlags, useGridSync, validateForgeScript, validateLicensePolicy };
 //# sourceMappingURL=internal.js.map
 //# sourceMappingURL=internal.js.map