[ADD] Material

Author: gonzalo-rivas

lib/Select.js

@@ -891,7 +891,7 @@ var Select = React.createClass({
 			value = this.props.placeholder;
 		}
 
-		var animatedBar = classes({
+		var animatedBar = ClassNames({
 			"aui-core-form-default-input-bar-animation": true,
 			"focus": this.state.isFocused,
 			"aui-core-display-off": !this.props.material
@@ -905,19 +905,19 @@ var Select = React.createClass({
 			React.createElement(
 				'div',
 				{ className: 'Select-control', ref: 'control', onKeyDown: this.handleKeyDown, onMouseDown: this.handleMouseDown, onTouchEnd: this.handleMouseDown },
-				React.createElement('div', { className: animatedBar }),
+				React.createElement(
+					'label',
+					{ className: focusedLabel },
+					this.state.initialPlaceholder
+				),
 				value,
 				input,
 				React.createElement('span', { className: 'Select-arrow-zone', onMouseDown: this.handleMouseDownOnArrow }),
 				React.createElement('span', { className: 'Select-arrow', onMouseDown: this.handleMouseDownOnArrow }),
 				loading,
 				clear
 			),
-			React.createElement(
-				'label',
-				{ className: focusedLabel },
-				this.state.initialPlaceholder
-			),
+			React.createElement('div', { className: animatedBar }),
 			menu
 		);
 	}

src/Select.js

@@ -871,7 +871,7 @@ var Select = React.createClass({
 			value = this.props.placeholder
 		}
 
-		var animatedBar = classes({
+		var animatedBar = ClassNames({
             "aui-core-form-default-input-bar-animation":true,
             "focus": this.state.isFocused,
             "aui-core-display-off": !this.props.material
@@ -882,15 +882,15 @@ var Select = React.createClass({
 			<div ref="wrapper" className={selectClass}>
 				<input type="hidden" ref="value" name={this.props.name} value={this.state.value} disabled={this.props.disabled} />
 				<div className="Select-control" ref="control" onKeyDown={this.handleKeyDown} onMouseDown={this.handleMouseDown} onTouchEnd={this.handleMouseDown}>
-					<div className={animatedBar}></div>
+					<label className={focusedLabel}>{this.state.initialPlaceholder}</label>
 					{value}
 					{input}
 					<span className="Select-arrow-zone" onMouseDown={this.handleMouseDownOnArrow} />
 					<span className="Select-arrow" onMouseDown={this.handleMouseDownOnArrow} />
 					{loading}
 					{clear}
 				</div>
-				<label className={focusedLabel}>{this.state.initialPlaceholder}</label>
+				<div className={animatedBar}></div>
 				{menu}
 			</div>
 		);