Command menu with two sectioned buckets of results, each prefixed by a category label.
The import and the props worth knowing about, in one place.
import { Search10 } from "@/components/beste/piece/search10";
<Search10
query="mira"
groups={[
{
"group": "Files",
"items": [
{
"label": "mira-handoff.fig",
"hint": "Figma"
},
{
"label": "brand-mira.pdf",
"hint": "Doc"
}
]
}
]}
/>Members
Rowan Blake
Active · Clinic 2
Rowan Blake · Intake notes
Updated 3 days ago
Invoice #4821
Rowan Blake · Paid
3 of 11 matches shown
A search panel showing a typed query above a labelled group of results, each with a title, a meta line, and a kind chip, closing on a match count.
⌘K modal with a query bar, three typed results, and a keyboard-hint footer at the bottom.
Search header with category tabs that show per-tab counts and an underline for the active one.
Search field followed by a row of trending query chips led by a small flame label.