Keyboard and commands
Shortcuts, the search overlay, and working without a mouse.
Everything in Bridge works from the keyboard. ⌘K (Ctrl+K) opens network search from anywhere; Escape closes whatever is on top; arrow keys move through menus, tabs and charts.
The problem
Most of Bridge is looking someone up and acting on what you find. Done by mouse alone it's slow, and some people can't use a mouse at all. But shortcuts bring their own trouble: a single-key shortcut fires while someone is typing a note, and an Escape that closes the wrong layer throws work away.
What to do
- One shortcut to remember. ⌘K (Ctrl+K on Windows) opens "Search your network" from any page. There are no single-key shortcuts, so typing in a field can never set one off.
- Escape closes the top-most thing. A menu inside the search closes before the search; a drawer opened from a drawer closes before its parent.
- Tab between controls, arrows within them. Tab moves from one control to the next. Inside a menu, a row of tabs, a segmented control or a chart, the arrow keys move.
Which one do I use?
| Situation | Do this | Bridge example |
|---|---|---|
| Finding a person or organization from anywhere | ⌘K / Ctrl+K; the cursor starts in the search field | Search your network |
| Closing whatever is on top | Esc. One press closes one layer | The degree menu in search, then the search itself |
| Moving through a menu, tabs or a segmented control | Arrow keys; Enter or Space to choose | An organization's tabs; the 12w / 26w / 52w control |
| Reading a chart's bars | ← / →, Home / End; Esc hides the label | The contact growth chart on Outcomes |
| Stepping through weeks in the week drawer | ← / → while the drawer is open | The contacts you met in one week |
| A whole row that opens on click | Make it focusable; Enter or Space opens it | An Activity feed item |
| Wanting a shortcut for a frequent action | Don't add a single-key shortcut. ⌘K is the only global one | No "N for new" |
See it work
Live examples built from the package on the sample network. Click through them.
⌘K opens search, Esc closes it
Click anywhere in the example, then press ⌘K (Ctrl+K). Type a name, Tab to a result and press Enter. Esc closes the search.
Nothing opened yet.
Escape closes one layer at a time
Open the drawer, then its ⋮ menu. Press Esc twice and watch the log: the menu closes first, then the drawer.
- Nothing yet.
Tab between groups, arrows within them
Tab into the tabs, the segmented control and the menu. In each, the arrow keys move; Tab leaves the group.
Tab: people · Range: 12w
What to write
| Part | Rule | Example |
|---|---|---|
| Shortcut hint | Show it on the control it opens, in a small key box. | Search your network ⌘K |
| Key names | The symbol for Mac, the word for Windows, together where both apply. | ⌘K / Ctrl+K |
| Closing hint | Where a panel closes with Escape, the key box says Esc. | Esc |
| Search field | Say what can be found. | Search people and organizations |
Approved, not built yet
- No other single-key shortcuts for now, so typing in a field can never trigger one by accident.
Accessibility
- Every action works from the keyboard; menus, tabs, segmented controls and dialogs get their keys from Base UI.
- Focus is always visible: a 2px blue ring.
- Opening search puts the cursor in the field; closing a menu, dialog or drawer returns focus to the control that opened it.
- In a ConfirmDialog, focus starts on Cancel, so a habitual Enter never confirms.
- A row that opens on click only reacts to Enter or Space when the row itself has focus, so typing a space in a field inside it never opens it.
| Keys | What happens |
|---|---|
| ⌘K / Ctrl+K | Opens "Search your network" from any page. |
| Esc | Closes the top-most menu, search, dialog or drawer. |
| Tab / Shift+Tab | Next or previous control. |
| ← → ↑ ↓ | Move within a menu, tab row or segmented control. |
| Home / End | First or last tab; first or last bar on the growth chart. |
| Enter / Space | Choose the focused item or press the focused button. |
Components this uses
Each opens that component’s own page, with its options and code.
| Component | Its job here |
|---|---|
| SearchInput | The search field the cursor lands in. |
| ActionMenu | Arrow keys move between rows, typing jumps to a row, Esc closes and returns focus. |
| Tabs | ← / → move focus between tabs; Enter or Space opens one. |
| SegmentedControl | Arrow keys move between options. |
| ConfirmDialog | Focus starts on Cancel; Esc closes without acting. |
| Drawer | Keeps focus inside; Esc closes the top-most drawer. |
Not decided yet
Proposals for Aman to approve, change or reject. Not rules.
- Whether search results should move with the arrow keys, as in other command palettes. Today people Tab through them.
Sources
- Bridge OS
network-search-bar.tsx,network-search-overlay.tsx - Bridge OS search overlay; relationship drawer
- Base UI; Bridge OS
contact-growth-chart.tsx - Bridge OS
network-search-overlay.tsx - Bridge OS
week-contacts-drawer.tsx - Bridge OS
contact-growth-chart.tsx - Bridge OS
activity-feed-item.tsx - ActionMenu and Tabs component guidance (handbook)
- Destructive actions pattern;
packages/ui/src/components/confirm-dialog.tsx - Proposals approved by Aman 2026-11-02.