@tracktor/map 1.8.6 → 1.8.7

package/dist/main.js

@@ -741,7 +741,7 @@ const ke = async (e, t, n) => {
     H,
     {
       "data-testid": "mapbox-container",
-      sx: { borderRadius: t ? 0 : 6, height: a, overflow: "hidden", position: "relative", width: o, ...e },
+      sx: { borderRadius: t ? 0 : 1, height: a, overflow: "hidden", position: "relative", width: o, ...e },
       children: [
         /* @__PURE__ */ f.jsx(Fe, { styles: et }),
         n && /* @__PURE__ */ f.jsx(

package/dist/main.umd.cjs

@@ -20,4 +20,4 @@
   <%s {...props} />
 React keys must be passed directly to JSX without using spread:
   let props = %s;
-  <%s key={someKey} {...props} />`,y,b,w,b),ee[b+y]=!0)}if(b=null,h!==void 0&&(r(h),b=""+h),s(c)&&(r(c.key),b=""+c.key),"key"in c){h={};for(var N in c)N!=="key"&&(h[N]=c[N])}else h=c;return b&&u(h,typeof n=="function"?n.displayName||n.name||"Unknown":n),m(n,b,h,o(),i,v)}function x(n){_(n)?n._store&&(n._store.validated=1):typeof n=="object"&&n!==null&&n.$$typeof===k&&(n._payload.status==="fulfilled"?_(n._payload.value)&&n._payload.value._store&&(n._payload.value._store.validated=1):n._store&&(n._store.validated=1))}function _(n){return typeof n=="object"&&n!==null&&n.$$typeof===S}var R=d,S=Symbol.for("react.transitional.element"),T=Symbol.for("react.portal"),P=Symbol.for("react.fragment"),H=Symbol.for("react.strict_mode"),V=Symbol.for("react.profiler"),ce=Symbol.for("react.consumer"),ie=Symbol.for("react.context"),ue=Symbol.for("react.forward_ref"),G=Symbol.for("react.suspense"),W=Symbol.for("react.suspense_list"),j=Symbol.for("react.memo"),k=Symbol.for("react.lazy"),M=Symbol.for("react.activity"),J=Symbol.for("react.client.reference"),I=R.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,F=Object.prototype.hasOwnProperty,D=Array.isArray,U=console.createTask?console.createTask:function(){return null};R={react_stack_bottom_frame:function(n){return n()}};var Q,K={},$=R.react_stack_bottom_frame.bind(R,l)(),q=U(a(l)),ee={};B.Fragment=P,B.jsx=function(n,c,h){var y=1e4>I.recentlyCreatedOwnerStacks++;return g(n,c,h,!1,y?Error("react-stack-top-frame"):$,y?U(a(n)):q)},B.jsxs=function(n,c,h){var y=1e4>I.recentlyCreatedOwnerStacks++;return g(n,c,h,!0,y?Error("react-stack-top-frame"):$,y?U(a(n)):q)}})()),B}var ge;function Ae(){return ge||(ge=1,process.env.NODE_ENV==="production"?z.exports=ke():z.exports=je()),z.exports}var p=Ae();const we=d.createContext({licenceMapbox:"",licenseMuiX:""}),Ce=({children:e,licenseMuiX:t,licenceMapbox:r})=>{d.useEffect(()=>{t&&Te.LicenseInfo.setLicenseKey(t)},[t]);const a=d.useMemo(()=>({licenceMapbox:r,licenseMuiX:t}),[t,r]);return r&&(fe.accessToken=r),p.jsx(we.Provider,{value:a,children:e})},Le=e=>e?.type==="LineString"||e?.type==="MultiLineString",Oe=e=>{let t;Array.isArray(e[0][0])?t=e.reduce((o,l)=>l.length>o.length?l:o):t=e;const r=Math.floor(t.length/2);return[t[r][0],t[r][1]]},Pe=({route:e,children:t})=>{if(!(e&&t))return null;const r=e.geometry;if(!Le(r))return null;const a=r.coordinates,[o,l]=Oe(a);return p.jsx(C.Marker,{longitude:o,latitude:l,children:t})},Me=e=>A.isArray(e)?{features:e,type:"FeatureCollection"}:e.type==="FeatureCollection"?e:{features:[e],type:"FeatureCollection"},X=({features:e,lineLabel:t,lineStyle:r})=>{if(!e)return null;const a=Me(e),o=a.features.filter(s=>s.geometry.type==="Polygon"||s.geometry.type==="MultiPolygon"),l=a.features.filter(s=>s.geometry.type==="LineString"||s.geometry.type==="MultiLineString");return p.jsxs(p.Fragment,{children:[o.length>0&&p.jsx(C.Source,{id:"features-polygon",type:"geojson",data:{features:o,type:"FeatureCollection"},children:p.jsx(C.Layer,{id:"polygon-fill",type:"fill",paint:{"fill-color":["coalesce",["get","color"],"#4ADE80"],"fill-opacity":["coalesce",["get","opacity"],.4]}})}),l.length>0&&p.jsxs(p.Fragment,{children:[p.jsx(C.Source,{id:"features-line",type:"geojson",data:{features:l,type:"FeatureCollection"},children:p.jsx(C.Layer,{id:"line-stroke",type:"line",paint:{"line-color":r?.color??["coalesce",["get","color"],"#3B82F6"],"line-opacity":r?.opacity??["coalesce",["get","opacity"],.9],"line-width":r?.width??["coalesce",["get","width"],3]}})}),t&&l.map((s,u)=>p.jsx(Pe,{route:s,children:t},`label-${u}`))]})]})},Ne="#000000",Ie="#FFFFFF",te={default:"#009ba6",primary:"#3F83F8",secondary:"#9C27B0",success:"#4CAF50",warning:"#FF9800"},Fe=e=>e in te,De=({color:e,variant:t,type:r,size:a=28})=>{const o=O.useTheme(),l=o.palette.mode==="dark"?Ne:Ie,s=Math.max(3,Math.round(a*.25)),u=(()=>{if(r==="dropOff")return"#4e85e1";if(t&&Fe(t))return te[t];if(!e)return te.default;if(typeof e=="function")return e(o);if(A.isString(e)&&e.includes(".")){const[f,m]=e.split("."),g=o.palette[f];if(g&&typeof g=="object"&&m in g)return g[m]}return e})();return p.jsx(O.Box,{component:"div",style:{backgroundColor:l,border:`${s}px solid ${u}`,borderRadius:"50%",boxShadow:"0 0 4px rgba(0,0,0,0.3)",height:a,width:a}})},Ue=e=>({".mapboxgl-popup-close-button":{color:e.palette.mode==="dark"?"#fff !important":"#000 !important",fontSize:"20px !important"},".mapboxgl-popup-content":{backgroundColor:"transparent!important",borderRadius:"0px !important",boxShadow:"none!important",padding:"0px 0px!important",width:"fit-content!important"},".mapboxgl-popup-tip":{borderTopColor:`${e.palette.mode==="dark"?"#1e1e1e":"#ffffff"} !important`}}),me=e=>{if(A.isNumber(e))return e;if(A.isString(e)&&e.trim()!==""){const t=Number(e);return Number.isFinite(t)?t:null}return null},ne=e=>{const t=me(e);return t!==null&&t>=-90&&t<=90},re=e=>{const t=me(e);return t!==null&&t>=-180&&t<=180},Ye=e=>Array.isArray(e)&&e.length===2&&ne(e[0])&&re(e[1]),oe=e=>{if(typeof e!="object"||e===null)return!1;const t=e;return(typeof t.id=="string"||typeof t.id=="number"||t.id===void 0)&&ne(t.lat)&&re(t.lng)},ye=e=>A.isString(e)||A.isNumber(e)?String(e):JSON.stringify(e),Be=e=>{if(!e)return[];const t=A.isArray(e)?e:e.type==="FeatureCollection"?e.features:[e],r=[];for(const a of t){const o=a.geometry;o.type==="Point"&&r.push(o.coordinates),o.type==="LineString"&&r.push(...o.coordinates),o.type==="Polygon"&&r.push(...o.coordinates[0])}return r},Ve=({markers:e=[],features:t,padding:r=50,duration:a=1e3,disableAnimation:o,fitBounds:l=!0,animationKey:s,openPopup:u})=>{const{current:f}=C.useMap(),m=d.useRef(""),g=d.useMemo(()=>e.filter(oe),[e]),x=d.useMemo(()=>Be(t),[t]),_=d.useMemo(()=>{const R=[...g.map(S=>[S.lng,S.lat]),...x];return R.length===0?null:R.reduce((S,[T,P])=>S.extend([T,P]),new fe.LngLatBounds)},[g,x]);return d.useEffect(()=>{if(u){m.current=s!==void 0?ye(s):"__initial_skip__";return}if(f&&l&&_){if(s!==void 0){const R=ye(s);if(m.current===R)return;m.current=R}else if(m.current==="__initial_skip__")return;if(!_.isEmpty()){if(g.length===1&&x.length===0){const R=g[0];f.flyTo({center:[R.lng,R.lat],duration:o?0:a,zoom:14});return}f.fitBounds([_.getSouthWest().toArray(),_.getNorthEast().toArray()],{duration:o?0:a,padding:r})}}},[f,_,r,a,o,s,l,g,x,u]),null},he=(e,t)=>{if(t<=0)throw new Error("chunkSize must be greater than 0");const r=[];for(let a=0;a<e.length;a+=t)r.push(e.slice(a,a+t));return r},Ge=(e,t)=>[e,...t.map(r=>r.coords)].map(r=>r.join(",")).join(";"),We=(e,t,r)=>{const a=t.map((s,u)=>{if(u===0||s==null)return null;const f=e[u-1];return f?{distance:s,id:f.id,point:f.coords}:null}).filter(s=>s!==null);if(a.length===0)return{all:[],nearest:null};const o=a.sort((s,u)=>s.distance-u.distance),l=o[0];return r&&l.distance>r?{all:o,nearest:null}:{all:o,nearest:l}};function be(e,t,r){return async(a,o,l,s)=>{const u=Ge(a,o),f=e(u,l),m=await t(f),g=m?r(m)?.[0]:void 0;return g?.length?We(o,g,s):{all:[],nearest:null}}}const Ee=async(e,t,r)=>{const a=Array.from({length:Math.ceil(e.length/t)},(l,s)=>e.slice(s*t,(s+1)*t));return(await Promise.all(a.map(async l=>Promise.all(l.map(r))))).flat()},Je="https://api.mapbox.com",se=(e,t,r,a,o={})=>{const l=new URLSearchParams({access_token:"",...o});return`${Je}/${e}/${t}/mapbox/${r}/${a}?${l.toString()}`},ae=async e=>{try{const t=await fetch(e);return t.ok?await t.json():(console.error(`Mapbox API error: ${t.status} ${t.statusText}`),null)}catch(t){return console.error("Mapbox network error:",t),null}},ze=25,Xe=5,Ze=be((e,t)=>se("directions-matrix","v1",t,e,{annotations:"distance",sources:"0"}),ae,e=>e.distances??void 0),Z={findNearest:async(e,t,r="driving",a)=>{if(!t.length)return[];const o=he(t,ze-1);return(await Ee(o,Xe,s=>Ze(e,s,r,a))).flatMap(s=>s.all).sort((s,u)=>s.distance-u.distance)},getIsochrone:async(e,t="driving",r=[5,10,15])=>{const a=`${e[0]},${e[1]}`,o=se("isochrone","v1",t,a,{contours_minutes:r.join(","),polygons:"true"});return await ae(o)},getItinerary:async(e,t,r="driving")=>{const a=`${e.join(",")};${t.join(",")}`,o=se("directions","v5",r,a,{geometries:"geojson",overview:"full"}),l=await ae(o);if(!l?.routes?.length)return null;const s=l.routes[0];return{geometry:s.geometry,properties:{distance:s.distance,duration:s.duration},type:"Feature"}}},He=({origin:e,profile:t="driving",intervals:r=[5,10,15],onIsochroneLoaded:a})=>{const[o,l]=d.useState(null);return d.useEffect(()=>{let s=!1;if(!e||e.length!==2){l(null);return}return(async()=>{if(!Z.getIsochrone){console.warn("⚠️ getIsochrone is not implemented for this provider.");return}const u=await Z.getIsochrone(e,t,r);s||(l(u),a?.(u??null))})(),()=>{s=!0}},[e,t,r,a]),o?p.jsx(X,{features:o}):null},Qe=d.memo(He),Ke={cycling:"routed-bike",driving:"routed-car",walking:"routed-foot"},$e="https://routing.openstreetmap.de",_e=(e,t,r,a)=>{const o=`${$e}/${Ke[t]}/${e}/v1/${t}/${r}`,l=a?`?${new URLSearchParams(a).toString()}`:"";return`${o}${l}`},Re=async e=>{try{const t=await fetch(e);return t.ok?await t.json():(console.error("OSRM API error:",t.status,t.statusText),null)}catch(t){return console.error("Error fetching OSRM API:",t),null}},qe=100,et=5,tt=be((e,t)=>_e("table",t,e,{annotations:"distance",sources:0}),Re,e=>e.distances??void 0),ve={findNearest:async(e,t,r="driving",a)=>{if(!t.length)return[];const o=he(t,qe-1);return(await Ee(o,et,s=>tt(e,s,r,a))).flatMap(s=>s.all).sort((s,u)=>s.distance-u.distance)},getItinerary:async(e,t,r="driving")=>{const a=`${e.join(",")};${t.join(",")}`,o=_e("route",r,a,{geometries:"geojson",overview:"full"}),l=await Re(o);if(!l?.routes?.length)return null;const s=l.routes[0];return{geometry:s.geometry,properties:{distance:s.distance,duration:s.duration},type:"Feature"}}},xe=({from:e,to:t,profile:r,engine:a,itineraryLineStyle:o,initialRoute:l,onRouteComputed:s,itineraryLabel:u})=>{const[f,m]=d.useState(l??null);return d.useEffect(()=>{l&&(m(l),s?.(l))},[l,s]),d.useEffect(()=>{!(e&&t)||l||(async()=>{const x=await(a==="OSRM"?ve:Z).getItinerary(e,t,r);m(x??null),s?.(x??null)})()},[e,t,r,a,l,s]),f?p.jsx(X,{features:f,lineStyle:o,lineLabel:u}):null},nt=({origin:e,maxDistanceMeters:t,destinations:r,onNearestFound:a,initialNearestResults:o,itineraryLineStyle:l,profile:s="driving",engine:u="OSRM"})=>{const[f,m]=d.useState(o??[]),g=d.useRef(null);d.useEffect(()=>{o&&m(o)},[o]),d.useEffect(()=>{const _=new AbortController;if(o?.length)return;if(!e||e.length!==2||!r?.length){m([]);return}m([]);const R=r.map(T=>({coords:[T.lng,T.lat],id:T.id}));return(u==="OSRM"?ve:Z).findNearest(e,R,s,t).then(T=>m(T??[])).catch(()=>m([])),()=>_.abort()},[e,t,r,s,u,o?.length]),d.useEffect(()=>{const _=g.current;(!_||_.length!==f.length||_.some((S,T)=>S.id!==f[T]?.id||S.distance!==f[T]?.distance))&&(a?.(f),g.current=f)},[f,a]);const x=f[0];return x?x.routeFeature?p.jsx(X,{features:x.routeFeature}):p.jsx(xe,{from:e,to:x.point,profile:s,engine:u,itineraryLineStyle:l}):null},rt=d.memo(nt),le={satellite:"mapbox://styles/mapbox/satellite-streets-v12",street:{dark:"mapbox://styles/mapbox/dark-v11",light:"mapbox://styles/mapbox/streets-v12"}},Se=(e,t)=>{const r=t==="dark";switch(e){case"satellite":return le.satellite;default:return r?le.street.dark:le.street.light}},ot=({mapStyle:e,theme:t,baseMapView:r,doubleClickZoom:a,cooperativeGestures:o})=>({cooperativeGestures:o,doubleClickZoom:a,failIfMajorPerformanceCaveat:!1,style:e??Se(r,t)}),st=({containerStyle:e,square:t,loading:r,height:a=300,width:o="100%",center:l=[2.3522,48.8566],zoom:s=5,popupMaxWidth:u,openPopup:f,openPopupOnHover:m,markers:g=[],fitBounds:x=!0,fitBoundsPadding:_,fitBoundDuration:R,fitBoundsAnimationKey:S,disableAnimation:T,mapStyle:P,onMapClick:H,baseMapView:V,cooperativeGestures:ce=!0,doubleClickZoom:ie=!0,projection:ue,theme:G,features:W,itineraryParams:j,findNearestMarker:k,isochrone:M})=>{const J=O.useTheme(),I=d.useRef(null),[F,D]=d.useState(f??null),[U,Q]=d.useState(!1),K=d.useMemo(()=>{const[i=2.3522,v=48.8566]=A.isArray(l)?l:[];return{latitude:v,longitude:i,zoom:s}},[l,s]),$=d.useMemo(()=>P||Se(V,G??J.palette.mode),[V,P,G,J.palette.mode]),{style:q,cooperativeGestures:ee,doubleClickZoom:n}=ot({baseMapView:V,cooperativeGestures:ce,doubleClickZoom:ie,mapStyle:$,theme:G??J.palette.mode}),c=(i,v)=>{!m&&v&&D(i)},h=(i,v)=>{m&&D(v?i:null)};d.useEffect(()=>{D(f??null)},[f]);const y=d.useMemo(()=>F?g?.find(i=>i.id===F)??null:null,[F,g]);return p.jsxs(O.Box,{"data-testid":"mapbox-container",sx:{borderRadius:t?0:6,height:a,overflow:"hidden",position:"relative",width:o,...e},children:[p.jsx(O.GlobalStyles,{styles:Ue}),r&&p.jsx(O.Skeleton,{"data-testid":"skeleton-loader",width:o,height:a,variant:t?"rectangular":"rounded",sx:{inset:0,position:"absolute",zIndex:2}}),!r&&p.jsxs(C,{ref:I,cooperativeGestures:ee,doubleClickZoom:n,mapStyle:q,projection:ue,onLoad:()=>{Q(!0),I.current?.resize()},initialViewState:K,style:{height:"100%",width:"100%"},mapboxAccessToken:void 0,onClick:i=>{const v=g.find(b=>{const{lng:w,lat:N}=i.lngLat,L=Math.abs(Number(b.lng??0)-w),ut=Math.abs(Number(b.lat??0)-N);return L<.01&&ut<.01});H?.(i.lngLat.lng,i.lngLat.lat,v??null)},children:[U&&g.filter(oe).map(i=>{const v=typeof i.size=="number"?i.size:void 0,b=(()=>{if(!i.IconComponent)return null;const L={...i.iconProps};return v&&(L.width=v,L.height=v),p.jsx(i.IconComponent,{...L})})(),w=i.IconComponent?null:p.jsx(De,{color:i.color,variant:i.variant,size:v,type:i.type}),N={alignItems:"center",cursor:i.Tooltip?"pointer":"default",display:"inline-flex",justifyContent:"center",...i.IconComponent&&!v?{}:v?{height:v,width:v}:{}};return p.jsx(C.Marker,{longitude:i.lng,latitude:i.lat,anchor:"center",onClick:L=>{L.originalEvent.stopPropagation(),i.id&&c(i.id,!!i.Tooltip),H?.(i.lng,i.lat,i)},children:p.jsx(O.Box,{component:"div",onMouseEnter:()=>i.id&&h(i.id,!!i.Tooltip),onMouseLeave:()=>h(null),style:N,children:b||w})},i.id)}),U&&y?.Tooltip&&p.jsx(C.Popup,{longitude:A.isNumber(y.lng)?y.lng:0,latitude:A.isNumber(y.lat)?y.lat:0,anchor:"top",onClose:()=>D(null),maxWidth:u,closeOnClick:!0,closeOnMove:!1,children:p.jsx(O.Box,{component:"div",sx:{minHeight:60,minWidth:240},children:y.Tooltip})}),j&&p.jsx(xe,{from:j.from,to:j.to,profile:j.profile,engine:j.engine,itineraryLineStyle:j.itineraryLineStyle,initialRoute:j.initialRoute,onRouteComputed:j.onRouteComputed,itineraryLabel:j.itineraryLabel}),k&&p.jsx(rt,{origin:k.origin,destinations:k.destinations,onNearestFound:k.onNearestFound,maxDistanceMeters:k.maxDistanceMeters,engine:k.engine,profile:k.profile,initialNearestResults:k.initialNearestResults,itineraryLineStyle:k.itineraryLineStyle}),M&&p.jsx(Qe,{origin:M.origin,profile:M.profile,onIsochroneLoaded:M.onIsochroneLoaded,intervals:M.intervals}),W&&p.jsx(X,{features:W}),x&&p.jsx(Ve,{markers:g,features:W,padding:_,duration:T?0:R,animationKey:S,openPopup:!!f})]})]})},at=d.memo(st),lt=["OSRM","Mapbox"],ct=["driving","walking","cycling"],it=(e,t)=>{const r="geometry"in t?t.geometry:t,[a,o]=e,l=s=>s.map(u=>u.reduce((f,[m,g],x,_)=>{const[R,S]=_[(x-1+_.length)%_.length];return g>o!=S>o&&a<(R-m)*(o-g)/(S-g)+m?!f:f},!1)).reduce((u,f,m)=>m===0?f:u&&!f,!1);return r.type==="Polygon"?l(r.coordinates):r.type==="MultiPolygon"?r.coordinates.some(s=>l(s)):!1};E.DEFAULT_CENTER_LAT=46.8677,E.DEFAULT_CENTER_LNG=2.333,E.MapProvider=Ce,E.MapView=at,E.engines=lt,E.isPointInGeoJSON=it,E.isValidLatLngTuple=Ye,E.isValidLatitude=ne,E.isValidLongitude=re,E.isValidMarker=oe,E.profiles=ct,Object.defineProperty(E,Symbol.toStringTag,{value:"Module"})}));
+  <%s key={someKey} {...props} />`,y,b,w,b),ee[b+y]=!0)}if(b=null,h!==void 0&&(r(h),b=""+h),s(c)&&(r(c.key),b=""+c.key),"key"in c){h={};for(var N in c)N!=="key"&&(h[N]=c[N])}else h=c;return b&&u(h,typeof n=="function"?n.displayName||n.name||"Unknown":n),m(n,b,h,o(),i,v)}function x(n){_(n)?n._store&&(n._store.validated=1):typeof n=="object"&&n!==null&&n.$$typeof===k&&(n._payload.status==="fulfilled"?_(n._payload.value)&&n._payload.value._store&&(n._payload.value._store.validated=1):n._store&&(n._store.validated=1))}function _(n){return typeof n=="object"&&n!==null&&n.$$typeof===S}var R=d,S=Symbol.for("react.transitional.element"),T=Symbol.for("react.portal"),P=Symbol.for("react.fragment"),H=Symbol.for("react.strict_mode"),V=Symbol.for("react.profiler"),ce=Symbol.for("react.consumer"),ie=Symbol.for("react.context"),ue=Symbol.for("react.forward_ref"),G=Symbol.for("react.suspense"),W=Symbol.for("react.suspense_list"),j=Symbol.for("react.memo"),k=Symbol.for("react.lazy"),M=Symbol.for("react.activity"),J=Symbol.for("react.client.reference"),I=R.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,F=Object.prototype.hasOwnProperty,D=Array.isArray,U=console.createTask?console.createTask:function(){return null};R={react_stack_bottom_frame:function(n){return n()}};var Q,K={},$=R.react_stack_bottom_frame.bind(R,l)(),q=U(a(l)),ee={};B.Fragment=P,B.jsx=function(n,c,h){var y=1e4>I.recentlyCreatedOwnerStacks++;return g(n,c,h,!1,y?Error("react-stack-top-frame"):$,y?U(a(n)):q)},B.jsxs=function(n,c,h){var y=1e4>I.recentlyCreatedOwnerStacks++;return g(n,c,h,!0,y?Error("react-stack-top-frame"):$,y?U(a(n)):q)}})()),B}var ge;function Ae(){return ge||(ge=1,process.env.NODE_ENV==="production"?z.exports=ke():z.exports=je()),z.exports}var p=Ae();const we=d.createContext({licenceMapbox:"",licenseMuiX:""}),Ce=({children:e,licenseMuiX:t,licenceMapbox:r})=>{d.useEffect(()=>{t&&Te.LicenseInfo.setLicenseKey(t)},[t]);const a=d.useMemo(()=>({licenceMapbox:r,licenseMuiX:t}),[t,r]);return r&&(fe.accessToken=r),p.jsx(we.Provider,{value:a,children:e})},Le=e=>e?.type==="LineString"||e?.type==="MultiLineString",Oe=e=>{let t;Array.isArray(e[0][0])?t=e.reduce((o,l)=>l.length>o.length?l:o):t=e;const r=Math.floor(t.length/2);return[t[r][0],t[r][1]]},Pe=({route:e,children:t})=>{if(!(e&&t))return null;const r=e.geometry;if(!Le(r))return null;const a=r.coordinates,[o,l]=Oe(a);return p.jsx(C.Marker,{longitude:o,latitude:l,children:t})},Me=e=>A.isArray(e)?{features:e,type:"FeatureCollection"}:e.type==="FeatureCollection"?e:{features:[e],type:"FeatureCollection"},X=({features:e,lineLabel:t,lineStyle:r})=>{if(!e)return null;const a=Me(e),o=a.features.filter(s=>s.geometry.type==="Polygon"||s.geometry.type==="MultiPolygon"),l=a.features.filter(s=>s.geometry.type==="LineString"||s.geometry.type==="MultiLineString");return p.jsxs(p.Fragment,{children:[o.length>0&&p.jsx(C.Source,{id:"features-polygon",type:"geojson",data:{features:o,type:"FeatureCollection"},children:p.jsx(C.Layer,{id:"polygon-fill",type:"fill",paint:{"fill-color":["coalesce",["get","color"],"#4ADE80"],"fill-opacity":["coalesce",["get","opacity"],.4]}})}),l.length>0&&p.jsxs(p.Fragment,{children:[p.jsx(C.Source,{id:"features-line",type:"geojson",data:{features:l,type:"FeatureCollection"},children:p.jsx(C.Layer,{id:"line-stroke",type:"line",paint:{"line-color":r?.color??["coalesce",["get","color"],"#3B82F6"],"line-opacity":r?.opacity??["coalesce",["get","opacity"],.9],"line-width":r?.width??["coalesce",["get","width"],3]}})}),t&&l.map((s,u)=>p.jsx(Pe,{route:s,children:t},`label-${u}`))]})]})},Ne="#000000",Ie="#FFFFFF",te={default:"#009ba6",primary:"#3F83F8",secondary:"#9C27B0",success:"#4CAF50",warning:"#FF9800"},Fe=e=>e in te,De=({color:e,variant:t,type:r,size:a=28})=>{const o=O.useTheme(),l=o.palette.mode==="dark"?Ne:Ie,s=Math.max(3,Math.round(a*.25)),u=(()=>{if(r==="dropOff")return"#4e85e1";if(t&&Fe(t))return te[t];if(!e)return te.default;if(typeof e=="function")return e(o);if(A.isString(e)&&e.includes(".")){const[f,m]=e.split("."),g=o.palette[f];if(g&&typeof g=="object"&&m in g)return g[m]}return e})();return p.jsx(O.Box,{component:"div",style:{backgroundColor:l,border:`${s}px solid ${u}`,borderRadius:"50%",boxShadow:"0 0 4px rgba(0,0,0,0.3)",height:a,width:a}})},Ue=e=>({".mapboxgl-popup-close-button":{color:e.palette.mode==="dark"?"#fff !important":"#000 !important",fontSize:"20px !important"},".mapboxgl-popup-content":{backgroundColor:"transparent!important",borderRadius:"0px !important",boxShadow:"none!important",padding:"0px 0px!important",width:"fit-content!important"},".mapboxgl-popup-tip":{borderTopColor:`${e.palette.mode==="dark"?"#1e1e1e":"#ffffff"} !important`}}),me=e=>{if(A.isNumber(e))return e;if(A.isString(e)&&e.trim()!==""){const t=Number(e);return Number.isFinite(t)?t:null}return null},ne=e=>{const t=me(e);return t!==null&&t>=-90&&t<=90},re=e=>{const t=me(e);return t!==null&&t>=-180&&t<=180},Ye=e=>Array.isArray(e)&&e.length===2&&ne(e[0])&&re(e[1]),oe=e=>{if(typeof e!="object"||e===null)return!1;const t=e;return(typeof t.id=="string"||typeof t.id=="number"||t.id===void 0)&&ne(t.lat)&&re(t.lng)},ye=e=>A.isString(e)||A.isNumber(e)?String(e):JSON.stringify(e),Be=e=>{if(!e)return[];const t=A.isArray(e)?e:e.type==="FeatureCollection"?e.features:[e],r=[];for(const a of t){const o=a.geometry;o.type==="Point"&&r.push(o.coordinates),o.type==="LineString"&&r.push(...o.coordinates),o.type==="Polygon"&&r.push(...o.coordinates[0])}return r},Ve=({markers:e=[],features:t,padding:r=50,duration:a=1e3,disableAnimation:o,fitBounds:l=!0,animationKey:s,openPopup:u})=>{const{current:f}=C.useMap(),m=d.useRef(""),g=d.useMemo(()=>e.filter(oe),[e]),x=d.useMemo(()=>Be(t),[t]),_=d.useMemo(()=>{const R=[...g.map(S=>[S.lng,S.lat]),...x];return R.length===0?null:R.reduce((S,[T,P])=>S.extend([T,P]),new fe.LngLatBounds)},[g,x]);return d.useEffect(()=>{if(u){m.current=s!==void 0?ye(s):"__initial_skip__";return}if(f&&l&&_){if(s!==void 0){const R=ye(s);if(m.current===R)return;m.current=R}else if(m.current==="__initial_skip__")return;if(!_.isEmpty()){if(g.length===1&&x.length===0){const R=g[0];f.flyTo({center:[R.lng,R.lat],duration:o?0:a,zoom:14});return}f.fitBounds([_.getSouthWest().toArray(),_.getNorthEast().toArray()],{duration:o?0:a,padding:r})}}},[f,_,r,a,o,s,l,g,x,u]),null},he=(e,t)=>{if(t<=0)throw new Error("chunkSize must be greater than 0");const r=[];for(let a=0;a<e.length;a+=t)r.push(e.slice(a,a+t));return r},Ge=(e,t)=>[e,...t.map(r=>r.coords)].map(r=>r.join(",")).join(";"),We=(e,t,r)=>{const a=t.map((s,u)=>{if(u===0||s==null)return null;const f=e[u-1];return f?{distance:s,id:f.id,point:f.coords}:null}).filter(s=>s!==null);if(a.length===0)return{all:[],nearest:null};const o=a.sort((s,u)=>s.distance-u.distance),l=o[0];return r&&l.distance>r?{all:o,nearest:null}:{all:o,nearest:l}};function be(e,t,r){return async(a,o,l,s)=>{const u=Ge(a,o),f=e(u,l),m=await t(f),g=m?r(m)?.[0]:void 0;return g?.length?We(o,g,s):{all:[],nearest:null}}}const Ee=async(e,t,r)=>{const a=Array.from({length:Math.ceil(e.length/t)},(l,s)=>e.slice(s*t,(s+1)*t));return(await Promise.all(a.map(async l=>Promise.all(l.map(r))))).flat()},Je="https://api.mapbox.com",se=(e,t,r,a,o={})=>{const l=new URLSearchParams({access_token:"",...o});return`${Je}/${e}/${t}/mapbox/${r}/${a}?${l.toString()}`},ae=async e=>{try{const t=await fetch(e);return t.ok?await t.json():(console.error(`Mapbox API error: ${t.status} ${t.statusText}`),null)}catch(t){return console.error("Mapbox network error:",t),null}},ze=25,Xe=5,Ze=be((e,t)=>se("directions-matrix","v1",t,e,{annotations:"distance",sources:"0"}),ae,e=>e.distances??void 0),Z={findNearest:async(e,t,r="driving",a)=>{if(!t.length)return[];const o=he(t,ze-1);return(await Ee(o,Xe,s=>Ze(e,s,r,a))).flatMap(s=>s.all).sort((s,u)=>s.distance-u.distance)},getIsochrone:async(e,t="driving",r=[5,10,15])=>{const a=`${e[0]},${e[1]}`,o=se("isochrone","v1",t,a,{contours_minutes:r.join(","),polygons:"true"});return await ae(o)},getItinerary:async(e,t,r="driving")=>{const a=`${e.join(",")};${t.join(",")}`,o=se("directions","v5",r,a,{geometries:"geojson",overview:"full"}),l=await ae(o);if(!l?.routes?.length)return null;const s=l.routes[0];return{geometry:s.geometry,properties:{distance:s.distance,duration:s.duration},type:"Feature"}}},He=({origin:e,profile:t="driving",intervals:r=[5,10,15],onIsochroneLoaded:a})=>{const[o,l]=d.useState(null);return d.useEffect(()=>{let s=!1;if(!e||e.length!==2){l(null);return}return(async()=>{if(!Z.getIsochrone){console.warn("⚠️ getIsochrone is not implemented for this provider.");return}const u=await Z.getIsochrone(e,t,r);s||(l(u),a?.(u??null))})(),()=>{s=!0}},[e,t,r,a]),o?p.jsx(X,{features:o}):null},Qe=d.memo(He),Ke={cycling:"routed-bike",driving:"routed-car",walking:"routed-foot"},$e="https://routing.openstreetmap.de",_e=(e,t,r,a)=>{const o=`${$e}/${Ke[t]}/${e}/v1/${t}/${r}`,l=a?`?${new URLSearchParams(a).toString()}`:"";return`${o}${l}`},Re=async e=>{try{const t=await fetch(e);return t.ok?await t.json():(console.error("OSRM API error:",t.status,t.statusText),null)}catch(t){return console.error("Error fetching OSRM API:",t),null}},qe=100,et=5,tt=be((e,t)=>_e("table",t,e,{annotations:"distance",sources:0}),Re,e=>e.distances??void 0),ve={findNearest:async(e,t,r="driving",a)=>{if(!t.length)return[];const o=he(t,qe-1);return(await Ee(o,et,s=>tt(e,s,r,a))).flatMap(s=>s.all).sort((s,u)=>s.distance-u.distance)},getItinerary:async(e,t,r="driving")=>{const a=`${e.join(",")};${t.join(",")}`,o=_e("route",r,a,{geometries:"geojson",overview:"full"}),l=await Re(o);if(!l?.routes?.length)return null;const s=l.routes[0];return{geometry:s.geometry,properties:{distance:s.distance,duration:s.duration},type:"Feature"}}},xe=({from:e,to:t,profile:r,engine:a,itineraryLineStyle:o,initialRoute:l,onRouteComputed:s,itineraryLabel:u})=>{const[f,m]=d.useState(l??null);return d.useEffect(()=>{l&&(m(l),s?.(l))},[l,s]),d.useEffect(()=>{!(e&&t)||l||(async()=>{const x=await(a==="OSRM"?ve:Z).getItinerary(e,t,r);m(x??null),s?.(x??null)})()},[e,t,r,a,l,s]),f?p.jsx(X,{features:f,lineStyle:o,lineLabel:u}):null},nt=({origin:e,maxDistanceMeters:t,destinations:r,onNearestFound:a,initialNearestResults:o,itineraryLineStyle:l,profile:s="driving",engine:u="OSRM"})=>{const[f,m]=d.useState(o??[]),g=d.useRef(null);d.useEffect(()=>{o&&m(o)},[o]),d.useEffect(()=>{const _=new AbortController;if(o?.length)return;if(!e||e.length!==2||!r?.length){m([]);return}m([]);const R=r.map(T=>({coords:[T.lng,T.lat],id:T.id}));return(u==="OSRM"?ve:Z).findNearest(e,R,s,t).then(T=>m(T??[])).catch(()=>m([])),()=>_.abort()},[e,t,r,s,u,o?.length]),d.useEffect(()=>{const _=g.current;(!_||_.length!==f.length||_.some((S,T)=>S.id!==f[T]?.id||S.distance!==f[T]?.distance))&&(a?.(f),g.current=f)},[f,a]);const x=f[0];return x?x.routeFeature?p.jsx(X,{features:x.routeFeature}):p.jsx(xe,{from:e,to:x.point,profile:s,engine:u,itineraryLineStyle:l}):null},rt=d.memo(nt),le={satellite:"mapbox://styles/mapbox/satellite-streets-v12",street:{dark:"mapbox://styles/mapbox/dark-v11",light:"mapbox://styles/mapbox/streets-v12"}},Se=(e,t)=>{const r=t==="dark";switch(e){case"satellite":return le.satellite;default:return r?le.street.dark:le.street.light}},ot=({mapStyle:e,theme:t,baseMapView:r,doubleClickZoom:a,cooperativeGestures:o})=>({cooperativeGestures:o,doubleClickZoom:a,failIfMajorPerformanceCaveat:!1,style:e??Se(r,t)}),st=({containerStyle:e,square:t,loading:r,height:a=300,width:o="100%",center:l=[2.3522,48.8566],zoom:s=5,popupMaxWidth:u,openPopup:f,openPopupOnHover:m,markers:g=[],fitBounds:x=!0,fitBoundsPadding:_,fitBoundDuration:R,fitBoundsAnimationKey:S,disableAnimation:T,mapStyle:P,onMapClick:H,baseMapView:V,cooperativeGestures:ce=!0,doubleClickZoom:ie=!0,projection:ue,theme:G,features:W,itineraryParams:j,findNearestMarker:k,isochrone:M})=>{const J=O.useTheme(),I=d.useRef(null),[F,D]=d.useState(f??null),[U,Q]=d.useState(!1),K=d.useMemo(()=>{const[i=2.3522,v=48.8566]=A.isArray(l)?l:[];return{latitude:v,longitude:i,zoom:s}},[l,s]),$=d.useMemo(()=>P||Se(V,G??J.palette.mode),[V,P,G,J.palette.mode]),{style:q,cooperativeGestures:ee,doubleClickZoom:n}=ot({baseMapView:V,cooperativeGestures:ce,doubleClickZoom:ie,mapStyle:$,theme:G??J.palette.mode}),c=(i,v)=>{!m&&v&&D(i)},h=(i,v)=>{m&&D(v?i:null)};d.useEffect(()=>{D(f??null)},[f]);const y=d.useMemo(()=>F?g?.find(i=>i.id===F)??null:null,[F,g]);return p.jsxs(O.Box,{"data-testid":"mapbox-container",sx:{borderRadius:t?0:1,height:a,overflow:"hidden",position:"relative",width:o,...e},children:[p.jsx(O.GlobalStyles,{styles:Ue}),r&&p.jsx(O.Skeleton,{"data-testid":"skeleton-loader",width:o,height:a,variant:t?"rectangular":"rounded",sx:{inset:0,position:"absolute",zIndex:2}}),!r&&p.jsxs(C,{ref:I,cooperativeGestures:ee,doubleClickZoom:n,mapStyle:q,projection:ue,onLoad:()=>{Q(!0),I.current?.resize()},initialViewState:K,style:{height:"100%",width:"100%"},mapboxAccessToken:void 0,onClick:i=>{const v=g.find(b=>{const{lng:w,lat:N}=i.lngLat,L=Math.abs(Number(b.lng??0)-w),ut=Math.abs(Number(b.lat??0)-N);return L<.01&&ut<.01});H?.(i.lngLat.lng,i.lngLat.lat,v??null)},children:[U&&g.filter(oe).map(i=>{const v=typeof i.size=="number"?i.size:void 0,b=(()=>{if(!i.IconComponent)return null;const L={...i.iconProps};return v&&(L.width=v,L.height=v),p.jsx(i.IconComponent,{...L})})(),w=i.IconComponent?null:p.jsx(De,{color:i.color,variant:i.variant,size:v,type:i.type}),N={alignItems:"center",cursor:i.Tooltip?"pointer":"default",display:"inline-flex",justifyContent:"center",...i.IconComponent&&!v?{}:v?{height:v,width:v}:{}};return p.jsx(C.Marker,{longitude:i.lng,latitude:i.lat,anchor:"center",onClick:L=>{L.originalEvent.stopPropagation(),i.id&&c(i.id,!!i.Tooltip),H?.(i.lng,i.lat,i)},children:p.jsx(O.Box,{component:"div",onMouseEnter:()=>i.id&&h(i.id,!!i.Tooltip),onMouseLeave:()=>h(null),style:N,children:b||w})},i.id)}),U&&y?.Tooltip&&p.jsx(C.Popup,{longitude:A.isNumber(y.lng)?y.lng:0,latitude:A.isNumber(y.lat)?y.lat:0,anchor:"top",onClose:()=>D(null),maxWidth:u,closeOnClick:!0,closeOnMove:!1,children:p.jsx(O.Box,{component:"div",sx:{minHeight:60,minWidth:240},children:y.Tooltip})}),j&&p.jsx(xe,{from:j.from,to:j.to,profile:j.profile,engine:j.engine,itineraryLineStyle:j.itineraryLineStyle,initialRoute:j.initialRoute,onRouteComputed:j.onRouteComputed,itineraryLabel:j.itineraryLabel}),k&&p.jsx(rt,{origin:k.origin,destinations:k.destinations,onNearestFound:k.onNearestFound,maxDistanceMeters:k.maxDistanceMeters,engine:k.engine,profile:k.profile,initialNearestResults:k.initialNearestResults,itineraryLineStyle:k.itineraryLineStyle}),M&&p.jsx(Qe,{origin:M.origin,profile:M.profile,onIsochroneLoaded:M.onIsochroneLoaded,intervals:M.intervals}),W&&p.jsx(X,{features:W}),x&&p.jsx(Ve,{markers:g,features:W,padding:_,duration:T?0:R,animationKey:S,openPopup:!!f})]})]})},at=d.memo(st),lt=["OSRM","Mapbox"],ct=["driving","walking","cycling"],it=(e,t)=>{const r="geometry"in t?t.geometry:t,[a,o]=e,l=s=>s.map(u=>u.reduce((f,[m,g],x,_)=>{const[R,S]=_[(x-1+_.length)%_.length];return g>o!=S>o&&a<(R-m)*(o-g)/(S-g)+m?!f:f},!1)).reduce((u,f,m)=>m===0?f:u&&!f,!1);return r.type==="Polygon"?l(r.coordinates):r.type==="MultiPolygon"?r.coordinates.some(s=>l(s)):!1};E.DEFAULT_CENTER_LAT=46.8677,E.DEFAULT_CENTER_LNG=2.333,E.MapProvider=Ce,E.MapView=at,E.engines=lt,E.isPointInGeoJSON=it,E.isValidLatLngTuple=Ye,E.isValidLatitude=ne,E.isValidLongitude=re,E.isValidMarker=oe,E.profiles=ct,Object.defineProperty(E,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": "1.8.6",
+  "version": "1.8.7",
   "type": "module",
   "main": "dist/main.umd.cjs",
   "module": "dist/main.js",