Component

SearchInput

Specialized input for search functionality with clear button and keyboard shortcuts.

tsx
import { SearchInput } from 'wss3-forge'

Usage

Use for filtering content or global search

Includes search icon and clear button

Debounce onChange for performance

Supports keyboard shortcuts


Examples

Basic Search

tsx
1const [query, setQuery] = useState('')
2
3<SearchInput
4 value={query}
5 onChange={setQuery}
6 placeholder="Search..."
7/>

Small Size

tsx
1<SearchInput
2 value={query}
3 onChange={setQuery}
4 placeholder="Quick search..."
5 size="sm"
6/>

With Pre-filled Value

tsx
1<SearchInput
2 value="React components"
3 onChange={setQuery}
4 placeholder="Search..."
5/>

Previous

Radio

Next

Select

Last updated: December 2025

Cookies

We use cookies to improve your experience and save your preferences.