0.3.0 • Published 2 years ago

chakra-tags-input v0.3.0

Weekly downloads
-
License
MIT
Repository
github
Last release
2 years ago

Chakra Tags Input Guide

Congrats! You just saved yourself hours of work by using this package for tags input field. That renders respective tags and and provides an easy interface for removing and adding new tags

Commands

To install follow these commands :

npm i chakra-tags-input
yarn add chakra-tags-input

Usage

Here is a simple working react Functional Component for this package :

npm.io

import { SyntheticEvent } from 'react';
import { ChakraTagsInput } from "chakra-tags-input";

const TestComponent = () => {
	const [tags, setTags] = useState<string[]>(['test1', 'test2']);

	const handleTagsChange = (
		event: SyntheticEvent,
		tags: string[]
		) =>{
    setTags(tags)
  };

	return(
		<ChakraTagsInput
        tags={tags}
        onTagsChange={handleTagsChange}
      />
	)
}

Demo with all options applied

Check it out in this Sandbox