30 lines
762 B
TypeScript
30 lines
762 B
TypeScript
import { cn } from "@/lib/utils";
|
|
|
|
type TileIconButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement> & {
|
|
icon: (props: any) => JSX.Element;
|
|
label: string;
|
|
active?: boolean;
|
|
};
|
|
|
|
export default function TileIconButton({
|
|
icon: Icon,
|
|
label,
|
|
active,
|
|
className,
|
|
...props
|
|
}: TileIconButtonProps) {
|
|
return (
|
|
<button
|
|
{...props}
|
|
className={cn(
|
|
"hover flex flex-col items-center justify-between rounded-md border-2 border-muted bg-popover p-4 transition-all hover:border-primary hover:bg-primary/5 hover:text-primary focus:border-primary",
|
|
active && "border-primary",
|
|
className,
|
|
)}
|
|
>
|
|
<Icon className="mb-3 h-6 w-6" />
|
|
<span className="font-semibold">{label}</span>
|
|
</button>
|
|
);
|
|
}
|