gloomberb 0.9.6 → 0.9.8

package/src/plugins/builtin/ticker-detail/data-panes.test.ts

@@ -1,9 +1,10 @@
 import { describe, expect, test } from "bun:test";
 import { buildRelationshipAnalysis, createRelationshipPaneTemplate } from "../correlation/relationship/pane";
 import { buildFundamentalGraphRows, buildValuationGraphRows } from "./data-panes/fundamental-graph";
+import { allMetricDefs, buildGraphBarSeries, graphRowsForFinancials } from "./data-panes/fundamental-graph/model";
 import { buildHistoricalPriceRows } from "./data-panes/historical-prices";
 import { createDefaultConfig } from "../../../types/config";
-import type { FinancialStatement, PricePoint } from "../../../types/financials";
+import type { FinancialStatement, PricePoint, TickerFinancials } from "../../../types/financials";
 
 describe("ticker data panes", () => {
   test("builds historical price rows with close-to-close changes", () => {
@@ -65,6 +66,55 @@ describe("ticker data panes", () => {
     ]);
   });
 
+  test("orders multi-symbol chart categories by statement date", () => {
+    const series = buildGraphBarSeries([
+      { key: "NVDA:2025-01-31", symbol: "NVDA", date: "2025-01-31", category: "2025 Q1", value: 1, growth: null, barWidth: 1 },
+      { key: "NVDA:2026-04-30", symbol: "NVDA", date: "2026-04-30", category: "2026 Q2", value: 2, growth: null, barWidth: 1 },
+      { key: "AMD:2024-12-31", symbol: "AMD", date: "2024-12-31", category: "2024 Q4", value: 3, growth: null, barWidth: 1 },
+    ]);
+
+    expect(series[0]?.points.map((point) => point.category)).toEqual(["2024 Q4", "2025 Q1", "2026 Q2"]);
+    expect(series[1]?.points.map((point) => point.category)).toEqual(["2024 Q4", "2025 Q1", "2026 Q2"]);
+  });
+
+  test("derives free cash flow and margins for graph metrics", () => {
+    const fcfRows = buildFundamentalGraphRows([
+      { date: "2025-03-31", operatingCashFlow: 100, capitalExpenditure: -25 },
+      { date: "2025-06-30", freeCashFlow: 90, operatingCashFlow: 120, capitalExpenditure: -30 },
+    ] satisfies FinancialStatement[], "freeCashFlow", "NVDA", "quarterly");
+    const marginRows = buildFundamentalGraphRows([
+      { date: "2025-03-31", totalRevenue: 200, grossProfit: 100 },
+    ] satisfies FinancialStatement[], "grossMargin", "AMD", "quarterly");
+
+    expect(fcfRows.map((row) => row.value)).toEqual([75, 90]);
+    expect(marginRows[0]?.value).toBe(0.5);
+    expect(allMetricDefs().map(({ definition }) => definition.key)).toContain("freeCashFlowMargin");
+  });
+
+  test("fills missing Q4 margin rows from annual totals and preceding quarters", () => {
+    const financials = {
+      annualStatements: [
+        { date: "2025-12-31", totalRevenue: 1_000, grossProfit: 500 },
+      ],
+      quarterlyStatements: [
+        { date: "2025-03-31", totalRevenue: 100, grossProfit: 40 },
+        { date: "2025-06-30", totalRevenue: 200, grossProfit: 90 },
+        { date: "2025-09-30", totalRevenue: 300, grossProfit: 150 },
+        { date: "2025-12-31" },
+      ],
+      priceHistory: [],
+    } satisfies TickerFinancials;
+
+    const rows = graphRowsForFinancials(financials, "fundamental", "grossMargin", "quarterly", "AMD");
+
+    expect(rows.map((row) => [row.category, row.value])).toEqual([
+      ["2025 Q1", 0.4],
+      ["2025 Q2", 0.45],
+      ["2025 Q3", 0.5],
+      ["2025 Q4", 220 / 400],
+    ]);
+  });
+
   test("builds valuation graph rows from available multiples", () => {
     const rows = buildValuationGraphRows({
       quote: { symbol: "AMD", price: 100, currency: "USD", change: 0, changePercent: 0, lastUpdated: 1, marketCap: 1_000 },
@@ -83,6 +133,50 @@ describe("ticker data panes", () => {
     ]);
   });
 
+  test("builds historical trailing and forward P/E rows from prices and EPS", () => {
+    const financials = {
+      quote: { symbol: "META", price: 320, currency: "USD", change: 0, changePercent: 0, lastUpdated: 1 },
+      fundamentals: { forwardPE: 16 },
+      annualStatements: [
+        { date: "2024-12-31", eps: 5 },
+        { date: "2025-12-31", eps: 10 },
+        { date: "2026-12-31", eps: 20 },
+      ],
+      quarterlyStatements: [
+        { date: "2025-03-31", eps: 1 },
+        { date: "2025-06-30", eps: 2 },
+        { date: "2025-09-30", eps: 3 },
+        { date: "2025-12-31", eps: 4 },
+        { date: "2026-03-31", eps: 5 },
+      ],
+      priceHistory: [
+        { date: new Date("2024-12-31T00:00:00Z"), close: 100 },
+        { date: new Date("2025-12-31T00:00:00Z"), close: 150 },
+        { date: new Date("2026-03-31T00:00:00Z"), close: 180 },
+        { date: new Date("2026-12-31T00:00:00Z"), close: 300 },
+      ],
+    } satisfies TickerFinancials;
+
+    const trailingAnnual = buildValuationGraphRows(financials, "trailingPE", "META", "annual");
+    const forwardAnnual = buildValuationGraphRows(financials, "forwardPE", "META", "annual");
+    const trailingQuarterly = buildValuationGraphRows(financials, "trailingPE", "META", "quarterly");
+
+    expect(trailingAnnual.map((row) => [row.category, row.value])).toEqual([
+      ["FY2024", 20],
+      ["FY2025", 15],
+      ["FY2026", 15],
+    ]);
+    expect(forwardAnnual.map((row) => [row.category, row.value])).toEqual([
+      ["FY2024", 10],
+      ["FY2025", 7.5],
+      ["Current", 16],
+    ]);
+    expect(trailingQuarterly.map((row) => [row.category, row.value])).toEqual([
+      ["2025 Q4", 15],
+      ["2026 Q1", 180 / 14],
+    ]);
+  });
+
   test("builds relationship analysis from overlapping price history", () => {
     const dates = ["2026-01-01", "2026-01-02", "2026-01-03", "2026-01-04", "2026-01-05", "2026-01-06"];
     const makeHistory = (closes: number[]) => dates.map((date, index) => ({

package/src/plugins/builtin/ticker-detail/index.tsx

@@ -5,6 +5,7 @@ import { normalizeTickerInput } from "../../../tickers/search";
 import { createTickerSurfacePaneTemplate } from "../shared/ticker-surface";
 import { TickerChartPane, ChartResearchTab } from "./chart-pane";
 import {
+  buildGraphPaneSettingsDef,
   createGraphPaneTemplate,
   FundamentalGraphPane,
   FundamentalGraphsResearchTab,
@@ -128,6 +129,7 @@ export const tickerDetailPlugin: GloomPlugin = {
       defaultPosition: "right",
       defaultMode: "floating",
       defaultFloatingSize: { width: 82, height: 22 },
+      settings: buildGraphPaneSettingsDef(),
     },
     {
       id: "provider-search-results",

package/src/plugins/ibkr/gateway/market-data.ts

@@ -6,7 +6,7 @@ import {
 } from "@stoqey/ib";
 import type { QuoteSubscriptionTarget } from "../../../types/data-provider";
 import type { Quote } from "../../../types/financials";
-import { canonicalExchange, normalizeSymbol } from "../../../utils/exchanges";
+import { normalizeSymbol } from "../../../utils/exchanges";
 import type { IbkrGatewayConfig } from "./types";
 import { getIbkrPriceDivisor, normalizeIbkrPriceValue } from "./price-normalization";
 
@@ -35,7 +35,7 @@ export function normalizeQuoteStreamTarget(target: QuoteSubscriptionTarget): Quo
   return {
     ...target,
     symbol,
-    exchange: canonicalExchange(target.exchange),
+    exchange: target.exchange?.trim().toUpperCase() ?? "",
   };
 }
 
@@ -136,15 +136,22 @@ export function applyTickByTickAllLastToQuote(
   const nextPrice = normalizeIbkrPriceValue(tick.price, priceDivisor);
   if (nextPrice == null || nextPrice <= 0) return null;
 
-  const previousClose = current?.previousClose ?? current?.price ?? nextPrice;
-  const change = nextPrice - previousClose;
+  const canInferPreviousClose = current?.price != null
+    && current.change != null
+    && (current.change !== 0 || current.changePercent !== 0);
+  const inferredPreviousClose = current?.previousClose
+    ?? (canInferPreviousClose ? current.price - current.change : undefined);
+  const previousClose = inferredPreviousClose != null && Number.isFinite(inferredPreviousClose) && inferredPreviousClose > 0
+    ? inferredPreviousClose
+    : undefined;
+  const change = previousClose != null ? nextPrice - previousClose : current?.change ?? 0;
   return {
     symbol: current?.symbol ?? contract.localSymbol ?? contract.symbol ?? "",
     providerId: "ibkr",
     price: nextPrice,
     currency: current?.currency ?? contract.currency ?? "USD",
     change,
-    changePercent: previousClose ? (change / previousClose) * 100 : 0,
+    changePercent: previousClose ? (change / previousClose) * 100 : current?.changePercent ?? 0,
     previousClose,
     high52w: current?.high52w,
     low52w: current?.low52w,

package/src/plugins/ibkr/gateway/service/index.test.ts

@@ -312,6 +312,37 @@ describe("tick-by-tick quote updates", () => {
     expect(next?.lastUpdated).toBe(1_700_000_000_000);
   });
 
+  test("does not use the previous tick as the daily close when no close is known", () => {
+    const current = {
+      symbol: "AAPL",
+      providerId: "ibkr" as const,
+      price: 249,
+      currency: "USD",
+      change: 0,
+      changePercent: 0,
+      name: "Apple Inc.",
+      lastUpdated: 1000,
+      dataSource: "live" as const,
+    };
+    const tick: TickByTickAllLast = {
+      time: 1_700_000_000,
+      price: 250.5,
+      size: 100,
+      tickType: 1,
+      tickAttribLast: {},
+      exchange: "NASDAQ",
+      specialConditions: "",
+      contract: contract as any,
+    };
+
+    const next = applyTickByTickAllLastToQuote(current, contract as any, details, tick, 1, "live");
+
+    expect(next?.price).toBe(250.5);
+    expect(next?.previousClose).toBeUndefined();
+    expect(next?.change).toBe(0);
+    expect(next?.changePercent).toBe(0);
+  });
+
   test("applies bid/ask ticks without disturbing the current trade price", () => {
     const current = {
       symbol: "AAPL",

package/src/plugins/registry/context.ts

@@ -14,6 +14,7 @@ import type {
 } from "../../types/plugin";
 import type { PaneRuntimeState } from "../../core/state/app/state";
 import type { NewsQuery, NewsQueryState } from "../../types/news-source";
+import type { SyncContributor, SyncTransport } from "../../sync/types";
 import { debugLog } from "../../utils/debug-log";
 import { createPluginPersistence } from "../plugin-persistence";
 import type { PluginEvents } from "../event-bus";
@@ -35,6 +36,8 @@ export interface RegistryPluginContextOptions {
   updateLayout: (layout: LayoutConfig) => void;
   resolvePaneTarget: (paneId: string) => string | undefined;
   registerCapabilityForPlugin: (pluginId: string, capability: PluginCapability, items: PluginItems) => void;
+  registerSyncContributorForPlugin: (pluginId: string, contributor: SyncContributor) => () => void;
+  registerSyncTransportForPlugin: (pluginId: string, transport: SyncTransport) => () => void;
   watchNewsQuery: (query: NewsQuery, listener: (state: NewsQueryState) => void) => () => void;
   getData: (ticker: string) => TickerFinancials | null;
   getTicker: (symbol: string) => TickerRecord | null;
@@ -82,6 +85,8 @@ export function createRegistryPluginContext({
   updateLayout,
   resolvePaneTarget,
   registerCapabilityForPlugin,
+  registerSyncContributorForPlugin,
+  registerSyncTransportForPlugin,
   watchNewsQuery,
   getData,
   getTicker,
@@ -143,6 +148,16 @@ export function createRegistryPluginContext({
     registerShortcut: (shortcut) => contributions.registerShortcut(pluginId, shortcut, items),
     registerTickerAction: (action) => contributions.registerTickerAction(pluginId, action, items),
     registerContextMenuProvider: (provider) => contributions.registerContextMenuProvider(pluginId, provider, items),
+    registerSyncContributor: (contributor) => {
+      const dispose = registerSyncContributorForPlugin(pluginId, contributor);
+      items.eventDisposers.push(dispose);
+      return dispose;
+    },
+    registerSyncTransport: (transport) => {
+      const dispose = registerSyncTransportForPlugin(pluginId, transport);
+      items.eventDisposers.push(dispose);
+      return dispose;
+    },
     watchNewsQuery: (query, listener) => {
       const dispose = watchNewsQuery(query, listener);
       items.newsQueryWatchDisposers.push(dispose);

package/src/plugins/registry/index.ts

@@ -27,6 +27,12 @@ import type {
 } from "../../types/plugin";
 import type { ContextMenuContext, ContextMenuItem } from "../../types/context-menu";
 import type { TickerRecord } from "../../types/ticker";
+import type {
+  RegisteredSyncContributor,
+  RegisteredSyncTransport,
+  SyncContributor,
+  SyncTransport,
+} from "../../sync/types";
 import { EventBus } from "../event-bus";
 import { resolvePaneInstance } from "../../types/config";
 import { debugLog } from "../../utils/debug-log";
@@ -49,6 +55,7 @@ import {
   releaseSharedRegistry,
 } from "./shared";
 import { RegistryResumeStateListeners } from "./plugin-state";
+import { cloudSyncController } from "../../sync/controller";
 
 interface PluginRegistryOptions {
   enableCapabilityHandlers?: boolean;
@@ -215,6 +222,28 @@ export class PluginRegistry implements PluginRuntimeAccess {
   get tickerActions(): ReadonlyMap<string, TickerAction> { return this.contributions.tickerActionsMap; }
   get allPlugins(): ReadonlyMap<string, GloomPlugin> { return this.plugins; }
 
+  registerSyncContributorForPlugin(pluginId: string, contributor: SyncContributor): () => void {
+    return cloudSyncController.registerContributor(pluginId, contributor);
+  }
+
+  registerSyncTransportForPlugin(pluginId: string, transport: SyncTransport): () => void {
+    return cloudSyncController.registerTransport(pluginId, transport);
+  }
+
+  getEnabledSyncContributors(): RegisteredSyncContributor[] {
+    const disabledPlugins = new Set(this.getConfigFn().disabledPlugins ?? []);
+    return cloudSyncController
+      .getRegisteredContributors()
+      .filter((entry) => !disabledPlugins.has(entry.pluginId));
+  }
+
+  getActiveSyncTransport(): RegisteredSyncTransport | null {
+    const disabledPlugins = new Set(this.getConfigFn().disabledPlugins ?? []);
+    return cloudSyncController
+      .getRegisteredTransports()
+      .find((entry) => !disabledPlugins.has(entry.pluginId) && entry.transport.isAvailable()) ?? null;
+  }
+
   getContextMenuItems(context: ContextMenuContext): ContextMenuItem[] {
     return resolveRegistryContextMenuItems({
       context,
@@ -373,6 +402,8 @@ export class PluginRegistry implements PluginRuntimeAccess {
       updateLayout: (layout) => this.updateLayoutFn(layout),
       resolvePaneTarget: (paneId) => this.resolvePaneTarget(paneId),
       registerCapabilityForPlugin: (targetPluginId, capability, pluginItems) => this.registerCapabilityForPlugin(targetPluginId, capability, pluginItems),
+      registerSyncContributorForPlugin: (targetPluginId, contributor) => this.registerSyncContributorForPlugin(targetPluginId, contributor),
+      registerSyncTransportForPlugin: (targetPluginId, transport) => this.registerSyncTransportForPlugin(targetPluginId, transport),
       watchNewsQuery: (query, listener) => this.watchNewsQueryFn(query, listener),
       getData: (ticker) => this.getDataFn(ticker),
       getTicker: (symbol) => this.getTickerFn(symbol),

package/src/renderers/electrobun/bun/index.ts

@@ -103,6 +103,41 @@ function requireDesktopWorkspace(): DesktopWorkspace {
   return desktopWorkspace;
 }
 
+const pendingDesktopDeepLinks: string[] = [];
+
+function isGloomberbDeepLink(rawUrl: string): boolean {
+  try {
+    return new URL(rawUrl).protocol === "gloomberb:";
+  } catch {
+    return false;
+  }
+}
+
+function readOpenUrlEvent(event: unknown): string | null {
+  const data = event && typeof event === "object" ? (event as { data?: unknown }).data : null;
+  if (!data || typeof data !== "object") return null;
+  const url = (data as { url?: unknown }).url;
+  return typeof url === "string" && url ? url : null;
+}
+
+function sendDesktopDeepLink(rawUrl: string): void {
+  if (!isGloomberbDeepLink(rawUrl)) return;
+  const rpc = getWindowRpc(MAIN_WINDOW_RPC_KEY);
+  if (!rpc || !isWindowRpcReady(MAIN_WINDOW_RPC_KEY)) {
+    pendingDesktopDeepLinks.push(rawUrl);
+    if (pendingDesktopDeepLinks.length > 20) pendingDesktopDeepLinks.shift();
+    return;
+  }
+  detachedWindowManager.focusWindowForRpcKey(MAIN_WINDOW_RPC_KEY);
+  rpc.send["desktop.deepLink"]({ url: rawUrl });
+}
+
+function flushPendingDesktopDeepLinks(): void {
+  if (pendingDesktopDeepLinks.length === 0) return;
+  const urls = pendingDesktopDeepLinks.splice(0);
+  for (const url of urls) sendDesktopDeepLink(url);
+}
+
 function remoteFailure(code: string, message: string): RemoteControlResponse {
   return { ok: false, error: { code, message } };
 }
@@ -377,6 +412,7 @@ async function initialize(
     syncConfigAccessors,
   });
   if (init.windowKind === "main") {
+    flushPendingDesktopDeepLinks();
     void ensureDesktopRemoteControlServer().catch((error) => {
       console.error("[remote] desktop control endpoint failed", summarizeError(error));
     });
@@ -502,6 +538,12 @@ Electrobun.events.on("context-menu-clicked", (event: unknown) => {
   });
 });
 
+Electrobun.events.on("open-url", (event: unknown) => {
+  const url = readOpenUrlEvent(event);
+  if (!url) return;
+  sendDesktopDeepLink(url);
+});
+
 ApplicationMenu.on("application-menu-clicked", (event: unknown) => {
   const command = applicationMenuCommand(event);
   if (!command) return;

package/src/renderers/electrobun/shared/protocol.ts

@@ -60,6 +60,10 @@ export interface DesktopRestartMessage {
   source?: string;
 }
 
+export interface DesktopDeepLinkMessage {
+  url: string;
+}
+
 export interface RemoteControlRequestMessage {
   request: RemoteControlRequest;
 }
@@ -89,6 +93,7 @@ export interface ElectrobunDesktopRpcSchema {
       "desktop.state": DesktopStateMessage;
       "desktop.dockPreview": DesktopDockPreviewMessage;
       "desktop.themePreview": DesktopThemePreviewMessage;
+      "desktop.deepLink": DesktopDeepLinkMessage;
       "update.progress": UpdateProgressMessage;
       "capability.event": CapabilityEventMessage;
     };

package/src/renderers/electrobun/view/backend-rpc.ts

@@ -4,6 +4,7 @@ import {
   type ApplicationMenuSelectMessage,
   type CapabilityEventMessage,
   type ContextMenuSelectMessage,
+  type DesktopDeepLinkMessage,
   type DesktopDockPreviewMessage,
   type DesktopRestartMessage,
   type DesktopStateMessage,
@@ -18,6 +19,7 @@ import type { RemoteControlRequest, RemoteControlResponse } from "../../../remot
 
 type ContextMenuSelectListener = (message: ContextMenuSelectMessage) => void;
 type ApplicationMenuSelectListener = (message: ApplicationMenuSelectMessage) => void;
+type DesktopDeepLinkListener = (message: DesktopDeepLinkMessage) => void;
 type DesktopStateListener = (message: DesktopStateMessage) => void;
 type DesktopDockPreviewListener = (message: DesktopDockPreviewMessage) => void;
 type DesktopThemePreviewListener = (message: DesktopThemePreviewMessage) => void;
@@ -29,6 +31,8 @@ let initSnapshot: ElectrobunBackendInit | null = null;
 let remoteControlRequestHandler: RemoteControlRequestHandler | null = null;
 const contextMenuSelectListeners = new Map<string, Set<ContextMenuSelectListener>>();
 const applicationMenuSelectListeners = new Set<ApplicationMenuSelectListener>();
+const desktopDeepLinkListeners = new Set<DesktopDeepLinkListener>();
+const pendingDesktopDeepLinks: DesktopDeepLinkMessage[] = [];
 const desktopStateListeners = new Set<DesktopStateListener>();
 const desktopDockPreviewListeners = new Set<DesktopDockPreviewListener>();
 const desktopThemePreviewListeners = new Set<DesktopThemePreviewListener>();
@@ -64,6 +68,17 @@ function subscribe<T>(
   };
 }
 
+function dispatchDesktopDeepLink(message: DesktopDeepLinkMessage): void {
+  if (desktopDeepLinkListeners.size === 0) {
+    pendingDesktopDeepLinks.push(message);
+    if (pendingDesktopDeepLinks.length > 20) pendingDesktopDeepLinks.shift();
+    return;
+  }
+  for (const listener of desktopDeepLinkListeners) {
+    listener(message);
+  }
+}
+
 const rpc = Electroview.defineRPC<ElectrobunDesktopRpcSchema>({
   maxRequestTime: 120_000,
   handlers: {
@@ -92,6 +107,10 @@ const rpc = Electroview.defineRPC<ElectrobunDesktopRpcSchema>({
           listener(decoded);
         }
       },
+      "desktop.deepLink": (message) => {
+        if (typeof message.url !== "string" || !message.url) return;
+        dispatchDesktopDeepLink({ url: message.url });
+      },
       "desktop.state": (message) => {
         for (const listener of desktopStateListeners) {
           listener({ snapshot: decodeRpcValue(message.snapshot) });
@@ -188,6 +207,16 @@ export function onApplicationMenuSelect(listener: ApplicationMenuSelectListener)
   };
 }
 
+export function onDesktopDeepLink(listener: DesktopDeepLinkListener): () => void {
+  desktopDeepLinkListeners.add(listener);
+  for (const message of pendingDesktopDeepLinks.splice(0)) {
+    listener(message);
+  }
+  return () => {
+    desktopDeepLinkListeners.delete(listener);
+  };
+}
+
 export function onDesktopState(listener: DesktopStateListener): () => void {
   desktopStateListeners.add(listener);
   return () => {

package/src/renderers/electrobun/view/desktop/controls.tsx

@@ -4,9 +4,11 @@ import { Box, Input, Text, Textarea, editableTextContextMenuItems, useRendererHo
 import { TextAttributes, type InputRenderable } from "../../../../ui";
 import { useShortcut } from "../../../../react/input";
 import { blendHex, colors } from "../../../../theme/colors";
+import { contrastRatio } from "../../../../theme/color-utils";
 import { useThemeColors } from "../../../../theme/theme-context";
 import { isDetailBackNavigationKey } from "../../../../utils/back-navigation";
 import type { ButtonProps } from "../../../../components/ui/button";
+import type { CheckboxProps } from "../../../../components/ui/checkbox";
 import type { TextFieldProps } from "../../../../components/ui/fields";
 import type { DialogFrameProps } from "../../../../components/ui/frame";
 import type { MessageComposerProps } from "../../../../components/ui/message-composer";
@@ -31,6 +33,7 @@ export function WebButton({
   active = false,
   shortcut,
   width,
+  height,
 }: ButtonProps) {
   useThemeColors();
   const palette = buttonPalette({ variant, active, disabled });
@@ -38,7 +41,7 @@ export function WebButton({
   return (
     <Box
       width={width}
-      height={1}
+      height={height ?? 1}
       flexDirection="row"
       alignItems="center"
       justifyContent="center"
@@ -51,7 +54,8 @@ export function WebButton({
       style={{
         border: `1px solid ${palette.border}`,
         borderRadius: CONTROL_RADIUS,
-        paddingInline: 8,
+        paddingLeft: 8,
+        paddingRight: 8,
         boxShadow: controlShadow(active),
         cursor: disabled ? "default" : "pointer",
       }}
@@ -59,7 +63,9 @@ export function WebButton({
       <Text
         fg={palette.fg}
         attributes={active ? TextAttributes.BOLD : 0}
-        style={{ fontWeight: active || variant === "primary" ? 700 : 600 }}
+        style={{
+          fontWeight: active || variant === "primary" ? 700 : 600,
+        }}
       >
         {label}
       </Text>
@@ -75,6 +81,129 @@ export function WebButton({
   );
 }
 
+function checkboxAccentColor(): string {
+  const base = colors.borderFocused;
+  const nativeCheckmark = "#ffffff";
+  const candidates = [
+    blendHex(base, colors.selected, 0.55),
+    blendHex(base, colors.selected, 0.65),
+    blendHex(base, "#000000", 0.45),
+    blendHex(base, "#000000", 0.52),
+    base,
+  ];
+  return candidates.find((candidate) => (
+    contrastRatio(candidate, nativeCheckmark) >= 4.5
+    && contrastRatio(candidate, colors.panel) >= 2.2
+  )) ?? candidates[1]!;
+}
+
+function checkboxCheckImage(): string {
+  const svg = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 14 14"><path d="M3 7.3 5.8 10 11.2 3.7" fill="none" stroke="#fff" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"/></svg>`;
+  return `url("data:image/svg+xml,${encodeURIComponent(svg)}")`;
+}
+
+export function WebCheckbox({
+  label,
+  displayLabel,
+  checked,
+  onChange,
+  disabled = false,
+  active = false,
+  description,
+  width,
+}: CheckboxProps) {
+  useThemeColors();
+  const textColor = disabled
+    ? colors.textMuted
+    : active
+    ? colors.textBright
+    : colors.text;
+  const visibleLabel = displayLabel ?? label;
+  const accentColor = checkboxAccentColor();
+  const borderColor = checked ? accentColor : controlBorderColor(active, false);
+  return (
+    <Box
+      flexDirection="column"
+      width={width}
+      data-gloom-role="desktop-checkbox"
+      data-gloom-interactive={disabled ? undefined : "true"}
+      style={{ opacity: disabled ? 0.55 : 1 }}
+    >
+      <label
+        onMouseDown={(event) => {
+          event.preventDefault();
+          event.stopPropagation();
+        }}
+        onClick={(event) => {
+          event.preventDefault();
+          event.stopPropagation();
+          if (!disabled) onChange?.(!checked);
+        }}
+        style={{
+          display: "flex",
+          alignItems: "center",
+          gap: 8,
+          width: "100%",
+          minWidth: 0,
+          cursor: disabled ? "default" : "pointer",
+          color: textColor,
+          fontWeight: active ? 700 : 500,
+          lineHeight: "20px",
+          userSelect: "none",
+          position: "relative",
+        }}
+      >
+        <input
+          type="checkbox"
+          checked={checked}
+          readOnly
+          disabled={disabled}
+          style={{
+            appearance: "none",
+            WebkitAppearance: "none",
+            width: 14,
+            height: 14,
+            margin: 0,
+            backgroundColor: checked ? accentColor : panelFill(),
+            backgroundImage: checked ? checkboxCheckImage() : undefined,
+            backgroundPosition: "center",
+            backgroundRepeat: "no-repeat",
+            backgroundSize: "12px 12px",
+            border: `1px solid ${borderColor}`,
+            borderRadius: 4,
+            boxShadow: active
+              ? `0 0 0 2px ${blendHex(colors.bg, colors.borderFocused, 0.28)}, inset 0 1px 0 rgba(255,255,255,0.16)`
+              : "inset 0 1px 0 rgba(255,255,255,0.10)",
+            boxSizing: "border-box",
+            flexShrink: 0,
+            cursor: disabled ? "default" : "pointer",
+            verticalAlign: "middle",
+          }}
+        />
+        <span
+          style={{
+            overflow: "hidden",
+            textOverflow: "ellipsis",
+            whiteSpace: "nowrap",
+          }}
+        >
+          {visibleLabel}
+        </span>
+      </label>
+      {description ? (
+        <Text
+          fg={colors.textMuted}
+          wrapText
+          width={width}
+          style={{ paddingLeft: 22, lineHeight: "18px" }}
+        >
+          {description}
+        </Text>
+      ) : null}
+    </Box>
+  );
+}
+
 export function WebTextField({
   label,
   value,
@@ -184,6 +313,7 @@ export function WebMessageComposer({
   height = 2,
   onFocusRequest,
   onInput,
+  onCursorChange,
   onSubmit,
   keyBindings,
   wrapText = false,
@@ -234,6 +364,7 @@ export function WebMessageComposer({
         onMouseDown={requestFocus}
         onFocus={requestFocus}
         onInput={handleInput}
+        onCursorChange={onCursorChange}
         keyBindings={keyBindings}
         onSubmit={onSubmit}
         wrapText={wrapText}
@@ -295,7 +426,7 @@ export function WebDialogFrame({
   title,
   children,
   footer,
-  showTitleDivider = true,
+  showTitleDivider = false,
 }: DialogFrameProps) {
   useThemeColors();
   return (