Cómo agregar una barra Menú a tu mapa Leaflet

Si deseas agregar en tu mapa web un Menú, puedes hacer lo siguiente:

En el body de tu HTML configura como se verá el menú:

<div class="d-flex h-100">
<div class="row m-0 w-100">
<div id="sidebar" class="d-flex flex-column justify-content-between col-2 h-100">
		<div id="alert" class="w-100 alert alert-warning fw-bold hidden" role="alert">                  
         </div>

</div>
<div id="map" class="col"></div>
</div>
</div>

Y en el JavaScript agrega la siguiente función:

const crearListado = () => {
 	const ul = document.createElement('ul');
	ul.classList.add('list-group');
    sidebar.prepend(ul);
    sites.forEach(lugar => {
        const li = document.createElement('li');
        li.innerText = lugar.nombre;
        li.classList.add('list-group-item');
        ul.append(li);
        li.addEventListener('click', () => {
            limpiarItems();
            li.classList.add('active');
            volar(lugar.coordenadas);
            definirAlert(lugar.coordenadas);
        })
    })
}