Components – Search: Pass through aria label props (https://github.com/woocommerce/woocommerce-admin/pull/484)

* Pass aria label props through to search input

* Update the search example in devdocs

plugins/woocommerce-admin/client/components/search/example.md

@@ -1,14 +1,14 @@
 ```jsx
 import { Search } from '@woocommerce/components';
 
-class MySearch extends Component {
-	updateLocalValue( results ) {
-		// Do something with results.
-	}
-	render() {
-		return (
-			<Search type="products" onChange={ this.updateLocalValue } />
-		);
-	}
-}
+const MySearch = withState( {
+	selected: [],
+} )( ( { selected, setState } ) => (
+	<Search
+		type="products"
+		placeholder="Search for a product"
+		selected={ selected }
+		onChange={ items => setState( { selected: items } ) }
+	/>
+) );
 ```

plugins/woocommerce-admin/client/components/search/index.js

@@ -73,8 +73,12 @@ class Search extends Component {
 
 	render() {
 		const autocompleter = this.getAutocompleter();
-		const { ariaLabelledby, placeholder, selected } = this.props;
+		const { placeholder, selected } = this.props;
 		const { value = '' } = this.state;
+		const aria = {
+			'aria-labelledby': this.props[ 'aria-labelledby' ],
+			'aria-label': this.props[ 'aria-label' ],
+		};
 		return (
 			<div className="woocommerce-search">
 				<Gridicon className="woocommerce-search__icon" icon="search" />
@@ -86,9 +90,9 @@ class Search extends Component {
 							placeholder={ placeholder }
 							className="woocommerce-search__input"
 							onChange={ this.updateSearch( onChange ) }
-							aria-labelledby={ ariaLabelledby }
 							aria-owns={ listBoxId }
 							aria-activedescendant={ activeId }
+							{ ...aria }
 						/>
 					) }
 				</Autocomplete>