2 files changed, 75 insertions, 0 deletions
diff --git a/packages/gitbook-plugin-search/src/components/Input.js b/packages/gitbook-plugin-search/src/components/Input.js
new file mode 100644
index 0000000..c4d1288
--- /dev/null
+++ b/packages/gitbook-plugin-search/src/components/Input.js
@@ -0,0 +1,47 @@
+const GitBook = require('gitbook-core');
+const { React } = GitBook;
+
+const search = require('../actions/search');
+
+const DEBOUNCE_MS = 600;
+
+const SearchInput = React.createClass({
+    propTypes: {
+        dispatch: React.PropTypes.func
+    },
+
+    onUpdateQuery(q) {
+        const { dispatch } = this.props;
+
+        dispatch(search.query(q));
+    },
+
+    onKeyDown(event) {
+        const { value } = event.currentTarget;
+
+        if (this.debouncedSearch) {
+            clearTimeout(this.debouncedSearch);
+        }
+
+        this.debouncedSearch = setTimeout(() => {
+            this.debouncedSearch = null;
+            this.onUpdateQuery(value);
+        }, DEBOUNCE_MS);
+    },
+
+    componentWillUnmount() {
+        if (this.debouncedSearch) {
+            clearTimeout(this.debouncedSearch);
+        }
+    },
+
+    render() {
+        return (
+            <div className="Search/Input">
+                <input type="text" placeholder="" onKeyDown={this.onKeyDown} />
+            </div>
+        );
+    }
+});
+
+module.exports = GitBook.connect(SearchInput);
diff --git a/packages/gitbook-plugin-search/src/components/Results.js b/packages/gitbook-plugin-search/src/components/Results.js
new file mode 100644
index 0000000..99bc63d
--- /dev/null
+++ b/packages/gitbook-plugin-search/src/components/Results.js
@@ -0,0 +1,28 @@
+const GitBook = require('gitbook-core');
+const { React } = GitBook;
+
+const SearchResults = React.createClass({
+    propTypes: {
+        results: GitBook.Shapes.list
+    },
+
+    render() {
+        const { results } = this.props;
+
+        return (
+            <div className="Search/Results">
+                {results.map(result => {
+
+                })}
+            </div>
+        );
+    }
+});
+
+function mapStateToProps(state) {
+    return {
+        results: state.search.results
+    };
+}
+
+module.exports = GitBook.connect(SearchResults, mapStateToProps);