diff --git a/docs/app/components/content/examples/input/InputCopyButtonExample.vue b/docs/app/components/content/examples/input/InputCopyButtonExample.vue
index aa788d1c..985a2bb1 100644
--- a/docs/app/components/content/examples/input/InputCopyButtonExample.vue
+++ b/docs/app/components/content/examples/input/InputCopyButtonExample.vue
@@ -1,15 +1,9 @@
@@ -25,7 +19,7 @@ function copy() {
size="sm"
:icon="copied ? 'i-lucide-copy-check' : 'i-lucide-copy'"
aria-label="Copy to clipboard"
- @click="copy"
+ @click="copy(value)"
/>
diff --git a/docs/app/components/content/examples/table/TableExample.vue b/docs/app/components/content/examples/table/TableExample.vue
index 614f79d5..ae1bfc08 100644
--- a/docs/app/components/content/examples/table/TableExample.vue
+++ b/docs/app/components/content/examples/table/TableExample.vue
@@ -2,6 +2,7 @@
import { h, resolveComponent } from 'vue'
import { upperFirst } from 'scule'
import type { TableColumn } from '@nuxt/ui'
+import { useClipboard } from '@vueuse/core'
const UButton = resolveComponent('UButton')
const UCheckbox = resolveComponent('UCheckbox')
@@ -9,6 +10,7 @@ const UBadge = resolveComponent('UBadge')
const UDropdownMenu = resolveComponent('UDropdownMenu')
const toast = useToast()
+const { copy } = useClipboard()
type Payment = {
id: string
@@ -220,7 +222,7 @@ const columns: TableColumn[] = [{
}, {
label: 'Copy payment ID',
onSelect() {
- navigator.clipboard.writeText(row.original.id)
+ copy(row.original.id)
toast.add({
title: 'Payment ID copied to clipboard!',
diff --git a/docs/app/components/content/examples/table/TableRowActionsExample.vue b/docs/app/components/content/examples/table/TableRowActionsExample.vue
index 7d15b200..a677dcb6 100644
--- a/docs/app/components/content/examples/table/TableRowActionsExample.vue
+++ b/docs/app/components/content/examples/table/TableRowActionsExample.vue
@@ -2,12 +2,14 @@
import { h, resolveComponent } from 'vue'
import type { TableColumn } from '@nuxt/ui'
import type { Row } from '@tanstack/vue-table'
+import { useClipboard } from '@vueuse/core'
const UButton = resolveComponent('UButton')
const UBadge = resolveComponent('UBadge')
const UDropdownMenu = resolveComponent('UDropdownMenu')
const toast = useToast()
+const { copy } = useClipboard()
type Payment = {
id: string
@@ -119,7 +121,7 @@ function getRowItems(row: Row) {
}, {
label: 'Copy payment ID',
onSelect() {
- navigator.clipboard.writeText(row.original.id)
+ copy(row.original.id)
toast.add({
title: 'Payment ID copied to clipboard!',
diff --git a/docs/app/components/content/examples/table/TableSlotsExample.vue b/docs/app/components/content/examples/table/TableSlotsExample.vue
index 6288d268..cc654ca7 100644
--- a/docs/app/components/content/examples/table/TableSlotsExample.vue
+++ b/docs/app/components/content/examples/table/TableSlotsExample.vue
@@ -1,5 +1,6 @@