Skip to content

Autocomplete ​

INFO

This component uses the auto complete from PrimeVue. It's full documentation can be found here. It does have some Codey specific features like automation ids, props and slots.

js
import { XerAutocomplete } from "@xerius/codey-components";

Showcases ​

Default ​

With Dropdown ​

With Selected Option ​

With multiple selected ​

As Invalid ​

As Disabled ​

Without Form Control ​

Note

Using a component directly without XerFormControl or <label> requires you to place the correct aria-label on the underlying component input element.

Props ​

All props from the Prime Auto Complete can be provided. The full documentation can be found here.

Events ​

All events from the Prime Auto Complete can be provided. The full documentation can be found here.

Slots ​

All slots from the Prime Auto Complete can be provided. The full documentation can be found here.

Types ​

The XerAutoComplete exports following types:

NameValueDescription
AutoCompleteOption{ [key: string]: string; value: string; }Type for the Auto Complete options.

Automation Ids ​

A data-automation-id needs to be provided to the component as Prime Vue based components do not have a default data-automation-id.