@props([
    'id' => 'data-table',
    'title' => null,
    'recordCount' => null,
    'exportable' => true,
])

<div {{ $attributes->merge(['class' => 'bv-table-wrapper']) }}>
    @if($title || $exportable || isset($toolbar))
        <div class="bv-table-wrapper__toolbar">
            <div>
                @if($title)
                    <h4 class="h6 mb-0 fw-semibold">{{ $title }}</h4>
                @endif
                @isset($toolbar)
                    {{ $toolbar }}
                @endisset
            </div>
            @if($exportable)
                <div class="bv-table-wrapper__export" id="{{ $id }}-export-buttons">
                    @isset($export)
                        {{ $export }}
                    @endisset
                </div>
            @endif
        </div>
    @endif

    <div class="table-responsive">
        <table class="table bv-table" id="{{ $id }}">
            @isset($head)
                <thead>{{ $head }}</thead>
            @endisset
            <tbody>
                {{ $slot }}
            </tbody>
        </table>
    </div>

    @if($recordCount !== null || isset($footer))
        <div class="bv-table-wrapper__footer">
            @if($recordCount !== null)
                Retrieved {{ $recordCount }} records
            @endif
            @isset($footer)
                {{ $footer }}
            @endisset
        </div>
    @endif
</div>