"use client"; import { Cookie } from "lucide-react"; import * as React from "react"; import { Button } from "@/components/ui/button"; import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, } from "@/components/ui/card"; import { cn } from "@/lib/utils"; // Define prop types interface CookieConsentProps extends React.HTMLAttributes { variant?: "default" | "small" | "mini"; demo?: boolean; onAcceptCallback?: () => void; onDeclineCallback?: () => void; description?: string; learnMoreHref?: string; } const CookieConsent = React.forwardRef( ( { variant = "default", demo = false, onAcceptCallback = () => {}, onDeclineCallback = () => {}, className, description = "We use cookies to ensure you get the best experience on our website. For more information on how we use cookies, please see our cookie policy.", learnMoreHref = "#", ...props }, ref ) => { const [isOpen, setIsOpen] = React.useState(false); const [hide, setHide] = React.useState(false); const handleAccept = React.useCallback(() => { setIsOpen(false); document.cookie = "cookieConsent=true; expires=Fri, 31 Dec 9999 23:59:59 GMT"; setTimeout(() => { setHide(true); }, 700); onAcceptCallback(); }, [onAcceptCallback]); const handleDecline = React.useCallback(() => { setIsOpen(false); setTimeout(() => { setHide(true); }, 700); onDeclineCallback(); }, [onDeclineCallback]); React.useEffect(() => { try { setIsOpen(true); if (document.cookie.includes("cookieConsent=true") && !demo) { setIsOpen(false); setTimeout(() => { setHide(true); }, 700); } } catch (error) { console.warn("Cookie consent error:", error); } }, [demo]); if (hide) return null; const containerClasses = cn( "fixed z-50 transition-all duration-700", isOpen ? "translate-y-0 opacity-100" : "translate-y-full opacity-0", className ); const commonWrapperProps = { ref, className: cn( containerClasses, variant === "mini" ? "right-0 bottom-4 left-0 w-full sm:left-4 sm:max-w-3xl" : "right-0 bottom-0 left-0 w-full sm:bottom-4 sm:left-4 sm:max-w-md" ), ...props, }; if (variant === "default") { return (

We use cookies {description}

By clicking "Accept", you agree to our use of cookies.

Learn more

); } if (variant === "small") { return (

We use cookies {description}

); } if (variant === "mini") { return (

{description}

); } return null; } ); CookieConsent.displayName = "CookieConsent"; export { CookieConsent }; export default CookieConsent;

shadcn-cookie-consent

Shadcn Cookie Consent

Installation

Preview