gloomberb 0.9.7 → 0.9.9

package/src/components/layout/shell/index.test.tsx

@@ -14,7 +14,6 @@ import { cloneLayout, createDefaultConfig, TICKER_RESEARCH_PANE_ID, type LayoutC
 import type { PluginRegistry } from "../../../plugins/registry";
 import type { PaneProps } from "../../../types/plugin";
 import { Textarea } from "../../../ui";
-import { Header } from "../header";
 import {
   buildNativeWindowState,
   resolvePaneManagementShortcut,
@@ -70,7 +69,7 @@ function createShellPluginRegistry(options?: {
   } as unknown as PluginRegistry;
 }
 
-async function emitKeypress(event: { name?: string; sequence?: string; ctrl?: boolean; meta?: boolean; shift?: boolean; alt?: boolean }) {
+async function emitKeypress(event: { name?: string; sequence?: string; ctrl?: boolean; meta?: boolean; super?: boolean; shift?: boolean; alt?: boolean }) {
   await act(async () => {
     const keyEvent = {
       ctrl: false,
@@ -184,112 +183,6 @@ function findUpdateLayout(actions: ShellTestAction[]) {
   return actions.find((action) => action.type === "UPDATE_LAYOUT");
 }
 
-function HeaderHarness({
-  updateAvailable = null,
-  updateProgress = null,
-  updateCheckInProgress = false,
-  updateNotice = null,
-}: {
-  updateAvailable?: ReturnType<typeof createInitialState>["updateAvailable"];
-  updateProgress?: ReturnType<typeof createInitialState>["updateProgress"];
-  updateCheckInProgress?: boolean;
-  updateNotice?: string | null;
-}) {
-  const initialState = createInitialState(createDefaultConfig("/tmp/gloomberb-header-test"));
-  initialState.updateAvailable = updateAvailable;
-  initialState.updateProgress = updateProgress;
-  initialState.updateCheckInProgress = updateCheckInProgress;
-  initialState.updateNotice = updateNotice;
-  const [state, dispatch] = useReducer(appReducer, initialState);
-
-  return (
-    <AppContext value={{ state, dispatch }}>
-      <Header />
-    </AppContext>
-  );
-}
-
-describe("Header", () => {
-  test("shows automatic self-update status for standalone binaries", async () => {
-    testSetup = await testRender(
-      <HeaderHarness updateAvailable={{
-        version: "0.3.0",
-        tagName: "v0.3.0",
-        downloadUrl: "https://example.com/gloomberb",
-        publishedAt: "2026-04-01T00:00:00.000Z",
-        updateAction: { kind: "self" },
-      }} />,
-      { width: 120, height: 2 },
-    );
-
-    await testSetup.renderOnce();
-    const frame = testSetup!.captureCharFrame();
-
-    expect(frame).toContain("v0.3.0 available");
-    expect(frame).toContain("starting download");
-    expect(frame).not.toContain("press u to update");
-  });
-
-  test("shows the manual npm command when self-update is disabled", async () => {
-    testSetup = await testRender(
-      <HeaderHarness updateAvailable={{
-        version: "0.3.0",
-        tagName: "v0.3.0",
-        downloadUrl: "https://example.com/gloomberb",
-        publishedAt: "2026-04-01T00:00:00.000Z",
-        updateAction: { kind: "manual", command: "npm install -g gloomberb@latest" },
-      }} />,
-      { width: 120, height: 2 },
-    );
-
-    await testSetup.renderOnce();
-    const frame = testSetup!.captureCharFrame();
-
-    expect(frame).toContain("v0.3.0 available");
-    expect(frame).toContain("run npm install -g gloomberb@latest");
-    expect(frame).not.toContain("press u to update");
-  });
-
-  test("shows update download progress and notices", async () => {
-    testSetup = await testRender(
-      <HeaderHarness
-        updateAvailable={{
-          version: "0.3.0",
-          tagName: "v0.3.0",
-          downloadUrl: "https://example.com/gloomberb",
-          publishedAt: "2026-04-01T00:00:00.000Z",
-          updateAction: { kind: "self" },
-        }}
-        updateProgress={{ phase: "downloading", percent: 42 }}
-      />,
-      { width: 120, height: 2 },
-    );
-
-    await testSetup.renderOnce();
-    expect(testSetup.captureCharFrame()).toContain("Downloading v0.3.0: 42%");
-
-    testSetup.renderer.destroy();
-
-    testSetup = await testRender(
-      <HeaderHarness updateCheckInProgress />,
-      { width: 120, height: 2 },
-    );
-
-    await testSetup.renderOnce();
-    expect(testSetup.captureCharFrame()).toContain("Checking for updates...");
-
-    testSetup.renderer.destroy();
-
-    testSetup = await testRender(
-      <HeaderHarness updateNotice="Already on v0.3.1" />,
-      { width: 120, height: 2 },
-    );
-
-    await testSetup.renderOnce();
-    expect(testSetup.captureCharFrame()).toContain("Already on v0.3.1");
-  });
-});
-
 describe("Shell", () => {
   test("uses the desktop titlebar overlay height for shell chrome math", () => {
     expect(resolveAppHeaderHeightCells({ titleBarOverlay: true, cellHeightPx: 18 })).toBe(28 / 18);
@@ -716,7 +609,6 @@ describe("Shell", () => {
     await emitKeypress({
       name: "f",
       key: "f",
-      meta: true,
       super: true,
       shift: true,
       targetEditable: true,
@@ -1330,10 +1222,7 @@ describe("Shell", () => {
     );
 
     await testSetup.renderOnce();
-    await act(async () => {
-      testSetup!.mockInput.pressKey("w", { meta: true });
-      await testSetup!.renderOnce();
-    });
+    await emitKeypress({ name: "w", super: true });
 
     const updateLayout = actions.find((action) => action.type === "UPDATE_LAYOUT");
     expect(updateLayout?.layout.instances.map((instance: { instanceId: string }) => instance.instanceId)).toEqual(["portfolio-list:main"]);

package/src/components/layout/shell/index.tsx

@@ -212,7 +212,6 @@ export function Shell({
 
   const {
     dockedPanes,
-    floatingPanes,
     paneMap,
     visibleFloatingPanes,
   } = useShellResolvedPanes({

package/src/components/layout/shell/menu.ts

@@ -3,7 +3,6 @@ import {
   applyDrop,
   floatPane,
   removePane,
-  type LayoutBounds,
   type ResolvedPane,
 } from "../../../plugins/pane-manager";
 import type { PluginRegistry } from "../../../plugins/registry";

package/src/components/layout/shell/terminal-pointer-runtime.ts

@@ -6,7 +6,6 @@ import type {
   LayoutBounds,
   ResolvedPane,
 } from "../../../plugins/pane-manager";
-import type { LayoutConfig } from "../../../types/config";
 import {
   constrainFloatingRectToBounds,
   pointInRect,

package/src/components/onboarding/onboarding-wizard.tsx

@@ -81,9 +81,9 @@ export function OnboardingWizard({ config, pluginRegistry, onComplete }: Onboard
   }
 
   useEffect(() => {
-    if (editingField) {
-      setTimeout(() => inputRef.current?.focus(), 10);
-    }
+    if (!editingField) return;
+    const focusTimer = setTimeout(() => inputRef.current?.focus?.(), 10);
+    return () => clearTimeout(focusTimer);
   }, [editingField, portfolioSub, brokerFieldIdx]);
 
   useEffect(() => {

package/src/components/onboarding/wizard-keyboard.ts

@@ -72,7 +72,7 @@ export function useOnboardingKeyboard({
     }
 
     if (editingField) {
-      if (event.name === "return") {
+      if (event.name === "enter" || event.name === "return") {
         setEditingField(false);
         if (portfolioSub === "broker-fields" && selectedBrokerId) {
           const currentField = activeBrokerFields[brokerFieldIdx];
@@ -188,28 +188,7 @@ export function useOnboardingKeyboard({
         }
       }
       nextStep();
-    } else if (isBackNavigationKey(event)) {
-      if (step === "portfolio" && portfolioSub === "broker-sync") {
-        resetBrokerSync();
-        setPortfolioSub("broker-fields");
-        return;
-      }
-      if (step === "portfolio" && portfolioSub === "broker-fields") {
-        setPortfolioSub("broker-setup");
-        return;
-      }
-      if (step === "portfolio" && portfolioSub === "broker-setup") {
-        setPortfolioSub("broker-fields");
-        setBrokerFieldIdx(0);
-        return;
-      }
-      if (step === "portfolio" && portfolioSub !== "choose") {
-        setPortfolioSub("choose");
-        setBrokerFieldIdx(0);
-        return;
-      }
-      prevStep();
-    } else if (event.name === "left") {
+    } else if (isBackNavigationKey(event) || event.name === "left") {
       if (step === "portfolio" && portfolioSub === "broker-sync") {
         resetBrokerSync();
         setPortfolioSub("broker-fields");

package/src/components/price-selector-dialog.tsx

@@ -87,7 +87,7 @@ export function PriceSelectorDialog({
   const inputRef = useRef<InputRenderable>(null);
 
   useEffect(() => {
-    if (mode === "input") inputRef.current?.focus();
+    if (mode === "input") inputRef.current?.focus?.();
   }, [mode]);
 
   useDialogKeyboard((event) => {
@@ -108,7 +108,7 @@ export function PriceSelectorDialog({
           setMode("input");
           setIndex(CUSTOM_INDEX);
         }
-      } else if (event.name === "return") {
+      } else if (event.name === "enter" || event.name === "return") {
         if (presets[index]) {
           resolve(String(presets[index].value));
         }
@@ -124,7 +124,7 @@ export function PriceSelectorDialog({
       if (event.name === "up" || (event.name === "tab" && presets.length > 0)) {
         setMode("list");
         setIndex(presets.length - 1);
-      } else if (event.name === "return") {
+      } else if (event.name === "enter" || event.name === "return") {
         resolve(customValue.trim());
       }
     }

package/src/components/ticker/badge/text.tsx

@@ -4,7 +4,6 @@ import { TickerBadge } from "./index";
 import { ExternalLinkText, openUrl } from "../../ui";
 import { tokenizeInlineContent } from "../../../utils/inline-content-tokenizer";
 import type { InlineTickerCatalogEntry } from "../../../state/hooks/inline-tickers";
-import { displayWidth } from "../../../utils/format";
 import { splitLongTextSegmentByDisplayWidth } from "../../../utils/text-wrap";
 import { blendHex, colors } from "../../../theme/colors";
 

package/src/components/toggle-list.tsx

@@ -1,6 +1,6 @@
-import { Box, Text, useUiHost } from "../ui";
-import { TextAttributes } from "../ui";
-import { blendHex, colors } from "../theme/colors";
+import { Box, useUiHost } from "../ui";
+import { colors } from "../theme/colors";
+import { Checkbox } from "./ui/checkbox";
 import { ListView, type ListRowState, type ListViewItem } from "./ui/list-view";
 
 interface ToggleListItem {
@@ -36,23 +36,14 @@ function DesktopToggleRow({
   state,
   rowIdPrefix,
   enabled,
+  onPress,
 }: {
   item: ListViewItem;
   state: ListRowState;
   rowIdPrefix?: string;
   enabled: boolean;
+  onPress: () => void;
 }) {
-  const checkboxBorder = enabled
-    ? colors.borderFocused
-    : state.selected
-    ? colors.textMuted
-    : colors.border;
-  const textColor = state.disabled
-    ? colors.textMuted
-    : state.selected
-    ? colors.text
-    : colors.textDim;
-
   return (
     <Box
       id={rowIdPrefix ? `${rowIdPrefix}:${item.id}` : undefined}
@@ -67,48 +58,15 @@ function DesktopToggleRow({
         opacity: state.disabled ? 0.55 : 1,
       }}
     >
-      <Box
-        alignItems="center"
-        justifyContent="center"
-        backgroundColor={enabled ? colors.borderFocused : "transparent"}
-        style={{
-          width: 16,
-          height: 16,
-          minWidth: 16,
-          alignSelf: "center",
-          border: `1px solid ${checkboxBorder}`,
-          borderRadius: 4,
-          boxShadow: enabled
-            ? `inset 0 1px 0 ${blendHex(colors.borderFocused, colors.textBright, 0.28)}`
-            : `inset 0 1px 0 ${blendHex(colors.bg, colors.textBright, 0.05)}`,
-        }}
-      >
-        {enabled && (
-          <Text
-            fg={colors.bg}
-            attributes={TextAttributes.BOLD}
-            style={{ fontSize: 12, lineHeight: "14px", fontWeight: 800 }}
-          >
-            {"✓"}
-          </Text>
-        )}
-      </Box>
-      <Box minWidth={0} flexShrink={1}>
-        <Text
-          fg={textColor}
-          attributes={state.selected ? TextAttributes.BOLD : 0}
-          style={{
-            display: "block",
-            overflow: "hidden",
-            textOverflow: "ellipsis",
-            whiteSpace: "nowrap",
-            fontWeight: state.selected ? 700 : 500,
-            lineHeight: "16px",
-          }}
-        >
-          {item.label}
-        </Text>
-      </Box>
+      <Checkbox
+        label={item.label}
+        checked={enabled}
+        disabled={state.disabled}
+        active={state.selected}
+        width="100%"
+        variant="desktop"
+        onChange={onPress}
+      />
     </Box>
   );
 }
@@ -161,6 +119,13 @@ export function ToggleList({
       }}
       renderRow={(item, state, index) => {
         const toggleItem = items.find((entry) => entry.id === item.id);
+        const activate = (event?: { stopPropagation?: () => void; preventDefault?: () => void }) => {
+          event?.stopPropagation?.();
+          event?.preventDefault?.();
+          if (state.disabled) return;
+          onSelect?.(index);
+          onToggle?.(item.id);
+        };
         if (isDesktopWeb) {
           return (
             <DesktopToggleRow
@@ -168,33 +133,24 @@ export function ToggleList({
               state={state}
               rowIdPrefix={rowIdPrefix}
               enabled={toggleItem?.enabled === true}
+              onPress={() => activate()}
             />
           );
         }
 
-        const checked = toggleItem?.enabled ? "\u2713" : " ";
-        const activate = (event: any) => {
-          event.stopPropagation?.();
-          if (state.disabled) return;
-          onSelect?.(index);
-          onToggle?.(item.id);
-        };
         return (
           <Box
             id={rowIdPrefix ? `${rowIdPrefix}:${item.id}` : undefined}
             flexDirection="row"
             onMouseDown={activate}
           >
-            <Text fg={state.selected ? colors.selectedText : colors.textDim}>
-              {state.selected ? "\u25b8 " : "  "}
-            </Text>
-            <Text
-              fg={state.selected ? colors.text : colors.textDim}
-              attributes={state.selected ? TextAttributes.BOLD : 0}
-              onMouseDown={activate}
-            >
-              {`[${checked}] ${item.label}`}
-            </Text>
+            <Checkbox
+              label={item.label}
+              checked={toggleItem?.enabled === true}
+              disabled={state.disabled}
+              active={state.selected}
+              onChange={() => activate()}
+            />
           </Box>
         );
       }}

package/src/components/ui/button.tsx

@@ -14,6 +14,7 @@ export interface ButtonProps {
   active?: boolean;
   shortcut?: string;
   width?: number;
+  height?: number | string;
 }
 
 function resolveButtonColors(variant: ButtonVariant, active: boolean, disabled: boolean) {
@@ -45,6 +46,7 @@ export function Button({
   active = false,
   shortcut,
   width,
+  height,
 }: ButtonProps) {
   useRemoteUiNode({
     role: "button",
@@ -68,6 +70,7 @@ export function Button({
         active={active}
         shortcut={shortcut}
         width={width}
+        height={height}
       />
     );
   }
@@ -77,7 +80,7 @@ export function Button({
   return (
     <Box
       width={width}
-      height={1}
+      height={height ?? 1}
       flexDirection="row"
       backgroundColor={palette.bg}
       onMouseDown={() => {

package/src/components/ui/checkbox.tsx

@@ -0,0 +1,76 @@
+import { type ComponentType } from "react";
+import { Box, Text, TextAttributes, useUiHost, type HostCheckboxProps } from "../../ui";
+import { colors, hoverBg } from "../../theme/colors";
+import { useRemoteUiNode } from "../../remote/semantic-tree";
+
+export type CheckboxProps = HostCheckboxProps;
+
+export function Checkbox({
+  label,
+  displayLabel,
+  checked,
+  onChange,
+  disabled = false,
+  active = false,
+  description,
+  width,
+  variant = "default",
+}: CheckboxProps) {
+  useRemoteUiNode({
+    role: "checkbox",
+    label,
+    disabled,
+    actions: {
+      toggle: () => {
+        if (!disabled) onChange?.(!checked);
+      },
+      press: () => {
+        if (!disabled) onChange?.(!checked);
+      },
+    },
+    metadata: { checked, active, variant },
+  });
+
+  const HostCheckbox = useUiHost().Checkbox as ComponentType<CheckboxProps> | undefined;
+  if (HostCheckbox) {
+    return (
+      <HostCheckbox
+        label={label}
+        displayLabel={displayLabel}
+        checked={checked}
+        onChange={onChange}
+        disabled={disabled}
+        active={active}
+        description={description}
+        width={width}
+        variant={variant}
+      />
+    );
+  }
+
+  const marker = checked ? "\u2713" : " ";
+  const visibleLabel = displayLabel ?? label;
+  const fg = disabled ? colors.textMuted : active ? colors.textBright : colors.text;
+  const descriptionWidth = typeof width === "number" ? Math.max(20, width - 2) : 28;
+  return (
+    <Box
+      flexDirection="column"
+      width={width}
+      backgroundColor={active && !disabled ? hoverBg() : undefined}
+      onMouseDown={(event?: { preventDefault?: () => void; stopPropagation?: () => void }) => {
+        event?.preventDefault?.();
+        event?.stopPropagation?.();
+        if (!disabled) onChange?.(!checked);
+      }}
+    >
+      <Text fg={fg} attributes={active ? TextAttributes.BOLD : 0}>
+        {`${active ? "> " : "  "}[${marker}] ${visibleLabel}`}
+      </Text>
+      {description ? (
+        <Text fg={colors.textMuted} wrapText width={descriptionWidth}>
+          {description}
+        </Text>
+      ) : null}
+    </Box>
+  );
+}

package/src/components/ui/choice-dialog.tsx

@@ -37,6 +37,15 @@ function getInitialChoiceIndex(choices: ChoiceDialogChoice[], selectedChoiceId:
   return selectedIndex >= 0 ? selectedIndex : 0;
 }
 
+function choiceDialogWidth(title: string, choices: ChoiceDialogChoice[]): number {
+  const contentWidth = Math.max(
+    title.length,
+    ...choices.map((choice) => choice.label.length + (choice.detail ? choice.detail.length + 4 : 0)),
+    ...choices.map((choice) => getChoiceDescription(choice).length),
+  );
+  return Math.max(34, Math.min(76, contentWidth + 4));
+}
+
 export function ChoiceDialog({
   resolve,
   title,
@@ -57,6 +66,7 @@ export function ChoiceDialog({
     detail: choice.detail,
     disabled: choice.disabled,
   })), [choices]);
+  const width = useMemo(() => choiceDialogWidth(title, choices), [choices, title]);
 
   useEffect(() => {
     setIndex((current) => clampChoiceIndex(current, choices.length));
@@ -81,19 +91,21 @@ export function ChoiceDialog({
   });
 
   return (
-    <DialogFrame title={title} footer={footer}>
-      <Box flexDirection="column">
+    <DialogFrame title={title} footer={footer} showTitleDivider={false}>
+      <Box flexDirection="column" width={width}>
         <ListView
           items={items}
           selectedIndex={selectedIndex}
           bgColor={bgColor}
           emptyMessage="No choices."
+          rowGap={0}
+          surface="framed"
           selectOnHover
           onSelect={setIndex}
           onActivate={(_, nextIndex) => activateChoice(choices[nextIndex])}
         />
         <Box height={1} />
-        <Text fg={colors.textDim}>{getChoiceDescription(selectedChoice)}</Text>
+        <Text fg={colors.textDim} wrapText width={width}>{getChoiceDescription(selectedChoice)}</Text>
       </Box>
     </DialogFrame>
   );

package/src/components/ui/frame.tsx

@@ -11,7 +11,7 @@ export interface DialogFrameProps {
   showTitleDivider?: boolean;
 }
 
-export function DialogFrame({ title, children, footer, showTitleDivider = true }: DialogFrameProps) {
+export function DialogFrame({ title, children, footer, showTitleDivider = false }: DialogFrameProps) {
   useThemeColors();
   const HostDialogFrame = useUiHost().DialogFrame as ComponentType<DialogFrameProps> | undefined;
   if (HostDialogFrame) {

package/src/components/ui/index.ts

@@ -6,6 +6,8 @@ export { DataTable } from "./data-table";
 export type { DataTableCell, DataTableColumn, DataTableProps } from "./data-table";
 
 export { Button } from "./button";
+export { Checkbox } from "./checkbox";
+export type { CheckboxProps } from "./checkbox";
 export { ShortcutHint } from "./shortcut-hint";
 
 export { MultiSelectDialogButton, MultiSelectDialogContent } from "./multi-select/dialog";

package/src/components/ui/message-composer.tsx

@@ -17,6 +17,7 @@ export interface MessageComposerProps {
   terminalBottomInset?: number;
   onFocusRequest?: () => void;
   onInput?: (value: string) => void;
+  onCursorChange?: () => void;
   onSubmit?: () => void;
   keyBindings?: Array<Record<string, unknown>>;
   wrapText?: boolean;
@@ -52,6 +53,7 @@ export function MessageComposer({
   terminalBottomInset = 0,
   onFocusRequest,
   onInput,
+  onCursorChange,
   onSubmit,
   keyBindings,
   wrapText = false,
@@ -91,6 +93,7 @@ export function MessageComposer({
         terminalBottomInset={terminalBottomInset}
         onFocusRequest={onFocusRequest}
         onInput={onInput}
+        onCursorChange={onCursorChange}
         onSubmit={onSubmit}
         keyBindings={keyBindings}
         wrapText={wrapText}
@@ -149,6 +152,7 @@ export function MessageComposer({
             focusedBackgroundColor={colors.bg}
             cursorColor={colors.textBright}
             onInput={handleInput}
+            onCursorChange={onCursorChange}
             keyBindings={keyBindings}
             onSubmit={onSubmit}
             wrapText={wrapText}

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

@@ -17,6 +17,7 @@ export interface NativeSelectProps {
   value: string;
   options: NativeSelectOption[];
   width?: number | string;
+  height?: number;
   includeUnsetOption?: boolean;
   selectRef?: (element: NativeSelectElement | null) => void;
   onFocus?: () => void;
@@ -41,6 +42,7 @@ export function NativeSelect({
   value,
   options,
   width = 184,
+  height = 28,
   includeUnsetOption = false,
   selectRef,
   onFocus,
@@ -49,7 +51,7 @@ export function NativeSelect({
   const hasCurrentValue = options.some((option) => option.value === value);
   const style: CSSProperties = {
     width,
-    height: 28,
+    height,
     color: colors.text,
     backgroundColor: blendHex(colors.panel, colors.textBright, 0.06),
     border: `1px solid ${colors.border}`,
@@ -66,7 +68,7 @@ export function NativeSelect({
 
   return (
     <Box
-      height="28px"
+      height={`${height}px`}
       flexDirection="row"
       alignItems="center"
       onMouseDown={(event: any) => {

package/src/components/ui/page-stack-view.tsx

@@ -88,7 +88,7 @@ export function PageStackView({
     >
       <Box height={1} flexDirection="row">
         <Box
-          onMouseDown={(event) => {
+          onMouseDown={(event: { preventDefault?: () => void; stopPropagation?: () => void }) => {
             goBack(event);
           }}
           backgroundColor={colors.selected}