Grouped Results

Command menu with two sectioned buckets of results, each prefixed by a category label.

mira
Files
mira-handoff.figFigma
brand-mira.pdfDoc

New here? Read the installation guide.

Import & use
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"
        }
      ]
    }
  ]}
/>

More Search pieces

View all Search
rowan

Members

Rowan Blake

Active · Clinic 2

Member

Rowan Blake · Intake notes

Updated 3 days ago

Document

Invoice #4821

Rowan Blake · Paid

Billing

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.

launchesc
Launch plan Q2Docs
launch-prepChannel
Laura NgLaunch lead
↑↓ to navigate

Command Palette

⌘K modal with a query bar, three typed results, and a keyboard-hint footer at the bottom.

Search members, invoices, notes…⌘K

Command Search Bar

A single-line search field with a leading magnifier, placeholder, and a monospace keyboard shortcut chip.

Search issues, docs, and threads…

Scoped Search

Combined control with a left scope dropdown and a wider query input sharing a single pill.

onboarding

Tabbed Results

Search header with category tabs that show per-tab counts and an underline for the active one.

Search docs and guides…
Trending

Trending Queries

Search field followed by a row of trending query chips led by a small flame label.

Markdown version