@props([
    'head',
    'body',
    'foot'
])

<div class="max-w-full overflow-x-auto">
    <table {!! $attributes->merge(['class' => 'min-w-full']) !!}>
        @if(isset($head))
        <thead class="bg-zinc-50 dark:bg-zinc-900 border-t border-zinc-300 dark:border-white/10">
            <tr class="text-gray-500">
                {{ $head }}
            </tr>
        </thead>
        @endif

        @if(isset($body))
        <tbody class="divide-y divide-gray-100 dark:divide-gray-800">
            {{ $body }}
        </tbody>
        @endif

        @if(isset($foot))
        <tfoot class="">
            {{ $foot }}
        </tfoot>
        @endif
    </table>
    
</div>