SearchInput

A styled text input with topbar and sidebar filter variants.

Import

import { SearchInput } from "@gumtree/ui/SearchInput";

Props

PropTypeDefaultDescription
variant"topbar" | "sidebar""topbar"Visual style variant
placeholderstring-Placeholder text

Examples

Topbar Variant

Dark background input used in the top navigation bar.

<SearchInput variant="topbar" placeholder="Search or jump to…" />

Sidebar Variant

Light background input used in sidebar filters.

<SearchInput variant="sidebar" placeholder="Find a repository…" />