Skip to content
master
Switch branches/tags
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
src
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

preact-token-input

NPM travis-ci

A text field that tokenizes input, for things like tags.

CodePen Demo

preact-token-input


Usage Example

Use <TokenInput /> like a normal <input>. It supports the same props/attributes, including value, onInput() and onChange().

import TokenInput from 'preact-token-input';

const Tags = ({ tags, ...props }) => (
	<label class="tags">
		Add some tags:
		<TokenInput value={tags} {...props} />
	</form>
);

let tags = ['new', 'noteworthy', 'tech'];
render(<Tags list={tags} />, document.body);

Usage with Linked State

<TokenInput /> works with Linked State exactly the same way as any other input field:

import TokenInput from 'preact-token-input';

class Form extends Component {
	render(props, { tags }) {
		return (
			<form>
				<TokenInput value={tags} onChange={ this.linkState('tags') } />
			</form>
		);
	}
}

render(<Form />, document.body);

License

MIT

About

🔖 A text field that tokenizes input, for things like tags.

Topics

Resources

License

Packages

No packages published