Search box
An input that allows users to enter a keyword to search a website for specific content.
import { ... } from '@ag.ds-next/react/search-box';
Usage
Search box components can be imported via the search-box
entrypoint in the @ag.ds-next/react
package.
For example:
import { ... } from '@ag.ds-next/react/search-box';
Props
Prop | Type | Description |
---|---|---|
aria-label? | string | |
children? | ReactNode | |
onSubmit? | FormEventHandler<HTMLFormElement> |
Prop | Type | Description |
---|---|---|
id? | string | |
label? | stringDefault: "Search" | |
labelVisible? | booleanDefault: false | |
name? | string | |
onBlur? | FocusEventHandler<HTMLInputElement> | |
onChange? | ChangeEventHandler<HTMLInputElement> | |
onFocus? | FocusEventHandler<HTMLInputElement> | |
placeholder? | string | |
ref? | Ref<HTMLInputElement> | |
value? | string | number | readonly string[] |
Prop | Type | Description |
---|---|---|
children | string | |
iconOnly? | ResponsiveProp<boolean> | |
ref? | Ref<HTMLButtonElement> |
Source
You can view the full source code for this package on Github.