40 lines
1.2 KiB
TypeScript
40 lines
1.2 KiB
TypeScript
import {defaultIconSize} from "./SvgIcon";
|
|
import type {LucideIcon} from "lucide-react";
|
|
import {ButtonType} from "./BasicButtonDefinitions.ts";
|
|
import clsx from "clsx";
|
|
|
|
type CircularIconButtonProps = {
|
|
icon: LucideIcon;
|
|
onClick: () => void;
|
|
disabled?: boolean;
|
|
className?: string;
|
|
};
|
|
|
|
/**
|
|
* Circular button component
|
|
*/
|
|
export default function CircularIconButton({
|
|
onClick,
|
|
icon: Icon,
|
|
className = "",
|
|
disabled = false,
|
|
...props
|
|
}: CircularIconButtonProps) {
|
|
return (
|
|
<button
|
|
className={clsx(
|
|
"flex-shrink-0 w-7 h-7 rounded-full text-white flex items-center justify-center shadow-sm",
|
|
ButtonType.PrimaryButton.backgroundColor,
|
|
className)}
|
|
onClick={onClick}
|
|
disabled={disabled}
|
|
{...props}
|
|
>
|
|
{Icon && (
|
|
<Icon
|
|
size={defaultIconSize}
|
|
/>
|
|
)}
|
|
</button>
|
|
);
|
|
}
|