feat: Add stats widget

components/Stats/index.js

@@ -0,0 +1,31 @@
+var React = require('react');
+
+var Template = require('../Template/');
+
+class Stats extends React.Component {
+  render() {
+    var template = this.props.template;
+    var data = {
+      nbHits: this.props.nbHits,
+      processingTimeMS: this.props.processingTimeMS
+    };
+
+    return (
+      <Template
+        data={data}
+        template={template}
+      />
+    );
+  }
+}
+
+Stats.propTypes = {
+  nbHits: React.PropTypes.number,
+  processingTimeMS: React.PropTypes.number,
+  template: React.PropTypes.oneOfType([
+    React.PropTypes.func,
+    React.PropTypes.string
+  ]).isRequired
+};
+
+module.exports = Stats;

example/app.js

@@ -16,6 +16,12 @@ search.addWidget(
   })
 );
 
+search.addWidget(
+  instantsearch.widgets.stats({
+    container: '#stats'
+  })
+);
+
 search.addWidget(
   instantsearch.widgets.hits({
     container: '#hits',

example/index.html

@@ -20,6 +20,7 @@ <h2>Brands</h1>
         <div id="brands"></div>
       </div>
       <div class="col-md-9">
+        <div id="stats"></div>
         <div id="hits"></div>
         <div id="pagination" class="text-center"></div>
       </div>

index.js

@@ -1,9 +1,10 @@
 module.exports = {
   InstantSearch: require('./lib/InstantSearch'),
   widgets: {
-    searchBox: require('./widgets/search-box/'),
     hits: require('./widgets/hits/'),
+    multipleChoiceList: require('./widgets/multiple-choice-list/'),
     pagination: require('./widgets/pagination/'),
-    multipleChoiceList: require('./widgets/multiple-choice-list/')
+    searchBox: require('./widgets/search-box/'),
+    stats: require('./widgets/stats/')
   }
 };

widgets/stats/index.js

@@ -0,0 +1,28 @@
+var React = require('react');
+
+var utils = require('../../lib/widgetUtils.js');
+var defaultTemplate = require('./template.html');
+
+function stats({container = null, template = defaultTemplate}) {
+  var Stats = require('../../components/Stats');
+  var containerNode = utils.getContainerNode(container);
+
+  if (container === null) {
+    throw new Error('Usage: stats({container})');
+  }
+
+  return {
+    render: function(results) {
+      React.render(
+        <Stats
+          nbHits={results.nbHits}
+          processingTimeMS={results.processingTimeMS}
+          template={template}
+        />,
+        containerNode
+      );
+    }
+  };
+}
+
+module.exports = stats;

widgets/stats/template.html

@@ -0,0 +1,4 @@
+<div>
+  {{nbHits}} results
+  <small>found in {{processingTimeMS}}ms</small>
+</div>