gloomberb 0.8.1 → 0.9.0

package/src/components/command-bar/routes/root/runtime.ts

@@ -8,10 +8,6 @@ import type { TickerSearchCandidate } from "../../../../tickers/search";
 import { matchPrefix, type Command } from "../../commands/registry";
 import type { ResultItem } from "../../list/model";
 import type { CommandBarRoute } from "../../workflow/types";
-import {
-  isLikelyPlainTickerSearch,
-  normalizeCommandTickerSearchText,
-} from "../ticker-search/results";
 import { useTickerSearchRouteResults } from "../ticker-search/route";
 import { buildRootResultModel, type RootResultModel } from "./results";
 import { useRootProviderSearch } from "./provider-search";
@@ -47,7 +43,6 @@ interface UseCommandBarRootRuntimeOptions {
   getTickers(): AppState["tickers"];
   hasPaneSettings(paneId: string): boolean;
   localTickerSearchResultItems(query?: string, options?: { category?: string; limit?: number }): ResultItem[];
-  mapTickerSearchCandidateToResultItem(candidate: TickerSearchCandidate): ResultItem;
   nativeListScrollRef: RefObject<ScrollBoxRenderable | null>;
   nonShortcutPaneTemplateItems(filterQuery?: string): ResultItem[];
   openModeRoute(screen: "ticker-search" | "plugins" | "layout", initialQuery?: string): void;
@@ -101,7 +96,6 @@ export function useCommandBarRootRuntime({
   getTickers,
   hasPaneSettings,
   localTickerSearchResultItems,
-  mapTickerSearchCandidateToResultItem,
   nativeListScrollRef,
   nonShortcutPaneTemplateItems,
   openModeRoute,
@@ -178,7 +172,6 @@ export function useCommandBarRootRuntime({
     getAvailablePaneShortcutTemplates,
     hasPaneSettings,
     localTickerSearchResultItems,
-    mapTickerSearchCandidateToResultItem,
     nonShortcutPaneTemplateItems,
     openModeRoute,
     paneShortcutItems,
@@ -206,7 +199,6 @@ export function useCommandBarRootRuntime({
     getAvailablePaneShortcutTemplates,
     hasPaneSettings,
     localTickerSearchResultItems,
-    mapTickerSearchCandidateToResultItem,
     nonShortcutPaneTemplateItems,
     openModeRoute,
     paneShortcutItems,
@@ -220,20 +212,10 @@ export function useCommandBarRootRuntime({
     tickerActionItems,
   ]);
 
-  const rootPlainTickerSearchArg = useMemo(() => {
-    if (activeMatch || rootShortcutIntent.kind !== "none" || !isLikelyPlainTickerSearch(rootQuery)) return null;
-    const normalizedQuery = normalizeCommandTickerSearchText(rootQuery);
-    const hasExactNonTickerResult = rootResultModel.items.some((item) => (
-      item.kind !== "ticker"
-      && item.kind !== "search"
-      && normalizeCommandTickerSearchText(item.label) === normalizedQuery
-    ));
-    return hasExactNonTickerResult ? null : rootQuery.trim();
-  }, [activeMatch, rootQuery, rootResultModel.items, rootShortcutIntent.kind]);
   const rootSecurityDescriptionArg = activeMatch?.command.id === "security-description" && activeMatch.arg.length >= 1
     ? activeMatch.arg
     : null;
-  const rootTickerSearchArg = rootSecurityDescriptionArg ?? rootPlainTickerSearchArg;
+  const rootTickerSearchArg = rootSecurityDescriptionArg;
 
   useEffect(() => {
     if (currentRoute) return;
@@ -272,7 +254,7 @@ export function useCommandBarRootRuntime({
     localTickerSearchResultItems,
     portfolios: state.config.portfolios,
     readTickerSearchCache,
-    rootPlainTickerSearchArg,
+    rootPlainTickerSearchArg: null,
     rootResultItems: rootResultModel.items,
     rootTickerSearchArg,
     tickers: state.tickers,

package/src/components/command-bar/routes/ticker-search/actions.ts

@@ -6,6 +6,7 @@ import {
   rankTickerSearchItems,
   upsertTickerFromSearchResult,
   type TickerSearchCandidate,
+  type TickerSearchInstrumentClass,
 } from "../../../../tickers/search";
 import type { ResultItem } from "../../list/model";
 import {
@@ -45,12 +46,15 @@ export function useCommandBarTickerSearchActions({
   }, [tickerRepository, dispatch, pluginRegistry.events, focusTicker, closeAll]);
 
   const mapTickerSearchCandidateToResultItem = useCallback((candidate: TickerSearchCandidate): ResultItem => {
+    const detail = formatTickerSearchDetail(candidate);
+    const right = formatTickerSearchRight(candidate);
+
     if (candidate.kind === "ticker" && candidate.ticker) {
       return {
         id: candidate.id,
         label: candidate.label,
-        detail: candidate.detail,
-        right: candidate.right,
+        detail,
+        right,
         category: candidate.category,
         kind: "ticker",
         secondaryAction: () => {
@@ -67,8 +71,8 @@ export function useCommandBarTickerSearchActions({
     return {
       id: candidate.id,
       label: candidate.label,
-      detail: candidate.detail,
-      right: candidate.right,
+      detail,
+      right,
       category: candidate.category,
       kind: "search",
       secondaryAction: () => openTickerResearch(candidate.result!, { forceNewPane: true }),
@@ -140,3 +144,37 @@ export function useCommandBarTickerSearchActions({
     writeTickerSearchCache,
   };
 }
+
+function formatTickerSearchRight(candidate: TickerSearchCandidate): string | undefined {
+  const assetClass = formatInstrumentClass(candidate.instrumentClass);
+  const exchange = candidate.exchangeLabel || candidate.primaryExchangeLabel || candidate.right || "";
+  if (!exchange) return assetClass;
+  if (assetClass === "Other") return exchange;
+  return `${assetClass} ${exchange}`;
+}
+
+function formatTickerSearchDetail(candidate: TickerSearchCandidate): string {
+  const metadata = [
+    formatInstrumentClass(candidate.instrumentClass),
+    candidate.exchangeLabel,
+    candidate.primaryExchangeLabel && candidate.primaryExchangeLabel !== candidate.exchangeLabel
+      ? candidate.primaryExchangeLabel
+      : null,
+  ].filter((value): value is string => !!value);
+  return metadata.length > 0
+    ? `${candidate.detail} | ${metadata.join(" | ")}`
+    : candidate.detail;
+}
+
+function formatInstrumentClass(instrumentClass: TickerSearchInstrumentClass): string {
+  switch (instrumentClass) {
+    case "equity":
+      return "Equity";
+    case "fund":
+      return "Fund";
+    case "derivative":
+      return "Derivative";
+    case "other":
+      return "Other";
+  }
+}

package/src/components/command-bar/routes/ticker-search/route.ts

@@ -65,7 +65,10 @@ export function useTickerSearchRouteResults(options: {
 
     const searchQuery = routeQuery.trim();
     if (!searchQuery) {
-      resetTickerSearchRoute();
+      searchRequestIdRef.current += 1;
+      setTickerSearchPending(false);
+      setTickerSearchResults(localTickerSearchResultItems(undefined, { limit: 8 }));
+      if (searchTimerRef.current) clearTimeout(searchTimerRef.current);
       return;
     }
 

package/src/components/command-bar/routing/launch-request.ts

@@ -1,17 +1,17 @@
 import { useEffect, useRef } from "react";
 import type { PluginRegistry } from "../../../plugins/registry";
+import type { AppState } from "../../../state/app/context";
 import type { CommandDef } from "../../../types/plugin";
 
-interface CommandBarPluginLaunchRequest {
-  kind: "plugin-command";
-  commandId: string;
-  sequence: number;
-}
-
 interface UseCommandBarLaunchRequestOptions {
   activeTickerSymbol: string | null;
-  commandBarLaunchRequest: CommandBarPluginLaunchRequest | null;
+  commandBarLaunchRequest: AppState["commandBarLaunchRequest"];
   commandBarOpen: boolean;
+  openModeRoute: (
+    screen: "ticker-search" | "plugins" | "layout",
+    initialQuery?: string,
+    payload?: Record<string, unknown>,
+  ) => void;
   openPluginCommandWorkflow: (
     command: CommandDef,
     options?: { values?: Record<string, string> },
@@ -23,6 +23,7 @@ export function useCommandBarLaunchRequest({
   activeTickerSymbol,
   commandBarLaunchRequest,
   commandBarOpen,
+  openModeRoute,
   openPluginCommandWorkflow,
   pluginRegistry,
 }: UseCommandBarLaunchRequestOptions) {
@@ -38,6 +39,11 @@ export function useCommandBarLaunchRequest({
     if (processedLaunchSequenceRef.current === launch.sequence) return;
     processedLaunchSequenceRef.current = launch.sequence;
 
+    if (launch.kind === "ticker-search") {
+      openModeRoute("ticker-search", launch.query ?? "");
+      return;
+    }
+
     const command = pluginRegistry.commands.get(launch.commandId);
     if (!command?.wizard || command.wizard.length === 0) return;
     let values: Record<string, string> | undefined;
@@ -53,6 +59,7 @@ export function useCommandBarLaunchRequest({
     activeTickerSymbol,
     commandBarLaunchRequest,
     commandBarOpen,
+    openModeRoute,
     openPluginCommandWorkflow,
     pluginRegistry,
   ]);

package/src/components/command-bar/routing/list-state.ts

@@ -125,9 +125,7 @@ function buildRouteListState(options: BuildRouteListStateOptions): ListScreenSta
         };
       }
       case "ticker-search": {
-        const results = currentRoute.query.trim()
-          ? tickerSearchResults.map((item) => adaptTickerSearchRouteResult(item, currentRoute.payload))
-          : [];
+        const results = tickerSearchResults.map((item) => adaptTickerSearchRouteResult(item, currentRoute.payload));
         const emptyState = getEmptyState("search", currentRoute.query, currentRoute.query);
         return {
           kind: "mode",

package/src/components/command-bar/surface/index.test.tsx

@@ -81,13 +81,35 @@ describe("CommandBar", () => {
 
     const frame = testSetup.captureCharFrame();
     expect(frame).toContain("Commands");
-    expect(frame).toContain("Tickers");
-    expect(frame).toContain("AAPL");
+    expect(frame).not.toContain("Tickers");
     expect(frame).toContain("Panes");
     expect(frame).toContain("Portfolio");
     expect(frame).toContain("Help");
   });
 
+  test("keeps generic command filtering separate from ticker search", async () => {
+    const searchQueries: string[] = [];
+    testSetup = await testRender(<CommandBarHarness
+      query="MSFT"
+      dataProvider={makeDataProvider(async (query) => {
+        searchQueries.push(query);
+        return [];
+      })}
+    />, {
+      width: 80,
+      height: 24,
+    });
+
+    await testSetup.renderOnce();
+    await Bun.sleep(260);
+    await testSetup.renderOnce();
+
+    const frame = testSetup.captureCharFrame();
+    expect(frame).not.toContain("Tickers");
+    expect(frame).not.toContain("Microsoft Corp.");
+    expect(searchQueries).toEqual([]);
+  });
+
   test("runs check for updates from the command bar", async () => {
     const calls: number[] = [];
 
@@ -416,6 +438,56 @@ describe("CommandBar", () => {
     expect(frame).toContain("AMD");
   });
 
+  test("opens ticker search from a launch request with saved ticker metadata", async () => {
+    testSetup = await testRender(<CommandBarHarness
+      query=""
+      extraTickers={[makeTicker("BRK.B", "Berkshire Hathaway Inc.", {
+        exchange: "NYSE",
+        assetCategory: "STK",
+      })]}
+      configureState={(state) => ({
+        ...state,
+        commandBarLaunchRequest: {
+          kind: "ticker-search",
+          query: "",
+          sequence: 1,
+        },
+      })}
+    />, {
+      width: 100,
+      height: 24,
+    });
+
+    const frame = await waitForFrameToContain("Security Description");
+    expectSingleBackControl(frame);
+    expect(frame).toContain("BRK.B");
+    expect(frame).toContain("Equity NYSE");
+  });
+
+  test("opens ticker search when activating the Ticker Research pane item without a ticker", async () => {
+    testSetup = await testRender(<CommandBarHarness query="ticker research" />, {
+      width: 100,
+      height: 24,
+    });
+
+    await testSetup.renderOnce();
+    const rootFrame = testSetup.captureCharFrame();
+    const tickerResearchRow = rootFrame
+      .split("\n")
+      .find((line) => line.includes("Ticker Research"));
+    expect(tickerResearchRow).toMatch(/\bT\s*$/);
+
+    await act(async () => {
+      testSetup!.mockInput.pressEnter();
+      await testSetup!.renderOnce();
+    });
+
+    const frame = testSetup.captureCharFrame();
+    expectSingleBackControl(frame);
+    expect(frame).toContain("Security Description");
+    expect(frame).toContain("Search tickers");
+  });
+
   test("keeps typed prefixes in the root query until a result is activated", async () => {
     testSetup = await testRender(<CommandBarHarness query="DES " />, {
       width: 80,
@@ -763,8 +835,8 @@ describe("CommandBar", () => {
     const rows = frame.split("\n");
     const savedHeadings = frame.split("\n").filter((line) => line.trim() === "Saved");
     const otherListingsHeadings = frame.split("\n").filter((line) => line.trim() === "Other Listings");
-    const aaplRow = rows.findIndex((line) => line.trimStart().startsWith("AAPL") && line.includes("NASDAQ"));
-    const appRow = rows.findIndex((line) => line.trimStart().startsWith("APP") && line.includes("NASDAQ"));
+    const aaplRow = rows.findIndex((line) => line.trimStart().startsWith("AAPL"));
+    const appRow = rows.findIndex((line) => line.trimStart().startsWith("APP"));
     expect(savedHeadings).toHaveLength(1);
     expect(otherListingsHeadings).toHaveLength(1);
     expect(aaplRow).toBeGreaterThanOrEqual(0);

package/src/components/command-bar/surface/index.tsx

@@ -110,7 +110,6 @@ export function CommandBar({
     getWorkflowFieldStringValue,
     getWorkflowInputRef,
     localTickerSearchResultItems,
-    mapTickerSearchCandidateToResultItem,
     moveWorkflowFocus,
     nonShortcutPaneTemplateItems,
     openInlineConfirm,
@@ -193,7 +192,6 @@ export function CommandBar({
     getTickers: getTickerSearchTickers,
     hasPaneSettings,
     localTickerSearchResultItems,
-    mapTickerSearchCandidateToResultItem,
     nativeListScrollRef,
     nonShortcutPaneTemplateItems,
     openModeRoute,

package/src/components/command-bar/surface/pane.test.tsx

@@ -158,6 +158,7 @@ describe("CommandBar pane and layout routes", () => {
     expect(frame).toContain("Float Pane");
     expect(frame).toContain("Undo Layout Change");
     expect(frame).toContain("Current Layout");
+    expect(frame).toContain("Close All Floating Panes");
   });
 
   test("runs layout actions directly from root search", async () => {

package/src/components/command-bar/surface/test-harness.tsx

@@ -174,6 +174,7 @@ function makePluginRegistry(hasPaneSettings: (paneId: string) => boolean = () =>
         paneId: TICKER_RESEARCH_PANE_ID,
         label: "Ticker Research",
         description: "Open another research pane",
+        shortcut: { prefix: "T", argPlaceholder: "ticker", argKind: "ticker" },
       }],
       ["new-chat-pane", {
         id: "new-chat-pane",

package/src/components/command-bar/view-model.ts

@@ -40,7 +40,7 @@ export function resolveCommandBarMode(query: string, commandList?: Command[]): C
   const match = matchPrefix(query, commandList);
 
   if (!query.trim()) {
-    return { kind: "default", badge: "BROWSE", hint: "Type a command, ticker, or prefix" };
+    return { kind: "default", badge: "BROWSE", hint: "Type a command or prefix" };
   }
 
   if (!match) {
@@ -100,9 +100,9 @@ export function getEmptyState(mode: CommandBarMode, query: string, searchQuery?:
       return { label: "No layout actions match", detail: query.trim() || "Focused-pane and layout actions will appear here" };
     default:
       if (query.trim()) {
-        return { label: `No matches for "${query.trim()}"`, detail: "Try a ticker, command name, or prefix" };
+        return { label: `No matches for "${query.trim()}"`, detail: "Try a command name or prefix. Use T for ticker search" };
       }
-      return { label: "No results yet", detail: "Recent tickers and suggested commands will appear here" };
+      return { label: "No results yet", detail: "Suggested commands will appear here" };
   }
 }
 

package/src/components/data-table/stack-view.test.tsx

@@ -67,18 +67,18 @@ function Harness() {
             )
           }
           detailTitle={openRow?.title}
-          selectedIndex={selectedIndex}
-          onSelectIndex={(index) => setSelectedIndex(index)}
-          onActivateIndex={(_index, row) => setOpenRow(row)}
+          selection={{
+            kind: "index",
+            selectedIndex,
+            onChange: (index) => setSelectedIndex(index),
+          }}
+          onActivate={(row) => setOpenRow(row)}
           columns={columns}
           items={rows}
           sortColumnId={null}
           sortDirection="asc"
           onHeaderClick={() => {}}
           getItemKey={(row) => row.id}
-          isSelected={(_row, index) => index === selectedIndex}
-          onSelect={(_row, index) => setSelectedIndex(index)}
-          onActivate={(row) => setOpenRow(row)}
           renderCell={(row): DataTableCell => ({ text: row.title })}
           emptyStateTitle="No rows"
           showHorizontalScrollbar={false}
@@ -90,13 +90,14 @@ function Harness() {
 
 function GroupedHarness() {
   const [selectedIndex, setSelectedIndex] = useState(0);
+  const [cursorIndex, setCursorIndex] = useState(0);
   const state = createInitialState(
     createDefaultConfig("/tmp/gloomberb-data-table-stack-view-grouped-test"),
   );
   const columns: Column[] = [
     { id: "title", label: "Title", width: 20, align: "left" },
   ];
-  const selectedTitle = groupedRows[selectedIndex]?.title ?? "none";
+  const selectedTitle = groupedRows[cursorIndex]?.title ?? "none";
 
   return (
     <AppContext value={{ state, dispatch: () => {} }}>
@@ -106,8 +107,12 @@ function GroupedHarness() {
           detailOpen={false}
           onBack={() => {}}
           detailContent={<Box flexGrow={1} />}
-          selectedIndex={selectedIndex}
-          onSelectIndex={(index) => setSelectedIndex(index)}
+          selection={{
+            kind: "index",
+            selectedIndex,
+            onChange: (index) => setSelectedIndex(index),
+          }}
+          onCursorChange={(_row, index) => setCursorIndex(index)}
           isNavigable={(row) => row.type !== "section"}
           rootAfter={
             <Box height={1}>
@@ -120,8 +125,6 @@ function GroupedHarness() {
           sortDirection="asc"
           onHeaderClick={() => {}}
           getItemKey={(row) => row.id}
-          isSelected={(_row, index) => index === selectedIndex}
-          onSelect={(_row, index) => setSelectedIndex(index)}
           renderSectionHeader={(row) => row.type === "section"
             ? { text: row.title }
             : null}

package/src/components/data-table/stack-view.tsx

@@ -10,13 +10,12 @@ import { PageStackView, type DataTableColumn } from "../ui";
 export interface DataTableStackViewProps<
   T,
   C extends DataTableColumn = DataTableColumn,
-> extends Omit<DataTableViewProps<T, C>, "focused" | "selectedIndex"> {
+> extends Omit<DataTableViewProps<T, C>, "focused"> {
   focused: boolean;
   detailOpen: boolean;
   onBack: () => void;
   detailContent: ReactNode;
   detailTitle?: string;
-  selectedIndex: number;
   onDetailKeyDown?: (event: DataTableKeyEvent) => boolean | void;
 }
 

package/src/components/data-table/view.test.tsx

@@ -45,21 +45,27 @@ afterEach(async () => {
 
 function Harness() {
   const [selectedIndex, setSelectedIndex] = useState(1);
+  const [cursorIndex, setCursorIndex] = useState(1);
   const [activatedTitle, setActivatedTitle] = useState("");
   const state = createInitialState(
     createDefaultConfig("/tmp/gloomberb-data-table-view-test"),
   );
   const selectedTitle = rows[selectedIndex]?.title ?? "none";
+  const cursorTitle = rows[cursorIndex]?.title ?? "none";
 
   return (
     <AppContext value={{ state, dispatch: () => {} }}>
       <PaneInstanceProvider paneId="data-table-view-test">
         <DataTableView<Row, Column>
           focused
-          selectedIndex={selectedIndex}
           isNavigable={(row) => row.type === "row"}
-          onSelectIndex={(index) => setSelectedIndex(index)}
-          onActivateIndex={(_index, row) => {
+          selection={{
+            kind: "index",
+            selectedIndex,
+            onChange: (index) => setSelectedIndex(index),
+          }}
+          onCursorChange={(_row, index) => setCursorIndex(index)}
+          onActivate={(row) => {
             if (row.type === "row") setActivatedTitle(row.title);
           }}
           columns={columns}
@@ -68,8 +74,6 @@ function Harness() {
           sortDirection="asc"
           onHeaderClick={() => {}}
           getItemKey={(row) => row.id}
-          isSelected={(_row, index) => index === selectedIndex}
-          onSelect={(_row, index) => setSelectedIndex(index)}
           renderSectionHeader={(row) => row.type === "section"
             ? { text: row.title }
             : null}
@@ -79,7 +83,7 @@ function Harness() {
           emptyStateTitle="No rows"
           rootAfter={
             <Box height={1}>
-              <Text>{`selected=${selectedTitle} activated=${activatedTitle}`}</Text>
+              <Text>{`cursor=${cursorTitle} selected=${selectedTitle} activated=${activatedTitle}`}</Text>
             </Box>
           }
         />
@@ -102,19 +106,21 @@ function LargeSelectionHarness({
       <PaneInstanceProvider paneId="data-table-view-large-test">
         <DataTableView<Row, Column>
           focused
-          selectedIndex={500}
+          selection={{
+            kind: "index",
+            selectedIndex: 500,
+            onChange: () => {},
+          }}
           columns={columns}
           items={largeRows}
           sortColumnId={null}
           sortDirection="asc"
           onHeaderClick={() => {}}
           getItemKey={(row) => row.id}
-          isSelected={(_row, index) => {
+          renderCell={(row, _column, index): DataTableCell => {
             onIsSelected();
-            return index === 500;
+            return { text: row.title + (index === 500 ? "" : "") };
           }}
-          onSelect={() => {}}
-          renderCell={(row): DataTableCell => ({ text: row.title })}
           emptyStateTitle="No rows"
         />
       </PaneInstanceProvider>
@@ -190,24 +196,24 @@ describe("DataTableView", () => {
     testSetup = await testRender(<Harness />, { width: 60, height: 12 });
 
     await renderSettled();
-    expect(testSetup.captureCharFrame()).toContain("selected=First row");
+    expect(testSetup.captureCharFrame()).toContain("cursor=First row selected=First row");
 
     await emitKeypress({ name: "down", sequence: "\u001B[B" });
     await renderSettled();
-    expect(testSetup.captureCharFrame()).toContain("selected=Second row");
+    expect(testSetup.captureCharFrame()).toContain("cursor=Second row selected=First row");
 
     await emitKeypress({ name: "up", sequence: "\u001B[A", meta: true });
     await renderSettled();
-    expect(testSetup.captureCharFrame()).toContain("selected=Second row");
+    expect(testSetup.captureCharFrame()).toContain("cursor=Second row selected=First row");
 
     await emitKeypress({ name: "up", sequence: "\u001B[A" });
     await renderSettled();
-    expect(testSetup.captureCharFrame()).toContain("selected=First row");
+    expect(testSetup.captureCharFrame()).toContain("cursor=First row selected=First row");
 
     await emitKeypress({ name: "j", sequence: "j" });
     await emitKeypress({ name: "k", sequence: "k" });
     await renderSettled();
-    expect(testSetup.captureCharFrame()).toContain("selected=First row");
+    expect(testSetup.captureCharFrame()).toContain("cursor=First row selected=First row");
 
     await emitKeypress({ name: "enter", sequence: "\r" });
     await renderSettled();
@@ -215,11 +221,11 @@ describe("DataTableView", () => {
 
     await emitKeypress({ name: "j", sequence: "j" });
     await renderSettled();
-    expect(testSetup.captureCharFrame()).toContain("selected=Second row activated=First row");
+    expect(testSetup.captureCharFrame()).toContain("cursor=Second row selected=First row activated=First row");
 
     await emitKeypress({ name: "enter", sequence: "\r", defaultPrevented: true });
     await renderSettled();
-    expect(testSetup.captureCharFrame()).toContain("selected=Second row activated=First row");
+    expect(testSetup.captureCharFrame()).toContain("cursor=Second row selected=First row activated=First row");
   });
 
   test("keeps selection current across repeated keypresses before the next render", async () => {