diff --git a/packages/freesewing.dev/package.json b/packages/freesewing.dev/package.json
index ddb8d0776ad..e005bb7806e 100644
--- a/packages/freesewing.dev/package.json
+++ b/packages/freesewing.dev/package.json
@@ -28,6 +28,7 @@
"lodash.set": "^4.3.2",
"netlify-cli": "^8.4.2",
"next": "latest",
+ "react-copy-to-clipboard": "^5.0.4",
"react-hotkeys-hook": "^3.4.4",
"react-instantsearch-dom": "^6.18.0",
"react-markdown": "^7.1.1",
diff --git a/packages/freesewing.shared/components/copy-to-clipboard.js b/packages/freesewing.shared/components/copy-to-clipboard.js
new file mode 100644
index 00000000000..d9dbe79b3e4
--- /dev/null
+++ b/packages/freesewing.shared/components/copy-to-clipboard.js
@@ -0,0 +1,27 @@
+import ReactDOMServer from 'react-dom/server'
+import { useState, useEffect } from 'react'
+import CopyIcon from 'shared/components/icons/copy.js'
+import {CopyToClipboard} from 'react-copy-to-clipboard'
+
+const strip = html => new DOMParser()
+ .parseFromString(html, 'text/html')
+ .body.textContent || ""
+
+
+const CopyToClipboardIcon = ({ content }) => {
+
+ const [copied, setCopied] = useState(false)
+
+ const text = (typeof content === 'string')
+ ? content
+ : strip(ReactDOMServer.renderToStaticMarkup(content))
+
+ return (
+
{children} diff --git a/yarn.lock b/yarn.lock index ce7b0e36fa4..57ff0f028c6 100644 --- a/yarn.lock +++ b/yarn.lock @@ -23286,7 +23286,7 @@ react-app-polyfill@^2.0.0: regenerator-runtime "^0.13.7" whatwg-fetch "^3.4.1" -react-copy-to-clipboard@^5.0.3: +react-copy-to-clipboard@^5.0.3, react-copy-to-clipboard@^5.0.4: version "5.0.4" resolved "https://registry.yarnpkg.com/react-copy-to-clipboard/-/react-copy-to-clipboard-5.0.4.tgz#42ec519b03eb9413b118af92d1780c403a5f19bf" integrity sha512-IeVAiNVKjSPeGax/Gmkqfa/+PuMTBhutEvFUaMQLwE2tS0EXrAdgOpWDX26bWTXF3HrioorR7lr08NqeYUWQCQ==