@props(['field'])

@php
    $name = $field->name;
    $label = $field->label;
    $required = $field->is_required;
@endphp

@switch($field->type)
    @case('textarea')
        <label for="{{ $name }}" class="mb-2 block text-sm font-semibold text-secondary">{{ $label }}@if($required)<span class="text-primary">*</span>@endif</label>
        <textarea name="{{ $name }}" id="{{ $name }}" rows="4" @if($required) required @endif class="w-full rounded-2xl border border-border bg-white px-4 py-3.5 text-sm shadow-sm transition focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20"></textarea>
        @break
    @case('select')
        <label for="{{ $name }}" class="mb-2 block text-sm font-semibold text-secondary">{{ $label }}@if($required)<span class="text-primary">*</span>@endif</label>
        <select name="{{ $name }}" id="{{ $name }}" @if($required) required @endif class="w-full rounded-2xl border border-border bg-white px-4 py-3.5 text-sm shadow-sm transition focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20">
            <option value="">Select…</option>
            @foreach($field->options['choices'] ?? [] as $choice)
                <option value="{{ is_array($choice) ? $choice['value'] : $choice }}">{{ is_array($choice) ? $choice['label'] : $choice }}</option>
            @endforeach
        </select>
        @break
    @case('checkbox')
        <label class="flex min-h-11 cursor-pointer items-center gap-3 py-1">
            <input type="checkbox" name="{{ $name }}" value="1" @if($required) required @endif class="h-5 w-5 shrink-0 rounded border-border text-primary focus:ring-primary">
            <span class="text-sm">{{ $label }}@if($required)*@endif</span>
        </label>
        @break
    @default
        <x-ui.input :name="$name" :label="$label.($required ? '*' : '')" :type="$field->type" :required="$required" />
@endswitch