JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 5
  • Score
    100M100P100Q35333F
  • License MIT

React label list component

Package Exports

  • es6-react-label-list

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (es6-react-label-list) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

#React label/tag list component npm

Demo

Screencast

Dependencies

React Less

Installation

$ npm install es6-react-label-list

Usage

import React from 'react';
import LabelList from 'es6-react-label-list/lib/label-list.js'

const MyAwesomeReactComponent = () => (
  <LabelList />
);

export default MyAwesomeReactComponent;

Customization

So far there are only these optional parameters for the component customization: color, to set the font color of the label; background , to set the background color of the label; listUpdated, a function is called any time there is an update of the label/tag list; placeholder as the initial input text; and labelClicked, a function is called any time user clicks on the label name.

const printMyList = (list) => {
    console.log(list.join(', '))
}
const printLabel = (label) => {
    console.log(label)
}
const MyAwesomeReactComponent = () => (
  <LabelList color="black" background="green" listUpdated={printMyList} labelClicked={printLabel}/>
);

License

MIT