diff options
author | 2023-08-27 20:12:31 +0200 | |
---|---|---|
committer | 2023-08-27 18:12:31 +0000 | |
commit | 3a63837d3d47e7adbdf024de8dca6a2736b5a55e (patch) | |
tree | 9980e9c37cd8666728d352d066693ec46f3a5b0f /src/ui/c-text-copyable/c-text-copyable.vue | |
parent | 81bfe57cb85690f4153683754ffb09f35a816dac (diff) | |
download | it-tools-3a63837d3d47e7adbdf024de8dca6a2736b5a55e.tar.gz it-tools-3a63837d3d47e7adbdf024de8dca6a2736b5a55e.tar.zst it-tools-3a63837d3d47e7adbdf024de8dca6a2736b5a55e.zip |
feat(new tool): iban validation and parser (#591)
Diffstat (limited to 'src/ui/c-text-copyable/c-text-copyable.vue')
-rw-r--r-- | src/ui/c-text-copyable/c-text-copyable.vue | 17 |
1 files changed, 17 insertions, 0 deletions
diff --git a/src/ui/c-text-copyable/c-text-copyable.vue b/src/ui/c-text-copyable/c-text-copyable.vue new file mode 100644 index 0000000..b78e4cd --- /dev/null +++ b/src/ui/c-text-copyable/c-text-copyable.vue @@ -0,0 +1,17 @@ +<script setup lang="ts"> +import { useCopy } from '@/composable/copy'; + +const props = withDefaults(defineProps<{ value?: string; displayedValue?: string; showIcon?: boolean }>(), { value: '', displayedValue: undefined, showIcon: true }); +const { value, displayedValue, showIcon } = toRefs(props); + +const { copy, isJustCopied } = useCopy({ source: value, createToast: false }); +</script> + +<template> + <c-tooltip :tooltip="isJustCopied ? 'Copied!' : 'Copy to clipboard'" cursor-pointer @click="copy"> + <span flex items-center gap-2> + {{ displayedValue ?? value }} + <icon-mdi-content-copy v-if="showIcon" op-40 /> + </span> + </c-tooltip> +</template> |