Merge https://github.com/JedWatson/react-select into JedWatson/react-select.git

Author: kappiah

README.md

@@ -13,6 +13,10 @@ function reduce(obj, props = {}){
 const AsyncCreatable = React.createClass({
 	displayName: 'AsyncCreatableSelect',
 
+	focus () {
+		this.select.focus();
+	},
+
 	render () {
 		return (
 			<Select.Async {...this.props}>
@@ -26,6 +30,7 @@ const AsyncCreatable = React.createClass({
 									return asyncProps.onInputChange(input);
 								}}
 								ref={(ref) => {
+									this.select = ref;
 									creatableProps.ref(ref);
 									asyncProps.ref(ref);
 								}}

src/AsyncCreatable.js

@@ -203,6 +203,10 @@ const Creatable = React.createClass({
 		}
 	},
 
+	focus () {
+		this.select.focus();
+	},
+
 	render () {
 		const {
 			newOptionCreator,

src/Creatable.js

@@ -64,6 +64,7 @@ const Select = React.createClass({
 
 	propTypes: {
 		addLabelText: React.PropTypes.string,       // placeholder displayed when you want to add a label on a multi-value input
+		'aria-describedby': React.PropTypes.string,	// HTML ID(s) of element(s) that should be used to describe this input (for assistive tech)
 		'aria-label': React.PropTypes.string,       // Aria label (for assistive tech)
 		'aria-labelledby': React.PropTypes.string,	// HTML ID of an element that should be used as the label (for assistive tech)
 		arrowRenderer: React.PropTypes.func,				// Create drop-down caret element
@@ -906,6 +907,7 @@ const Select = React.createClass({
 			'aria-owns': ariaOwns,
 			'aria-haspopup': '' + isOpen,
 			'aria-activedescendant': isOpen ? this._instancePrefix + '-option-' + focusedOptionIndex : this._instancePrefix + '-value',
+			'aria-describedby': this.props['aria-describedby'],
 			'aria-labelledby': this.props['aria-labelledby'],
 			'aria-label': this.props['aria-label'],
 			className: className,

src/Select.js

@@ -59,4 +59,17 @@ describe('AsyncCreatable', () => {
 			class: ['foo']
 		});
 	});
+
+	describe('.focus()', () => {
+		beforeEach(() => {
+			createControl({});
+			TestUtils.Simulate.blur(filterInputNode);
+		});
+
+		it('focuses the search input', () => {
+			expect(filterInputNode, 'not to equal', document.activeElement);
+			creatableInstance.focus();
+			expect(filterInputNode, 'to equal', document.activeElement);
+		});
+	});
 });

test/AsyncCreatable-test.js

@@ -237,4 +237,17 @@ describe('Creatable', () => {
 		createControl({ onInputKeyDown: event => done() });
 		return creatableInstance.onInputKeyDown({ keyCode: 97 });
 	});
+
+	describe('.focus()', () => {
+		beforeEach(() => {
+			createControl({});
+			TestUtils.Simulate.blur(filterInputNode);
+		});
+
+		it('focuses the search input', () => {
+			expect(filterInputNode, 'not to equal', document.activeElement);
+			creatableInstance.focus();
+			expect(filterInputNode, 'to equal', document.activeElement);
+		});
+	});
 });

test/Creatable-test.js

@@ -4063,6 +4063,19 @@ describe('Select', () => {
 					'to contain', <input role="combobox" aria-labelledby="test-label-id" />);
 			});
 
+			it('passes through the aria-describedby prop', () => {
+
+				instance = createControl({
+					options: defaultOptions,
+					value: 'one',
+					'aria-describedby': 'test-label1-id test-label2-id'
+				});
+
+				expect(instance,
+					'to contain', <input role="combobox" aria-describedby="test-label1-id test-label2-id" />);
+			});
+
+
 			it('passes through the aria-label prop', () => {
 
 				instance = createControl({