{{-- Component Wrapper --}}
@if(view()->exists(strtolower($component_name) . "::editor", ["sub", $sub??null]))
<div class="component-wrapper card has-collapse mb-1">
    {{-- Component Wrapper Header --}}
    <div class="card-header">
        <div class="row align-items-center">
            {{-- Component Wrapper Heading --}}
            <div class="col mb-0">
                <a href="#" class="component-title">
                    <strong class="component-heading mb-0">{{isset($count)?"$count - ":null}}{{formatComponentName($component_name)}}</strong>
                </a>
            </div>
            <div class="col text-right">
                {{-- Sortable Handle --}}
                <span class="p-1 d-inline-block btn btn-sm" title="Click and drag to reorder components" data-tooltip>
                    <img src="/svg/icons/arrows-up-down.svg" alt="Click and drag to reorder components" class="component-handle handle"  />
                </span>
                {{-- Delete Component Button --}}
                <a href="#" class="btn btn-sm btn-delete-component" data-count="{{$count}}">
                    <img src="/svg/icons/cross.svg" alt="Delete" />
                </a>
            </div>
        </div>
    </div>
    {{-- Component Wrapper Body --}}
    <div class="card-body collapse">
        {{-- Component Editor --}}
        @include(strtolower($component_name) . "::editor", ["sub", $sub??null])
        {{-- Hidden Input to specify component type --}}
        <input type="hidden" name="components[{{$count}}][type]" value="{{$component_name}}">
    </div>

</div>
@endif