Reference Source
import {Autocomplete} from '@adobe/coral-spectrum'
public class | source

Autocomplete

Expression Extends:

class Autocomplete extends BaseFormField(BaseComponent(HTMLElement))

An Autocomplete component that allows users to search and select from a list of options.

See:

Example:

Markup
<coral-autocomplete></coral-autocomplete>
JS constructor
new Coral.Autocomplete();

Static Member Summary

Static Public Members
public static

Returns Autocomplete match options.

public static

Returns Autocomplete variants.

Member Summary

Public Members
public

Amount of time, in milliseconds, to wait after typing a character before the suggestion is shown.

public

Whether this field is disabled or not.

public

invalid: *

Inherited from BaseFormField#invalid.

public

The item collection.

public

Inherited from BaseFormField#labelled.

public

Inherited from BaseFormField#labelledBy.

public

Indicates that the component is currently loading remote data.

public

The match mode.

public

Max length for the Input field

  • reflected

public

Indicates if the autocomplete is a single or multiple mode.

public

Name used to submit the data in a form.

public

Returns the inner overlay to allow customization.

public

A hint to the user of what can be entered.

public

Whether this field is readOnly or not.

public

Whether this field is required or not.

public

Returns the first selected item in the Autocomplete.

public

Returns an Array containing the set selected items.

public

The current value, as submitted during form submission.

public

The current values, as submitted during form submission.

public

The Autocomplete's variant. See AutocompleteVariantEnum.

  • AutocompleteVariantEnum.DEFAULT by default.
  • reflected

Method Summary

Public Methods
public

Add the provided list of suggestions and clear loading status.

public

clear()

Clears the current selected value or items.

public

Clear the list of suggestions.

public

Hides the suggestion UI.

public

render()

public

reset()

Inherited from BaseFormField#reset.

public

Shows the suggestion UI.

Static Public Members

public static match: AutocompleteMatchEnum: * source

Returns Autocomplete match options.

public static variant: AutocompleteVariantEnum: * source

Returns Autocomplete variants.

Public Members

public delay: Number source

Amount of time, in milliseconds, to wait after typing a character before the suggestion is shown.

  • 200 by default.

public disabled: Boolean source

Whether this field is disabled or not.

  • false by default.
  • reflected

public invalid: * source

Inherited from BaseFormField#invalid.

public items: SelectableCollection source

The item collection.

  • read-only

public labelled: * source

Inherited from BaseFormField#labelled.

public labelledBy: * source

Inherited from BaseFormField#labelledBy.

public loading: Boolean source

Indicates that the component is currently loading remote data. This will set the wait indicator inside the list.

  • false by default.

public match: String source

The match mode. See AutocompleteMatchEnum.

  • AutocompleteMatchEnum.CONTAINS by default.

public maxLength: Number source

Max length for the Input field

  • reflected

public multiple: Boolean source

Indicates if the autocomplete is a single or multiple mode. In multiple mode, the user can select multiple values.

  • false by default.
  • reflected

public name: String source

Name used to submit the data in a form.

  • "" by default.
  • reflected

public overlay: Popover source

Returns the inner overlay to allow customization.

  • read-only

public placeholder: String source

A hint to the user of what can be entered.

  • "" by default.
  • reflected

public readOnly: Boolean source

Whether this field is readOnly or not. Indicating that the user cannot modify the value of the control.

  • false by default.
  • reflected

public required: Boolean source

Whether this field is required or not.

  • false by default.
  • reflected

public selectedItem: HTMLElement source

Returns the first selected item in the Autocomplete. The value null is returned if no element is selected.

  • read-only

public selectedItems: Array<HTMLElement> source

Returns an Array containing the set selected items.

  • read-only

public value: String source

The current value, as submitted during form submission. When Coral.Autocomplete#multiple is true, the first selected value will be returned.

  • "" by default.

public values: Array<String> source

The current values, as submitted during form submission. When Coral.Autocomplete#multiple is false, this will be an array of length 1.

public variant: AutocompleteVariantEnum source

The Autocomplete's variant. See AutocompleteVariantEnum.

  • AutocompleteVariantEnum.DEFAULT by default.
  • reflected

Public Methods

public addSuggestions(suggestions: Array<AutocompleteSuggestion>, clear: Boolean) source

Add the provided list of suggestions and clear loading status.

Params:

NameTypeAttributeDescription
suggestions Array<AutocompleteSuggestion>

The list of suggestions to show.

clear Boolean

If true, existing suggestions will be cleared.

public clear() source

Clears the current selected value or items.

public clearSuggestions() source

Clear the list of suggestions.

public hideSuggestions() source

Hides the suggestion UI.

public render() source

public reset() source

Inherited from BaseFormField#reset.

public showSuggestions() source

Shows the suggestion UI.