``
_____
|_ _|___ ___ ___ ___ ___
| | | .'| . | . | -_| _|
|_| |__,|_ |_ |___|_|
|___|___| version 0.6.2
`


Tagger: Zero dependency, Vanilla JavaScript Tag Editor

![npm](https://www.npmjs.com/package/@jcubic/tagger)

!Tag Editor widget in JavaScript

Online Demo

Installation

`
npm install @jcubic/tagger
`

or

`
yarn add @jcubic/tagger
`

Usage

`
tagger(document.querySelector('[name="tags"]'), {allow_spaces: false});
`

Multiple inputs can be created by passing a NodeList or array of elements (eg. document.querySelectorAll()). If only one element is contained in the list then tagger will return the tagger instance, an array of tagger instances will be returned if the number of elements is greater than 1.

Usage with React

Tagger can easily be used with ReactJS.

`javascript
import { useRef, useState, useEffect } from 'react'
import tagger from '@jcubic/tagger'

const App = () => {
const [tags, setTags] = useState([]);
const inputRef = useRef(null);

useEffect(() => {
const taggerOptions = {
allow_spaces: true,
};
tagger(inputRef.current, taggerOptions);
onChange();
}, [inputRef]);

const onChange = () => {
setTags(tags_array(inputRef.current.value));
};

return (