Leaflet map issue in LiveView modal

I have div#map Dom element in a modal to load a Leaflet map, the map box and controls are drawn but not the map. as you can see in pic.

Just to let you know, the is displayed properly outside the modal.
Please help.

this problem is not related to Liveview but to Leaflet. In your JS code you should listen to modal open event and then call map.invalidateSize() with a timeout. Here is an example :

window.addEventListener("modal-open", event => {
   setTimeout(function(){ map.invalidateSize()}, 100);