Web Component with a text input that provides a panel of suggested options.

Usage no npm install needed!

<script type="module">
  import vaadinComponentFactoryVcfAutocomplete from 'https://cdn.skypack.dev/@vaadin-component-factory/vcf-autocomplete';



Gitter npm version Published on Vaadin Directory

This is the npm version vcf-autocomplete developed using Polymer 3.

Live demo ↗ | API documentation ↗



Install vcf-autocomplete:

npm i @vaadin-component-factory/vcf-autocomplete --save


Once installed, import it in your application:

import '@vaadin-component-factory/vcf-autocomplete';

Add <vcf-autocomplete> to the page. In attribute options you should declare options that will be offered for user to select. All change listener to the element in which you will update options appribute.

<vcf-autocomplete id="demo1" label="Choose country" placeholder="Start typing a country name..." options="[[options]]">

Running demo

  1. Fork the vcf-autocomplete repository and clone it locally.

  2. Make sure you have npm installed.

  3. When in the vcf-autocomplete directory, run npm install to install dependencies.

  4. Run npm start to open the demo.


To contribute to the component, please read the guideline first.

Vaadin Prime

This component is available in the Vaadin Prime subscription. It is still open source, but you need to have a valid CVAL license in order to use it. Read more at: https://vaadin.com/pricing


Apache License 2