hyperprop-charting-library 0.1.145 → 0.1.147

package/dist/index.cjs

@@ -2071,6 +2071,493 @@ var BUILTIN_DONCHIAN_INDICATOR = {
     return rangeOfSeries([upper, lower], startIndex, endIndex, skipIndex);
   }
 };
+var computeVolumeProfile = (data, fromIndex, toIndex, rowCount, valueAreaPercent) => {
+  const from = Math.max(0, Math.round(fromIndex));
+  const to = Math.min(data.length - 1, Math.round(toIndex));
+  if (to < from) return null;
+  let low = Number.POSITIVE_INFINITY;
+  let high = Number.NEGATIVE_INFINITY;
+  for (let i = from; i <= to; i += 1) {
+    const bar = data[i];
+    if (!bar) continue;
+    if (bar.l < low) low = bar.l;
+    if (bar.h > high) high = bar.h;
+  }
+  if (!Number.isFinite(low) || !Number.isFinite(high)) return null;
+  if (high - low < Number.EPSILON) {
+    const pad = Math.max(Math.abs(high) * 1e-6, 1e-6);
+    low -= pad;
+    high += pad;
+  }
+  const rows = Math.max(4, Math.min(500, Math.floor(rowCount) || 24));
+  const rowSize = (high - low) / rows;
+  const buckets = Array.from({ length: rows }, (_, index) => ({
+    low: low + index * rowSize,
+    high: low + (index + 1) * rowSize,
+    up: 0,
+    down: 0,
+    total: 0
+  }));
+  let totalVolume = 0;
+  for (let i = from; i <= to; i += 1) {
+    const bar = data[i];
+    if (!bar) continue;
+    const volume = Math.max(0, bar.v ?? 0);
+    if (volume <= 0) continue;
+    const firstRow = Math.max(0, Math.min(rows - 1, Math.floor((bar.l - low) / rowSize)));
+    const lastRow = Math.max(0, Math.min(rows - 1, Math.floor((bar.h - low) / rowSize)));
+    const share = volume / (lastRow - firstRow + 1);
+    const up = bar.c >= bar.o;
+    for (let row = firstRow; row <= lastRow; row += 1) {
+      const bucket = buckets[row];
+      if (up) bucket.up += share;
+      else bucket.down += share;
+      bucket.total += share;
+    }
+    totalVolume += volume;
+  }
+  if (totalVolume <= 0) return null;
+  let pocIndex = 0;
+  let maxRowVolume = 0;
+  for (let row = 0; row < rows; row += 1) {
+    const total = buckets[row].total;
+    if (total > maxRowVolume) {
+      maxRowVolume = total;
+      pocIndex = row;
+    }
+  }
+  const target = totalVolume * Math.min(0.99, Math.max(0.1, valueAreaPercent / 100));
+  let valueAreaFrom = pocIndex;
+  let valueAreaTo = pocIndex;
+  let accumulated = buckets[pocIndex].total;
+  while (accumulated < target && (valueAreaFrom > 0 || valueAreaTo < rows - 1)) {
+    const above = valueAreaTo < rows - 1 ? buckets[valueAreaTo + 1].total : -1;
+    const below = valueAreaFrom > 0 ? buckets[valueAreaFrom - 1].total : -1;
+    if (above < 0 && below < 0) break;
+    if (above >= below) {
+      valueAreaTo += 1;
+      accumulated += above;
+    } else {
+      valueAreaFrom -= 1;
+      accumulated += below;
+    }
+  }
+  return { rows: buckets, rowSize, low, high, maxRowVolume, totalVolume, pocIndex, valueAreaFrom, valueAreaTo };
+};
+var sessionSegments = (renderContext, fromIndex, toIndex) => {
+  const session = renderContext.session;
+  if (!session) return [{ from: fromIndex, to: toIndex }];
+  const segments = [];
+  let start = fromIndex;
+  let day = session.dayAt(fromIndex);
+  for (let index = fromIndex + 1; index <= toIndex; index += 1) {
+    const current = session.dayAt(index);
+    if (current !== day) {
+      segments.push({ from: start, to: index - 1 });
+      start = index;
+      day = current;
+    }
+  }
+  segments.push({ from: start, to: toIndex });
+  return segments;
+};
+var withAlpha = (color, alpha) => {
+  const clamped = Math.max(0, Math.min(1, alpha));
+  if (color.startsWith("#") && (color.length === 7 || color.length === 4)) {
+    const hex = color.length === 4 ? `#${color[1]}${color[1]}${color[2]}${color[2]}${color[3]}${color[3]}` : color;
+    const r = Number.parseInt(hex.slice(1, 3), 16);
+    const g = Number.parseInt(hex.slice(3, 5), 16);
+    const b = Number.parseInt(hex.slice(5, 7), 16);
+    return `rgba(${r},${g},${b},${clamped})`;
+  }
+  if (color.startsWith("rgba(")) return color;
+  if (color.startsWith("rgb(")) return color.replace("rgb(", "rgba(").replace(")", `,${clamped})`);
+  return color;
+};
+var BUILTIN_VOLUME_PROFILE_INDICATOR = {
+  id: "volume-profile",
+  name: "Volume Profile",
+  pane: "overlay",
+  defaultInputs: {
+    // "visible" profiles everything on screen and follows pan/zoom; "session"
+    // draws one profile per trading day inside that day's bars.
+    scope: "visible",
+    rows: 40,
+    widthPercent: 28,
+    placement: "right",
+    valueAreaPercent: 70,
+    upColor: "#26a69a",
+    downColor: "#ef5350",
+    valueAreaOpacity: 0.55,
+    outsideOpacity: 0.22,
+    showPoc: true,
+    pocColor: "#f7a600",
+    showValueArea: true,
+    valueAreaColor: "#7e8aa3",
+    showLabels: true
+  },
+  draw: (ctx, renderContext, inputs) => {
+    const { yFromPrice, chartLeft, chartRight, chartTop, chartBottom, data } = renderContext;
+    if (!yFromPrice || data.length === 0) return;
+    const from = Math.max(0, renderContext.startIndex);
+    const to = Math.min(data.length - 1, renderContext.endIndex);
+    if (to < from) return;
+    const rows = Math.max(4, Math.min(500, Math.floor(Number(inputs.rows)) || 40));
+    const valueAreaPercent = Math.max(10, Math.min(99, Number(inputs.valueAreaPercent) || 70));
+    const perSession = inputs.scope === "session" && renderContext.session !== void 0;
+    const segments = perSession ? sessionSegments(renderContext, from, to) : [{ from, to }];
+    const widthRatio = Math.max(0.02, Math.min(0.9, (Number(inputs.widthPercent) || 28) / 100));
+    const placeLeft = inputs.placement === "left";
+    ctx.save();
+    ctx.beginPath();
+    ctx.rect(chartLeft, chartTop, chartRight - chartLeft, chartBottom - chartTop);
+    ctx.clip();
+    for (const segment of segments) {
+      const profile = withCachedComputation(
+        `volume-profile|${perSession ? "s" : "v"}|${segment.from}|${segment.to}|${rows}|${valueAreaPercent}`,
+        data,
+        () => computeVolumeProfile(data, segment.from, segment.to, rows, valueAreaPercent)
+      );
+      if (!profile || profile.maxRowVolume <= 0) continue;
+      const segmentLeft = renderContext.xFromIndex(segment.from) - renderContext.candleSpacing / 2;
+      const segmentRight = renderContext.xFromIndex(segment.to) + renderContext.candleSpacing / 2;
+      const available = perSession ? Math.max(0, Math.min(segmentRight, chartRight) - Math.max(segmentLeft, chartLeft)) : chartRight - chartLeft;
+      const maxWidth = available * (perSession ? Math.min(1, widthRatio * 2.2) : widthRatio);
+      if (maxWidth < (perSession ? 10 : 2)) continue;
+      const anchorX = perSession ? Math.max(segmentLeft, chartLeft) : placeLeft ? chartLeft : chartRight;
+      const direction = perSession ? 1 : placeLeft ? 1 : -1;
+      for (let row = 0; row < profile.rows.length; row += 1) {
+        const bucket = profile.rows[row];
+        if (bucket.total <= 0) continue;
+        const yTop = yFromPrice(bucket.high);
+        const yBottom = yFromPrice(bucket.low);
+        const height = Math.max(1, Math.abs(yBottom - yTop) - 1);
+        const top = Math.min(yTop, yBottom);
+        if (top > chartBottom || top + height < chartTop) continue;
+        const inValueArea = row >= profile.valueAreaFrom && row <= profile.valueAreaTo;
+        const alpha = inValueArea ? Math.max(0, Math.min(1, Number(inputs.valueAreaOpacity) || 0.55)) : Math.max(0, Math.min(1, Number(inputs.outsideOpacity) || 0.22));
+        const rowWidth = bucket.total / profile.maxRowVolume * maxWidth;
+        const upWidth = bucket.total > 0 ? rowWidth * (bucket.up / bucket.total) : 0;
+        ctx.fillStyle = withAlpha(inputs.upColor ?? "#26a69a", alpha);
+        ctx.fillRect(direction > 0 ? anchorX : anchorX - upWidth, top, upWidth, height);
+        ctx.fillStyle = withAlpha(inputs.downColor ?? "#ef5350", alpha);
+        const downWidth = rowWidth - upWidth;
+        ctx.fillRect(
+          direction > 0 ? anchorX + upWidth : anchorX - rowWidth,
+          top,
+          downWidth,
+          height
+        );
+      }
+      const lineFrom = direction > 0 ? anchorX : anchorX - maxWidth;
+      const lineTo = direction > 0 ? anchorX + maxWidth : anchorX;
+      const drawLevel = (price, color, label, dashed) => {
+        const y = yFromPrice(price);
+        if (y < chartTop || y > chartBottom) return;
+        ctx.save();
+        ctx.strokeStyle = color;
+        ctx.lineWidth = 1;
+        ctx.setLineDash(dashed ? [4, 3] : []);
+        ctx.beginPath();
+        ctx.moveTo(lineFrom, Math.round(y) + 0.5);
+        ctx.lineTo(lineTo, Math.round(y) + 0.5);
+        ctx.stroke();
+        ctx.restore();
+        if (inputs.showLabels && !perSession) {
+          ctx.save();
+          ctx.fillStyle = color;
+          ctx.font = "10px system-ui, -apple-system, Segoe UI, Roboto, sans-serif";
+          ctx.textAlign = direction > 0 ? "left" : "right";
+          ctx.textBaseline = "bottom";
+          ctx.fillText(label, direction > 0 ? lineFrom + 3 : lineTo - 3, y - 1);
+          ctx.restore();
+        }
+      };
+      const poc = profile.rows[profile.pocIndex];
+      if (inputs.showValueArea) {
+        const areaHigh = profile.rows[profile.valueAreaTo];
+        const areaLow = profile.rows[profile.valueAreaFrom];
+        const areaColor = inputs.valueAreaColor ?? "#7e8aa3";
+        drawLevel(areaHigh.high, areaColor, "VAH", true);
+        drawLevel(areaLow.low, areaColor, "VAL", true);
+      }
+      if (inputs.showPoc) {
+        drawLevel((poc.low + poc.high) / 2, inputs.pocColor ?? "#f7a600", "POC", false);
+      }
+    }
+    ctx.restore();
+  }
+};
+var parseMinutes = (value, fallback) => {
+  if (typeof value === "number" && Number.isFinite(value)) return value;
+  const match = /^(\d{1,2}):?(\d{2})$/.exec(String(value ?? "").trim());
+  if (!match) return fallback;
+  const hour = Number(match[1]);
+  const minute = Number(match[2]);
+  if (!Number.isFinite(hour) || !Number.isFinite(minute)) return fallback;
+  return hour * 60 + minute;
+};
+var computeSessionLevels = (data, session, rthStart, rthEnd, orMinutes) => {
+  const lastIndex = data.length - 1;
+  if (lastIndex < 0) return [];
+  const currentDay = session.dayAt(lastIndex);
+  if (!Number.isFinite(currentDay)) return [];
+  let currentFrom = lastIndex;
+  while (currentFrom > 0 && session.dayAt(currentFrom - 1) === currentDay) currentFrom -= 1;
+  const priorTo = currentFrom - 1;
+  const result = [];
+  if (priorTo >= 0) {
+    const priorDay = session.dayAt(priorTo);
+    let priorFrom = priorTo;
+    while (priorFrom > 0 && session.dayAt(priorFrom - 1) === priorDay) priorFrom -= 1;
+    let high = Number.NEGATIVE_INFINITY;
+    let low = Number.POSITIVE_INFINITY;
+    for (let i = priorFrom; i <= priorTo; i += 1) {
+      const bar = data[i];
+      if (!bar) continue;
+      if (bar.h > high) high = bar.h;
+      if (bar.l < low) low = bar.l;
+    }
+    const close = data[priorTo]?.c;
+    if (Number.isFinite(high)) result.push({ price: high, label: "PDH", color: "prior", fromIndex: currentFrom });
+    if (Number.isFinite(low)) result.push({ price: low, label: "PDL", color: "prior", fromIndex: currentFrom });
+    if (close !== void 0) result.push({ price: close, label: "PDC", color: "prior", fromIndex: currentFrom });
+  }
+  let onHigh = Number.NEGATIVE_INFINITY;
+  let onLow = Number.POSITIVE_INFINITY;
+  let orHigh = Number.NEGATIVE_INFINITY;
+  let orLow = Number.POSITIVE_INFINITY;
+  let ibHigh = Number.NEGATIVE_INFINITY;
+  let ibLow = Number.POSITIVE_INFINITY;
+  let orFromIndex = lastIndex;
+  let ibFromIndex = lastIndex;
+  for (let i = currentFrom; i <= lastIndex; i += 1) {
+    const bar = data[i];
+    if (!bar) continue;
+    const minutes = session.minutesOfDayAt(i);
+    if (!Number.isFinite(minutes)) continue;
+    if (minutes < rthStart || minutes >= rthEnd) {
+      if (bar.h > onHigh) onHigh = bar.h;
+      if (bar.l < onLow) onLow = bar.l;
+      continue;
+    }
+    if (minutes < rthStart + orMinutes) {
+      if (bar.h > orHigh) orHigh = bar.h;
+      if (bar.l < orLow) orLow = bar.l;
+      orFromIndex = Math.min(orFromIndex, i);
+    }
+    if (minutes < rthStart + 60) {
+      if (bar.h > ibHigh) ibHigh = bar.h;
+      if (bar.l < ibLow) ibLow = bar.l;
+      ibFromIndex = Math.min(ibFromIndex, i);
+    }
+  }
+  if (Number.isFinite(onHigh)) result.push({ price: onHigh, label: "ONH", color: "overnight", fromIndex: currentFrom });
+  if (Number.isFinite(onLow)) result.push({ price: onLow, label: "ONL", color: "overnight", fromIndex: currentFrom });
+  if (Number.isFinite(orHigh)) result.push({ price: orHigh, label: "ORH", color: "openingRange", fromIndex: orFromIndex });
+  if (Number.isFinite(orLow)) result.push({ price: orLow, label: "ORL", color: "openingRange", fromIndex: orFromIndex });
+  if (Number.isFinite(ibHigh)) result.push({ price: ibHigh, label: "IBH", color: "initialBalance", fromIndex: ibFromIndex });
+  if (Number.isFinite(ibLow)) result.push({ price: ibLow, label: "IBL", color: "initialBalance", fromIndex: ibFromIndex });
+  return result;
+};
+var BUILTIN_SESSION_LEVELS_INDICATOR = {
+  id: "session-levels",
+  name: "Session levels",
+  pane: "overlay",
+  defaultInputs: {
+    showPriorDay: true,
+    showOvernight: true,
+    showOpeningRange: true,
+    showInitialBalance: false,
+    // Cash-session bounds in the session's own zone; everything before the
+    // open on the same trading day counts as overnight.
+    rthStart: "09:30",
+    rthEnd: "16:00",
+    openingRangeMinutes: 30,
+    priorDayColor: "#8b93a7",
+    overnightColor: "#7c5cff",
+    openingRangeColor: "#26a69a",
+    initialBalanceColor: "#f7a600",
+    lineWidth: 1,
+    showLabels: true
+  },
+  draw: (ctx, renderContext, inputs) => {
+    const { yFromPrice, chartLeft, chartRight, chartTop, chartBottom, data, session } = renderContext;
+    if (!yFromPrice || !session || data.length === 0) return;
+    const rthStart = parseMinutes(inputs.rthStart, 570);
+    const rthEnd = parseMinutes(inputs.rthEnd, 960);
+    const orMinutes = Math.max(1, Math.floor(Number(inputs.openingRangeMinutes) || 30));
+    const levels = withCachedComputation(
+      `session-levels|${rthStart}|${rthEnd}|${orMinutes}|${data.length}`,
+      data,
+      () => computeSessionLevels(data, session, rthStart, rthEnd, orMinutes)
+    );
+    const groupEnabled = {
+      prior: inputs.showPriorDay !== false,
+      overnight: inputs.showOvernight !== false,
+      openingRange: inputs.showOpeningRange !== false,
+      initialBalance: inputs.showInitialBalance === true
+    };
+    const groupColor = {
+      prior: inputs.priorDayColor ?? "#8b93a7",
+      overnight: inputs.overnightColor ?? "#7c5cff",
+      openingRange: inputs.openingRangeColor ?? "#26a69a",
+      initialBalance: inputs.initialBalanceColor ?? "#f7a600"
+    };
+    ctx.save();
+    ctx.lineWidth = Math.max(1, Number(inputs.lineWidth) || 1);
+    ctx.font = "10px system-ui, -apple-system, Segoe UI, Roboto, sans-serif";
+    ctx.textAlign = "right";
+    ctx.textBaseline = "bottom";
+    for (const level of levels) {
+      if (!groupEnabled[level.color]) continue;
+      const y = yFromPrice(level.price);
+      if (!Number.isFinite(y) || y < chartTop || y > chartBottom) continue;
+      const startX = Math.max(chartLeft, renderContext.xFromIndex(level.fromIndex));
+      const color = groupColor[level.color] ?? "#8b93a7";
+      ctx.strokeStyle = color;
+      ctx.setLineDash(level.color === "prior" ? [] : [5, 4]);
+      ctx.beginPath();
+      ctx.moveTo(startX, Math.round(y) + 0.5);
+      ctx.lineTo(chartRight, Math.round(y) + 0.5);
+      ctx.stroke();
+      if (inputs.showLabels !== false) {
+        ctx.fillStyle = color;
+        ctx.fillText(level.label, chartRight - 4, y - 2);
+      }
+    }
+    ctx.restore();
+  }
+};
+var BUILTIN_ANCHORED_VWAP_INDICATOR = {
+  id: "anchored-vwap",
+  name: "Anchored VWAP",
+  pane: "overlay",
+  defaultInputs: {
+    anchorTime: "",
+    color: "#22d3ee",
+    width: 2,
+    showBands: false,
+    bandMultiplier: 1,
+    bandColor: "#94a3b8",
+    bandFillOpacity: 0.06,
+    showAnchorMarker: true
+  },
+  draw: (ctx, renderContext, inputs) => {
+    const { data, yFromPrice } = renderContext;
+    if (!yFromPrice || data.length === 0) return;
+    const anchorIndex = resolveAnchorIndex(renderContext, inputs.anchorTime);
+    if (anchorIndex === null) return;
+    const series = withCachedComputation(
+      `anchored-vwap|${anchorIndex}|${inputs.showBands ? "b" : "n"}`,
+      data,
+      () => computeAnchoredVwap(data, anchorIndex)
+    );
+    if (inputs.showBands) {
+      const multiplier = Math.max(0.1, Number(inputs.bandMultiplier) || 1);
+      const upper = series.vwap.map((value, idx) => {
+        const sigma = series.sigma[idx];
+        return value == null || sigma == null ? null : value + multiplier * sigma;
+      });
+      const lower = series.vwap.map((value, idx) => {
+        const sigma = series.sigma[idx];
+        return value == null || sigma == null ? null : value - multiplier * sigma;
+      });
+      const bandColor = inputs.bandColor ?? "#94a3b8";
+      fillBetweenSeries(ctx, renderContext, upper, lower, bandColor, Number(inputs.bandFillOpacity) || 0.06);
+      drawOverlaySeries(ctx, renderContext, upper, bandColor, 1);
+      drawOverlaySeries(ctx, renderContext, lower, bandColor, 1);
+    }
+    drawOverlaySeries(ctx, renderContext, series.vwap, inputs.color ?? "#22d3ee", Number(inputs.width) || 2);
+    if (inputs.showAnchorMarker !== false) {
+      const anchorBar = data[anchorIndex];
+      const anchorValue = series.vwap[anchorIndex];
+      if (anchorBar && anchorValue != null) {
+        const x = renderContext.xFromIndex(anchorIndex);
+        const y = yFromPrice(anchorValue);
+        if (x >= renderContext.chartLeft - 8 && x <= renderContext.chartRight + 8) {
+          ctx.save();
+          ctx.fillStyle = inputs.color ?? "#22d3ee";
+          ctx.beginPath();
+          ctx.arc(x, y, 3.5, 0, Math.PI * 2);
+          ctx.fill();
+          ctx.restore();
+        }
+      }
+    }
+  },
+  getAutoscaleRange: (data, startIndex, endIndex, inputs, skipIndex) => {
+    const anchorIndex = resolveAnchorIndexFromData(data, inputs.anchorTime);
+    if (anchorIndex === null) return null;
+    const series = withCachedComputation(
+      `anchored-vwap|${anchorIndex}|${inputs.showBands ? "b" : "n"}`,
+      data,
+      () => computeAnchoredVwap(data, anchorIndex)
+    );
+    if (!inputs.showBands) return rangeOfSeries([series.vwap], startIndex, endIndex, skipIndex);
+    const multiplier = Math.max(0.1, Number(inputs.bandMultiplier) || 1);
+    let min = Number.POSITIVE_INFINITY;
+    let max = Number.NEGATIVE_INFINITY;
+    for (let idx = startIndex; idx <= endIndex; idx += 1) {
+      if (idx === skipIndex) continue;
+      const value = series.vwap[idx];
+      const sigma = series.sigma[idx];
+      if (value == null || sigma == null) continue;
+      const lo = value - multiplier * sigma;
+      const hi = value + multiplier * sigma;
+      if (lo < min) min = lo;
+      if (hi > max) max = hi;
+    }
+    return min <= max ? { min, max } : null;
+  }
+};
+var resolveAnchorIndexFromData = (data, anchorTime) => {
+  if (data.length === 0) return null;
+  const raw = typeof anchorTime === "number" ? anchorTime : Date.parse(String(anchorTime ?? ""));
+  if (!Number.isFinite(raw)) return null;
+  let lo = 0;
+  let hi = data.length - 1;
+  if (raw <= data[0].time.getTime()) return 0;
+  if (raw >= data[hi].time.getTime()) return hi;
+  while (lo < hi) {
+    const mid = lo + hi + 1 >> 1;
+    if (data[mid].time.getTime() <= raw) lo = mid;
+    else hi = mid - 1;
+  }
+  return lo;
+};
+var resolveAnchorIndex = (renderContext, anchorTime) => {
+  const explicit = resolveAnchorIndexFromData(renderContext.data, anchorTime);
+  if (explicit !== null) return explicit;
+  const session = renderContext.session;
+  const lastIndex = renderContext.data.length - 1;
+  if (!session || lastIndex < 0) return lastIndex >= 0 ? 0 : null;
+  const day = session.dayAt(lastIndex);
+  let index = lastIndex;
+  while (index > 0 && session.dayAt(index - 1) === day) index -= 1;
+  return index;
+};
+var computeAnchoredVwap = (data, anchorIndex) => {
+  const vwap = new Array(data.length).fill(null);
+  const sigma = new Array(data.length).fill(null);
+  let cumPv = 0;
+  let cumPv2 = 0;
+  let cumV = 0;
+  for (let i = Math.max(0, anchorIndex); i < data.length; i += 1) {
+    const bar = data[i];
+    if (!bar) continue;
+    const typical = (bar.h + bar.l + bar.c) / 3;
+    const volume = Math.max(0, bar.v ?? 0) || 1;
+    cumPv += typical * volume;
+    cumPv2 += typical * typical * volume;
+    cumV += volume;
+    if (cumV <= 0) continue;
+    const value = cumPv / cumV;
+    vwap[i] = value;
+    sigma[i] = Math.sqrt(Math.max(0, cumPv2 / cumV - value * value));
+  }
+  return { vwap, sigma };
+};
 var BUILTIN_INDICATORS = [
   BUILTIN_VOLUME_INDICATOR,
   BUILTIN_SMA_INDICATOR,
@@ -2098,7 +2585,10 @@ var BUILTIN_INDICATORS = [
   BUILTIN_SUPERTREND_INDICATOR,
   BUILTIN_ICHIMOKU_INDICATOR,
   BUILTIN_KELTNER_INDICATOR,
-  BUILTIN_DONCHIAN_INDICATOR
+  BUILTIN_DONCHIAN_INDICATOR,
+  BUILTIN_VOLUME_PROFILE_INDICATOR,
+  BUILTIN_SESSION_LEVELS_INDICATOR,
+  BUILTIN_ANCHORED_VWAP_INDICATOR
 ];
 
 // src/scripts.ts
@@ -3442,6 +3932,9 @@ function createChart(element, options = {}) {
       pointValue: Number(drawing.pointValue) || 1,
       qtyPrecision: Number.isFinite(drawing.qtyPrecision) ? Math.max(0, Math.floor(Number(drawing.qtyPrecision))) : 0,
       fontSize: Math.max(6, Number(drawing.fontSize) || 14),
+      profileRows: Math.max(4, Math.min(200, Math.round(Number(drawing.profileRows)) || 24)),
+      profileValueAreaPercent: Math.max(10, Math.min(99, Number(drawing.profileValueAreaPercent) || 70)),
+      profileWidthRatio: Math.max(0.1, Math.min(1, Number(drawing.profileWidthRatio) || 0.5)),
       ...drawing.label === void 0 ? {} : { label: drawing.label }
     };
   };
@@ -3475,6 +3968,9 @@ function createChart(element, options = {}) {
     pointValue: drawing.pointValue,
     qtyPrecision: drawing.qtyPrecision,
     fontSize: drawing.fontSize,
+    profileRows: drawing.profileRows,
+    profileValueAreaPercent: drawing.profileValueAreaPercent,
+    profileWidthRatio: drawing.profileWidthRatio,
     ...drawing.label === void 0 ? {} : { label: drawing.label }
   });
   let tradeMarkers = [];
@@ -3494,6 +3990,44 @@ function createChart(element, options = {}) {
   let compiledSession = compileSession(sessionOptions.spec);
   const isHour12 = () => timeFormat === "12h";
   const formatClock = (time) => zoneClock.formatTime(time.getTime(), isHour12());
+  let sessionInfoCache = [];
+  let sessionInfoCacheKey = "";
+  const sessionInfoForIndex = (index) => {
+    if (!compiledSession) return null;
+    const point = data[index];
+    if (!point) return null;
+    const key = `${data.length}|${data[0]?.time.getTime() ?? 0}|${data[data.length - 1]?.time.getTime() ?? 0}|${sessionOptions.spec === null ? "none" : JSON.stringify(sessionOptions.spec)}`;
+    if (key !== sessionInfoCacheKey) {
+      sessionInfoCacheKey = key;
+      sessionInfoCache = new Array(data.length);
+    }
+    const cached = sessionInfoCache[index];
+    if (cached) return cached;
+    const ms = point.time.getTime();
+    const info = sessionInfoAt(compiledSession, ms);
+    const resolved = {
+      day: info.sessionDay,
+      inSession: info.inSession,
+      minutes: compiledSession.clock.minutesOfDay(ms)
+    };
+    sessionInfoCache[index] = resolved;
+    return resolved;
+  };
+  const buildIndicatorSessionContext = () => {
+    if (!compiledSession) return void 0;
+    const dayAt = (index) => sessionInfoForIndex(index)?.day ?? Number.NaN;
+    return {
+      dayAt,
+      inSessionAt: (index) => sessionInfoForIndex(index)?.inSession ?? false,
+      isSessionStart: (index) => {
+        if (index <= 0) return index === 0;
+        const current = dayAt(index);
+        const previous = dayAt(index - 1);
+        return Number.isFinite(current) && Number.isFinite(previous) && current !== previous;
+      },
+      minutesOfDayAt: (index) => sessionInfoForIndex(index)?.minutes ?? Number.NaN
+    };
+  };
   let barMarks = [];
   let timescaleMarks = [];
   let markRegions = [];
@@ -6143,6 +6677,81 @@ function createChart(element, options = {}) {
           handleAt(ax, ay, drawing.color);
           handleAt(bx, by, drawing.color);
         }
+      } else if (drawing.type === "fixed-range-volume-profile") {
+        const p0 = drawing.points[0];
+        const p1 = drawing.points[1];
+        if (p0 && p1 && data.length > 0) {
+          const fromIndex = Math.max(0, Math.round(Math.min(p0.index, p1.index)));
+          const toIndex = Math.min(data.length - 1, Math.round(Math.max(p0.index, p1.index)));
+          const leftX = xFromDrawingPoint(p0.index <= p1.index ? p0 : p1) - candleSpacing / 2;
+          const rightX = xFromDrawingPoint(p0.index <= p1.index ? p1 : p0) + candleSpacing / 2;
+          const rangeWidth = Math.max(1, rightX - leftX);
+          const rows = Math.max(4, Math.min(200, Math.round(drawing.profileRows) || 24));
+          const valueAreaPercent = Math.max(10, Math.min(99, Number(drawing.profileValueAreaPercent) || 70));
+          const profile = toIndex >= fromIndex ? computeVolumeProfile(data, fromIndex, toIndex, rows, valueAreaPercent) : null;
+          ctx.save();
+          ctx.globalAlpha = draft ? 0.5 : 1;
+          ctx.fillStyle = hexToRgba(drawing.color, 0.06);
+          ctx.fillRect(leftX, chartTop, rangeWidth, chartBottom - chartTop);
+          ctx.strokeStyle = hexToRgba(drawing.color, 0.5);
+          ctx.lineWidth = 1;
+          ctx.setLineDash([4, 3]);
+          ctx.beginPath();
+          ctx.moveTo(crisp(leftX), chartTop);
+          ctx.lineTo(crisp(leftX), chartBottom);
+          ctx.moveTo(crisp(rightX), chartTop);
+          ctx.lineTo(crisp(rightX), chartBottom);
+          ctx.stroke();
+          ctx.setLineDash([]);
+          if (profile && profile.maxRowVolume > 0) {
+            const widthRatio = Math.max(0.1, Math.min(1, Number(drawing.profileWidthRatio) || 0.5));
+            const maxWidth = rangeWidth * widthRatio;
+            for (let row = 0; row < profile.rows.length; row += 1) {
+              const bucket = profile.rows[row];
+              if (bucket.total <= 0) continue;
+              const yTop = yFromPrice(bucket.high);
+              const yBottom = yFromPrice(bucket.low);
+              const top = Math.min(yTop, yBottom);
+              const height2 = Math.max(1, Math.abs(yBottom - yTop) - 1);
+              if (top > chartBottom || top + height2 < chartTop) continue;
+              const inValueArea = row >= profile.valueAreaFrom && row <= profile.valueAreaTo;
+              ctx.globalAlpha = (draft ? 0.5 : 1) * (inValueArea ? 0.5 : 0.2);
+              const rowWidth = bucket.total / profile.maxRowVolume * maxWidth;
+              const upWidth = rowWidth * (bucket.up / bucket.total);
+              ctx.fillStyle = mergedOptions.upColor;
+              ctx.fillRect(leftX, top, upWidth, height2);
+              ctx.fillStyle = mergedOptions.downColor;
+              ctx.fillRect(leftX + upWidth, top, rowWidth - upWidth, height2);
+            }
+            ctx.globalAlpha = draft ? 0.6 : 1;
+            const poc = profile.rows[profile.pocIndex];
+            const drawProfileLevel = (price, color, label, dashed) => {
+              const y = yFromPrice(price);
+              if (y < chartTop || y > chartBottom) return;
+              ctx.strokeStyle = color;
+              ctx.lineWidth = 1;
+              ctx.setLineDash(dashed ? [4, 3] : []);
+              ctx.beginPath();
+              ctx.moveTo(leftX, crisp(y));
+              ctx.lineTo(leftX + maxWidth, crisp(y));
+              ctx.stroke();
+              ctx.setLineDash([]);
+              const prevFont = ctx.font;
+              ctx.font = `10px ${mergedOptions.fontFamily}`;
+              ctx.fillStyle = color;
+              ctx.textAlign = "left";
+              ctx.textBaseline = "bottom";
+              ctx.fillText(label, leftX + 3, y - 1);
+              ctx.font = prevFont;
+            };
+            drawProfileLevel(profile.rows[profile.valueAreaTo].high, "#7e8aa3", "VAH", true);
+            drawProfileLevel(profile.rows[profile.valueAreaFrom].low, "#7e8aa3", "VAL", true);
+            drawProfileLevel((poc.low + poc.high) / 2, "#f7a600", "POC", false);
+          }
+          ctx.restore();
+          handleAt(leftX, yFromPrice(p0.index <= p1.index ? p0.price : p1.price), drawing.color);
+          handleAt(rightX, yFromPrice(p0.index <= p1.index ? p1.price : p0.price), drawing.color);
+        }
       } else if (drawing.type === "price-range") {
         const p0 = drawing.points[0];
         const p1 = drawing.points[1];
@@ -6900,6 +7509,7 @@ function createChart(element, options = {}) {
     ).sort((a, b) => a.indicator.zIndex - b.indicator.zIndex);
     if (activeOverlayIndicators.length > 0) {
       const xFromIndex = (index) => chartLeft + (index + 0.5 - xStart) / xSpan * chartWidth;
+      const indicatorSession = buildIndicatorSessionContext();
       activeOverlayIndicators.forEach(({ indicator, plugin }) => {
         plugin.draw(
           ctx,
@@ -6921,7 +7531,8 @@ function createChart(element, options = {}) {
             getVolumeByIndex,
             candleSpacing,
             upColor: mergedOptions.upColor,
-            downColor: mergedOptions.downColor
+            downColor: mergedOptions.downColor,
+            ...indicatorSession ? { session: indicatorSession } : {}
           },
           indicator.inputs
         );
@@ -7721,8 +8332,17 @@ function createChart(element, options = {}) {
         return typeof value === "string" && !/^#(?:[0-9a-fA-F]{3}){1,2}$/.test(value.trim());
       };
       const LEGEND_EXCLUDED_INPUT_KEYS = /* @__PURE__ */ new Set(["width", "bandMultiplier", "bandFillOpacity", "fillOpacity"]);
+      const formatLegendValue = (value) => {
+        if (typeof value === "string" && /^\d{4}-\d{2}-\d{2}T/.test(value)) {
+          const ms = Date.parse(value);
+          if (Number.isFinite(ms)) {
+            return getTimeStepMs() < 864e5 ? `${zoneClock.formatDayMonth(ms)} ${zoneClock.formatTime(ms, isHour12())}` : zoneClock.formatDayMonth(ms);
+          }
+        }
+        return String(value);
+      };
       const labelEntries = activeOverlayIndicators.map(({ indicator, plugin }) => {
-        const inputValues = Object.entries(indicator.inputs).filter(([key, value]) => !LEGEND_EXCLUDED_INPUT_KEYS.has(key) && typeof value !== "boolean" && isLegendInputValue(value)).slice(0, 2).map(([, value]) => String(value));
+        const inputValues = Object.entries(indicator.inputs).filter(([key, value]) => !LEGEND_EXCLUDED_INPUT_KEYS.has(key) && typeof value !== "boolean" && isLegendInputValue(value)).slice(0, 2).map(([, value]) => formatLegendValue(value));
         if (labels.showIndicatorNames && labels.showIndicatorValues && inputValues.length > 0) {
           return `${plugin.name} ${inputValues.join(" ")}`;
         }
@@ -8904,6 +9524,19 @@ function createChart(element, options = {}) {
         if (distanceToSegment(x, y, bx + blockW / 2, by + blockH / 2, ax, ay) <= 5 * hitTolerance) {
           return { drawing, target: "line" };
         }
+      } else if (drawing.type === "fixed-range-volume-profile") {
+        const p0 = drawing.points[0];
+        const p1 = drawing.points[1];
+        if (!p0 || !p1) continue;
+        const px0 = canvasXFromDrawingPoint(p0);
+        const px1 = canvasXFromDrawingPoint(p1);
+        const y0 = canvasYFromDrawingPrice(p0.price);
+        const y1 = canvasYFromDrawingPrice(p1.price);
+        if (Math.hypot(x - px0, y - y0) <= 9 * hitTolerance) return { drawing, target: "handle", pointIndex: 0 };
+        if (Math.hypot(x - px1, y - y1) <= 9 * hitTolerance) return { drawing, target: "handle", pointIndex: 1 };
+        if (x >= Math.min(px0, px1) && x <= Math.max(px0, px1)) {
+          return { drawing, target: "line" };
+        }
       } else if (drawing.type === "price-range") {
         const p0 = drawing.points[0];
         const p1 = drawing.points[1];
@@ -9355,6 +9988,33 @@ function createChart(element, options = {}) {
       scheduleDraw();
       return true;
     }
+    if (activeDrawingTool === "fixed-range-volume-profile") {
+      if (draftDrawing?.type === "fixed-range-volume-profile") {
+        const completed = normalizeDrawingState({
+          ...serializeDrawing(draftDrawing),
+          points: [draftDrawing.points[0], point]
+        });
+        drawings.push(completed);
+        draftDrawing = null;
+        activeDrawingTool = null;
+        emitDrawingsChange();
+        scheduleDraw();
+        return true;
+      }
+      const defaults = getDrawingToolDefaults("fixed-range-volume-profile");
+      draftDrawing = normalizeDrawingState({
+        type: "fixed-range-volume-profile",
+        points: [point, point],
+        color: defaults.color ?? "#5b8def",
+        style: defaults.style ?? "solid",
+        width: defaults.width ?? 1,
+        ...defaults.profileRows === void 0 ? {} : { profileRows: defaults.profileRows },
+        ...defaults.profileValueAreaPercent === void 0 ? {} : { profileValueAreaPercent: defaults.profileValueAreaPercent },
+        ...defaults.profileWidthRatio === void 0 ? {} : { profileWidthRatio: defaults.profileWidthRatio }
+      });
+      scheduleDraw();
+      return true;
+    }
     if (activeDrawingTool === "price-range") {
       const tick = getConfiguredTickSize();
       const visibleRange = drawState.yMax - drawState.yMin;