gloomberb 0.18.3 → 0.18.5

package/src/components/chart/composite/interactions.ts

@@ -31,8 +31,13 @@ export type CompositeChartInteraction =
 
 export const COMPOSITE_ZOOM_STEP_FACTOR = 1.2;
 export const COMPOSITE_KEYBOARD_PAN_RATIO = 0.02;
-/** Pixels of trackpad or wheel travel that zoom the viewport by a factor of e. */
-const WHEEL_ZOOM_PIXELS_PER_E = 160;
+/**
+ * Pixels of trackpad or wheel travel that zoom the viewport by a factor of e.
+ * Chromium sends a trackpad pinch as Ctrl+wheel with `deltaY = -100 ln(scale)`
+ * (the desktop host turns WebKit's pinch into the same), so at 100 the bars
+ * follow the fingers.
+ */
+const WHEEL_ZOOM_PIXELS_PER_E = 100;
 /** Bound on one wheel event so a coarse mouse notch cannot zoom by more than this. */
 const WHEEL_ZOOM_STEP_LIMIT = 1.5;
 

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

@@ -14,6 +14,7 @@ import {
 } from "./format";
 import type { CompositeChartProps, CompositeChartScene } from "./types";
 import { seriesCueCssBackground, type SeriesLineCue } from "./series-cues";
+import { DisclosureMarker } from "../../ui/disclosure-marker";
 
 const LEGEND_WHEEL_DELTA_PER_CELL = 8;
 const NO_LINE_CUES: ReadonlyMap<string, SeriesLineCue> = new Map();
@@ -157,7 +158,7 @@ function CompositeSeriesSwatch({ series, cue, filled = true }: {
 
 export function CompositeLegend({
   scene,
-  series,
+  series: allSeries,
   visibleSeriesIds,
   lineCues = NO_LINE_CUES,
   cellPlot = false,
@@ -172,6 +173,8 @@ export function CompositeLegend({
   keyboardIndex,
   rows = 1,
   onWantedRowsChange,
+  collapsed = false,
+  onToggleCollapsed,
 }: {
   scene: CompositeChartScene | null;
   series: ResolvedSeries[];
@@ -193,8 +196,15 @@ export function CompositeLegend({
   rows?: number;
   /** The lines the legend needs to show every entry whole, told while no cursor moves the values. */
   onWantedRowsChange?: (rows: number) => void;
+  /** Folded to its first series and a count of the rest, which a press opens. */
+  collapsed?: boolean;
+  /** Folds or opens the legend: a chevron in its inset, shown under the pointer while it is open. */
+  onToggleCollapsed?: () => void;
 }) {
   const isDesktopWeb = useUiCapabilities().nativePaneChrome === true;
+  // Folded, the legend keeps its first series; the rest wait behind a count.
+  const foldedCount = collapsed ? Math.max(0, allSeries.length - 1) : 0;
+  const series = foldedCount > 0 ? allSeries.slice(0, 1) : allSeries;
   const scrollRef = useRef<ScrollBoxRenderable | null>(null);
   const cursorValueById = new Map(
     scene?.cursorValues.map((entry) => [entry.seriesId, entry] as const) ?? [],
@@ -280,8 +290,10 @@ export function CompositeLegend({
     ? Math.max(1, Math.min(innerWidth, Math.floor(accessoryWidth ?? 14)))
     : 0;
   const reservedAccessoryGap = accessory && innerWidth > resolvedAccessoryWidth ? 1 : 0;
+  const foldedText = foldedCount > 0 ? `+${foldedCount}` : null;
+  const foldedWidth = foldedText ? displayWidth(foldedText) + 1 : 0;
   // The cursor date lives on the time axis, where the crosshair points at it.
-  const widthBeforeAccessory = Math.max(0, innerWidth - resolvedAccessoryWidth - reservedAccessoryGap);
+  const widthBeforeAccessory = Math.max(0, innerWidth - resolvedAccessoryWidth - reservedAccessoryGap - foldedWidth);
   // Names get the room the row has. When it overflows, the widest name
   // shortens first: its listing exchange goes before any of the name is cut.
   // The value (including its sign/unit) always stays intact. If the row cannot
@@ -348,7 +360,7 @@ export function CompositeLegend({
   const desiredSeriesWidth = lines ? lineWidth(lines.at(-1)!) : measureSeriesWidth();
   const seriesWidth = lines ? widthBeforeAccessory : Math.min(desiredSeriesWidth, widthBeforeAccessory);
   const accessorySpacerWidth = accessory
-    ? Math.max(reservedAccessoryGap, innerWidth - seriesWidth - resolvedAccessoryWidth)
+    ? Math.max(reservedAccessoryGap, innerWidth - seriesWidth - foldedWidth - resolvedAccessoryWidth)
     : 0;
   const keyboardEntryStart = keyboardIndex === null || keyboardIndex === undefined || lines
     ? null
@@ -471,6 +483,13 @@ export function CompositeLegend({
     </ScrollBox>
   );
   const lineCount = lines?.length ?? 1;
+  const foldLabel = foldedCount > 0
+    ? `Show ${foldedCount} more series (Shift+L)`
+    : "Collapse the legend to its first series (Shift+L)";
+  const pressFold = (event: ChartMouseEvent) => {
+    consumeChartMouseEvent(event);
+    onToggleCollapsed?.();
+  };
   return (
     <Box
       flexDirection="row"
@@ -478,11 +497,41 @@ export function CompositeLegend({
       width={width}
       height={lineCount}
       paddingLeft={inset}
+      position="relative"
       overflow="visible"
       // Accessory dropdowns must escape above the sibling drawing toolbar.
       zIndex={accessory ? 40 : 20}
       data-gloom-role="composite-chart-legend"
+      data-gloom-reveal-scope="true"
+      data-collapsed={foldedCount > 0 ? "true" : undefined}
     >
+      {/* The chevron sits in the inset, so it moves nothing: folded it always
+          shows, open it shows under the pointer (the terminal has Shift+L). */}
+      {onToggleCollapsed && inset > 0 && (foldedCount > 0 || isDesktopWeb) ? (
+        <Box
+          position="absolute"
+          left={0}
+          top={0}
+          width={inset}
+          height={1}
+          zIndex={22}
+          alignItems="center"
+          justifyContent="center"
+          hoverBackgroundColor={hoverBg()}
+          onMouseDown={pressFold}
+          cursor="pointer"
+          data-gloom-interactive="true"
+          data-gloom-role="composite-chart-legend-toggle"
+          data-gloom-label={foldLabel}
+          data-gloom-reveal={foldedCount > 0 ? undefined : "hover"}
+          title={isDesktopWeb ? foldLabel : undefined}
+          role={isDesktopWeb ? "button" : undefined}
+          aria-label={isDesktopWeb ? foldLabel : undefined}
+          aria-expanded={isDesktopWeb ? foldedCount === 0 : undefined}
+        >
+          <DisclosureMarker expanded={foldedCount === 0} color={themeColors.textDim} />
+        </Box>
+      ) : null}
       {valueDates.lead ? (
         <Box width={leadWidth} height={1} flexShrink={0} data-gloom-role="composite-chart-legend-date">
           <Text fg={themeColors.textMuted}>{valueDates.lead}</Text>
@@ -493,6 +542,29 @@ export function CompositeLegend({
           {lines.map((line, index) => scrollLine(line, index, index === lines!.length - 1 ? scrollRef : undefined))}
         </Box>
       ) : seriesWidth > 0 ? scrollLine(null, "line", scrollRef) : null}
+      {foldedText ? (
+        <Box
+          flexDirection="row"
+          width={foldedWidth}
+          height={1}
+          flexShrink={0}
+          paddingLeft={1}
+          data-gloom-role="composite-chart-legend-more"
+        >
+          <Box
+            height={1}
+            flexShrink={0}
+            hoverBackgroundColor={onToggleCollapsed ? hoverBg() : undefined}
+            onMouseDown={onToggleCollapsed ? pressFold : undefined}
+            cursor={onToggleCollapsed ? "pointer" : undefined}
+            data-gloom-interactive={onToggleCollapsed ? "true" : undefined}
+            data-gloom-label={foldLabel}
+            title={isDesktopWeb ? foldLabel : undefined}
+          >
+            <Text fg={themeColors.textDim}>{foldedText}</Text>
+          </Box>
+        </Box>
+      ) : null}
       {accessorySpacerWidth > 0 ? (
         <Box width={accessorySpacerWidth} flexShrink={0} />
       ) : null}

package/src/components/chart/composite/levels.ts

@@ -14,10 +14,17 @@ export interface CompositeChartLevel {
   editable: boolean;
   /** Whether the chart's level action applies to it. */
   actionable: boolean;
+  /**
+   * An editable level that a plain press and drag moves, with no tool in
+   * hand, as an order's line does; the level tool still moves it by keyboard.
+   */
+  draggable?: boolean;
   /** Optional read-only annotation, independent of drawing-tool selection. */
   label?: string;
   /** Exact instrument price, independent of the grid's compact tick formatter. */
   axisLabel?: string;
+  /** A named reference guide keeps its axis label ahead of ordinary grid ticks. */
+  prioritizeAxisLabel?: boolean;
   dashed?: boolean;
 }
 

package/src/components/chart/composite/panel-gestures.ts

@@ -1,4 +1,7 @@
 import type { ChartMouseEvent } from "../core/pointer";
+import type { PanelScale } from "../../../time-series/types";
+import type { CompositeAxisSide, CompositePanelScene } from "./types";
+import type { CompositeValueRange } from "./value-scale";
 import { compositeViewportPositions, type CompositeNavigationFrame, type CompositeViewportRange } from "./interactions";
 
 export const COMPOSITE_PANEL_ROLE = "composite-chart-panel";
@@ -15,6 +18,27 @@ export interface PanGesture {
   frame: CompositeNavigationFrame;
   startViewport: CompositeViewportRange;
   positionsPerCell: number;
+  /** Where the press was, in rows, and the panel's axes scaled by hand then: a drag moves those up and down too. */
+  startCellY?: number;
+  values?: readonly ValueAxisStart[];
+}
+
+/** A value axis as a gesture on it found it. */
+export interface ValueAxisStart {
+  side: CompositeAxisSide;
+  key: string;
+  scale: PanelScale;
+  start: CompositeValueRange;
+}
+
+/** The panel's axes scaled by hand, which a drag on its plot moves up and down. */
+export function manualValueAxes(panel: Pick<CompositePanelScene, "axes">): ValueAxisStart[] {
+  return (["left", "right"] as const).flatMap((side) => {
+    const domain = panel.axes[side];
+    return domain?.manual && domain.scaleKey
+      ? [{ side, key: domain.scaleKey, scale: domain.scale, start: { min: domain.min, max: domain.max } }]
+      : [];
+  });
 }
 
 /**
@@ -47,6 +71,23 @@ export interface PendingWheel {
   anchorRatio: number;
 }
 
+/** Wheel steps on a value axis since the last frame: the log of the span's factor, around the pointer's height. */
+export interface PendingAxisWheel {
+  side: CompositeAxisSide;
+  spanLog: number;
+  anchorRatio: number;
+}
+
+/** Two presses on an axis closer than this, with no drag between, are a double click where the host does not count clicks. */
+export const AXIS_DOUBLE_PRESS_MS = 400;
+
+/**
+ * How recent the first press of a host's own double click (`detail` 2) must be
+ * to count as one on the same plot: twice the usual system setting, so the
+ * host still decides what a double click is.
+ */
+export const PLOT_DOUBLE_CLICK_MS = 1000;
+
 /** Blurs a focused text field, the focus change a consumed mousedown prevents. */
 export function releaseEditableFocus(event: ChartMouseEvent): void {
   if (!event.target?.closest?.(`[data-gloom-role="${COMPOSITE_PANEL_ROLE}"]`)) return;

package/src/components/chart/composite/panel-labels.ts

@@ -63,7 +63,8 @@ export function resolveSeriesAxisTags(
     const domain = panel.axes[source.axis];
     if (source.hidden || !domain || cursor?.value == null) return [];
     const yRatio = projectCompositeValue(cursor.value, domain);
-    if (yRatio === null) return [];
+    // An axis scaled by hand tags only the values it shows.
+    if (yRatio === null || (domain.manual && (yRatio < 0 || yRatio > 1))) return [];
     return [{
       seriesId: source.id,
       seriesLabel: source.label,

package/src/components/chart/composite/panel-series.ts

@@ -30,6 +30,7 @@ function sameSeriesMeta(left: ResolvedSeries, right: ResolvedSeries): boolean {
     && left.unitGroup === right.unitGroup
     && left.statedUnit === right.statedUnit
     && left.priceAssetCategory === right.priceAssetCategory
+    && left.valueDecimals === right.valueDecimals
     && left.nativeFrequency === right.nativeFrequency
     && left.timestampMode === right.timestampMode
     && left.dataShape === right.dataShape