{
  "name": "DataTableDemoColumn",
  "type": "registry:example",
  "dependencies": [],
  "registryDependencies": [
    "button",
    "dropdown-menu"
  ],
  "files": [
    {
      "path": "example/DataTableDemoColumn.vue",
      "content": "<script setup lang=\"ts\">\nimport { Button } from '@/registry/default/ui/button'\nimport { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger } from '@/registry/default/ui/dropdown-menu'\nimport { MoreHorizontal } from 'lucide-vue-next'\n\ndefineProps<{\n  payment: {\n    id: string\n  }\n}>()\n\ndefineEmits<{\n  (e: 'expand'): void\n}>()\n\nfunction copy(id: string) {\n  navigator.clipboard.writeText(id)\n}\n</script>\n\n<template>\n  <DropdownMenu>\n    <DropdownMenuTrigger as-child>\n      <Button variant=\"ghost\" class=\"h-8 w-8 p-0\">\n        <span class=\"sr-only\">Open menu</span>\n        <MoreHorizontal class=\"h-4 w-4\" />\n      </Button>\n    </DropdownMenuTrigger>\n    <DropdownMenuContent align=\"end\">\n      <DropdownMenuLabel>Actions</DropdownMenuLabel>\n      <DropdownMenuItem @click=\"copy(payment.id)\">\n        Copy payment ID\n      </DropdownMenuItem>\n      <DropdownMenuItem @click=\"$emit('expand')\">\n        Expand\n      </DropdownMenuItem>\n      <DropdownMenuSeparator />\n      <DropdownMenuItem>View customer</DropdownMenuItem>\n      <DropdownMenuItem>View payment details</DropdownMenuItem>\n    </DropdownMenuContent>\n  </DropdownMenu>\n</template>\n",
      "type": "registry:example",
      "target": "DataTableDemoColumn.vue"
    }
  ]
}