Add plugin "copy-code" to default

1 files changed, 54 insertions, 0 deletions

diff --git a/packages/gitbook-plugin-copy-code/src/index.js b/packages/gitbook-plugin-copy-code/src/index.js
new file mode 100644
index 0000000..cfbe1b1
--- /dev/null
+++ b/packages/gitbook-plugin-copy-code/src/index.js
@@ -0,0 +1,54 @@
+const copy = require('copy-to-clipboard');
+const GitBook = require('gitbook-core');
+const { React } = GitBook;
+
+/**
+ * Get children as text
+ * @param {React.Children} children
+ * @return {String}
+ */
+function getChildrenToText(children) {
+    return React.Children.map(children, child => {
+        if (typeof child === 'string') {
+            return child;
+        } else {
+            return child.props.children ?
+                getChildrenToText(child.props.children) : '';
+        }
+    }).join('');
+}
+
+const CodeBlockWithCopy = React.createClass({
+    propTypes: {
+        children: React.PropTypes.node
+    },
+
+    onClick(event) {
+        const { children } = this.props;
+
+        event.preventDefault();
+        event.stopPropagation();
+
+        const text = getChildrenToText(children);
+        copy(text);
+    },
+
+    render() {
+        const { children } = this.props;
+
+        return (
+            <div className="CodeBlockWithCopy-Container">
+                <GitBook.ImportCSS href="gitbook/copy-code/button.css" />
+
+                {children}
+                <span className="CodeBlockWithCopy-Button" onClick={this.onClick}>Copy</span>
+            </div>
+        );
+    }
+});
+
+module.exports = GitBook.createPlugin({
+    activate: (dispatch, getState, { Components }) => {
+        dispatch(Components.registerComponent(CodeBlockWithCopy, { role: 'html:pre' }));
+    }
+});