gloomberb 0.4.1 → 0.5.0

package/src/components/chart/indicators/moving-averages.test.ts

@@ -0,0 +1,54 @@
+import { describe, it, expect } from "bun:test";
+import { computeSMA, computeEMA } from "./moving-averages";
+
+describe("computeSMA", () => {
+  const closes = [10, 11, 12, 13, 14, 15, 16, 17, 18, 19];
+
+  it("starts at index period-1 with correct value", () => {
+    const result = computeSMA(closes, 5);
+    expect(result[0].index).toBe(4);
+    expect(result[0].value).toBe(12); // (10+11+12+13+14)/5 = 60/5 = 12
+  });
+
+  it("produces correct number of points", () => {
+    const result = computeSMA(closes, 5);
+    expect(result.length).toBe(6); // 10 - 5 + 1
+  });
+
+  it("returns [] when period > data length", () => {
+    expect(computeSMA([1, 2, 3], 5)).toEqual([]);
+  });
+
+  it("returns [] for empty input", () => {
+    expect(computeSMA([], 5)).toEqual([]);
+  });
+
+  it("handles period equal to data length", () => {
+    const result = computeSMA(closes, 10);
+    expect(result.length).toBe(1);
+    expect(result[0].index).toBe(9);
+    expect(result[0].value).toBeCloseTo(14.5);
+  });
+});
+
+describe("computeEMA", () => {
+  it("seeds with SMA and applies multiplier correctly", () => {
+    // period 3, k = 2/(3+1) = 0.5
+    // seed = (10+11+12)/3 = 11 at index 2
+    // EMA[3] = 13*0.5 + 11*0.5 = 12
+    const closes = [10, 11, 12, 13, 14, 15];
+    const result = computeEMA(closes, 3);
+    expect(result[0].index).toBe(2);
+    expect(result[0].value).toBeCloseTo(11);
+    expect(result[1].index).toBe(3);
+    expect(result[1].value).toBeCloseTo(12);
+  });
+
+  it("returns [] when period > data length", () => {
+    expect(computeEMA([1, 2], 5)).toEqual([]);
+  });
+
+  it("returns [] for empty input", () => {
+    expect(computeEMA([], 3)).toEqual([]);
+  });
+});

package/src/components/chart/indicators/moving-averages.ts

@@ -0,0 +1,42 @@
+import type { OverlayPoint } from "./types";
+
+export function computeSMA(closes: number[], period: number): OverlayPoint[] {
+  if (closes.length < period || period <= 0) return [];
+
+  const result: OverlayPoint[] = [];
+  let sum = 0;
+
+  for (let i = 0; i < period; i++) {
+    sum += closes[i];
+  }
+  result.push({ index: period - 1, value: sum / period });
+
+  for (let i = period; i < closes.length; i++) {
+    sum += closes[i] - closes[i - period];
+    result.push({ index: i, value: sum / period });
+  }
+
+  return result;
+}
+
+export function computeEMA(closes: number[], period: number): OverlayPoint[] {
+  if (closes.length < period || period <= 0) return [];
+
+  const k = 2 / (period + 1);
+  const result: OverlayPoint[] = [];
+
+  // Seed with SMA of first `period` values
+  let sum = 0;
+  for (let i = 0; i < period; i++) {
+    sum += closes[i];
+  }
+  let ema = sum / period;
+  result.push({ index: period - 1, value: ema });
+
+  for (let i = period; i < closes.length; i++) {
+    ema = closes[i] * k + ema * (1 - k);
+    result.push({ index: i, value: ema });
+  }
+
+  return result;
+}

package/src/components/chart/indicators/options.test.ts

@@ -0,0 +1,32 @@
+import { describe, expect, test } from "bun:test";
+import {
+  buildIndicatorConfigFromSelection,
+  CURRENT_CHART_INDICATORS_CONFIG_VERSION,
+  normalizeChartIndicatorSelection,
+  resolveChartIndicatorSelection,
+} from "./options";
+
+describe("chart indicator options", () => {
+  test("normalizes persisted indicator selections into supported option order", () => {
+    expect(normalizeChartIndicatorSelection(["ema20", "unknown", "volume", "sma20", "ema20"])).toEqual([
+      "volume",
+      "sma20",
+      "ema20",
+    ]);
+    expect(normalizeChartIndicatorSelection("sma20")).toEqual([]);
+  });
+
+  test("keeps volume enabled by default and migrates legacy selections", () => {
+    expect(resolveChartIndicatorSelection(undefined, undefined)).toEqual(["volume"]);
+    expect(resolveChartIndicatorSelection(["sma20"], undefined)).toEqual(["volume", "sma20"]);
+    expect(resolveChartIndicatorSelection(["sma20"], CURRENT_CHART_INDICATORS_CONFIG_VERSION)).toEqual(["sma20"]);
+  });
+
+  test("builds chart indicator config from selected overlay ids", () => {
+    expect(buildIndicatorConfigFromSelection(["volume", "sma20", "sma50", "ema20", "bollinger20"])).toEqual({
+      sma: [20, 50],
+      ema: [20],
+      bollinger: { period: 20, stdDev: 2 },
+    });
+  });
+});

package/src/components/chart/indicators/options.ts

@@ -0,0 +1,107 @@
+import type { IndicatorConfig } from "./types";
+
+export const CHART_INDICATORS_PLUGIN_CONFIG_KEY = "chartIndicators";
+export const CHART_INDICATORS_PLUGIN_CONFIG_VERSION_KEY = "chartIndicatorsVersion";
+export const CURRENT_CHART_INDICATORS_CONFIG_VERSION = 2;
+
+export type ChartIndicatorId =
+  | "volume"
+  | "sma20"
+  | "sma50"
+  | "sma200"
+  | "ema20"
+  | "bollinger20";
+
+export interface ChartIndicatorOption {
+  id: ChartIndicatorId;
+  label: string;
+  compactLabel: string;
+  description: string;
+}
+
+export const CHART_INDICATOR_OPTIONS: ChartIndicatorOption[] = [
+  {
+    id: "volume",
+    label: "Volume",
+    compactLabel: "VOL",
+    description: "Volume bars below the price chart.",
+  },
+  {
+    id: "sma20",
+    label: "SMA 20",
+    compactLabel: "S20",
+    description: "20-period simple moving average.",
+  },
+  {
+    id: "sma50",
+    label: "SMA 50",
+    compactLabel: "S50",
+    description: "50-period simple moving average.",
+  },
+  {
+    id: "sma200",
+    label: "SMA 200",
+    compactLabel: "S200",
+    description: "200-period simple moving average.",
+  },
+  {
+    id: "ema20",
+    label: "EMA 20",
+    compactLabel: "E20",
+    description: "20-period exponential moving average.",
+  },
+  {
+    id: "bollinger20",
+    label: "Bollinger 20",
+    compactLabel: "BB20",
+    description: "20-period Bollinger Bands at two standard deviations.",
+  },
+];
+
+const CHART_INDICATOR_IDS = new Set<string>(CHART_INDICATOR_OPTIONS.map((option) => option.id));
+export const DEFAULT_CHART_INDICATOR_SELECTION: ChartIndicatorId[] = ["volume"];
+
+export function isChartIndicatorId(value: unknown): value is ChartIndicatorId {
+  return typeof value === "string" && CHART_INDICATOR_IDS.has(value);
+}
+
+export function normalizeChartIndicatorSelection(value: unknown): ChartIndicatorId[] {
+  if (!Array.isArray(value)) return [];
+
+  const selected = new Set(value.filter(isChartIndicatorId));
+  return CHART_INDICATOR_OPTIONS
+    .map((option) => option.id)
+    .filter((id) => selected.has(id));
+}
+
+export function resolveChartIndicatorSelection(value: unknown, version: unknown): ChartIndicatorId[] {
+  if (!Array.isArray(value)) return [...DEFAULT_CHART_INDICATOR_SELECTION];
+
+  const normalized = normalizeChartIndicatorSelection(value);
+  if (version === CURRENT_CHART_INDICATORS_CONFIG_VERSION) return normalized;
+
+  return normalizeChartIndicatorSelection([
+    ...DEFAULT_CHART_INDICATOR_SELECTION,
+    ...normalized,
+  ]);
+}
+
+export function buildIndicatorConfigFromSelection(selection: readonly ChartIndicatorId[]): IndicatorConfig {
+  const selected = new Set(selection);
+  const sma: number[] = [];
+  const ema: number[] = [];
+  const config: IndicatorConfig = {};
+
+  if (selected.has("sma20")) sma.push(20);
+  if (selected.has("sma50")) sma.push(50);
+  if (selected.has("sma200")) sma.push(200);
+  if (selected.has("ema20")) ema.push(20);
+
+  if (sma.length > 0) config.sma = sma;
+  if (ema.length > 0) config.ema = ema;
+  if (selected.has("bollinger20")) {
+    config.bollinger = { period: 20, stdDev: 2 };
+  }
+
+  return config;
+}

package/src/components/chart/indicators/oscillators.test.ts

@@ -0,0 +1,79 @@
+import { describe, it, expect } from "bun:test";
+import { computeRSI, computeMACD } from "./oscillators";
+
+describe("computeRSI", () => {
+  it("produces at least one result with 15 data points and period 14", () => {
+    const closes = [44, 46, 44, 45, 47, 43, 44, 46, 48, 47, 45, 46, 47, 48, 50];
+    const result = computeRSI(closes, 14);
+    expect(result.length).toBeGreaterThanOrEqual(1);
+  });
+
+  it("all values are between 0 and 100", () => {
+    const closes = [44, 46, 44, 45, 47, 43, 44, 46, 48, 47, 45, 46, 47, 48, 50];
+    const result = computeRSI(closes, 14);
+    for (const p of result) {
+      expect(p.value).toBeGreaterThanOrEqual(0);
+      expect(p.value).toBeLessThanOrEqual(100);
+    }
+  });
+
+  it("all-increasing data gives RSI > 99", () => {
+    const closes = Array.from({ length: 20 }, (_, i) => i + 1);
+    const result = computeRSI(closes, 14);
+    expect(result.length).toBeGreaterThan(0);
+    for (const p of result) {
+      expect(p.value).toBeGreaterThan(99);
+    }
+  });
+
+  it("returns [] for insufficient data", () => {
+    expect(computeRSI([1, 2, 3], 14)).toEqual([]);
+    expect(computeRSI([], 14)).toEqual([]);
+    // Exactly period data points (need period+1)
+    const closes = Array.from({ length: 14 }, (_, i) => i + 1);
+    expect(computeRSI(closes, 14)).toEqual([]);
+  });
+
+  it("first result starts at index equal to period", () => {
+    const closes = [44, 46, 44, 45, 47, 43, 44, 46, 48, 47, 45, 46, 47, 48, 50];
+    const result = computeRSI(closes, 14);
+    expect(result[0].index).toBe(14);
+  });
+});
+
+describe("computeMACD", () => {
+  const closes50 = Array.from({ length: 50 }, (_, i) => 100 + Math.sin(i * 0.3) * 10);
+
+  it("produces non-empty macd, signal, histogram with 50 data points", () => {
+    const result = computeMACD(closes50, 12, 26, 9);
+    expect(result.macd.length).toBeGreaterThan(0);
+    expect(result.signal.length).toBeGreaterThan(0);
+    expect(result.histogram.length).toBeGreaterThan(0);
+  });
+
+  it("histogram[i] = macd[i] - signal[i] at matching indices", () => {
+    const result = computeMACD(closes50, 12, 26, 9);
+    const macdByIndex = new Map(result.macd.map((p) => [p.index, p.value]));
+    for (const h of result.histogram) {
+      const m = macdByIndex.get(h.index);
+      const s = result.signal.find((p) => p.index === h.index);
+      expect(m).toBeDefined();
+      expect(s).toBeDefined();
+      expect(h.value).toBeCloseTo(m! - s!.value, 10);
+    }
+  });
+
+  it("returns empty result for insufficient data", () => {
+    const result = computeMACD([1, 2, 3], 12, 26, 9);
+    expect(result.macd.length).toBe(0);
+    expect(result.signal.length).toBe(0);
+    expect(result.histogram.length).toBe(0);
+  });
+
+  it("returns empty result for empty input", () => {
+    const result = computeMACD([], 12, 26, 9);
+    expect(result.macd.length).toBe(0);
+    expect(result.signal.length).toBe(0);
+    expect(result.histogram.length).toBe(0);
+  });
+});

package/src/components/chart/indicators/oscillators.ts

@@ -0,0 +1,92 @@
+import type { OscillatorPoint, MacdResult } from "./types";
+import { computeEMA } from "./moving-averages";
+
+export function computeRSI(closes: number[], period = 14): OscillatorPoint[] {
+  // Need at least period+1 data points (period changes)
+  if (closes.length < period + 1) return [];
+
+  const result: OscillatorPoint[] = [];
+
+  // Compute initial average gain/loss over first `period` changes
+  let avgGain = 0;
+  let avgLoss = 0;
+  for (let i = 1; i <= period; i++) {
+    const change = closes[i] - closes[i - 1];
+    if (change > 0) avgGain += change;
+    else avgLoss += -change;
+  }
+  avgGain /= period;
+  avgLoss /= period;
+
+  const rs = avgLoss === 0 ? Infinity : avgGain / avgLoss;
+  const rsi = avgLoss === 0 ? 100 : 100 - 100 / (1 + rs);
+  result.push({ index: period, value: rsi });
+
+  // Wilder's smoothing for subsequent values
+  for (let i = period + 1; i < closes.length; i++) {
+    const change = closes[i] - closes[i - 1];
+    const gain = change > 0 ? change : 0;
+    const loss = change < 0 ? -change : 0;
+    avgGain = (avgGain * (period - 1) + gain) / period;
+    avgLoss = (avgLoss * (period - 1) + loss) / period;
+
+    const rs = avgLoss === 0 ? Infinity : avgGain / avgLoss;
+    const rsi = avgLoss === 0 ? 100 : 100 - 100 / (1 + rs);
+    result.push({ index: i, value: rsi });
+  }
+
+  return result;
+}
+
+export function computeMACD(
+  closes: number[],
+  fast = 12,
+  slow = 26,
+  signal = 9
+): MacdResult {
+  const empty: MacdResult = { macd: [], signal: [], histogram: [] };
+
+  const fastEma = computeEMA(closes, fast);
+  const slowEma = computeEMA(closes, slow);
+
+  if (fastEma.length === 0 || slowEma.length === 0) return empty;
+
+  // Build a map of index -> fast EMA value for alignment
+  const fastByIndex = new Map<number, number>();
+  for (const p of fastEma) fastByIndex.set(p.index, p.value);
+
+  // MACD line = fast EMA - slow EMA (only where both exist)
+  const macdLine: OscillatorPoint[] = [];
+  for (const p of slowEma) {
+    const fv = fastByIndex.get(p.index);
+    if (fv !== undefined) {
+      macdLine.push({ index: p.index, value: fv - p.value });
+    }
+  }
+
+  if (macdLine.length < signal) return empty;
+
+  // Signal line = EMA of MACD values
+  const macdValues = macdLine.map((p) => p.value);
+  const signalEma = computeEMA(macdValues, signal);
+
+  if (signalEma.length === 0) return empty;
+
+  // Map signal EMA positions back to original indices
+  // signalEma[i].index is an offset into macdValues; macdLine[offset].index is the original index
+  const signalLine: OscillatorPoint[] = signalEma.map((p) => ({
+    index: macdLine[p.index].index,
+    value: p.value,
+  }));
+
+  // Histogram: MACD - Signal at matching original indices
+  const macdByIndex = new Map<number, number>();
+  for (const p of macdLine) macdByIndex.set(p.index, p.value);
+
+  const histogram: OscillatorPoint[] = signalLine.map((p) => ({
+    index: p.index,
+    value: (macdByIndex.get(p.index) ?? 0) - p.value,
+  }));
+
+  return { macd: macdLine, signal: signalLine, histogram };
+}

package/src/components/chart/indicators/types.ts

@@ -0,0 +1,36 @@
+/** A single data point for an overlay line drawn on the main chart */
+export interface OverlayPoint {
+  index: number;
+  value: number;
+}
+
+/** A single data point for an oscillator drawn in a sub-panel */
+export interface OscillatorPoint {
+  index: number;
+  value: number;
+}
+
+/** MACD has three series: macd line, signal line, histogram */
+export interface MacdResult {
+  macd: OscillatorPoint[];
+  signal: OscillatorPoint[];
+  histogram: OscillatorPoint[];
+}
+
+/** Bollinger Bands: upper, middle (SMA), lower */
+export interface BollingerResult {
+  upper: OverlayPoint[];
+  middle: OverlayPoint[];
+  lower: OverlayPoint[];
+}
+
+/** Active indicator configuration for a chart pane */
+export interface IndicatorConfig {
+  sma?: number[];        // e.g. [20, 50, 200]
+  ema?: number[];        // e.g. [12, 26]
+  rsi?: number | null;   // e.g. 14
+  macd?: { fast: number; slow: number; signal: number } | null;
+  bollinger?: { period: number; stdDev: number } | null;
+}
+
+export const DEFAULT_INDICATOR_CONFIG: IndicatorConfig = {};

package/src/components/chart/native/chart-rasterizer.ts

@@ -256,6 +256,20 @@ function projectX(index: number, count: number, left: number, right: number): nu
   return lerp(left, right, index / (count - 1));
 }
 
+function projectChartX(index: number, count: number, width: number, mode: ChartRenderMode): number {
+  if (mode !== "candles" && mode !== "ohlc") {
+    return projectX(index, count, 0, Math.max(width - 1, 0));
+  }
+
+  const spacing = width / Math.max(count, 1);
+  const bodyWidth = clamp(spacing * 0.58, 2, Math.max(spacing - 1, 2));
+  const tickLength = clamp(spacing * 0.34, 2, Math.max(spacing * 0.48, 2));
+  const horizontalPad = mode === "ohlc"
+    ? Math.ceil(Math.max(tickLength - 1, 0))
+    : Math.ceil(bodyWidth / 2);
+  return projectX(index, count, horizontalPad, Math.max(width - 1 - horizontalPad, horizontalPad));
+}
+
 function projectY(value: number, min: number, max: number, top: number, bottom: number): number {
   const range = max - min || 1;
   return lerp(bottom, top, (value - min) / range);
@@ -398,6 +412,42 @@ function drawVolume(
   }
 }
 
+function drawIndicatorOverlays(
+  data: Uint8Array,
+  width: number,
+  height: number,
+  scene: ChartScene,
+  top: number,
+  bottom: number,
+) {
+  if (!scene.indicators) return;
+
+  const drawOverlay = (points: { index: number; value: number }[], color: string) => {
+    const lineColor = parseHex(color, 0.95);
+    for (let index = 0; index < points.length - 1; index += 1) {
+      const p0 = points[index]!;
+      const p1 = points[index + 1]!;
+      const x0 = projectChartX(p0.index, scene.points.length, width, scene.mode);
+      const y0 = projectY(p0.value, scene.min, scene.max, top, bottom);
+      const x1 = projectChartX(p1.index, scene.points.length, width, scene.mode);
+      const y1 = projectY(p1.value, scene.min, scene.max, top, bottom);
+      drawLine(data, width, height, x0, y0, x1, y1, lineColor, 1.2);
+    }
+  };
+
+  for (const sma of scene.indicators.smaLines) {
+    drawOverlay(sma.points, sma.color);
+  }
+  for (const ema of scene.indicators.emaLines) {
+    drawOverlay(ema.points, ema.color);
+  }
+  if (scene.indicators.bollinger) {
+    drawOverlay(scene.indicators.bollinger.upper, scene.indicators.bollinger.color);
+    drawOverlay(scene.indicators.bollinger.middle, scene.indicators.bollinger.color);
+    drawOverlay(scene.indicators.bollinger.lower, scene.indicators.bollinger.color);
+  }
+}
+
 function drawCrosshairOverlay(
   data: Uint8Array,
   width: number,
@@ -447,6 +497,7 @@ export function renderNativeChartBase(scene: ChartScene, pixelWidth: number, pix
       break;
   }
 
+  drawIndicatorOverlays(pixels, pixelWidth, pixelHeight, scene, layout.plotTop, layout.plotBottom);
   drawVolume(pixels, pixelWidth, pixelHeight, scene, layout.volumeTop, layout.volumeBottom);
 
   return { width: pixelWidth, height: pixelHeight, pixels };

package/src/components/chart/native/kitty.test.ts

@@ -206,6 +206,74 @@ describe("renderNativeChartBase", () => {
     const withCursor = renderNativeChartBase(sceneWithCursor!, 120, 60);
     expect(withCursor.pixels).toEqual(withoutCursor.pixels);
   });
+
+  test("renders indicator overlays into the native chart bitmap", () => {
+    const palette = resolveChartPalette({
+      bg: "#112233",
+      border: "#333333",
+      borderFocused: "#ffff00",
+      text: "#ffffff",
+      textDim: "#777777",
+      positive: "#00ff00",
+      negative: "#ff0000",
+    }, "positive");
+    const points = [
+      { date: new Date("2024-01-02"), open: 10, high: 12, low: 9, close: 11, volume: 100 },
+      { date: new Date("2024-01-03"), open: 11, high: 13, low: 10, close: 12, volume: 120 },
+      { date: new Date("2024-01-04"), open: 12, high: 14, low: 11, close: 13, volume: 130 },
+    ];
+    const baseScene = buildChartScene(points, {
+      width: 18,
+      height: 8,
+      showVolume: false,
+      volumeHeight: 0,
+      cursorX: null,
+      cursorY: null,
+      mode: "line",
+      colors: palette,
+    });
+    const sceneWithIndicator = buildChartScene(points, {
+      width: 18,
+      height: 8,
+      showVolume: false,
+      volumeHeight: 0,
+      cursorX: null,
+      cursorY: null,
+      mode: "line",
+      colors: palette,
+      indicators: {
+        smaLines: [{
+          period: 2,
+          color: "#ff00ff",
+          points: [
+            { index: 0, value: 9.5 },
+            { index: 1, value: 10.5 },
+            { index: 2, value: 11.5 },
+          ],
+        }],
+        emaLines: [],
+        bollinger: null,
+        rsi: null,
+        macd: null,
+      },
+    });
+
+    expect(baseScene).not.toBeNull();
+    expect(sceneWithIndicator).not.toBeNull();
+
+    const baseBitmap = renderNativeChartBase(baseScene!, 120, 60);
+    const indicatorBitmap = renderNativeChartBase(sceneWithIndicator!, 120, 60);
+    expect(indicatorBitmap.pixels).not.toEqual(baseBitmap.pixels);
+
+    let magentaPixels = 0;
+    for (let offset = 0; offset < indicatorBitmap.pixels.length; offset += 4) {
+      const red = indicatorBitmap.pixels[offset]!;
+      const green = indicatorBitmap.pixels[offset + 1]!;
+      const blue = indicatorBitmap.pixels[offset + 2]!;
+      if (red > 180 && blue > 180 && green < 120) magentaPixels += 1;
+    }
+    expect(magentaPixels).toBeGreaterThan(0);
+  });
 });
 
 describe("renderNativeComparisonChartBase", () => {