@cutii/react-native-tag-input

    0.0.18 • Public • Published

    React Native Tag Input

    alt text

    Simple Example

    import TagInput from 'react-native-tag-input';
    
    ...
    
    <TagInput
      value={this.state.emails}
      onChange={(emails) => this.onEmailChange(emails)}
      labelExtractor={(email) => email}
    />
    
    Available Properties Description
    onChange (Required) A handler to be called when array of tags change. When new tags are added, they are appended as strings. If you use a non-string item type, make sure to either translate the strings to your item type before passing this value on to the "value" prop, or otherwise make sure your labelExtractor can handle both your item type and strings.
    value (Required) An array of tags, which can be any type, as long as labelExtractor below can extract a string from it.
    labelExtractor (Required) Function to extract string value for label from item
    separators An array of characters to use as tag separators
    regex A RegExp to test tags after enter, space, or a comma is pressed
    tagColor Background color of tags
    tagTextColor Text color of tags
    tagContainerStyle Styling override for container surrounding tag text
    tagTextStyle Styling override for tag's text component
    inputColor Color of text input
    inputProps Any misc. TextInput props (autoFocus, placeholder, returnKeyType, etc.)
    maxHeight Max height of the tag input on screen (will scroll if max height reached)
    onHeightChange Callback that gets passed the new component height when it changes
    parseOnBlur Whether to treat a blur event as a separator entry (iOS-only)

    Install

    npm i @cutii/react-native-tag-input

    DownloadsWeekly Downloads

    5

    Version

    0.0.18

    License

    MIT

    Last publish

    Collaborators

    • avatar