<div>
    {{ $toolbar?->render() }}
    <table class="table">
        <colgroup>
            @foreach($columns as $column)
                <col @class([$column->getColClass()]) />
            @endforeach
        </colgroup>
        <thead>
            <tr>
                @foreach($columns as $column)
                    <th
                        scope="col"
                        @class(['sortable' => $column->isSortable()])
                        @if($column->isSortable())
                            wire:click="orderBy('{{ $column->name }}')"
                        @endif
                    >
                        {{ $column->getTitle() }}
                    </th>
                @endforeach
            </tr>
        </thead>
        <tbody>
            @foreach($data as $row)
                <tr>
                    @foreach($columns as $column)
                        {{ $column->view($row) }}
                    @endforeach
                </tr>
            @endforeach
        </tbody>
    </table>
    <div class="table-pagination d-flex justify-content-between align-items-center">
        {{ $data->links() }}
        <div>
            {{ __('Showing') }} {{ $data->count() }}
            {{ __('of') }} {{ $data->total() }}

        </div>
    </div>
</div>