{{-- META --}}
<div class="form-group">
    <label for="{{'components['.$item->id.'][values][title]'}}">Image Title</label>
    <input type="text" class="form-control" 
            name="{{'components['.$item->id.'][values][title]'}}" 
            id="{{'components['.$item->id.'][values][title]'}}" 
            value="{{ old("components.".$item->id.".values.title", $sub->title ?? null) }}">
</div>
<div class="form-group">
    <label for="{{'components['.$item->id.'][values][alt]'}}">Alt Text</label>
    <input type="text" class="form-control" 
            name="{{'components['.$item->id.'][values][alt]'}}" 
            id="{{'components['.$item->id.'][values][alt]'}}"
            value="{{ old("components.".$item->id.".values.alt", $sub->alt ?? null) }}">
</div>



{{-- LIGHTBOX --}}
@php
if( old("components.".$item->id.".values.lighbox", $sub->lightbox ?? null) ){
    $on = 'checked';
    $off = '';
} else {
    $on = '';
    $off = 'checked';
}
@endphp
<div class="form-group">
    <div><label>Lightbox</label></div>
    <div class="form-check form-check-inline">
        <input class="form-check-input" type="radio" name="{{'components['.$item->id.'][values][lightbox]'}}" id="{{'components-'.$item->id.'-values-lighbox-on'}}" value="1" {{$on}}>
        <label class="form-check-label" for="{{'components-'.$item->id.'-values-lighbox-on'}}">On</label>
    </div>
        
    <div class="form-check form-check-inline">
        <input class="form-check-input" type="radio" name="{{'components['.$item->id.'][values][lightbox]'}}" id="{{'components-'.$item->id.'-values-lighbox-off'}}" value="0" {{$off}}>
        <label class="form-check-label" for="{{'components-'.$item->id.'-values-lighbox-off'}}">Off</label>
    </div>
</div>



{{-- ASPECT RATIO --}}
@php
if( old("components.".$item->id.".values.enable_aspect_ratio", $sub->enable_aspect_ratio ?? null) ){
    $on = 'checked';
    $off = '';
} else {
    $on = '';
    $off = 'checked';
}
$check = old("components.".$item->id.".values.aspect_ratio", $sub->aspect_ratio ?? null);
$ratios = getAspectRatios();
@endphp
<div class="form-group">
    <div><label for="{{'components-'.$item->id.'-values-aspect_ratio'}}">Aspect Ratio</label></div>
    <div class="form-check form-check-inline">
        <input class="form-check-input" type="radio" name="{{'components['.$item->id.'][values][enable_aspect_ratio]'}}" id="{{'components-'.$item->id.'-values-enable_aspect_ratio-on'}}" value="1" {{$on}}>
        <label class="form-check-label" for="{{'components-'.$item->id.'-values-enable_aspect_ratio-on'}}">On</label>
    </div>
    <div class="form-check form-check-inline">
        <input class="form-check-input" type="radio" name="{{'components['.$item->id.'][values][enable_aspect_ratio]'}}" id="{{'components-'.$item->id.'-values-enable_aspect_ratio-off'}}" value="0" {{$off}}>
        <label class="form-check-label" for="{{'components-'.$item->id.'-values-enable_aspect_ratio-off'}}">Off</label>
    </div>
</div>

<div class="form-group">
    
    <select name="{{'components['.$item->id.'][values][aspect_ratio]'}}" id="{{'components-'.$item->id.'-values-aspect_ratio'}}">
        @foreach($ratios as $arLabel => $arVal)
            <option value="{{$arVal}}" {{($check == $arVal)? 'selected':''}}>{{$arLabel}}</option>
        @endforeach
    </select>
</div>

{{-- IMAGE SELECT --}}
<div class="form-group">
    <label>Select Image</label>
    <div class="image-component-thumb">
        @include('admin.partials.inputs.imgInput', [
                'i' => 'image-component-'.$item->id,
                'uid' => 'image-component-'.$item->id,
                'name'  => 'components['.$item->id.'][values][image]',
                'value' => old("components.".$item->id.".values.image", $sub->image ?? null),
                'thumb' => old("components.".$item->id.".values.image", $sub->image ?? '/images/image-placeholder.png')??'/images/image-placeholder.png',
                'classes' => ''
            ]
        )
    </div>
</div>

@if(isset($post->id))
<input type="hidden" name="components[{{$item->id}}][post_id]" value="{{$post->id}}">
@endif
<input type="hidden" name="components[{{$item->id}}][type]" value="ComponentImage">