A Leaflet Layer Control, which may be expanded by default, but may be collapsed using a button.

leaflet-collapsable-layer-control.js

/**
 * A Leaflet Layer Control, which may be expanded by default, but may be collapsed using a button.
 *
 * @example new CollapsableLayerControl(layers, {}, { collapsed: false })
 */
export class CollapsableLayerControl extends L.Control.Layers {
	onAdd(map) {
		L.Control.Layers.prototype.onAdd.call(this, map);
		const div = document.createElement("div");
		div.style.textAlign = "right";
		const bar = document.createElement("div");
		bar.classList.add("leaflet-bar");
		bar.style.cursor = "pointer";
		bar.style.display = "inline-block";
		bar.style.fontSize = "22px";
		const close = document.createElement("a");
		close.innerHTML = "×";
		close.onclick = () => this.collapse();
		bar.append(close);
		div.append(bar);
		this.getContainer().querySelector(".leaflet-control-layers-list").prepend(div);
		return this.getContainer();
	}
}