(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[8568],{18568:(n,t,e)=>{"use strict";e.r(t),e.d(t,{MapComponent:()=>i});var r=e(95155),o=e(12115),c=e(85752),a=e.n(c);function i(n){let{countries:t,onCountrySelect:e,selectedCountry:c}=n,i=(0,o.useRef)(null),u=(0,o.useRef)(null);return(0,o.useEffect)(()=>(!i.current&&u.current&&(i.current=a().map(u.current).setView([20,0],2),a().tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",{attribution:'&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'}).addTo(i.current),a().control.zoom({position:"bottomright"}).addTo(i.current)),()=>{i.current&&(i.current.remove(),i.current=null)}),[]),(0,o.useEffect)(()=>{i.current&&(i.current.eachLayer(n=>{if(n instanceof a().Marker){var t;null==(t=i.current)||t.removeLayer(n)}}),t.forEach(n=>{let t=Math.min(Math.max(20,5*n.count),40),r=a().divIcon({html:'<div style="\n          background-color: '.concat(n.name===c?"#3b82f6":"#ef4444",";\n          color: white;\n          border-radius: 50%;\n          width: ").concat(t,"px;\n          height: ").concat(t,"px;\n          display: flex;\n          justify-content: center;\n          align-items: center;\n          font-weight: bold;\n          font-size: ").concat(t>30?14:12,'px;\n          box-shadow: 0 0 0 2px white;\n        ">').concat(n.count,"</div>"),className:"",iconSize:[t,t],iconAnchor:[t/2,t/2]}),o=a().marker(n.position,{icon:r}).addTo(i.current);o.bindPopup('\n        <div style="text-align: center;">\n          <strong>'.concat(n.name,"</strong>\n          <div>").concat(n.count," news articles</div>\n        </div>\n      ")),o.on("click",()=>{e(n.name)})}))},[t,c,e]),(0,r.jsx)("div",{ref:u,style:{width:"100%",height:"100%"}})}e(68413)},68413:()=>{}}]);