import { forwardRef } from "react";
import { cn } from "@/lib/cn";
import styles from "./Button.module.css";
import type { ButtonProps } from "./Button.types";

export const Button = forwardRef<HTMLButtonElement, ButtonProps>(
	(
		{ children, className, variant = "primary", size = "md", ...props },
		ref,
	) => {
		return (
			<button
				ref={ref}
				className={cn(styles.button, styles[variant], styles[size], className)}
				{...props}
			>
				<span className={styles.content}>{children}</span>
			</button>
		);
	},
);

Button.displayName = "Button";