SearchInput
An enhanced input component for search functionality with built-in icon, clear button, and keyboard shortcut hints.
Preview
Installation
npm install @matrix-ui/componentsUsage
import { SearchInput } from '@matrix-ui/components'
<SearchInput placeholder="Search..." />Examples
Basic Search
With Keyboard Shortcut
Display a keyboard shortcut hint that disappears when the user starts typing.
Slash Shortcut
Loading State
Show a loading spinner while search results are being fetched.
With Clear Button
The clear button appears automatically when there is input. You can also press Escape to clear the input.