aboutsummaryrefslogtreecommitdiff
path: root/src/components/SpanCopyable.vue
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/SpanCopyable.vue')
-rw-r--r--src/components/SpanCopyable.vue15
1 files changed, 4 insertions, 11 deletions
diff --git a/src/components/SpanCopyable.vue b/src/components/SpanCopyable.vue
index 17b1a59..7ab3a1d 100644
--- a/src/components/SpanCopyable.vue
+++ b/src/components/SpanCopyable.vue
@@ -1,26 +1,19 @@
<script setup lang="ts">
-import { useClipboard } from '@vueuse/core';
+import { useCopy } from '@/composable/copy';
const props = withDefaults(defineProps<{ value?: string }>(), { value: '' });
const { value } = toRefs(props);
const initialText = 'Copy to clipboard';
-const tooltipText = ref(initialText);
-const { copy } = useClipboard({ source: value });
-
-function handleClick() {
- copy();
- tooltipText.value = 'Copied!';
-
- setTimeout(() => (tooltipText.value = initialText), 1000);
-}
+const { copy, isJustCopied } = useCopy({ source: value, createToast: false });
+const tooltipText = computed(() => isJustCopied.value ? 'Copied!' : initialText);
</script>
<template>
<n-tooltip trigger="hover">
<template #trigger>
- <span class="value" @click="handleClick">{{ value }}</span>
+ <span class="value" @click="copy()">{{ value }}</span>
</template>
{{ tooltipText }}
</n-tooltip>