Search plugin should provide roles "search:results" and "search:result"

4 files changed, 18 insertions, 14 deletions

diff --git a/packages/gitbook-plugin-search/src/components/Results.js b/packages/gitbook-plugin-search/src/components/Results.js
index d9ecc45..cccc501 100644
--- a/packages/gitbook-plugin-search/src/components/Results.js
+++ b/packages/gitbook-plugin-search/src/components/Results.js
@@ -11,10 +11,12 @@ const Result = React.createClass({
 
         return (
             <div className="Search-Result">
-                <h3>
-                    <GitBook.Link to={result.url}>{result.title}</GitBook.Link>
-                </h3>
-                <p>{result.body}</p>
+                <GitBook.InjectedComponent matching={{ role: 'search:result' }} props={{ result }}>
+                    <h3>
+                        <GitBook.Link to={result.url}>{result.title}</GitBook.Link>
+                    </h3>
+                    <p>{result.body}</p>
+                </GitBook.InjectedComponent>
             </div>
         );
     }
@@ -37,12 +39,14 @@ const SearchResults = React.createClass({
 
         return (
             <div className="Search-ResultsContainer">
-                <h1>{i18n.t('SEARCH_RESULTS_TITLE', { query, count: results.size })}</h1>
-                <div className="Search-Results">
-                    {results.map((result, i) => {
-                        return <Result key={i} result={result} />;
-                    })}
-                </div>
+                <GitBook.InjectedComponent matching={{ role: 'search:results' }} props={{ results, query }}>
+                    <h1>{i18n.t('SEARCH_RESULTS_TITLE', { query, count: results.size })}</h1>
+                    <div className="Search-Results">
+                        {results.map((result, i) => {
+                            return <Result key={i} result={result} />;
+                        })}
+                    </div>
+                </GitBook.InjectedComponent>
             </div>
         );
     }
diff --git a/packages/gitbook-plugin-search/src/index.js b/packages/gitbook-plugin-search/src/index.js
index 298c088..f8c59aa 100644
--- a/packages/gitbook-plugin-search/src/index.js
+++ b/packages/gitbook-plugin-search/src/index.js
@@ -23,8 +23,8 @@ module.exports = GitBook.createPlugin({
         dispatch(History.listen(onLocationChange));
 
         // Register components
-        dispatch(Components.registerComponent(SearchInput, { role: 'search:input' }));
-        dispatch(Components.registerComponent(SearchResults, { role: 'search:results' }));
+        dispatch(Components.registerComponent(SearchInput, { role: 'search:container:input' }));
+        dispatch(Components.registerComponent(SearchResults, { role: 'search:container:results' }));
     },
     reduce: reducers,
     actions: {
diff --git a/packages/gitbook-plugin-theme-default/src/components/Page.js b/packages/gitbook-plugin-theme-default/src/components/Page.js
index 8bd7045..cad3765 100644
--- a/packages/gitbook-plugin-theme-default/src/components/Page.js
+++ b/packages/gitbook-plugin-theme-default/src/components/Page.js
@@ -11,7 +11,7 @@ const Page = React.createClass({
 
         return (
             <div className="Page page-wrapper">
-                <GitBook.InjectedComponent matching={{ role: 'search:results' }} props={this.props}>
+                <GitBook.InjectedComponent matching={{ role: 'search:container:results' }} props={this.props}>
                     <GitBook.InjectedComponent matching={{ role: 'page:container' }} props={this.props}>
                         <GitBook.HTMLContent html={page.content} />
                     </GitBook.InjectedComponent>
diff --git a/packages/gitbook-plugin-theme-default/src/components/Sidebar.js b/packages/gitbook-plugin-theme-default/src/components/Sidebar.js
index c5f74ab..4a7fa53 100644
--- a/packages/gitbook-plugin-theme-default/src/components/Sidebar.js
+++ b/packages/gitbook-plugin-theme-default/src/components/Sidebar.js
@@ -13,7 +13,7 @@ const Sidebar = React.createClass({
 
         return (
             <div className="Sidebar book-summary">
-                <GitBook.InjectedComponent matching={{ role: 'search:input' }} />
+                <GitBook.InjectedComponent matching={{ role: 'search:container:input' }} />
                 <Summary summary={summary} />
             </div>
         );