@php
    $selectedIds = array_values(array_map('intval', $selectedAccountIds ?? []));
    $isAllLedger = !empty($allLedger);
    $toggleLabel = $selectedAccountsLabel ?? 'Select account(s)';
@endphp
<script type="application/json" id="glAccountPickerTreeData">@json($accountTree ?? [])</script>
<div class="gl-account-picker voucher-account-picker" id="glAccountPicker"
     data-selected='@json($selectedIds)'
     data-all-ledger='@json($isAllLedger)'>
    <button type="button" class="form-select voucher-account-picker-toggle text-start" id="glAccountPickerToggle" aria-expanded="false">
        <span class="voucher-account-picker-label" id="glAccountPickerLabel">{{ $toggleLabel }}</span>
    </button>
    <div class="voucher-account-picker-menu d-none" id="glAccountPickerMenu">
        <div class="voucher-account-picker-search">
            <i class="bi bi-search"></i>
            <input type="search" class="form-control form-control-sm" id="glAccountPickerSearch" placeholder="Search accounts..." autocomplete="off">
        </div>
        <label class="gl-account-picker-all-row">
            <input type="checkbox" id="glAccountPickerAllLedger" {{ $isAllLedger ? 'checked' : '' }}>
            <span class="fw-semibold">All Ledger</span>
        </label>
        <div class="voucher-account-picker-columns gl-account-picker-columns">
            <span></span>
            <span></span>
            <span>Code</span>
            <span>Name</span>
            <span>Type</span>
        </div>
        <div class="voucher-account-picker-tree gl-account-picker-tree" id="glAccountPickerTree"></div>
        <div class="voucher-account-picker-empty d-none" id="glAccountPickerEmpty">No matching accounts</div>
        <div class="voucher-account-picker-actions">
            <button type="button" class="btn btn-link btn-sm p-0" id="glAccountPickerClear">Clear selection</button>
        </div>
    </div>
    <div id="glAccountPickerInputs">
        <input type="hidden" name="all_ledger" id="glAllLedgerInput" value="{{ $isAllLedger ? '1' : '' }}">
        @foreach($selectedIds as $selectedId)
            <input type="hidden" name="account_ids[]" value="{{ $selectedId }}">
        @endforeach
    </div>
</div>