react-route-profile 0.1.4 → 0.1.6

package/README.md

@@ -29,6 +29,8 @@ const myRoute: RouteConfig = {
   zoomHorizontal: 14,
   zoomVertical: 12,
   geoJson: myGeoJsonObject,
+  surface: [{ segment: [0, 1000], type: "asphalt" }],
+  routes: [{ id: "A12", color: "green", segment: [0, 1000] }],
 };
 
 <RouteMap apiKey={apiKey} route={myRoute} height="100dvh" />;
@@ -91,14 +93,16 @@ const { refHeader, refMapContainer, targetHeaderFraction, effectiveHeaderHeight,
 
 ### RouteConfig
 
-| Field          | Type                           | Description                    |
-| -------------- | ------------------------------ | ------------------------------ |
-| id             | string                         | Identifier for the route.      |
-| name           | string                         | Display name.                  |
-| center         | `{ lat: number; lng: number }` | Map center.                    |
-| zoomHorizontal | number (optional)              | Zoom when landscape.           |
-| zoomVertical   | number (optional)              | Zoom when portrait.            |
-| geoJson        | FeatureCollection              | GeoJSON geometry and features. |
+| Field          | Type                                                | Description                               |
+| -------------- | --------------------------------------------------- | ----------------------------------------- |
+| id             | string                                              | Identifier for the route.                 |
+| name           | string                                              | Display name.                             |
+| center         | `{ lat: number; lng: number }`                      | Map center.                               |
+| zoomHorizontal | number (optional)                                   | Zoom when landscape.                      |
+| zoomVertical   | number (optional)                                   | Zoom when portrait.                       |
+| geoJson        | FeatureCollection                                   | GeoJSON geometry and features.            |
+| surface        | `Array<{ segment: [number, number]; type: SurfaceType }>` | Optional surface segments for the strip. |
+| routes         | `Array<{ id: string; color: string; segment: [number, number] }>` | Optional route segments for the route strip. |
 
 ### Theme
 

package/bin/fetch-elevation.js

@@ -91,22 +91,24 @@ const buildUrl = (apiKey, pathPoints, samples) => {
   return `https://maps.googleapis.com/maps/api/elevation/json?path=${encodedPath}&samples=${samples}&key=${apiKey}`;
 };
 
-const toElevationPoints = (results) => {
+const computePathDistance = (pathPoints) => {
+  let total = 0;
+  for (let i = 1; i < pathPoints.length; i += 1) {
+    total += haversineMeters(pathPoints[i - 1], pathPoints[i]);
+  }
+  return total;
+};
+
+const toElevationPoints = (results, totalDistance) => {
   const points = [];
-  let cumulative = 0;
   results.forEach((r, idx) => {
     if (!r?.location) return;
-    if (idx > 0) {
-      const prev = results[idx - 1];
-      cumulative += haversineMeters(
-        { lat: prev.location.lat, lng: prev.location.lng },
-        { lat: r.location.lat, lng: r.location.lng }
-      );
-    }
+    const ratio = (results.length - 1) > 0 ? idx / (results.length - 1) : 0;
+    const cumulative = Math.round(totalDistance * ratio);
     points.push({
       lat: r.location.lat,
       lng: r.location.lng,
-      distance: Math.round(cumulative),
+      distance: cumulative,
       elevation: r.elevation,
     });
   });
@@ -131,6 +133,7 @@ const main = async () => {
   const raw = await fs.readFile(inputPath, "utf8");
   const geoJson = JSON.parse(raw);
   const { path: rawPath, lineFeature } = extractPath(geoJson);
+  const computedDistance = computePathDistance(rawPath);
   const pathPoints = downsamplePath(rawPath);
   if (rawPath.length !== pathPoints.length) {
     console.log(`Downsampled path from ${rawPath.length} to ${pathPoints.length} points.`);
@@ -159,7 +162,7 @@ const main = async () => {
     throw new Error(`Elevation API error: ${json?.status || "Unknown error"}`);
   }
 
-  const points = toElevationPoints(json.results || []);
+  const points = toElevationPoints(json.results || [], computedDistance);
   lineFeature.properties = {
     ...(lineFeature.properties || {}),
     elevationProfile: {
@@ -181,6 +184,11 @@ const main = async () => {
   console.log(
     `Saved ${points.length} elevation points to ${path.resolve(outputPath)}`
   );
+  console.log(
+    `Raw path distance ${Math.round(computedDistance)}m | Last sample distance ${Math.round(
+      totalDistance
+    )}m`
+  );
   console.log(
     `Distance ~${Math.round(totalDistance / 1000)} km | Elevation range ${Math.round(
       min

package/dist/index.cjs

@@ -1,6 +1,6 @@
-'use strict';var reactWrapper=require('@googlemaps/react-wrapper'),S=require('react'),jsxRuntime=require('react/jsx-runtime'),recharts=require('recharts');function _interopNamespace(e){if(e&&e.__esModule)return e;var n=Object.create(null);if(e){Object.keys(e).forEach(function(k){if(k!=='default'){var d=Object.getOwnPropertyDescriptor(e,k);Object.defineProperty(n,k,d.get?d:{enumerable:true,get:function(){return e[k]}});}})}n.default=e;return Object.freeze(n)}var S__namespace=/*#__PURE__*/_interopNamespace(S);var _=()=>typeof window>"u"?true:window.innerWidth>=window.innerHeight,L=()=>{let[e,r]=S.useState(_);return S.useEffect(()=>{let o=()=>r(_());return window.addEventListener("resize",o),()=>window.removeEventListener("resize",o)},[]),{isHorizontal:e,isVertical:!e}};var g={colors:{primary:"rgba(14, 165, 233, 1)",primaryMuted:"rgba(14, 165, 233, 0.7)",accent:"rgba(132, 204, 22, 1)",surface:"rgba(248, 250, 252, 1)"},marker:{outer:"rgba(132, 204, 22, 1)",inner:"rgba(248, 250, 252, 1)",startInner:"rgba(34, 197, 94, 1)",finishInner:"rgba(239, 68, 68, 1)"},dots:{mapActive:"rgba(132, 204, 22, 1)",chart:"rgba(132, 204, 22, 1)",chartActive:"rgba(132, 204, 22, 1)"},map:{strokeWeight:10,markerSize:50,markerLabelFontSize:20,markerLabelFontWeight:"bold",hoverMarkerScale:6},chart:{margin:{top:4,right:8,bottom:4,left:8},gridStroke:"rgba(255,255,255,0.08)",gridDasharray:"3 3",axisStroke:"rgba(226, 232, 240, 0.7)",cursorStroke:"rgba(226,232,240,0.4)",cursorStrokeWidth:1,yAxisWidth:60,lineStrokeWidth:1,dotRadius:3,dotOpacity:.9,activeDotRadius:3,referenceDotRadius:7,referenceLineOpacity:.5,gradientStartOpacity:.6,gradientEndOpacity:.1,xTickFontSize:12,xTickDy:12,xTickUnitFontSize:10,xTickUnitDx:2,yTickFontSize:12,yTickDy:4,yTickUnitFontSize:10,yTickUnitDx:2},tooltip:{background:"rgba(15,23,42,0.9)",textColor:"#e2e8f0",padding:"6px 8px",borderRadius:6},markerShape:{size:33,lift:20,text:{fontSize:12,fontWeight:300,letterSpacing:2,xOffset:15,lineHeight:12,startLiftPerWord:10}}};var U=S.createContext(g),Ie=e=>({colors:{...g.colors,...e?.colors??{}},marker:{...g.marker,...e?.marker??{}},dots:{...g.dots,...e?.dots??{}},map:{...g.map,...e?.map??{}},chart:{...g.chart,...e?.chart??{}},tooltip:{...g.tooltip,...e?.tooltip??{}},markerShape:{...g.markerShape,...e?.markerShape??{},text:{...g.markerShape.text,...e?.markerShape?.text??{}}}}),M=({theme:e,children:r})=>{let o=S.useMemo(()=>Ie(e),[e]);return jsxRuntime.jsx(U.Provider,{value:o,children:r})},u=()=>S.useContext(U);var B={};var He=({message:e="Loading map...",height:r="100dvh"})=>{let o=u(),t={height:r,background:o.colors.surface,color:o.colors.primary};return jsxRuntime.jsx("div",{className:B.loader,style:t,children:e})},Y=He;var V=e=>{let{x:r,y:o,payload:t}=e,n=u(),i=Math.round((t?.value??0)/1e3);return jsxRuntime.jsxs("text",{x:r,y:o,fill:n.chart.axisStroke,fontSize:n.chart.xTickFontSize,textAnchor:"middle",dy:n.chart.xTickDy,children:[jsxRuntime.jsx("tspan",{children:i}),jsxRuntime.jsx("tspan",{fontSize:n.chart.xTickUnitFontSize,dx:n.chart.xTickUnitDx,children:"km"})]})};var J=S.createContext(void 0),$=({children:e})=>{let[r,o]=S.useState({}),t=S.useCallback(a=>o(a),[]),n=S.useCallback(()=>o({}),[]),i=S.useMemo(()=>({hover:r,setHover:t,clearHover:n}),[r,t,n]);return jsxRuntime.jsx(J.Provider,{value:i,children:e})},P=()=>{let e=S.useContext(J);if(!e)throw new Error("useHover must be used within HoverProvider");return e};var K=e=>{let{cx:r,cy:o,fill:t}=e,n=u();return r===void 0||o===void 0?null:jsxRuntime.jsx("circle",{cx:r,cy:o,r:n.chart.dotRadius,fill:t,opacity:n.chart.dotOpacity})},Z=e=>{let r=u();return jsxRuntime.jsx(K,{...e,fill:r.dots.chart})},Q=e=>{let r=u();return jsxRuntime.jsx(K,{...e,fill:r.dots.mapActive})};var j=e=>{let{x:r,y:o,payload:t}=e,n=u(),i=Math.round(t?.value??0);return jsxRuntime.jsxs("text",{x:r,y:o,fill:n.chart.axisStroke,fontSize:n.chart.yTickFontSize,textAnchor:"end",dy:n.chart.yTickDy,children:[jsxRuntime.jsx("tspan",{children:i}),jsxRuntime.jsx("tspan",{fontSize:n.chart.yTickUnitFontSize,dx:n.chart.yTickUnitDx,children:"m"})]})};var Xe=300,ee=({active:e,payload:r,label:o,accent:t,primary:n,markers:i})=>{let{tooltip:a}=u();if(!e||!r?.length)return null;let s=r[0]?.payload,c=i.find(p=>Math.abs((p?.distance??-1)-(s?.distance??0))<=Xe),d=Math.trunc(o/1e3),l=Math.round(o%1e3);return jsxRuntime.jsxs("div",{style:{background:a.background,border:"none",color:a.textColor,padding:a.padding,borderRadius:a.borderRadius},children:[jsxRuntime.jsxs("div",{style:{fontWeight:600,color:n},children:[d," km ",l," m"]}),jsxRuntime.jsxs("div",{children:["Elevation: ",jsxRuntime.jsxs("strong",{children:[Math.round(s?.elevation??0)," m"]})]}),c?.name?jsxRuntime.jsx("div",{style:{color:t,fontWeight:600},children:c.name}):null]})};var te=`<svg stroke="currentColor" fill="#84CC16" stroke-width="2" viewBox="0 0 24 24" aria-hidden="true" height="200px" width="200px" xmlns="http://www.w3.org/2000/svg">
+'use strict';var reactWrapper=require('@googlemaps/react-wrapper'),T=require('react'),jsxRuntime=require('react/jsx-runtime'),recharts=require('recharts');function _interopNamespace(e){if(e&&e.__esModule)return e;var n=Object.create(null);if(e){Object.keys(e).forEach(function(k){if(k!=='default'){var d=Object.getOwnPropertyDescriptor(e,k);Object.defineProperty(n,k,d.get?d:{enumerable:true,get:function(){return e[k]}});}})}n.default=e;return Object.freeze(n)}var T__namespace=/*#__PURE__*/_interopNamespace(T);var J=()=>typeof window>"u"?true:window.innerWidth>=window.innerHeight,z=()=>{let[e,n]=T.useState(J);return T.useEffect(()=>{let o=()=>n(J());return window.addEventListener("resize",o),()=>window.removeEventListener("resize",o)},[]),{isHorizontal:e,isVertical:!e}};var S={colors:{primary:"rgba(14, 165, 233, 1)",primaryMuted:"rgba(14, 165, 233, 0.7)",accent:"rgba(132, 204, 22, 1)",surface:"rgba(248, 250, 252, 1)"},marker:{outer:"rgba(132, 204, 22, 1)",inner:"rgba(248, 250, 252, 1)",startInner:"rgba(34, 197, 94, 1)",finishInner:"rgba(239, 68, 68, 1)"},dots:{mapActive:"rgba(132, 204, 22, 1)",chart:"rgba(132, 204, 22, 1)",chartActive:"rgba(132, 204, 22, 1)"},map:{strokeWeight:10,markerSize:50,markerLabelFontSize:20,markerLabelFontWeight:"bold",hoverMarkerScale:6},chart:{margin:{top:4,right:8,bottom:4,left:8},gridStroke:"rgba(255,255,255,0.08)",gridDasharray:"3 3",axisStroke:"rgba(226, 232, 240, 0.7)",cursorStroke:"rgba(226,232,240,0.4)",cursorStrokeWidth:1,yAxisWidth:60,lineStrokeWidth:1,dotRadius:3,dotOpacity:.9,activeDotRadius:3,referenceDotRadius:7,referenceLineOpacity:.5,gradientStartOpacity:.6,gradientEndOpacity:.1,xTickFontSize:12,xTickDy:12,xTickUnitFontSize:10,xTickUnitDx:2,yTickFontSize:12,yTickDy:4,yTickUnitFontSize:10,yTickUnitDx:2},tooltip:{background:"rgba(15,23,42,0.9)",textColor:"#e2e8f0",padding:"6px 8px",borderRadius:6},markerShape:{size:33,lift:20,text:{fontSize:12,fontWeight:300,letterSpacing:2,xOffset:15,lineHeight:12,startLiftPerWord:10}}};var V=T.createContext(S),qe=e=>({colors:{...S.colors,...e?.colors??{}},marker:{...S.marker,...e?.marker??{}},dots:{...S.dots,...e?.dots??{}},map:{...S.map,...e?.map??{}},chart:{...S.chart,...e?.chart??{}},tooltip:{...S.tooltip,...e?.tooltip??{}},markerShape:{...S.markerShape,...e?.markerShape??{},text:{...S.markerShape.text,...e?.markerShape?.text??{}}}}),H=({theme:e,children:n})=>{let o=T.useMemo(()=>qe(e),[e]);return jsxRuntime.jsx(V.Provider,{value:o,children:n})},h=()=>T.useContext(V);var j={};var nt=({message:e="Loading map...",height:n="100dvh"})=>{let o=h(),t={height:n,background:o.colors.surface,color:o.colors.primary};return jsxRuntime.jsx("div",{className:j.loader,style:t,children:e})},K=nt;var ee=e=>{let{x:n,y:o,payload:t}=e,r=h(),i=Math.round((t?.value??0)/1e3);return jsxRuntime.jsxs("text",{x:n,y:o,fill:r.chart.axisStroke,fontSize:r.chart.xTickFontSize,textAnchor:"middle",dy:r.chart.xTickDy,children:[jsxRuntime.jsx("tspan",{children:i}),jsxRuntime.jsx("tspan",{fontSize:r.chart.xTickUnitFontSize,dx:r.chart.xTickUnitDx,children:"km"})]})};var ne=T.createContext(void 0),re=({children:e})=>{let[n,o]=T.useState({}),t=T.useCallback(s=>o(s),[]),r=T.useCallback(()=>o({}),[]),i=T.useMemo(()=>({hover:n,setHover:t,clearHover:r}),[n,t,r]);return jsxRuntime.jsx(ne.Provider,{value:i,children:e})},N=()=>{let e=T.useContext(ne);if(!e)throw new Error("useHover must be used within HoverProvider");return e};var oe=e=>{let{cx:n,cy:o,fill:t}=e,r=h();return n===void 0||o===void 0?null:jsxRuntime.jsx("circle",{cx:n,cy:o,r:r.chart.dotRadius,fill:t,opacity:r.chart.dotOpacity})},ie=e=>{let n=h();return jsxRuntime.jsx(oe,{...e,fill:n.dots.chart})},se=e=>{let n=h();return jsxRuntime.jsx(oe,{...e,fill:n.dots.mapActive})};var ce=e=>{let{x:n,y:o,payload:t}=e,r=h(),i=Math.round(t?.value??0);return jsxRuntime.jsxs("text",{x:n,y:o,fill:r.chart.axisStroke,fontSize:r.chart.yTickFontSize,textAnchor:"end",dy:r.chart.yTickDy,children:[jsxRuntime.jsx("tspan",{children:i}),jsxRuntime.jsx("tspan",{fontSize:r.chart.yTickUnitFontSize,dx:r.chart.yTickUnitDx,children:"m"})]})};var ue="./surface_asphalt-ZUAYWE5E.png";var le="./surface_compacted-JVQXEHW6.png";var me="./surface_concrete-TRX2AGHQ.png";var de="./surface_natural-AFI6LXRM.png";var pe="./surface_penetrated-4K24DL3E.png";var fe=30,A=16,U={asphalt:{file:ue,width:30,height:22},compacted:{file:le,width:200,height:16},concrete:{file:me},natural:{file:de,width:30,height:22},penetrated:{file:pe,width:30,height:22}},ge=({route:e,maxDistance:n,xAxisMap:o,offset:t})=>{let r=e.surface??[];if(!r.length)return null;let i=o?Object.values(o)[0]:void 0,s=i?.scale,a=i?.x??t?.left??0,c=i?.width??t?.width??0,m=i?.y??(t?.top??0)+(t?.height??0),l=A,d=m-l;return !s||c<=0?null:jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("defs",{children:Object.entries(U).map(([u,{file:v,width:p,height:x}])=>jsxRuntime.jsx("pattern",{id:`surface-${u}`,patternUnits:u==="compacted"?void 0:"userSpaceOnUse",width:p??fe,height:x??A,children:jsxRuntime.jsx("image",{href:v,x:"0",y:"0",width:p??fe,height:x??A})},u))}),jsxRuntime.jsxs("g",{children:[jsxRuntime.jsx("rect",{x:a,y:d,width:c,height:l,fill:"none"}),r.map((u,v)=>{let[p,x]=u.segment,y=Math.max(0,Math.min(p,n)),f=Math.max(0,Math.min(x,n)),w=Math.min(y,f),E=Math.max(y,f);if(E<=w)return null;let R=s(w),C=s(E),O=Math.min(R,C),D=Math.max(0,Math.abs(C-R));return D<=0?null:jsxRuntime.jsx("rect",{x:O,y:d,width:D,height:l,fill:`url(#surface-${u.type})`},`${u.type}-${v}`)})]})]})};var xt=300,vt=(e,n)=>e?.length?e.find(o=>{let[t,r]=o.segment,i=Math.min(t,r),s=Math.max(t,r);return n>=i&&n<=s})??null:null,yt=(e,n)=>e?.length?e.find(o=>{let[t,r]=o.segment,i=Math.min(t,r),s=Math.max(t,r);return n>=i&&n<=s})??null:null,wt=e=>e.charAt(0).toUpperCase()+e.slice(1),xe=e=>{let[n,o]=e,t=Math.min(n,o),r=Math.max(n,o),i=s=>{let c=(s/1e3).toFixed(1);return c.endsWith(".0")?c.slice(0,-2):c};return `(${i(t)} km - ${i(r)} km)`},ve=({active:e,payload:n,label:o,accent:t,primary:r,markers:i,surfaces:s,routes:a})=>{let{tooltip:c}=h();if(!e||!n?.length)return null;let m=n[0]?.payload,l=m?.distance??o,d=i.find(f=>Math.abs((f?.distance??-1)-(m?.distance??0))<=xt),u=vt(s,l),v=u?.type?U[u.type]:null,p=yt(a,l),x=Math.trunc(o/1e3),y=Math.round(o%1e3);return jsxRuntime.jsxs("div",{style:{background:c.background,border:"none",color:c.textColor,padding:"4px 6px",borderRadius:c.borderRadius,fontSize:13,lineHeight:1.2},children:[jsxRuntime.jsxs("div",{style:{fontWeight:600,color:r},children:[x," km ",y," m"]}),jsxRuntime.jsxs("div",{children:["Elevation: ",jsxRuntime.jsxs("strong",{children:[Math.round(m?.elevation??0)," m"]})]}),u?.type?jsxRuntime.jsxs("div",{style:{display:"flex",alignItems:"center",gap:4},children:[jsxRuntime.jsx("svg",{width:"20",height:"14","aria-hidden":"true",style:{display:"block"},children:v?jsxRuntime.jsx("image",{href:v.file,x:"0",y:"0",width:"20",height:"14",preserveAspectRatio:"xMidYMid slice"}):jsxRuntime.jsx("rect",{width:"20",height:"14",fill:c.textColor})}),jsxRuntime.jsx("span",{children:wt(u.type)}),jsxRuntime.jsx("span",{children:xe(u.segment)})]}):null,p?jsxRuntime.jsxs("div",{style:{display:"flex",alignItems:"center",gap:4},children:[jsxRuntime.jsx("svg",{width:"20",height:"14","aria-hidden":"true",style:{display:"block"},children:jsxRuntime.jsx("rect",{width:"20",height:"14",fill:p.color})}),jsxRuntime.jsx("span",{children:p.id}),jsxRuntime.jsx("span",{children:xe(p.segment)})]}):null,d?.name?jsxRuntime.jsx("div",{style:{color:t,fontWeight:600},children:d.name}):null]})};var ye=`<svg stroke="currentColor" fill="#84CC16" stroke-width="2" viewBox="0 0 24 24" aria-hidden="true" height="200px" width="200px" xmlns="http://www.w3.org/2000/svg">
   <path stroke-linecap="round" stroke-linejoin="round" d="M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z"></path>
   <path fill="white" stroke-linecap="round" stroke-linejoin="round" d="M15 11a3 3 0 11-6 0 3 3 0 016 0z"></path>
 </svg>
-`;var Je=(e,r,o)=>{let t=0;return e.replace(/fill="[^"]*"/g,n=>(t+=1,t===1?`fill="${r}"`:t===2?`fill="${o}"`:n))},b=(e,r)=>{let o=Je(te,e,r).trim();return `data:image/svg+xml,${encodeURIComponent(o).replace(/'/g,"%27").replace(/"/g,"%22")}`};var re=e=>{let{cx:r,cy:o,fill:t,name:n}=e,i=u(),a=i.markerShape,s=a.size,c=S.useMemo(()=>b(i.marker.outer,i.marker.inner),[i.marker.inner,i.marker.outer]);if(r===void 0||o===void 0)return null;let d=typeof n=="string"?n.split(/\s+/).map(l=>l.trim()).filter(Boolean):[];return jsxRuntime.jsxs("g",{children:[jsxRuntime.jsx(Q,{cx:r,cy:o}),jsxRuntime.jsx("image",{x:r-s/2,y:o-s/2-a.lift,width:s,height:s,href:c}),n?jsxRuntime.jsx(Ze,{words:d,cx:r,cy:o,fill:t}):null]})},Ze=({words:e,cx:r,cy:o,fill:t})=>{let i=u().markerShape.text;return jsxRuntime.jsx("text",{y:o-e.length*i.startLiftPerWord,fill:t||"#fff",fontSize:i.fontSize,fontWeight:i.fontWeight,letterSpacing:i.letterSpacing,style:{userSelect:"none"},children:e.map((a,s)=>jsxRuntime.jsx(Qe,{word:a,index:s,cx:r},a))})},Qe=({word:e,index:r,cx:o})=>{let n=u().markerShape.text,i=S.useId();return jsxRuntime.jsx("tspan",{x:o+n.xOffset,dy:r===0?0:n.lineHeight,children:e},i)};function oe(e){let[r,o]=S.useState(null),t=S.useMemo(()=>r!=null?e[r]:null,[r,e]),n=S.useCallback(()=>{o(null);},[]),i=S.useCallback(a=>{if(!e.length)return;let s=0,c=e.length-1;for(;s<c;){let l=Math.floor((s+c)/2);e[l].distance<a?s=l+1:c=l;}let d=s;if(s>0){let l=e[s-1],p=e[s];Math.abs(l.distance-a)<Math.abs(p.distance-a)&&(d=s-1);}o(d);},[e]);return {activeIndex:r,activePoint:t,triggerByXValue:i,clearActiveIndex:n}}var ie=e=>e.length?e[e.length-1].distance:0,ae=(e,r=2e3)=>{let o=[];for(let t=0;t<=e;t+=r)o.push(t);return o[o.length-1]<e&&o.push(e),o},se=e=>[...e.geoJson?.features?.find(n=>n?.geometry?.type==="LineString"&&n?.properties?.elevationProfile?.points)?.properties?.elevationProfile?.points||[]].sort((n,i)=>(n?.distance??0)-(i?.distance??0)),ce=e=>(e.geoJson?.features?.find(t=>t?.geometry?.type==="LineString"&&t?.geometry?.coordinates)).geometry.coordinates,ue=e=>{if(!e.length)return [0,0];let r=e.map(i=>i.elevation),o=Math.min(...r),t=Math.max(...r),n=Math.max(10,(t-o)*.05);return [Math.floor(o-n),Math.ceil(t+n)]},le=e=>{let[r,o]=e,t=(o-r)*1.2,n=Math.max(10,Math.round(t/6/10)*10||50),i=Math.floor((r-(t-(o-r))/2)/n)*n,a=Math.ceil((o+(t-(o-r))/2)/n)*n,s=[];for(let c=i;c<=a+n/2;c+=n)s.push(c);return [i,a,s]},de=(e,r)=>{if(!e?.length)return [];let t=(r?.features??[]).filter(i=>i?.geometry?.type==="Point"),n=[];return t.forEach(i=>{let a=i?.geometry?.coordinates;if(!Array.isArray(a)||a.length<2)return;let[s,c]=a;if(!Number.isFinite(c)||!Number.isFinite(s))return;let d=e.reduce((l,p)=>{let f=Math.pow(p.lat-c,2)+Math.pow(p.lng-s,2);return f<l.dist?{point:p,dist:f}:l},{point:null,dist:Number.POSITIVE_INFINITY});if(d.point){if(d.point.distance===0)return;n.push({distance:d.point.distance,elevation:d.point.elevation,name:i?.properties?.name});}}),n.sort((i,a)=>(i.distance??0)-(a.distance??0))},me=(e,r)=>{if(!e.length)return null;let o=null,t=Number.POSITIVE_INFINITY;return e.forEach(([n,i])=>{let a=(i-r.lat)**2+(n-r.lng)**2;a<t&&(t=a,o={lat:i,lng:n});}),o},pe=(e,r)=>{if(!e.length)return null;let o=null,t=Number.POSITIVE_INFINITY;return e.forEach(n=>{let i=(n.lat-r[0])**2+(n.lng-r[1])**2;i<t&&(t=i,o=n);}),o};var fe=(e,r,o=1e3)=>r&&Math.abs((r.distance??0)-(e.distance??0))<o;var A=({route:e})=>{let{hover:r,setHover:o}=P(),t=u(),n=S.useMemo(()=>se(e),[e]),i=S.useMemo(()=>de(n,e.geoJson),[n,e.geoJson]),a=ie(n),s=ae(a),[c,d]=ue(n),[l,p,f]=S.useMemo(()=>le([c,d]),[c,d]),{activeIndex:C,activePoint:y,triggerByXValue:x,clearActiveIndex:w}=oe(n);return S.useEffect(()=>{if(r.source==="chart"||!r.lat||!r.lng)return;let h=pe(n,[r.lat,r.lng]);h&&x(h.distance);},[r,n,x]),n.length?jsxRuntime.jsx(recharts.ResponsiveContainer,{width:"100%",height:"100%",style:{userSelect:"none"},children:jsxRuntime.jsxs(recharts.ComposedChart,{data:n,margin:t.chart.margin,onMouseMove:({activePayload:h})=>{C&&w();let E=h?.[0];if(!E)return;let{lat:k,lng:T}=E.payload;o({lat:k,lng:T,source:"chart"});},onMouseEnter:()=>w(),children:[jsxRuntime.jsx("defs",{children:jsxRuntime.jsxs("linearGradient",{id:"elevationGradient",x1:"0",y1:"0",x2:"0",y2:"1",children:[jsxRuntime.jsx("stop",{offset:"0%",stopColor:t.colors.primary,stopOpacity:t.chart.gradientStartOpacity}),jsxRuntime.jsx("stop",{offset:"100%",stopColor:t.colors.primaryMuted,stopOpacity:t.chart.gradientEndOpacity})]})}),jsxRuntime.jsx(recharts.CartesianGrid,{stroke:t.chart.gridStroke,strokeDasharray:t.chart.gridDasharray}),jsxRuntime.jsx(recharts.XAxis,{dataKey:"distance",type:"number",domain:[0,a],ticks:s,tick:jsxRuntime.jsx(V,{}),stroke:t.chart.axisStroke}),jsxRuntime.jsx(recharts.YAxis,{dataKey:"elevation",tick:jsxRuntime.jsx(j,{}),domain:[l,p],ticks:f,stroke:t.chart.axisStroke,width:t.chart.yAxisWidth}),jsxRuntime.jsx(recharts.Tooltip,{cursor:{stroke:t.chart.cursorStroke,strokeWidth:t.chart.cursorStrokeWidth},content:jsxRuntime.jsx(ee,{accent:t.colors.accent,primary:t.colors.primary,markers:i})}),jsxRuntime.jsx(recharts.Line,{type:"monotone",dataKey:"elevation",stroke:t.colors.primary,strokeWidth:t.chart.lineStrokeWidth,dot:h=>{let{cx:E,cy:k,index:T}=h;return !(T===C)||!y?jsxRuntime.jsx(jsxRuntime.Fragment,{}):jsxRuntime.jsx(Z,{cx:E,cy:k})},activeDot:{r:t.chart.activeDotRadius,fill:t.dots.chartActive,strokeWidth:0},fill:"url(#elevationGradient)",isAnimationActive:false}),i.length>0&&i.map((h,E)=>{let k=fe(i[E],i[E+1]);return jsxRuntime.jsx(recharts.ReferenceDot,{x:h.distance,y:h.elevation,r:t.chart.referenceDotRadius,shape:T=>jsxRuntime.jsx(re,{...T,name:k?void 0:h.name,fill:t.colors.accent})},`${h.distance}-${E}`)}),y&&jsxRuntime.jsx(recharts.ReferenceLine,{x:y.distance,opacity:t.chart.referenceLineOpacity})]})}):null};var ge={lat:48.9325937,lng:20.3452306},ve=13,ye=12;var Se=.2,we=.15;var H={};var be=({route:e,height:r,isHorizontal:o})=>{let t=u(),{hover:n,setHover:i}=P(),a=S.useRef(null),s=S.useRef(null),c=S.useRef(null),d=S.useMemo(()=>ce(e),[e]),l=S.useMemo(()=>({default:b(t.marker.outer,t.marker.inner),start:b(t.marker.outer,t.marker.startInner),finish:b(t.marker.outer,t.marker.finishInner)}),[t.marker]);return S.useEffect(()=>{if(!a.current||!window.google?.maps)return;let p=o&&(e.zoomHorizontal||ve)||e.zoomVertical||ye,f=new window.google.maps.Map(a.current,{center:e.center||ge,zoom:p,mapTypeId:window.google.maps.MapTypeId.SATELLITE,streetViewControl:false});c.current=f,f.data.setStyle(y=>{let x=y.getProperty("name"),w=y.getProperty("first"),h=y.getProperty("last");return {strokeColor:t.colors.primaryMuted,strokeWeight:t.map.strokeWeight,icon:{url:w?l.start:h?l.finish:l.default,scaledSize:new window.google.maps.Size(t.map.markerSize,t.map.markerSize),optimized:false,zIndex:w||h?100:10,collisionBehavior:window.google?.maps?.CollisionBehavior?.REQUIRED_AND_HIDES_OPTIONAL},label:{className:H.markerLabel,fontSize:`${t.map.markerLabelFontSize}px`,fontWeight:t.map.markerLabelFontWeight,color:t.colors.accent,text:x}}}),f.data.addGeoJson(e.geoJson);let C=f.addListener("mousemove",y=>{let x=y.latLng;if(!x)return;let w=me(d,{lat:x.lat(),lng:x.lng()});w&&i({lat:w.lat,lng:w.lng,source:"map"});});return ()=>{C.remove(),f.data.forEach(y=>{f.data.remove(y);}),c.current=null;}},[e,o,t,d,i,l]),S.useEffect(()=>{if(!a.current||!window.google?.maps)return;let p=c.current;if(!p)return;if(!n.lat||!n.lng){s.current&&(s.current.setMap(null),s.current=null);return}let f={path:window.google.maps.SymbolPath.CIRCLE,scale:t.map.hoverMarkerScale,fillColor:t.dots.mapActive,fillOpacity:1,strokeWeight:0};s.current?s.current.setIcon(f):s.current=new window.google.maps.Marker({map:p,icon:f}),s.current.setPosition({lat:n.lat,lng:n.lng}),s.current.setMap(p);},[n,t]),jsxRuntime.jsx("div",{ref:a,className:H.mapCanvas,style:{height:r}})};var z={};var vt={apiKey:"Oops! Cannot display the map: Google Maps API key missing",[reactWrapper.Status.FAILURE]:"Unable to load Google Maps API. Check your API key or network.",[reactWrapper.Status.LOADING]:void 0,[reactWrapper.Status.SUCCESS]:void 0},Re=({type:e,height:r})=>jsxRuntime.jsx("div",{style:{height:r},children:jsxRuntime.jsx(Y,{message:vt[e],height:r})}),yt=(e,r)=>jsxRuntime.jsx(Re,{type:e,height:r}),ke=({apiKey:e,route:r,height:o="100dvh",className:t,style:n,theme:i=g})=>{let{isHorizontal:a}=L();if(!e)return jsxRuntime.jsx(M,{theme:i,children:jsxRuntime.jsx(Re,{type:"apiKey",height:o})});let s={height:o,width:"100%",...n};return jsxRuntime.jsx(M,{theme:i,children:jsxRuntime.jsx($,{children:jsxRuntime.jsxs("div",{className:t,style:s,children:[jsxRuntime.jsx(reactWrapper.Wrapper,{apiKey:e,render:c=>yt(c,o),children:jsxRuntime.jsx(be,{route:r,height:o,isHorizontal:a})}),jsxRuntime.jsx("div",{className:z.chartLayer,children:jsxRuntime.jsx("div",{className:z.chartBody,children:jsxRuntime.jsx(A,{route:r})})})]})})})};function W(){let[e,r]=S__namespace.useState({width:null,height:null}),o=S__namespace.useRef(null);return [S__namespace.useCallback(n=>{if(o.current&&(o.current.disconnect(),o.current=null),n?.nodeType===Node.ELEMENT_NODE){let i=new ResizeObserver(([a])=>{if(a&&a.borderBoxSize){let{inlineSize:s,blockSize:c}=a.borderBoxSize[0];r({width:s,height:c});}});i.observe(n),o.current=i;}},[]),e]}var Te=100,wt=()=>{let{isVertical:e}=L(),[r,{height:o}]=W(),[t,{height:n}]=W(),i=e?Se:we,s=(typeof window<"u"?window.innerHeight:Te/i)*i||Te,c=o||s,d=`calc(100dvh - ${c}px)`;return {refHeader:r,refMapContainer:t,targetHeaderFraction:i,effectiveHeaderHeight:c,mapHeight:n||d}};exports.RouteMap=ke;exports.ThemeProvider=M;exports.theme=g;exports.useMapHeader=wt;exports.useTheme=u;//# sourceMappingURL=index.cjs.map
+`;var bt=(e,n,o)=>{let t=0;return e.replace(/fill="[^"]*"/g,r=>(t+=1,t===1?`fill="${n}"`:t===2?`fill="${o}"`:r))},P=(e,n)=>{let o=bt(ye,e,n).trim();return `data:image/svg+xml,${encodeURIComponent(o).replace(/'/g,"%27").replace(/"/g,"%22")}`};var we=e=>{let{cx:n,cy:o,fill:t,name:r}=e,i=h(),s=i.markerShape,a=s.size,c=T.useMemo(()=>P(i.marker.outer,i.marker.inner),[i.marker.inner,i.marker.outer]);if(n===void 0||o===void 0)return null;let m=typeof r=="string"?r.split(/\s+/).map(l=>l.trim()).filter(Boolean):[];return jsxRuntime.jsxs("g",{children:[jsxRuntime.jsx(se,{cx:n,cy:o}),jsxRuntime.jsx("image",{x:n-a/2,y:o-a/2-s.lift,width:a,height:a,href:c}),r?jsxRuntime.jsx(Tt,{words:m,cx:n,cy:o,fill:t}):null]})},Tt=({words:e,cx:n,cy:o,fill:t})=>{let i=h().markerShape.text;return jsxRuntime.jsx("text",{y:o-e.length*i.startLiftPerWord,fill:t||"#fff",fontSize:i.fontSize,fontWeight:i.fontWeight,letterSpacing:i.letterSpacing,style:{userSelect:"none"},children:e.map((s,a)=>jsxRuntime.jsx(kt,{word:s,index:a,cx:n},s))})},kt=({word:e,index:n,cx:o})=>{let r=h().markerShape.text,i=T.useId();return jsxRuntime.jsx("tspan",{x:o+r.xOffset,dy:n===0?0:r.lineHeight,children:e},i)};var be=({route:e,maxDistance:n,belowHeight:o=0,xAxisMap:t,offset:r})=>{let i=e.routes??[];if(!i.length)return null;let s=t?Object.values(t)[0]:void 0,a=s?.scale,c=s?.x??r?.left??0,m=s?.width??r?.width??0,l=s?.y??(r?.top??0)+(r?.height??0),d=16,u=l-o-d;return !a||m<=0?null:jsxRuntime.jsxs("g",{children:[jsxRuntime.jsx("rect",{x:c,y:u,width:m,height:d,fill:"none"}),i.map((v,p)=>{let[x,y]=v.segment,f=Math.max(0,Math.min(x,n)),w=Math.max(0,Math.min(y,n)),E=Math.min(f,w),R=Math.max(f,w);if(R<=E)return null;let C=a(E),O=a(R),D=Math.min(C,O),F=Math.max(0,Math.abs(O-C));return F<=0?null:jsxRuntime.jsxs("g",{children:[jsxRuntime.jsx("rect",{x:D,y:u,width:F,height:d,fill:v.color}),jsxRuntime.jsx("text",{x:D+F/2,y:u+d/2,fill:"#000000",fontSize:10,fontWeight:600,textAnchor:"middle",dominantBaseline:"middle",children:v.id})]},`${v.id}-${p}`)})]})};function Re(e){let[n,o]=T.useState(null),t=T.useMemo(()=>n!=null?e[n]:null,[n,e]),r=T.useCallback(()=>{o(null);},[]),i=T.useCallback(s=>{if(!e.length)return;let a=0,c=e.length-1;for(;a<c;){let l=Math.floor((a+c)/2);e[l].distance<s?a=l+1:c=l;}let m=a;if(a>0){let l=e[a-1],d=e[a];Math.abs(l.distance-s)<Math.abs(d.distance-s)&&(m=a-1);}o(m);},[e]);return {activeIndex:n,activePoint:t,triggerByXValue:i,clearActiveIndex:r}}var Te=e=>e.length?e[e.length-1].distance:0,ke=(e,n=2e3)=>{let o=[];for(let t=0;t<=e;t+=n)o.push(t);return o[o.length-1]<e&&o.push(e),o},Ce=e=>[...e.geoJson?.features?.find(r=>r?.geometry?.type==="LineString"&&r?.properties?.elevationProfile?.points)?.properties?.elevationProfile?.points||[]].sort((r,i)=>(r?.distance??0)-(i?.distance??0)),Me=e=>(e.geoJson?.features?.find(t=>t?.geometry?.type==="LineString"&&t?.geometry?.coordinates)).geometry.coordinates,Pe=e=>{if(!e.length)return [0,0];let n=e.map(i=>i.elevation),o=Math.min(...n),t=Math.max(...n),r=Math.max(10,(t-o)*.05);return [Math.floor(o-r),Math.ceil(t+r)]},Le=(e,n=false)=>{let[o,t]=e,r=(t-o)*1.2,i=Math.max(10,Math.round(r/6/10)*10||50),s=n?-20:0,a=Math.floor((o-(r-(t-o))/2)/i)*i+s,c=Math.ceil((t+(r-(t-o))/2)/i)*i+s,m=[];for(let l=a;l<=c+i/2;l+=i)m.push(l);return [a,c,m]},De=(e,n)=>{if(!e?.length)return [];let t=(n?.features??[]).filter(i=>i?.geometry?.type==="Point"),r=[];return t.forEach(i=>{let s=i?.geometry?.coordinates;if(!Array.isArray(s)||s.length<2)return;let[a,c]=s;if(!Number.isFinite(c)||!Number.isFinite(a))return;let m=e.reduce((l,d)=>{let u=Math.pow(d.lat-c,2)+Math.pow(d.lng-a,2);return u<l.dist?{point:d,dist:u}:l},{point:null,dist:Number.POSITIVE_INFINITY});if(m.point){if(m.point.distance===0)return;r.push({distance:m.point.distance,elevation:m.point.elevation,name:i?.properties?.name});}}),r.sort((i,s)=>(i.distance??0)-(s.distance??0))},Ie=(e,n)=>{if(!e.length)return null;let o=null,t=Number.POSITIVE_INFINITY;return e.forEach(([r,i])=>{let s=(i-n.lat)**2+(r-n.lng)**2;s<t&&(t=s,o={lat:i,lng:r});}),o},Ae=(e,n)=>{if(!e.length)return null;let o=null,t=Number.POSITIVE_INFINITY;return e.forEach(r=>{let i=(r.lat-n[0])**2+(r.lng-n[1])**2;i<t&&(t=i,o=r);}),o};var Oe=(e,n,o=1e3)=>n&&Math.abs((n.distance??0)-(e.distance??0))<o;var G=({route:e})=>{let{hover:n,setHover:o}=N(),t=h(),r=T.useMemo(()=>Ce(e),[e]),i=T.useMemo(()=>De(r,e.geoJson),[r,e.geoJson]),s=Te(r),a=ke(s),[c,m]=Pe(r),[l,d,u]=T.useMemo(()=>Le([c,m],!!e.surface?.length),[c,m,e.surface?.length]),{activeIndex:v,activePoint:p,triggerByXValue:x,clearActiveIndex:y}=Re(r);return T.useEffect(()=>{if(n.source==="chart"||!n.lat||!n.lng)return;let f=Ae(r,[n.lat,n.lng]);f&&x(f.distance);},[n,r,x]),r.length?jsxRuntime.jsx(recharts.ResponsiveContainer,{width:"100%",height:"100%",style:{userSelect:"none"},children:jsxRuntime.jsxs(recharts.ComposedChart,{data:r,margin:t.chart.margin,onMouseMove:({activePayload:f})=>{v&&y();let w=f?.[0];if(!w)return;let{lat:E,lng:R}=w.payload;o({lat:E,lng:R,source:"chart"});},onMouseEnter:()=>y(),children:[jsxRuntime.jsx("defs",{children:jsxRuntime.jsxs("linearGradient",{id:"elevationGradient",x1:"0",y1:"0",x2:"0",y2:"1",children:[jsxRuntime.jsx("stop",{offset:"0%",stopColor:t.colors.primary,stopOpacity:t.chart.gradientStartOpacity}),jsxRuntime.jsx("stop",{offset:"100%",stopColor:t.colors.primaryMuted,stopOpacity:t.chart.gradientEndOpacity})]})}),jsxRuntime.jsx(recharts.CartesianGrid,{stroke:t.chart.gridStroke,strokeDasharray:t.chart.gridDasharray}),jsxRuntime.jsx(recharts.Customized,{component:jsxRuntime.jsx(be,{route:e,maxDistance:s,belowHeight:A})}),jsxRuntime.jsx(recharts.Customized,{component:jsxRuntime.jsx(ge,{route:e,maxDistance:s})}),jsxRuntime.jsx(recharts.XAxis,{dataKey:"distance",type:"number",domain:[0,s],ticks:a,tick:jsxRuntime.jsx(ee,{}),stroke:t.chart.axisStroke}),jsxRuntime.jsx(recharts.YAxis,{dataKey:"elevation",tick:jsxRuntime.jsx(ce,{}),domain:[l,d],ticks:u,stroke:t.chart.axisStroke,width:t.chart.yAxisWidth}),jsxRuntime.jsx(recharts.Tooltip,{cursor:{stroke:t.chart.cursorStroke,strokeWidth:t.chart.cursorStrokeWidth},content:jsxRuntime.jsx(ve,{accent:t.colors.accent,primary:t.colors.primary,markers:i,surfaces:e.surface,routes:e.routes})}),jsxRuntime.jsx(recharts.Line,{type:"monotone",dataKey:"elevation",stroke:t.colors.primary,strokeWidth:t.chart.lineStrokeWidth,dot:f=>{let{cx:w,cy:E,index:R}=f;return !(R===v)||!p?jsxRuntime.jsx(jsxRuntime.Fragment,{}):jsxRuntime.jsx(ie,{cx:w,cy:E})},activeDot:{r:t.chart.activeDotRadius,fill:t.dots.chartActive,strokeWidth:0},fill:"url(#elevationGradient)",isAnimationActive:false}),i.length>0&&i.map((f,w)=>{let E=Oe(i[w],i[w+1]);return jsxRuntime.jsx(recharts.ReferenceDot,{x:f.distance,y:f.elevation,r:t.chart.referenceDotRadius,shape:R=>jsxRuntime.jsx(we,{...R,name:E?void 0:f.name,fill:t.colors.accent})},`${f.distance}-${w}`)}),p&&jsxRuntime.jsx(recharts.ReferenceLine,{x:p.distance,opacity:t.chart.referenceLineOpacity})]})}):null};var Ne={lat:48.9325937,lng:20.3452306},Fe=13,Xe=12;var Ue=.2,We=.15;var Q={};var Qe=({route:e,height:n,isHorizontal:o})=>{let t=h(),{hover:r,setHover:i}=N(),s=T.useRef(null),a=T.useRef(null),c=T.useRef(null),m=T.useMemo(()=>Me(e),[e]),l=T.useMemo(()=>({default:P(t.marker.outer,t.marker.inner),start:P(t.marker.outer,t.marker.startInner),finish:P(t.marker.outer,t.marker.finishInner)}),[t.marker]);return T.useEffect(()=>{if(!s.current||!window.google?.maps)return;let d=o&&(e.zoomHorizontal||Fe)||e.zoomVertical||Xe,u=new window.google.maps.Map(s.current,{center:e.center||Ne,zoom:d,mapTypeId:window.google.maps.MapTypeId.SATELLITE,streetViewControl:false});c.current=u,u.data.setStyle(p=>{let x=p.getProperty("name"),y=p.getProperty("first"),f=p.getProperty("last");return {strokeColor:t.colors.primaryMuted,strokeWeight:t.map.strokeWeight,icon:{url:y?l.start:f?l.finish:l.default,scaledSize:new window.google.maps.Size(t.map.markerSize,t.map.markerSize),optimized:false,zIndex:y||f?100:10,collisionBehavior:window.google?.maps?.CollisionBehavior?.REQUIRED_AND_HIDES_OPTIONAL},label:{className:Q.markerLabel,fontSize:`${t.map.markerLabelFontSize}px`,fontWeight:t.map.markerLabelFontWeight,color:t.colors.accent,text:x}}}),u.data.addGeoJson(e.geoJson);let v=u.addListener("mousemove",p=>{let x=p.latLng;if(!x)return;let y=Ie(m,{lat:x.lat(),lng:x.lng()});y&&i({lat:y.lat,lng:y.lng,source:"map"});});return ()=>{v.remove(),u.data.forEach(p=>{u.data.remove(p);}),c.current=null;}},[e,o,t,m,i,l]),T.useEffect(()=>{if(!s.current||!window.google?.maps)return;let d=c.current;if(!d)return;if(!r.lat||!r.lng){a.current&&(a.current.setMap(null),a.current=null);return}let u={path:window.google.maps.SymbolPath.CIRCLE,scale:t.map.hoverMarkerScale,fillColor:t.dots.mapActive,fillOpacity:1,strokeWeight:0};a.current?a.current.setIcon(u):a.current=new window.google.maps.Marker({map:d,icon:u}),a.current.setPosition({lat:r.lat,lng:r.lng}),a.current.setMap(d);},[r,t]),jsxRuntime.jsx("div",{ref:s,className:Q.mapCanvas,style:{height:n}})};var B={};var Bt={apiKey:"Oops! Cannot display the map: Google Maps API key missing",[reactWrapper.Status.FAILURE]:"Unable to load Google Maps API. Check your API key or network.",[reactWrapper.Status.LOADING]:void 0,[reactWrapper.Status.SUCCESS]:void 0},Ye=({type:e,height:n})=>jsxRuntime.jsx("div",{style:{height:n},children:jsxRuntime.jsx(K,{message:Bt[e],height:n})}),Zt=(e,n)=>jsxRuntime.jsx(Ye,{type:e,height:n}),Be=({apiKey:e,route:n,height:o="100dvh",className:t,style:r,theme:i=S})=>{let{isHorizontal:s}=z();if(!e)return jsxRuntime.jsx(H,{theme:i,children:jsxRuntime.jsx(Ye,{type:"apiKey",height:o})});let a={height:o,width:"100%",...r};return jsxRuntime.jsx(H,{theme:i,children:jsxRuntime.jsx(re,{children:jsxRuntime.jsxs("div",{className:t,style:a,children:[jsxRuntime.jsx(reactWrapper.Wrapper,{apiKey:e,render:c=>Zt(c,o),children:jsxRuntime.jsx(Qe,{route:n,height:o,isHorizontal:s})}),jsxRuntime.jsx("div",{className:B.chartLayer,children:jsxRuntime.jsx("div",{className:B.chartBody,children:jsxRuntime.jsx(G,{route:n})})})]})})})};function $(){let[e,n]=T__namespace.useState({width:null,height:null}),o=T__namespace.useRef(null);return [T__namespace.useCallback(r=>{if(o.current&&(o.current.disconnect(),o.current=null),r?.nodeType===Node.ELEMENT_NODE){let i=new ResizeObserver(([s])=>{if(s&&s.borderBoxSize){let{inlineSize:a,blockSize:c}=s.borderBoxSize[0];n({width:a,height:c});}});i.observe(r),o.current=i;}},[]),e]}var Ze=100,Jt=()=>{let{isVertical:e}=z(),[n,{height:o}]=$(),[t,{height:r}]=$(),i=e?Ue:We,a=(typeof window<"u"?window.innerHeight:Ze/i)*i||Ze,c=o||a,m=`calc(100dvh - ${c}px)`;return {refHeader:n,refMapContainer:t,targetHeaderFraction:i,effectiveHeaderHeight:c,mapHeight:r||m}};exports.RouteMap=Be;exports.ThemeProvider=H;exports.theme=S;exports.useMapHeader=Jt;exports.useTheme=h;//# sourceMappingURL=index.cjs.map
 //# sourceMappingURL=index.cjs.map