import { ref, watch } from 'vue';
|
|
import { isDef } from '/@/utils/is';
|
|
interface Options {
|
target?: HTMLElement;
|
}
|
export function useCopyToClipboard(initial?: string) {
|
const clipboardRef = ref(initial || '');
|
const isSuccessRef = ref(false);
|
const copiedRef = ref(false);
|
|
watch(
|
clipboardRef,
|
(str?: string) => {
|
if (isDef(str)) {
|
copiedRef.value = true;
|
isSuccessRef.value = copyTextToClipboard(str);
|
}
|
},
|
{ immediate: !!initial, flush: 'sync' },
|
);
|
|
return { clipboardRef, isSuccessRef, copiedRef };
|
}
|
|
export function copyTextToClipboard(input: string, { target = document.body }: Options = {}) {
|
const element = document.createElement('textarea');
|
const previouslyFocusedElement = document.activeElement;
|
|
element.value = input;
|
|
element.setAttribute('readonly', '');
|
|
(element.style as any).contain = 'strict';
|
element.style.position = 'absolute';
|
element.style.left = '-9999px';
|
element.style.fontSize = '12pt';
|
|
const selection = document.getSelection();
|
let originalRange;
|
if (selection && selection.rangeCount > 0) {
|
originalRange = selection.getRangeAt(0);
|
}
|
|
target.append(element);
|
element.select();
|
|
element.selectionStart = 0;
|
element.selectionEnd = input.length;
|
|
let isSuccess = false;
|
try {
|
isSuccess = document.execCommand('copy');
|
} catch (e: any) {
|
throw new Error(e);
|
}
|
|
element.remove();
|
|
if (originalRange && selection) {
|
selection.removeAllRanges();
|
selection.addRange(originalRange);
|
}
|
|
if (previouslyFocusedElement) {
|
(previouslyFocusedElement as HTMLElement).focus();
|
}
|
return isSuccess;
|
}
|
