Colorpicker for React
npm install react-colorpicker> A simple colorpicker written using React.
Uses the Colr library: https://github.com/stayradiated/colr
``
npm install --save react-colorpicker
You will also need to add some css styles.
See the example stylesheet for ideas.
`javascript
var React = require('react');
var ColorPicker = require('react-colorpicker');
var colorpicker = new ColorPicker({
color: '#c0ffee',
onChange: function (color) {
// called whenever the color is changed
console.log(color.hexString());
}
});
React.renderComponent(colorpicker, document.body);
`
Just change the color attribute. Simple.
`javascript
var Colr = require('colr');
var React = require('react');
var ColorPicker = require('react-colorpicker');
var App = React.createClass({
getInitialState: function () {
return {
color: '#000000',
};
},
setColor: function () {
var color = Colr.fromRgb(
Math.random() * 255,
Math.random() * 255,
Math.random() * 255
);
// replace current color and origin color
this.setState({
color: color.toHex()
});
},
handleChange: function (color) {
this.setState({
color: color.toHex()
});
},
render: function () {
/ jshint ignore: start /
return (
});
document.addEventListener('DOMContentLoaded', function () {
React.renderComponent(new App(), document.body);
});
``
MIT