Autocomplete
The autocomplete is a text input enhanced by a panel of suggested options.
It uses the fds-search-input component, so it inherits all its properties.
Usage
Import
npm i @finastra/autocomplete
import '@finastra/autocomplete';
...
<fds-autocomplete name="World">
<fds-list-item value="One">One</fds-list-item>
<fds-list-item value="Two">Two</fds-list-item>
<fds-list-item value="Three">Three</fds-list-item>
</fds-autocomplete>
API
Properties
Property |
Attribute |
Type |
Default |
ariaDescribedBy |
aria-describedby |
string |
"" |
ariaLabel |
aria-label |
string |
"" |
ariaLabelledBy |
aria-labelledby |
string |
"" |
disabled |
disabled |
boolean |
false |
icon |
icon |
string |
"" |
loading |
loading |
boolean |
false |
minLengthToOpenMenu |
minLengthToOpenMenu |
number |
0 |
name |
name |
string |
"" |
placeholder |
placeholder |
string |
"" |
required |
required |
boolean |
false |
showClearButton |
showClearButton |
boolean |
false |
useInnerFilter |
useInnerFilter |
boolean |
true |
validationMessage |
validationMessage |
string |
"" |
value |
value |
string |
"" |
Methods
Method |
Type |
blur |
(): void |
focus |
(): void |
reportValidity |
(): boolean |
Events
Event |
Type |
blur |
|
focus |
|
input |
CustomEvent<string> |