Installation
Usage
import NavbarWithSearch from "@/components/ruixen/navbar-with-search";
export default function MyNavbar() {
return <NavbarWithSearch />;
}Props
| Prop | Type | Default | Description |
|---|---|---|---|
logo | React.ReactNode | Default logo | Custom logo element |
links | { label: string; href: string; active?: boolean }[] | Default links | Navigation links array |
actions | React.ReactNode | Default buttons | Custom action buttons |
searchPlaceholder | string | "Search..." | Placeholder text for search input |
className | string | - | Additional CSS classes |
Features
- Integrated search input
- Keyboard shortcut indicator (⌘K)
- Clean, minimal design
- Responsive layout
- Light and dark mode support