{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "vote-feedback",
  "type": "registry:ui",
  "title": "Vote Feedback",
  "description": "A feedback component with upvote/downvote functionality",
  "dependencies": [
    "@kelet-ai/feedback-ui"
  ],
  "registryDependencies": [
    "button",
    "popover",
    "textarea"
  ],
  "files": [
    {
      "path": "src/ui/shadcn/vote-feedback.tsx",
      "content": "import * as React from \"react\"\nimport { VoteFeedback, type VoteFeedbackRootProps } from \"@kelet-ai/feedback-ui\"\nimport { ThumbsDown, ThumbsUp } from \"lucide-react\"\n\nimport { cn } from \"@/lib/utils\"\nimport { Button } from \"@/components/ui/button\"\nimport {\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from \"@/components/ui/popover\"\nimport { Textarea } from \"@/components/ui/textarea\"\n\ninterface ShadcnVoteFeedbackProps\n  extends Omit<VoteFeedbackRootProps, \"children\"> {\n  children?: React.ReactNode\n  variant?: \"default\" | \"outline\" | \"ghost\" | \"secondary\"\n  size?: \"default\" | \"sm\" | \"lg\" | \"icon\"\n  title?: string\n  description?: string\n  placeholder?: string\n  className?: string\n}\n\nconst ShadcnVoteFeedback = React.forwardRef<\n  HTMLDivElement,\n  ShadcnVoteFeedbackProps\n>(\n  (\n    {\n      children,\n      variant = \"outline\",\n      size = \"sm\",\n      title = \"Feedback\",\n      description = \"Help us improve by sharing your thoughts.\",\n      placeholder = \"What could we do better?\",\n      className,\n      ...props\n    },\n    ref\n  ) => {\n    let selectedVariant = variant\n    let selectedBg = \"\"\n    switch (variant) {\n      case \"outline\":\n        selectedBg = \"bg-secondary\"\n        break\n      case \"secondary\":\n        selectedVariant = \"default\"\n        break\n      case \"ghost\":\n        selectedBg = \"bg-secondary\"\n        break\n      case \"default\":\n        selectedVariant = \"secondary\"\n        break\n    }\n    return (\n      <div ref={ref} className={cn(\"flex items-center gap-1\", className)}>\n        <VoteFeedback.Root {...props}>\n          {/* Upvote Button */}\n          <VoteFeedback.UpvoteButton asChild>\n            {({ isSelected }) => (\n              <Button\n                variant={isSelected ? selectedVariant : variant}\n                size={size}\n                className={`h-8 w-8 p-0 ${isSelected ? `${selectedBg}` : \"\"}`}\n                data-selected={isSelected}\n                aria-label=\"Helpful\"\n              >\n                <ThumbsUp className=\"h-4 w-4\" />\n                <span className=\"sr-only\">Helpful</span>\n              </Button>\n            )}\n          </VoteFeedback.UpvoteButton>\n\n          {/* Downvote Button with Popover */}\n          <Popover>\n            <VoteFeedback.DownvoteButton asChild>\n              {({ isSelected }) => (\n                <PopoverTrigger asChild>\n                  <Button\n                    variant={isSelected ? selectedVariant : variant}\n                    size={size}\n                    className={`h-8 w-8 p-0 ${isSelected ? `${selectedBg}` : \"\"}`}\n                    data-selected={isSelected}\n                    aria-label=\"Not helpful\"\n                  >\n                    <ThumbsDown className=\"h-4 w-4\" />\n                    <span className=\"sr-only\">Not helpful</span>\n                  </Button>\n                </PopoverTrigger>\n              )}\n            </VoteFeedback.DownvoteButton>\n\n            <PopoverContent className=\"w-80 p-4\" side=\"bottom\" align=\"start\">\n              <div className=\"space-y-3\">\n                <div className=\"space-y-1\">\n                  <h4 className=\"font-medium leading-none\">{title}</h4>\n                  <p className=\"text-sm text-muted-foreground\">{description}</p>\n                </div>\n\n                <VoteFeedback.Textarea asChild>\n                  <Textarea\n                    placeholder={placeholder}\n                    className=\"min-h-[80px] resize-none\"\n                  />\n                </VoteFeedback.Textarea>\n\n                <div className=\"flex justify-end gap-2\">\n                  <VoteFeedback.SubmitButton asChild>\n                    <Button size=\"sm\">Submit</Button>\n                  </VoteFeedback.SubmitButton>\n                </div>\n              </div>\n            </PopoverContent>\n          </Popover>\n\n          {children}\n        </VoteFeedback.Root>\n      </div>\n    )\n  }\n)\n\nShadcnVoteFeedback.displayName = \"ShadcnVoteFeedback\"\n\nexport { ShadcnVoteFeedback }\nexport type { ShadcnVoteFeedbackProps }\n",
      "type": "registry:ui",
      "target": "components/ui/vote-feedback.tsx"
    }
  ]
}