31 lines
805 B
TypeScript
31 lines
805 B
TypeScript
import { clsx } from "clsx";
|
|
import { forwardRef, JSX } from "react";
|
|
|
|
const sizeClasses = {
|
|
medium: "py-2 px-4",
|
|
};
|
|
|
|
export type ButtonProps = JSX.IntrinsicElements["button"] & {
|
|
size?: keyof typeof sizeClasses;
|
|
};
|
|
|
|
export const Button = forwardRef<HTMLButtonElement, ButtonProps>(
|
|
({ size = "medium", className, children, ...props }, ref) => {
|
|
return (
|
|
<button
|
|
ref={ref}
|
|
className={clsx(
|
|
"border border-neutral-800 rounded-md not-disabled:cursor-pointer not-disabled:hover:bg-neutral-800 not-disabled:hover:text-white/90 disabled:cursor-not-allowed active:scale-95 transition duration-200",
|
|
className,
|
|
sizeClasses[size],
|
|
)}
|
|
{...props}
|
|
>
|
|
{children}
|
|
</button>
|
|
);
|
|
},
|
|
);
|
|
|
|
Button.displayName = "Button";
|