gloomberb 0.9.7 → 0.9.9

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

@@ -34,6 +34,9 @@ export interface BarChartBar {
   category: string;
   value: number;
   color: string;
+  categoryIndex: number;
+  seriesIndex: number;
+  seriesCount: number;
   x: number;
   width: number;
   row: number;
@@ -69,17 +72,6 @@ export interface NativeBarChartPixelBounds {
 
 const clamp = (value: number, min: number, max: number) => Math.max(min, Math.min(max, value));
 
-function categorySlotBounds(width: number, categoryCount: number, index: number): { left: number; width: number } {
-  const left = Math.floor((index * width) / categoryCount);
-  const right = index === categoryCount - 1
-    ? width
-    : Math.floor(((index + 1) * width) / categoryCount);
-  return {
-    left,
-    width: Math.max(1, right - left),
-  };
-}
-
 function collectCategories(series: BarChartSeries[]): string[] {
   const categories: string[] = [];
   const seen = new Set<string>();
@@ -90,7 +82,10 @@ function collectCategories(series: BarChartSeries[]): string[] {
       categories.push(point.category);
     }
   }
-  return categories;
+  return categories.filter((category) => series.some((item) => {
+    const value = item.points.find((point) => point.category === category)?.value;
+    return typeof value === "number" && Number.isFinite(value);
+  }));
 }
 
 function normalizeRange(values: number[]): { min: number; max: number } {
@@ -133,32 +128,28 @@ export function buildBarChartScene(series: BarChartSeries[], options: BarChartSc
 
   const { min, max } = normalizeRange(values);
   const zeroRow = valueToRow(0, min, max, height);
-  const seriesCount = Math.max(series.length, 1);
-  const categorySlots = categories.map((_, index) => categorySlotBounds(width, categories.length, index));
-  const minSlotWidth = Math.max(1, Math.min(...categorySlots.map((slot) => slot.width)));
-  const groupedInnerWidth = Math.max(seriesCount, minSlotWidth - (minSlotWidth > seriesCount * 2 ? 1 : 0));
-  const groupedBarWidth = Math.max(1, Math.floor(groupedInnerWidth / seriesCount));
+  const seriesSlotCount = Math.max(series.length, 1);
   const bars: BarChartBar[] = [];
 
   categories.forEach((category, categoryIndex) => {
-    const group = categorySlots[categoryIndex]!;
-    const barWidth = seriesCount === 1 ? group.width : groupedBarWidth;
-    const barGroupWidth = barWidth * seriesCount;
-    const groupOffset = Math.max(0, Math.floor((group.width - barGroupWidth) / 2));
     series.forEach((item, seriesIndex) => {
       const value = item.points.find((point) => point.category === category)?.value;
       if (typeof value !== "number" || !Number.isFinite(value)) return;
       const color = value < 0 && options.colors.negativeColor
         ? options.colors.negativeColor
         : item.color;
+      const barBounds = chartSlotBounds(width, categories.length * seriesSlotCount, categoryIndex * seriesSlotCount + seriesIndex);
       bars.push({
         seriesId: item.id,
         seriesLabel: item.label,
         category,
         value,
         color,
-        x: clamp(group.left + groupOffset + seriesIndex * barWidth, 0, width - 1),
-        width: Math.min(barWidth, Math.max(width - (group.left + groupOffset + seriesIndex * barWidth), 1)),
+        categoryIndex,
+        seriesIndex,
+        seriesCount: seriesSlotCount,
+        x: barBounds.x,
+        width: barBounds.width,
         row: valueToRow(value, min, max, height),
       });
     });
@@ -177,6 +168,47 @@ export function buildBarChartScene(series: BarChartSeries[], options: BarChartSc
   };
 }
 
+function chartSlotBounds(
+  width: number,
+  slotCount: number,
+  slotIndex: number,
+): { x: number; width: number } {
+  const slots = Math.max(1, slotCount);
+  if (slots > width) {
+    const x = clamp(Math.floor(slotIndex * width / slots), 0, width - 1);
+    const right = clamp(Math.floor((slotIndex + 1) * width / slots), x + 1, width);
+    return {
+      x,
+      width: Math.max(1, right - x),
+    };
+  }
+  const gap = slots > 1 && width >= slots * 2 - 1 ? 1 : 0;
+  const usableWidth = Math.max(slots, width - gap * (slots - 1));
+  const slotWidth = Math.max(1, Math.floor(usableWidth / slots));
+  const usedWidth = slotWidth * slots + gap * (slots - 1);
+  const offset = Math.max(0, Math.floor((width - usedWidth) / 2));
+  const x = clamp(offset + slotIndex * (slotWidth + gap), 0, width - 1);
+  return {
+    x,
+    width: Math.max(1, Math.min(slotWidth, width - x)),
+  };
+}
+
+function categoryCellBounds(
+  width: number,
+  categoryCount: number,
+  seriesCount: number,
+  categoryIndex: number,
+): { left: number; width: number } {
+  const first = chartSlotBounds(width, categoryCount * seriesCount, categoryIndex * seriesCount);
+  const last = chartSlotBounds(width, categoryCount * seriesCount, categoryIndex * seriesCount + seriesCount - 1);
+  const right = last.x + last.width;
+  return {
+    left: first.x,
+    width: Math.max(1, right - first.x),
+  };
+}
+
 function labelAtRow(labels: Array<{ row: number; value: number }>, row: number): number | null {
   const match = labels.find((label) => label.row === row);
   return match ? match.value : null;
@@ -227,6 +259,10 @@ export function resolveBarChartHover(scene: BarChartScene, cellX: number): BarCh
     return Math.abs(currentCenter - x) < Math.abs(closestCenter - x) ? current : closest;
   }, scene.bars[0]!);
 
+  return barToHover(bar);
+}
+
+function barToHover(bar: BarChartBar): BarChartHover {
   return {
     seriesId: bar.seriesId,
     seriesLabel: bar.seriesLabel,
@@ -239,6 +275,29 @@ export function resolveBarChartHover(scene: BarChartScene, cellX: number): BarCh
   };
 }
 
+export function resolveNativeBarChartHover(
+  scene: BarChartScene,
+  pixelX: number,
+  pixelWidth: number,
+): BarChartHover | null {
+  if (!Number.isFinite(pixelX) || scene.bars.length === 0) return null;
+  const width = Math.max(1, Math.floor(pixelWidth));
+  const x = clamp(Math.floor(pixelX), 0, width - 1);
+  const direct = scene.bars.find((bar) => {
+    const bounds = resolveNativeBarPixelBounds(scene, bar, width);
+    return x >= bounds.left && x < bounds.rightExclusive;
+  });
+  const bar = direct ?? scene.bars.reduce((closest, current) => {
+    const closestBounds = resolveNativeBarPixelBounds(scene, closest, width);
+    const currentBounds = resolveNativeBarPixelBounds(scene, current, width);
+    const closestCenter = (closestBounds.left + closestBounds.rightExclusive - 1) / 2;
+    const currentCenter = (currentBounds.left + currentBounds.rightExclusive - 1) / 2;
+    return Math.abs(currentCenter - x) < Math.abs(closestCenter - x) ? current : closest;
+  }, scene.bars[0]!);
+
+  return barToHover(bar);
+}
+
 export function renderBarChart(scene: BarChartScene, hover: BarChartHover | null = null): string[] {
   const rows = Array.from({ length: scene.height }, () => Array(scene.width).fill(" "));
   for (let x = 0; x < scene.width; x++) {
@@ -288,7 +347,7 @@ export function renderBarChartAxis(scene: BarChartScene, rowCount = 1): string[]
   scene.categories.forEach((category, index) => {
     const label = compactCategoryLabel(category, scene.categories[index - 1], scene.categories.length);
     if (!label) return;
-    const group = categorySlotBounds(scene.width, scene.categories.length, index);
+    const group = categoryCellBounds(scene.width, scene.categories.length, Math.max(scene.series.length, 1), index);
     const start = centeredLabelStart(group.left + group.width / 2, label, scene.width, rightInset);
     const row = rows.find((candidate) => canPlaceLabel(candidate, start, label, minGap));
     if (!row) return;
@@ -305,42 +364,39 @@ export function resolveNativeBarPixelBounds(
   pixelWidth: number,
 ): NativeBarChartPixelBounds {
   const width = Math.max(1, Math.floor(pixelWidth));
-
-  if (scene.series.length === 1) {
-    const categoryIndex = scene.categories.indexOf(bar.category);
-    if (categoryIndex >= 0) {
-      const separatorWidth = scene.categories.length > 1 && width >= scene.categories.length * 3 ? 1 : 0;
-      const usableWidth = Math.max(
-        scene.categories.length,
-        width - separatorWidth * (scene.categories.length - 1),
-      );
-      const left = Math.floor((categoryIndex * usableWidth) / scene.categories.length)
-        + categoryIndex * separatorWidth;
-      const rightExclusive = categoryIndex === scene.categories.length - 1
-        ? width
-        : Math.floor(((categoryIndex + 1) * usableWidth) / scene.categories.length)
-          + categoryIndex * separatorWidth;
-      return {
-        left,
-        rightExclusive: Math.max(left + 1, rightExclusive),
-      };
-    }
-  }
-
-  const horizontalInset = 1;
-  const left = clamp(
-    Math.floor((bar.x / scene.width) * width + horizontalInset),
-    0,
-    width - 1,
-  );
-  const rightExclusive = clamp(
-    Math.ceil(((bar.x + bar.width) / scene.width) * width - horizontalInset),
-    left + 1,
+  const bounds = nativeSlotBounds(
     width,
+    scene.categories.length * bar.seriesCount,
+    bar.categoryIndex * bar.seriesCount + bar.seriesIndex,
   );
+  const left = clamp(bounds.left, 0, width - 1);
+  const rightExclusive = clamp(bounds.rightExclusive, left + 1, width);
   return { left, rightExclusive };
 }
 
+function nativeSlotBounds(
+  width: number,
+  slotCount: number,
+  slotIndex: number,
+): NativeBarChartPixelBounds {
+  const slots = Math.max(1, slotCount);
+  if (slots > width) {
+    const left = clamp(Math.floor(slotIndex * width / slots), 0, width - 1);
+    const rightExclusive = clamp(Math.floor((slotIndex + 1) * width / slots), left + 1, width);
+    return { left, rightExclusive };
+  }
+  const gap = slots > 1 && width >= slots * 2 - 1 ? 1 : 0;
+  const usableWidth = Math.max(slots, width - gap * (slots - 1));
+  const slotWidth = Math.max(1, Math.floor(usableWidth / slots));
+  const usedWidth = slotWidth * slots + gap * (slots - 1);
+  const offset = Math.max(0, Math.floor((width - usedWidth) / 2));
+  const left = offset + slotIndex * (slotWidth + gap);
+  return {
+    left,
+    rightExclusive: Math.max(left + 1, left + slotWidth),
+  };
+}
+
 export function renderNativeBarChart(
   scene: BarChartScene,
   pixelWidth: number,

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

@@ -22,7 +22,6 @@ import {
   getScaledComparisonY,
   getSelectedComparisonSeries,
   type ComparisonChartColors,
-  type ComparisonChartScene,
   type RenderComparisonChartOptions,
 } from "./scene";
 

package/src/components/chart/comparison-stock-chart/render-output.ts

@@ -1,5 +1,4 @@
 import { useMemo } from "react";
-import type { DisplayCursorState } from "../core/pointer";
 import type { ComparisonChartProjection } from "../comparison/data";
 import {
   buildComparisonChartScene,
@@ -8,16 +7,14 @@ import {
   type ComparisonChartScene,
   type RenderComparisonChartResult,
 } from "../comparison/renderer";
-import type { ChartAxisMode, ChartMarketSession, ResolvedChartRenderer } from "../core/types";
+import type { ChartMarketSession, ResolvedChartRenderer } from "../core/types";
 
 type ComparisonChartColors = Parameters<typeof buildComparisonChartScene>[1]["colors"];
 
 interface UseComparisonChartRenderOutputOptions {
-  axisMode: ChartAxisMode;
   chartColors: ComparisonChartColors;
   chartHeight: number;
   chartWidth: number;
-  displayCursor: DisplayCursorState;
   displayCursorX: number | null;
   displayCursorY: number | null;
   effectiveRenderer: ResolvedChartRenderer;
@@ -34,22 +31,20 @@ interface UseComparisonChartRenderOutputResult {
   cursorRow: number | null;
   cursorTimeAxisColumn: number | null;
   cursorTimeAxisDate: Date | null;
-  displayScene: ComparisonChartScene;
+  displayScene: ComparisonChartScene | null;
   hasDisplayCursor: boolean;
   legendActiveIndex: number | null;
   result: RenderComparisonChartResult;
   staticResult: RenderComparisonChartResult;
-  staticScene: ComparisonChartScene;
+  staticScene: ComparisonChartScene | null;
   timeAxisLabel: string;
   visiblePriceRange: number | undefined;
 }
 
 export function useComparisonChartRenderOutput({
-  axisMode,
   chartColors,
   chartHeight,
   chartWidth,
-  displayCursor,
   displayCursorX,
   displayCursorY,
   effectiveRenderer,

package/src/components/chart/comparison-stock-chart/view.tsx

@@ -402,11 +402,9 @@ function ComparisonStockChartView({
     staticScene,
     timeAxisLabel,
   } = useComparisonChartRenderOutput({
-    axisMode,
     chartColors,
     chartHeight,
     chartWidth,
-    displayCursor,
     displayCursorX,
     displayCursorY,
     effectiveRenderer,

package/src/components/chart/core/index.test.ts

@@ -918,30 +918,6 @@ describe("renderChart", () => {
     }
   });
 
-  test("keeps the default area renderer stable", () => {
-    const projection = projectChartData(chartFixture, 12, undefined, false);
-    const result = renderChart(projection.points, {
-      width: 12,
-      height: 5,
-      showVolume: false,
-      volumeHeight: 0,
-      cursorX: null,
-      cursorY: null,
-      mode: projection.effectiveMode,
-      colors: palette,
-    });
-
-    expect(projection.requestedMode).toBe("area");
-    expect(projection.effectiveMode).toBe("area");
-    expect(textLines(result)).toEqual([
-      "⠁ ⡠⠔⢣ ⠁  ⠁  ",
-      "⠔⠊⣿⣿⠈⢆⠄  ⠄  ",
-      "⣿⣿⣿⣿⣿⠘⡄    ⡠",
-      "⣿⣿⣿⣿⣿⣿⠱⡀ ⢠⠊⣿",
-      "⣿⣿⣿⣿⣿⣿⣿⢣⠔⠁⣿⣿",
-    ]);
-  });
-
   test("formats y-axis labels as percent change when requested", () => {
     const projection = projectChartData(chartFixture, 12, "line", false);
     const result = renderChart(projection.points, {

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

@@ -2,20 +2,16 @@ import type { PixelBuffer } from "./types";
 import type { ProjectedChartPoint } from "./data";
 import { buildTimeAxis } from "./time-axis";
 import {
-  formatAxisCell,
   formatAxisValue,
-  formatCursorAxisValue,
   formatPriceWithCurrency,
   getAxisFractionDigitFloor,
   resolveAxisFractionDigits,
-  resolveChartAxisWidth,
 } from "./axis-format";
 import {
   bufferToBrailleLines,
   createPixelBuffer,
   drawCrosshair,
   drawGridLines,
-  drawLine,
   type StyledContent,
 } from "../rendering/pixel-buffer";
 import {

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

@@ -1,8 +1,6 @@
 import { describe, expect, test } from "bun:test";
 import {
   CHART_RESOLUTION_STEP_MS,
-  clampTimeRangeForResolution,
-  getActiveRangePreset,
   getBestSupportedResolutionForVisibleWindow,
   getExpandedBufferRange,
   getPresetResolution,
@@ -22,26 +20,11 @@ describe("chart-resolution", () => {
     expect(getPresetResolution("ALL")).toBe("1mo");
   });
 
-  test("derives the active range preset only for the exact reset preset pair", () => {
-    expect(getActiveRangePreset("1Y", "1d", 1, 0)).toBe("1Y");
-    expect(getActiveRangePreset("1Y", "auto", 1, 0)).toBeNull();
-    expect(getActiveRangePreset("1Y", "1d", 1.2, 0)).toBeNull();
-    expect(getActiveRangePreset("1Y", "1d", 1, 2)).toBeNull();
-  });
-
   test("checks whether a range preset is supported by the visible capability set", () => {
     expect(isRangePresetSupported("1Y", ["1d", "1wk"])).toBe(true);
     expect(isRangePresetSupported("ALL", ["1d", "1wk"])).toBe(false);
   });
 
-  test("clamps overly-wide ranges for manual intraday resolutions", () => {
-    expect(clampTimeRangeForResolution("5Y", "5m")).toBe("1W");
-    expect(clampTimeRangeForResolution("6M", "1h")).toBe("3M");
-    expect(clampTimeRangeForResolution("1M", "15m")).toBe("1M");
-    expect(clampTimeRangeForResolution("5Y", "1d")).toBe("5Y");
-    expect(clampTimeRangeForResolution("5Y", "auto")).toBe("5Y");
-  });
-
   test("expands buffers only toward wider supported ranges", () => {
     const support = new Map([
       ["1h", "3M"],

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

@@ -239,22 +239,6 @@ export function clampTimeRangeToMaxRange(range: TimeRange, maxRange: TimeRange):
   return isTimeRangeAtOrBelow(range, maxRange) ? range : maxRange;
 }
 
-export function clampTimeRangeForResolution(range: TimeRange, resolution: ChartResolution): TimeRange {
-  if (resolution === "auto") return range;
-  const maxRange = getSupportMaxRange(
-    normalizeChartResolutionSupport([{ resolution, maxRange: "ALL" }]),
-    resolution,
-  ) ?? "ALL";
-  const intrinsicMaxRange = resolution === "1m" || resolution === "5m"
-    ? "1W"
-    : resolution === "15m"
-      ? "1M"
-      : resolution === "30m" || resolution === "45m" || resolution === "1h"
-        ? "3M"
-        : "ALL";
-  return clampTimeRangeToMaxRange(range, minTimeRange(maxRange, intrinsicMaxRange));
-}
-
 export function isIntradayResolution(resolution: ManualChartResolution): boolean {
   return resolution === "1m"
     || resolution === "5m"
@@ -277,16 +261,6 @@ export function isRangePresetSupported(
   return maxRange !== null && isTimeRangeAtOrBelow(range, maxRange);
 }
 
-export function getActiveRangePreset(
-  range: TimeRange,
-  resolution: ChartResolution,
-  zoomLevel: number,
-  panOffset: number,
-): TimeRange | null {
-  if (zoomLevel !== 1 || panOffset !== 0) return null;
-  return RANGE_PRESET_RESOLUTION[range] === resolution ? range : null;
-}
-
 export function getWidestPresetForResolution(
   resolution: ManualChartResolution,
   maxRange: TimeRange,

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

@@ -3,10 +3,8 @@ import {
   applyBufferedPanExpansion,
   consumeScrollPanCellDelta,
   consumeScrollPanMovement,
-  getDragPanPointDelta,
   getDragPanWindowRatio,
   getKeyboardPanCellCount,
-  resolveDragPanOffset,
   resolveHorizontalScrollPanDirection,
 } from "./scroll";
 
@@ -34,11 +32,7 @@ describe("chart-scroll", () => {
 
   test("keeps keyboard pan small while matching drag to the visible window", () => {
     expect(getKeyboardPanCellCount(100)).toBe(2);
-    expect(getDragPanPointDelta(10, 100, 200)).toBe(20);
     expect(getDragPanWindowRatio(10, 100)).toBeCloseTo(0.1);
-    expect(resolveDragPanOffset(20, 10, 100, 200, 40)).toBe(40);
-    expect(resolveDragPanOffset(20, -10, 100, 200, 40)).toBe(0);
-    expect(resolveDragPanOffset(38, 10, 100, 200, 40)).toBe(40);
   });
 
   test("resolves wheel direction, cell delta, remainder, and ratio together", () => {

package/src/components/chart/core/scroll.ts

@@ -21,36 +21,14 @@ export interface ScrollPanMovement extends ScrollPanCellDelta {
   ratio: number;
 }
 
-function clamp(value: number, min: number, max: number): number {
-  return Math.max(min, Math.min(max, value));
-}
-
 export function getKeyboardPanCellCount(chartWidth: number): number {
   return Math.max(Math.round(chartWidth * KEYBOARD_PAN_WIDTH_RATIO), 1);
 }
 
-export function getDragPanPointDelta(deltaCells: number, chartWidth: number, visibleCount: number): number {
-  return Math.round((deltaCells / Math.max(chartWidth, 1)) * Math.max(visibleCount, 1) * DRAG_PAN_VISIBLE_RATIO);
-}
-
 export function getDragPanWindowRatio(deltaCells: number, chartWidth: number): number {
   return (deltaCells / Math.max(chartWidth, 1)) * DRAG_PAN_VISIBLE_RATIO;
 }
 
-export function resolveDragPanOffset(
-  startPanOffset: number,
-  deltaCells: number,
-  chartWidth: number,
-  visibleCount: number,
-  maxPanOffset: number,
-): number {
-  return clamp(
-    startPanOffset + getDragPanPointDelta(deltaCells, chartWidth, visibleCount),
-    0,
-    Math.max(maxPanOffset, 0),
-  );
-}
-
 export function consumeScrollPanCellDelta(
   chartWidth: number,
   delta: number | undefined,

package/src/components/chart/core/viewport.test.ts

@@ -1,28 +1,7 @@
 import { describe, expect, test } from "bun:test";
-import { getVisiblePointCount, RIGHT_EDGE_ANCHOR_RATIO, resolveAnchoredChartZoom } from "./viewport";
-
-describe("resolveAnchoredChartZoom", () => {
-  test("keeps keyboard zoom pinned to the latest data when anchored to the right edge", () => {
-    expect(resolveAnchoredChartZoom(252, 1, 0, 2, RIGHT_EDGE_ANCHOR_RATIO)).toEqual({
-      zoomLevel: 2,
-      panOffset: 0,
-    });
-  });
-
-  test("preserves the current right edge when zooming a panned view", () => {
-    expect(resolveAnchoredChartZoom(252, 2, 20, 3, RIGHT_EDGE_ANCHOR_RATIO)).toEqual({
-      zoomLevel: 3,
-      panOffset: 20,
-    });
-  });
-
-  test("still supports center-anchored zoom for pointer-driven interactions", () => {
-    expect(resolveAnchoredChartZoom(252, 1, 0, 2, 0.5)).toEqual({
-      zoomLevel: 2,
-      panOffset: 63,
-    });
-  });
+import { getVisiblePointCount } from "./viewport";
 
+describe("chart viewport", () => {
   test("allows zooming down to a two-point viewport", () => {
     expect(getVisiblePointCount(433, 1000)).toBe(2);
   });

package/src/components/chart/core/viewport.ts

@@ -22,30 +22,3 @@ export function getVisiblePointCount(totalPoints: number, zoomLevel: number): nu
   const clampedZoom = clampChartZoom(totalPoints, zoomLevel);
   return Math.min(totalPoints, Math.max(Math.floor(totalPoints / clampedZoom), MIN_VISIBLE_POINTS));
 }
-
-export function resolveAnchoredChartZoom(
-  totalPoints: number,
-  currentZoomLevel: number,
-  currentPanOffset: number,
-  nextZoomLevel: number,
-  anchorRatio: number,
-): { zoomLevel: number; panOffset: number } {
-  if (totalPoints <= 0) {
-    return { zoomLevel: 1, panOffset: 0 };
-  }
-
-  const clampedZoom = clampChartZoom(totalPoints, nextZoomLevel);
-  const currentVisibleCount = getVisiblePointCount(totalPoints, currentZoomLevel);
-  const nextVisibleCount = getVisiblePointCount(totalPoints, clampedZoom);
-  const currentPan = clamp(currentPanOffset, 0, Math.max(totalPoints - currentVisibleCount, 0));
-  const ratio = clamp(anchorRatio, 0, 1);
-  const anchorIndex = totalPoints - currentPan - currentVisibleCount + ratio * Math.max(currentVisibleCount - 1, 0);
-  const nextStart = Math.round(anchorIndex - ratio * Math.max(nextVisibleCount - 1, 0));
-  const clampedStart = clamp(nextStart, 0, Math.max(totalPoints - nextVisibleCount, 0));
-  const nextPanOffset = totalPoints - nextVisibleCount - clampedStart;
-
-  return {
-    zoomLevel: clampedZoom,
-    panOffset: clamp(nextPanOffset, 0, Math.max(totalPoints - nextVisibleCount, 0)),
-  };
-}

package/src/components/chart/market-session.ts

@@ -148,7 +148,7 @@ export function getChartMarketSessionKey(session: ChartMarketSession | null | un
 }
 
 export function resolveExtendedHoursBackgroundSpans(
-  values: readonly Array<Date | string | number>,
+  values: readonly (Date | string | number)[],
   session: ChartMarketSession | null | undefined,
 ): ChartSessionBackgroundSpan[] {
   if (!session) return [];

package/src/components/chart/native/surface/hooks.ts

@@ -71,8 +71,9 @@ export function useNativeChartSurfaceLifecycle({
 
   useEffect(() => {
     if (effectiveRenderer !== "kitty" || !nativeReady || !plotRef.current) return;
-    const plot = plotRef.current;
+    const plot = plotRef.current as BoxRenderable & { onLifecyclePass?: (() => void) | null };
     let mountTimer: ReturnType<typeof setTimeout> | null = null;
+    const previousLifecyclePass = plot.onLifecyclePass;
 
     const syncPlacement = () => {
       if (effectiveRenderer !== "kitty" || !nativeReady || !plotRef.current) return;
@@ -108,7 +109,11 @@ export function useNativeChartSurfaceLifecycle({
       );
     };
 
-    plot.onLifecyclePass = syncPlacement;
+    const lifecyclePass = () => {
+      previousLifecyclePass?.();
+      syncPlacement();
+    };
+    plot.onLifecyclePass = lifecyclePass;
     renderer.registerLifecyclePass(plot);
     syncPlacement();
     mountTimer = setTimeout(() => {
@@ -118,7 +123,9 @@ export function useNativeChartSurfaceLifecycle({
 
     return () => {
       if (mountTimer) clearTimeout(mountTimer);
-      plot.onLifecyclePass = null;
+      if (plot.onLifecyclePass === lifecyclePass) {
+        plot.onLifecyclePass = previousLifecyclePass;
+      }
       renderer.unregisterLifecyclePass(plot);
       lastGeometryRef.current = null;
     };