@tracktor/map 1.5.1 → 1.6.0

package/dist/main.d.ts

@@ -1,8 +1,8 @@
 export { DEFAULT_CENTER_LAT, DEFAULT_CENTER_LNG } from './constants/coordinates.ts';
 export * from './context/MapProvider';
 export { default as MapProvider } from './context/MapProvider';
-export * from './features/MarkerMap/MarkerMap.tsx';
-export { default as MarkerMap } from './features/MarkerMap/MarkerMap.tsx';
+export * from './features/MapView/MapView.tsx';
+export { default as MapView } from './features/MapView/MapView.tsx';
 export * from './types/MarkerMapProps';
 export * from './types/MarkerProps';
 export { default as isPointInGeoJSON } from './utils/isPointInGeoJSON.ts';

package/dist/main.js

@@ -831,7 +831,7 @@ export {
   At as DEFAULT_CENTER_LAT,
   Pt as DEFAULT_CENTER_LNG,
   Ot as MapProvider,
-  Nt as MarkerMap,
+  Nt as MapView,
   Mt as engines,
   It as isPointInGeoJSON,
   Ft as isValidLatLng,

package/dist/main.umd.cjs

@@ -15,9 +15,9 @@
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
- */var ce;function Te(){return ce||(ce=1,process.env.NODE_ENV!=="production"&&(function(){function e(t){if(t==null)return null;if(typeof t=="function")return t.$$typeof===se?null:t.displayName||t.name||null;if(typeof t=="string")return t;switch(t){case A:return"Fragment";case Y:return"Profiler";case X:return"StrictMode";case B:return"Suspense";case G:return"SuspenseList";case Z:return"Activity"}if(typeof t=="object")switch(typeof t.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),t.$$typeof){case N:return"Portal";case ne:return t.displayName||"Context";case re:return(t._context.displayName||"Context")+".Consumer";case z:var i=t.render;return t=t.displayName,t||(t=i.displayName||i.name||"",t=t!==""?"ForwardRef("+t+")":"ForwardRef"),t;case oe:return i=t.displayName||null,i!==null?i:e(t.type)||"Memo";case W:i=t._payload,t=t._init;try{return e(t(i))}catch{}}return null}function r(t){return""+t}function n(t){try{r(t);var i=!1}catch{i=!0}if(i){i=console;var m=i.error,E=typeof Symbol=="function"&&Symbol.toStringTag&&t[Symbol.toStringTag]||t.constructor.name||"Object";return m.call(i,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",E),r(t)}}function a(t){if(t===A)return"<>";if(typeof t=="object"&&t!==null&&t.$$typeof===W)return"<...>";try{var i=e(t);return i?"<"+i+">":"<...>"}catch{return"<...>"}}function o(){var t=O.A;return t===null?null:t.getOwner()}function l(){return Error("react-stack-top-frame")}function s(t){if(C.call(t,"key")){var i=Object.getOwnPropertyDescriptor(t,"key").get;if(i&&i.isReactWarning)return!1}return t.key!==void 0}function c(t,i){function m(){I||(I=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",i))}m.isReactWarning=!0,Object.defineProperty(t,"key",{get:m,configurable:!0})}function g(){var t=e(this.type);return H[t]||(H[t]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),t=this.props.ref,t!==void 0?t:null}function y(t,i,m,E,F,L){var p=m.ref;return t={$$typeof:x,type:t,key:i,props:m,_owner:E},(p!==void 0?p:null)!==null?Object.defineProperty(t,"ref",{enumerable:!1,get:g}):Object.defineProperty(t,"ref",{enumerable:!1,value:null}),t._store={},Object.defineProperty(t._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(t,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(t,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:F}),Object.defineProperty(t,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:L}),Object.freeze&&(Object.freeze(t.props),Object.freeze(t)),t}function h(t,i,m,E,F,L){var p=i.children;if(p!==void 0)if(E)if(ae(p)){for(E=0;E<p.length;E++)v(p[E]);Object.freeze&&Object.freeze(p)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else v(p);if(C.call(i,"key")){p=e(t);var u=Object.keys(i).filter(function($){return $!=="key"});E=0<u.length?"{key: someKey, "+u.join(": ..., ")+": ...}":"{key: someKey}",Q[p+E]||(u=0<u.length?"{"+u.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
+ */var ce;function Te(){return ce||(ce=1,process.env.NODE_ENV!=="production"&&(function(){function e(t){if(t==null)return null;if(typeof t=="function")return t.$$typeof===se?null:t.displayName||t.name||null;if(typeof t=="string")return t;switch(t){case A:return"Fragment";case Y:return"Profiler";case X:return"StrictMode";case B:return"Suspense";case G:return"SuspenseList";case Z:return"Activity"}if(typeof t=="object")switch(typeof t.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),t.$$typeof){case N:return"Portal";case ne:return t.displayName||"Context";case re:return(t._context.displayName||"Context")+".Consumer";case z:var i=t.render;return t=t.displayName,t||(t=i.displayName||i.name||"",t=t!==""?"ForwardRef("+t+")":"ForwardRef"),t;case oe:return i=t.displayName||null,i!==null?i:e(t.type)||"Memo";case W:i=t._payload,t=t._init;try{return e(t(i))}catch{}}return null}function r(t){return""+t}function n(t){try{r(t);var i=!1}catch{i=!0}if(i){i=console;var m=i.error,E=typeof Symbol=="function"&&Symbol.toStringTag&&t[Symbol.toStringTag]||t.constructor.name||"Object";return m.call(i,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",E),r(t)}}function a(t){if(t===A)return"<>";if(typeof t=="object"&&t!==null&&t.$$typeof===W)return"<...>";try{var i=e(t);return i?"<"+i+">":"<...>"}catch{return"<...>"}}function o(){var t=O.A;return t===null?null:t.getOwner()}function l(){return Error("react-stack-top-frame")}function s(t){if(C.call(t,"key")){var i=Object.getOwnPropertyDescriptor(t,"key").get;if(i&&i.isReactWarning)return!1}return t.key!==void 0}function c(t,i){function m(){I||(I=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",i))}m.isReactWarning=!0,Object.defineProperty(t,"key",{get:m,configurable:!0})}function g(){var t=e(this.type);return H[t]||(H[t]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),t=this.props.ref,t!==void 0?t:null}function y(t,i,m,E,M,L){var p=m.ref;return t={$$typeof:x,type:t,key:i,props:m,_owner:E},(p!==void 0?p:null)!==null?Object.defineProperty(t,"ref",{enumerable:!1,get:g}):Object.defineProperty(t,"ref",{enumerable:!1,value:null}),t._store={},Object.defineProperty(t._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(t,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(t,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:M}),Object.defineProperty(t,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:L}),Object.freeze&&(Object.freeze(t.props),Object.freeze(t)),t}function h(t,i,m,E,M,L){var p=i.children;if(p!==void 0)if(E)if(ae(p)){for(E=0;E<p.length;E++)v(p[E]);Object.freeze&&Object.freeze(p)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else v(p);if(C.call(i,"key")){p=e(t);var u=Object.keys(i).filter(function($){return $!=="key"});E=0<u.length?"{key: someKey, "+u.join(": ..., ")+": ...}":"{key: someKey}",Q[p+E]||(u=0<u.length?"{"+u.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
   let props = %s;
   <%s {...props} />
 React keys must be passed directly to JSX without using spread:
   let props = %s;
-  <%s key={someKey} {...props} />`,E,p,u,p),Q[p+E]=!0)}if(p=null,m!==void 0&&(n(m),p=""+m),s(i)&&(n(i.key),p=""+i.key),"key"in i){m={};for(var T in i)T!=="key"&&(m[T]=i[T])}else m=i;return p&&c(m,typeof t=="function"?t.displayName||t.name||"Unknown":t),y(t,p,m,o(),F,L)}function v(t){b(t)?t._store&&(t._store.validated=1):typeof t=="object"&&t!==null&&t.$$typeof===W&&(t._payload.status==="fulfilled"?b(t._payload.value)&&t._payload.value._store&&(t._payload.value._store.validated=1):t._store&&(t._store.validated=1))}function b(t){return typeof t=="object"&&t!==null&&t.$$typeof===x}var R=d,x=Symbol.for("react.transitional.element"),N=Symbol.for("react.portal"),A=Symbol.for("react.fragment"),X=Symbol.for("react.strict_mode"),Y=Symbol.for("react.profiler"),re=Symbol.for("react.consumer"),ne=Symbol.for("react.context"),z=Symbol.for("react.forward_ref"),B=Symbol.for("react.suspense"),G=Symbol.for("react.suspense_list"),oe=Symbol.for("react.memo"),W=Symbol.for("react.lazy"),Z=Symbol.for("react.activity"),se=Symbol.for("react.client.reference"),O=R.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,C=Object.prototype.hasOwnProperty,ae=Array.isArray,k=console.createTask?console.createTask:function(){return null};R={react_stack_bottom_frame:function(t){return t()}};var I,H={},M=R.react_stack_bottom_frame.bind(R,l)(),P=k(a(l)),Q={};U.Fragment=A,U.jsx=function(t,i,m){var E=1e4>O.recentlyCreatedOwnerStacks++;return h(t,i,m,!1,E?Error("react-stack-top-frame"):M,E?k(a(t)):P)},U.jsxs=function(t,i,m){var E=1e4>O.recentlyCreatedOwnerStacks++;return h(t,i,m,!0,E?Error("react-stack-top-frame"):M,E?k(a(t)):P)}})()),U}var ue;function Se(){return ue||(ue=1,process.env.NODE_ENV==="production"?V.exports=xe():V.exports=Te()),V.exports}var f=Se();const ke=d.createContext({licenceMapbox:"",licenseMuiX:""}),je=({children:e,licenseMuiX:r,licenceMapbox:n})=>{d.useEffect(()=>{r&&ve.LicenseInfo.setLicenseKey(r)},[r]);const a=d.useMemo(()=>({licenceMapbox:n,licenseMuiX:r}),[r,n]);return n&&(le.accessToken=n),f.jsx(ke.Provider,{value:a,children:e})},we=e=>w.isArray(e)?{features:e,type:"FeatureCollection"}:e.type==="FeatureCollection"?e:{features:[e],type:"FeatureCollection"},de=({features:e})=>{if(!e)return null;const r=we(e),n=r.features.filter(o=>o.geometry.type==="Polygon"||o.geometry.type==="MultiPolygon"),a=r.features.filter(o=>o.geometry.type==="LineString"||o.geometry.type==="MultiLineString");return f.jsxs(f.Fragment,{children:[n.length>0&&f.jsx(S.Source,{id:"features-polygon",type:"geojson",data:{features:n,type:"FeatureCollection"},children:f.jsx(S.Layer,{id:"polygon-fill",type:"fill",paint:{"fill-color":["coalesce",["get","color"],"#4ADE80"],"fill-opacity":.4}})}),a.length>0&&f.jsx(S.Source,{id:"features-line",type:"geojson",data:{features:a,type:"FeatureCollection"},children:f.jsx(S.Layer,{id:"line-stroke",type:"line",paint:{"line-color":["coalesce",["get","color"],"#3B82F6"],"line-opacity":.9,"line-width":3}})})]})},Ae="#000000",Ce="#FFFFFF",K={default:"#009ba6",primary:"#3F83F8",secondary:"#9C27B0",success:"#4CAF50",warning:"#FF9800"},Pe=e=>e in K,Ne=({color:e,variant:r})=>{const{palette:n}=j.useTheme(),a=n.mode==="dark"?Ae:Ce,o=r&&Pe(r)&&K[r]||e||(w.isString(r)?r:K.default);return f.jsx(j.Box,{component:"div",style:{backgroundColor:a,border:`7px solid ${o}`,borderRadius:"50%",boxShadow:"0 0 4px rgba(0,0,0,0.3)",height:28,width:28}})},Oe=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`}}),fe=e=>Number.isFinite(e.lng)&&Number.isFinite(e.lat),pe=e=>w.isString(e)||w.isNumber(e)?String(e):JSON.stringify(e),Ie=e=>{if(!e)return[];const r=w.isArray(e)?e:e.type==="FeatureCollection"?e.features:[e],n=[];for(const a of r){const o=a.geometry;o.type==="Point"&&n.push(o.coordinates),o.type==="LineString"&&n.push(...o.coordinates),o.type==="Polygon"&&n.push(...o.coordinates[0])}return n},Me=({markers:e=[],features:r,padding:n=50,duration:a=1e3,disableAnimation:o,fitBounds:l=!0,animationKey:s,openPopup:c})=>{const{current:g}=S.useMap(),y=d.useRef(""),h=d.useMemo(()=>e.filter(fe),[e]),v=d.useMemo(()=>Ie(r),[r]),b=d.useMemo(()=>{const R=[...h.map(x=>[x.lng,x.lat]),...v];return R.length===0?null:R.reduce((x,[N,A])=>x.extend([N,A]),new le.LngLatBounds)},[h,v]);return d.useEffect(()=>{if(c){y.current=s!==void 0?pe(s):"__initial_skip__";return}if(g&&l&&b){if(s!==void 0){const R=pe(s);if(y.current===R)return;y.current=R}else if(y.current==="__initial_skip__")return;if(!b.isEmpty()){if(h.length===1&&v.length===0){const R=h[0];g.flyTo({center:[R.lng,R.lat],duration:o?0:a,zoom:14});return}g.fitBounds([b.getSouthWest().toArray(),b.getNorthEast().toArray()],{duration:o?0:a,padding:n})}}},[g,b,n,a,o,s,l,h,v,c]),null},me=(e,r)=>{if(r<=0)throw new Error("chunkSize must be greater than 0");const n=[];for(let a=0;a<e.length;a+=r)n.push(e.slice(a,a+r));return n},Fe=(e,r)=>[e,...r.map(n=>n.coords)].map(n=>n.join(",")).join(";"),Le=(e,r,n)=>{const a=r.map((s,c)=>({distance:s,index:c})).slice(1).filter(({distance:s})=>s!=null);if(a.length===0)return null;const o=a.reduce((s,c)=>c.distance<s.distance?c:s),l=e[o.index-1];return!l||n&&o.distance>n?null:{distance:o.distance,id:l.id,point:l.coords}};function ge(e,r,n){return async(a,o,l,s)=>{const c=Fe(a,o),g=e(c,l),y=await r(g),h=y?n(y)?.[0]:void 0;return h?.length?Le(o,h,s):null}}const ye=async(e,r,n)=>{const a=Array.from({length:Math.ceil(e.length/r)},(l,s)=>e.slice(s*r,(s+1)*r));return(await Promise.all(a.map(async l=>Promise.all(l.map(n))))).flat()},De="https://api.mapbox.com",q=(e,r,n,a,o={})=>{const l=new URLSearchParams({access_token:"",...o});return`${De}/${e}/${r}/mapbox/${n}/${a}?${l.toString()}`},ee=async e=>{try{const r=await fetch(e);return r.ok?await r.json():(console.error(`Mapbox API error: ${r.status} ${r.statusText}`),null)}catch(r){return console.error("Mapbox network error:",r),null}},Ue=25,Ye=5,Be=ge((e,r)=>q("directions-matrix","v1",r,e,{annotations:"distance",sources:"0"}),ee,e=>e.distances),J={findNearest:async(e,r,n="driving",a)=>{if(r.length===0)return null;const o=me(r,Ue-1);return(await ye(o,Ye,s=>Be(e,s,n,a))).filter(s=>s!=null).sort((s,c)=>s.distance-c.distance)[0]??null},getIsochrone:async(e,r="driving",n=[5,10,15])=>{const a=`${e[0]},${e[1]}`,o=q("isochrone","v1",r,a,{contours_minutes:n.join(","),polygons:"true"});return await ee(o)},getItinerary:async(e,r,n="driving")=>{const a=`${e.join(",")};${r.join(",")}`,o=q("directions","v5",n,a,{geometries:"geojson",overview:"full"}),l=await ee(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"}}},Ge=({origin:e,profile:r="driving",intervals:n=[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(!J.getIsochrone){console.warn("⚠️ getIsochrone is not implemented for this provider.");return}const c=await J.getIsochrone(e,r,n);s||(l(c),a?.(c??null))})(),()=>{s=!0}},[e,r,n,a]),o?f.jsx(de,{features:o}):null},We=d.memo(Ge),Ve={cycling:"routed-bike",driving:"routed-car",walking:"routed-foot"},Je="https://routing.openstreetmap.de",he=(e,r,n,a)=>{const o=`${Je}/${Ve[r]}/${e}/v1/${r}/${n}`,l=a?`?${new URLSearchParams(a).toString()}`:"";return`${o}${l}`},Ee=async e=>{try{const r=await fetch(e);return r.ok?await r.json():(console.error("OSRM API error:",r.status,r.statusText),null)}catch(r){return console.error("Error fetching OSRM API:",r),null}},Xe=100,ze=5,Ze=ge((e,r)=>he("table",r,e,{annotations:"distance",sources:0}),Ee,e=>e.distances),_e={findNearest:async(e,r,n="driving",a)=>{if(r.length===0)return null;const o=me(r,Xe-1);return(await ye(o,ze,s=>Ze(e,s,n,a))).filter(s=>s!=null).sort((s,c)=>s.distance-c.distance)[0]??null},getItinerary:async(e,r,n="driving")=>{const a=`${e.join(",")};${r.join(",")}`,o=he("route",n,a,{geometries:"geojson",overview:"full"}),l=await Ee(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"}}},be=({profile:e,engine:r,to:n,from:a,itineraryLineStyle:o})=>{const[l,s]=d.useState(null);return d.useEffect(()=>{a&&n&&(async()=>{try{const c=r==="OSRM"?await _e.getItinerary(a,n,e):await J.getItinerary(a,n,e);c?s(c):(console.warn("No route found between the specified points."),s(null))}catch(c){console.error("Error fetching route:",c),s(null)}})()},[a,n,e,r]),l?f.jsx(S.Source,{type:"geojson",data:l,children:f.jsx(S.Layer,{type:"line",paint:{"line-color":o?.color??"#9c3333","line-opacity":o?.opacity??.8,"line-width":o?.width??4},layout:{"line-cap":"round","line-join":"round"}})}):null},He=({origin:e,maxDistanceMeters:r,destinations:n,onNearestFound:a,profile:o="driving",engine:l="OSRM"})=>{const[s,c]=d.useState(null),g=d.useRef(null);return d.useEffect(()=>{let y=!1;if(!e||e.length!==2||!n?.length){c(null);return}c(null);const h=n.map(v=>({coords:[v.lng,v.lat],id:v.id}));return(async()=>{const b=await(l==="OSRM"?_e.findNearest:J.findNearest)(e,h,o,r);!y&&b&&c(b)})(),()=>{y=!0}},[e,r,n,o,l]),d.useEffect(()=>{if(!s){a?.(null,null,0),g.current=null;return}if(r!=null&&s.distance>r){a?.(null,null,0),g.current=null;return}const y=g.current;(!y||y.id!==s.id||y.distance!==s.distance)&&(a?.(s.id,s.point,s.distance),g.current=s)},[s,a,r]),s?.point?(console.log("nearestResult",s),f.jsx(be,{from:e,to:s.point,profile:o,engine:l})):null},Qe=d.memo(He),te={satellite:"mapbox://styles/mapbox/satellite-streets-v12",street:{dark:"mapbox://styles/mapbox/dark-v11",light:"mapbox://styles/mapbox/streets-v12"}},Re=(e,r)=>{const n=r==="dark";switch(e){case"satellite":return te.satellite;default:return n?te.street.dark:te.street.light}},$e=({mapStyle:e,theme:r,baseMapView:n,doubleClickZoom:a,cooperativeGestures:o})=>({cooperativeGestures:o,doubleClickZoom:a,failIfMajorPerformanceCaveat:!1,style:e??Re(n,r)}),Ke=({containerStyle:e,square:r,loading:n,height:a=300,width:o="100%",center:l=[2.3522,48.8566],zoom:s=5,popupMaxWidth:c,openPopup:g,openPopupOnHover:y,markers:h=[],fitBounds:v=!0,fitBoundsPadding:b,fitBoundDuration:R,fitBoundsAnimationKey:x,disableAnimation:N,mapStyle:A,onMapClick:X,baseMapView:Y,cooperativeGestures:re=!0,doubleClickZoom:ne=!0,projection:z,theme:B,features:G,from:oe,to:W,profile:Z="driving",itineraryLineStyle:se,engine:O="OSRM",findNearestMarker:C,onNearestFound:ae,isochrone:k})=>{const I=j.useTheme(),H=d.useRef(null),[M,P]=d.useState(g??null),Q=d.useMemo(()=>{if(w.isArray(l))return{latitude:l[1],longitude:l[0],zoom:s}},[l,s]),t=d.useMemo(()=>A||Re(Y,B??I.palette.mode),[Y,A,B,I.palette.mode]),{style:i,cooperativeGestures:m,doubleClickZoom:E}=$e({baseMapView:Y,cooperativeGestures:re,doubleClickZoom:ne,mapStyle:t,theme:B??I.palette.mode}),F=(u,T)=>{!y&&T&&P(u)},L=(u,T)=>{y&&P(T?u:null)};d.useEffect(()=>{P(g??null)},[g]);const p=d.useMemo(()=>M?h?.find(u=>u.id===M)??null:null,[M,h]);return f.jsxs(j.Box,{"data-testid":"mapbox-container",sx:{height:a,position:"relative",width:o,...e},children:[f.jsx(j.GlobalStyles,{styles:Oe}),n&&f.jsx(j.Skeleton,{"data-testid":"skeleton-loader",width:o,height:a,variant:r?"rectangular":"rounded",sx:{inset:0,position:"absolute",zIndex:2}}),!n&&f.jsxs(S,{ref:H,cooperativeGestures:m,doubleClickZoom:E,mapStyle:i,projection:z,initialViewState:Q,style:{height:"100%",width:"100%"},mapboxAccessToken:void 0,onClick:u=>{const T=h.find($=>{const{lng:ot,lat:st}=u.lngLat,at=Math.abs(Number($.lng||null)-ot),lt=Math.abs(Number($.lat||null)-st);return at<.01&&lt<.01});X?.(u.lngLat.lng,u.lngLat.lat,T??null)},children:[h.filter(fe).map(u=>f.jsx(S.Marker,{longitude:u.lng,latitude:u.lat,anchor:"bottom",onClick:T=>{T.originalEvent.stopPropagation(),u.id&&F(u.id,!!u.Tooltip),X?.(u.lng,u.lat,u)},children:f.jsx(j.Box,{component:"div",onMouseEnter:()=>u.id&&L(u.id,!!u.Tooltip),onMouseLeave:()=>L(null),style:{cursor:u.Tooltip?"pointer":"default"},children:u.IconComponent?f.jsx(u.IconComponent,{...u.iconProps}):f.jsx(Ne,{color:u.color,variant:u.variant})})},u.id)),p?.Tooltip&&f.jsx(S.Popup,{longitude:w.isNumber(p.lng)?p.lng:0,latitude:w.isNumber(p.lat)?p.lat:0,anchor:"top",onClose:()=>P(null),maxWidth:c,closeOnClick:!0,closeOnMove:!1,children:f.jsx(j.Box,{component:"div",sx:{minHeight:60,minWidth:240},children:p.Tooltip})}),f.jsx(be,{from:oe,to:W,profile:Z,engine:O,itineraryLineStyle:se}),C&&f.jsx(Qe,{origin:C?.origin,destinations:C?.destinations,onNearestFound:ae,maxDistanceMeters:C?.maxDistanceMeters,engine:O,profile:Z}),k&&f.jsx(We,{origin:k.origin,profile:k.profile,onIsochroneLoaded:k.onIsochroneLoaded,intervals:k.intervals}),G&&f.jsx(de,{features:G}),v&&f.jsx(Me,{markers:h,features:G,padding:b,duration:N?0:R,animationKey:x,openPopup:!!g})]},`${m}-${E}-${z}-${t}-${C?.maxDistanceMeters}`)]})},qe=d.memo(Ke),et=["OSRM","Mapbox"],tt=["driving","walking","cycling"],rt=(e,r)=>{const n="geometry"in r?r.geometry:r,[a,o]=e,l=s=>s.map(c=>c.reduce((g,[y,h],v,b)=>{const[R,x]=b[(v-1+b.length)%b.length];return h>o!=x>o&&a<(R-y)*(o-h)/(x-h)+y?!g:g},!1)).reduce((c,g,y)=>y===0?g:c&&!g,!1);return n.type==="Polygon"?l(n.coordinates):n.type==="MultiPolygon"?n.coordinates.some(s=>l(s)):!1},nt=(e,r)=>Number.isFinite(e)&&Number.isFinite(r)&&e>=-90&&e<=90&&r>=-180&&r<=180;_.DEFAULT_CENTER_LAT=46.8677,_.DEFAULT_CENTER_LNG=2.333,_.MapProvider=je,_.MarkerMap=qe,_.engines=et,_.isPointInGeoJSON=rt,_.isValidLatLng=nt,_.profiles=tt,Object.defineProperty(_,Symbol.toStringTag,{value:"Module"})}));
+  <%s key={someKey} {...props} />`,E,p,u,p),Q[p+E]=!0)}if(p=null,m!==void 0&&(n(m),p=""+m),s(i)&&(n(i.key),p=""+i.key),"key"in i){m={};for(var T in i)T!=="key"&&(m[T]=i[T])}else m=i;return p&&c(m,typeof t=="function"?t.displayName||t.name||"Unknown":t),y(t,p,m,o(),M,L)}function v(t){b(t)?t._store&&(t._store.validated=1):typeof t=="object"&&t!==null&&t.$$typeof===W&&(t._payload.status==="fulfilled"?b(t._payload.value)&&t._payload.value._store&&(t._payload.value._store.validated=1):t._store&&(t._store.validated=1))}function b(t){return typeof t=="object"&&t!==null&&t.$$typeof===x}var R=d,x=Symbol.for("react.transitional.element"),N=Symbol.for("react.portal"),A=Symbol.for("react.fragment"),X=Symbol.for("react.strict_mode"),Y=Symbol.for("react.profiler"),re=Symbol.for("react.consumer"),ne=Symbol.for("react.context"),z=Symbol.for("react.forward_ref"),B=Symbol.for("react.suspense"),G=Symbol.for("react.suspense_list"),oe=Symbol.for("react.memo"),W=Symbol.for("react.lazy"),Z=Symbol.for("react.activity"),se=Symbol.for("react.client.reference"),O=R.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,C=Object.prototype.hasOwnProperty,ae=Array.isArray,k=console.createTask?console.createTask:function(){return null};R={react_stack_bottom_frame:function(t){return t()}};var I,H={},F=R.react_stack_bottom_frame.bind(R,l)(),P=k(a(l)),Q={};U.Fragment=A,U.jsx=function(t,i,m){var E=1e4>O.recentlyCreatedOwnerStacks++;return h(t,i,m,!1,E?Error("react-stack-top-frame"):F,E?k(a(t)):P)},U.jsxs=function(t,i,m){var E=1e4>O.recentlyCreatedOwnerStacks++;return h(t,i,m,!0,E?Error("react-stack-top-frame"):F,E?k(a(t)):P)}})()),U}var ue;function Se(){return ue||(ue=1,process.env.NODE_ENV==="production"?V.exports=xe():V.exports=Te()),V.exports}var f=Se();const ke=d.createContext({licenceMapbox:"",licenseMuiX:""}),je=({children:e,licenseMuiX:r,licenceMapbox:n})=>{d.useEffect(()=>{r&&ve.LicenseInfo.setLicenseKey(r)},[r]);const a=d.useMemo(()=>({licenceMapbox:n,licenseMuiX:r}),[r,n]);return n&&(le.accessToken=n),f.jsx(ke.Provider,{value:a,children:e})},we=e=>w.isArray(e)?{features:e,type:"FeatureCollection"}:e.type==="FeatureCollection"?e:{features:[e],type:"FeatureCollection"},de=({features:e})=>{if(!e)return null;const r=we(e),n=r.features.filter(o=>o.geometry.type==="Polygon"||o.geometry.type==="MultiPolygon"),a=r.features.filter(o=>o.geometry.type==="LineString"||o.geometry.type==="MultiLineString");return f.jsxs(f.Fragment,{children:[n.length>0&&f.jsx(S.Source,{id:"features-polygon",type:"geojson",data:{features:n,type:"FeatureCollection"},children:f.jsx(S.Layer,{id:"polygon-fill",type:"fill",paint:{"fill-color":["coalesce",["get","color"],"#4ADE80"],"fill-opacity":.4}})}),a.length>0&&f.jsx(S.Source,{id:"features-line",type:"geojson",data:{features:a,type:"FeatureCollection"},children:f.jsx(S.Layer,{id:"line-stroke",type:"line",paint:{"line-color":["coalesce",["get","color"],"#3B82F6"],"line-opacity":.9,"line-width":3}})})]})},Ae="#000000",Ce="#FFFFFF",K={default:"#009ba6",primary:"#3F83F8",secondary:"#9C27B0",success:"#4CAF50",warning:"#FF9800"},Pe=e=>e in K,Ne=({color:e,variant:r})=>{const{palette:n}=j.useTheme(),a=n.mode==="dark"?Ae:Ce,o=r&&Pe(r)&&K[r]||e||(w.isString(r)?r:K.default);return f.jsx(j.Box,{component:"div",style:{backgroundColor:a,border:`7px solid ${o}`,borderRadius:"50%",boxShadow:"0 0 4px rgba(0,0,0,0.3)",height:28,width:28}})},Oe=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`}}),fe=e=>Number.isFinite(e.lng)&&Number.isFinite(e.lat),pe=e=>w.isString(e)||w.isNumber(e)?String(e):JSON.stringify(e),Ie=e=>{if(!e)return[];const r=w.isArray(e)?e:e.type==="FeatureCollection"?e.features:[e],n=[];for(const a of r){const o=a.geometry;o.type==="Point"&&n.push(o.coordinates),o.type==="LineString"&&n.push(...o.coordinates),o.type==="Polygon"&&n.push(...o.coordinates[0])}return n},Fe=({markers:e=[],features:r,padding:n=50,duration:a=1e3,disableAnimation:o,fitBounds:l=!0,animationKey:s,openPopup:c})=>{const{current:g}=S.useMap(),y=d.useRef(""),h=d.useMemo(()=>e.filter(fe),[e]),v=d.useMemo(()=>Ie(r),[r]),b=d.useMemo(()=>{const R=[...h.map(x=>[x.lng,x.lat]),...v];return R.length===0?null:R.reduce((x,[N,A])=>x.extend([N,A]),new le.LngLatBounds)},[h,v]);return d.useEffect(()=>{if(c){y.current=s!==void 0?pe(s):"__initial_skip__";return}if(g&&l&&b){if(s!==void 0){const R=pe(s);if(y.current===R)return;y.current=R}else if(y.current==="__initial_skip__")return;if(!b.isEmpty()){if(h.length===1&&v.length===0){const R=h[0];g.flyTo({center:[R.lng,R.lat],duration:o?0:a,zoom:14});return}g.fitBounds([b.getSouthWest().toArray(),b.getNorthEast().toArray()],{duration:o?0:a,padding:n})}}},[g,b,n,a,o,s,l,h,v,c]),null},me=(e,r)=>{if(r<=0)throw new Error("chunkSize must be greater than 0");const n=[];for(let a=0;a<e.length;a+=r)n.push(e.slice(a,a+r));return n},Me=(e,r)=>[e,...r.map(n=>n.coords)].map(n=>n.join(",")).join(";"),Le=(e,r,n)=>{const a=r.map((s,c)=>({distance:s,index:c})).slice(1).filter(({distance:s})=>s!=null);if(a.length===0)return null;const o=a.reduce((s,c)=>c.distance<s.distance?c:s),l=e[o.index-1];return!l||n&&o.distance>n?null:{distance:o.distance,id:l.id,point:l.coords}};function ge(e,r,n){return async(a,o,l,s)=>{const c=Me(a,o),g=e(c,l),y=await r(g),h=y?n(y)?.[0]:void 0;return h?.length?Le(o,h,s):null}}const ye=async(e,r,n)=>{const a=Array.from({length:Math.ceil(e.length/r)},(l,s)=>e.slice(s*r,(s+1)*r));return(await Promise.all(a.map(async l=>Promise.all(l.map(n))))).flat()},De="https://api.mapbox.com",q=(e,r,n,a,o={})=>{const l=new URLSearchParams({access_token:"",...o});return`${De}/${e}/${r}/mapbox/${n}/${a}?${l.toString()}`},ee=async e=>{try{const r=await fetch(e);return r.ok?await r.json():(console.error(`Mapbox API error: ${r.status} ${r.statusText}`),null)}catch(r){return console.error("Mapbox network error:",r),null}},Ue=25,Ye=5,Be=ge((e,r)=>q("directions-matrix","v1",r,e,{annotations:"distance",sources:"0"}),ee,e=>e.distances),J={findNearest:async(e,r,n="driving",a)=>{if(r.length===0)return null;const o=me(r,Ue-1);return(await ye(o,Ye,s=>Be(e,s,n,a))).filter(s=>s!=null).sort((s,c)=>s.distance-c.distance)[0]??null},getIsochrone:async(e,r="driving",n=[5,10,15])=>{const a=`${e[0]},${e[1]}`,o=q("isochrone","v1",r,a,{contours_minutes:n.join(","),polygons:"true"});return await ee(o)},getItinerary:async(e,r,n="driving")=>{const a=`${e.join(",")};${r.join(",")}`,o=q("directions","v5",n,a,{geometries:"geojson",overview:"full"}),l=await ee(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"}}},Ge=({origin:e,profile:r="driving",intervals:n=[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(!J.getIsochrone){console.warn("⚠️ getIsochrone is not implemented for this provider.");return}const c=await J.getIsochrone(e,r,n);s||(l(c),a?.(c??null))})(),()=>{s=!0}},[e,r,n,a]),o?f.jsx(de,{features:o}):null},We=d.memo(Ge),Ve={cycling:"routed-bike",driving:"routed-car",walking:"routed-foot"},Je="https://routing.openstreetmap.de",he=(e,r,n,a)=>{const o=`${Je}/${Ve[r]}/${e}/v1/${r}/${n}`,l=a?`?${new URLSearchParams(a).toString()}`:"";return`${o}${l}`},Ee=async e=>{try{const r=await fetch(e);return r.ok?await r.json():(console.error("OSRM API error:",r.status,r.statusText),null)}catch(r){return console.error("Error fetching OSRM API:",r),null}},Xe=100,ze=5,Ze=ge((e,r)=>he("table",r,e,{annotations:"distance",sources:0}),Ee,e=>e.distances),_e={findNearest:async(e,r,n="driving",a)=>{if(r.length===0)return null;const o=me(r,Xe-1);return(await ye(o,ze,s=>Ze(e,s,n,a))).filter(s=>s!=null).sort((s,c)=>s.distance-c.distance)[0]??null},getItinerary:async(e,r,n="driving")=>{const a=`${e.join(",")};${r.join(",")}`,o=he("route",n,a,{geometries:"geojson",overview:"full"}),l=await Ee(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"}}},be=({profile:e,engine:r,to:n,from:a,itineraryLineStyle:o})=>{const[l,s]=d.useState(null);return d.useEffect(()=>{a&&n&&(async()=>{try{const c=r==="OSRM"?await _e.getItinerary(a,n,e):await J.getItinerary(a,n,e);c?s(c):(console.warn("No route found between the specified points."),s(null))}catch(c){console.error("Error fetching route:",c),s(null)}})()},[a,n,e,r]),l?f.jsx(S.Source,{type:"geojson",data:l,children:f.jsx(S.Layer,{type:"line",paint:{"line-color":o?.color??"#9c3333","line-opacity":o?.opacity??.8,"line-width":o?.width??4},layout:{"line-cap":"round","line-join":"round"}})}):null},He=({origin:e,maxDistanceMeters:r,destinations:n,onNearestFound:a,profile:o="driving",engine:l="OSRM"})=>{const[s,c]=d.useState(null),g=d.useRef(null);return d.useEffect(()=>{let y=!1;if(!e||e.length!==2||!n?.length){c(null);return}c(null);const h=n.map(v=>({coords:[v.lng,v.lat],id:v.id}));return(async()=>{const b=await(l==="OSRM"?_e.findNearest:J.findNearest)(e,h,o,r);!y&&b&&c(b)})(),()=>{y=!0}},[e,r,n,o,l]),d.useEffect(()=>{if(!s){a?.(null,null,0),g.current=null;return}if(r!=null&&s.distance>r){a?.(null,null,0),g.current=null;return}const y=g.current;(!y||y.id!==s.id||y.distance!==s.distance)&&(a?.(s.id,s.point,s.distance),g.current=s)},[s,a,r]),s?.point?(console.log("nearestResult",s),f.jsx(be,{from:e,to:s.point,profile:o,engine:l})):null},Qe=d.memo(He),te={satellite:"mapbox://styles/mapbox/satellite-streets-v12",street:{dark:"mapbox://styles/mapbox/dark-v11",light:"mapbox://styles/mapbox/streets-v12"}},Re=(e,r)=>{const n=r==="dark";switch(e){case"satellite":return te.satellite;default:return n?te.street.dark:te.street.light}},$e=({mapStyle:e,theme:r,baseMapView:n,doubleClickZoom:a,cooperativeGestures:o})=>({cooperativeGestures:o,doubleClickZoom:a,failIfMajorPerformanceCaveat:!1,style:e??Re(n,r)}),Ke=({containerStyle:e,square:r,loading:n,height:a=300,width:o="100%",center:l=[2.3522,48.8566],zoom:s=5,popupMaxWidth:c,openPopup:g,openPopupOnHover:y,markers:h=[],fitBounds:v=!0,fitBoundsPadding:b,fitBoundDuration:R,fitBoundsAnimationKey:x,disableAnimation:N,mapStyle:A,onMapClick:X,baseMapView:Y,cooperativeGestures:re=!0,doubleClickZoom:ne=!0,projection:z,theme:B,features:G,from:oe,to:W,profile:Z="driving",itineraryLineStyle:se,engine:O="OSRM",findNearestMarker:C,onNearestFound:ae,isochrone:k})=>{const I=j.useTheme(),H=d.useRef(null),[F,P]=d.useState(g??null),Q=d.useMemo(()=>{if(w.isArray(l))return{latitude:l[1],longitude:l[0],zoom:s}},[l,s]),t=d.useMemo(()=>A||Re(Y,B??I.palette.mode),[Y,A,B,I.palette.mode]),{style:i,cooperativeGestures:m,doubleClickZoom:E}=$e({baseMapView:Y,cooperativeGestures:re,doubleClickZoom:ne,mapStyle:t,theme:B??I.palette.mode}),M=(u,T)=>{!y&&T&&P(u)},L=(u,T)=>{y&&P(T?u:null)};d.useEffect(()=>{P(g??null)},[g]);const p=d.useMemo(()=>F?h?.find(u=>u.id===F)??null:null,[F,h]);return f.jsxs(j.Box,{"data-testid":"mapbox-container",sx:{height:a,position:"relative",width:o,...e},children:[f.jsx(j.GlobalStyles,{styles:Oe}),n&&f.jsx(j.Skeleton,{"data-testid":"skeleton-loader",width:o,height:a,variant:r?"rectangular":"rounded",sx:{inset:0,position:"absolute",zIndex:2}}),!n&&f.jsxs(S,{ref:H,cooperativeGestures:m,doubleClickZoom:E,mapStyle:i,projection:z,initialViewState:Q,style:{height:"100%",width:"100%"},mapboxAccessToken:void 0,onClick:u=>{const T=h.find($=>{const{lng:ot,lat:st}=u.lngLat,at=Math.abs(Number($.lng||null)-ot),lt=Math.abs(Number($.lat||null)-st);return at<.01&&lt<.01});X?.(u.lngLat.lng,u.lngLat.lat,T??null)},children:[h.filter(fe).map(u=>f.jsx(S.Marker,{longitude:u.lng,latitude:u.lat,anchor:"bottom",onClick:T=>{T.originalEvent.stopPropagation(),u.id&&M(u.id,!!u.Tooltip),X?.(u.lng,u.lat,u)},children:f.jsx(j.Box,{component:"div",onMouseEnter:()=>u.id&&L(u.id,!!u.Tooltip),onMouseLeave:()=>L(null),style:{cursor:u.Tooltip?"pointer":"default"},children:u.IconComponent?f.jsx(u.IconComponent,{...u.iconProps}):f.jsx(Ne,{color:u.color,variant:u.variant})})},u.id)),p?.Tooltip&&f.jsx(S.Popup,{longitude:w.isNumber(p.lng)?p.lng:0,latitude:w.isNumber(p.lat)?p.lat:0,anchor:"top",onClose:()=>P(null),maxWidth:c,closeOnClick:!0,closeOnMove:!1,children:f.jsx(j.Box,{component:"div",sx:{minHeight:60,minWidth:240},children:p.Tooltip})}),f.jsx(be,{from:oe,to:W,profile:Z,engine:O,itineraryLineStyle:se}),C&&f.jsx(Qe,{origin:C?.origin,destinations:C?.destinations,onNearestFound:ae,maxDistanceMeters:C?.maxDistanceMeters,engine:O,profile:Z}),k&&f.jsx(We,{origin:k.origin,profile:k.profile,onIsochroneLoaded:k.onIsochroneLoaded,intervals:k.intervals}),G&&f.jsx(de,{features:G}),v&&f.jsx(Fe,{markers:h,features:G,padding:b,duration:N?0:R,animationKey:x,openPopup:!!g})]},`${m}-${E}-${z}-${t}-${C?.maxDistanceMeters}`)]})},qe=d.memo(Ke),et=["OSRM","Mapbox"],tt=["driving","walking","cycling"],rt=(e,r)=>{const n="geometry"in r?r.geometry:r,[a,o]=e,l=s=>s.map(c=>c.reduce((g,[y,h],v,b)=>{const[R,x]=b[(v-1+b.length)%b.length];return h>o!=x>o&&a<(R-y)*(o-h)/(x-h)+y?!g:g},!1)).reduce((c,g,y)=>y===0?g:c&&!g,!1);return n.type==="Polygon"?l(n.coordinates):n.type==="MultiPolygon"?n.coordinates.some(s=>l(s)):!1},nt=(e,r)=>Number.isFinite(e)&&Number.isFinite(r)&&e>=-90&&e<=90&&r>=-180&&r<=180;_.DEFAULT_CENTER_LAT=46.8677,_.DEFAULT_CENTER_LNG=2.333,_.MapProvider=je,_.MapView=qe,_.engines=et,_.isPointInGeoJSON=rt,_.isValidLatLng=nt,_.profiles=tt,Object.defineProperty(_,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.5.1",
+  "version": "1.6.0",
   "type": "module",
   "main": "dist/main.umd.cjs",
   "module": "dist/main.js",