Easyfill

A simple React component for autofilling popular email suffixes.

Install

npm i easyfill

Usage

import Easyfill from 'easyfill';


function CoolReactComponent() {
    const handleAdd = (itemAdded) => {
        console.log(itemAdded);
    }

    const handleAdd = (allItemsAdded) => {
        console.log(allItemsAdded);
    }

    const handleValidation = (itemToValidate) => {
        if (itemToValidate.length > 5) {
            return true
        } else {
            return false
        }
    }

    return(
        <Easyfill
            max={10}
            onAdd={handleAdd}
            onComplete={handleComplete}
            validation={handleValidation}
            progress
        />
    )
}

API Reference

max

  max={count}

Parameter	Type	Description
count	number	Max entries to allow.

onChange

  onAdd={handleOnChange}

Parameter	Type	Description
handleOnChange	function	Function to call when validated items change.

onComplete

  onComplete={handleOnComplete}

Parameter	Type	Description
handleOnComplete	function	Function to call when validated item count reaches max.

validation

  validation={handleValidation}

Parameter	Type	Description
validation	function	Custom validation function that takes the input to be added, and returns a boolean.

progress

  progress={showProgress}

Parameter	Type	Description
showProgress	boolean	Boolean that will show/hide progress bar in bottom left.

Authors

• @technicaldebt