Tribute autocomplete

This is a fork of tributejs modified to work as a autocomplete-typehead. Also works with normal @mentions tribute configs also.

Pass autoCompleteMode:true to the collection object of Tribute and it should function as a autocomplete. For rest of the configuration checkout Tributejs.

A cross-browser autocomplete typeahead engine written in ES6, no dependencies. Tested in Firefox, Chrome, iOS Safari, Safari, IE 9+, Edge 12+, Android 4+, and Windows Phone.

Installing

There are a few ways to install Tribute; Bower, as an NPM Module, or by [downloading] from the dist folder in this repo.

Bower

Bower is a great way to manage your JS dependencies. You can install Tribute by running the following command:

bower install tribute-autocomplete

You can then link to Tribute autocomplete in your code with the following markup:

<link rel="stylesheet" href="bower_components/tribute-autocomplete/dist/tribute.css" />
<script src="bower_components/tribute-autocomplete/dist/tribute.js"></script>

NPM Module

You can install Tribute by running:

npm install tributejs-autocomplete

Or by adding Tribute autocomplete to your package.json file.

Import into your ES6 code.

import Tribute from "tributejs-autocomplete";

Webpack

To add Tribute to your webpack build process, start by adding it to your package.json and running npm install.

After installing, you need to update your Babel module loader to not exclude Tribute from being compiled by Webpack:

{
    test: /\.js$/,
    loader: 'babel',
    exclude: /node_modules\/(?!tributejs)/
}

Download or Clone

Or you can download the repo or clone it localy with this command:

git clone [email protected]:MalayaliRobz/tribute-autocomplete.git

You can then copy the files in the dist directory to your project.

<link rel="stylesheet" href="js/tribute.css" />
<script src="js/tribute.js"></script>

That's it! Now you are ready to initialize Tribute-autocomplete.