Make copy to clipboard an exported utility
This commit is contained in:
parent
c944d1fdf5
commit
969e6531d5
|
@ -1,42 +1,21 @@
|
|||
<script>
|
||||
import Icon from "../Icon/Icon.svelte"
|
||||
import { copyToClipboard } from "../helpers"
|
||||
import { notifications } from "../Stores/notifications"
|
||||
|
||||
export let value
|
||||
|
||||
const onClick = e => {
|
||||
const onClick = async e => {
|
||||
e.stopPropagation()
|
||||
copyToClipboard(value)
|
||||
}
|
||||
|
||||
const copyToClipboard = value => {
|
||||
return new Promise(res => {
|
||||
if (navigator.clipboard && window.isSecureContext) {
|
||||
// Try using the clipboard API first
|
||||
navigator.clipboard.writeText(value).then(res)
|
||||
} else {
|
||||
// Fall back to the textarea hack
|
||||
let textArea = document.createElement("textarea")
|
||||
textArea.value = value
|
||||
textArea.style.position = "fixed"
|
||||
textArea.style.left = "-9999px"
|
||||
textArea.style.top = "-9999px"
|
||||
document.body.appendChild(textArea)
|
||||
textArea.focus()
|
||||
textArea.select()
|
||||
document.execCommand("copy")
|
||||
textArea.remove()
|
||||
res()
|
||||
}
|
||||
})
|
||||
.then(() => {
|
||||
notifications.success("Copied to clipboard")
|
||||
})
|
||||
.catch(() => {
|
||||
notifications.error(
|
||||
"Failed to copy to clipboard. Check the dev console for the value."
|
||||
)
|
||||
console.warn("Failed to copy the value", value)
|
||||
})
|
||||
try {
|
||||
await copyToClipboard(value)
|
||||
notifications.success("Copied to clipboard")
|
||||
} catch (error) {
|
||||
notifications.error(
|
||||
"Failed to copy to clipboard. Check the dev console for the value."
|
||||
)
|
||||
console.warn("Failed to copy the value", value)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
|
@ -1,3 +1,5 @@
|
|||
import { notifications } from "./Stores/notifications"
|
||||
|
||||
/**
|
||||
* Generates a DOM safe UUID.
|
||||
* Starting with a letter is important to make it DOM safe.
|
||||
|
@ -106,3 +108,29 @@ export const deepSet = (obj, key, value) => {
|
|||
export const cloneDeep = obj => {
|
||||
return JSON.parse(JSON.stringify(obj))
|
||||
}
|
||||
|
||||
/**
|
||||
* Copies a value to the clipboard
|
||||
* @param value the value to copy
|
||||
*/
|
||||
export const copyToClipboard = value => {
|
||||
return new Promise(res => {
|
||||
if (navigator.clipboard && window.isSecureContext) {
|
||||
// Try using the clipboard API first
|
||||
navigator.clipboard.writeText(value).then(res)
|
||||
} else {
|
||||
// Fall back to the textarea hack
|
||||
let textArea = document.createElement("textarea")
|
||||
textArea.value = value
|
||||
textArea.style.position = "fixed"
|
||||
textArea.style.left = "-9999px"
|
||||
textArea.style.top = "-9999px"
|
||||
document.body.appendChild(textArea)
|
||||
textArea.focus()
|
||||
textArea.select()
|
||||
document.execCommand("copy")
|
||||
textArea.remove()
|
||||
res()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue