Merge pull request JedWatson#1824 from jochenberger/use-es6-5

convert Value to ES6 class

Author: agirton

src/Value.js

@@ -1,20 +1,18 @@
 import React from 'react';
-import createClass from 'create-react-class';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 
-const Value = createClass({
+class Value extends React.Component {
 
-	displayName: 'Value',
+	constructor(props) {
+		super(props);
 
-	propTypes: {
-		children: PropTypes.node,
-		disabled: PropTypes.bool,               // disabled prop passed to ReactSelect
-		id: PropTypes.string,                   // Unique id for the value - used for aria
-		onClick: PropTypes.func,                // method to handle click on value label
-		onRemove: PropTypes.func,               // method to handle removal of the value
-		value: PropTypes.object.isRequired,     // the option object for this value
-	},
+		this.handleMouseDown = this.handleMouseDown.bind(this);
+		this.onRemove = this.onRemove.bind(this);
+		this.handleTouchEndRemove = this.handleTouchEndRemove.bind(this);
+		this.handleTouchMove = this.handleTouchMove.bind(this);
+		this.handleTouchStart = this.handleTouchStart.bind(this);
+	}
 
 	handleMouseDown (event) {
 		if (event.type === 'mousedown' && event.button !== 0) {
@@ -28,13 +26,13 @@ const Value = createClass({
 		if (this.props.value.href) {
 			event.stopPropagation();
 		}
-	},
+	}
 
 	onRemove (event) {
 		event.preventDefault();
 		event.stopPropagation();
 		this.props.onRemove(this.props.value);
-	},
+	}
 
 	handleTouchEndRemove (event){
 		// Check if the view is being dragged, In this case
@@ -43,17 +41,17 @@ const Value = createClass({
 
 		// Fire the mouse events
 		this.onRemove(event);
-	},
+	}
 
 	handleTouchMove (event) {
 		// Set a flag that the view is being dragged
 		this.dragging = true;
-	},
+	}
 
 	handleTouchStart (event) {
 		// Set a flag that the view is not being dragged
 		this.dragging = false;
-	},
+	}
 
 	renderRemoveIcon () {
 		if (this.props.disabled || !this.props.onRemove) return;
@@ -67,7 +65,7 @@ const Value = createClass({
 				×
 			</span>
 		);
-	},
+	}
 
 	renderLabel () {
 		let className = 'Select-value-label';
@@ -80,7 +78,7 @@ const Value = createClass({
 				{this.props.children}
 			</span>
 		);
-	},
+	}
 
 	render () {
 		return (
@@ -93,7 +91,16 @@ const Value = createClass({
 			</div>
 		);
 	}
+};
+
 
-});
+Value.propTypes = {
+	children: PropTypes.node,
+	disabled: PropTypes.bool,               // disabled prop passed to ReactSelect
+	id: PropTypes.string,                   // Unique id for the value - used for aria
+	onClick: PropTypes.func,                // method to handle click on value label
+	onRemove: PropTypes.func,               // method to handle removal of the value
+	value: PropTypes.object.isRequired,     // the option object for this value
+};
 
 module.exports = Value;