diff --git a/libs/remix-ui/clipboard/src/lib/copy-to-clipboard/copy-to-clipboard.tsx b/libs/remix-ui/clipboard/src/lib/copy-to-clipboard/copy-to-clipboard.tsx
index d32a7abec1..0341e84be0 100644
--- a/libs/remix-ui/clipboard/src/lib/copy-to-clipboard/copy-to-clipboard.tsx
+++ b/libs/remix-ui/clipboard/src/lib/copy-to-clipboard/copy-to-clipboard.tsx
@@ -1,11 +1,13 @@
-import React from 'react'
+import React, { useState } from 'react'
import copy from 'copy-text-to-clipboard'
+import { OverlayTrigger, Tooltip } from 'react-bootstrap'
import './copy-to-clipboard.css'
-export const CopyToClipboard = ({ content, tip='Copy value to clipboard', icon='fa-copy', ...otherProps }) => {
+export const CopyToClipboard = ({ content, tip='Copy', icon='fa-copy', ...otherProps }) => {
+ const [message, setMessage] = useState(tip)
const handleClick = () => {
- if (content) { // module `copy` keeps last copied thing in the memory, so don't show tooltip if nothing is copied, because nothing was added to memory
+ if (content && content !== '') { // module `copy` keeps last copied thing in the memory, so don't show tooltip if nothing is copied, because nothing was added to memory
try {
if (typeof content !== 'string') {
content = JSON.stringify(content, null, '\t')
@@ -14,21 +16,28 @@ export const CopyToClipboard = ({ content, tip='Copy value to clipboard', icon='
console.error(e)
}
copy(content)
- // addTooltip('Copied value to clipboard.')
+ setMessage('Copied')
} else {
- // addTooltip('Cannot copy empty content!')
+ setMessage('Cannot copy empty content!')
}
}
+ const reset = () => {
+ setTimeout(() => setMessage('Copy'), 500)
+ }
+
return (
-
+
+
+ { message }
+
+ }>
+
+
+
)
}
diff --git a/package-lock.json b/package-lock.json
index d34b490a43..48ac7a872f 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2232,7 +2232,6 @@
"version": "7.10.5",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.10.5.tgz",
"integrity": "sha512-otddXKhdNn7d0ptoFRHtMLa8LqDxLYwTjB4nYgM1yy5N6gU/MUf8zqyyLltCH3yAVitBzmwK4us+DD0l/MauAg==",
- "dev": true,
"requires": {
"regenerator-runtime": "^0.13.4"
}
@@ -6875,6 +6874,11 @@
"@types/node": ">= 8"
}
},
+ "@popperjs/core": {
+ "version": "2.5.2",
+ "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.5.2.tgz",
+ "integrity": "sha512-tVkIU9JQw5fYPxLQgok/a7I6J1eEZ79svwQGpe2mb3jlVsPADOleefOnQBiS/takK7jQuNeswCUicMH1VWVziA=="
+ },
"@remixproject/engine": {
"version": "0.2.4",
"resolved": "https://registry.npmjs.org/@remixproject/engine/-/engine-0.2.4.tgz",
@@ -6975,6 +6979,20 @@
}
}
},
+ "@restart/context": {
+ "version": "2.1.4",
+ "resolved": "https://registry.npmjs.org/@restart/context/-/context-2.1.4.tgz",
+ "integrity": "sha512-INJYZQJP7g+IoDUh/475NlGiTeMfwTXUEr3tmRneckHIxNolGOW9CTq83S8cxq0CgJwwcMzMJFchxvlwe7Rk8Q=="
+ },
+ "@restart/hooks": {
+ "version": "0.3.25",
+ "resolved": "https://registry.npmjs.org/@restart/hooks/-/hooks-0.3.25.tgz",
+ "integrity": "sha512-m2v3N5pxTsIiSH74/sb1yW8D9RxkJidGW+5Mfwn/lHb2QzhZNlaU1su7abSyT9EGf0xS/0waLjrf7/XxQHUk7w==",
+ "requires": {
+ "lodash": "^4.17.15",
+ "lodash-es": "^4.17.15"
+ }
+ },
"@rollup/plugin-babel": {
"version": "5.0.2",
"resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.0.2.tgz",
@@ -7291,6 +7309,11 @@
"integrity": "sha512-t7uW6eFafjO+qJ3BIV2gGUyZs27egcNRkUdalkud+Qa3+kg//f129iuOFivHDXQ+vnU3fDXuwgv0cqMCbcE8sw==",
"dev": true
},
+ "@types/classnames": {
+ "version": "2.2.10",
+ "resolved": "https://registry.npmjs.org/@types/classnames/-/classnames-2.2.10.tgz",
+ "integrity": "sha512-1UzDldn9GfYYEsWWnn/P4wkTlkZDH7lDb0wBMGbtIQc9zXEQq7FlKBdZUn6OBqD8sKZZ2RQO2mAjGpXiDGoRmQ=="
+ },
"@types/color-name": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/@types/color-name/-/color-name-1.1.1.tgz",
@@ -7341,6 +7364,11 @@
"integrity": "sha512-GRTZLeLJ8ia00ZH8mxMO8t0aC9M1N9bN461Z2eaRurJo6Fpa+utgCwLzI4jQHcrdzuzp5WPN9jRwpsCQ1VhJ5w==",
"dev": true
},
+ "@types/invariant": {
+ "version": "2.2.34",
+ "resolved": "https://registry.npmjs.org/@types/invariant/-/invariant-2.2.34.tgz",
+ "integrity": "sha512-lYUtmJ9BqUN688fGY1U1HZoWT1/Jrmgigx2loq4ZcJpICECm/Om3V314BxdzypO0u5PORKGMM6x0OXaljV1YFg=="
+ },
"@types/istanbul-lib-coverage": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.3.tgz",
@@ -7449,8 +7477,7 @@
"@types/prop-types": {
"version": "15.7.3",
"resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.3.tgz",
- "integrity": "sha512-KfRL3PuHmqQLOG+2tGpRO26Ctg+Cq1E01D2DMriKEATHgWLfeNDmq9e29Q9WIky0dQ3NPkd1mzYH8Lm936Z9qw==",
- "dev": true
+ "integrity": "sha512-KfRL3PuHmqQLOG+2tGpRO26Ctg+Cq1E01D2DMriKEATHgWLfeNDmq9e29Q9WIky0dQ3NPkd1mzYH8Lm936Z9qw=="
},
"@types/q": {
"version": "1.5.4",
@@ -7462,7 +7489,6 @@
"version": "16.9.17",
"resolved": "https://registry.npmjs.org/@types/react/-/react-16.9.17.tgz",
"integrity": "sha512-UP27In4fp4sWF5JgyV6pwVPAQM83Fj76JOcg02X5BZcpSu5Wx+fP9RMqc2v0ssBoQIFvD5JdKY41gjJJKmw6Bg==",
- "dev": true,
"requires": {
"@types/prop-types": "*",
"csstype": "^2.2.0"
@@ -7498,6 +7524,14 @@
"@types/react-router": "*"
}
},
+ "@types/react-transition-group": {
+ "version": "4.4.0",
+ "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.0.tgz",
+ "integrity": "sha512-/QfLHGpu+2fQOqQaXh8MG9q03bFENooTb/it4jr5kKaZlDQfWvjqWZg48AwzPVMBHlRuTRAY7hRHCEOXz5kV6w==",
+ "requires": {
+ "@types/react": "*"
+ }
+ },
"@types/resolve": {
"version": "0.0.8",
"resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-0.0.8.tgz",
@@ -7561,6 +7595,11 @@
}
}
},
+ "@types/warning": {
+ "version": "3.0.0",
+ "resolved": "https://registry.npmjs.org/@types/warning/-/warning-3.0.0.tgz",
+ "integrity": "sha1-DSUBJorY+ZYrdA04fEZU9fjiPlI="
+ },
"@types/webpack-sources": {
"version": "0.1.8",
"resolved": "https://registry.npmjs.org/@types/webpack-sources/-/webpack-sources-0.1.8.tgz",
@@ -12134,6 +12173,11 @@
}
}
},
+ "classnames": {
+ "version": "2.2.6",
+ "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.2.6.tgz",
+ "integrity": "sha512-JR/iSQOSt+LQIWwrwEzJ9uk0xfN3mTVYMwt1Ir5mUcSN6pU+V4zQFFaJsclJbPuAUQH+yfWef6tm7l1quW3C8Q=="
+ },
"clean-css": {
"version": "4.2.1",
"resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.2.1.tgz",
@@ -13787,8 +13831,7 @@
"csstype": {
"version": "2.6.11",
"resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.11.tgz",
- "integrity": "sha512-l8YyEC9NBkSm783PFTvh0FmJy7s5pFKrDp49ZL7zBGX3fWkO+N4EEyan1qqp8cwPLDcD0OSdyY6hAMoxp34JFw==",
- "dev": true
+ "integrity": "sha512-l8YyEC9NBkSm783PFTvh0FmJy7s5pFKrDp49ZL7zBGX3fWkO+N4EEyan1qqp8cwPLDcD0OSdyY6hAMoxp34JFw=="
},
"currently-unhandled": {
"version": "0.4.1",
@@ -14713,6 +14756,22 @@
}
}
},
+ "dom-helpers": {
+ "version": "5.2.0",
+ "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.2.0.tgz",
+ "integrity": "sha512-Ru5o9+V8CpunKnz5LGgWXkmrH/20cGKwcHwS4m73zIvs54CN9epEmT/HLqFJW3kXpakAFkEdzgy1hzlJe3E4OQ==",
+ "requires": {
+ "@babel/runtime": "^7.8.7",
+ "csstype": "^3.0.2"
+ },
+ "dependencies": {
+ "csstype": {
+ "version": "3.0.3",
+ "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.3.tgz",
+ "integrity": "sha512-jPl+wbWPOWJ7SXsWyqGRk3lGecbar0Cb0OvZF/r/ZU011R4YqiRehgkQ9p4eQfo9DSDLqLL3wHwfxeJiuIsNag=="
+ }
+ }
+ },
"dom-serialize": {
"version": "2.2.1",
"resolved": "https://registry.npmjs.org/dom-serialize/-/dom-serialize-2.2.1.tgz",
@@ -20743,7 +20802,6 @@
"version": "2.2.4",
"resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz",
"integrity": "sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==",
- "dev": true,
"requires": {
"loose-envify": "^1.0.0"
}
@@ -22383,7 +22441,6 @@
"version": "25.5.1",
"resolved": "https://registry.npmjs.org/babel-jest/-/babel-jest-25.5.1.tgz",
"integrity": "sha512-9dA9+GmMjIzgPnYtkhBg73gOo/RHqPmLruP3BaGL4KEX3Dwz6pI8auSN8G8+iuEG90+GSswyKvslN+JYSaacaQ==",
- "dev": true,
"requires": {
"@jest/transform": "^25.5.1",
"@jest/types": "^25.5.0",
@@ -22391,8 +22448,7 @@
"babel-plugin-istanbul": "^6.0.0",
"babel-preset-jest": "^25.5.0",
"chalk": "^3.0.0",
- "graceful-fs": "^4.2.4",
- "slash": "^3.0.0"
+ "graceful-fs": "^4.2.4"
}
},
"chalk": {
@@ -22511,8 +22567,7 @@
"slash": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
- "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
- "dev": true
+ "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q=="
},
"supports-color": {
"version": "7.1.0",
@@ -24664,6 +24719,11 @@
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.19.tgz",
"integrity": "sha512-JNvd8XER9GQX0v2qJgsaN/mzFCNA5BRe/j8JN9d+tWyGLSodKQHKFicdwNYzWwI3wjRnaKPsGj1XkBjx/F96DQ=="
},
+ "lodash-es": {
+ "version": "4.17.15",
+ "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.15.tgz",
+ "integrity": "sha512-rlrc3yU3+JNOpZ9zj5pQtxnx2THmvRykwL4Xlxoa8I9lHBlVbbyPhgyPMioxVZ4NqyxaVVtaJnzsyOidQIhyyQ=="
+ },
"lodash._arraycopy": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/lodash._arraycopy/-/lodash._arraycopy-3.0.0.tgz",
@@ -35070,6 +35130,15 @@
"react-is": "^16.8.1"
}
},
+ "prop-types-extra": {
+ "version": "1.1.1",
+ "resolved": "https://registry.npmjs.org/prop-types-extra/-/prop-types-extra-1.1.1.tgz",
+ "integrity": "sha512-59+AHNnHYCdiC+vMwY52WmvP5dM3QLeoumYuEyceQDi9aEhtwN9zIQ2ZNo25sMyXnbh32h+P1ezDsUpUH3JAew==",
+ "requires": {
+ "react-is": "^16.3.2",
+ "warning": "^4.0.0"
+ }
+ },
"proto-list": {
"version": "1.2.4",
"resolved": "https://registry.npmjs.org/proto-list/-/proto-list-1.2.4.tgz",
@@ -35388,6 +35457,47 @@
"prop-types": "^15.6.2"
}
},
+ "react-bootstrap": {
+ "version": "1.3.0",
+ "resolved": "https://registry.npmjs.org/react-bootstrap/-/react-bootstrap-1.3.0.tgz",
+ "integrity": "sha512-GYj0c6FO9mx7DaO8Xyz2zs0IcQ6CGCtM3O6/feIoCaG4N8B0+l4eqL7stlMcLpqO4d8NG2PoMO/AbUOD+MO7mg==",
+ "requires": {
+ "@babel/runtime": "^7.4.2",
+ "@restart/context": "^2.1.4",
+ "@restart/hooks": "^0.3.21",
+ "@types/classnames": "^2.2.10",
+ "@types/invariant": "^2.2.33",
+ "@types/prop-types": "^15.7.3",
+ "@types/react": "^16.9.35",
+ "@types/react-transition-group": "^4.4.0",
+ "@types/warning": "^3.0.0",
+ "classnames": "^2.2.6",
+ "dom-helpers": "^5.1.2",
+ "invariant": "^2.2.4",
+ "prop-types": "^15.7.2",
+ "prop-types-extra": "^1.1.0",
+ "react-overlays": "^4.1.0",
+ "react-transition-group": "^4.4.1",
+ "uncontrollable": "^7.0.0",
+ "warning": "^4.0.3"
+ },
+ "dependencies": {
+ "@types/react": {
+ "version": "16.9.49",
+ "resolved": "https://registry.npmjs.org/@types/react/-/react-16.9.49.tgz",
+ "integrity": "sha512-DtLFjSj0OYAdVLBbyjhuV9CdGVHCkHn2R+xr3XkBvK2rS1Y1tkc14XSGjYgm5Fjjr90AxH9tiSzc1pCFMGO06g==",
+ "requires": {
+ "@types/prop-types": "*",
+ "csstype": "^3.0.2"
+ }
+ },
+ "csstype": {
+ "version": "3.0.3",
+ "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.3.tgz",
+ "integrity": "sha512-jPl+wbWPOWJ7SXsWyqGRk3lGecbar0Cb0OvZF/r/ZU011R4YqiRehgkQ9p4eQfo9DSDLqLL3wHwfxeJiuIsNag=="
+ }
+ }
+ },
"react-dom": {
"version": "16.13.1",
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.13.1.tgz",
@@ -35404,6 +35514,37 @@
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
},
+ "react-lifecycles-compat": {
+ "version": "3.0.4",
+ "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
+ "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
+ },
+ "react-overlays": {
+ "version": "4.1.0",
+ "resolved": "https://registry.npmjs.org/react-overlays/-/react-overlays-4.1.0.tgz",
+ "integrity": "sha512-vdRpnKe0ckWOOD9uWdqykLUPHLPndIiUV7XfEKsi5008xiyHCfL8bxsx4LbMrfnxW1LzRthLyfy50XYRFNQqqw==",
+ "requires": {
+ "@babel/runtime": "^7.4.5",
+ "@popperjs/core": "^2.0.0",
+ "@restart/hooks": "^0.3.12",
+ "@types/warning": "^3.0.0",
+ "dom-helpers": "^5.1.0",
+ "prop-types": "^15.7.2",
+ "uncontrollable": "^7.0.0",
+ "warning": "^4.0.3"
+ }
+ },
+ "react-transition-group": {
+ "version": "4.4.1",
+ "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.1.tgz",
+ "integrity": "sha512-Djqr7OQ2aPUiYurhPalTrVy9ddmFCCzwhqQmtN+J3+3DzLO209Fdr70QrN8Z3DsglWql6iY1lDWAfpFiBtuKGw==",
+ "requires": {
+ "@babel/runtime": "^7.5.5",
+ "dom-helpers": "^5.0.1",
+ "loose-envify": "^1.4.0",
+ "prop-types": "^15.6.2"
+ }
+ },
"read": {
"version": "1.0.7",
"resolved": "https://registry.npmjs.org/read/-/read-1.0.7.tgz",
@@ -35695,8 +35836,7 @@
"regenerator-runtime": {
"version": "0.13.5",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.5.tgz",
- "integrity": "sha512-ZS5w8CpKFinUzOwW3c83oPeVXoNsrLsaCoLtJvAClH135j/R77RuymhiSErhm2lKcwSCIpmvIWSbDkIfAqKQlA==",
- "dev": true
+ "integrity": "sha512-ZS5w8CpKFinUzOwW3c83oPeVXoNsrLsaCoLtJvAClH135j/R77RuymhiSErhm2lKcwSCIpmvIWSbDkIfAqKQlA=="
},
"regenerator-transform": {
"version": "0.14.5",
@@ -40322,6 +40462,17 @@
"integrity": "sha1-5z3T17DXxe2G+6xrCufYxqadUPo=",
"dev": true
},
+ "uncontrollable": {
+ "version": "7.1.1",
+ "resolved": "https://registry.npmjs.org/uncontrollable/-/uncontrollable-7.1.1.tgz",
+ "integrity": "sha512-EcPYhot3uWTS3w00R32R2+vS8Vr53tttrvMj/yA1uYRhf8hbTG2GyugGqWDY0qIskxn0uTTojVd6wPYW9ZEf8Q==",
+ "requires": {
+ "@babel/runtime": "^7.6.3",
+ "@types/react": "^16.9.11",
+ "invariant": "^2.2.4",
+ "react-lifecycles-compat": "^3.0.4"
+ }
+ },
"undeclared-identifiers": {
"version": "1.1.3",
"resolved": "https://registry.npmjs.org/undeclared-identifiers/-/undeclared-identifiers-1.1.3.tgz",
@@ -41080,6 +41231,14 @@
"makeerror": "1.0.x"
}
},
+ "warning": {
+ "version": "4.0.3",
+ "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz",
+ "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==",
+ "requires": {
+ "loose-envify": "^1.0.0"
+ }
+ },
"watchify": {
"version": "3.11.1",
"resolved": "https://registry.npmjs.org/watchify/-/watchify-3.11.1.tgz",
diff --git a/package.json b/package.json
index 754c9a76a5..156ac0ae9e 100644
--- a/package.json
+++ b/package.json
@@ -139,6 +139,9 @@
"http-server": "^0.11.1",
"merge": "^1.2.0",
"npm-install-version": "^6.0.2",
+ "react": "16.13.1",
+ "react-bootstrap": "^1.3.0",
+ "react-dom": "16.13.1",
"signale": "^1.4.0",
"time-stamp": "^2.2.0",
"winston": "^3.3.3",
@@ -151,9 +154,7 @@
"commander": "^2.20.3",
"fs-extra": "^3.0.1",
"isbinaryfile": "^3.0.2",
- "ws": "^7.3.0",
- "react": "16.13.1",
- "react-dom": "16.13.1"
+ "ws": "^7.3.0"
},
"devDependencies": {
"@babel/core": "^7.4.5",