Email Genie

Allows autocomplete on email field by providing a list of domain suggestions (gmail.com, outlook.com, etc.). This package is lightweight, flexible, compatible with libraries (jQuery, etc.) / frameworks (React, Angular, Vue, etc.) and maximize native behaviors on desktop AND mobile browsers.

👍 Lite 5kb (2kb Gzipped) ⚡ Fast Native JavaScript 🚫 No Dependencies 🚫 No HTML Wrapper 🚫 No CSS injected

Examples

• Basic
• Custom domains

Installation

npm i email-genie

Import

CDN

<script src="https://unpkg.com/email-genie"></script>;

Classic

const EmailGenie = require('email-genie');

ES6

import EmailGenie from 'email-genie';

Usage

Text selector

const email = new EmailGenie('.email');

Vanilla JS

const elem = document.querySelector('.email')
const field = new EmailGenie(elem);

jQuery

const field = new EmailGenie($('.email'));

Add custom domains

const field = new EmailGenie('.email', {
  domains: ['business.com', 'company.com', 'university.com'],
});

Options

| Option | Default | Possibilities | Description | | ------- | ------- | ------------- | ----------- | | domains | ['gmail.com', 'outlook.com', 'hotmail.com', 'msn.com', 'live.com', 'googlemail.com', 'yahoo.com', 'me.com', 'icloud.com'] | [] | Array of domains suggestions. (By default, this array will be added to the default domains suggestions. View overrideDomains option to override instead.) | | overrideDomains | false | Boolean (true/false) | Wether the domains suggestions array should override the default one. | | insert | 'afterend' | 'beforebegin', 'afterend', 'documentend' | Where the datalist generated should be inserted: Before the input, after the input, at the end of the document. |

Support

Chrome, Firefox, Safari, Edge, IE 11