@props([
    'name',
    'label',
    'type' => 'text',
    'value' => null,
    'help' => null,
    'required' => false,
    'formKey' => null,
])

@php($activeForm = $formKey === null || old('_modal_key') === $formKey)
@php($error = $activeForm ? $errors->first($name) : null)
@php($fieldId = ($formKey ? $formKey.'-' : '').$name)

<div class="ui-field">
    <label class="ui-label" for="{{ $fieldId }}">{{ $label }}@if ($required)<span class="ui-required" aria-hidden="true">*</span>@endif</label>
    <input
        id="{{ $fieldId }}"
        name="{{ $name }}"
        type="{{ $type }}"
        value="{{ $activeForm ? old($name, $value) : $value }}"
        @if ($required) required @endif
        @if ($error) aria-invalid="true" aria-describedby="{{ $fieldId }}-error" @elseif ($help) aria-describedby="{{ $fieldId }}-help" @endif
        {{ $attributes->class(['ui-input', 'ui-input--invalid' => $error]) }}
    >
    @if ($error)
        <p class="ui-field-error" id="{{ $fieldId }}-error">{{ $error }}</p>
    @elseif ($help)
        <p class="ui-field-help" id="{{ $fieldId }}-help">{{ $help }}</p>
    @endif
</div>