1.3.1 • Published 6 years ago

@esteemapp/react-native-tags v1.3.1

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

React-Native-Tags

Build Status npm

A React Native component that allows you to input text and formats the text into a tag when a space or comma is entered. Tapping on the tag will remove it.

Demo

Installation

npm install --save react-native-tags
yarn add react-native-tags

Usage

import React from "react";
import Tags from "react-native-tags";

const UselessComponent = () => (
  <Tags
    initialText="monkey"
    initialTags={["dog", "cat", "chicken"]}
    onChangeTags={tags => console.log(tags)}
    onTagPress={(index, tagLabel, event, deleted) =>
      console.log(index, tagLabel, event, deleted ? "deleted" : "not deleted")
    }
    containerStyle={{ justifyContent: "center" }}
    inputStyle={{ backgroundColor: "white" }}
  />
);

Props

PropNameDescriptionDefault
initialTextThe input element's text
initialTags'the', 'initial', 'tags'
onChangeTagsFires when tags are added or removed
maxNumberOfTagsThe max number of tags that can be enteredinfinity
onTagPressFires when tags are pressed
readonlyTags cannot be modifiedfalse
deleteTagOnPressRemove the tag when pressedtrue
containerStyleStyle
styleStyle (containerStyle alias)
inputStyleStyle
tagContainerStyleStyle
tagTextStyleStyle