Search input with icon and optional keyboard shortcut hint.
Install
npx bouncekit@latest add searchbarImport
import { SearchBar } from "@/components/dashboard/search-bar"1. Copy the source file
Copy src/components/dashboard/search-bar.tsx into your project at the same path.
2. Install dependencies
Check the component's imports and install any missing packages.
3. Import and use
import { SearchBar } from "@/components/dashboard/search-bar"Make sure you have cn() from @/lib/utils available in your project.
Props
| Prop | Type | Required | Description |
|---|---|---|---|
placeholder | string | — | Placeholder text. |
value | string | — | Controlled value. |
onChange | (value: string) => void | — | Change handler. |
shortcut | string | — | Keyboard shortcut hint, e.g. "⌘K". |