Input for tags with chips

Usage no npm install needed!

<script type="module">
  import reactNativeChipTags from '';



A react native component for editable chips tag

License MIT NPM version


  • 1.Run npm i react-native-chip-tags --save or yarn add react-native-chip-tags
  • 2.import { TagArea } from 'react-native-chip-tags'


Getting started

Add react-native-chip-tags to your js file.

import { TagArea, Chip } from 'react-native-chip-tags'

Inside your component's render method, use TagArea:

 render() {
         return (
             <TagArea handleTagChanged={this._handleOnTagAdded} />


Props Type Optional Default Description
chipStyle object true Gray background etc. Custom chip style
tagWrapper object true nothing Custom wrapper position
editable boolean true false For editable data
pinChipIndex boolean true false For first chip change color to blue as default
handleOnChange function true null Handle on change
handleOnBlur function true null Handle on blur
chipsCount number true 5 Chip count
draftChips array true [] For render already filled tags
handleTagChanged function true null For hande tag change
maxLength number true 50 Max text lenght
multiline number true false For multi line

MIT Licensed by UE