gloomberb 0.13.2 → 0.14.0

package/src/cli/result.ts

@@ -135,7 +135,9 @@ export function printCliResult<T, Row extends Record<string, unknown> = Record<s
 ): void {
   if (options.quiet && options.format === "text") return;
   const output = serializeCliResult(result, options, renderOptions);
-  if (output) console.log(output);
+  // Bun's console writer can truncate a large pipe write after stdout has been
+  // initialized. The stream queues the remaining bytes until the reader drains.
+  if (output) process.stdout.write(`${output}\n`);
 }
 
 export function serializeCliError(error: CliErrorObject, options: CliGlobalOptions): string {

package/src/cli.test.ts

@@ -1,4 +1,4 @@
-import { afterEach, describe, expect, test } from "bun:test";
+import { afterEach, describe, expect, spyOn, test } from "bun:test";
 import { mkdtemp, mkdir, rm, writeFile } from "fs/promises";
 import { join } from "path";
 import { tmpdir } from "os";
@@ -74,6 +74,11 @@ async function captureConsole<T>(fn: () => Promise<T> | T): Promise<{ result: T;
   const originalLog = console.log;
   const originalError = console.error;
 
+  const stdout = spyOn(process.stdout, "write").mockImplementation((chunk) => {
+    logs.push(String(chunk).replace(/\n$/, ""));
+    return true;
+  });
+
   console.log = (...args: unknown[]) => {
     logs.push(args.map(String).join(" "));
   };
@@ -91,6 +96,7 @@ async function captureConsole<T>(fn: () => Promise<T> | T): Promise<{ result: T;
   } finally {
     console.log = originalLog;
     console.error = originalError;
+    stdout.mockRestore();
   }
 }
 
@@ -101,6 +107,11 @@ async function captureConsoleFailure(fn: () => Promise<unknown> | unknown): Prom
   const originalError = console.error;
   const originalExitCode = process.exitCode;
 
+  const stdout = spyOn(process.stdout, "write").mockImplementation((chunk) => {
+    logs.push(String(chunk).replace(/\n$/, ""));
+    return true;
+  });
+
   console.log = (...args: unknown[]) => {
     logs.push(args.map(String).join(" "));
   };
@@ -123,6 +134,7 @@ async function captureConsoleFailure(fn: () => Promise<unknown> | unknown): Prom
     console.log = originalLog;
     console.error = originalError;
     process.exitCode = originalExitCode ?? 0;
+    stdout.mockRestore();
   }
 }
 
@@ -144,13 +156,10 @@ function makeTicker(overrides: Partial<TickerRecord["metadata"]> = {}): TickerRe
 }
 
 describe("CLI watchlist commands", () => {
-  test("help lists the prediction markets launcher", async () => {
+  test("help lists the core command sections", async () => {
     const { result, stdout } = await captureConsole(() => runCli(["help"]));
 
     expect(result).toBe(true);
-    expect(stdout).toContain("predictions [...]");
-    expect(stdout).toContain("Prediction Launch");
-    expect(stdout).toContain("gloomberb predictions world");
     expect(stdout).toContain("Portfolio Actions");
     expect(stdout).toContain("Watchlist Actions");
   });

package/src/components/chart/composite/axis-overlays.tsx

@@ -104,11 +104,13 @@ export function StaticXAxisLabels({
         ? visiblePositionedLabels.map((entry) => entry.label)
         : visibleLabels).join(" ")}
     >
-      {uiHost.kind === "desktop-web" && visiblePositionedLabels.length > 0 ? (
+      {visiblePositionedLabels.length > 0 && (uiHost.kind === "desktop-web" || visibleLabels.length === 0) ? (
         <Box position="absolute" left={0} top={0} width={width} height={1}>
           {visiblePositionedLabels.map((entry, index) => {
             const ratio = clampRatio(entry.ratio);
-            const edgeStyle = ratio <= 0
+            const edgeStyle = uiHost.kind !== "desktop-web"
+              ? { left: Math.max(0, Math.min(width - entry.label.length, markerColumn(ratio, width) - Math.floor(entry.label.length / 2))) }
+              : ratio <= 0
               ? { left: 0 }
               : ratio >= 1
                 ? { right: 0 }

package/src/components/chart/composite/column-layout.ts

@@ -53,7 +53,7 @@ function observedTimestamp(point: CompositeProjectedPoint): number | null {
 function annualBucket(point: CompositeProjectedPoint): FinancialPeriodBucket | null {
   const periodLabel = point.point.periodLabel?.trim();
   const timestamp = observedTimestamp(point);
-  if (!periodLabel || !/^FY\d{4}$/.test(periodLabel) || timestamp === null) return null;
+  if (!periodLabel || !/^(?:FY\d{4}|Year ended \d{4}-\d{2}-\d{2})$/.test(periodLabel) || timestamp === null) return null;
   const observedAt = new Date(timestamp);
   const observedYear = observedAt.getUTCFullYear();
   const cohortYear = observedAt.getUTCMonth() <= 1 ? observedYear - 1 : observedYear;
@@ -63,7 +63,7 @@ function annualBucket(point: CompositeProjectedPoint): FinancialPeriodBucket | n
 function quarterlyBucket(point: CompositeProjectedPoint): FinancialPeriodBucket | null {
   const periodLabel = point.point.periodLabel?.trim();
   const timestamp = observedTimestamp(point);
-  if (!periodLabel || !/^\d{4} Q[1-4]$/.test(periodLabel) || timestamp === null) return null;
+  if (!periodLabel || !/^(?:\d{4} Q[1-4]|Quarter ended \d{4}-\d{2}-\d{2})$/.test(periodLabel) || timestamp === null) return null;
 
   const observedYear = new Date(timestamp).getUTCFullYear();
   let nearest: { year: number; quarter: number; distance: number } | null = null;

package/src/components/chart/composite/composite-chart.test.tsx

@@ -435,6 +435,69 @@ describe("CompositeChart", () => {
     expect(accessoryStart - lastLegendEnd).toBeGreaterThan(1);
   });
 
+  test("shortens long comparison names before clipping yield precision or units at 80 columns", async () => {
+    testSetup = await testRender(
+      <CompositeChart width={78} height={12}
+        series={[
+          { ...series("ig", "main", "left", "%", [5.68]), label: "ICE BofA US Corporate Index Effective Yield" },
+          { ...series("hy", "main", "left", "%", [7.42]), label: "ICE BofA US High Yield Index Effective Yield" },
+        ]}
+        panels={[{ id: "main" }]}
+        legendAccessory={<Box width={14} height={1}><Text>+ add series</Text></Box>}
+        legendAccessoryWidth={14}
+      />, { width: 80, height: 14 },
+    );
+    await act(async () => { await testSetup!.renderOnce(); await testSetup!.renderOnce(); });
+    const legend = testSetup.captureCharFrame().split("\n").find((line) => line.includes("+ add series"))!;
+    expect(legend).toContain("5.68%");
+    expect(legend).toContain("7.42%");
+    expect(legend.indexOf("7.42%") + 5).toBeLessThan(legend.indexOf("+ add series"));
+  });
+
+  test("leaving a historical chart restores its window's legend value instead of the navigation buffer", async () => {
+    let setCursor: (date: Date | null) => void = () => {};
+    const margin: ResolvedSeries = {
+      ...series("margin", "main", "left", "%", []), label: "MSFT Operating Margin",
+      style: "line", interpolation: "none",
+      points: [point("2024-06-30", 44.64), point("2025-06-30", 45.62), point("2026-06-30", 46.78)],
+    };
+    function HistoricalChart() {
+      const [cursor, updateCursor] = useState<Date | null>(null);
+      setCursor = updateCursor;
+      return <CompositeChart width={100} height={12} panels={[{ id: "main" }]} series={[margin]} clipToViewport
+        viewport={{ start: new Date("2016-01-01"), end: new Date("2025-12-31T23:59:59.999Z") }} cursorDate={cursor} />;
+    }
+    testSetup = await testRender(<HistoricalChart />, { width: 102, height: 14 });
+    await act(async () => { await testSetup!.renderOnce(); await testSetup!.renderOnce(); });
+    const legend = () => testSetup!.captureCharFrame().split("\n")[0]!;
+    expect(legend()).toContain("45.6%");
+    expect(legend()).not.toContain("46.8%");
+    await act(async () => { setCursor(new Date("2024-06-30")); });
+    await act(async () => { await testSetup!.renderOnce(); });
+    expect(legend()).toContain("44.6%");
+    await act(async () => { setCursor(null); });
+    await act(async () => { await testSetup!.renderOnce(); });
+    expect(legend()).toContain("45.6%");
+    expect(legend()).not.toContain("46.8%");
+  });
+
+  test("retains financial values and negative signs when long legend names need truncation", async () => {
+    testSetup = await testRender(
+      <CompositeChart width={100} height={12} panels={[{ id: "main" }]} series={[
+        { ...series("revenue", "main", "left", "USD", [90_007_000_000]), label: "MSFT:XNAS Revenue", unitGroup: "currency-total:USD" },
+        { ...series("margin", "main", "right", "%", [-49.612]), label: "Very long issuer Operating Margin", unitGroup: "percent" },
+        { ...series("hk-revenue", "main", "left", "USD", [90_007_000_000]), label: "腾讯控股腾讯控股 Revenue", unitGroup: "currency-total:USD" },
+      ]} />,
+      { width: 102, height: 14 },
+    );
+    await act(async () => { await testSetup!.renderOnce(); await testSetup!.renderOnce(); });
+    const legend = testSetup.captureCharFrame().split("\n")[0]!;
+    expect(legend).toContain("MSFT:XNAS Revenue $90.01B");
+    expect(legend).toContain("... -49.6%");
+    expect(legend).toContain("腾讯控股腾讯控股");
+    expect(legend.match(/\$90\.01B/g)).toHaveLength(2);
+  });
+
   test("keeps non-plotted legend series available for restoring", async () => {
     const price = series("price", "main", "left", "USD", [100, 103, 101]);
     const hiddenRevenue = series("revenue", "main", "right", "%", [4, 6, 8]);
@@ -1233,9 +1296,11 @@ describe("CompositeChart", () => {
     await act(async () => testSetup!.renderOnce());
 
     // Pressing the ruler icon has to arm the tool for an unmodified drag.
+    const toolbarRow = testSetup.captureCharFrame().split("\n").findIndex((line) => line.includes("↔"));
+    const rulerX = testSetup.captureCharFrame().split("\n")[toolbarRow]!.indexOf("↔");
     await act(async () => {
-      await testSetup!.mockMouse.moveTo(11, 1);
-      await testSetup!.mockMouse.click(11, 1);
+      await testSetup!.mockMouse.moveTo(rulerX, toolbarRow);
+      await testSetup!.mockMouse.click(rulerX, toolbarRow);
     });
     await act(async () => testSetup!.renderOnce());
     await act(async () => {
@@ -1247,7 +1312,7 @@ describe("CompositeChart", () => {
 
     await act(async () => {
       capturedSurfaceProps!.onMouseUp(pointerEvent(30, 2));
-      await testSetup!.mockMouse.click(11, 1);
+      await testSetup!.mockMouse.click(rulerX, toolbarRow);
     });
     await act(async () => testSetup!.renderOnce());
     await act(async () => {
@@ -1423,6 +1488,98 @@ describe("CompositeChart", () => {
     expect(frame).toContain("────────");
   });
 
+  test.each([
+    ["USD", "currency-total:USD", 90_007_000_000, "$90.01B"],
+    ["EUR", "currency-total:EUR", -12_345_600_000, "€-12.35B"],
+    ["CAD", "currency-total:CAD", 123_456_000, "123.46M CAD"],
+    ["USD", "price:USD", 1_234_567.89, "$1,234,567.89"],
+    ["USD", "price:USD", 0.0123, "$0.0123"],
+    ["USD", "price:USD", 1e30, "…"],
+  ] as const)("renders a complete cursor marker for %s %s %s", async (unit, unitGroup, value, label) => {
+    testSetup = await testRender(
+      <CaptureChartSurfaceProvider>
+        <CompositeChart
+          width={60}
+          height={12}
+          showLegend={false}
+          series={[{
+            ...series("price", "main", "left", unit, [value * 0.8, value, value * 1.2]),
+            unitGroup,
+          }]}
+          panels={[{ id: "main" }]}
+          cursorDate={new Date("2025-01-02T00:00:00.000Z")}
+        />
+      </CaptureChartSurfaceProvider>,
+      { width: 62, height: 14 },
+    );
+    await act(async () => testSetup!.renderOnce());
+    expect(testSetup.captureCharFrame()).toContain(label);
+    expect(capturedSurfaceNode!.width).toBeGreaterThanOrEqual(30);
+  });
+
+  test("static overview charts reserve the complete tiny-price marker without losing the plot", async () => {
+    testSetup = await testRender(
+      <CaptureChartSurfaceProvider>
+        <CompositeChart width={60} height={12} showLegend={false} interactive={false}
+          series={[{ ...series("price", "main", "right", "USD", [0.000005, 0.0000051, 0.00000526]), unitGroup: "price:USD", timeBasis: { kind: "market", timeZone: "UTC" } }]}
+          panels={[{ id: "main" }]} />
+      </CaptureChartSurfaceProvider>,
+      { width: 62, height: 14 },
+    );
+    await act(async () => testSetup!.renderOnce());
+    expect(testSetup.captureCharFrame()).toContain("$0.00000526");
+    expect(capturedSurfaceNode!.width).toBeGreaterThanOrEqual(30);
+  });
+
+  test("preserves integer-domain cursor decimals without moving the plot and honors hidden axes", async () => {
+    let setAxisWidth: ((value: number) => void) | null = null;
+    function Harness() {
+      const [axisWidth, setWidth] = useState(9);
+      setAxisWidth = setWidth;
+      return <CaptureChartSurfaceProvider>
+        <CompositeChart width={60} height={12} showLegend={false} axisWidth={axisWidth}
+          series={[series("price", "main", "left", "USD", [100, 200, 100])]}
+          panels={[{ id: "main" }]}
+        />
+      </CaptureChartSurfaceProvider>;
+    }
+    testSetup = await testRender(<Harness />, { width: 62, height: 14 });
+    await act(async () => testSetup!.renderOnce());
+    const plotWidth = capturedSurfaceNode!.width as number;
+    const plotHeight = capturedSurfaceNode!.height as number;
+    await act(async () => capturedSurfaceProps!.onMouseMove(pointerEvent(
+      (plotWidth - 1) / 2, (plotHeight - 1) * 0.4975,
+    )));
+    await act(async () => testSetup!.renderOnce());
+    expect(testSetup.captureCharFrame()).toContain("$150.28");
+    expect(capturedSurfaceNode!.width).toBe(plotWidth);
+    await act(async () => setAxisWidth?.(0));
+    await act(async () => testSetup!.renderOnce());
+    expect(capturedSurfaceNode!.width).toBe(60);
+    expect(testSetup.captureCharFrame()).not.toContain("$");
+  });
+
+  test("keeps the requested window while older cached observations partially overlap it", async () => {
+    testSetup = await testRender(
+      <CompositeChart
+        width={90}
+        height={14}
+        series={[{
+          ...series("price", "main", "left", "USD", []),
+          points: [point("2026-07-31", 100), point("2026-08-15", 110), point("2026-08-31", 105)],
+        }]}
+        panels={[{ id: "main" }]}
+        viewport={{ start: new Date("2026-08-10"), end: new Date("2026-09-10") }}
+      />,
+      { width: 92, height: 16 },
+    );
+    await act(async () => testSetup!.renderOnce());
+    const frame = testSetup.captureCharFrame();
+    expect(frame).toContain("Aug 10");
+    expect(frame).toContain("Sep 10");
+    expect(frame).not.toContain("Jul 31");
+  });
+
   test("zooms around the mouse pointer with control-wheel", async () => {
     testSetup = await testRender(
       <CaptureChartSurfaceProvider>
@@ -1603,6 +1760,7 @@ describe("CompositeChart", () => {
 
   test("keeps the date axis and mouse recovery when refreshed data misses the zoomed window", async () => {
     let replacePoints: ((points: TimeSeriesPoint[]) => void) | null = null;
+    let lastWindow: { start: Date; end: Date } | null = null;
     function Harness() {
       const [points, setPoints] = useState(
         series("price", "main", "left", "USD", [100, 101, 102, 103, 104, 105, 106, 107, 108]).points,
@@ -1622,6 +1780,7 @@ describe("CompositeChart", () => {
             start: new Date("2025-01-01T00:00:00.000Z"),
             end: new Date("2025-01-09T00:00:00.000Z"),
           }}
+          onViewportChange={(next) => { lastWindow = next; }}
         />
       );
     }
@@ -1652,8 +1811,6 @@ describe("CompositeChart", () => {
     });
     await act(async () => testSetup!.renderOnce());
 
-    // An observation-free window keeps the chart frame and its axes; only the
-    // plotted points go away.
     // An observation-free window keeps the chart frame and its axes; only the
     // plotted points go away.
     const emptyFrame = testSetup.captureCharFrame();
@@ -1673,8 +1830,8 @@ describe("CompositeChart", () => {
 
     const recoveredFrame = testSetup.captureCharFrame();
     expect(recoveredFrame).toContain("•");
-    expect(recoveredFrame).toContain("2025-01-01");
-    expect(recoveredFrame).toContain("Jan 9");
+    expect(lastWindow!.start.getTime()).toBeLessThanOrEqual(Date.parse("2025-01-01"));
+    expect(lastWindow!.end.getTime()).toBeGreaterThanOrEqual(Date.parse("2025-01-09"));
   });
 
   test("restores persisted drawings from pane settings on mount", async () => {

package/src/components/chart/composite/composite-chart.tsx

@@ -1,5 +1,6 @@
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import {
+  AsciiText,
   Box,
   ChartSurface,
   ScrollBox,
@@ -15,9 +16,9 @@ import { useShortcut } from "../../../react/input";
 import { useOptionalPaneInstanceId, usePaneSettingValue } from "../../../state/app/context";
 import { colors as themeColors, hoverBg } from "../../../theme/colors";
 import { useThemeColors } from "../../../theme/theme-context";
-import { formatPercentRaw } from "../../../utils/format";
+import { displayWidth, formatPercentRaw, truncateToDisplayWidth } from "../../../utils/format";
 import { isPlainKey } from "../../../utils/keyboard";
-import { truncateWithEllipsis } from "../../../utils/text-wrap";
+import { CHART_WATERMARK_ROLE } from "../../../utils/screenshot-watermark";
 import type { ResolvedSeries } from "../../../time-series/types";
 import { downsampleCompositeChartScene } from "./downsample";
 import { reuseResolvedSeriesList } from "./panel-series";
@@ -54,7 +55,6 @@ import {
   COMPOSITE_KEYBOARD_PAN_RATIO,
   COMPOSITE_ZOOM_STEP_FACTOR,
   buildCompositeNavigationFrame,
-  clampCompositeViewport,
   compositeNavigationDataViewport,
   compositeViewportPositions,
   fitCompositeViewport,
@@ -362,16 +362,31 @@ function cursorAxisLabel(
 const MINIMUM_AXIS_LABEL_WIDTH = 3;
 
 /**
- * Cells the gutter needs for its own labels. Ticks cover the axis itself, and a
- * mid-domain sample covers the wider cursor readout that lands between them.
+ * Reserve cursor precision even when the tick values are round numbers. This
+ * keeps the plot stable while the pointer moves between integer tick values.
  */
 function compositeAxisLabelWidth(
   domain: CompositeAxisDomain | undefined,
-  format: CompositeAxisValueFormatter = formatCompositeAxisValue,
+  format: CompositeAxisValueFormatter | undefined,
+  includeCursor: boolean,
 ): number {
   if (!domain) return 0;
-  const labels = compositeAxisTicks(domain, 3, format).map((tick) => tick.label);
-  labels.push(format((domain.min + domain.max) / 2, domain));
+  const ticks = compositeAxisTicks(domain, 3, format);
+  const labels = ticks.map((tick) => tick.label);
+  if (includeCursor) {
+    const cursorFormat = format ?? formatCompositeCursorValue;
+    for (const { value } of ticks) {
+      labels.push(cursorFormat(value, domain));
+      // Totals use two decimals at their compact scale; prices can use four
+      // below one currency unit. Probe those digits without changing the data.
+      const scale = domain.unitGroup.toLowerCase().split(":")[0] === "currency-total"
+        ? 10 ** Math.max(0, Math.min(12, Math.floor(Math.log10(Math.abs(value) || 1) / 3) * 3))
+        : Math.abs(value) > 0 && Math.abs(value) < 0.01
+          ? 10 ** Math.floor(Math.log10(Math.abs(value))) : 1;
+      const precisionValue = (value < 0 ? -1 : 1) * (Math.floor(Math.abs(value) / scale) + 0.1234) * scale;
+      labels.push(cursorFormat(precisionValue, domain));
+    }
+  }
   return labels.reduce((widest, label) => Math.max(widest, [...label].length), 0);
 }
 
@@ -448,6 +463,24 @@ const ARMED_TOOL_BY_INTERACTION = {
 
 const COMPOSITE_PANEL_ROLE = "composite-chart-panel";
 
+// Wordmark cell grid at scale 1 (27 columns of 8px, 4 rows of 12px).
+const WATERMARK_BASE_WIDTH_PX = 216;
+const WATERMARK_BASE_HEIGHT_PX = 48;
+
+/**
+ * Size the screenshot wordmark to roughly half the plot width, capped so it
+ * stays a mark rather than a poster. Plots too small for a legible mark get
+ * none: a clipped wordmark reads as a glitch.
+ */
+export function chartWatermarkScale(plotWidthPx: number, plotHeightPx: number): number | null {
+  const scale = Math.min(
+    (plotWidthPx * 0.5) / WATERMARK_BASE_WIDTH_PX,
+    (plotHeightPx * 0.4) / WATERMARK_BASE_HEIGHT_PX,
+    3,
+  );
+  return scale >= 1 ? Math.round(scale * 4) / 4 : null;
+}
+
 let nextDrawingSequence = 1;
 
 function nextDrawingId(): string {
@@ -788,7 +821,11 @@ function CompositePanelSurface({
         endValue,
         startTime,
         endTime,
-        bars: countMeasureBars(scene.dates, startTime, endTime),
+        // Cross-market cursor stops include every listing's observations;
+        // measured bars still follow the primary market's session scale.
+        bars: countMeasureBars(scene.timeScale.kind === "market"
+          ? scene.timeScale.anchors.map(({ timestamp }) => new Date(timestamp))
+          : scene.dates, startTime, endTime),
         domain: measureDomain,
       }),
       startValueLabel: measureDomain && startValue !== null
@@ -1361,25 +1398,35 @@ function CompositeLegend({
         && Number.isFinite(entry.latestChangePercent)
       ? ` ${formatPercentRaw(entry.latestChangePercent)}`
       : "";
-    const fullText = entry.points.length === 0
-      ? `${entry.label}${entry.hidden ? "" : " no data"}`
-      : `${entry.label} ${legendValue(
+    const valueText = entry.points.length === 0
+      ? entry.hidden ? "" : "no data"
+      : `${legendValue(
         entry,
         cursorValue?.value ?? null,
         formatValue,
       )}${changeText}`;
+    const fullText = [entry.label, valueText].filter(Boolean).join(" ");
     const details = formatCompositePointDetails(cursorValue?.point);
-    const tooltip = details ? `${fullText} · ${details}` : fullText;
-    const textWidth = Math.max(1, Math.min(30, [...fullText].length));
+    const exactTotal = entry.unitGroup.split(":")[0] === "currency-total"
+      && cursorValue?.value != null && Number.isFinite(cursorValue.value)
+      ? `Value ${cursorValue.value} ${entry.unit}` : "";
+    const tooltip = [fullText, exactTotal, details].filter(Boolean).join(" · ");
+    // Keep the value (including its sign/unit) intact. Long names may shorten;
+    // oversized values remain reachable through the scrollable legend.
+    const labelWidth = Math.max(0, 30 - (valueText ? displayWidth(valueText) + 1 : 0));
+    const text = [truncateToDisplayWidth(entry.label, labelWidth), valueText].filter(Boolean).join(" ");
+    const textWidth = Math.max(1, displayWidth(text));
     return {
       entry,
-      text: truncateWithEllipsis(fullText, textWidth),
+      text,
       width: textWidth + 2,
+      labelWidth,
+      valueText,
       toggleable,
       tooltip,
     };
   });
-  const desiredSeriesWidth = entries.reduce(
+  let desiredSeriesWidth = entries.reduce(
     (total, entry, index) => total + entry.width + (index > 0 ? 1 : 0),
     0,
   );
@@ -1389,6 +1436,27 @@ function CompositeLegend({
   const reservedAccessoryGap = accessory && width > resolvedAccessoryWidth ? 1 : 0;
   // The cursor date lives on the time axis, where the crosshair points at it.
   const widthBeforeAccessory = Math.max(0, width - resolvedAccessoryWidth - reservedAccessoryGap);
+  // A slightly overflowing row should shorten names before hiding a value's
+  // final digits/unit under the accessory. Keep a readable name fragment; if
+  // the full row cannot fit even then, retain its existing scrollable layout.
+  const minimumSeriesWidth = entries.reduce((total, entry, index) => {
+    const text = [truncateToDisplayWidth(entry.entry.label, Math.min(8, entry.labelWidth)), entry.valueText]
+      .filter(Boolean).join(" ");
+    return total + Math.max(1, displayWidth(text)) + 2 + (index > 0 ? 1 : 0);
+  }, 0);
+  if (minimumSeriesWidth <= widthBeforeAccessory) {
+    while (desiredSeriesWidth > widthBeforeAccessory) {
+      const shrinkable = entries.filter((entry) => entry.labelWidth > 8)
+        .sort((left, right) => right.labelWidth - left.labelWidth)[0];
+      if (!shrinkable) break;
+      const previousWidth = shrinkable.width;
+      shrinkable.labelWidth -= 1;
+      shrinkable.text = [truncateToDisplayWidth(shrinkable.entry.label, shrinkable.labelWidth), shrinkable.valueText]
+        .filter(Boolean).join(" ");
+      shrinkable.width = Math.max(1, displayWidth(shrinkable.text)) + 2;
+      desiredSeriesWidth -= previousWidth - shrinkable.width;
+    }
+  }
   const seriesWidth = Math.min(desiredSeriesWidth, widthBeforeAccessory);
   const accessorySpacerWidth = accessory
     ? Math.max(reservedAccessoryGap, width - seriesWidth - resolvedAccessoryWidth)
@@ -1594,6 +1662,7 @@ export function CompositeChart({
   focused = false,
   cursorDate,
   viewport,
+  clipToViewport = false,
   viewportResetKey,
   colors,
   interactive = true,
@@ -1617,7 +1686,7 @@ export function CompositeChart({
   isSeriesToggleable,
 }: CompositeChartProps) {
   const activeThemeColors = useThemeColors();
-  const { cellWidthPx = 8, pixelRatio = 1 } = useUiCapabilities();
+  const { cellWidthPx = 8, cellHeightPx = 18, pixelRatio = 1 } = useUiCapabilities();
   const isDesktopWeb = useUiHost().kind === "desktop-web";
   const showTextFallback = useShowChartTextFallback();
   const [internalCursorDate, setInternalCursorDate] = useState<Date | null>(null);
@@ -1709,10 +1778,12 @@ export function CompositeChart({
     [allowHistoricalBackfill, marketTimelineSeries, visibleSeries],
   );
   const authoredViewport = useMemo(() => {
-    if (!navigationFrame) return viewport ?? null;
-    return viewport
-      ? clampCompositeViewport(navigationFrame, viewport)
-      : compositeNavigationDataViewport(navigationFrame);
+    // The requested dates own the axis, including gaps in a cached or partial
+    // response. Fitting them to available observations silently changes the
+    // research period. User pan/zoom gestures retain their navigation limits.
+    if (viewport && Number.isFinite(viewport.start.getTime())
+      && Number.isFinite(viewport.end.getTime()) && viewport.start <= viewport.end) return viewport;
+    return navigationFrame ? compositeNavigationDataViewport(navigationFrame) : null;
   }, [navigationFrame, viewport]);
   const activeUserViewport = authoredViewportChanged ? null : userViewport;
   const effectiveViewport = activeUserViewport ?? authoredViewport;
@@ -1828,10 +1899,12 @@ export function CompositeChart({
       width: 1,
       height: Math.max(panelCount, 1),
       viewport: effectiveViewport ?? undefined,
+      clipToViewport,
       timelineSeries: marketTimelineSeries,
       rightOffsetRatio,
     });
   }, [
+    clipToViewport,
     effectiveViewport,
     lastTickKey,
     marketTimelineSeries,
@@ -1853,22 +1926,33 @@ export function CompositeChart({
   const maximumAxisWidth = Math.max(0, Math.floor(axisWidth));
   // Gutters follow their labels. A fixed budget left dead space beside short
   // prices, which costs plot width on every chart that does not need it.
-  const resolvedAxisWidth = useMemo(() => Math.min(
-    maximumAxisWidth,
+  const axisCount = Number(hasLeftAxis) + Number(hasRightAxis);
+  // Keep at least half the chart (and 12 cells on small charts) for the plot.
+  const minimumPlotWidth = Math.min(totalWidth, Math.max(12, Math.floor(totalWidth / 2)));
+  const availableAxisWidth = axisCount > 0
+    ? Math.max(0, Math.floor((totalWidth - minimumPlotWidth) / axisCount) - 1)
+    : 0;
+  // Static overview charts also pin the latest price with cursor precision.
+  const includeCursorLabels = interactive || cursorDate !== undefined || !!scenePanels?.some((panel) => panel.lastPrice);
+  const resolvedAxisWidth = useMemo(() => maximumAxisWidth === 0 ? 0 : Math.min(
+    availableAxisWidth,
     Math.max(
-      MINIMUM_AXIS_LABEL_WIDTH,
+      Math.min(MINIMUM_AXIS_LABEL_WIDTH, maximumAxisWidth),
       ...(projectedScene?.panels ?? []).flatMap((panel) => [
-        compositeAxisLabelWidth(panel.axes.left, formatAxisValue),
-        compositeAxisLabelWidth(panel.axes.right, formatAxisValue),
-      ]),
+        compositeAxisLabelWidth(panel.axes.left, formatAxisValue, includeCursorLabels),
+        compositeAxisLabelWidth(panel.axes.right, formatAxisValue, includeCursorLabels),
+      ]).map((width) => includeCursorLabels ? width : Math.min(width, maximumAxisWidth)),
     ),
-  ), [formatAxisValue, maximumAxisWidth, projectedScene]);
+  ), [availableAxisWidth, formatAxisValue, includeCursorLabels, maximumAxisWidth, projectedScene]);
   const leftAxisWidth = hasLeftAxis ? resolvedAxisWidth : 0;
   const rightAxisWidth = hasRightAxis ? resolvedAxisWidth : 0;
   const axisGap = resolvedAxisWidth > 0 ? 1 : 0;
   const horizontalReserved = leftAxisWidth + rightAxisWidth
     + axisGap * ((leftAxisWidth ? 1 : 0) + (rightAxisWidth ? 1 : 0));
   const plotWidth = Math.max(1, totalWidth - horizontalReserved);
+  const watermarkScale = isDesktopWeb
+    ? chartWatermarkScale(plotWidth * cellWidthPx, plotHeight * cellHeightPx)
+    : null;
   const downsampleWidth = Math.max(
     1,
     Math.round(plotWidth * cellWidthPx * Math.max(1, pixelRatio)),
@@ -2231,6 +2315,23 @@ export function CompositeChart({
           showTextFallback={showTextFallback}
         />
       ))}
+      {watermarkScale ? (
+        // Hidden until a screenshot reveals it (see utils/screenshot-watermark).
+        // Above the opaque bitmaps, below drawings, crosshair and readouts.
+        <Box
+          position="absolute"
+          left={leftPadding}
+          top={legendRows}
+          width={plotWidth}
+          height={plotHeight}
+          zIndex={5}
+          alignItems="center"
+          justifyContent="center"
+          data-gloom-role={CHART_WATERMARK_ROLE}
+        >
+          <AsciiText text="Gloomberb" font="wordmark" scale={watermarkScale} color={resolvedColors.textDim} />
+        </Box>
+      ) : null}
       {xMarkers.length > 0 ? (
         <Box
           position="absolute"
@@ -2253,8 +2354,8 @@ export function CompositeChart({
         <Box flexDirection="row" width={totalWidth} height={1}>
           {leftPadding > 0 ? <Box width={leftPadding} /> : null}
           <StaticXAxisLabels
-            labels={xAxis?.labels ? [...xAxis.labels] : [timeAxisLayout.text]}
-            positionedLabels={xAxis?.labels ? undefined : timeAxisLayout.ticks}
+            labels={xAxis?.ticks ? [] : xAxis?.labels ? [...xAxis.labels] : [timeAxisLayout.text]}
+            positionedLabels={xAxis?.ticks ?? (xAxis?.labels ? undefined : timeAxisLayout.ticks)}
             width={plotWidth}
             color={resolvedColors.textDim}
             cursorColumn={timeAxisCursorColumn}