BRAID
Braid Logo
 

Autosuggest

id
Required
string
value
Required
AutosuggestValue<Value>
suggestions
Required
{
message: string;
} | Suggestions<Value> | (value: AutosuggestValue<Value>) => LegacyMessageSuggestion | Suggestions<Value>
onChange
Required
(value: AutosuggestValue<Value>) => void
aria-labelledby
Required
string
aria-label
Required
string
label
Required
ReactNode
name
string
aria-describedby
string
data
DataAttributeMap
autoFocus
boolean
disabled
boolean
required
boolean
tone
"caution" | "critical" | "neutral" | "positive"
icon
ReactNode
description
ReactNode
message
ReactNode
secondaryMessage
ReactNode
reserveMessageSpace
boolean
noSuggestionsMessage
string | { title: string; description: string; }
clearLabel
string
automaticSelection
boolean
hideSuggestionsOnSelection
boolean
showMobileBackdrop
boolean
scrollToTopOnMobile
boolean
onBlur
() => void
onFocus
() => void
onClear
() => void
placeholder
string
type
"text" | "search"
translations
{
assistiveDescription: string;
suggestionInstructions: string;
suggestionsAvailableAnnouncement: (suggestionCount: number) => string;
noSuggestionsAvailableAnnouncement: string;
suggestionAutoSelectedAnnouncement: (suggestion: string) => string;
}
secondaryLabel
ReactNode
tertiaryLabel
ReactNode
ref
(instance: HTMLInputElement | null) => void | RefObject<HTMLInputElement>

Further References

View Source