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.
Members
Rowan Blake
Active · Clinic 2
Rowan Blake · Intake notes
Updated 3 days ago
Invoice #4821
Rowan Blake · Paid
3 of 11 matches shown
New here? Read the installation guide.
import { Search24 } from "@/components/beste/piece/search24";
<Search24
query="rowan"
groupLabel="Members"
results={[
{
"title": "Rowan Blake",
"meta": "Active · Clinic 2",
"kind": "Member"
},
{
"title": "Rowan Blake · Intake notes",
"meta": "Updated 3 days ago",
"kind": "Document"
},
{
"title": "Invoice #4821",
"meta": "Rowan Blake · Paid",
"kind": "Billing"
}
]}
footer="3 of 11 matches shown"
/>Command menu with two sectioned buckets of results, each prefixed by a category label.
⌘K modal with a query bar, three typed results, and a keyboard-hint footer at the bottom.
Search field followed by a row of trending query chips led by a small flame label.
Search header with category tabs that show per-tab counts and an underline for the active one.