3 files changed, 112 insertions, 5 deletions
diff --git a/packages/gitbook-plugin-theme-default/src/Sidebar.js b/packages/gitbook-plugin-theme-default/src/Sidebar.js
index 2ff8854..ff4fcbf 100644
--- a/packages/gitbook-plugin-theme-default/src/Sidebar.js
+++ b/packages/gitbook-plugin-theme-default/src/Sidebar.js
@@ -1,10 +1,19 @@
 const React = require('react');
+const GitBook = require('gitbook-core');
+
+const Summary = require('./Summary');
 
 const Sidebar = React.createClass({
+    propTypes: {
+        summary: GitBook.Shapes.Summary
+    },
+
     render() {
+        const { summary } = this.props;
+
         return (
             <div className="Sidebar book-summary">
-
+                <Summary summary={summary} />
             </div>
         );
     }
diff --git a/packages/gitbook-plugin-theme-default/src/Summary.js b/packages/gitbook-plugin-theme-default/src/Summary.js
new file mode 100644
index 0000000..13b74c1
--- /dev/null
+++ b/packages/gitbook-plugin-theme-default/src/Summary.js
@@ -0,0 +1,97 @@
+const React = require('react');
+const GitBook = require('gitbook-core');
+
+const SummaryArticle = React.createClass({
+    propTypes: {
+        article: GitBook.Shapes.SummaryArticle
+    },
+
+    render() {
+        const { article } = this.props;
+
+        return (
+            <GitBook.InjectedComponent matching={{ role: 'summary:article' }} props={this.props}>
+                <li className="SummaryArticle">
+                    <span>{article.title}</span>
+                </li>
+            </GitBook.InjectedComponent>
+        );
+    }
+});
+
+const SummaryArticles = React.createClass({
+    propTypes: {
+        articles: React.PropTypes.arrayOf(GitBook.Shapes.SummaryArticle)
+    },
+
+    render() {
+        const { articles } = this.props;
+
+        return (
+            <GitBook.InjectedComponent matching={{ role: 'summary:articles' }} props={this.props}>
+                <ul className="SummaryArticles">
+                    {articles.map(article => <SummaryArticle key={article.level} article={article} />)}
+                </ul>
+            </GitBook.InjectedComponent>
+        );
+    }
+});
+
+const SummaryPart = React.createClass({
+    propTypes: {
+        part: GitBook.Shapes.SummaryPart
+    },
+
+    render() {
+        const { part } = this.props;
+        const { title, articles } = part;
+
+        return (
+            <GitBook.InjectedComponent matching={{ role: 'summary:part' }} props={this.props}>
+                <div className="SummaryPart">
+                    {title}
+                    <SummaryArticles articles={articles} />
+                </div>
+            </GitBook.InjectedComponent>
+        );
+    }
+});
+
+const SummaryParts = React.createClass({
+    propTypes: {
+        parts: React.PropTypes.arrayOf(GitBook.Shapes.SummaryPart)
+    },
+
+    render() {
+        const { parts } = this.props;
+
+        return (
+            <GitBook.InjectedComponent matching={{ role: 'summary:parts' }} props={this.props}>
+                <div className="SummaryParts">
+                    {parts.map((part, i) => <SummaryPart key={i} part={part} />)}
+                </div>
+            </GitBook.InjectedComponent>
+        );
+    }
+});
+
+const Summary = React.createClass({
+    propTypes: {
+        summary: GitBook.Shapes.Summary
+    },
+
+    render() {
+        const { summary } = this.props;
+        const { parts } = summary;
+
+        return (
+            <GitBook.InjectedComponent matching={{ role: 'summary:container' }} props={this.props}>
+                <div className="Summary book-summary">
+                    <SummaryParts parts={parts} />
+                </div>
+            </GitBook.InjectedComponent>
+        );
+    }
+});
+
+module.exports = Summary;
diff --git a/packages/gitbook-plugin-theme-default/src/index.js b/packages/gitbook-plugin-theme-default/src/index.js
index 4b98a22..33ca405 100644
--- a/packages/gitbook-plugin-theme-default/src/index.js
+++ b/packages/gitbook-plugin-theme-default/src/index.js
@@ -8,11 +8,12 @@ const Toolbar = require('./Toolbar');
 let ThemeBody = React.createClass({
     propTypes: {
         page:     GitBook.Shapes.Page,
+        summary:  GitBook.Shapes.Summary,
         children: React.PropTypes.node
     },
 
     render() {
-        const { page, children } = this.props;
+        const { page, summary, children } = this.props;
 
         return (
             <div className="GitBook book">
@@ -22,7 +23,7 @@ let ThemeBody = React.createClass({
                 <GitBook.ImportCSS href="gitbook/gitbook-plugin-theme-default/theme.css" />
 
                 <Toolbar />
-                <Sidebar />
+                <Sidebar summary={summary} />
                 <Page page={page} />
                 {children}
             </div>
@@ -30,8 +31,8 @@ let ThemeBody = React.createClass({
     }
 });
 
-ThemeBody = GitBook.connect(ThemeBody, ({page}) => {
-    return { page };
+ThemeBody = GitBook.connect(ThemeBody, ({page, summary}) => {
+    return { page, summary };
 });
 
 module.exports = GitBook.createPlugin((dispatch, state) => {