SearchBar that includes an input field with a search icon and clear button, allowing users to easily search for specific items or content.
SearchBar
import { SearchBar } from '@lobehub/ui';SearchBar that includes an input field with a search icon and clear button, allowing users to easily search for specific items or content.
import { SearchBar } from '@lobehub/ui';The rest of the props of Input are exactly the same as the original input.
| Name | Description | Type | Default |
|---|---|---|---|
| classNames | -- | {input?:string;shortKey?:string} | -- |
| defaultValue | -- | string | -- |
| enableShortKey | Whether to enable the shortcut key to focus on the input | boolean | false |
| loading | -- | boolean | -- |
| onInputChange | -- | (value:string)=>void | -- |
| onSearch | Whether add spotlight background | (value:string)=>void | false |
| shortKey | The shortcut key to focus on the input. Only works if `enableShortKey` is true | string | "f" |
| spotlight | -- | boolean | -- |
| styles | -- | {input?:object;shortKey?:object} | -- |
| value | -- | string | -- |