chore(v2): replace Clipboard with copy-text-to-clipboard (#2900)

* chore(v2): replace Clipboard with copy-text-to-clipboard

* Remove clipboard from yarn.lock
This commit is contained in:
Alexey Pyltsyn 2020-06-07 08:48:28 +03:00 committed by GitHub
parent afe9ff91a4
commit dd1ef71aac
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 9 additions and 31 deletions

View file

@ -10,8 +10,8 @@
"dependencies": {
"@mdx-js/mdx": "^1.5.8",
"@mdx-js/react": "^1.5.8",
"clipboard": "^2.0.6",
"clsx": "^1.1.1",
"copy-text-to-clipboard": "^2.2.0",
"infima": "0.2.0-alpha.12",
"parse-numeric-range": "^0.0.2",
"prism-react-renderer": "^1.1.0",

View file

@ -10,7 +10,7 @@
import React, {useEffect, useState, useRef} from 'react';
import clsx from 'clsx';
import Highlight, {defaultProps} from 'prism-react-renderer';
import Clipboard from 'clipboard';
import copy from 'copy-text-to-clipboard';
import rangeParser from 'parse-numeric-range';
import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
import usePrismTheme from '@theme/hooks/usePrismTheme';
@ -107,7 +107,6 @@ export default ({children, className: languageClassName, metastring}) => {
setMounted(true);
}, []);
const target = useRef(null);
const button = useRef(null);
let highlightLines = [];
let codeBlockTitle = '';
@ -128,22 +127,6 @@ export default ({children, className: languageClassName, metastring}) => {
.replace(/"+/g, '');
}
useEffect(() => {
let clipboard;
if (button.current) {
clipboard = new Clipboard(button.current, {
target: () => target.current,
});
}
return () => {
if (clipboard) {
clipboard.destroy();
}
};
}, [button.current, target.current]);
let language =
languageClassName && languageClassName.replace(/language-/, '');
@ -196,7 +179,7 @@ export default ({children, className: languageClassName, metastring}) => {
}
const handleCopyCode = () => {
window.getSelection().empty();
copy(code);
setShowCopied(true);
setTimeout(() => setShowCopied(false), 2000);
@ -232,7 +215,7 @@ export default ({children, className: languageClassName, metastring}) => {
className={clsx(className, styles.codeBlock, {
[styles.codeBlockWithTitle]: codeBlockTitle,
})}>
<div ref={target} className={styles.codeBlockLines} style={style}>
<div className={styles.codeBlockLines} style={style}>
{tokens.map((line, i) => {
if (line.length === 1 && line[0].content === '') {
line[0].content = '\n'; // eslint-disable-line no-param-reassign