@props([
    'index' => ':index',
    'name' => '',
    'label' => $name ?? '',
    'relation' => '',
    'required' => false,
    'value' => '',
    'useLabel' => true,
    'readonly' => false,
])
<div class="mb-4">
    <div id="div-{{ Str::slug($relation . '-' . $name) . $index }}" class="form-floating">
        <input {{ $attributes->class(['form-control', 'is-invalid' => $errors->has("$relation.$index.$name")]) }} type="text" id="{{ Str::slug($relation . '-' . $name) . $index }}" name="{{ $relation }}[{{ $index }}][{{ $name }}]" value="{{ $value ?? '' }}" {{ $readonly ? 'readonly tabindex=-1' : '' }} @required($required) data-index="{{ $index }}">
        @if($useLabel)
            <label class="form-label" for="{{ Str::slug($relation . '-' . $name) . $index }}">{{ $label }}
                @if($required)
                    <span class="text-danger">*</span>
                @endif
            </label>
        @endif
        @error("$relation.$index.$name")
        <div class="invalid-feedback">{{ $message }}</div>
        @enderror
    </div>
</div>