easyfill
v1.2.3
Published
A simple React component for autofilling popular email suffixes.
Downloads
10
Readme
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. |