import React from "react";
import {useCursor} from "@/components/cursor";
import {cn} from "@/lib/utils";

export function Button ({ children, className }: { children?: React.ReactNode, className?: string }) {
    const customCursor = useCursor();
    return (
        <button
            className={cn(
                "relative z-10 px-6 py-3 text-lg font-medium text-white rounded-full shadow-md transition-colors duration-100 hover:bg-white hover:text-black",
                className
            )}
            onMouseEnter={() => customCursor.toggleCursor()}
            onMouseLeave={() => customCursor.toggleCursor()}
            onClick={() => customCursor.toggleCursorEnabled()}
        >
            {children}
        </button>
    )
}