<script setup>
defineProps({
    priorite: { type: String, required: true },
})

const labels = { normale: 'Normale', haute: 'Haute', urgente: 'Urgente' }
const colors = {
    normale:  'bg-gray-100 text-gray-600',
    haute:    'bg-amber-100 text-amber-700',
    urgente:  'bg-red-100 text-red-700',
}
</script>

<template>
    <span :class="['inline-flex items-center rounded-full px-2.5 py-1 text-xs font-medium whitespace-nowrap', colors[priorite] ?? colors.normale]">
        <span v-if="priorite === 'urgente'" class="mr-1">⚡</span>
        {{ labels[priorite] ?? priorite }}
    </span>
</template>
