aboutsummaryrefslogtreecommitdiff
path: root/src/components/InputCopyable.vue
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/InputCopyable.vue')
-rw-r--r--src/components/InputCopyable.vue36
1 files changed, 16 insertions, 20 deletions
diff --git a/src/components/InputCopyable.vue b/src/components/InputCopyable.vue
index ad4cc44..4105abf 100644
--- a/src/components/InputCopyable.vue
+++ b/src/components/InputCopyable.vue
@@ -3,45 +3,41 @@
<template #suffix>
<n-tooltip trigger="hover">
<template #trigger>
- <n-button
- quaternary
- circle
- @click="onCopyClicked"
- >
+ <n-button quaternary circle @click="onCopyClicked">
<n-icon :component="ContentCopyFilled" />
</n-button>
</template>
{{ tooltipText }}
</n-tooltip>
- </template>
+ </template>
</n-input>
</template>
<script setup lang="ts">
-import { useVModel, useClipboard } from '@vueuse/core'
-import { ContentCopyFilled } from '@vicons/material'
+import { useVModel, useClipboard } from '@vueuse/core';
+import { ContentCopyFilled } from '@vicons/material';
import { ref } from 'vue';
-const props = defineProps<{ value: string, }>()
-const emit = defineEmits(['update:value'])
+const props = defineProps<{ value: string }>();
+const emit = defineEmits(['update:value']);
-const value = useVModel(props, 'value', emit)
-const tooltipText = ref('Copy to clipboard')
+const value = useVModel(props, 'value', emit);
+const tooltipText = ref('Copy to clipboard');
-const {copy} = useClipboard({source: value})
+const { copy } = useClipboard({ source: value });
function onCopyClicked() {
- copy();
- tooltipText.value = 'Copied !'
+ copy();
+ tooltipText.value = 'Copied !';
- setTimeout(() => {
- tooltipText.value = 'Copy to clipboard'
- }, 2000)
+ setTimeout(() => {
+ tooltipText.value = 'Copy to clipboard';
+ }, 2000);
}
</script>
<style scoped>
::v-deep(.n-input-wrapper) {
- padding-right: 5px;
+ padding-right: 5px;
}
-</style> \ No newline at end of file
+</style>