summaryrefslogtreecommitdiffstats
path: root/packages/gitbook-plugin-copy-code/src/index.js
diff options
context:
space:
mode:
Diffstat (limited to 'packages/gitbook-plugin-copy-code/src/index.js')
-rw-r--r--packages/gitbook-plugin-copy-code/src/index.js82
1 files changed, 82 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..73d46c6
--- /dev/null
+++ b/packages/gitbook-plugin-copy-code/src/index.js
@@ -0,0 +1,82 @@
+const copy = require('copy-to-clipboard');
+const GitBook = require('gitbook-core');
+const { React } = GitBook;
+
+const COPIED_TIMEOUT = 1000;
+
+/**
+ * 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('');
+}
+
+let CodeBlockWithCopy = React.createClass({
+ propTypes: {
+ children: React.PropTypes.node,
+ i18n: GitBook.PropTypes.I18n
+ },
+
+ getInitialState() {
+ return {
+ copied: false
+ };
+ },
+
+ onClick(event) {
+ const { children } = this.props;
+
+ event.preventDefault();
+ event.stopPropagation();
+
+ const text = getChildrenToText(children);
+ copy(text);
+
+ this.setState({ copied: true }, () => {
+ this.timeout = setTimeout(() => {
+ this.setState({
+ copied: false
+ });
+ }, COPIED_TIMEOUT);
+ });
+ },
+
+ componentWillUnmount() {
+ if (this.timeout) {
+ clearTimeout(this.timeout);
+ }
+ },
+
+ render() {
+ const { children, i18n } = this.props;
+ const { copied } = this.state;
+
+ return (
+ <div className="CodeBlockWithCopy-Container">
+ <GitBook.ImportCSS href="gitbook/copy-code/button.css" />
+
+ {children}
+ <span className="CodeBlockWithCopy-Button" onClick={this.onClick}>
+ {copied ? i18n.t('COPIED') : i18n.t('COPY')}
+ </span>
+ </div>
+ );
+ }
+});
+
+CodeBlockWithCopy = GitBook.connect(CodeBlockWithCopy);
+
+module.exports = GitBook.createPlugin({
+ activate: (dispatch, getState, { Components }) => {
+ dispatch(Components.registerComponent(CodeBlockWithCopy, { role: 'html:pre' }));
+ }
+});