Skip to main content

​
CommandMenu

A command palette component that provides fast, keyboard-driven search across all bookmarks. Built with cmdk.

​
Props

This component has no props. It manages its own internal state and reads from the BookmarkStore.

​
Usage

import CommandMenu from './components/CommandMenu'

<CommandMenu />

​
Features

  • Keyboard Shortcut: Opens with ⌘K (Mac) or Ctrl+K (Windows/Linux)
  • Multi-field Search: Searches across title, URL, and tags simultaneously
  • Empty State: Helpful message when no results match the search
  • Loading State: Shows loading indicator while fetching bookmarks
  • Favicon Display: Shows website icon for each bookmark
  • Fallback Handling: Gracefully handles missing favicons

​
Keyboard Shortcuts

  • ⌘K / Ctrl+K: Toggle command menu
  • Esc: Close the menu

​
Search Behavior

The command menu searches through:
  • Bookmark titles
  • Full URLs
  • All associated tags
The search is fuzzy and case-insensitive, making it easy to find bookmarks quickly.

​
Example Interaction

// User presses ⌘K
// Command menu opens

// User types "react"
// Shows all bookmarks with:
//   - "react" in the title
//   - "react" in the URL
//   - "react" as a tag

// User presses Enter
// Opens selected bookmark in new tab
// Menu automatically closes

​
Internal Components

​
CommandMenuFooter

Displays keyboard shortcuts at the bottom of the menu. This is an internal component that cannot be used separately. Shortcuts displayed:
  • ↑ ↓ to navigate
  • ↩ to open
  • esc to close

​
State Management

The component maintains the following internal state:
  • open: Boolean controlling menu visibility
  • search: Current search input value
It also reads from BookmarkStore:
  • bookmarks: Array of all bookmarks
  • loading: Loading state for bookmarks

​
Accessibility

  • Fully keyboard accessible
  • ARIA labels for screen readers
  • Focus management on open/close
  • Modal behavior prevents interaction with background content

Build docs developers (and LLMs) love

Get started for freeTalk to us