<script setup>
import { labelClass } from '@/Components/Supervisor/ui.js';

defineProps({
    label: {
        type: String,
        required: true,
    },
    hint: {
        type: String,
        default: '',
    },
    fieldClass: {
        type: String,
        default: '',
    },
});
</script>

<template>
    <div :class="fieldClass">
        <label class="block">
            <span :class="labelClass">{{ label }}</span>
            <slot />
        </label>
        <p v-if="hint" class="mt-1 text-xs text-slate-400">{{ hint }}</p>
    </div>
</template>
