45 lines
1.2 KiB
PHP
45 lines
1.2 KiB
PHP
@props([
|
|
'footer' => null,
|
|
'header' => null,
|
|
'headerGroups' => null,
|
|
'reorderable' => false,
|
|
'reorderAnimationDuration' => 300,
|
|
])
|
|
|
|
<table
|
|
{{ $attributes->class(['fi-ta-table w-full table-auto divide-y divide-gray-200 text-start dark:divide-white/5']) }}
|
|
>
|
|
@if ($header)
|
|
<thead class="divide-y divide-gray-200 dark:divide-white/5">
|
|
@if ($headerGroups)
|
|
<tr class="bg-gray-100 dark:bg-transparent">
|
|
{{ $headerGroups }}
|
|
</tr>
|
|
@endif
|
|
|
|
<tr class="bg-gray-50 dark:bg-white/5">
|
|
{{ $header }}
|
|
</tr>
|
|
</thead>
|
|
@endif
|
|
|
|
<tbody
|
|
@if ($reorderable)
|
|
x-on:end.stop="$wire.reorderTable($event.target.sortable.toArray())"
|
|
x-sortable
|
|
data-sortable-animation-duration="{{ $reorderAnimationDuration }}"
|
|
@endif
|
|
class="divide-y divide-gray-200 whitespace-nowrap dark:divide-white/5"
|
|
>
|
|
{{ $slot }}
|
|
</tbody>
|
|
|
|
@if ($footer)
|
|
<tfoot class="bg-gray-50 dark:bg-white/5">
|
|
<tr>
|
|
{{ $footer }}
|
|
</tr>
|
|
</tfoot>
|
|
@endif
|
|
</table>
|