gloomberb 0.18.0 → 0.18.2

package/src/components/ui/list-view.tsx

@@ -22,6 +22,12 @@ export interface ListViewItem {
   disabled?: boolean;
   /** Tints the label, e.g. a status in its tone; the words carry the meaning. */
   color?: string;
+  /**
+   * Artwork before the label on the desktop and the web, such as a broker's
+   * logo (`LogoMark`). It is decoration: the terminal does not draw it, and
+   * automation and screen readers read only `label`.
+   */
+  leading?: ReactNode;
 }
 
 export interface ListRowState {
@@ -39,6 +45,12 @@ export interface ListViewProps {
   renderRow?: (item: ListViewItem, state: ListRowState, index: number) => ReactNode;
   getRowBackgroundColor?: (item: ListViewItem, state: ListRowState, index: number) => string | undefined;
   showSelectedDescription?: boolean;
+  /**
+   * Desktop and web: every row sets its `description` on a second line under
+   * its label, and is two rows tall unless `rowHeight` says otherwise. The
+   * terminal keeps one line per row, with `detail` at its end.
+   */
+  rowDescriptions?: boolean;
   emptyMessage?: string;
   bgColor?: string;
   selectedBgColor?: string;
@@ -173,6 +185,7 @@ export function ListView({
   renderRow,
   getRowBackgroundColor,
   showSelectedDescription = false,
+  rowDescriptions,
   emptyMessage = "Nothing to show.",
   bgColor,
   selectedBgColor,
@@ -243,6 +256,7 @@ export function ListView({
         renderRow={renderRow}
         getRowBackgroundColor={getRowBackgroundColor}
         showSelectedDescription={showSelectedDescription}
+        rowDescriptions={rowDescriptions}
         emptyMessage={emptyMessage}
         bgColor={bgColor}
         selectedBgColor={selectedBgColor}

package/src/components/ui/logo-mark.tsx

@@ -0,0 +1,64 @@
+import type { CSSProperties } from "react";
+import { Box, ImageSurface, Text, TextAttributes, useUiCapabilities } from "../../ui";
+import { useThemeColors } from "../../theme/theme-context";
+
+/**
+ * `row`: beside a label in one row (a table cell's `leading`, a list row).
+ * `lead`: the art of a two-line list row; it fills the square `ListRowLines`
+ * sizes to the two lines beside it.
+ */
+type LogoMarkSize = "row" | "lead";
+
+const TILE: Record<LogoMarkSize, { side: string; radius: string; type: string }> = {
+  // A pixel above and below in its row, as a chip.
+  row: { side: "calc(var(--cell-h) - 2px)", radius: "var(--gloom-radius-sm)", type: "var(--gloom-type-caption)" },
+  lead: { side: "100%", radius: "var(--gloom-radius-md)", type: "var(--gloom-type-ui)" },
+};
+
+// Sized by its capital and baseline, so flex centring puts the letter in the
+// middle of the tile whatever the font's ascent and descent (as chrome text).
+const LETTER_STYLE: Record<LogoMarkSize, CSSProperties> = {
+  row: { fontSize: TILE.row.type, lineHeight: 1, textBox: "trim-both cap alphabetic" } as CSSProperties,
+  lead: { fontSize: TILE.lead.type, lineHeight: 1, textBox: "trim-both cap alphabetic" } as CSSProperties,
+};
+
+export interface LogoMarkProps {
+  /** The logo, an image URL; without one, or when it fails to load, the tile shows `name`'s initial. */
+  src?: string | null;
+  /** What the logo stands for, such as a broker. Only its initial is drawn; the label beside it names it. */
+  name: string;
+  size?: LogoMarkSize;
+}
+
+function initialOf(name: string): string {
+  const letter = [...name.trim()].find((character) => /[\p{L}\p{N}]/u.test(character));
+  return letter ? letter.toLocaleUpperCase() : "?";
+}
+
+/**
+ * A logo in a square tile, for lists of brokers and the accounts they hold, on
+ * the desktop and the web. Decoration: hidden from assistive technology, so
+ * the label beside it stays the name. The terminal draws nothing.
+ */
+export function LogoMark({ src, name, size = "row" }: LogoMarkProps) {
+  const desktop = useUiCapabilities().nativePaneChrome === true;
+  const colors = useThemeColors();
+  if (!desktop) return null;
+  const tile = TILE[size];
+  return (
+    <ImageSurface
+      src={src ?? undefined}
+      alt=""
+      objectFit="cover"
+      aria-hidden="true"
+      data-gloom-role="logo-mark"
+      style={{ width: tile.side, height: tile.side, flexShrink: 0, borderRadius: tile.radius }}
+    >
+      <Box width="100%" height="100%" alignItems="center" justifyContent="center" backgroundColor={colors.border}>
+        <Text fg={colors.textBright} attributes={TextAttributes.BOLD} style={LETTER_STYLE[size]}>
+          {initialOf(name)}
+        </Text>
+      </Box>
+    </ImageSurface>
+  );
+}

package/src/components/ui/number-step.ts

@@ -0,0 +1,54 @@
+/** Decimal stepping on a zero-based increment grid, without binary rounding drift. */
+function decimal(value: string | number): { units: bigint; places: number } | undefined {
+  const text = String(value).trim();
+  const match = /^([+-]?)(\d*)(?:\.(\d*))?(?:e([+-]?\d+))?$/i.exec(text);
+  if (!match || !`${match[2]}${match[3] ?? ""}` || !Number.isFinite(Number(text))) return;
+  const exponent = Number(match[4] ?? 0);
+  const places = (match[3]?.length ?? 0) - exponent;
+  if (Math.abs(places) > 18 || text.length > 100) return;
+  const units = BigInt(`${match[1] === "-" ? "-" : ""}${match[2] || "0"}${match[3] ?? ""}`);
+  return places < 0 ? { units: units * 10n ** BigInt(-places), places: 0 } : { units, places };
+}
+function floorDivide(a: bigint, b: bigint): bigint { return a / b - (a < 0n && a % b !== 0n ? 1n : 0n); }
+function ceilDivide(a: bigint, b: bigint): bigint { return -floorDivide(-a, b); }
+function format(units: bigint, places: number): string {
+  const digits = (units < 0n ? -units : units).toString().padStart(places + 1, "0");
+  const text = places ? `${digits.slice(0, -places)}.${digits.slice(-places)}`.replace(/\.?0+$/, "") : digits;
+  return `${units < 0n ? "-" : ""}${text}`;
+}
+export function stepNumber(value: string, direction: 1 | -1, step: number, min?: number, max?: number): string | undefined {
+  const current = decimal(value === "" ? 0 : value), increment = decimal(step);
+  const lower = min === undefined ? undefined : decimal(min), upper = max === undefined ? undefined : decimal(max);
+  if (!current || !increment || increment.units <= 0n || min !== undefined && !lower || max !== undefined && !upper) return;
+  const places = Math.max(current.places, increment.places, lower?.places ?? 0, upper?.places ?? 0);
+  const scaled = (n: { units: bigint; places: number }) => n.units * 10n ** BigInt(places - n.places);
+  const at = scaled(current), by = scaled(increment);
+  let ticks = direction > 0 ? floorDivide(at, by) + 1n : ceilDivide(at, by) - 1n;
+  const low = lower && ceilDivide(scaled(lower), by), high = upper && floorDivide(scaled(upper), by);
+  if (low !== undefined && high !== undefined && low > high) return;
+  if (low !== undefined && ticks < low) ticks = low;
+  if (high !== undefined && ticks > high) ticks = high;
+  const next = ticks * by;
+  // A bound must not make a plus go down or a minus go up, except an empty field.
+  if (value !== "" && (direction > 0 ? next <= at : next >= at)) return;
+  const text = format(next, places), roundTrip = decimal(Number(text));
+  if (!roundTrip || roundTrip.places > places || scaled(roundTrip) !== next) return;
+  return text;
+}
+
+/** Smallest whole-number multiple, for brokers combining a step with whole quantities. */
+export function wholeNumberStep(step: number): number | undefined {
+  const value = decimal(step);
+  if (!value || value.units <= 0n) return;
+  let a = value.units, b = 10n ** BigInt(value.places);
+  while (b) { const remainder = a % b; a = b; b = remainder; }
+  const result = Number(value.units / a);
+  return Number.isSafeInteger(result) ? result : undefined;
+}
+
+export function matchesNumberStep(value: number, step: number): boolean {
+  const n = decimal(value), s = decimal(step);
+  if (!n || !s || s.units <= 0n) return false;
+  const places = Math.max(n.places, s.places);
+  return n.units * 10n ** BigInt(places - n.places) % (s.units * 10n ** BigInt(places - s.places)) === 0n;
+}

package/src/components/ui/select-button.tsx

@@ -48,9 +48,10 @@ export interface SelectButtonProps<T extends string = string> {
    * `inline`: the label and the value in a row, in a toolbar. `field`: a
    * bordered field. `form`: a field in a form of text fields; on the desktop
    * and the web its label sits above it, bold, as a TextField's does; the
-   * terminal draws it inline.
+   * terminal draws it inline. `well`: a field without its border, on a
+   * recessed fill, for a dense panel such as the order ticket.
    */
-  variant?: "inline" | "field" | "form";
+  variant?: "inline" | "field" | "form" | "well";
   width?: number;
   onFocus?: () => void;
   /**
@@ -189,8 +190,8 @@ export function SelectButton<T extends string = string>({
   }
 
   // The terminal draws a form select as it draws an inline one.
-  if (variant === "field") {
-    return <Button label={showLabel ? `${label}: ${current?.short ?? current?.label ?? ""}` : current?.short ?? current?.label ?? label} width={width} active={emphasized} disabled={disabled} onPress={openDialog} stopPropagation />;
+  if (variant === "field" || variant === "well") {
+    return <Button label={showLabel ? `${label}: ${current?.short ?? current?.label ?? ""}` : current?.short ?? current?.label ?? label} width={width} variant={variant === "well" ? "quiet" : undefined} active={emphasized} disabled={disabled} onPress={openDialog} stopPropagation />;
   }
 
   return (

package/src/components/ui/select-field.tsx

@@ -22,10 +22,10 @@ export interface SelectFieldProps {
   width?: number | string;
   height?: number;
   /**
-   * `field` is the form control used in dialogs. `inline` drops the box so a
-   * dense row reads as text; both open the same Menu.
+   * `field` is the framed form control used in dialogs. `well` uses a quiet
+   * filled surface; `inline` reads as text. All open the same Menu.
    */
-  variant?: "field" | "inline";
+  variant?: "field" | "inline" | "well";
   includeUnsetOption?: boolean;
   /**
    * Return focus to the trigger when the menu closes (inside a dialog). A list

package/src/components/ui/status.tsx

@@ -5,6 +5,7 @@ import { Box, Text, useUiCapabilities } from "../../ui";
 import { formatRelativeAge } from "../../utils/datetime-format";
 import { Spinner } from "./loading";
 import { ButtonActionScope } from "./action-scope";
+import { blendForContrast, higherContrast } from "../../theme/color-utils";
 import { Button } from "./button";
 
 /**
@@ -233,14 +234,27 @@ function EmptyStateBody({ title, message, hint, actions, retry, status = "empty"
 export interface NoticeProps {
   children: ReactNode;
   tone?: "muted" | "positive" | "warning" | "negative";
+  variant?: "inline" | "callout";
 }
 
 /** Inline feedback leaves existing content visible, including stale data after a refresh failure. */
-export function Notice({ children, tone = "warning" }: NoticeProps) {
+export function Notice({ children, tone = "warning", variant = "inline" }: NoticeProps) {
   const colors = useThemeColors();
+  const native = useUiCapabilities().nativePaneChrome;
+  const color = tone === "muted" ? colors.textDim : colors[tone];
+  const status = tone === "negative" ? "error" : "notice";
+  // Inline feedback keeps its original single-text shape: a flex row here collapses inside content-sized parents.
+  if (variant !== "callout") {
+    return (
+      <Box data-gloom-status={status} data-gloom-ui="notice">
+        <Text fg={color} wrapText>{children}</Text>
+      </Box>
+    );
+  }
+  const foreground = blendForContrast(color, colors.panel, higherContrast("#000000", "#ffffff", colors.panel), 4.5);
   return (
-    <Box data-gloom-status={tone === "negative" ? "error" : "notice"} data-gloom-ui="notice">
-      <Text fg={tone === "muted" ? colors.textDim : colors[tone]} wrapText>{children}</Text>
+    <Box flexDirection="row" gap={1} paddingX={1} paddingY={native ? 0.35 : 0} backgroundColor={colors.panel} border={["left"]} borderColor={color} data-gloom-status={status} data-gloom-ui="notice" role={native ? tone === "negative" ? "alert" : "status" : undefined} aria-atomic={native ? true : undefined}>
+      <Text fg={foreground}>!</Text><Box flexGrow={1} minWidth={0}><Text fg={foreground} wrapText>{children}</Text></Box>
     </Box>
   );
 }

package/src/components/ui/tabs.tsx

@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useId, useMemo, useRef, useState } from "react";
+import { useCallback, useEffect, useId, useMemo, useRef, useState, type ReactNode } from "react";
 import { usePaneMenuItems, usePaneTabStripKeys } from "../layout/pane/footer/registration";
 import type { ContextMenuItem } from "../../types/context-menu";
 import { useShortcut } from "../../react/input";
@@ -22,6 +22,14 @@ type TabPointerEvent = {
 interface TabItem {
   label: string;
   value: string;
+  /**
+   * Artwork before the label on the desktop and the web, such as the logo of
+   * the broker a portfolio's account is at (`LogoMark`). It is decoration: the
+   * terminal does not draw it, and automation and screen readers read only
+   * `label`. Keep the same element between renders (useMemo): a title-bar
+   * strip redraws when it changes.
+   */
+  leading?: ReactNode;
   disabled?: boolean;
   /** Text color while inactive; used for group markers such as a team accent. */
   fg?: string;

package/src/components/ui/toggle.tsx

@@ -9,9 +9,12 @@ interface SegmentedControlOption {
   label: string;
   value: string;
   disabled?: boolean;
+  tone?: "positive" | "negative";
 }
 
 export interface SegmentedControlProps {
+  /** Name of the choice group for assistive technology and semantic access. */
+  accessibleLabel?: string;
   options: SegmentedControlOption[];
   value: string;
   onChange?: (value: string) => void;
@@ -21,9 +24,13 @@ export interface SegmentedControlProps {
   shortcutScope?: string;
   width?: number | "100%";
   wrap?: boolean;
+  size?: "default" | "large";
+  /** One filled selection without an enclosing frame. */
+  variant?: "default" | "flat";
 }
 
 export function SegmentedControl({
+  accessibleLabel,
   options,
   value,
   onChange,
@@ -32,13 +39,15 @@ export function SegmentedControl({
   shortcutScope,
   width,
   wrap = false,
+  size = "default",
+  variant = "default",
 }: SegmentedControlProps) {
   const colors = useThemeColors();
   const ui = useUiHost();
   const HostSegmentedControl = ui.SegmentedControl as ComponentType<SegmentedControlProps> | undefined;
   useRemoteUiNode({
     role: "select",
-    label: "Segmented control",
+    label: accessibleLabel ?? "Segmented control",
     actions: {
       select: (input) => {
         const next = typeof input === "string" ? input : (input as { value?: string } | null)?.value;
@@ -78,12 +87,15 @@ export function SegmentedControl({
   if (HostSegmentedControl) {
     return (
       <HostSegmentedControl
+        accessibleLabel={accessibleLabel}
         options={options}
         value={value}
         onChange={onChange}
         focused={focused}
         width={width}
         wrap={wrap}
+        size={size}
+        variant={variant}
       />
     );
   }
@@ -100,7 +112,9 @@ export function SegmentedControl({
         return (
           <Box
             key={option.value}
-            backgroundColor={active ? (focused ? colors.borderFocused : colors.selected) : colors.panel}
+            flexGrow={size === "large" ? 1 : undefined}
+            justifyContent="center"
+            backgroundColor={option.disabled ? colors.panel : active && option.tone ? colors[option.tone] : active ? (focused ? colors.borderFocused : colors.selected) : colors.panel}
             onMouseDown={() => {
               if (!option.disabled) onChange?.(option.value);
             }}
@@ -109,7 +123,7 @@ export function SegmentedControl({
             <Text
               // The focused fill is the primary button's, so its text is too:
               // selected text on it is unreadable in the white theme.
-              fg={option.disabled ? colors.textMuted : active ? (focused ? colors.bg : colors.selectedText) : colors.textDim}
+              fg={option.disabled ? colors.textMuted : active && option.tone ? colors.bg : option.tone ? colors[option.tone] : active ? (focused ? colors.bg : colors.selectedText) : colors.textDim}
               attributes={active ? TextAttributes.BOLD : 0}
             >
               {` ${option.label} `}

package/src/core/state/app/instrument.ts

@@ -3,7 +3,7 @@ import { findPaneInstance, type PaneBinding } from "../../../types/config";
 import type { BrokerContractRef, TickerListingRef } from "../../../types/instrument";
 import type { TickerRecord } from "../../../types/ticker";
 import { instrumentFromTicker, type InstrumentRef } from "../../../market-data/request-types";
-import { scopedBrokerContractIdentityKey } from "../../../utils/instrument-identity";
+import { heldOnListing, sameBrokerContract } from "../../../utils/instrument-identity";
 import { isBrokerPortfolioId } from "../../../utils/broker-instances";
 import { searchContractKey } from "../../../tickers/search/identity";
 import { canonicalExchange } from "../../../utils/exchanges";
@@ -77,10 +77,15 @@ function contractListingExchange(ticker: TickerRecord, instrument: BrokerContrac
 export function tickerForInstrument(ticker: TickerRecord | null, instrument: BrokerContractRef | null | undefined, listing?: TickerListingRef): TickerRecord | null {
   if (!ticker || instrument === undefined) return null;
   if (!instrument && !listing && !ticker.metadata.broker_contracts?.length) return ticker;
-  const key = instrument ? scopedBrokerContractIdentityKey(instrument) : null;
+  // A position is this contract's however the broker routed it: SPY held through SMART is the ARCX listing's.
   const positions = ticker.metadata.positions.filter((position) => {
     const selected = instrumentFromTicker({ ...ticker, metadata: { ...ticker.metadata, positions: [position] } }, null, { portfolioId: position.portfolio });
-    return selected && (selected.instrument ? scopedBrokerContractIdentityKey(selected.instrument) : null) === key;
+    const held = selected?.instrument;
+    if (!selected) return false;
+    if (!held) return !instrument;
+    // A pane opened on a listing from search has no broker contract; a share held there is still its.
+    if (!instrument) return !!listing && heldOnListing(held, listing);
+    return held.brokerId === instrument.brokerId && (held.brokerInstanceId ?? "") === (instrument.brokerInstanceId ?? "") && sameBrokerContract(held, instrument);
   });
   return { ...ticker, metadata: {
     ...ticker.metadata,

package/src/data/config/store/normalize.ts

@@ -24,6 +24,7 @@ import { migrateSavedConfig, type ConfigMigrationHost } from "./migrations";
 import { encodeBuiltinDisabledPluginIds, expandBuiltinPluginGroups } from "../../../plugins/ownership";
 import { sanitizeSavedPaneState } from "./pane-state";
 import { isRecord } from "../../../utils/guards";
+import { normalizeStoredBaseCurrency } from "../../../utils/base-currency";
 import { debugLog } from "../../../utils/debug-log";
 import { DEFAULT_THEME, themes } from "../../../theme/themes";
 import { sanitizeStarPrompt } from "../../../app/star-prompt/model";
@@ -80,7 +81,9 @@ export function normalizeLoadedConfig(
   const config: AppConfig = {
     dataDir,
     configVersion: CURRENT_CONFIG_VERSION,
-    baseCurrency: typeof candidate.baseCurrency === "string" ? candidate.baseCurrency : defaults.baseCurrency,
+    // A name or sign an older version saved (Canadian dollar, CA$) reads as its code; nothing turns into USD unasked.
+    baseCurrency: typeof candidate.baseCurrency === "string" && candidate.baseCurrency.trim()
+      ? normalizeStoredBaseCurrency(candidate.baseCurrency) : defaults.baseCurrency,
     refreshIntervalMinutes: typeof candidate.refreshIntervalMinutes === "number" ? candidate.refreshIntervalMinutes : defaults.refreshIntervalMinutes,
     portfolios: sanitizePortfolios(candidate.portfolios, defaults.portfolios),
     watchlists: sanitizeWatchlists(candidate.watchlists, defaults.watchlists),

package/src/data/plugin-cache.ts

@@ -44,6 +44,24 @@ export function createPluginCache<T, Stored = T>(options: {
       source: options.source,
     };
   };
+  /**
+   * Listeners by key, kept apart from the queries so they outlive a reset:
+   * a pane that subscribed before the plugin attached its store still hears
+   * the loads made after.
+   */
+  const listeners = new Map<string, Set<() => void>>();
+  const emit = (key: string) => {
+    for (const listener of [...listeners.get(key) ?? []]) listener();
+  };
+  const queryFor = (key: string): CachedQuery<T> => {
+    let query = queries.get(key);
+    if (!query) {
+      query = new CachedQuery({ read: (allowExpired) => read(key, allowExpired) });
+      query.subscribe(() => emit(key));
+      queries.set(key, query);
+    }
+    return query;
+  };
   const reset = () => {
     generation += 1;
     persistence = null;
@@ -53,21 +71,29 @@ export function createPluginCache<T, Stored = T>(options: {
   };
   return {
     attach(next: PluginPersistence) {
-      if (persistence !== next) reset();
+      if (persistence === next) return;
+      reset();
       persistence = next;
+      // What a listener reads now comes from another store.
+      for (const key of [...listeners.keys()]) emit(key);
     },
     reset,
+    subscribe(key: string, listener: () => void): () => void {
+      const keyed = listeners.get(key) ?? new Set<() => void>();
+      listeners.set(key, keyed);
+      keyed.add(listener);
+      return () => {
+        keyed.delete(listener);
+        if (keyed.size === 0 && listeners.get(key) === keyed) listeners.delete(key);
+      };
+    },
     get(key: string, { allowExpired = false } = {}): PluginCacheResult<T> | null {
       const cached = read(key, allowExpired) ?? queries.get(key)?.getSnapshot().result;
       if (!cached || (!allowExpired && cached.expiresAt <= Date.now())) return null;
       return { data: cached.value, fetchedAt: cached.fetchedAt, stale: cached.staleAt <= Date.now(), source: "cache" };
     },
     async load(key: string, loader: () => Promise<T>, { force = false, replace = false } = {}): Promise<PluginCacheResult<T>> {
-      let query = queries.get(key);
-      if (!query) {
-        query = new CachedQuery({ read: (allowExpired) => read(key, allowExpired) });
-        queries.set(key, query);
-      }
+      const query = queryFor(key);
       const owner = generation;
       const before = query.getSnapshot().result;
       const result = await query.load({ force, replace, fetch: async () => {