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

<div class="field {{ $errors->has($name) ? 'has-error' : '' }}">
    <label for="{{ $name }}" class="field-label">
        {{ $label }}
        @if($required)<span class="req">*</span>@endif
    </label>

    <input
        type="{{ $type }}"
        name="{{ $name }}"
        id="{{ $name }}"
        value="{{ old($name, $default) }}"
        @if($uppercase) data-uppercase @endif
        {{ $attributes->merge(['class' => 'field-input']) }}
    >

    @if($hint)
        <p class="field-hint">{{ $hint }}</p>
    @endif

    @error($name)
        <p class="field-error">{{ $message }}</p>
    @enderror
</div>