@props([
    'withPagination' => true,
])
<div>
    {{ $heading ?? '' }}

    @if(isset($this->multilingualism) && $this->multilingualism || isset($this->searchable) && $this->searchable || method_exists($this, 'availableFilters'))
        <div class="flex flex-wrap gap-4 w-full mb-2 lg:mb-8">
            @if(isset($this->multilingualism) && $this->multilingualism)
                <x-daylight::tables.multilingualism/>
            @endif

            @if(isset($this->searchable) && $this->searchable)
                <x-daylight::tables.search/>
            @endif

            <x-daylight::tables.filters/>
        </div>
    @endif

    <div class="relative overflow-x-scroll">
        <table class="min-w-full table-fixed divide-y divide-gray-300 text-gray-800">
            <thead>
            <tr>
                <th class="p-3 text-left text-sm font-semibold text-gray-900" width="50">
                    <div class="flex items-center">
                        <x-daylight::tables.check-all/>
                    </div>
                </th>

                {{ $columns ?? '' }}

                <th>
                    &nbsp;
                </th>
            </tr>
            </thead>

            <tbody class="divide-y divide-gray-200 bg-white text-gray-700">
            {{ $slot }}
            </tbody>
        </table>
    </div>

    <div class="flex space-x-4 mt-8">
        @if(isset($this->bulkActions) && $this->bulkActions)
            <x-daylight::tables.bulk-actions/>
        @endif

        @if($withPagination)
            <div class="flex-grow">
                {{ $this->rows->links() }}
            </div>
        @endif
    </div>

    @if(property_exists($this, 'confirmingDeleteId'))
        <x-daylight::tables.delete-confirmation/>
    @endif

    @if(property_exists($this, 'confirmingBulkAction'))
        <x-daylight::tables.bulk-action-confirmation/>
    @endif
</div>
