Created
May 25, 2023 01:51
-
-
Save guxuerui/9e3ada4930395865fa524617fcf5be50 to your computer and use it in GitHub Desktop.
Copy code block content to clipboard
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import { copyToClipboard } from 'utils-snap-fn' | |
| const copyIcon = ` | |
| <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 32 32"><path fill="currentColor" d="M28 10v18H10V10h18m0-2H10a2 2 0 0 0-2 2v18a2 2 0 0 0 2 2h18a2 2 0 0 0 2-2V10a2 2 0 0 0-2-2Z"/><path fill="currentColor" d="M4 18H2V4a2 2 0 0 1 2-2h14v2H4Z"/></svg> | |
| ` | |
| const copiedIcon = ` | |
| <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 32 32"><path fill="#00a98e" d="m14 21.414l-5-5.001L10.413 15L14 18.586L21.585 11L23 12.415l-9 8.999z"/><path fill="#00a98e" d="M16 2a14 14 0 1 0 14 14A14 14 0 0 0 16 2Zm0 26a12 12 0 1 1 12-12a12 12 0 0 1-12 12Z"/></svg> | |
| ` | |
| function htmlDecode(input: any) { | |
| const doc = new DOMParser().parseFromString(input, 'text/html') | |
| return doc.documentElement.textContent | |
| } | |
| async function copyCode(block: any) { | |
| const copiedCode = block.cloneNode(true) | |
| copiedCode.removeChild(copiedCode.querySelector('button.copy-btn')) | |
| // remove all HTML tags in pre tag | |
| const html = copiedCode.outerHTML.replace(/<[^>]*>?/gm, '') | |
| const iconBtn = block.querySelector('button.copy-btn') | |
| iconBtn.innerHTML = copiedIcon | |
| setTimeout(() => { | |
| iconBtn.innerHTML = copyIcon | |
| }, 2000) | |
| const parsedHTML = htmlDecode(html) | |
| await copyToClipboard(parsedHTML) | |
| } | |
| export function setCopy() { | |
| if (!navigator.clipboard) | |
| return | |
| const preTags = document.getElementsByTagName('pre') | |
| setTimeout(() => { | |
| const preTagsArr = Array.from(preTags) | |
| for (let i = 0; i < preTagsArr.length; i++) { | |
| preTagsArr[i].style.position = 'relative' | |
| const copyBtn = document.createElement('button') | |
| copyBtn.innerHTML = copyIcon | |
| copyBtn.classList.add('copy-btn') | |
| preTagsArr[i].appendChild(copyBtn) | |
| copyBtn.addEventListener('click', async () => { | |
| await copyCode(preTagsArr[i]) | |
| }) | |
| } | |
| }, 100) | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment