"use client"; import React, { useState } from "react"; // Utility function to merge Tailwind CSS classes conditionally. // This is a simplified version of the 'clsx' or 'tailwind-merge' library. const cn = (...classes: (string | boolean | undefined | null)[]): string => { return classes.filter(Boolean).join(" "); }; // --- Icon Components (replaces lucide-react) --- // Check icon component using inline SVG const Check = ({ className }: { className?: string }) => ( ); // Copy icon component using inline SVG const Copy = ({ className }: { className?: string }) => ( ); // --- UI Components (replaces custom component library) --- // A simple, reusable Button component. const Button = React.forwardRef< HTMLButtonElement, React.ButtonHTMLAttributes & { className?: string; } >(({ className, children, ...props }, ref) => { return ( ); }); Button.displayName = "Button"; // --- The Main Button Component from your request --- interface CopyButtonProps extends React.ButtonHTMLAttributes { className?: string; textToCopy?: string; successDuration?: number; } function CopyButton({ className, textToCopy = "https://gemini.google.com/", successDuration = 2000, ...props }: CopyButtonProps) { const [isCopied, setIsCopied] = useState(false); async function handleCopy() { try { // Use modern Clipboard API if available if (navigator.clipboard && window.isSecureContext) { await navigator.clipboard.writeText(textToCopy); setIsCopied(true); setTimeout(() => setIsCopied(false), successDuration); } else { // Fallback for older browsers const textArea = document.createElement("textarea"); textArea.value = textToCopy; textArea.style.position = "fixed"; textArea.style.top = "-9999px"; textArea.style.left = "-9999px"; document.body.appendChild(textArea); textArea.focus(); textArea.select(); const successful = document.execCommand("copy"); if (successful) { setIsCopied(true); setTimeout(() => setIsCopied(false), successDuration); } document.body.removeChild(textArea); } } catch (err) { console.error("Failed to copy text:", err); } } return ( ); } // --- Main App Component to display the button --- export default function CopyButtonView() { return (

{/* Injecting keyframe animation directly with a style tag */}

Copy Button

Click the button below to copy the text to your clipboard.

); }

Smooth Moving Grid

Smooth Moving Grid