@props([
    'striped' => true,
    'hover' => true,
    'compact' => false,
    'responsive' => true,
    'caption' => null,
    'empty' => null,
    'rows' => null, // if null, use slot
])

@php
    $tableClasses = trim(
        'table' .
        ($striped ? ' table-striped' : '') .
        ($hover ? ' table-hover' : '') .
        ($compact ? ' table-sm' : '') .
        ' data-table'
    );
@endphp

<div class="data-table__wrap {{ $responsive ? 'table-responsive' : '' }}">
    <table {{ $attributes->merge(['class' => $tableClasses]) }}>
        @if($caption)<caption>{{ $caption }}</caption>@endif
        @isset($head)
            <thead class="data-table__head">
                {{ $head }}
            </thead>
        @endisset
        <tbody class="data-table__body">
            @if($rows !== null && count($rows) === 0)
                <tr>
                    <td colspan="99" class="data-table__empty">
                        {{ $empty ?? 'No records to display.' }}
                    </td>
                </tr>
            @else
                {{ $slot }}
            @endif
        </tbody>
        @isset($foot)
            <tfoot class="data-table__foot">
                {{ $foot }}
            </tfoot>
        @endisset
    </table>
</div>