@props(['label' => null, 'name' => null, 'required' => false, 'hint' => null])

<div>
    @if ($label)
        <label class="block text-sm font-medium text-foreground mb-1">
            {{ $label }}
            @if ($required)<span class="text-rose-500">*</span>@endif
        </label>
    @endif

    {{ $slot }}

    @if ($hint)<p class="text-xs text-muted-foreground mt-1">{{ $hint }}</p>@endif

    @if ($name)
        @error($name)<span class="text-xs text-rose-500 mt-1 block">{{ $message }}</span>@enderror
    @endif
</div>