gloomberb 0.4.0 → 0.5.0

package/src/components/chart/chart-renderer.ts

@@ -1,7 +1,7 @@
 import { RGBA } from "@opentui/core";
-import type { ChartAxisMode, ChartColors, Pixel, PixelBuffer, ChartRenderMode } from "./chart-types";
+import type { ChartAxisMode, ChartColors, ChartIndicatorOverlays, Pixel, PixelBuffer, ChartRenderMode } from "./chart-types";
 import type { ProjectedChartPoint } from "./chart-data";
-import { formatCurrency } from "../../utils/format";
+import { formatCompactMarketPriceWithCurrency, formatMarketPrice, resolveAssetDisplayKind } from "../../utils/market-format";
 
 // ---------------------------------------------------------------------------
 // Styled output types (unchanged public API)
@@ -26,6 +26,7 @@ export interface StyledContent {
 const LAYER_GRID = 0;
 const LAYER_FILL = 1;
 const LAYER_DATA = 2;
+const LAYER_OVERLAY = 2;
 const LAYER_CROSSHAIR = 3;
 
 // ---------------------------------------------------------------------------
@@ -574,8 +575,21 @@ export function bufferToBrailleLines(buf: PixelBuffer, bgColor: string): StyledC
 // Formatting helpers
 // ---------------------------------------------------------------------------
 
-export function formatPrice(value: number): string {
-  return formatPriceWithCurrency(value);
+export function formatPrice(
+  value: number,
+  assetCategory?: string,
+  priceRange?: number,
+  precisionOffset = 0,
+  minimumFractionDigits = 0,
+  fixedFractionDigits?: number,
+): string {
+  return formatMarketPrice(value, {
+    assetCategory,
+    fixedFractionDigits,
+    minimumFractionDigits,
+    precisionOffset,
+    priceRange,
+  });
 }
 
 function formatPercentAxisValue(value: number): string {
@@ -585,39 +599,125 @@ function formatPercentAxisValue(value: number): string {
   return `${prefix}${value.toFixed(decimals)}%`;
 }
 
-const currencySymbols = new Map<string, string>();
+export function formatPriceWithCurrency(
+  value: number,
+  currency = "USD",
+  assetCategory?: string,
+  priceRange?: number,
+  precisionOffset = 0,
+  minimumFractionDigits = 0,
+  fixedFractionDigits?: number,
+): string {
+  return formatCompactMarketPriceWithCurrency(value, currency, {
+    assetCategory,
+    fixedFractionDigits,
+    minimumFractionDigits,
+    precisionOffset,
+    priceRange,
+  });
+}
 
-function getCurrencySymbol(currency: string): string {
-  const cached = currencySymbols.get(currency);
-  if (cached) return cached;
+function hasDistinctAxisLabels(labels: string[]): boolean {
+  return new Set(labels).size === labels.length;
+}
 
-  const formatter = new Intl.NumberFormat("en-US", {
-    style: "currency",
-    currency,
-    currencyDisplay: "symbol",
-    minimumFractionDigits: 0,
-    maximumFractionDigits: 0,
-  });
-  const symbol = formatter.formatToParts(0).find((part) => part.type === "currency")?.value ?? currency;
-  currencySymbols.set(currency, symbol);
-  return symbol;
+function getAxisFractionDigitFloor(assetCategory: string | undefined, priceRange: number | undefined): number {
+  if (priceRange === undefined || !Number.isFinite(priceRange) || priceRange <= 0) return 0;
+
+  const kind = resolveAssetDisplayKind({ assetCategory });
+  const visibleStep = priceRange / 3;
+  if (!Number.isFinite(visibleStep) || visibleStep <= 0) return 0;
+
+  const offset = kind === "cash" ? 0 : 1;
+  return Math.max(0, Math.ceil(-Math.log10(visibleStep)) + offset);
 }
 
-export function formatPriceWithCurrency(value: number, currency = "USD"): string {
-  const abs = Math.abs(value);
-  const sign = value < 0 ? "-" : "";
-  const symbol = getCurrencySymbol(currency);
+export function resolveAxisFractionDigits(
+  prices: number[],
+  formatLabel: (value: number, fixedFractionDigits: number) => string,
+  minimumFractionDigits = 0,
+  maxFractionDigits = 8,
+): number {
+  for (let fixedFractionDigits = minimumFractionDigits; fixedFractionDigits <= maxFractionDigits; fixedFractionDigits += 1) {
+    const labels = prices.map((value) => formatLabel(value, fixedFractionDigits));
+    if (hasDistinctAxisLabels(labels)) return fixedFractionDigits;
+  }
+
+  return maxFractionDigits;
+}
 
-  if (abs >= 1e6) return `${sign}${symbol}${(abs / 1e6).toFixed(1)}M`;
-  if (abs >= 1e3 && abs < 1e5) return `${sign}${symbol}${(abs / 1e3).toFixed(1)}K`;
-  return formatCurrency(value, currency);
+export function resolveChartAxisWidth(
+  labels: Array<string | null | undefined>,
+  minimumWidth: number,
+  maximumWidth: number,
+): number {
+  if (maximumWidth <= 0) return 0;
+
+  const longestLabel = labels.reduce((maxWidth, label) => (
+    Math.max(maxWidth, label?.length ?? 0)
+  ), 0);
+
+  return Math.min(Math.max(longestLabel, minimumWidth), maximumWidth);
+}
+
+export function formatAxisCell(label: string | null, width: number): string {
+  if (width <= 0) return "";
+  if (!label) return " ".repeat(width);
+  return label.length >= width ? label.slice(0, width) : label.padStart(width);
 }
 
-export function formatAxisValue(value: number, axisMode: ChartAxisMode, basePrice: number, currency = "USD"): string {
+export function formatAxisValue(
+  value: number,
+  axisMode: ChartAxisMode,
+  basePrice: number,
+  currency = "USD",
+  assetCategory?: string,
+  priceRange?: number,
+  fixedFractionDigits?: number,
+): string {
   if (axisMode === "percent" && basePrice !== 0) {
     return formatPercentAxisValue(((value - basePrice) / basePrice) * 100);
   }
-  return formatPriceWithCurrency(value, currency);
+  return formatPriceWithCurrency(value, currency, assetCategory, priceRange, 0, 0, fixedFractionDigits);
+}
+
+function getCursorAxisMinimumFractionDigits(value: number, assetCategory?: string): number {
+  const kind = resolveAssetDisplayKind({ assetCategory });
+
+  switch (kind) {
+    case "cash":
+      return 4;
+    case "crypto":
+      return Math.abs(value) >= 1 ? 4 : 6;
+    case "equity":
+    case "contract":
+      return Math.abs(value) >= 1 ? 2 : 4;
+    case "other":
+    default:
+      return Math.abs(value) >= 1 ? 2 : 4;
+  }
+}
+
+export function formatCursorAxisValue(
+  value: number,
+  axisMode: ChartAxisMode,
+  basePrice: number,
+  currency = "USD",
+  assetCategory?: string,
+  priceRange?: number,
+): string {
+  if (axisMode === "percent" && basePrice !== 0) {
+    return formatPercentAxisValue(((value - basePrice) / basePrice) * 100);
+  }
+
+  return formatPriceWithCurrency(
+    value,
+    currency,
+    assetCategory,
+    priceRange,
+    2,
+    getCursorAxisMinimumFractionDigits(value, assetCategory),
+  );
 }
 
 const MONTHS = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
@@ -916,8 +1016,10 @@ export interface RenderChartOptions {
   mode: ChartRenderMode;
   axisMode?: ChartAxisMode;
   currency?: string;
+  assetCategory?: string;
   colors: ResolvedChartPalette;
   timeAxisDates?: Array<Date | string | number>;
+  indicators?: ChartIndicatorOverlays | null;
 }
 
 export interface ChartScene {
@@ -929,6 +1031,7 @@ export interface ChartScene {
   chartRows: number;
   mode: ChartRenderMode;
   colors: ResolvedChartPalette;
+  indicators: ChartIndicatorOverlays | null;
   min: number;
   max: number;
   activeIdx: number;
@@ -958,6 +1061,8 @@ export interface RenderChartResult {
   changePctAtCursor: number | null;
   cursorColumn: number | null;
   cursorRow: number | null;
+  axisFractionDigits: number | null;
+  priceRange: number | null;
   /** Raw pixel buffer for GPU/Kitty rendering path */
   pixelBuffer: PixelBuffer | null;
 }
@@ -988,18 +1093,42 @@ export function getActivePointIndex(
   return bestIndex;
 }
 
+function getIndicatorOverlayValues(indicators: ChartIndicatorOverlays | null | undefined): number[] {
+  if (!indicators) return [];
+
+  const values: number[] = [];
+  for (const line of indicators.smaLines) {
+    values.push(...line.points.map((point) => point.value));
+  }
+  for (const line of indicators.emaLines) {
+    values.push(...line.points.map((point) => point.value));
+  }
+  if (indicators.bollinger) {
+    values.push(
+      ...indicators.bollinger.upper.map((point) => point.value),
+      ...indicators.bollinger.middle.map((point) => point.value),
+      ...indicators.bollinger.lower.map((point) => point.value),
+    );
+  }
+
+  return values.filter((value) => Number.isFinite(value));
+}
+
 export function buildChartScene(
   points: ProjectedChartPoint[],
   opts: RenderChartOptions,
 ): ChartScene | null {
   if (points.length === 0) return null;
 
-  const min = opts.mode === "candles" || opts.mode === "ohlc"
+  const dataMin = opts.mode === "candles" || opts.mode === "ohlc"
     ? Math.min(...points.map((point) => point.low))
     : Math.min(...points.map((point) => point.close));
-  const max = opts.mode === "candles" || opts.mode === "ohlc"
+  const dataMax = opts.mode === "candles" || opts.mode === "ohlc"
     ? Math.max(...points.map((point) => point.high))
     : Math.max(...points.map((point) => point.close));
+  const indicatorValues = getIndicatorOverlayValues(opts.indicators);
+  const min = indicatorValues.length > 0 ? Math.min(dataMin, ...indicatorValues) : dataMin;
+  const max = indicatorValues.length > 0 ? Math.max(dataMax, ...indicatorValues) : dataMax;
   const activeIdx = getActivePointIndex(points.length, opts.width, opts.cursorX, opts.mode);
   const activePoint = points[activeIdx]!;
   const range = max - min || 1;
@@ -1039,6 +1168,7 @@ export function buildChartScene(
     chartRows,
     mode: opts.mode,
     colors: opts.colors,
+    indicators: opts.indicators ?? null,
     min,
     max,
     activeIdx,
@@ -1057,6 +1187,41 @@ export function buildChartScene(
   };
 }
 
+function drawIndicatorOverlays(
+  buf: PixelBuffer,
+  indicators: ChartIndicatorOverlays,
+  pointCount: number,
+  dotTop: number,
+  dotBottom: number,
+  min: number,
+  max: number,
+  mode: ChartRenderMode,
+): void {
+  const drawOverlay = (overlayPoints: { index: number; value: number }[], color: string) => {
+    for (let i = 0; i < overlayPoints.length - 1; i++) {
+      const p0 = overlayPoints[i]!;
+      const p1 = overlayPoints[i + 1]!;
+      const x0 = getDotX(p0.index, pointCount, buf.width, mode);
+      const y0 = getScaledY(p0.value, min, max, dotTop, dotBottom);
+      const x1 = getDotX(p1.index, pointCount, buf.width, mode);
+      const y1 = getScaledY(p1.value, min, max, dotTop, dotBottom);
+      drawLine(buf, x0, y0, x1, y1, color, LAYER_OVERLAY);
+    }
+  };
+
+  for (const sma of indicators.smaLines) {
+    drawOverlay(sma.points, sma.color);
+  }
+  for (const ema of indicators.emaLines) {
+    drawOverlay(ema.points, ema.color);
+  }
+  if (indicators.bollinger) {
+    drawOverlay(indicators.bollinger.upper, indicators.bollinger.color);
+    drawOverlay(indicators.bollinger.middle, indicators.bollinger.color);
+    drawOverlay(indicators.bollinger.lower, indicators.bollinger.color);
+  }
+}
+
 export function renderChart(
   points: ProjectedChartPoint[],
   opts: RenderChartOptions,
@@ -1075,6 +1240,8 @@ export function renderChart(
       changePctAtCursor: null,
       cursorColumn: null,
       cursorRow: null,
+      axisFractionDigits: null,
+      priceRange: null,
       pixelBuffer: null,
     };
   }
@@ -1082,6 +1249,7 @@ export function renderChart(
   const { width, colors: palette, mode } = opts;
   const axisMode = opts.axisMode ?? "price";
   const currency = opts.currency ?? "USD";
+  const assetCategory = opts.assetCategory;
 
   // Braille resolution: 2 dot-columns per terminal column, 4 dot-rows per terminal row
   const dotWidth = width * 2;
@@ -1094,8 +1262,24 @@ export function renderChart(
 
   const buf = createPixelBuffer(dotWidth, totalDotH);
   const { min, max } = scene;
+  const priceRange = max - min;
 
   const gridLines = computeGridLines(min, max, 0, chartDotBottom, 3);
+  const axisFractionDigits = axisMode === "price"
+    ? resolveAxisFractionDigits(
+      gridLines.map((line) => line.price),
+      (price, fixedFractionDigits) => formatPriceWithCurrency(
+        price,
+        currency,
+        assetCategory,
+        priceRange,
+        0,
+        0,
+        fixedFractionDigits,
+      ),
+      getAxisFractionDigitFloor(assetCategory, priceRange),
+    )
+    : null;
   drawGridLines(buf, gridLines.map((line) => line.y), palette.gridColor);
 
   switch (mode) {
@@ -1126,6 +1310,10 @@ export function renderChart(
     );
   }
 
+  if (opts.indicators) {
+    drawIndicatorOverlays(buf, opts.indicators, points.length, 0, chartDotBottom, min, max, mode);
+  }
+
   // Cursor mapping stays in terminal-column space
   const { activePoint, priceAtCursor, crosshairPrice, dateAtCursor, changeAtCursor, changePctAtCursor } = scene;
 
@@ -1137,7 +1325,7 @@ export function renderChart(
   for (const line of gridLines) {
     axisLabelsByRow.set(
       Math.min(Math.floor(line.y / 4), Math.max(chartTermRows - 1, 0)),
-      formatAxisValue(line.price, axisMode, points[0]!.close, currency),
+      formatAxisValue(line.price, axisMode, points[0]!.close, currency, assetCategory, priceRange, axisFractionDigits ?? undefined),
     );
   }
 
@@ -1155,6 +1343,8 @@ export function renderChart(
     changePctAtCursor,
     cursorColumn: scene.cursorColumn,
     cursorRow: scene.cursorRow,
+    axisFractionDigits,
+    priceRange,
     pixelBuffer: buf,
   };
 }

package/src/components/chart/chart-resolution.test.ts

@@ -1,7 +1,10 @@
 import { describe, expect, test } from "bun:test";
 import {
+  CHART_RESOLUTION_STEP_MS,
   clampTimeRangeForResolution,
   getActiveRangePreset,
+  getBestSupportedResolutionForDateWindow,
+  getBestSupportedResolutionForVisibleWindow,
   getPresetResolution,
   intersectChartResolutions,
   isRangePresetSupported,
@@ -53,4 +56,68 @@ describe("chart-resolution", () => {
     expect(normalizeChartResolution("bogus", "1d")).toBe("1d");
     expect(sortChartResolutions(["1wk", "auto", "15m", "1d"])).toEqual(["auto", "15m", "1d", "1wk"]);
   });
+
+  test("picks the best supported resolution for the current visible date window", () => {
+    const support = [
+      { resolution: "1m", maxRange: "1D" },
+      { resolution: "5m", maxRange: "1W" },
+      { resolution: "15m", maxRange: "1M" },
+      { resolution: "1h", maxRange: "3M" },
+      { resolution: "1d", maxRange: "5Y" },
+      { resolution: "1wk", maxRange: "ALL" },
+    ] as const;
+
+    expect(getBestSupportedResolutionForDateWindow({
+      start: new Date("2026-01-08T10:00:00Z"),
+      end: new Date("2026-01-08T16:00:00Z"),
+    }, support)).toBe("1m");
+
+    expect(getBestSupportedResolutionForDateWindow({
+      start: new Date("2026-01-01T00:00:00Z"),
+      end: new Date("2026-01-08T00:00:00Z"),
+    }, support)).toBe("5m");
+
+    expect(getBestSupportedResolutionForDateWindow({
+      start: new Date("2021-01-01T00:00:00Z"),
+      end: new Date("2026-01-01T00:00:00Z"),
+    }, support)).toBe("1wk");
+  });
+
+  test("picks a denser supported resolution as the visible window narrows", () => {
+    const support = [
+      { resolution: "1m", maxRange: "1D" },
+      { resolution: "5m", maxRange: "1W" },
+      { resolution: "15m", maxRange: "1M" },
+      { resolution: "1h", maxRange: "3M" },
+      { resolution: "1d", maxRange: "5Y" },
+      { resolution: "1wk", maxRange: "ALL" },
+    ] as const;
+
+    expect(getBestSupportedResolutionForVisibleWindow({
+      start: new Date("2021-01-01T00:00:00Z"),
+      end: new Date("2026-01-01T00:00:00Z"),
+    }, support, 100)).toBe("1wk");
+
+    expect(getBestSupportedResolutionForVisibleWindow({
+      start: new Date("2025-01-01T00:00:00Z"),
+      end: new Date("2026-01-01T00:00:00Z"),
+    }, support, 100)).toBe("1d");
+
+    expect(getBestSupportedResolutionForVisibleWindow({
+      start: new Date("2025-12-01T00:00:00Z"),
+      end: new Date("2026-01-01T00:00:00Z"),
+    }, support, 100)).toBe("1h");
+
+    expect(getBestSupportedResolutionForVisibleWindow({
+      start: new Date("2025-12-25T00:00:00Z"),
+      end: new Date("2026-01-01T00:00:00Z"),
+    }, support, 100)).toBe("15m");
+
+    expect(getBestSupportedResolutionForVisibleWindow({
+      start: new Date("2026-01-01T00:00:00Z"),
+      end: new Date("2026-01-02T00:00:00Z"),
+    }, support, 100)).toBe("1m");
+
+    expect(CHART_RESOLUTION_STEP_MS["1h"]).toBe(60 * 60_000);
+  });
 });

package/src/components/chart/chart-resolution.ts

@@ -58,11 +58,34 @@ export const RANGE_PRELOAD_BUFFER: Record<TimeRange, TimeRange> = {
 };
 
 export const DEFAULT_TICKER_CHART_RANGE_PRESET: TimeRange = "5Y";
-export const DEFAULT_TICKER_CHART_RESOLUTION: ManualChartResolution = "1wk";
+export const DEFAULT_TICKER_CHART_RESOLUTION: ChartResolution = "auto";
 export const DEFAULT_COMPARISON_CHART_RANGE_PRESET: TimeRange = "1Y";
 export const DEFAULT_COMPARISON_CHART_RESOLUTION: ManualChartResolution = "1d";
 
 export const DEFAULT_VISIBLE_MANUAL_CHART_RESOLUTIONS: ManualChartResolution[] = ["1m", "5m", "15m", "1h", "1d", "1wk", "1mo"];
+export const CHART_RESOLUTION_STEP_MS: Record<ManualChartResolution, number> = {
+  "1m": 60_000,
+  "5m": 5 * 60_000,
+  "15m": 15 * 60_000,
+  "30m": 30 * 60_000,
+  "45m": 45 * 60_000,
+  "1h": 60 * 60_000,
+  "1d": 24 * 60 * 60_000,
+  "1wk": 7 * 24 * 60 * 60_000,
+  "1mo": 30 * 24 * 60 * 60_000,
+};
+
+const CHART_RESOLUTION_POINTS_PER_DAY: Record<ManualChartResolution, number> = {
+  "1m": 390,
+  "5m": 78,
+  "15m": 26,
+  "30m": 13,
+  "45m": 9,
+  "1h": 7,
+  "1d": 1,
+  "1wk": 1 / 5,
+  "1mo": 1 / 21,
+};
 
 const TIME_RANGE_INDEX = new Map(TIME_RANGE_ORDER.map((range, index) => [range, index]));
 const RANGE_PRESETS_BY_RESOLUTION = TIME_RANGE_ORDER.reduce<Record<ManualChartResolution, TimeRange[]>>((acc, range) => {
@@ -140,7 +163,7 @@ export function normalizeManualChartResolutions(resolutions: readonly string[]):
 
 export function intersectChartResolutions(resolutionSets: Array<readonly string[]>): ManualChartResolution[] {
   if (resolutionSets.length === 0) return [];
-  const [first, ...rest] = resolutionSets.map((set) => new Set(normalizeManualChartResolutions(set)));
+  const [first = new Set<ManualChartResolution>(), ...rest] = resolutionSets.map((set) => new Set(normalizeManualChartResolutions(set)));
   return sortChartResolutions(
     [...first].filter((resolution) => rest.every((set) => set.has(resolution))),
   );
@@ -194,8 +217,8 @@ export function getSupportMaxRange(
   support: readonly ChartResolutionSupport[] | ReadonlyMap<ManualChartResolution, TimeRange>,
   resolution: ManualChartResolution,
 ): TimeRange | null {
-  if (support instanceof Map) {
-    return support.get(resolution) ?? null;
+  if (!Array.isArray(support)) {
+    return (support as ReadonlyMap<ManualChartResolution, TimeRange>).get(resolution) ?? null;
   }
   return normalizeChartResolutionSupport(support).find((entry) => entry.resolution === resolution)?.maxRange ?? null;
 }
@@ -301,6 +324,53 @@ export function getBestSupportedResolutionForPreset(
   return supportedResolutions[supportedResolutions.length - 1] ?? null;
 }
 
+export function getBestSupportedResolutionForDateWindow(
+  window: { start: Date | null; end: Date | null } | null,
+  support: readonly ChartResolutionSupport[] | ReadonlyMap<ManualChartResolution, TimeRange>,
+): ManualChartResolution | null {
+  if (!window?.start || !window.end) return null;
+  const range = getTimeRangeForDateWindow(window);
+  return getBestSupportedResolutionForPreset(range, support);
+}
+
+export function getTimeRangeForDateWindow(
+  window: { start: Date | null; end: Date | null } | null,
+): TimeRange {
+  if (!window?.start || !window.end) return "ALL";
+  return TIME_RANGE_ORDER.find((candidate) => isDateWindowWithinTimeRange(window.start!, window.end!, candidate)) ?? "ALL";
+}
+
+export function getBestSupportedResolutionForVisibleWindow(
+  window: { start: Date | null; end: Date | null } | null,
+  support: readonly ChartResolutionSupport[] | ReadonlyMap<ManualChartResolution, TimeRange>,
+  targetPointCount: number,
+): ManualChartResolution | null {
+  if (!window?.start || !window.end) return null;
+
+  const spanMs = Math.max(window.end.getTime() - window.start.getTime(), 0);
+  const dayCount = Math.max(spanMs / CHART_RESOLUTION_STEP_MS["1d"], 1 / 24);
+  const supportedResolutions = sortChartResolutions(
+    CHART_RESOLUTION_ORDER
+      .filter((resolution): resolution is ManualChartResolution => resolution !== "auto")
+      .filter((resolution) => {
+        const maxRange = getSupportMaxRange(support, resolution);
+        return maxRange !== null && isDateWindowWithinTimeRange(window.start!, window.end!, maxRange);
+      }),
+  );
+
+  if (supportedResolutions.length === 0) return null;
+
+  const minimumPointTarget = Math.max(targetPointCount, 1);
+  for (const resolution of [...supportedResolutions].reverse()) {
+    const estimatedPointCount = Math.max(dayCount * CHART_RESOLUTION_POINTS_PER_DAY[resolution], 1);
+    if (estimatedPointCount >= minimumPointTarget) {
+      return resolution;
+    }
+  }
+
+  return supportedResolutions[0] ?? null;
+}
+
 export function getNextFallbackResolution(
   range: TimeRange,
   currentResolution: ManualChartResolution,

package/src/components/chart/chart-scroll.test.ts

@@ -0,0 +1,69 @@
+import { describe, expect, test } from "bun:test";
+import {
+  applyBufferedPanExpansion,
+  consumeScrollPanCellDelta,
+  consumeScrollPanMovement,
+  getDragPanPointDelta,
+  getDragPanWindowRatio,
+  getKeyboardPanCellCount,
+  resolveDragPanOffset,
+  resolveHorizontalScrollPanDirection,
+} from "./chart-scroll";
+
+describe("chart-scroll", () => {
+  test("maps every wheel direction onto horizontal panning", () => {
+    expect(resolveHorizontalScrollPanDirection("up")).toBe(1);
+    expect(resolveHorizontalScrollPanDirection("left")).toBe(1);
+    expect(resolveHorizontalScrollPanDirection("down")).toBe(-1);
+    expect(resolveHorizontalScrollPanDirection("right")).toBe(-1);
+  });
+
+  test("accumulates wheel input before panning a full cell", () => {
+    let result = consumeScrollPanCellDelta(100, 1, 1, 0);
+    expect(result.cells).toBe(0);
+    expect(result.remainder).toBeCloseTo(0.5);
+
+    result = consumeScrollPanCellDelta(100, 1, 1, result.remainder);
+    expect(result.cells).toBe(1);
+    expect(result.remainder).toBeCloseTo(0);
+
+    result = consumeScrollPanCellDelta(100, 0.4, -1, result.remainder);
+    expect(result.cells).toBe(0);
+    expect(result.remainder).toBeCloseTo(-0.2);
+  });
+
+  test("uses slower pan distances for keyboard and drag input", () => {
+    expect(getKeyboardPanCellCount(100)).toBe(2);
+    expect(getDragPanPointDelta(10, 100, 200)).toBe(4);
+    expect(getDragPanWindowRatio(10, 100)).toBeCloseTo(0.02);
+    expect(resolveDragPanOffset(20, 10, 100, 200, 40)).toBe(16);
+    expect(resolveDragPanOffset(2, 10, 100, 200, 40)).toBe(0);
+  });
+
+  test("resolves wheel direction, cell delta, remainder, and ratio together", () => {
+    const first = consumeScrollPanMovement(100, 1, "up", 0);
+    expect(first).toEqual({ cells: 0, remainder: 0.5, ratio: 0 });
+
+    const second = consumeScrollPanMovement(100, 1, "up", first.remainder);
+    expect(second).toEqual({ cells: 1, remainder: 0, ratio: 0.01 });
+  });
+
+  test("preserves the active cursor when widening the buffered pan range", () => {
+    const next = applyBufferedPanExpansion({
+      presetRange: "1W" as const,
+      bufferRange: "1M" as const,
+      activePreset: "1W" as const,
+      panOffset: 12,
+      zoomLevel: 2,
+      cursorX: 18,
+      cursorY: 6,
+    }, "3M");
+
+    expect(next).toMatchObject({
+      activePreset: null,
+      bufferRange: "3M",
+      cursorX: 18,
+      cursorY: 6,
+    });
+  });
+});