diff options
Diffstat (limited to 'src/components/SpanCopyable.vue')
-rw-r--r-- | src/components/SpanCopyable.vue | 15 |
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> |