import { useDraggable } from '@dnd-kit/core';

export function DraggableLabelChip({ id, name, color }: { id: number; name: string; color: string }) {
    const { attributes, listeners, setNodeRef, isDragging } = useDraggable({ id: `label-${id}` });

    return (
        <button
            ref={setNodeRef}
            {...attributes}
            {...listeners}
            type="button"
            title="Seret ke kartu tugas untuk menandainya"
            className={`text-xs font-semibold px-2.5 py-1 rounded-full text-white cursor-grab active:cursor-grabbing shadow-sm ${isDragging ? 'opacity-40' : ''}`}
            style={{ backgroundColor: color }}
        >
            {name}
        </button>
    );
}