@props([
    'field' => '',
    'model' => '',
    'modelId' => '',
    'fieldName' => '',
    'target' => '',
    'type' => 'text',
    'name' => '',
    'value' => '',
    'required' => false,
    'placeholder' => '',
    'rows' => null,
    'class' => 'form-control'
])

<div class="input-group">
    @if($type === 'textarea')
        <textarea class="{{ $class }} @error($name) is-invalid @enderror" 
                  id="{{ $target }}" 
                  name="{{ $name }}" 
                  rows="{{ $rows ?? 5 }}"
                  {{ $required ? 'required' : '' }}
                  @if($placeholder) placeholder="{{ $placeholder }}" @endif>{{ $value }}</textarea>
    @else
        <input type="{{ $type }}" 
               class="{{ $class }} @error($name) is-invalid @enderror" 
               id="{{ $target }}" 
               name="{{ $name }}" 
               value="{{ $value }}"
               {{ $required ? 'required' : '' }}
               @if($placeholder) placeholder="{{ $placeholder }}" @endif>
    @endif
    
    <x-translation-button 
        :field="$field"
        :model="$model"
        :modelId="$modelId"
        :fieldName="$fieldName"
        :target="$target" />
</div>

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