Saved Searches
Search popover listing named saved queries with pin or star markers and a raw query beneath.
Usage
The import and the props worth knowing about, in one place.
import { Search21 } from "@/components/beste/piece/search21";
<Search21
placeholder="Search issues…"
saved={[
{
"name": "My open issues",
"query": "assignee:me is:open",
"pinned": true
},
{
"name": "This week's bugs",
"query": "label:bug created:>7d"
},
{
"name": "Stale PRs",
"query": "is:pr draft:false updated:<14d"
}
]}
/>More Search pieces
View all SearchRecent Searches
Popover that opens on focus and lists prior queries with a clock icon and remove control.
Loading Results
Search popover mid-query with a spinner in the input and three shimmering skeleton rows.
Visual Search
Image-attached search bar with an attached file chip, camera capture, and a search icon button.
People Autocomplete
Mention-style popover listing matching people with avatars, role lines, and a presence dot.
Active Query
Focused search input with a typed query, blinking caret, hit counter, and clear button.
Members
Rowan Blake
Active · Clinic 2
Rowan Blake · Intake notes
Updated 3 days ago
Invoice #4821
Rowan Blake · Paid
3 of 11 matches shown
Search Results Panel
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.