AI

Command Menu

Owns the open state of a `CommandMenu` and binds the global ⌘K / Ctrl-K toggle.

Install

Copies the component source — plus its small internal deps — into your project. You own the code from the first minute.

terminal
npx lumora-ui@latest add command-menu

Import

Using the workspace package instead? Deep imports keep cold starts lean; the barrel is fully tree-shakable either way.

app/page.tsx
import { CommandMenu, useCommandMenu } from "@lumora/ui/ai/command-menu";
// or from the barrel:
import { CommandMenu, useCommandMenu } from "@lumora/ui";

Props worth knowing

useCommandMenu owns the open state and binds the global ⌘K/Ctrl-K toggle; spread its open/setOpen onto CommandMenu. items take { id, label, hint?, keywords?, group?, onSelect } and are fuzzy-filtered as you type. Props extend the natural HTML element, so className, event handlers, and aria attributes pass straight through.