@tracktor/map 0.5.0 → 0.5.1

package/dist/main.js

@@ -1001,7 +1001,7 @@ const Jr = ({ palette: r, type: t }) => {
   fitBounds: p = !0,
   disableFlyTo: u = !1,
   fitBoundsPadding: v = 50,
-  projection: f = "mercator",
+  projection: f,
   mapStyle: E = "mapbox://styles/mapbox/streets-v12?optimize=true",
   zoom: m = 6,
   zoomFlyFrom: L = 3

package/dist/main.umd.cjs

@@ -28,4 +28,4 @@ Check the top-level render call using <`+i+">.")}return n}}function Ve(e,n){{if(
   <%s {...props} />
 React keys must be passed directly to JSX without using spread:
   let props = %s;
-  <%s key={someKey} {...props} />`,le,k,Ht,k),Je[k+le]=!0}}return e===o?Bt(C):Gt(C),C}}function Vt(e,n,i){return Ke(e,n,i,!0)}function zt(e,n,i){return Ke(e,n,i,!1)}var Jt=zt,Kt=Vt;V.Fragment=o,V.jsx=Jt,V.jsxs=Kt}()),V}var pe;function Qe(){return pe||(pe=1,process.env.NODE_ENV==="production"?K.exports=qe():K.exports=Ze()),K.exports}var j=Qe();const ve=R.createContext({licenceMapbox:"",licenseMuiX:""}),$e=({children:t,licenseMuiX:r,licenceMapbox:a})=>{R.useEffect(()=>{r&&He.LicenseInfo.setLicenseKey(r)},[r]);const o=R.useMemo(()=>({licenceMapbox:a,licenseMuiX:r}),[r,a]);return a&&(G.accessToken=a),j.jsx(ve.Provider,{value:o,children:t})},et=({containerStyle:t,square:r,error:a,loading:o=!1,height:s=300,width:l="100%"},d)=>j.jsxs(M.Box,{sx:{position:"relative"},height:s,children:[j.jsx(M.Box,{sx:{alignItems:"center",borderRadius:r?0:1,display:"flex",justifyContent:"center",left:0,position:"absolute",top:0,zIndex:1,...t},ref:d,width:l,height:s,children:a&&j.jsx(M.Box,{textAlign:"center",children:a})}),o&&j.jsx(M.Skeleton,{sx:{left:0,position:"absolute",top:0,zIndex:0,...t},width:l,height:s,variant:r?"rectangular":"rounded"})]}),tt=R.forwardRef(et),rt=({map:t,disableFlyTo:r,flyToDuration:a,zoom:o,fitBounds:s,markers:l,fitBoundDuration:d,fitBoundsPadding:p})=>{R.useEffect(()=>{if(!t.current||(r||t.current.flyTo({duration:a,zoom:o}),!s||!(l!=null&&l.length)||(l==null?void 0:l.length)<2))return;const u=new G.LngLatBounds,v=l.filter(f=>{const b=Number(f.lng),m=Number(f.lat);return ee(m,b)});if(!(v.length<2)){for(let f=0;f<v.length;f+=1){const b=Number(v[f].lng),m=Number(v[f].lat);u.extend([b,m])}t.current.fitBounds(u,{duration:d,padding:p})}},[l,s,p,a,o,d,r,t])},ye=t=>Array.isArray(t)?t.length>=2?[t[0],t[1]]:void 0:t,nt=({map:t,center:r})=>{R.useEffect(()=>{if(!t.current||!r)return;const a=Array.isArray(r)&&ee(r[1],r[0])?ye(r):{lat:46.8677,lng:2.333};a&&t.current.setCenter(a)},[r,t])};var I={},ge;function ot(){if(ge)return I;ge=1;var t=Xe;if(process.env.NODE_ENV==="production")I.createRoot=t.createRoot,I.hydrateRoot=t.hydrateRoot;else{var r=t.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;I.createRoot=function(a,o){r.usingClientEntryPoint=!0;try{return t.createRoot(a,o)}finally{r.usingClientEntryPoint=!1}},I.hydrateRoot=function(a,o,s){r.usingClientEntryPoint=!0;try{return t.hydrateRoot(a,o,s)}finally{r.usingClientEntryPoint=!1}}}return I}var Ee=ot();const it=({palette:t,type:r})=>{const a=t.mode==="dark"?"black":"white",o=t.secondary.main,s=t.info.main;switch(r){case"dropOff":return{"circle-color":a,"circle-radius":5,"circle-stroke-color":s,"circle-stroke-width":6};default:return{"circle-color":a,"circle-radius":7,"circle-stroke-color":o,"circle-stroke-width":8}}},at=(t,r,a,o)=>{const s={features:a.map(d=>({geometry:{coordinates:d.geometry.coordinates,type:"Point"},properties:{id:d.properties.id,...d.properties},type:"Feature"})),type:"FeatureCollection"},l=t.getSource(r);l?l.setData(s):t.addSource(r,{data:s,type:"geojson"}),s.features.forEach(d=>{const{description:p,id:u}=d.properties||{},v=it({palette:o,type:p}),f=`marker-${u}`;t.getLayer(f)?Object.entries(v||{}).forEach(([b,m])=>{t.setPaintProperty(f,b,m)}):t.addLayer({filter:["==","id",u],id:f,layout:{visibility:"visible"},paint:v,source:r,type:"circle"})})},st=(t,r)=>{document.querySelectorAll(".react-custom-marker").forEach(o=>o.remove()),r.forEach(o=>{const{IconComponent:s,iconProps:l,onClick:d}=o.properties||{},{coordinates:p}=o.geometry;if(s&&p.length>=2){const u=document.createElement("div");u.className="react-custom-marker",u.style.position="absolute";const v=document.createElement("div"),f=Ee.createRoot(v);s&&f.render(R.createElement(s,l||{})),u.appendChild(v);const b=()=>{d==null||d(o)};u.addEventListener("click",b),new G.Marker(u).setLngLat([p[0],p[1]]).addTo(t)}})},ut=t=>({features:(t==null?void 0:t.map((r,a)=>({geometry:{coordinates:[Number.isFinite(Number(r.lng))?Number(r.lng):Number(_e),Number.isFinite(Number(r.lat))?Number(r.lat):Number(me)],type:"Point"},properties:{description:r.type,IconComponent:r.IconComponent,iconProps:r.iconProps,id:r.id||`{marker-${a}}`,name:r.name,onClick:r.onClick,size:r.size||1,zIndex:r.zIndex||0},type:"Feature"})))||[],type:"FeatureCollection"}),ct=({map:t,setLoadingMapBox:r,palette:a,markers:o})=>{if(r(!1),!t.current)return;const s=ut(o),l=s.features.filter(p=>{var u;return((u=p.properties)==null?void 0:u.IconComponent)===void 0});l.length&&at(t.current,"markerProps",l,a);const d=s.features.filter(p=>{var u;return(u=p.properties)==null?void 0:u.IconComponent});d.length&&st(t.current,d)},lt=({map:t,markers:r,markersAreInvalid:a,palette:o,setLoadingMapBox:s})=>{R.useEffect(()=>{if(!t.current||a)return;const l=()=>{r&&ct({map:t,markers:r,palette:o,setLoadingMapBox:s})};t.current.loaded()?l():t.current.once("load",l)},[t,r,a,o,s])},ft=({map:t,onMapClick:r})=>{R.useEffect(()=>{if(!t.current||!r)return;const a=t.current.getCanvas(),o=s=>{const l=[s.clientX-a.getBoundingClientRect().left,s.clientY-a.getBoundingClientRect().top],d=t.current.unproject(l);r(d.lng,d.lat)};a.addEventListener("click",o)},[t,r])},dt=t=>{const r=document.createElement("button");return r.innerText="×",r.style.position="absolute",r.style.top="5px",r.style.right="5px",r.style.background="transparent",r.style.border="none",r.style.fontSize="16px",r.style.padding="0",r.style.margin="10px",r.style.cursor="pointer",r.type="button",r.setAttribute("aria-label","Close popup"),r.removeAttribute("aria-hidden"),r.onclick=()=>t.remove(),r},be=({map:t,tooltip:r,coordinates:a})=>{if(!a||!r||!t.current||!Array.isArray(a)||a.length!==2)return null;const o=document.createElement("div");o.style.position="relative",o.style.overflow="hidden";const s=document.createElement("div");s.style.padding="10px",o.style.zIndex="1000";const l=Ee.createRoot(s);l.render(r);const d=new G.Popup({closeButton:!1}).setLngLat(a).setDOMContent(o).addTo(t.current);d.on("close",()=>{queueMicrotask(()=>{l.unmount()})});const p=dt(d);return o.appendChild(p),o.appendChild(s),d},he=t=>typeof t=="object"&&t!==null&&"type"in t&&"coordinates"in t,pt=t=>{if(typeof t!="object"||t===null||!("geometry"in t&&"properties"in t))return!1;const{geometry:a}=t;if(typeof a!="object"||a===null||!("coordinates"in a))return!1;const{coordinates:o}=a;if(!Array.isArray(o)||o.length!==2||!he(a))return!1;const{properties:s}=t;return typeof s!="object"||s===null?!1:"id"in s&&s.id!==void 0},vt=({map:t,point:r})=>{var s,l,d,p,u;if(!((s=t.current)!=null&&s.isStyleLoaded()))return null;const a=((p=(d=(l=t.current)==null?void 0:l.getStyle())==null?void 0:d.layers)==null?void 0:p.filter(v=>v.id.startsWith("marker-")).map(v=>v.id))||[],o=(u=t.current)==null?void 0:u.queryRenderedFeatures(r,{layers:a});if(o&&o.length>0){const v=o[0];if(!pt(v)||!he(v.geometry))return null;const{geometry:f}=v,b=f.coordinates.slice();return b.length!==2||typeof b[0]!="number"||typeof b[1]!="number"?null:v}},yt=({openPopup:t,map:r,markers:a})=>{const o=R.useRef(null);R.useEffect(()=>{if(!r.current||!a)return;const l=r.current.getCanvas();if(o.current&&(o.current.remove(),o.current=null),t){const p=a.find(u=>u.id===t);if(p){const u=[Number(p.lng)||0,Number(p.lat)||0],v=be({coordinates:u,map:r,tooltip:p.Tooltip});v&&(o.current=v)}}const d=p=>{const u=[p.clientX-l.getBoundingClientRect().left,p.clientY-l.getBoundingClientRect().top],v=vt({map:r,point:u});if(v&&v.properties&&v.properties.id){o.current&&(o.current.remove(),o.current=null);const f=a.find(b=>b.id===v.properties.id);if(f){const b=[Number(f.lng)||0,Number(f.lat)||0];if(typeof f.onClick=="function"){const m={geometry:{coordinates:b,type:"Point"},properties:{description:f.name,id:f.id,name:f.name,onClick:f.onClick,size:f.size||1,zIndex:f.zIndex||1},type:"Feature"};f.onClick(m)}requestAnimationFrame(()=>{const m=be({coordinates:b,map:r,tooltip:f.Tooltip});m&&(o.current=m)})}}};return l.addEventListener("click",d),()=>{l.removeEventListener("click",d),o.current&&(o.current.remove(),o.current=null)}},[r,a,t])},Re=()=>{try{const t=document.createElement("canvas");return(t.getContext("webgl")||t.getContext("experimental-webgl"))instanceof WebGLRenderingContext}catch{return!1}},gt=({mapStyle:t,mapContainer:r,zoomFlyFrom:a,markers:o,center:s})=>{var d,p;return{center:s?ye(s):{lat:((d=o==null?void 0:o[0])==null?void 0:d.lat)!==void 0?Number(o[0].lat):me,lng:((p=o==null?void 0:o[0])==null?void 0:p.lng)!==void 0?Number(o[0].lng):_e},container:(r==null?void 0:r.current)||"",cooperativeGestures:!0,failIfMajorPerformanceCaveat:!1,style:t,zoom:a}},_e=2.333,me=46.8677,Et=({markers:t,loading:r,center:a,openPopup:o,onMapClick:s,flyToDuration:l=5e3,fitBoundDuration:d=1e3,fitBounds:p=!0,disableFlyTo:u=!1,fitBoundsPadding:v=50,projection:f="mercator",mapStyle:b="mapbox://styles/mapbox/streets-v12?optimize=true",zoom:m=6,zoomFlyFrom:F=3})=>{const{palette:H}=M.useTheme(),[te,X]=R.useState(!0),[L,x]=R.useState(!0),N=R.useRef(null),O=R.useRef(null),re=!t||t.some(W=>W.lat===void 0||W.lng===void 0);return R.useEffect(()=>{if(!Re()){x(!1),X(!1);return}if(O.current||!N.current||r)return;N.current.innerHTML!==""&&(N.current.innerHTML="");const W=gt({center:a,mapContainer:N,mapStyle:b,markers:t,zoomFlyFrom:F});O.current=new G.Map(W)},[a,r,b,t,f,F]),lt({map:O,markers:t,markersAreInvalid:re,palette:H,setLoadingMapBox:X}),yt({map:O,markers:t,openPopup:o}),nt({center:a,map:O}),ft({map:O,onMapClick:s}),rt({disableFlyTo:u,fitBoundDuration:d,fitBounds:p,fitBoundsPadding:v,flyToDuration:l,map:O,markers:t,zoom:m}),R.useEffect(()=>()=>{O.current&&(O.current.remove(),O.current=null)},[]),{loading:te||r,map:O,mapContainer:N,markers:t,webGLSupported:L}},bt=({containerStyle:t,square:r,theme:a,height:o=300,width:s="100%",...l})=>{const{loading:d,mapContainer:p,webGLSupported:u}=Et(l);return j.jsxs(j.Fragment,{children:[j.jsx(M.GlobalStyles,{styles:{".mapboxgl-popup-content":{backgroundColor:"transparent!important",borderRadius:"0px !important",boxShadow:"none!important",padding:"0px 0px!important",width:"fit-content!important"}}}),j.jsx(tt,{ref:p,loading:d,height:o,width:s,containerStyle:t,square:r,error:!u&&"WebGL is not enabled in your browser. This technology is required to display the interactive map."})]})},ee=(t,r)=>Number.isFinite(t)&&Number.isFinite(r)&&t>=-90&&t<=90&&r>=-180&&r<=180;T.DEFAULT_CENTER_LAT=46.8677,T.DEFAULT_CENTER_LNG=2.333,T.MapProvider=$e,T.MapProviderContext=ve,T.MarkerMap=bt,T.isValidLatLng=ee,T.isWebGLSupported=Re,Object.defineProperty(T,Symbol.toStringTag,{value:"Module"})});
+  <%s key={someKey} {...props} />`,le,k,Ht,k),Je[k+le]=!0}}return e===o?Bt(C):Gt(C),C}}function Vt(e,n,i){return Ke(e,n,i,!0)}function zt(e,n,i){return Ke(e,n,i,!1)}var Jt=zt,Kt=Vt;V.Fragment=o,V.jsx=Jt,V.jsxs=Kt}()),V}var pe;function Qe(){return pe||(pe=1,process.env.NODE_ENV==="production"?K.exports=qe():K.exports=Ze()),K.exports}var j=Qe();const ve=R.createContext({licenceMapbox:"",licenseMuiX:""}),$e=({children:t,licenseMuiX:r,licenceMapbox:a})=>{R.useEffect(()=>{r&&He.LicenseInfo.setLicenseKey(r)},[r]);const o=R.useMemo(()=>({licenceMapbox:a,licenseMuiX:r}),[r,a]);return a&&(G.accessToken=a),j.jsx(ve.Provider,{value:o,children:t})},et=({containerStyle:t,square:r,error:a,loading:o=!1,height:s=300,width:l="100%"},d)=>j.jsxs(M.Box,{sx:{position:"relative"},height:s,children:[j.jsx(M.Box,{sx:{alignItems:"center",borderRadius:r?0:1,display:"flex",justifyContent:"center",left:0,position:"absolute",top:0,zIndex:1,...t},ref:d,width:l,height:s,children:a&&j.jsx(M.Box,{textAlign:"center",children:a})}),o&&j.jsx(M.Skeleton,{sx:{left:0,position:"absolute",top:0,zIndex:0,...t},width:l,height:s,variant:r?"rectangular":"rounded"})]}),tt=R.forwardRef(et),rt=({map:t,disableFlyTo:r,flyToDuration:a,zoom:o,fitBounds:s,markers:l,fitBoundDuration:d,fitBoundsPadding:p})=>{R.useEffect(()=>{if(!t.current||(r||t.current.flyTo({duration:a,zoom:o}),!s||!(l!=null&&l.length)||(l==null?void 0:l.length)<2))return;const u=new G.LngLatBounds,v=l.filter(f=>{const b=Number(f.lng),m=Number(f.lat);return ee(m,b)});if(!(v.length<2)){for(let f=0;f<v.length;f+=1){const b=Number(v[f].lng),m=Number(v[f].lat);u.extend([b,m])}t.current.fitBounds(u,{duration:d,padding:p})}},[l,s,p,a,o,d,r,t])},ye=t=>Array.isArray(t)?t.length>=2?[t[0],t[1]]:void 0:t,nt=({map:t,center:r})=>{R.useEffect(()=>{if(!t.current||!r)return;const a=Array.isArray(r)&&ee(r[1],r[0])?ye(r):{lat:46.8677,lng:2.333};a&&t.current.setCenter(a)},[r,t])};var I={},ge;function ot(){if(ge)return I;ge=1;var t=Xe;if(process.env.NODE_ENV==="production")I.createRoot=t.createRoot,I.hydrateRoot=t.hydrateRoot;else{var r=t.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;I.createRoot=function(a,o){r.usingClientEntryPoint=!0;try{return t.createRoot(a,o)}finally{r.usingClientEntryPoint=!1}},I.hydrateRoot=function(a,o,s){r.usingClientEntryPoint=!0;try{return t.hydrateRoot(a,o,s)}finally{r.usingClientEntryPoint=!1}}}return I}var Ee=ot();const it=({palette:t,type:r})=>{const a=t.mode==="dark"?"black":"white",o=t.secondary.main,s=t.info.main;switch(r){case"dropOff":return{"circle-color":a,"circle-radius":5,"circle-stroke-color":s,"circle-stroke-width":6};default:return{"circle-color":a,"circle-radius":7,"circle-stroke-color":o,"circle-stroke-width":8}}},at=(t,r,a,o)=>{const s={features:a.map(d=>({geometry:{coordinates:d.geometry.coordinates,type:"Point"},properties:{id:d.properties.id,...d.properties},type:"Feature"})),type:"FeatureCollection"},l=t.getSource(r);l?l.setData(s):t.addSource(r,{data:s,type:"geojson"}),s.features.forEach(d=>{const{description:p,id:u}=d.properties||{},v=it({palette:o,type:p}),f=`marker-${u}`;t.getLayer(f)?Object.entries(v||{}).forEach(([b,m])=>{t.setPaintProperty(f,b,m)}):t.addLayer({filter:["==","id",u],id:f,layout:{visibility:"visible"},paint:v,source:r,type:"circle"})})},st=(t,r)=>{document.querySelectorAll(".react-custom-marker").forEach(o=>o.remove()),r.forEach(o=>{const{IconComponent:s,iconProps:l,onClick:d}=o.properties||{},{coordinates:p}=o.geometry;if(s&&p.length>=2){const u=document.createElement("div");u.className="react-custom-marker",u.style.position="absolute";const v=document.createElement("div"),f=Ee.createRoot(v);s&&f.render(R.createElement(s,l||{})),u.appendChild(v);const b=()=>{d==null||d(o)};u.addEventListener("click",b),new G.Marker(u).setLngLat([p[0],p[1]]).addTo(t)}})},ut=t=>({features:(t==null?void 0:t.map((r,a)=>({geometry:{coordinates:[Number.isFinite(Number(r.lng))?Number(r.lng):Number(_e),Number.isFinite(Number(r.lat))?Number(r.lat):Number(me)],type:"Point"},properties:{description:r.type,IconComponent:r.IconComponent,iconProps:r.iconProps,id:r.id||`{marker-${a}}`,name:r.name,onClick:r.onClick,size:r.size||1,zIndex:r.zIndex||0},type:"Feature"})))||[],type:"FeatureCollection"}),ct=({map:t,setLoadingMapBox:r,palette:a,markers:o})=>{if(r(!1),!t.current)return;const s=ut(o),l=s.features.filter(p=>{var u;return((u=p.properties)==null?void 0:u.IconComponent)===void 0});l.length&&at(t.current,"markerProps",l,a);const d=s.features.filter(p=>{var u;return(u=p.properties)==null?void 0:u.IconComponent});d.length&&st(t.current,d)},lt=({map:t,markers:r,markersAreInvalid:a,palette:o,setLoadingMapBox:s})=>{R.useEffect(()=>{if(!t.current||a)return;const l=()=>{r&&ct({map:t,markers:r,palette:o,setLoadingMapBox:s})};t.current.loaded()?l():t.current.once("load",l)},[t,r,a,o,s])},ft=({map:t,onMapClick:r})=>{R.useEffect(()=>{if(!t.current||!r)return;const a=t.current.getCanvas(),o=s=>{const l=[s.clientX-a.getBoundingClientRect().left,s.clientY-a.getBoundingClientRect().top],d=t.current.unproject(l);r(d.lng,d.lat)};a.addEventListener("click",o)},[t,r])},dt=t=>{const r=document.createElement("button");return r.innerText="×",r.style.position="absolute",r.style.top="5px",r.style.right="5px",r.style.background="transparent",r.style.border="none",r.style.fontSize="16px",r.style.padding="0",r.style.margin="10px",r.style.cursor="pointer",r.type="button",r.setAttribute("aria-label","Close popup"),r.removeAttribute("aria-hidden"),r.onclick=()=>t.remove(),r},be=({map:t,tooltip:r,coordinates:a})=>{if(!a||!r||!t.current||!Array.isArray(a)||a.length!==2)return null;const o=document.createElement("div");o.style.position="relative",o.style.overflow="hidden";const s=document.createElement("div");s.style.padding="10px",o.style.zIndex="1000";const l=Ee.createRoot(s);l.render(r);const d=new G.Popup({closeButton:!1}).setLngLat(a).setDOMContent(o).addTo(t.current);d.on("close",()=>{queueMicrotask(()=>{l.unmount()})});const p=dt(d);return o.appendChild(p),o.appendChild(s),d},he=t=>typeof t=="object"&&t!==null&&"type"in t&&"coordinates"in t,pt=t=>{if(typeof t!="object"||t===null||!("geometry"in t&&"properties"in t))return!1;const{geometry:a}=t;if(typeof a!="object"||a===null||!("coordinates"in a))return!1;const{coordinates:o}=a;if(!Array.isArray(o)||o.length!==2||!he(a))return!1;const{properties:s}=t;return typeof s!="object"||s===null?!1:"id"in s&&s.id!==void 0},vt=({map:t,point:r})=>{var s,l,d,p,u;if(!((s=t.current)!=null&&s.isStyleLoaded()))return null;const a=((p=(d=(l=t.current)==null?void 0:l.getStyle())==null?void 0:d.layers)==null?void 0:p.filter(v=>v.id.startsWith("marker-")).map(v=>v.id))||[],o=(u=t.current)==null?void 0:u.queryRenderedFeatures(r,{layers:a});if(o&&o.length>0){const v=o[0];if(!pt(v)||!he(v.geometry))return null;const{geometry:f}=v,b=f.coordinates.slice();return b.length!==2||typeof b[0]!="number"||typeof b[1]!="number"?null:v}},yt=({openPopup:t,map:r,markers:a})=>{const o=R.useRef(null);R.useEffect(()=>{if(!r.current||!a)return;const l=r.current.getCanvas();if(o.current&&(o.current.remove(),o.current=null),t){const p=a.find(u=>u.id===t);if(p){const u=[Number(p.lng)||0,Number(p.lat)||0],v=be({coordinates:u,map:r,tooltip:p.Tooltip});v&&(o.current=v)}}const d=p=>{const u=[p.clientX-l.getBoundingClientRect().left,p.clientY-l.getBoundingClientRect().top],v=vt({map:r,point:u});if(v&&v.properties&&v.properties.id){o.current&&(o.current.remove(),o.current=null);const f=a.find(b=>b.id===v.properties.id);if(f){const b=[Number(f.lng)||0,Number(f.lat)||0];if(typeof f.onClick=="function"){const m={geometry:{coordinates:b,type:"Point"},properties:{description:f.name,id:f.id,name:f.name,onClick:f.onClick,size:f.size||1,zIndex:f.zIndex||1},type:"Feature"};f.onClick(m)}requestAnimationFrame(()=>{const m=be({coordinates:b,map:r,tooltip:f.Tooltip});m&&(o.current=m)})}}};return l.addEventListener("click",d),()=>{l.removeEventListener("click",d),o.current&&(o.current.remove(),o.current=null)}},[r,a,t])},Re=()=>{try{const t=document.createElement("canvas");return(t.getContext("webgl")||t.getContext("experimental-webgl"))instanceof WebGLRenderingContext}catch{return!1}},gt=({mapStyle:t,mapContainer:r,zoomFlyFrom:a,markers:o,center:s})=>{var d,p;return{center:s?ye(s):{lat:((d=o==null?void 0:o[0])==null?void 0:d.lat)!==void 0?Number(o[0].lat):me,lng:((p=o==null?void 0:o[0])==null?void 0:p.lng)!==void 0?Number(o[0].lng):_e},container:(r==null?void 0:r.current)||"",cooperativeGestures:!0,failIfMajorPerformanceCaveat:!1,style:t,zoom:a}},_e=2.333,me=46.8677,Et=({markers:t,loading:r,center:a,openPopup:o,onMapClick:s,flyToDuration:l=5e3,fitBoundDuration:d=1e3,fitBounds:p=!0,disableFlyTo:u=!1,fitBoundsPadding:v=50,projection:f,mapStyle:b="mapbox://styles/mapbox/streets-v12?optimize=true",zoom:m=6,zoomFlyFrom:F=3})=>{const{palette:H}=M.useTheme(),[te,X]=R.useState(!0),[L,x]=R.useState(!0),N=R.useRef(null),O=R.useRef(null),re=!t||t.some(W=>W.lat===void 0||W.lng===void 0);return R.useEffect(()=>{if(!Re()){x(!1),X(!1);return}if(O.current||!N.current||r)return;N.current.innerHTML!==""&&(N.current.innerHTML="");const W=gt({center:a,mapContainer:N,mapStyle:b,markers:t,zoomFlyFrom:F});O.current=new G.Map(W)},[a,r,b,t,f,F]),lt({map:O,markers:t,markersAreInvalid:re,palette:H,setLoadingMapBox:X}),yt({map:O,markers:t,openPopup:o}),nt({center:a,map:O}),ft({map:O,onMapClick:s}),rt({disableFlyTo:u,fitBoundDuration:d,fitBounds:p,fitBoundsPadding:v,flyToDuration:l,map:O,markers:t,zoom:m}),R.useEffect(()=>()=>{O.current&&(O.current.remove(),O.current=null)},[]),{loading:te||r,map:O,mapContainer:N,markers:t,webGLSupported:L}},bt=({containerStyle:t,square:r,theme:a,height:o=300,width:s="100%",...l})=>{const{loading:d,mapContainer:p,webGLSupported:u}=Et(l);return j.jsxs(j.Fragment,{children:[j.jsx(M.GlobalStyles,{styles:{".mapboxgl-popup-content":{backgroundColor:"transparent!important",borderRadius:"0px !important",boxShadow:"none!important",padding:"0px 0px!important",width:"fit-content!important"}}}),j.jsx(tt,{ref:p,loading:d,height:o,width:s,containerStyle:t,square:r,error:!u&&"WebGL is not enabled in your browser. This technology is required to display the interactive map."})]})},ee=(t,r)=>Number.isFinite(t)&&Number.isFinite(r)&&t>=-90&&t<=90&&r>=-180&&r<=180;T.DEFAULT_CENTER_LAT=46.8677,T.DEFAULT_CENTER_LNG=2.333,T.MapProvider=$e,T.MapProviderContext=ve,T.MarkerMap=bt,T.isValidLatLng=ee,T.isWebGLSupported=Re,Object.defineProperty(T,Symbol.toStringTag,{value:"Module"})});

package/package.json

@@ -3,7 +3,7 @@
   "description": "A react library to easily display map with multiple tools",
   "private": false,
   "license": "UNLICENSED",
-  "version": "0.5.0",
+  "version": "0.5.1",
   "type": "module",
   "main": "dist/main.umd.cjs",
   "module": "dist/main.js",