gloomberb 0.4.1 → 0.5.0

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

@@ -19,6 +19,23 @@ export interface ChartProjection {
   fallbackMode: ChartRenderMode | null;
 }
 
+export interface ProjectChartDataOptions {
+  ohlcBucketWidth?: number;
+  ohlcSourceBucketSize?: number;
+  ohlcTargetBucketCount?: number;
+  sourceIndexOffset?: number;
+}
+
+export interface StableOhlcProjectionOptionsInput {
+  pointCount: number;
+  sourceIndexOffset: number;
+  bucketWidth: number;
+  navigationPointCount?: number;
+  countRatioTolerance?: number;
+}
+
+const DEFAULT_OHLC_COUNT_RATIO_TOLERANCE = 1.2;
+
 function coerceDate(value: Date | string | number): Date {
   return value instanceof Date ? value : new Date(value);
 }
@@ -113,6 +130,104 @@ function normalizePoint(point: PricePoint): ProjectedChartPoint {
   };
 }
 
+function getMinimumPositiveDateGapMs(points: readonly ProjectedChartPoint[]): number | null {
+  let minimum = Number.POSITIVE_INFINITY;
+  for (let index = 1; index < points.length; index += 1) {
+    const previous = points[index - 1]!.date.getTime();
+    const current = points[index]!.date.getTime();
+    const gap = current - previous;
+    if (Number.isFinite(gap) && gap > 0 && gap < minimum) {
+      minimum = gap;
+    }
+  }
+  return Number.isFinite(minimum) ? minimum : null;
+}
+
+function aggregateOhlcBucket(bucket: readonly ProjectedChartPoint[]): ProjectedChartPoint {
+  const first = bucket[0]!;
+  const last = bucket[bucket.length - 1]!;
+  let high = first.high;
+  let low = first.low;
+  let volume = 0;
+
+  for (const point of bucket) {
+    high = Math.max(high, point.high);
+    low = Math.min(low, point.low);
+    volume += point.volume;
+  }
+
+  return {
+    date: last.date,
+    open: first.open,
+    high,
+    low,
+    close: last.close,
+    volume,
+  };
+}
+
+function bucketOhlcBySourceIndex(
+  normalizedPoints: readonly ProjectedChartPoint[],
+  bucketSize: number,
+  sourceIndexOffset: number,
+  targetBucketCount?: number,
+): ProjectedChartPoint[] {
+  const normalizedBucketSize = Math.max(Math.floor(bucketSize), 1);
+  const normalizedSourceIndexOffset = Math.max(Math.floor(sourceIndexOffset), 0);
+  const maximumBucketCount = targetBucketCount === undefined
+    ? Number.POSITIVE_INFINITY
+    : Math.max(Math.floor(targetBucketCount), 1);
+  const result: ProjectedChartPoint[] = [];
+  const firstBucketStart = Math.floor(normalizedSourceIndexOffset / normalizedBucketSize) * normalizedBucketSize;
+  const endSourceIndex = normalizedSourceIndexOffset + normalizedPoints.length;
+
+  for (
+    let bucketStart = firstBucketStart;
+    bucketStart < endSourceIndex && result.length < maximumBucketCount;
+    bucketStart += normalizedBucketSize
+  ) {
+    const bucketEnd = bucketStart + normalizedBucketSize;
+    const start = Math.max(bucketStart - normalizedSourceIndexOffset, 0);
+    const end = Math.min(bucketEnd - normalizedSourceIndexOffset, normalizedPoints.length);
+    if (end <= start) continue;
+    const bucket = normalizedPoints.slice(start, end);
+    if (bucket.length === 0) continue;
+    result.push(aggregateOhlcBucket(bucket));
+  }
+
+  return result;
+}
+
+export function resolveStableOhlcProjectionOptions({
+  pointCount,
+  sourceIndexOffset,
+  bucketWidth,
+  navigationPointCount = 0,
+  countRatioTolerance = DEFAULT_OHLC_COUNT_RATIO_TOLERANCE,
+}: StableOhlcProjectionOptionsInput): ProjectChartDataOptions {
+  const ohlcBucketWidth = Math.max(Math.floor(bucketWidth), 1);
+  const ohlcProjectionWidth = Math.max(Math.floor(ohlcBucketWidth / 2), 1);
+  const normalizedPointCount = Math.max(Math.floor(pointCount), 0);
+  const normalizedNavigationPointCount = Math.max(Math.floor(navigationPointCount), 0);
+  const canUseNavigationCount = normalizedNavigationPointCount > 0
+    && normalizedPointCount > 0
+    && Math.max(normalizedNavigationPointCount, normalizedPointCount)
+      / Math.max(Math.min(normalizedNavigationPointCount, normalizedPointCount), 1)
+      <= countRatioTolerance;
+  const stableSourceCount = canUseNavigationCount
+    ? normalizedNavigationPointCount
+    : normalizedPointCount;
+  const ohlcSourceBucketSize = Math.max(Math.ceil(stableSourceCount / ohlcProjectionWidth), 1);
+  const ohlcTargetBucketCount = Math.max(Math.ceil(stableSourceCount / ohlcSourceBucketSize), 1);
+
+  return {
+    ohlcBucketWidth,
+    ohlcSourceBucketSize,
+    ohlcTargetBucketCount,
+    sourceIndexOffset,
+  };
+}
+
 /**
  * Downsample close-driven chart data to fit the target width.
  * Uses representative closes so line/area charts preserve the broad shape.
@@ -156,44 +271,75 @@ export function projectCloseSeries(
 
 /**
  * Bucket OHLC data so each rendered column preserves open, close, high, low, and volume.
+ *
+ * The default path aligns buckets by timestamp. Interactive manual panning can pass
+ * ohlcSourceBucketSize/ohlcTargetBucketCount to align buckets by source bar index,
+ * which keeps the rendered candle count stable as partial edge buckets enter/leave.
  */
 export function bucketOhlcSeries(
   points: PricePoint[],
   targetWidth: number,
+  options: ProjectChartDataOptions = {},
 ): ProjectedChartPoint[] {
   if (points.length === 0) return [];
-  if (points.length <= targetWidth) return points.map(normalizePoint);
+  const normalizedPoints = points.map(normalizePoint);
+  if (points.length <= targetWidth) return normalizedPoints;
+  if (options.ohlcSourceBucketSize !== undefined) {
+    return bucketOhlcBySourceIndex(
+      normalizedPoints,
+      options.ohlcSourceBucketSize,
+      options.sourceIndexOffset ?? 0,
+      options.ohlcTargetBucketCount,
+    );
+  }
 
   const result: ProjectedChartPoint[] = [];
-  const bucketSize = points.length / targetWidth;
-
-  for (let i = 0; i < targetWidth; i++) {
-    const start = Math.floor(i * bucketSize);
-    const end = Math.min(points.length, Math.max(Math.floor((i + 1) * bucketSize), start + 1));
-    const bucket = points.slice(start, end);
-    if (bucket.length === 0) continue;
-
-    const first = bucket[0]!;
-    const last = bucket[bucket.length - 1]!;
-
-    let high = first.high ?? first.close;
-    let low = first.low ?? first.close;
-    let volume = 0;
+  const minimumGapMs = getMinimumPositiveDateGapMs(normalizedPoints);
+  const firstTime = normalizedPoints[0]!.date.getTime();
+  const lastTime = normalizedPoints[normalizedPoints.length - 1]!.date.getTime();
+  if (
+    minimumGapMs
+    && Number.isFinite(firstTime)
+    && Number.isFinite(lastTime)
+    && lastTime > firstTime
+  ) {
+    const spanMs = Math.max(lastTime - firstTime, minimumGapMs);
+    const rawBucketDurationMs = spanMs / Math.max(targetWidth, 1);
+    const bucketDurationMs = Math.max(Math.ceil(rawBucketDurationMs / minimumGapMs) * minimumGapMs, minimumGapMs);
+    let currentBucketKey: number | null = null;
+    let currentBucket: ProjectedChartPoint[] = [];
+
+    for (const point of normalizedPoints) {
+      const time = point.date.getTime();
+      const bucketKey = Math.floor(time / bucketDurationMs);
+      if (currentBucketKey !== null && bucketKey !== currentBucketKey) {
+        result.push(aggregateOhlcBucket(currentBucket));
+        currentBucket = [];
+      }
+      currentBucketKey = bucketKey;
+      currentBucket.push(point);
+    }
 
-    for (const point of bucket) {
-      high = Math.max(high, point.high ?? point.close);
-      low = Math.min(low, point.low ?? point.close);
-      volume += point.volume ?? 0;
+    if (currentBucket.length > 0) {
+      result.push(aggregateOhlcBucket(currentBucket));
     }
 
-    result.push({
-      date: coerceDate(last.date as Date | string | number),
-      open: first.open ?? first.close,
-      high,
-      low,
-      close: last.close,
-      volume,
-    });
+    return result;
+  }
+
+  const bucketSize = Math.max(Math.ceil(normalizedPoints.length / Math.max(targetWidth, 1)), 1);
+  const sourceIndexOffset = Math.max(Math.floor(options.sourceIndexOffset ?? 0), 0);
+  const firstBucketStart = Math.floor(sourceIndexOffset / bucketSize) * bucketSize;
+  const endSourceIndex = sourceIndexOffset + normalizedPoints.length;
+
+  for (let bucketStart = firstBucketStart; bucketStart < endSourceIndex; bucketStart += bucketSize) {
+    const bucketEnd = bucketStart + bucketSize;
+    const start = Math.max(bucketStart - sourceIndexOffset, 0);
+    const end = Math.min(bucketEnd - sourceIndexOffset, normalizedPoints.length);
+    if (end <= start) continue;
+    const bucket = normalizedPoints.slice(start, end);
+    if (bucket.length === 0) continue;
+    result.push(aggregateOhlcBucket(bucket));
   }
 
   return result;
@@ -219,14 +365,16 @@ export function projectChartData(
   targetWidth: number,
   mode: ChartRenderMode | undefined,
   compact = false,
+  options: ProjectChartDataOptions = {},
 ): ChartProjection {
   const { requestedMode, effectiveMode, fallbackMode } = resolveRenderMode(mode, targetWidth, compact);
+  const ohlcBucketWidth = options.ohlcBucketWidth ?? targetWidth;
   const projectionWidth = effectiveMode === "candles" || effectiveMode === "ohlc"
-    ? Math.max(Math.floor(targetWidth / 2), 1)
+    ? Math.max(Math.floor(ohlcBucketWidth / 2), 1)
     : targetWidth;
 
   const projectedPoints = effectiveMode === "candles" || effectiveMode === "ohlc"
-    ? bucketOhlcSeries(points, projectionWidth)
+    ? bucketOhlcSeries(points, projectionWidth, options)
     : projectCloseSeries(points, projectionWidth);
 
   return {

package/src/components/chart/chart-indicator-selector.tsx

@@ -0,0 +1,53 @@
+import { MultiSelectDialogButton } from "../ui";
+import { ChartControlHint } from "./chart-control-hint";
+import {
+  CHART_INDICATOR_OPTIONS,
+  normalizeChartIndicatorSelection,
+  type ChartIndicatorId,
+} from "./indicators/options";
+
+interface ChartIndicatorSelectorProps {
+  selectedIds: ChartIndicatorId[];
+  onChange: (selectedIds: ChartIndicatorId[]) => void;
+  width: number;
+  variant?: "button" | "hint";
+  shortcutActive?: boolean;
+}
+
+export function ChartIndicatorSelector({
+  selectedIds,
+  onChange,
+  width,
+  variant = "button",
+  shortcutActive = false,
+}: ChartIndicatorSelectorProps) {
+  const compact = width < 72;
+  const options = CHART_INDICATOR_OPTIONS.map((option) => ({
+    value: option.id,
+    label: compact ? option.compactLabel : option.label,
+    description: option.description,
+  }));
+
+  return (
+    <MultiSelectDialogButton
+      label={compact ? "IND" : "Indicators"}
+      title="Chart Indicators"
+      options={options}
+      selectedValues={selectedIds}
+      onChange={(values) => onChange(normalizeChartIndicatorSelection(values))}
+      idPrefix="chart-indicators"
+      shortcutKey={variant === "hint" ? "i" : undefined}
+      shortcutActive={shortcutActive}
+      renderTrigger={variant === "hint"
+        ? ({ disabled, openDialog }) => (
+          <ChartControlHint
+            hotkey="i"
+            label="ndicators"
+            disabled={disabled}
+            onPress={openDialog}
+          />
+        )
+        : undefined}
+    />
+  );
+}

package/src/components/chart/chart-pane-settings.ts

@@ -2,6 +2,7 @@ import { saveConfig } from "../../data/config-store";
 import { setPaneSettings } from "../../pane-settings";
 import { useAppState, usePaneInstance, usePaneInstanceId } from "../../state/app-context";
 import type { ChartResolution, TimeRange } from "./chart-types";
+import type { IndicatorConfig } from "./indicators/types";
 
 export function usePersistChartControlSelection(rangePresetKey: string): (
   range: TimeRange,
@@ -25,3 +26,22 @@ export function usePersistChartControlSelection(rangePresetKey: string): (
     saveConfig(nextConfig).catch(() => {});
   };
 }
+
+export function usePersistIndicatorConfig(): (config: IndicatorConfig) => void {
+  const { state, dispatch } = useAppState();
+  const paneId = usePaneInstanceId();
+  const pane = usePaneInstance();
+
+  return (indicatorConfig) => {
+    const layout = setPaneSettings(state.config.layout, paneId, {
+      ...(pane?.settings ?? {}),
+      indicators: indicatorConfig,
+    });
+    const layouts = state.config.layouts.map((savedLayout, index) => (
+      index === state.config.activeLayoutIndex ? { ...savedLayout, layout } : savedLayout
+    ));
+    const nextConfig = { ...state.config, layout, layouts };
+    dispatch({ type: "SET_CONFIG", config: nextConfig });
+    saveConfig(nextConfig).catch(() => {});
+  };
+}