Copy Button

1"use client";
2 
3import * as React from "react";
4import { cva, type VariantProps } from "class-variance-authority";
5import { AnimatePresence, motion } from "motion/react";
6import { Check, Copy } from "lucide-react";
7 
8import {
9  Button as ButtonPrimitive,
10  type ButtonProps as ButtonPrimitiveProps,
11} from "@/components/unlumen-ui/primitives/button";
12import { cn } from "@/lib/utils";
13import { useControlledState } from "@/hooks/use-controlled-state";
14 
15const buttonVariants = cva(
16  "flex items-center justify-center rounded-md transition-[box-shadow,_color,_background-color,_border-color,_outline-color,_text-decoration-color,_fill,_stroke] disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
17  {
18    variants: {
19      variant: {
20        default:
21          "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90",
22        accent: "bg-accent text-accent-foreground shadow-xs hover:bg-accent/90",
23        destructive:
24          "bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
25        outline:
26          "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
27        secondary:
28          "bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80",
29        ghost:
30          "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
31        link: "text-primary underline-offset-4 hover:underline",
32      },
33      size: {
34        default: "size-9",
35        xs: "size-7 [&_svg:not([class*='size-'])]:size-3.5 rounded-md",
36        sm: "size-8 rounded-md",
37        lg: "size-10 rounded-md",
38      },
39    },
40    defaultVariants: {
41      variant: "default",
42      size: "default",
43    },
44  },
45);
46 
47type CopyButtonProps = Omit<ButtonPrimitiveProps, "children"> &
48  VariantProps<typeof buttonVariants> & {
49    content: string;
50    copied?: boolean;
51    onCopiedChange?: (copied: boolean, content?: string) => void;
52    delay?: number;
53  };
54 
55function CopyButton({
56  className,
57  content,
58  copied,
59  onCopiedChange,
60  onClick,
61  variant,
62  size,
63  delay = 3000,
64  ...props
65}: CopyButtonProps) {
66// … truncated