rnotes-online/src/components/TagBadge.tsx

22 lines
596 B
TypeScript

interface TagBadgeProps {
name: string;
color?: string | null;
onClick?: () => void;
}
export function TagBadge({ name, color, onClick }: TagBadgeProps) {
const Component = onClick ? 'button' : 'span';
return (
<Component
onClick={onClick}
className="inline-flex items-center gap-1 text-[10px] px-1.5 py-0.5 rounded-full bg-slate-700/50 text-slate-300 hover:bg-slate-700 transition-colors"
>
<span
className="w-1.5 h-1.5 rounded-full flex-shrink-0"
style={{ backgroundColor: color || '#6b7280' }}
/>
{name}
</Component>
);
}