fix: allow adding css classes to the searchBox wrapper

fixes #22 fixes #24
algolia · Aug 3, 2015 · 6ef0b0b · 6ef0b0b
1 parent 3cc8cc6
commit 6ef0b0b
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 14 deletions.
diff --git a/example/app.js b/example/app.js
@@ -8,17 +8,22 @@ var instant = new instantsearch.InstantSearch(
   'bestbuy'
 );
 
-instant.addWidget(instantsearch.widgets.searchbox({
-  container: '#search-box',
-  placeholder: 'Search for products in France...'
-}));
+instant.addWidget(
+  instantsearch.widgets.searchbox({
+    container: '#search-box',
+    placeholder: 'Search for products',
+    addClass: 'form-control'
+  })
+);
 
-instant.addWidget(instantsearch.widgets.results({
+instant.addWidget(
+  instantsearch.widgets.results({
   container: '#hits',
-  templates: {
-    noResults: require('./templates/no-results.html'),
-    hit: require('./templates/hit.html')
-  }
-}));
+    templates: {
+      noResults: require('./templates/no-results.html'),
+      hit: require('./templates/hit.html')
+    }
+  })
+);
 
 instant.start();
diff --git a/widgets/searchbox/index.js b/widgets/searchbox/index.js
@@ -4,13 +4,18 @@ var React = require('react');
 
 var utils = require('../../lib/widgetUtils');
 
-function searchbox(parameters) {
+function searchbox(params) {
   var SearchBox = require('../../components/SearchBox');
-  var container = utils.getContainerNode(parameters.container);
+  var container = utils.getContainerNode(params.container);
+
   return {
     init: function(initialState, helper) {
-      React.render(<SearchBox helper={helper}
-      placeholder={parameters.placeholder} />, container);
+      React.render(
+        <SearchBox
+          helper={helper}
+          placeholder={params.placeholder}
+          inputClass={params.addClass} />, container
+      );
     }
   };
 }