@props([
    'headers' => [],
    'emptyMessage' => 'No records found.',
    'emptyIcon' => 'inbox',
])

<div {{ $attributes->merge(['class' => 'vem-table-wrap']) }}>
    <table class="table vem-table table-hover align-middle">
        @if (! empty($headers))
            <thead>
                <tr>
                    @foreach ($headers as $header)
                        <th scope="col">{{ $header }}</th>
                    @endforeach
                </tr>
            </thead>
        @endif
        <tbody>
            @if ($slot->isEmpty())
                <tr>
                    <td colspan="{{ max(count($headers), 1) }}" class="p-0 border-0">
                        <x-empty-state :icon="$emptyIcon" :title="$emptyMessage" />
                    </td>
                </tr>
            @else
                {{ $slot }}
            @endif
        </tbody>
    </table>
</div>
