@include('template::partials.modal_header')
<div id="form-modal-body" class="modal-body">
    <div class="row pb-3">
        <div class="col-12">
            @include('template::partials.inputs.label', ['value' => $data['itemLabel'] ?? '', 'label' => "component"])
        </div>
    </div>

    <div class="row pb-3">
        <div class="col-12">
            @include('template::partials.inputs.components', ['components' => $components, 'value' => $data['componentType'] ?? ''])
        </div>
    </div>
    
    <div class="row pb-3">
        <div class="col-12">
            @include('template::partials.inputs.html_id', ['value' => $data['htmlId'] ?? '', 'label' => ''])
        </div>
    </div>
    
    <div class="row pb-3">
        <div class="col-12">
            @include('template::partials.inputs.classes', ['value' => $data['classes'] ?? ''])
        </div>
    </div>

    <div class="row pb-3">
        @include('template::partials.inputs.bg', ['value' => $data['bg'] ?? null, 'type' => $data['bgType'] ?? null])
    </div>
    
    <div class="row pb-3">
        <div class="col-12 p-0">
            @php
                $padding = [
                    'pt' => $data['pt'] ?? '',
                    'pr' => $data['pr'] ?? '',
                    'pb' => $data['pb'] ?? '',
                    'pl' => $data['pl'] ?? ''
                    ]
            @endphp
            @include('template::partials.inputs.padding', ["value" => $padding])
        </div>
    </div>

    <input type="hidden" id="item_id" value="{{$data['id'] ?? ''}}" />
    <input type="hidden" id="item_type" value="{{ucfirst($type)}}" />
    <input type="hidden" id="item_action" value="{{ucfirst($action)}}" />
</div>
@include('template::partials.modal_footer')