fp/packages/next/app/components/vtuber-button.tsx

29 lines
824 B
TypeScript

import Image from "next/legacy/image"
interface VtuberButtonProps {
image: string;
displayName: string;
size?: string;
}
export default function VtuberButton ({ image, displayName, size }: VtuberButtonProps) {
const sizeClass = (() => {
if (size === 'large') return 'is-large';
if (size === 'medium') return 'is-medium';
if (size === 'small') return 'is-small'
})();
return (
<div className={`button ${sizeClass}`}>
<span className="icon image">
<Image
className='is-rounded'
src={image}
alt={displayName}
width={32}
height={32}
/>
</span>
<span>{displayName}</span>
</div>
);
}