@macrostrat/map-interface 1.2.4 → 1.3.1

package/CHANGELOG.md

@@ -4,6 +4,20 @@ All notable changes to this project will be documented in this file. The format
 is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this
 project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [1.3.1] - 2025-06-25
+
+Small improvements to types and styles
+
+## [1.3.0] - 2025-04-09
+
+- Improve types for latitude and longitude
+- Add `useBasicMapStyle` hook and supporting `getBasicMapStyle` function
+- Improve initialization logic to avoid rendering before the map is ready. We
+  fall back to timeouts because Mapbox GL events aren't called consistently
+- Add a `standalone` option for map rendering
+- Add internal support for `overlayStyles`, which are added after the basic map
+  style is loaded, and `transformStyle`, which can adjust the style after load
+
 ## [1.2.4] - 2025-03-08
 
 Fix some small styling errors

package/dist/cjs/index.js

@@ -1,13 +1,13 @@
-var $fce5fc950d1fe35b$exports = require("./context-panel.3061a63e.js");
-var $2bc7c1e4e7da7fdf$exports = require("./location-panel.e33becf0.js");
-var $9acbb47bf7cb7660$exports = require("./dev.e6613cda.js");
-var $c3311f59335df34d$exports = require("./container.d2e83c46.js");
-var $493deb9ab6b848e3$exports = require("./map-view.61e50e18.js");
-var $f333fe6f49373ca9$exports = require("./controls.5fcf8a91.js");
-var $2611a7b4364593e5$exports = require("./helpers.0f72ddaf.js");
-var $3490fc4f4bda12f7$exports = require("./utils.26f02633.js");
-var $860d9939f7032c69$exports = require("./location-info.92e70042.js");
-var $750d69d73bfbdc9a$exports = require("./expansion-panel.ef757efe.js");
+var $fce5fc950d1fe35b$exports = require("./map-interface.0e252a74.js");
+var $2bc7c1e4e7da7fdf$exports = require("./map-interface.3934d6d6.js");
+var $9acbb47bf7cb7660$exports = require("./map-interface.5cea0ff4.js");
+var $c3311f59335df34d$exports = require("./map-interface.bda26b27.js");
+var $493deb9ab6b848e3$exports = require("./map-interface.e7194f92.js");
+var $f333fe6f49373ca9$exports = require("./map-interface.99a048dc.js");
+var $2611a7b4364593e5$exports = require("./map-interface.5813e876.js");
+var $3490fc4f4bda12f7$exports = require("./map-interface.ffb109ef.js");
+var $860d9939f7032c69$exports = require("./map-interface.64823b7c.js");
+var $750d69d73bfbdc9a$exports = require("./map-interface.354aaa39.js");
 
 
 function $parcel$exportWildcard(dest, source) {

package/dist/cjs/{context-panel.3061a63e.js → map-interface.0e252a74.js}

@@ -1,5 +1,5 @@
-require("./main.module.e872989b.css");
-var $7a1b0f72a2e7f87d$exports = require("./main.module.e958948e.js");
+require("./map-interface.ae4c52a6.css");
+var $7a1b0f72a2e7f87d$exports = require("./map-interface.70458f75.js");
 var $gcA2U$blueprintjscore = require("@blueprintjs/core");
 var $gcA2U$macrostrathyper = require("@macrostrat/hyper");
 var $gcA2U$macrostratmapboxreact = require("@macrostrat/mapbox-react");
@@ -85,4 +85,4 @@ function $fce5fc950d1fe35b$export$a8cc0062d02a3841({ className: className, child
 }
 
 
-//# sourceMappingURL=context-panel.3061a63e.js.map
+//# sourceMappingURL=map-interface.0e252a74.js.map

package/dist/cjs/map-interface.0e252a74.js.map

@@ -0,0 +1 @@
+{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAOA,MAAM,0BAAI,CAAA,GAAA,gDAAI,EAAE,MAAM,CAAC,CAAA,GAAA,mDAAK;AAE5B,MAAM,uCAAiB,wBAAE,CAAA,GAAA,8BAAM,GAAG;IAAE,MAAM;AAAG;AAEtC,SAAS,0CAAc,aAC5B,YAAY,gBACZ,OAAO,UACP,SAAS,cACT,QAAQ,YACR,OAAO,eACP,KAAK,EACN;IACC,OAAO,wBAAE,CAAA,GAAA,6BAAK,GAAG;QACf,WAAW;QACX,MAAO,YAAY,uCAAiB;eACpC;QACA,SAAS;iBACT;QACA,QAAQ,UAAU,CAAC;eACnB;IACF;AACF;AAEO,SAAS,0CAAiB,KAAU;IACzC,MAAM,YAAY,CAAA,GAAA,yCAAW,EAAE,CAAC,IAAM,EAAE,SAAS;IACjD,OAAO,wBAAE,2CAAe;QAAE,GAAG,KAAK;mBAAE;IAAU;AAChD;AAgBO,SAAS,0CAAe,aAC7B,SAAS,YACT,QAAQ,iBACR,gBAAgB,aAChB,QAAQ,qBACR,gBAAgB,oBAChB,eAAe,cACf,MAAM,SACN,KAAK,SACL,QAAQ,CAAC,GACW;IACpB,IAAI,gBAAkC;IACtC,IAAI,gBAAgB,MAClB,gBAAgB,wBAAE,qBAAqB;IAGzC,IAAI,iBAAmC;IACvC,IAAI,SAAS,QAAQ,kBAAkB;QACrC,IAAI,OAAO,UAAU,UACnB,iBAAiB,wBAAE,CAAA,GAAA,2BAAG,GAAG;YAAE,SAAS;YAAM,WAAW;QAAK,GAAG;aAE7D,iBAAiB;;IAIrB,IAAI,kBAAkB,MACpB,iBAAiB,wBAAE;QAAC;QAAgB,wBAAE,CAAA,GAAA,oCAAK;KAAG;IAGhD,OAAO,wBAAE,wBAAwB;mBAAE;QAAW,OAAO;mBAAE;QAAM;IAAE,GAAG;QAChE,wBAAE,qBAAqB;YACrB,wBACE,CAAA,GAAA,6BAAK,GACL;gBACE,WAAW;gBACX,OAAO;4BAAE;oBAAQ,GAAG,KAAK;gBAAC;YAC5B,GACA;gBAAC;gBAAgB;gBAAU;aAAc;SAE5C;QACD,wBAAE,EAAE,CAAC,iBAAiB,MACpB,CAAA,GAAA,2BAAG,GACH;YAAE,WAAW;QAAgB,GAC7B;KAEH;AACH","sources":["packages/map-interface/src/context-panel/index.ts"],"sourcesContent":["import { Navbar, Button, Spinner, Card, Text } from \"@blueprintjs/core\";\nimport hyper from \"@macrostrat/hyper\";\nimport styles from \"./main.module.sass\";\nimport { useMapStatus } from \"@macrostrat/mapbox-react\";\nimport { Spacer } from \"@macrostrat/ui-components\";\nimport type { ReactNode } from \"react\";\n\nconst h = hyper.styled(styles);\n\nconst spinnerElement = h(Spinner, { size: 16 });\n\nexport function LoadingButton({\n  isLoading = false,\n  onClick,\n  active = false,\n  large = true,\n  icon = \"menu\",\n  style,\n}) {\n  return h(Button, {\n    className: \"loading-button\",\n    icon: (isLoading ? spinnerElement : icon) as any,\n    large,\n    minimal: true,\n    onClick,\n    active: active && !isLoading,\n    style,\n  });\n}\n\nexport function MapLoadingButton(props: any) {\n  const isLoading = useMapStatus((s) => s.isLoading);\n  return h(LoadingButton, { ...props, isLoading });\n}\n\ntype AnyChildren = ReactNode;\n\nexport interface FloatingNavbarProps {\n  className?: string;\n  children?: AnyChildren;\n  headerElement?: AnyChildren;\n  title?: AnyChildren;\n  statusElement?: AnyChildren;\n  rightElement?: AnyChildren;\n  height?: number | string;\n  width?: number | string;\n  style?: object;\n}\n\nexport function FloatingNavbar({\n  className,\n  children,\n  headerElement = null,\n  title = null,\n  statusElement = null,\n  rightElement = null,\n  height,\n  width,\n  style = {},\n}: FloatingNavbarProps) {\n  let _rightElement: ReactNode | null = null;\n  if (rightElement != null) {\n    _rightElement = h(\"div.right-element\", rightElement);\n  }\n\n  let _headerElement: ReactNode | null = headerElement;\n  if (title != null && _headerElement == null) {\n    if (typeof title === \"string\") {\n      _headerElement = h(Text, { tagName: \"h2\", ellipsize: true }, title);\n    } else {\n      _headerElement = title;\n    }\n  }\n\n  if (_headerElement != null) {\n    _headerElement = h([_headerElement, h(Spacer)]);\n  }\n\n  return h(\"div.searchbar-holder\", { className, style: { width } }, [\n    h(\"div.navbar-holder\", [\n      h(\n        Navbar,\n        {\n          className: \"searchbar navbar panel\",\n          style: { height, ...style },\n        },\n        [_headerElement, children, _rightElement],\n      ),\n    ]),\n    h.if(statusElement != null)(\n      Card,\n      { className: \"status-tongue\" },\n      statusElement,\n    ),\n  ]);\n}\n"],"names":[],"version":3,"file":"map-interface.0e252a74.js.map"}

package/dist/cjs/{tile-extent.06a4b2ed.js → map-interface.175c4635.js}

@@ -48,4 +48,4 @@ function $abbe8d0af34cbbed$export$86c09739b12f23cd({ tile: tile, color: color =
 }
 
 
-//# sourceMappingURL=tile-extent.06a4b2ed.js.map
+//# sourceMappingURL=map-interface.175c4635.js.map

package/dist/cjs/{tile-extent.06a4b2ed.js.map → map-interface.175c4635.js.map}

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;AAMO,SAAS,0CAAgB,QAC9B,IAAI,SACJ,QAAQ,OAIT;IACC,MAAM,gBAAgB,CAAA,GAAA,wBAAU,EAC9B,CAAC,KAAK;QACJ,MAAM,QAAQ,IAAI,QAAQ;QAC1B,IAAI,MAAM,MAAM,IAAI,MAAM;QAC1B,MAAM,MAAM,GAAG,MAAM,MAAM,CAAC,MAAM,CAAC,CAAC,IAAM,EAAE,EAAE,IAAI;QAClD,IAAI,OAAO,MACT,OAAO,IAAI,QAAQ,CAAC;QAEtB,MAAM,KAAE,CAAC,KAAE,CAAC,KAAE,CAAC,EAAE,GAAG;QACpB,MAAM,SAAS,CAAA,GAAA,mCAAY,EAAE;YAAC;YAAG;YAAG;SAAE;QACtC,MAAM,SAAS;YACb,MAAM;YACN,MAAM;QACR;QACA,MAAM,QAAQ;YACZ,IAAI;YACJ,MAAM;YACN,QAAQ;YACR,OAAO;gBACL,cAAc;gBACd,cAAc;YAChB;QACF;QACA,MAAM,OAAO,CAAC,cAAc,GAAG;QAC/B,MAAM,MAAM,CAAC,IAAI,CAAC;QAClB,IAAI,QAAQ,CAAC;IACf,GACA;QAAC;KAAM;IAET,MAAM,MAAM,CAAA,GAAA,sCAAQ;IACpB,CAAA,GAAA,mDAAqB,EAAE,KAAK,MAAM;IAClC,OAAO;AACT","sources":["packages/map-interface/src/dev/tile-extent.ts"],"sourcesContent":["import { useMapConditionalStyle, useMapRef } from \"@macrostrat/mapbox-react\";\nimport { tileToGeoJSON } from \"@mapbox/tilebelt\";\nimport { useCallback } from \"react\";\n\ntype TileIndex = { x: number; y: number; z: number };\n\nexport function TileExtentLayer({\n  tile,\n  color = \"red\",\n}: {\n  tile: TileIndex | null;\n  color?: string;\n}) {\n  const styleCallback = useCallback(\n    (map, val: TileIndex) => {\n      const style = map.getStyle();\n      if (style.layers == null) return;\n      style.layers = style.layers.filter((l) => l.id != \"tile-extent\");\n      if (val == null) {\n        return map.setStyle(style);\n      }\n      const { x, y, z } = val;\n      const extent = tileToGeoJSON([x, y, z]);\n      const source = {\n        type: \"geojson\",\n        data: extent,\n      };\n      const layer = {\n        id: \"tile-extent\",\n        type: \"line\",\n        source: \"tile-extent\",\n        paint: {\n          \"line-color\": color,\n          \"line-width\": 2,\n        },\n      };\n      style.sources[\"tile-extent\"] = source;\n      style.layers.push(layer);\n      map.setStyle(style);\n    },\n    [color]\n  );\n  const map = useMapRef();\n  useMapConditionalStyle(map, tile, styleCallback);\n  return null;\n}\n"],"names":[],"version":3,"file":"tile-extent.06a4b2ed.js.map"}
+{"mappings":";;;;;;;;;;;;;AAMO,SAAS,0CAAgB,QAC9B,IAAI,SACJ,QAAQ,OAIT;IACC,MAAM,gBAAgB,CAAA,GAAA,wBAAU,EAC9B,CAAC,KAAK;QACJ,MAAM,QAAQ,IAAI,QAAQ;QAC1B,IAAI,MAAM,MAAM,IAAI,MAAM;QAC1B,MAAM,MAAM,GAAG,MAAM,MAAM,CAAC,MAAM,CAAC,CAAC,IAAM,EAAE,EAAE,IAAI;QAClD,IAAI,OAAO,MACT,OAAO,IAAI,QAAQ,CAAC;QAEtB,MAAM,KAAE,CAAC,KAAE,CAAC,KAAE,CAAC,EAAE,GAAG;QACpB,MAAM,SAAS,CAAA,GAAA,mCAAY,EAAE;YAAC;YAAG;YAAG;SAAE;QACtC,MAAM,SAAS;YACb,MAAM;YACN,MAAM;QACR;QACA,MAAM,QAAQ;YACZ,IAAI;YACJ,MAAM;YACN,QAAQ;YACR,OAAO;gBACL,cAAc;gBACd,cAAc;YAChB;QACF;QACA,MAAM,OAAO,CAAC,cAAc,GAAG;QAC/B,MAAM,MAAM,CAAC,IAAI,CAAC;QAClB,IAAI,QAAQ,CAAC;IACf,GACA;QAAC;KAAM;IAET,MAAM,MAAM,CAAA,GAAA,sCAAQ;IACpB,CAAA,GAAA,mDAAqB,EAAE,KAAK,MAAM;IAClC,OAAO;AACT","sources":["packages/map-interface/src/dev/tile-extent.ts"],"sourcesContent":["import { useMapConditionalStyle, useMapRef } from \"@macrostrat/mapbox-react\";\nimport { tileToGeoJSON } from \"@mapbox/tilebelt\";\nimport { useCallback } from \"react\";\n\ntype TileIndex = { x: number; y: number; z: number };\n\nexport function TileExtentLayer({\n  tile,\n  color = \"red\",\n}: {\n  tile: TileIndex | null;\n  color?: string;\n}) {\n  const styleCallback = useCallback(\n    (map, val: TileIndex) => {\n      const style = map.getStyle();\n      if (style.layers == null) return;\n      style.layers = style.layers.filter((l) => l.id != \"tile-extent\");\n      if (val == null) {\n        return map.setStyle(style);\n      }\n      const { x, y, z } = val;\n      const extent = tileToGeoJSON([x, y, z]);\n      const source = {\n        type: \"geojson\",\n        data: extent,\n      };\n      const layer = {\n        id: \"tile-extent\",\n        type: \"line\",\n        source: \"tile-extent\",\n        paint: {\n          \"line-color\": color,\n          \"line-width\": 2,\n        },\n      };\n      style.sources[\"tile-extent\"] = source;\n      style.layers.push(layer);\n      map.setStyle(style);\n    },\n    [color],\n  );\n  const map = useMapRef();\n  useMapConditionalStyle(map, tile, styleCallback);\n  return null;\n}\n"],"names":[],"version":3,"file":"map-interface.175c4635.js.map"}

package/dist/cjs/{map-page.1e1970d8.js → map-interface.17e81e8a.js}

@@ -1,13 +1,13 @@
-var $8646508ae99a5857$exports = require("./xray.a23f8660.js");
-var $c3311f59335df34d$exports = require("./container.d2e83c46.js");
-var $fce5fc950d1fe35b$exports = require("./context-panel.3061a63e.js");
-var $2611a7b4364593e5$exports = require("./helpers.0f72ddaf.js");
-var $2bc7c1e4e7da7fdf$exports = require("./location-panel.e33becf0.js");
-var $493deb9ab6b848e3$exports = require("./map-view.61e50e18.js");
-var $33088e8384af337c$exports = require("./main.module.ccec47df.js");
-require("./main.module.becc2fe7.css");
-var $abbe8d0af34cbbed$exports = require("./tile-extent.06a4b2ed.js");
-var $db14eb7a5c07abdb$exports = require("./vector-tile-features.77121785.js");
+var $8646508ae99a5857$exports = require("./map-interface.4c5addca.js");
+var $c3311f59335df34d$exports = require("./map-interface.bda26b27.js");
+var $fce5fc950d1fe35b$exports = require("./map-interface.0e252a74.js");
+var $2611a7b4364593e5$exports = require("./map-interface.5813e876.js");
+var $2bc7c1e4e7da7fdf$exports = require("./map-interface.3934d6d6.js");
+var $493deb9ab6b848e3$exports = require("./map-interface.e7194f92.js");
+var $33088e8384af337c$exports = require("./map-interface.abe5fe65.js");
+require("./map-interface.26497065.css");
+var $abbe8d0af34cbbed$exports = require("./map-interface.175c4635.js");
+var $db14eb7a5c07abdb$exports = require("./map-interface.e9bcd5c0.js");
 var $g1A1s$blueprintjscore = require("@blueprintjs/core");
 var $g1A1s$macrostrathyper = require("@macrostrat/hyper");
 var $g1A1s$macrostratuicomponents = require("@macrostrat/ui-components");
@@ -51,8 +51,9 @@ function $6f5ca387ac26c0b5$export$eab3034e57b46e26({ title: title = "Map inspect
   */ const dark = (0, $g1A1s$macrostratuicomponents.useDarkMode)();
     const isEnabled = dark?.isEnabled;
     if (mapboxToken != null) (0, ($parcel$interopDefault($g1A1s$mapboxgl))).accessToken = mapboxToken;
-    if (styleType == "macrostrat") style ??= isEnabled ? "mapbox://styles/jczaplewski/cl5uoqzzq003614o6url9ou9z?optimize=true" : "mapbox://styles/jczaplewski/clatdbkw4002q14lov8zx0bm0?optimize=true";
-    else style ??= isEnabled ? "mapbox://styles/mapbox/dark-v10" : "mapbox://styles/mapbox/light-v10";
+    style ??= (0, $2611a7b4364593e5$exports.useBasicMapStyle)({
+        styleType: styleType
+    });
     const [isOpen, setOpen] = (0, $g1A1s$react.useState)(false);
     const [state, setState] = (0, $g1A1s$macrostratuicomponents.useStoredState)("macrostrat:dev-map-page", {
         showTileExtent: false,
@@ -179,4 +180,4 @@ function $6f5ca387ac26c0b5$var$MapInspector(props) {
 const $6f5ca387ac26c0b5$export$2391061fbdfb71ef = $6f5ca387ac26c0b5$var$MapInspector;
 
 
-//# sourceMappingURL=map-page.1e1970d8.js.map
+//# sourceMappingURL=map-interface.17e81e8a.js.map

package/dist/cjs/map-interface.17e81e8a.js.map

@@ -0,0 +1 @@
+{"mappings":"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","sources":["packages/map-interface/src/dev/map-page.ts"],"sourcesContent":["// Import other components\nimport { Switch } from \"@blueprintjs/core\";\nimport hyper from \"@macrostrat/hyper\";\nimport { Spacer, useDarkMode, useStoredState } from \"@macrostrat/ui-components\";\nimport mapboxgl from \"mapbox-gl\";\nimport { useCallback, useState, useEffect } from \"react\";\nimport { buildInspectorStyle } from \"./xray\";\nimport { MapAreaContainer, PanelCard } from \"../container\";\nimport { FloatingNavbar, MapLoadingButton } from \"../context-panel\";\nimport { MapMarker, useBasicMapStyle } from \"../helpers\";\nimport { LocationPanel } from \"../location-panel\";\nimport { MapView } from \"../map-view\";\nimport styles from \"./main.module.sass\";\nimport { TileExtentLayer } from \"./tile-extent\";\nimport {\n  FeaturePanel,\n  FeatureSelectionHandler,\n  TileInfo,\n} from \"./vector-tile-features\";\nimport { MapPosition } from \"@macrostrat/mapbox-utils\";\n\nexport const h = hyper.styled(styles);\n\nexport function MapInspectorV2({\n  title = \"Map inspector\",\n  headerElement = null,\n  transformRequest = null,\n  mapPosition = null,\n  mapboxToken = null,\n  overlayStyle = null,\n  controls = null,\n  children = null,\n  style,\n  bounds = null,\n  focusedSource = null,\n  focusedSourceTitle = null,\n  fitViewport = true,\n  styleType = \"macrostrat\",\n}: {\n  headerElement?: React.ReactNode;\n  transformRequest?: mapboxgl.TransformRequestFunction;\n  title?: string;\n  style?: mapboxgl.Style | string;\n  controls?: React.ReactNode;\n  children?: React.ReactNode;\n  mapboxToken?: string;\n  overlayStyle?: mapboxgl.Style | string;\n  focusedSource?: string;\n  focusedSourceTitle?: string;\n  projection?: string;\n  mapPosition?: MapPosition;\n  bounds?: [number, number, number, number];\n  fitViewport?: boolean;\n  styleType?: \"standard\" | \"macrostrat\";\n}) {\n  /* We apply a custom style to the panel container when we are interacting\n    with the search bar, so that we can block map interactions until search\n    bar focus is lost.\n    We also apply a custom style when the infodrawer is open so we can hide\n    the search bar on mobile platforms\n  */\n\n  const dark = useDarkMode();\n  const isEnabled = dark?.isEnabled;\n\n  if (mapboxToken != null) {\n    mapboxgl.accessToken = mapboxToken;\n  }\n\n  style ??= useBasicMapStyle({ styleType });\n\n  const [isOpen, setOpen] = useState(false);\n\n  const [state, setState] = useStoredState(\"macrostrat:dev-map-page\", {\n    showTileExtent: false,\n    xRay: false,\n  });\n  const { showTileExtent, xRay } = state;\n\n  const [actualStyle, setActualStyle] = useState(null);\n\n  useEffect(() => {\n    buildInspectorStyle(style, overlayStyle, {\n      mapboxToken,\n      inDarkMode: isEnabled,\n      xRay,\n    }).then(setActualStyle);\n  }, [style, xRay, mapboxToken, isEnabled, overlayStyle]);\n\n  const [inspectPosition, setInspectPosition] =\n    useState<mapboxgl.LngLat | null>(null);\n\n  const [data, setData] = useState(null);\n\n  const onSelectPosition = useCallback((position: mapboxgl.LngLat) => {\n    setInspectPosition(position);\n  }, []);\n\n  let detailElement = null;\n  if (inspectPosition != null) {\n    detailElement = h(\n      LocationPanel,\n      {\n        onClose() {\n          setInspectPosition(null);\n        },\n        position: inspectPosition,\n      },\n      [\n        h(TileInfo, {\n          feature: data?.[0] ?? null,\n          showExtent: showTileExtent,\n          setShowExtent() {\n            setState({ ...state, showTileExtent: !showTileExtent });\n          },\n        }),\n        h(FeaturePanel, { features: data, focusedSource, focusedSourceTitle }),\n      ],\n    );\n  }\n\n  let tile = null;\n  if (showTileExtent && data?.[0] != null) {\n    let f = data[0];\n    tile = { x: f._x, y: f._y, z: f._z };\n  }\n\n  return h(\n    MapAreaContainer,\n    {\n      navbar: h(FloatingNavbar, {\n        rightElement: h(MapLoadingButton, {\n          large: true,\n          active: isOpen,\n          onClick: () => setOpen(!isOpen),\n          style: {\n            marginRight: \"-5px\",\n          },\n        }),\n        headerElement,\n        title,\n      }),\n      contextPanel: h(PanelCard, [\n        controls,\n        h(Switch, {\n          checked: xRay,\n          label: \"X-ray mode\",\n          onChange() {\n            setState({ ...state, xRay: !xRay });\n          },\n        }),\n      ]),\n      detailPanel: detailElement,\n      contextPanelOpen: isOpen,\n      fitViewport,\n    },\n    h(\n      MapView,\n      {\n        style: actualStyle,\n        transformRequest,\n        mapPosition,\n        projection: { name: \"globe\" },\n        mapboxToken,\n        bounds,\n      },\n      [\n        h(FeatureSelectionHandler, {\n          selectedLocation: inspectPosition,\n          setFeatures: setData,\n        }),\n        h(MapMarker, {\n          position: inspectPosition,\n          setPosition: onSelectPosition,\n        }),\n        h(TileExtentLayer, { tile, color: isEnabled ? \"white\" : \"black\" }),\n        children,\n      ],\n    ),\n  );\n}\n\nfunction MapInspector(props) {\n  const { children, controls, ...rest } = props;\n  /** Compatibility wrapper for MapInspectorV2 */\n  // React warning about this legacy usage\n  console.warn(\"MapInspector is deprecated. Use MapInspectorV2 instead\");\n\n  return h(MapInspectorV2, {\n    ...rest,\n    controls: [children, controls],\n  });\n}\n\n// Legacy export\nexport const DevMapPage = MapInspector;\n"],"names":[],"version":3,"file":"map-interface.17e81e8a.js.map"}

package/dist/cjs/{main.module.13eb33f8.css → map-interface.1b386e07.css}

@@ -108,4 +108,4 @@
     border-radius: var(--panel-border-radius, 0px);
   }
 }
-/*# sourceMappingURL=main.module.13eb33f8.css.map */
+/*# sourceMappingURL=map-interface.1b386e07.css.map */

package/dist/cjs/{main.module.13eb33f8.css.map → map-interface.1b386e07.css.map}

@@ -1 +1 @@
-{"mappings":"AAAA;;;;AAGE;;;;AAGF;;;;;;;;;;AAQE;;;;AAGA;;;;;AAKA;;;;AAGA;;;;AAIA;;;;;;;AAKE;;;;AAGJ;;;;AAGE;;;;;AAIF;;;;;;;;;;;;AAWE;;;;;AAME;;;;;AAKJ;;;;AAEE;;;;AAEA;;;;AAEA;;;;AAEA;;;;AAIF;;;;;;;;AAQA;EACE","sources":["packages/map-interface/src/location-panel/main.module.sass"],"sourcesContent":[".copy-link-button:global(.bp5-minimal.bp5-button)\n  color: var(--text-subtle-color)\n\n  svg\n    fill: var(--text-subtle-color)\n\n.location-panel-header\n  padding: 5px\n  display: flex\n  flex-direction: row\n  align-items: center\n  gap: var(--panel-header-gap, 0.5rem)\n  min-height: var(--panel-header-height, 40px)\n  border-bottom: 1px solid var(--panel-rule-color)\n  &.fixed-height\n    height: var(--panel-header-height, 40px)\n\n  .spacer\n    flex-grow: 1\n    // Ensure the spacer is not extra wide\n    margin-right: calc(-1 * var(--panel-header-gap, 0.5rem))\n\n  .left-icon\n    padding: 7px\n\n  .position-controls :global(.bp5-button)\n    font-size: 12px !important\n\n  // Text elements should\n  h1, h2, h3, h4, h5, h6, p\n    margin: 0\n    font-size: 16px\n    overflow: hidden\n    text-overflow: ellipsis\n    &:first-child\n      margin-left: 10px\n\n.infodrawer-header-item\n  font-size: 12px\n\n  :global(.secondary)\n    font-size: 0.9em\n    color: var(--text-subtle-color)\n\n.infodrawer\n  pointer-events: all\n  max-height: 100%\n  max-width: 100%\n  height: fit-content\n  display: flex\n  flex-direction: column\n  overflow-y: hidden\n  background-color: var(--panel-background-color)\n  --panel-padding: 0\n\n  &:global(.bp5-card)\n    padding: 0\n    background-color: var(--panel-background-color)\n\n\n  &.loading\n    .infodrawer-body\n      overflow-y: hidden\n      min-height: 70px\n\n\n.infodrawer-contents\n  padding: 0 1em\n  &>:first-child\n    margin-top: 1rem\n  &>div:first-child\n    margin-top: 0\n  &>:last-child\n    margin-bottom: 1rem\n  &>div:last-child\n    margin-bottom: 0\n\n// The scrollable body of the infodrawer\n.infodrawer-body\n  flex-shrink: 1\n  min-height: 0\n  transition: min-height 0.5s ease\n  overflow-y: scroll\n  position: relative\n\n// TODO: remove this when we have a better way to handle card media queries\n@media screen and (max-width: 768px)\n  .infodrawer\n    border-radius: var(--panel-border-radius, 0px)\n"],"names":[],"version":3,"file":"main.module.13eb33f8.css.map"}
+{"mappings":"AAAA;;;;AAGE;;;;AAGF;;;;;;;;;;AAQE;;;;AAGA;;;;;AAKA;;;;AAGA;;;;AAIA;;;;;;;AAKE;;;;AAGJ;;;;AAGE;;;;;AAIF;;;;;;;;;;;;AAWE;;;;;AAME;;;;;AAKJ;;;;AAEE;;;;AAEA;;;;AAEA;;;;AAEA;;;;AAIF;;;;;;;;AAQA;EACE","sources":["packages/map-interface/src/location-panel/main.module.sass"],"sourcesContent":[".copy-link-button:global(.bp5-minimal.bp5-button)\n  color: var(--text-subtle-color)\n\n  svg\n    fill: var(--text-subtle-color)\n\n.location-panel-header\n  padding: 5px\n  display: flex\n  flex-direction: row\n  align-items: center\n  gap: var(--panel-header-gap, 0.5rem)\n  min-height: var(--panel-header-height, 40px)\n  border-bottom: 1px solid var(--panel-rule-color)\n  &.fixed-height\n    height: var(--panel-header-height, 40px)\n\n  .spacer\n    flex-grow: 1\n    // Ensure the spacer is not extra wide\n    margin-right: calc(-1 * var(--panel-header-gap, 0.5rem))\n\n  .left-icon\n    padding: 7px\n\n  .position-controls :global(.bp5-button)\n    font-size: 12px !important\n\n  // Text elements should\n  h1, h2, h3, h4, h5, h6, p\n    margin: 0\n    font-size: 16px\n    overflow: hidden\n    text-overflow: ellipsis\n    &:first-child\n      margin-left: 10px\n\n.infodrawer-header-item\n  font-size: 12px\n\n  :global(.secondary)\n    font-size: 0.9em\n    color: var(--text-subtle-color)\n\n.infodrawer\n  pointer-events: all\n  max-height: 100%\n  max-width: 100%\n  height: fit-content\n  display: flex\n  flex-direction: column\n  overflow-y: hidden\n  background-color: var(--panel-background-color)\n  --panel-padding: 0\n\n  &:global(.bp5-card)\n    padding: 0\n    background-color: var(--panel-background-color)\n\n\n  &.loading\n    .infodrawer-body\n      overflow-y: hidden\n      min-height: 70px\n\n\n.infodrawer-contents\n  padding: 0 1em\n  &>:first-child\n    margin-top: 1rem\n  &>div:first-child\n    margin-top: 0\n  &>:last-child\n    margin-bottom: 1rem\n  &>div:last-child\n    margin-bottom: 0\n\n// The scrollable body of the infodrawer\n.infodrawer-body\n  flex-shrink: 1\n  min-height: 0\n  transition: min-height 0.5s ease\n  overflow-y: scroll\n  position: relative\n\n// TODO: remove this when we have a better way to handle card media queries\n@media screen and (max-width: 768px)\n  .infodrawer\n    border-radius: var(--panel-border-radius, 0px)\n"],"names":[],"version":3,"file":"map-interface.1b386e07.css.map"}

package/dist/cjs/{header.af864bde.js → map-interface.1d19056e.js}

@@ -1,6 +1,6 @@
-require("./main.module.13eb33f8.css");
-var $a8d7c4c397e52cf6$exports = require("./main.module.0bbfa859.js");
-var $860d9939f7032c69$exports = require("./location-info.92e70042.js");
+require("./map-interface.1b386e07.css");
+var $a8d7c4c397e52cf6$exports = require("./map-interface.cd485bb4.js");
+var $860d9939f7032c69$exports = require("./map-interface.64823b7c.js");
 var $hshpw$blueprintjscore = require("@blueprintjs/core");
 var $hshpw$macrostrathyper = require("@macrostrat/hyper");
 var $hshpw$macrostratuicomponents = require("@macrostrat/ui-components");
@@ -107,4 +107,4 @@ function $548387e5996cdbbd$export$e9ff14c4822c2e8c(props) {
 }
 
 
-//# sourceMappingURL=header.af864bde.js.map
+//# sourceMappingURL=map-interface.1d19056e.js.map

package/dist/cjs/map-interface.1d19056e.js.map

@@ -0,0 +1 @@
+{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAcA,MAAM,0BAAI,CAAA,GAAA,gDAAI,EAAE,MAAM,CAAC,CAAA,GAAA,mDAAK;AAE5B,SAAS,qCAAe,YAAE,QAAQ,UAAE,MAAM,gBAAE,eAAe,OAAO;IAChE,MAAM,aAAa,CAAA,GAAA,0CAAY,EAAE;IAEjC,MAAM,oBAAoB,CAAA,GAAA,uCAAS,EAAE,eAAe;IAEpD,OAAO,wBAAE,yBAAyB;QAChC,wBAAE,CAAA,GAAA,gDAAkB,GAAG;YAAE,UAAU;oBAAU;wBAAQ;QAAW,GAAG,EAAE;QACrE,wBAAE,EAAE,CAAC,qBAAqB,YAAY,MAAM,sCAAgB;YAC1D,UAAU;QACZ;KACD;AACH;AAEA,SAAS,qCAAe,YAAE,QAAQ,YAAE,QAAQ,WAAE,OAAO,EAAE,GAAG,MAAM;IAC9D,MAAM,UAAU,CAAA,GAAA,wCAAS;IAEzB,IAAI,UAAU,CAAC,WAAW,CAAC;IAC3B,IAAI,YAAY,MACd,WAAW,CAAC,IAAI,EAAE,UAAU;IAE9B,WAAW;IAEX,OAAO,wBACL,CAAA,GAAA,6BAAK,GACL;QACE,WAAW;QACX,WAAW,wBAAE,CAAA,GAAA,2BAAG,GAAG;YAAE,MAAM;YAAQ,MAAM;QAAG;QAC5C,SAAS;QACT,OAAO;QACP;YACE,UAAU,SAAS,CAAC,SAAS,CAAC,OAAO,QAAQ,CAAC,IAAI,EAAE,IAAI,CACtD;gBACE,SAAS,KAAK;6BACZ;oBACA,QAAQ;oBACR,MAAM;oBACN,SAAS;gBACX;gBACA;YACF,GACA;gBACE,SAAS,KAAK;oBACZ,SAAS;oBACT,QAAQ;oBACR,MAAM;oBACN,SAAS;gBACX;YACF;QAEJ;QACA,GAAG,IAAI;IACT,GACA,YAAY;AAEhB;AAcO,SAAS,0CAAiB,KAA4B;IAC3D,MAAM,WACJ,OAAO,YACP,QAAQ,UACR,MAAM,QACN,OAAO,cACP,SAAS,0BACT,sBAAsB,eACtB,cAAc,iBACd,QAAQ,aACR,SAAS,EACV,GAAG;IAEJ,IAAI,aAAa;IACjB,IAAI,UAAU,QAAQ,YAAY,MAChC,aAAa,wBAAE,sCAAgB;kBAC7B;gBACA;QACA,cAAc;IAChB;IAGF,OAAO,wBACL,gCACA;QACE,WAAW,CAAA,GAAA,2CAAS,EAAE,WAAW;YAAE,gBAAgB;QAAY;IACjE,GACA;QACE;QACA;QACA,wBAAE;QACF,wBAAE,EAAE,CAAC,YAAY,MAAM,CAAA,GAAA,sCAAW,GAAG;sBACnC;kBACA;YACA,WAAW;QACb;QACA,wBAAE,EAAE,CAAC,aAAa,MAAM,CAAA,GAAA,mCAAQ,GAAG;uBACjC;YACA,WAAW;QACb;QACA,wBAAE,EAAE,CAAC,WAAW,MAAM,CAAA,GAAA,6BAAK,GAAG;YAC5B,SAAS;YACT,MAAM;YACN,SAAS;QACX;KACD;AAEL","sources":["packages/map-interface/src/location-panel/header.ts"],"sourcesContent":["import { Icon, Button } from \"@blueprintjs/core\";\nimport hyper from \"@macrostrat/hyper\";\nimport styles from \"./main.module.sass\";\nimport { useToaster } from \"@macrostrat/ui-components\";\nimport { LngLatCoords, Elevation } from \"../location-info\";\nimport {\n  LocationFocusButton,\n  useFocusState,\n  isCentered,\n} from \"@macrostrat/mapbox-react\";\nimport classNames from \"classnames\";\nimport type { ReactNode } from \"react\";\nimport type { LngLatBounds, LngLatLike } from \"mapbox-gl\";\n\nconst h = hyper.styled(styles);\n\nfunction PositionButton({ position, bounds, showCopyLink = false }) {\n  const focusState = useFocusState(position);\n\n  const copyLinkIsVisible = isCentered(focusState) && showCopyLink;\n\n  return h(\"div.position-controls\", [\n    h(LocationFocusButton, { location: position, bounds, focusState }, []),\n    h.if(copyLinkIsVisible && position != null)(CopyLinkButton, {\n      itemName: \"position\",\n    }),\n  ]);\n}\n\nfunction CopyLinkButton({ itemName, children, onClick, ...rest }) {\n  const toaster = useToaster();\n\n  let message = `Copied link`;\n  if (itemName != null) {\n    message += ` to ${itemName}`;\n  }\n  message += \"!\";\n\n  return h(\n    Button,\n    {\n      className: \"copy-link-button\",\n      rightIcon: h(Icon, { icon: \"link\", size: 12 }),\n      minimal: true,\n      small: true,\n      onClick() {\n        navigator.clipboard.writeText(window.location.href).then(\n          () => {\n            toaster?.show({\n              message,\n              intent: \"success\",\n              icon: \"clipboard\",\n              timeout: 1000,\n            });\n            onClick?.();\n          },\n          () => {\n            toaster?.show({\n              message: \"Failed to copy link\",\n              intent: \"danger\",\n              icon: \"error\",\n              timeout: 1000,\n            });\n          },\n        );\n      },\n      ...rest,\n    },\n    children ?? \"Copy link\",\n  );\n}\n\nexport interface InfoDrawerHeaderProps {\n  onClose?: () => void;\n  position?: LngLatLike;\n  zoom?: number;\n  elevation?: number;\n  showCopyPositionButton?: boolean;\n  bounds?: LngLatBounds;\n  fixedHeight?: boolean;\n  children?: ReactNode;\n  className?: string;\n}\n\nexport function InfoDrawerHeader(props: InfoDrawerHeaderProps) {\n  const {\n    onClose,\n    position,\n    bounds,\n    zoom = 7,\n    elevation,\n    showCopyPositionButton,\n    fixedHeight = false,\n    children,\n    className,\n  } = props;\n\n  let leftButton = null;\n  if (bounds != null || position != null) {\n    leftButton = h(PositionButton, {\n      position,\n      bounds,\n      showCopyLink: showCopyPositionButton,\n    });\n  }\n\n  return h(\n    \"header.location-panel-header\",\n    {\n      className: classNames(className, { \"fixed-height\": fixedHeight }),\n    },\n    [\n      leftButton,\n      children,\n      h(\"div.spacer\"),\n      h.if(position != null)(LngLatCoords, {\n        position,\n        zoom,\n        className: \"infodrawer-header-item\",\n      }),\n      h.if(elevation != null)(Elevation, {\n        elevation,\n        className: \"infodrawer-header-item\",\n      }),\n      h.if(onClose != null)(Button, {\n        minimal: true,\n        icon: \"cross\",\n        onClick: onClose,\n      }),\n    ],\n  );\n}\n"],"names":[],"version":3,"file":"map-interface.1d19056e.js.map"}

package/dist/cjs/{main.module.becc2fe7.css → map-interface.26497065.css}

@@ -89,4 +89,4 @@
 .dev-index-page_48e225 {
   overflow-y: scroll;
 }
-/*# sourceMappingURL=main.module.becc2fe7.css.map */
+/*# sourceMappingURL=map-interface.26497065.css.map */

package/dist/cjs/{main.module.becc2fe7.css.map → map-interface.26497065.css.map}

@@ -1 +1 @@
-{"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBE;;;;;;;AAME;;;;;;;;;;AASA;;;;;AAGF;;;;;AAGF;;;;;;;;;;AAOA;;;;AAGE;;;;AAGE;;;;;AAGF;;;;;;;;;;;AAUE","sources":["packages/map-interface/src/dev/main.module.sass"],"sourcesContent":[".feature-panel\n  position: relative\n  margin: 0 -1em\n\n.key-value\n  display: inline-block\n  margin-right: 1em\n\n  .key\n    font-weight: bold\n    font-size: 0.9em\n\n    &:after\n      content: ': '\n\n  .value\n    font-size: 0.9em\n\n.feature-properties\n  position: relative\n\n  &:before\n    content: \"–\"\n    position: absolute\n    top: 4px\n    left: 0\n\n  .controls\n    display: flex\n    flex-direction: row\n    align-items: flex-end\n    position: absolute\n    top: 0\n    right: 0\n    gap: 0.5em\n\n.feature-header h3\n  margin-bottom: 0\n  margin-top: 0.5em\n\n.feature-group\n  border-bottom: 1px solid var(--panel-rule-inner)\n  margin-bottom: 0.5em\n\n  &:last-child\n    border-bottom: none\n\n.tile-info\n  display: flex\n  flex-direction: row\n  align-items: baseline\n\n  h3\n    margin-right: 0.5em\n\n.opacity-slider\n  margin: 0 1em 0.5em\n\n  :global\n    .bp5-slider-handle .bp5-slider-label\n      background-color: var(--secondary-color)\n      color: var(--text-color)\n\n.unit-number\n  .unit\n    font-size: 0.9em\n    margin-left: 0.2em\n    font-weight: bold\n\n.page\n  margin: 2em auto\n  max-width: 50em\n\n.dev-index-page\n  overflow-y: scroll\n"],"names":[],"version":3,"file":"main.module.becc2fe7.css.map"}
+{"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBE;;;;;;;AAME;;;;;;;;;;AASA;;;;;AAGF;;;;;AAGF;;;;;;;;;;AAOA;;;;AAGE;;;;AAGE;;;;;AAGF;;;;;;;;;;;AAUE","sources":["packages/map-interface/src/dev/main.module.sass"],"sourcesContent":[".feature-panel\n  position: relative\n  margin: 0 -1em\n\n.key-value\n  display: inline-block\n  margin-right: 1em\n\n  .key\n    font-weight: bold\n    font-size: 0.9em\n\n    &:after\n      content: ': '\n\n  .value\n    font-size: 0.9em\n\n.feature-properties\n  position: relative\n\n  &:before\n    content: \"–\"\n    position: absolute\n    top: 4px\n    left: 0\n\n  .controls\n    display: flex\n    flex-direction: row\n    align-items: flex-end\n    position: absolute\n    top: 0\n    right: 0\n    gap: 0.5em\n\n.feature-header h3\n  margin-bottom: 0\n  margin-top: 0.5em\n\n.feature-group\n  border-bottom: 1px solid var(--panel-rule-inner)\n  margin-bottom: 0.5em\n\n  &:last-child\n    border-bottom: none\n\n.tile-info\n  display: flex\n  flex-direction: row\n  align-items: baseline\n\n  h3\n    margin-right: 0.5em\n\n.opacity-slider\n  margin: 0 1em 0.5em\n\n  :global\n    .bp5-slider-handle .bp5-slider-label\n      background-color: var(--secondary-color)\n      color: var(--text-color)\n\n.unit-number\n  .unit\n    font-size: 0.9em\n    margin-left: 0.2em\n    font-weight: bold\n\n.page\n  margin: 2em auto\n  max-width: 50em\n\n.dev-index-page\n  overflow-y: scroll\n"],"names":[],"version":3,"file":"map-interface.26497065.css.map"}

package/dist/cjs/{main.module.a3a78b0d.js → map-interface.31742bd3.js}

@@ -62,4 +62,4 @@ $b1c160aff794b8f5$export$854d9fad3b5263eb = "expansion-panel-detail-header_1340c
 $b1c160aff794b8f5$export$494f9067c39d24ef = "expansion-panel-detail-body_1340c8";
 
 
-//# sourceMappingURL=main.module.a3a78b0d.js.map
+//# sourceMappingURL=map-interface.31742bd3.js.map

package/dist/cjs/{main.module.a3a78b0d.js.map → map-interface.31742bd3.js.map}

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AAlBA,4CAAkC;AAClC,4CAA0B;AAC1B,4CAAyC;AACzC,4CAAuC;AACvC,4CAAoC;AACpC,4CAAwC;AACxC,4CAA2C;AAC3C,4CAAiD;AACjD,4CAAuC;AACvC,4CAA4C;AAC5C,4CAA4C;AAC5C,4CAA8C;AAC9C,4CAAgD;AAChD,4CAA8C;AAC9C,4CAAuC;AACvC,4CAAoC;AACpC,4CAAmC;AACnC,4CAAkD;AAClD,4CAAgD","sources":["packages/map-interface/src/expansion-panel/main.module.sass"],"sourcesContent":["\n.panel-subhead\n  padding: 0 1rem\n  border: 1px solid var(--panel-rule-color)\n  border-bottom: 1px solid var(--panel-rule-color)\n  background-color: var(--accent-color)\n  display: flex\n  flex-direction: row\n  align-items: center\n  z-index: 1\n  gap: var(--panel-header-gap, 0.5rem)\n  top: -1px\n  position: sticky\n  min-height: var(--panel-header-height, 40px)\n  h1, h2, h3, h4\n    font-family: Montserrat,sans-serif\n    font-weight: 700\n    margin: 0\n  h4\n    font-weight: 600\n  .title\n    flex-grow: 1\n\n  .expansion-panel-icon\n    margin-right: -0.35em\n\n// :global(.bp5-dark) .panel-subhead\n//   margin 0 1px\n\n.info-panel-section\n  &>.panel-subhead\n    margin: -1px calc(var(--panel-padding-h) * -1) 0\n\n.expansion-panel\n  padding: 0\n  flex-wrap: wrap\n  margin-top: -1px\n  // &.collapsed\n  //   .expansion-panel-header\n  //     border-bottom-width: 0;\n\n.sub-expansion-panel\n  margin: -1px calc(var(--panel-padding-h) * -0.5) 0\n  overflow: hidden\n  &:first-child\n    .expansion-panel-header\n      border-top-width: 0\n  .panel-subhead\n    border-top: none\n    border-bottom: none\n\n  .expansion-panel-header\n    background-color: var(--accent-secondary-color)\n    cursor: pointer\n    padding: 0 1rem\n\n    &:hover\n      background-color: var(--accent-secondary-hover-color)\n    h2, h3, h4\n      font-weight: 500\n      border-bottom: 1px solid var(--tertiary-border-color)\n      border-top: 1px solid var(--tertiary-border-color)\n      align-items: center\n\n.expansion-summary-title-help\n  margin-left: 5px\n  :global(.bp5-icon)\n    margin-left: 5px\n\n.expansion-panel-header\n  cursor: pointer\n  &:hover\n    background-color: var(--accent-hover-color)\n  :global(.bp5-icon)\n    transform: translate(0,3px)\n\n.expansion-children\n  padding: 0 1rem\n  .expansion-panel\n    margin-left: -1rem\n    margin-right: -1rem\n    &:first-child\n      margin-top: 0\n  &>:first-child\n    margin-top: 1rem\n  &>:last-child\n    margin-bottom: 1rem\n\n\n\n.expansion-panel-subtext\n  font-size: 85%\n  font-weight: 400\n\n:global\n  .expansion-panel-root\n    padding-left: 15px !important\n\n  .expansion-panel-detail\n    display: block !important\n    padding: 0 !important\n\n  .expansion-panel-detail-sub\n    display: block !important\n\n// New expandable panel for details\n.expandable-details-main\n  display: flex\n  flex-direction: row\n  align-items: center\n  justify-content: space-between\n  margin: 3px 0\n\n.expandable-details-header\n  display: inline-flex\n  flex-direction: row\n  align-items: baseline\n  flex-grow: 1\n\n.expandable-details-children\n  position: relative\n\n.expandable-details-toggle\n  :global(.bp5-button)\n    font-size: 10px\n\n.expandable-details\n  &.macrostrat-unit\n    .title:after\n      content: none\n  .title\n    margin-right: 1em\n    &:after\n      content: \":\"\n\n.expansion-body\n  display: inline-block\n  //flex-direction row\n  align-items: baseline\n  background-color: var(--tertiary-background)\n  padding: 2px 6px\n  border-radius: 4px\n  width: 100%\n  box-shadow: 0px 1px 2px 1px rgba(0,0,0,0.2)\n  margin-bottom: 6px\n\n.expansion-panel-detail-header\n  font-size: 90%\n  font-style: italic\n  margin-right: 1em\n  display: inline\n  color: var(--secondary-color)\n  &:after\n    content: \":\"\n\n.expansion-panel-detail-body\n  display: inline\n"],"names":[],"version":3,"file":"main.module.a3a78b0d.js.map"}
+{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AAlBA,4CAAkC;AAClC,4CAA0B;AAC1B,4CAAyC;AACzC,4CAAuC;AACvC,4CAAoC;AACpC,4CAAwC;AACxC,4CAA2C;AAC3C,4CAAiD;AACjD,4CAAuC;AACvC,4CAA4C;AAC5C,4CAA4C;AAC5C,4CAA8C;AAC9C,4CAAgD;AAChD,4CAA8C;AAC9C,4CAAuC;AACvC,4CAAoC;AACpC,4CAAmC;AACnC,4CAAkD;AAClD,4CAAgD","sources":["packages/map-interface/src/expansion-panel/main.module.sass"],"sourcesContent":["\n.panel-subhead\n  padding: 0 1rem\n  border: 1px solid var(--panel-rule-color)\n  border-bottom: 1px solid var(--panel-rule-color)\n  background-color: var(--accent-color)\n  display: flex\n  flex-direction: row\n  align-items: center\n  z-index: 1\n  gap: var(--panel-header-gap, 0.5rem)\n  top: -1px\n  position: sticky\n  min-height: var(--panel-header-height, 40px)\n  h1, h2, h3, h4\n    font-family: Montserrat,sans-serif\n    font-weight: 700\n    margin: 0\n  h4\n    font-weight: 600\n  .title\n    flex-grow: 1\n\n  .expansion-panel-icon\n    margin-right: -0.35em\n\n// :global(.bp5-dark) .panel-subhead\n//   margin 0 1px\n\n.info-panel-section\n  &>.panel-subhead\n    margin: -1px calc(var(--panel-padding-h) * -1) 0\n\n.expansion-panel\n  padding: 0\n  flex-wrap: wrap\n  margin-top: -1px\n  // &.collapsed\n  //   .expansion-panel-header\n  //     border-bottom-width: 0;\n\n.sub-expansion-panel\n  margin: -1px calc(var(--panel-padding-h) * -0.5) 0\n  overflow: hidden\n  &:first-child\n    .expansion-panel-header\n      border-top-width: 0\n  .panel-subhead\n    border-top: none\n    border-bottom: none\n\n  .expansion-panel-header\n    background-color: var(--accent-secondary-color)\n    cursor: pointer\n    padding: 0 1rem\n\n    &:hover\n      background-color: var(--accent-secondary-hover-color)\n    h2, h3, h4\n      font-weight: 500\n      border-bottom: 1px solid var(--tertiary-border-color)\n      border-top: 1px solid var(--tertiary-border-color)\n      align-items: center\n\n.expansion-summary-title-help\n  margin-left: 5px\n  :global(.bp5-icon)\n    margin-left: 5px\n\n.expansion-panel-header\n  cursor: pointer\n  &:hover\n    background-color: var(--accent-hover-color)\n  :global(.bp5-icon)\n    transform: translate(0,3px)\n\n.expansion-children\n  padding: 0 1rem\n  .expansion-panel\n    margin-left: -1rem\n    margin-right: -1rem\n    &:first-child\n      margin-top: 0\n  &>:first-child\n    margin-top: 1rem\n  &>:last-child\n    margin-bottom: 1rem\n\n\n\n.expansion-panel-subtext\n  font-size: 85%\n  font-weight: 400\n\n:global\n  .expansion-panel-root\n    padding-left: 15px !important\n\n  .expansion-panel-detail\n    display: block !important\n    padding: 0 !important\n\n  .expansion-panel-detail-sub\n    display: block !important\n\n// New expandable panel for details\n.expandable-details-main\n  display: flex\n  flex-direction: row\n  align-items: center\n  justify-content: space-between\n  margin: 3px 0\n\n.expandable-details-header\n  display: inline-flex\n  flex-direction: row\n  align-items: baseline\n  flex-grow: 1\n\n.expandable-details-children\n  position: relative\n\n.expandable-details-toggle\n  :global(.bp5-button)\n    font-size: 10px\n\n.expandable-details\n  &.macrostrat-unit\n    .title:after\n      content: none\n  .title\n    margin-right: 1em\n    &:after\n      content: \":\"\n\n.expansion-body\n  display: inline-block\n  //flex-direction row\n  align-items: baseline\n  background-color: var(--tertiary-background)\n  padding: 2px 6px\n  border-radius: 4px\n  width: 100%\n  box-shadow: 0px 1px 2px 1px rgba(0,0,0,0.2)\n  margin-bottom: 6px\n\n.expansion-panel-detail-header\n  font-size: 90%\n  font-style: italic\n  margin-right: 1em\n  display: inline\n  color: var(--secondary-color)\n  &:after\n    content: \":\"\n\n.expansion-panel-detail-body\n  display: inline\n"],"names":[],"version":3,"file":"map-interface.31742bd3.js.map"}

package/dist/cjs/{expansion-panel.ef757efe.js → map-interface.354aaa39.js}

@@ -1,6 +1,6 @@
-var $b1c160aff794b8f5$exports = require("./main.module.a3a78b0d.js");
-require("./main.module.338867af.css");
-var $a0970d22776f9f4c$exports = require("./headers.d9f3e324.js");
+var $b1c160aff794b8f5$exports = require("./map-interface.31742bd3.js");
+require("./map-interface.adb45df9.css");
+var $a0970d22776f9f4c$exports = require("./map-interface.7509f2c1.js");
 var $fcjlG$react = require("react");
 var $fcjlG$blueprintjscore = require("@blueprintjs/core");
 var $fcjlG$macrostrathyper = require("@macrostrat/hyper");
@@ -132,4 +132,4 @@ function $750d69d73bfbdc9a$export$263416b670b3f129({ title: title, className: cl
 }
 
 
-//# sourceMappingURL=expansion-panel.ef757efe.js.map
+//# sourceMappingURL=map-interface.354aaa39.js.map

package/dist/cjs/map-interface.354aaa39.js.map

@@ -0,0 +1 @@
+{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,MAAM,0BAAI,CAAA,GAAA,gDAAI,EAAE,MAAM,CAAC,CAAA,GAAA,mDAAK;AAE5B,SAAS,0CAAsB,KAAK;IAClC,MAAM,YAAE,QAAQ,YAAE,QAAQ,YAAE,QAAQ,aAAE,SAAS,SAAE,KAAK,kBAAE,cAAc,EAAE,GACtE;IACF,MAAM,OAAO,WAAW,eAAe;IACvC,OAAO,wBACL,CAAA,GAAA,sCAAW,GACX;QACE,WAAW,CAAA,GAAA,2CAAS,EAAE,0BAA0B;QAChD,SAAS;eACT;QACA,WAAW;IACb,GACA;QAAC;QAAU,wBAAE,CAAA,GAAA,2BAAG,GAAG;kBAAE;YAAM,WAAW;QAAuB;KAAG;AAEpE;AAEA,SAAS,yCAAmB,KAAK;IAC/B,IAAI,SACF,KAAK,kBACL,iBAAiB,gBACjB,QAAQ,YACR,QAAQ,YACR,QAAQ,YACR,WAAW,KAAO,kBAClB,gBAAgB,iBAChB,SAAS,EACV,GAAG;IACJ,MAAM,CAAC,QAAQ,QAAQ,GAAG,CAAA,GAAA,qBAAO,EAAE,YAAY;IAE/C,MAAM,YAAY;QAChB;QACA,QAAQ,CAAC;IACX;IAEA,OAAO,wBACL,4BACA;QACE,WAAW,CAAA,GAAA,2CAAS,EAAE,WAAW;YAC/B,UAAU;YACV,WAAW,CAAC;QACd;IACF,GACA;QACE,wBACE,2CACA;YACE,UAAU;YACV,UAAU;mBACV;4BACA;QACF,GACA,wBAAE,oCAAoC;YACpC,wBAAE,gCAAgC;YAClC;YACA;SACD;QAEH,wBAAE,CAAA,GAAA,+BAAO,GAAG;oBAAE;QAAO,GAAG,wBAAE,0BAA0B,MAAM;KAC3D;AAEL;AAEO,SAAS,0CAAiB,KAAK;IACpC,IAAI,SAAE,KAAK,YAAE,QAAQ,aAAE,SAAS,iBAAE,gBAAgB,MAAM,GAAG;IAC3D,OAAO,wBAAE,0BAA0B;mBAAE;IAAU,GAAG;QAChD,wBAAE,qBAAqB,MAAM,iBAAiB,wBAAE,MAAM;QACtD,wBAAE,qBAAqB,MAAM;KAC9B;AACH;AAEA,SAAS,0CAAe,KAAK;IAC3B,OAAO,wBAAE,0CAAoB;QAC3B,GAAG,KAAK;QACR,WAAW;IACb;AACF;AAEA,SAAS,0CAAkB,KAAK;IAC9B,OAAO,wBAAE,0CAAoB;QAC3B,GAAG,KAAK;QACR,WAAW;QACX,gBAAgB;IAClB;AACF;AAEA,SAAS,0CAAuB,KAAK;IACnC,IAAI,SAAE,KAAK,YAAE,QAAQ,SAAE,KAAK,iBAAE,aAAa,aAAE,SAAS,EAAE,GAAG;IAC3D,MAAM,CAAC,QAAQ,UAAU,GAAG,CAAA,GAAA,qBAAO,EAAE;IACrC,kBAAkB,wBAAE;QAAC,wBAAE,aAAa;QAAQ;KAAM;IAClD,OAAO,wBAAE,0BAA0B;mBAAE;IAAU,GAAG;QAChD,wBAAE,+BAA+B;YAC/B,wBAAE,iCAAiC;YACnC,wBAAE,iCAAiC;gBACjC,wBAAE,CAAA,GAAA,6BAAK,GAAG;oBACR,OAAO;oBACP,SAAS;oBACT,QAAQ;oBACR,SAAS,IAAM,UAAU,CAAC;oBAC1B,MAAM;gBACR;aACD;SACF;QACD,wBACE,CAAA,GAAA,+BAAO,GACP;oBAAE;QAAO,GACT,wBAAE,mCAAmC,MAAM;KAE9C;AACH;AAEA,SAAS,0CAAc,SAAE,KAAK,aAAE,SAAS,YAAE,QAAQ,EAAE;IACnD,OAAO,wBAAE,sBAAsB;mBAAE;IAAU,GAAG;QAC5C,wBAAE,qCAAqC;QACvC,wBAAE,mCAAmC,MAAM;KAC5C;AACH","sources":["packages/map-interface/src/expansion-panel/index.ts"],"sourcesContent":["import { useState } from \"react\";\nimport { Collapse, Icon } from \"@blueprintjs/core\";\nimport hyper from \"@macrostrat/hyper\";\nimport styles from \"./main.module.sass\";\nimport classNames from \"classnames\";\nimport { Button } from \"@blueprintjs/core\";\nimport { PanelSubhead } from \"./headers\";\n\nconst h = hyper.styled(styles);\n\nfunction ExpansionPanelSummary(props) {\n  const { expanded, children, onChange, className, title, titleComponent } =\n    props;\n  const icon = expanded ? \"chevron-up\" : \"chevron-down\";\n  return h(\n    PanelSubhead,\n    {\n      className: classNames(\"expansion-panel-header\", className),\n      onClick: onChange,\n      title,\n      component: titleComponent,\n    },\n    [children, h(Icon, { icon, className: \"expansion-panel-icon\" })],\n  );\n}\n\nfunction ExpansionPanelBase(props) {\n  let {\n    title,\n    titleComponent = \"h3\",\n    children,\n    expanded,\n    helpText,\n    onChange = () => {},\n    sideComponent = null,\n    className,\n  } = props;\n  const [isOpen, setOpen] = useState(expanded || false);\n\n  const onChange_ = () => {\n    onChange();\n    setOpen(!isOpen);\n  };\n\n  return h(\n    \"div.expansion-panel-base\",\n    {\n      className: classNames(className, {\n        expanded: isOpen,\n        collapsed: !isOpen,\n      }),\n    },\n    [\n      h(\n        ExpansionPanelSummary,\n        {\n          onChange: onChange_,\n          expanded: isOpen,\n          title,\n          titleComponent,\n        },\n        h(\"div.expansion-summary-title-help\", [\n          h(\"span.expansion-panel-subtext\", helpText),\n          \" \",\n          sideComponent,\n        ]),\n      ),\n      h(Collapse, { isOpen }, h(\"div.expansion-children\", null, children)),\n    ],\n  );\n}\n\nexport function InfoPanelSection(props) {\n  let { title, children, className, headerElement = null } = props;\n  return h(\"div.info-panel-section\", { className }, [\n    h(\"div.panel-subhead\", null, headerElement ?? h(\"h3\", title)),\n    h(\"div.panel-content\", null, children),\n  ]);\n}\n\nfunction ExpansionPanel(props) {\n  return h(ExpansionPanelBase, {\n    ...props,\n    className: \"expansion-panel\",\n  });\n}\n\nfunction SubExpansionPanel(props) {\n  return h(ExpansionPanelBase, {\n    ...props,\n    className: \"expansion-panel sub-expansion-panel\",\n    titleComponent: \"h4\",\n  });\n}\n\nfunction ExpandableDetailsPanel(props) {\n  let { title, children, value, headerElement, className } = props;\n  const [isOpen, setIsOpen] = useState(false);\n  headerElement ??= h([h(\"div.title\", title), value]);\n  return h(\"div.expandable-details\", { className }, [\n    h(\"div.expandable-details-main\", [\n      h(\"div.expandable-details-header\", headerElement),\n      h(\"div.expandable-details-toggle\", [\n        h(Button, {\n          small: true,\n          minimal: true,\n          active: isOpen,\n          onClick: () => setIsOpen(!isOpen),\n          icon: \"more\",\n        }),\n      ]),\n    ]),\n    h(\n      Collapse,\n      { isOpen },\n      h(\"div.expandable-details-children\", null, children),\n    ),\n  ]);\n}\n\nfunction ExpansionBody({ title, className, children }) {\n  return h(\"div.expansion-body\", { className }, [\n    h(\"div.expansion-panel-detail-header\", title),\n    h(\"div.expansion-panel-detail-body\", null, children),\n  ]);\n}\n\nexport {\n  ExpansionPanel,\n  ExpansionPanelSummary,\n  ExpandableDetailsPanel,\n  SubExpansionPanel,\n  ExpansionBody,\n  PanelSubhead,\n};\n"],"names":[],"version":3,"file":"map-interface.354aaa39.js.map"}

package/dist/cjs/{location-panel.e33becf0.js → map-interface.3934d6d6.js}

@@ -1,7 +1,7 @@
-var $548387e5996cdbbd$exports = require("./header.af864bde.js");
-require("./main.module.13eb33f8.css");
-var $a8d7c4c397e52cf6$exports = require("./main.module.0bbfa859.js");
-var $c3311f59335df34d$exports = require("./container.d2e83c46.js");
+var $548387e5996cdbbd$exports = require("./map-interface.1d19056e.js");
+require("./map-interface.1b386e07.css");
+var $a8d7c4c397e52cf6$exports = require("./map-interface.cd485bb4.js");
+var $c3311f59335df34d$exports = require("./map-interface.bda26b27.js");
 var $ah8rZ$macrostrathyper = require("@macrostrat/hyper");
 var $ah8rZ$classnames = require("classnames");
 var $ah8rZ$macrostratuicomponents = require("@macrostrat/ui-components");
@@ -63,4 +63,4 @@ function $2bc7c1e4e7da7fdf$export$aa4baff5242ea6e1(props) {
 }
 
 
-//# sourceMappingURL=location-panel.e33becf0.js.map
+//# sourceMappingURL=map-interface.3934d6d6.js.map

package/dist/cjs/{location-panel.e33becf0.js.map → map-interface.3934d6d6.js.map}

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,MAAM,0BAAI,CAAA,GAAA,gDAAI,EAAE,MAAM,CAAC,CAAA,GAAA,mDAAK;AAErB,SAAS,0CAAoB,KAAK;IACvC,MAAM,YAAY,CAAA,GAAA,2CAAS,EAAE,cAAc,MAAM,SAAS;IAC1D,OAAO,wBAAE,CAAA,GAAA,mCAAQ,GAAG;QAAE,GAAG,KAAK;mBAAE;IAAU;AAC5C;AAYO,SAAS,0CAAe,KAA0B;IACvD,MAAM,aACJ,SAAS,iBACT,gBAAgB,aAChB,KAAK,WACL,OAAO,YACP,QAAQ,oBACR,mBAAmB,2BACnB,GAAG,MACJ,GAAG;IACJ,MAAM,SACJ,iBACA,wBAAE,CAAA,GAAA,0CAAe,GAAG;iBAAE;QAAS,GAAG,IAAI;IAAC,GAAG;QACxC,SAAS,OAAO,OAAO,wBAAE,MAAM;YAAC;SAAM;KACvC;IACH,OAAO,wBAAE,2CAAqB;mBAAE;IAAU,GAAG;QAC3C;QACA,wBAAE,uBAAuB,wBAAE,CAAA,GAAA,2CAAY,GAAG,wBAAE,kBAAkB;KAC/D;AACH;AAEO,MAAM,4CAAe;AAErB,SAAS,0CAAc,KAAK;IACjC,MAAM,YAAE,QAAQ,aAAE,SAAS,WAAE,UAAU,OAAO,GAAG,MAAM,GAAG;IAC1D,MAAM,MAAM,CAAA,GAAA,2CAAS,EAAE,kBAAkB,WAAW;iBAAE;IAAQ;IAC9D,OAAO,wBAAE,2CAAgB;QAAE,WAAW;QAAK,GAAG,IAAI;IAAC,GAAG;AACxD","sources":["packages/map-interface/src/location-panel/index.ts"],"sourcesContent":["import hyper from \"@macrostrat/hyper\";\nimport { InfoDrawerHeader, InfoDrawerHeaderProps } from \"./header\";\nimport classNames from \"classnames\";\nimport styles from \"./main.module.sass\";\nimport { ErrorBoundary } from \"@macrostrat/ui-components\";\nimport { PanelCard } from \"../container\";\nimport { ComponentType } from \"react\";\n\nconst h = hyper.styled(styles);\n\nexport function InfoDrawerContainer(props) {\n  const className = classNames(\"infodrawer\", props.className);\n  return h(PanelCard, { ...props, className });\n}\n\ntype Component = string | ComponentType<any>;\n\ninterface BaseInfoDrawerProps extends InfoDrawerHeaderProps {\n  className?: string;\n  title?: string;\n  headerElement?: JSX.Element;\n  children?: React.ReactNode;\n  contentContainer?: Component;\n}\n\nexport function BaseInfoDrawer(props: BaseInfoDrawerProps) {\n  const {\n    className,\n    headerElement = null,\n    title,\n    onClose,\n    children,\n    contentContainer = \"div.infodrawer-contents\",\n    ...rest\n  } = props;\n  const header =\n    headerElement ??\n    h(InfoDrawerHeader, { onClose, ...rest }, [\n      title == null ? null : h(\"h3\", [title]),\n    ]);\n  return h(InfoDrawerContainer, { className }, [\n    header,\n    h(\"div.infodrawer-body\", h(ErrorBoundary, h(contentContainer, children))),\n  ]);\n}\n\nexport const DetailsPanel = BaseInfoDrawer;\n\nexport function LocationPanel(props) {\n  const { children, className, loading = false, ...rest } = props;\n  const cls = classNames(\"location-panel\", className, { loading });\n  return h(BaseInfoDrawer, { className: cls, ...rest }, children);\n}\n"],"names":[],"version":3,"file":"location-panel.e33becf0.js.map"}
+{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,MAAM,0BAAI,CAAA,GAAA,gDAAI,EAAE,MAAM,CAAC,CAAA,GAAA,mDAAK;AAErB,SAAS,0CAAoB,KAAK;IACvC,MAAM,YAAY,CAAA,GAAA,2CAAS,EAAE,cAAc,MAAM,SAAS;IAC1D,OAAO,wBAAE,CAAA,GAAA,mCAAQ,GAAG;QAAE,GAAG,KAAK;mBAAE;IAAU;AAC5C;AAYO,SAAS,0CAAe,KAA0B;IACvD,MAAM,aACJ,SAAS,iBACT,gBAAgB,aAChB,KAAK,WACL,OAAO,YACP,QAAQ,oBACR,mBAAmB,2BACnB,GAAG,MACJ,GAAG;IACJ,MAAM,SACJ,iBACA,wBAAE,CAAA,GAAA,0CAAe,GAAG;iBAAE;QAAS,GAAG,IAAI;IAAC,GAAG;QACxC,SAAS,OAAO,OAAO,wBAAE,MAAM;YAAC;SAAM;KACvC;IACH,OAAO,wBAAE,2CAAqB;mBAAE;IAAU,GAAG;QAC3C;QACA,wBAAE,uBAAuB,wBAAE,CAAA,GAAA,2CAAY,GAAG,wBAAE,kBAAkB;KAC/D;AACH;AAEO,MAAM,4CAAe;AAErB,SAAS,0CAAc,KAAK;IACjC,MAAM,YAAE,QAAQ,aAAE,SAAS,WAAE,UAAU,OAAO,GAAG,MAAM,GAAG;IAC1D,MAAM,MAAM,CAAA,GAAA,2CAAS,EAAE,kBAAkB,WAAW;iBAAE;IAAQ;IAC9D,OAAO,wBAAE,2CAAgB;QAAE,WAAW;QAAK,GAAG,IAAI;IAAC,GAAG;AACxD","sources":["packages/map-interface/src/location-panel/index.ts"],"sourcesContent":["import hyper from \"@macrostrat/hyper\";\nimport { InfoDrawerHeader, InfoDrawerHeaderProps } from \"./header\";\nimport classNames from \"classnames\";\nimport styles from \"./main.module.sass\";\nimport { ErrorBoundary } from \"@macrostrat/ui-components\";\nimport { PanelCard } from \"../container\";\nimport { ComponentType } from \"react\";\n\nconst h = hyper.styled(styles);\n\nexport function InfoDrawerContainer(props) {\n  const className = classNames(\"infodrawer\", props.className);\n  return h(PanelCard, { ...props, className });\n}\n\ntype Component = string | ComponentType<any>;\n\ninterface BaseInfoDrawerProps extends InfoDrawerHeaderProps {\n  className?: string;\n  title?: string;\n  headerElement?: JSX.Element;\n  children?: React.ReactNode;\n  contentContainer?: Component;\n}\n\nexport function BaseInfoDrawer(props: BaseInfoDrawerProps) {\n  const {\n    className,\n    headerElement = null,\n    title,\n    onClose,\n    children,\n    contentContainer = \"div.infodrawer-contents\",\n    ...rest\n  } = props;\n  const header =\n    headerElement ??\n    h(InfoDrawerHeader, { onClose, ...rest }, [\n      title == null ? null : h(\"h3\", [title]),\n    ]);\n  return h(InfoDrawerContainer, { className }, [\n    header,\n    h(\"div.infodrawer-body\", h(ErrorBoundary, h(contentContainer, children))),\n  ]);\n}\n\nexport const DetailsPanel = BaseInfoDrawer;\n\nexport function LocationPanel(props) {\n  const { children, className, loading = false, ...rest } = props;\n  const cls = classNames(\"location-panel\", className, { loading });\n  return h(BaseInfoDrawer, { className: cls, ...rest }, children);\n}\n"],"names":[],"version":3,"file":"map-interface.3934d6d6.js.map"}

package/dist/cjs/{main.module.f57e27f2.css → map-interface.4a401c1f.css}

@@ -92,6 +92,11 @@
   position: relative;
 }
 
+.map-view-container_4c0a66.standalone_4c0a66 {
+  width: 100%;
+  height: 100%;
+}
+
 .mapbox-map_4c0a66 {
   position: absolute;
   inset: 0;
@@ -101,6 +106,12 @@
   position: absolute;
 }
 
+.mapbox-map_4c0a66 .mapboxgl-canvas, .mapbox-map_4c0a66 .mapboxgl-canvas-container {
+  position: relative;
+  top: 0;
+  left: 0;
+}
+
 .context-panel-holder_4c0a66 > .bp5-card {
   background-color: var(--panel-background-color);
   padding: 10px;
@@ -405,6 +416,10 @@
 }
 
 @media screen and (width >= 768px) {
+  .map-view-container_4c0a66:not(.standalone_4c0a66) {
+    position: unset;
+  }
+
   .map-ui_4c0a66 {
     flex-direction: row;
     gap: .5em;
@@ -473,10 +488,6 @@
   .context-stack_4c0a66 .context-stack_4c0a66 .spacer_4c0a66, .detail-stack_4c0a66 .context-stack_4c0a66 .spacer_4c0a66 {
     min-height: 1em;
   }
-
-  .map-view-container_4c0a66 {
-    position: unset;
-  }
 }
 
 .map-container_4c0a66 .context-panel-holder_4c0a66 {
@@ -570,4 +581,4 @@
     margin-left: -16em;
   }
 }
-/*# sourceMappingURL=main.module.f57e27f2.css.map */
+/*# sourceMappingURL=map-interface.4a401c1f.css.map */

package/dist/cjs/map-interface.4a401c1f.css.map

@@ -0,0 +1 @@
+{"mappings":"AAAA;;;;;;;;;;AAUI;;;;AAGF;;;;;;AAOA;;;;AAIE;;;;AAGF;;;;AAGA;;;;AAGA;;;;AAME;;;;AAGF;;;;AAIE;;;;;AAME;;;;;;;;;;;;;;;;;;;;;;AAiBJ;;;;;;;;;AAOA;;;;;;;;;;AAYF;;;;;;;;;;AAUE;;;;AAGA;;;;;;;;;;;AAWE;;;;;;;;;;;AAQF;;;;AAGA;;;;AAGE;;;;AAEJ;;;;;AAKI;;;;;;;;;AAKJ;;;;;;;;;AAOE;;;;;;;;;;;;;;AASA;;;;;;;AAKA;;;;;;;;;;;;;;;;;AAYA;;;;;AAGF;;;;AAGE;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsBA;;;;;;;;AAKA;;;;;;;;AAKA;;;;;AAEF;;;;;AAIA;;;;AAGE;;;;AAGE;;;;AAGA;;;;AAIA;;;;AAGF;;;;AAGA;;;;;;;;AAME;;;;AAGA;;;;AAGA;;;;AAGA;;;;AAGA;;;;AAGA;;;;AAGA;;;;AAGA;;;;AAIE;;;;;;;;;;;;;;;;AAcJ;;;;;;;;;;;;;;;;;;;;;;;AAqBA;;;;;;;;;;;;AAaF;EAAA;;;;;;EAME;;;;;;EAGF;;;;EAIE;;;;EAGA;;;;;;;;;;;;;;;;EAyBF;;;;EAGI;;;;;;;EAMA;;;;;;;;;;;;;;;;;;;;;;;;;EAoBJ;;;;;EAOE;;;;EAIA;;;;;;;;;;;EASE;;;;;EAIA;;;;EAIA;;;;EAGE;;;;;AAQF;;;;;AAIA;;;;;AAIE;;;;AAGF;;;;;;;;AASE;;;;AAGA;;;;AAGA;;;;AAGF;;;;AAQA;;;;AAGA;;;;;;;;;EAQF;;;;EAGA;;;;;EAOI;;;;EAGA;;;;;;;;;;;;;;AAaF;EACE;;;;EAGA;;;;EAGA","sources":["packages/map-interface/src/main.module.sass"],"sourcesContent":[".map-container\n  display: flex\n  flex-direction: column\n  position: relative\n  width: 100%\n  height: 100%\n  overflow: hidden\n  --map-panel-border-radius: 4px\n\n  &.show-panel-outlines\n    .map-view-container\n      outline: 2px dotted dodgerblue\n\n  &.fit-viewport\n    height: 100vh\n    width: 100vw\n    /* mobile viewport bug fix */\n    max-height: -webkit-fill-available\n\n  // Compass display\n  .compass-control\n    display: none\n\n  &.map-is-rotated\n    .compass-control\n      display: block\n\n  .map-3d-control\n    display: none\n\n  &.map-3d-available .map-3d-control\n    display: block\n\n  &.map-is-rotated.map-3d-available .map-3d-control\n    display: none\n\n  .globe-control\n    display: none\n\n    svg\n      color: var(--secondary-color)\n\n  &.map-is-global .globe-control\n    display: block\n\n  &.detail-panel-open\n    .zoom-control\n      opacity: 0\n      display: none\n\n  &.detail-panel-fixed\n    .detail-panel-holder\n      & > *\n        border-radius: unset\n\n.detail-panel-holder\n  display: flex\n  flex-direction: column\n  min-height: 0\n\n  & > *\n    flex: 1\n\n\n.map-control-stack\n  display: flex\n  flex-direction: column\n  width: 30em\n  margin-left: -30em\n  pointer-events: none\n\n.main-row\n  flex: 1\n  display: flex\n  flex-direction: row\n  position: relative\n  max-height: 100%\n  min-height: 0\n\n.map-ui\n  flex: 1\n  position: relative\n  display: flex\n  flex-direction: column\n  max-height: 100%\n  height: 100%\n  box-shadow: 0 0 10px 4px var(--card-shadow-color)\n\n.map-view-container\n  flex-grow: 1\n  position: relative\n  overflow: hidden\n  &.standalone\n    height: 100%\n    width: 100%\n\n.mapbox-map\n  position: absolute\n  top: 0\n  bottom: 0\n  left: 0\n  right: 0\n\n  &:global(.mapboxgl-map)\n    // override the default mapbox position: relative in all cases\n    position: absolute\n\n\n  /** These styles seem to help with weird map zooming behavior */\n  :global(.mapboxgl-canvas), :global(.mapboxgl-canvas-container)\n    position: relative\n    left: 0\n    top: 0\n\n\n.context-panel-holder > :global(.bp5-card)\n  padding: 10px\n  background-color: var(--panel-background-color)\n\n.panel-card, .panel-card:global(.bp5-card)\n  padding: var(--panel-padding, 10px)\n  background-color: var(--panel-background-color)\n  overflow: hidden\n  border-radius: var(--map-panel-border-radius)\n\n  & > :last-child\n    margin-bottom: 0\n\n:global(.bp5-dark) .panel-card\n  background-color: var(--panel-background-color)\n\n.context-stack\n  & > div\n    flex-shrink: 1\n\n  & > .searchbar\n    flex: 0\n\n.context-stack,\n.detail-stack\n  z-index: 10\n  max-height: 100%\n\n.panel-container\n  display: flex\n  flex-direction: column\n\n  & > div\n    pointer-events: all\n\n.panel-title\n  font-size: 16px\n\n.spacer\n  flex-grow: 1\n  pointer-events: none\n\n.map-view-container\n  flex-grow: 1\n  position: relative\n  overflow: hidden\n\n.searchbar-holder\n  margin-bottom: 0.5em\n\n.right-panel\n  width: 24em\n\n.buttons\n  display: flex\n  flex-direction: row\n  flex: 1\n  min-width: 0\n\n.tab-button\n  flex-shrink: 1\n  min-width: 40px\n  overflow: hidden\n  text-align: right\n\n  & :global(.bp5-button-text)\n    transition: all 0.2s\n    transition-delay: 0.1s\n\n  .menu-card.narrow-card .panel-header:not(.minimal) &:global(.bp5-active) ~ & :global(.bp5-button-text)\n    width: 0\n    opacity: 0\n    margin-left: -7px\n\n  .context-panel-leave .menu-card .panel-header & :global(.bp5-button-text)\n    opacity: 0\n    width: 0\n\n.narrow-card.narrow-enter .panel-header .buttons\n  margin-right: -500px\n\n.panel-header.minimal .tab-button:not(:hover):not(:global(.bp5-active))\n  padding-left: 0\n  padding-right: 0\n  min-width: 30px\n  width: 30px\n\n.panel-header.minimal .tab-button:not(:hover) :global(.bp5-button-text)\n  width: 0\n  opacity: 0\n  margin-left: -7px\n\n.menu-group\n  margin-bottom: 0.5em\n  margin-top: 0.2em\n\n.menu-card :global .bp5-text ul,\n.menu-card :global .text-panel ul\n  padding-left: 1em\n\n.menu-content\n  display: flex\n  flex-direction: column\n  margin-bottom: -8px\n\n  & .bp5-button-group\n    margin-bottom: 4px\n\n  & hr\n    width: 100%\n\n:global\n  .mapbox-map\n    .mapbox-compass, .mapbox-3d\n      display: none\n\n  .mapboxgl-ctrl.mapbox-3d.mapbox-control\n    width: unset\n\n  .mapboxgl-ctrl.mapbox-3d.mapbox-control button\n    width: unset\n    padding-inline: 4px\n\n  .mapboxgl-canvas-container\n    width: 100%\n    height: 100%\n\n  .mapboxgl-ctrl.mapboxgl-ctrl-attrib\n    background-color: var(--translucent-panel-background-color) !important\n\n  .mapboxgl-ctrl.mapboxgl-ctrl-attrib a\n    color: var(--text-color)\n\n  .mapboxgl-marker svg path\n    fill: var(--panel-background-color) !important\n\n  .mapboxgl-marker svg circle\n    fill: var(--secondary-color) !important\n\n  .mapbox-control.mapbox-zoom\n    background: var(--translucent-panel-background-inner)\n\n  .mapbox-control.mapbox-zoom svg\n    fill: var(--text-color) !important\n\n  .mapboxgl-ctrl-logo\n    transform: scale(0.9) translate(-8px, 2px)\n\n  .bp5-dark\n    .mapboxgl-ctrl-group\n      background-color: var(--panel-background-color)\n\n    .mapboxgl-ctrl-logo\n      filter: invert(100%)\n\n  .mapboxgl-ctrl-group button + button\n    border-top: 1px solid var(--panel-rule-color) !important\n\n  .bp5-dark .mapboxgl-ctrl-group .mapboxgl-ctrl-icon\n    filter: invert(40%)\n\n  .bp5-dark .mapboxgl-ctrl-group .mapboxgl-ctrl-icon:hover\n    filter: invert(50%)\n\n  .mapboxgl-ctrl-geolocate .mapboxgl-ctrl-icon\n    filter: invert(40%)\n\n  .mapboxgl-ctrl-geolocate .mapboxgl-ctrl-icon:hover\n    filter: invert(50%)\n\n.detail-stack\n  position: relative\n\n.detail-panel-container, .map-right-controls\n  flex: 1\n\n\n.zoom-control\n  transition: opacity 1s ease-in-out\n  width: 30px\n  position: absolute\n  top: 0\n  right: 0\n\n.map-controls\n  display: flex\n  flex-direction: row\n  justify-content: right\n  margin-bottom: 0\n  gap: 0.5em\n\n  :global(.map-control)\n    & > :global(.bp5-button)\n      padding: 0\n      transform: translate(-3.5px, -3.5px)\n      width: 22px !important\n\n\n.map-controls :global(.mapbox-control),\n.map-controls :global(.map-control-wrapper),\n.map-controls :global(.map-control)\n  max-height: 22px\n  height: 22px\n  border-radius: 4px\n  background-color: var(--panel-background-color)\n  box-shadow: 0 0 0 1px var(--card-shadow-color)\n\n.map-controls :global(.mapbox-control) button,\n.map-controls :global(.map-control-wrapper) button,\n.map-controls :global(.map-control) button\n  max-height: 22px\n  height: 22px\n  width: 22px\n  max-width: 22px\n  background-position: center center\n  padding: 0\n//background-color: var(--panel-background-color)\n//color: var(--text-color)\n\n//.map-controls :global(.mapbox-control) button:hover,\n//.map-controls :global(.map-control-wrapper) button:hover,\n//.map-controls .map-control button:hover\n//  background-color: var(--panel-background-color) !important\n\n.map-controls .map-scale-control\n  background: none\n  box-shadow: none\n  padding-top: 8px\n\n  :global(.mapboxgl-ctrl-scale)\n    background-color: var(--translucent-panel-background-color)\n    border-color: var(--secondary-text-color)\n    color: var(--secondary-text-color)\n\n// .map-container.detail-panel-fixed\n//   right: 30em\n\n/* For mobile phones, we want to make the most of screen space,\n which in some cases means adding complications to the basic page. */\n@media only screen and (max-width: 768px)\n  .map-container.detail-panel-enter .context-stack\n    height: 0\n    visibility: hidden\n    transition: height 0.5s ease-in-out\n\n  .detail-stack\n    height: fit-content\n    position: inherit\n    max-height: 70%\n\n  .infodrawer-stack\n    max-height: 70%\n\n    &:global(.exit-active)\n      max-height: 0\n\n  :global(.mapbox-control.mapbox-zoom)\n    display: none\n\n  .map-controls\n    position: absolute\n    top: -60px\n    right: 10px\n\n  .detail-panel\n    border-radius: 0px\n\n\n/* Desktop styling is necessarily much more complicated than mobile\n to handle a two-column layout. */\n@media screen and (min-width: 768px)\n  /* Make map fill page rather than containing div,\n   by unsetting map position */\n  // We should move this to another file.\n\n  .map-view-container:not(.standalone)\n    position: unset\n\n\n  .map-ui\n    flex-direction: row\n    padding: 1em 1em 2em\n    min-height: 80px\n    gap: 0.5em\n\n  .context-stack\n    max-width: var(--map-context-stack-max-width, 34em)\n    min-width: 14em\n    transition: width 300ms ease\n    padding-bottom: 0.5em\n    width: var(--map-context-stack-width, 16em)\n    margin-right: 0.5em\n    display: flex\n    flex-direction: column\n\n\n    &.adaptive-width\n      width: var(--map-context-stack-width, none)\n      max-width: var(--map-context-stack-max-width, none)\n      transition: width 300ms ease\n\n    :global(.bp5-navbar)\n      //height: unset\n      //padding: 5px\n      h1, h2, h3\n        margin: 0\n\n    & > .spacer\n      flex-grow: 0\n\n  .context-panel-holder\n    min-height: 0\n    position: relative\n\n    & > div\n      max-height: 100%\n\n  .detail-stack\n    width: var(--map-detail-stack-width, 30em)\n    display: flex\n    flex-direction: column\n\n  .context-stack, .detail-stack\n    pointer-events: none\n    z-index: 10\n\n    & > div\n      pointer-events: all\n      margin-bottom: 0.5em\n\n      &:last-child\n        margin-bottom: 0\n\n      &.spacer\n        pointer-events: none\n\n    .context-stack .spacer\n      min-height: 1em\n\n/** CSS Transitions **/\n\n.map-container\n  // Context panel\n  .context-panel-holder\n    pointer-events: none\n    flex: 1\n\n    & > div\n      pointer-events: all\n      transition: opacity 0.8s ease\n  //, height 0.8s ease, max-height 0.8s ease, padding 0.8s ease\n\n  &.context-panel-from .context-panel-holder > div\n    opacity: 0\n\n  &.context-panel-enter .context-panel-holder > div\n    opacity: 1\n\n  &.context-panel-leave .context-panel-holder > div\n    opacity: 0\n\n  // Detail panel (floating)\n  &.detail-panel-floating\n    // We assume that the relevant panel is the first child of the stack.\n    &.detail-panel-from .detail-panel-holder\n      opacity: 0\n\n    &.detail-panel-enter .detail-panel-holder\n      opacity: 1\n\n    &.detail-panel-leave .detail-panel-holder\n      opacity: 0\n\n    .detail-panel\n      transition: opacity 0.8s ease, height 0.8s ease, max-height 0.8s ease\n\n  // TODO: these styles have not been evaluated for mobile\n  &.detail-panel-fixed\n    .map-ui\n      transition: margin-right 0.8s ease\n\n    .detail-stack\n      transition: margin-right 0.8s ease\n\n    &.detail-panel-from .detail-panel-holder\n      margin-right: calc(-1 * var(--map-detail-stack-width, 30em))\n\n    &.detail-panel-enter .detail-panel-holder\n      margin-right: 0\n\n    &.detail-panel-leave .detail-panel-holder\n      margin-right: calc(-1 * var(--map-detail-stack-width, 30em))\n\n\n// The max-height transition is a bit jerky because of panel padding.\n// We could probably fix this by pulling the panel container itself into\n// the class.\n//max-height: 0\n//padding: 0i\n\n@media only screen and (max-width: 768px)\n  .map-container .detail-stack\n    transition: opacity 0.8s ease, height 0.8s ease, max-height 0.8s ease\n\n  .map-container.detail-panel-from .detail-stack\n    max-height: 0\n    height: 0\n\n  .map-container.detail-panel-leave .detail-stack\n    max-height: 0\n\n  .map-container.context-panel-from .context-panel\n    max-height: 0\n    height: 0\n\n  .map-container.context-panel-leave\n    .context-stack\n      .context-panel-holder\n        flex: 0\n\n      .spacer\n        flex: 1\n\n\n// Shift UI around to center elements if we're in the global view\n@media only screen and (min-width: 768px)\n  .map-container.detail-panel-leave .map-view-container\n    margin-right: -14em\n\n  .map-container.map-is-global.detail-panel-leave .map-view-container\n    margin-right: -30em\n\n  .map-container.map-is-global.context-panel-leave .map-view-container\n    margin-left: -16em\n"],"names":[],"version":3,"file":"map-interface.4a401c1f.css.map"}

package/dist/cjs/{xray.a23f8660.js → map-interface.4c5addca.js}

@@ -18,7 +18,7 @@ async function $8646508ae99a5857$export$eff5fb2e10d05b1d(baseStyle, params = nul
     const sources = xRaySources ?? Object.keys(style.sources);
     let layers = [];
     for (let layer of style.layers){
-        if (!sources.includes(layer.source)) {
+        if ("source" in layer && typeof layer.source === "string" && !sources.includes(layer.source)) {
             layers.push(layer);
             continue;
         }
@@ -86,4 +86,4 @@ async function $8646508ae99a5857$export$e739dc8dfc0db9a6(baseStyle, overlayStyle
 }
 
 
-//# sourceMappingURL=xray.a23f8660.js.map
+//# sourceMappingURL=map-interface.4c5addca.js.map

package/dist/cjs/map-interface.4c5addca.js.map

@@ -0,0 +1 @@
+{"mappings":";;;;;;;;;;;;AAWO,eAAe,0CACpB,SAA0B,EAC1B,SAAsB,IAAI;IAE1B,MAAM,cACJ,aAAa,cACb,QAAQ,kCACR,WAAW,eACX,WAAW,EACZ,GAAG;IACJ,MAAM,QAAQ,MAAM,CAAA,GAAA,2CAAa,EAAE,WAAW;QAAE,cAAc;IAAY;IAC1E,MAAM,UAAU,eAAe,OAAO,IAAI,CAAC,MAAM,OAAO;IAExD,IAAI,SAAS,EAAE;IACf,KAAK,IAAI,SAAS,MAAM,MAAM,CAAE;QAC9B,IACE,YAAY,SACZ,OAAO,MAAM,MAAM,KAAK,YACxB,CAAC,QAAQ,QAAQ,CAAC,MAAM,MAAM,GAC9B;YACA,OAAO,IAAI,CAAC;YACZ;QACF;QACA,IAAI,WAAW,2CAAqB,OAAO,OAAO;QAClD,IAAI,YAAY,MACd,OAAO,IAAI,CAAC;IAEhB;IAEA,OAAO;QACL,GAAG,KAAK;gBACR;IACF;AACF;AAEA,SAAS,2CAAqB,KAAK,EAAE,KAAK,EAAE,UAAU;IACpD,MAAM,IAAI,CAAA,GAAA,yCAAY,EAAE;IACxB,MAAM,YAAY,CAAC,UAAU,CAAC,EAAE,SAAS,CAAC;QACxC,IAAI,CAAC,YACH,OAAO,CAAA,GAAA,wCAAW,EAAE,EAAE,MAAM,CAAC,IAAI,QAAQ,KAAK,CAAC;QAEjD,OAAO,CAAA,GAAA,wCAAW,EAAE,EAAE,KAAK,CAAC,SAAS,MAAM,CAAC;IAC9C;IAEA,IAAI,MAAM,IAAI,IAAI,cAChB,OAAO;IAGT,IAAI,WAAW;QAAE,GAAG,KAAK;IAAC;IAE1B,QAAQ,GAAG,CAAC,UAAU;IAEtB,IAAI,MAAM,IAAI,IAAI,QAChB,SAAS,KAAK,GAAG;QACf,cAAc,UAAU;QACxB,sBAAsB,UAAU;IAClC;SACK,IAAI,MAAM,IAAI,IAAI,QACvB,SAAS,KAAK,GAAG;QACf,cAAc,UAAU,KAAK;QAC7B,cAAc;IAChB;SACK,IAAI,MAAM,IAAI,IAAI,UACvB,SAAS,KAAK,GAAG;QACf,cAAc,UAAU,GAAG;QAC3B,mBAAmB;IACrB;SACK,IAAI,MAAM,IAAI,IAAI,UACvB,SAAS,KAAK,GAAG;QACf,gBAAgB,UAAU,KAAK;QAC/B,uBAAuB,UAAU,KAAK;QACtC,iBAAiB;IACnB;IAGF,OAAO;AACT;AAMO,eAAe,0CACpB,SAAkC,EAClC,eAA+C,IAAI,EACnD,SAAgC,CAAC,CAAC;IAElC,MAAM,eACJ,WAAW,QACX,OAAO,OACP,aAAa,YAAY,EACzB,GAAG,MACJ,GAAG;IACJ,IAAI,cAAc;IAClB,IAAI,QAAQ,MAAM,CAAA,GAAA,2CAAa,EAAE,WAAW;QAC1C,cAAc;IAChB;IAEA,IAAI,gBAAgB,MAAM;QACxB,MAAM,UAAU,MAAM,CAAA,GAAA,2CAAa,EAAE,cAAc;YACjD,cAAc;QAChB;QACA,QAAQ,CAAA,GAAA,wCAAU,EAAE,OAAO;QAC3B,gBAAgB,OAAO,IAAI,CAAC,QAAQ,OAAO;IAC7C;IAEA,IAAI,MAAM;QACR,8DAA8D;QAC9D,gBAAgB,OAAO,IAAI,CAAC,MAAM,OAAO;QAEzC,QAAQ,MAAM,0CAAe,OAAO;YAAE,GAAG,IAAI;yBAAE;yBAAa;QAAY;IAC1E;IACA,OAAO;AACT","sources":["packages/map-interface/src/dev/xray.ts"],"sourcesContent":["import { getMapboxStyle, mergeStyles } from \"@macrostrat/mapbox-utils\";\nimport { asChromaColor, toRGBAString } from \"@macrostrat/color-utils\";\nimport mapboxgl from \"mapbox-gl\";\n\ninterface XRayOptions {\n  color?: string;\n  inDarkMode?: boolean;\n  mapboxToken?: string;\n  xRaySources?: string[];\n}\n\nexport async function buildXRayStyle(\n  baseStyle: string | object,\n  params: XRayOptions = null,\n) {\n  const {\n    inDarkMode = false,\n    color = \"rgb(74, 242, 161)\",\n    mapboxToken,\n    xRaySources,\n  } = params;\n  const style = await getMapboxStyle(baseStyle, { access_token: mapboxToken });\n  const sources = xRaySources ?? Object.keys(style.sources);\n\n  let layers = [];\n  for (let layer of style.layers) {\n    if (\n      \"source\" in layer &&\n      typeof layer.source === \"string\" &&\n      !sources.includes(layer.source)\n    ) {\n      layers.push(layer);\n      continue;\n    }\n    let newLayer = transformMapboxLayer(layer, color, inDarkMode);\n    if (newLayer != null) {\n      layers.push(newLayer);\n    }\n  }\n\n  return {\n    ...style,\n    layers,\n  };\n}\n\nfunction transformMapboxLayer(layer, color, inDarkMode) {\n  const c = asChromaColor(color);\n  const xRayColor = (opacity = 1, darken = 0) => {\n    if (!inDarkMode) {\n      return toRGBAString(c.darken(2 - darken).alpha(opacity));\n    }\n    return toRGBAString(c.alpha(opacity).darken(darken));\n  };\n\n  if (layer.type == \"background\") {\n    return null;\n  }\n\n  let newLayer = { ...layer };\n\n  console.log(xRayColor(0.5));\n\n  if (layer.type == \"fill\") {\n    newLayer.paint = {\n      \"fill-color\": xRayColor(0.1),\n      \"fill-outline-color\": xRayColor(0.5),\n    };\n  } else if (layer.type == \"line\") {\n    newLayer.paint = {\n      \"line-color\": xRayColor(0.5, 0),\n      \"line-width\": 1.5,\n    };\n  } else if (layer.type == \"symbol\") {\n    newLayer.paint = {\n      \"text-color\": xRayColor(1, -0.5),\n      \"text-halo-color\": \"#000\",\n    };\n  } else if (layer.type == \"circle\") {\n    newLayer.paint = {\n      \"circle-color\": xRayColor(0.5, 0),\n      \"circle-stroke-color\": xRayColor(0.5, 1),\n      \"circle-radius\": 2,\n    };\n  }\n\n  return newLayer;\n}\n\ntype InspectorStyleOptions = XRayOptions & {\n  xRay?: boolean;\n};\n\nexport async function buildInspectorStyle(\n  baseStyle: mapboxgl.Style | string,\n  overlayStyle: mapboxgl.Style | string | null = null,\n  params: InspectorStyleOptions = {},\n) {\n  const {\n    mapboxToken,\n    xRay = false,\n    xRaySources: _xRaySources,\n    ...rest\n  } = params;\n  let xRaySources = _xRaySources;\n  let style = await getMapboxStyle(baseStyle, {\n    access_token: mapboxToken,\n  });\n\n  if (overlayStyle != null) {\n    const overlay = await getMapboxStyle(overlayStyle, {\n      access_token: mapboxToken,\n    });\n    style = mergeStyles(style, overlay);\n    xRaySources ??= Object.keys(overlay.sources);\n  }\n\n  if (xRay) {\n    // If we haven't specified sources, then we'll use all of them\n    xRaySources ??= Object.keys(style.sources);\n\n    style = await buildXRayStyle(style, { ...rest, mapboxToken, xRaySources });\n  }\n  return style;\n}\n"],"names":[],"version":3,"file":"map-interface.4c5addca.js.map"}

package/dist/cjs/{helpers.0f72ddaf.js → map-interface.5813e876.js}

@@ -1,4 +1,4 @@
-var $3490fc4f4bda12f7$exports = require("./utils.26f02633.js");
+var $3490fc4f4bda12f7$exports = require("./map-interface.ffb109ef.js");
 var $dSfMz$macrostratmapboxreact = require("@macrostrat/mapbox-react");
 var $dSfMz$react = require("react");
 var $dSfMz$underscore = require("underscore");
@@ -20,6 +20,8 @@ $parcel$export(module.exports, "MapPaddingManager", () => $2611a7b4364593e5$expo
 $parcel$export(module.exports, "MapMovedReporter", () => $2611a7b4364593e5$export$f6eeee399afc4e9a);
 $parcel$export(module.exports, "MapLoadingReporter", () => $2611a7b4364593e5$export$e57f9eaa51773f82);
 $parcel$export(module.exports, "MapMarker", () => $2611a7b4364593e5$export$5c90a91c7455938c);
+$parcel$export(module.exports, "useBasicMapStyle", () => $2611a7b4364593e5$export$6daf1520df36ae21);
+$parcel$export(module.exports, "getBasicMapStyle", () => $2611a7b4364593e5$export$3503bf0b3851527b);
 $parcel$export(module.exports, "useBasicStylePair", () => $2611a7b4364593e5$export$566518253d2584f8);
 
 
@@ -181,10 +183,26 @@ function $2611a7b4364593e5$export$5c90a91c7455938c({ position: position, setPosi
     ]);
     return null;
 }
-function $2611a7b4364593e5$export$566518253d2584f8() {
+function $2611a7b4364593e5$export$6daf1520df36ae21(opts = {}) {
+    const { styleType: styleType } = opts;
     const inDarkMode = (0, $dSfMz$macrostratuicomponents.useInDarkMode)();
-    return inDarkMode ? "mapbox://styles/mapbox/dark-v10" : "mapbox://styles/mapbox/light-v10";
+    const props = (0, $dSfMz$react.useMemo)(()=>{
+        return {
+            styleType: styleType,
+            inDarkMode: inDarkMode
+        };
+    }, [
+        styleType,
+        inDarkMode
+    ]);
+    return $2611a7b4364593e5$export$3503bf0b3851527b(props);
+}
+function $2611a7b4364593e5$export$3503bf0b3851527b(opts) {
+    const { styleType: styleType = "macrostrat", inDarkMode: inDarkMode = false } = opts ?? {};
+    if (styleType == "macrostrat") return inDarkMode ? "mapbox://styles/jczaplewski/cl5uoqzzq003614o6url9ou9z?optimize=true" : "mapbox://styles/jczaplewski/clatdbkw4002q14lov8zx0bm0?optimize=true";
+    else return inDarkMode ? "mapbox://styles/mapbox/dark-v10" : "mapbox://styles/mapbox/light-v10";
 }
+const $2611a7b4364593e5$export$566518253d2584f8 = $2611a7b4364593e5$export$6daf1520df36ae21;
 
 
-//# sourceMappingURL=helpers.0f72ddaf.js.map
+//# sourceMappingURL=map-interface.5813e876.js.map

package/dist/cjs/map-interface.5813e876.js.map

@@ -0,0 +1 @@
+{"mappings":"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","sources":["packages/map-interface/src/helpers.ts"],"sourcesContent":["import {\n  useMapRef,\n  useMapEaseTo,\n  useMapDispatch,\n  useMapStatus,\n  useMapInitialized,\n} from \"@macrostrat/mapbox-react\";\nimport { useMemo, useRef } from \"react\";\nimport { debounce } from \"underscore\";\nimport useResizeObserver from \"use-resize-observer\";\n\nimport { getMapPosition } from \"@macrostrat/mapbox-utils\";\nimport mapboxgl from \"mapbox-gl\";\nimport { useCallback, useEffect, useState } from \"react\";\nimport { getMapPadding, useMapMarker } from \"./utils\";\nimport { useInDarkMode } from \"@macrostrat/ui-components\";\n\nexport function MapResizeManager({ containerRef }) {\n  const mapRef = useMapRef();\n\n  const debouncedResize = useRef(\n    debounce(() => {\n      mapRef.current?.resize();\n    }, 100),\n  );\n\n  useResizeObserver({\n    ref: containerRef,\n    onResize: debouncedResize.current,\n  });\n\n  return null;\n}\n\ninterface MapPaddingManagerProps {\n  containerRef: React.RefObject<HTMLDivElement>;\n  parentRef: React.RefObject<HTMLDivElement>;\n  infoMarkerPosition: mapboxgl.LngLatLike;\n  debounceTime?: number;\n}\n\nexport function MapPaddingManager({\n  containerRef,\n  parentRef,\n  infoMarkerPosition,\n  debounceTime = 200,\n}: MapPaddingManagerProps) {\n  const mapRef = useMapRef();\n\n  const [padding, setPadding] = useState(\n    getMapPadding(containerRef, parentRef),\n  );\n\n  const _updateMapPadding = useCallback(() => {\n    const newPadding = getMapPadding(containerRef, parentRef);\n    setPadding(newPadding);\n  }, [containerRef.current, parentRef.current]);\n\n  const updateMapPadding = useMemo(\n    () => debounce(_updateMapPadding, debounceTime),\n    [_updateMapPadding, debounceTime],\n  );\n\n  useEffect(() => {\n    const map = mapRef.current;\n    if (map == null) return;\n    // Update map padding on load\n    updateMapPadding();\n  }, [mapRef.current]);\n\n  useResizeObserver({\n    ref: parentRef,\n    onResize(sz) {\n      updateMapPadding();\n    },\n    round(n) {\n      return Math.round(n);\n    },\n  });\n\n  // Ideally, we would not have to do this when we know the infobox is loaded\n  useMapEaseTo({ center: infoMarkerPosition, padding });\n\n  return null;\n}\n\nexport function MapMovedReporter({ onMapMoved = null }) {\n  const mapRef = useMapRef();\n  const dispatch = useMapDispatch();\n  const isInitialized = useMapInitialized();\n\n  const mapMovedCallback = useCallback(() => {\n    const map = mapRef.current;\n    if (map == null) return;\n    const mapPosition = getMapPosition(map);\n    dispatch({ type: \"map-moved\", payload: mapPosition });\n    onMapMoved?.(mapPosition, map);\n  }, [onMapMoved, dispatch, isInitialized]);\n\n  useEffect(() => {\n    // Get the current value of the map. Useful for gradually moving away\n    // from class component\n    const map = mapRef.current;\n    if (map == null) return;\n    // Update the URI when the map moves\n    mapMovedCallback();\n    const cb = debounce(mapMovedCallback, 100);\n    map.on(\"moveend\", cb);\n    return () => {\n      map?.off(\"moveend\", cb);\n    };\n  }, [mapMovedCallback]);\n  return null;\n}\n\ninterface MapLoadingReporterProps {\n  ignoredSources?: string[];\n  onMapLoading?: (evt: mapboxgl.MapEvent) => void;\n  onMapIdle?: (evt: mapboxgl.MapEvent) => void;\n  mapIsLoading?: boolean;\n}\n\nexport function MapLoadingReporter({\n  ignoredSources,\n  onMapLoading = null,\n  onMapIdle = null,\n  mapIsLoading,\n}: MapLoadingReporterProps) {\n  const mapRef = useMapRef();\n  const loadingRef = useRef(false);\n  const dispatch = useMapDispatch();\n  const isInitialized = useMapInitialized();\n\n  useEffect(() => {\n    const map = mapRef.current;\n    const mapIsLoading = loadingRef.current;\n    if (map == null) return;\n\n    let didSendLoading = false;\n\n    const loadingCallback = (evt) => {\n      if (ignoredSources.includes(evt.sourceId) || mapIsLoading) return;\n      if (didSendLoading) return;\n      onMapLoading?.(evt);\n      dispatch({ type: \"set-loading\", payload: true });\n      loadingRef.current = true;\n      didSendLoading = true;\n    };\n    const idleCallback = (evt) => {\n      if (!mapIsLoading) return;\n      dispatch({ type: \"set-loading\", payload: false });\n      loadingRef.current = false;\n      onMapIdle?.(evt);\n    };\n    map.on(\"sourcedataloading\", loadingCallback);\n    map.on(\"idle\", idleCallback);\n    return () => {\n      map?.off(\"sourcedataloading\", loadingCallback);\n      map?.off(\"idle\", idleCallback);\n    };\n  }, [ignoredSources, mapIsLoading, isInitialized]);\n  return null;\n}\n\nexport function MapMarker({ position, setPosition, centerMarker = true }) {\n  const mapRef = useMapRef();\n  const markerRef = useRef(null);\n  const isInitialized = useMapInitialized();\n\n  useMapMarker(mapRef, markerRef, position);\n\n  useEffect(() => {\n    const map = mapRef.current;\n    if (map == null || setPosition == null) return;\n\n    const handleMapClick = (event: mapboxgl.MapMouseEvent) => {\n      setPosition(event.lngLat, event, mapRef.current);\n      // We should integrate this with the \"easeToCenter\" hook\n      if (centerMarker) {\n        mapRef.current?.flyTo({ center: event.lngLat, duration: 800 });\n      }\n    };\n\n    map.on(\"click\", handleMapClick);\n\n    return () => {\n      map?.off(\"click\", handleMapClick);\n    };\n  }, [setPosition, isInitialized]);\n\n  return null;\n}\n\nexport function useBasicMapStyle(\n  opts: {\n    styleType?: \"macrostrat\" | \"standard\";\n  } = {},\n) {\n  const { styleType } = opts;\n  const inDarkMode = useInDarkMode();\n\n  const props = useMemo(() => {\n    return { styleType, inDarkMode };\n  }, [styleType, inDarkMode]);\n\n  return getBasicMapStyle(props);\n}\n\nexport function getBasicMapStyle(opts: {\n  styleType?: \"macrostrat\" | \"standard\";\n  inDarkMode?: boolean;\n}) {\n  const { styleType = \"macrostrat\", inDarkMode = false } = opts ?? {};\n\n  if (styleType == \"macrostrat\") {\n    return inDarkMode\n      ? \"mapbox://styles/jczaplewski/cl5uoqzzq003614o6url9ou9z?optimize=true\"\n      : \"mapbox://styles/jczaplewski/clatdbkw4002q14lov8zx0bm0?optimize=true\";\n  } else {\n    return inDarkMode\n      ? \"mapbox://styles/mapbox/dark-v10\"\n      : \"mapbox://styles/mapbox/light-v10\";\n  }\n}\n\nexport const useBasicStylePair = useBasicMapStyle;\n"],"names":[],"version":3,"file":"map-interface.5813e876.js.map"}

package/dist/cjs/{dev.e6613cda.js → map-interface.5cea0ff4.js}

@@ -1,7 +1,7 @@
-var $6f5ca387ac26c0b5$exports = require("./map-page.1e1970d8.js");
-var $abbe8d0af34cbbed$exports = require("./tile-extent.06a4b2ed.js");
-var $db14eb7a5c07abdb$exports = require("./vector-tile-features.77121785.js");
-var $8646508ae99a5857$exports = require("./xray.a23f8660.js");
+var $6f5ca387ac26c0b5$exports = require("./map-interface.17e81e8a.js");
+var $abbe8d0af34cbbed$exports = require("./map-interface.175c4635.js");
+var $db14eb7a5c07abdb$exports = require("./map-interface.e9bcd5c0.js");
+var $8646508ae99a5857$exports = require("./map-interface.4c5addca.js");
 
 
 function $parcel$exportWildcard(dest, source) {
@@ -30,4 +30,4 @@ $parcel$exportWildcard(module.exports, $db14eb7a5c07abdb$exports);
 $parcel$exportWildcard(module.exports, $8646508ae99a5857$exports);
 
 
-//# sourceMappingURL=dev.e6613cda.js.map
+//# sourceMappingURL=map-interface.5cea0ff4.js.map

package/dist/cjs/{dev.e6613cda.js.map → map-interface.5cea0ff4.js.map}

@@ -1 +1 @@
-{"mappings":"","sources":["packages/map-interface/src/dev/index.ts"],"sourcesContent":["export * from \"./map-page\";\nexport * from \"./tile-extent\";\nexport * from \"./vector-tile-features\";\nexport * from \"./xray\";\n"],"names":[],"version":3,"file":"dev.e6613cda.js.map"}
+{"mappings":"","sources":["packages/map-interface/src/dev/index.ts"],"sourcesContent":["export * from \"./map-page\";\nexport * from \"./tile-extent\";\nexport * from \"./vector-tile-features\";\nexport * from \"./xray\";\n"],"names":[],"version":3,"file":"map-interface.5cea0ff4.js.map"}

package/dist/cjs/{location-info.92e70042.js → map-interface.64823b7c.js}

@@ -1,7 +1,8 @@
-var $bf943af2b72f182b$exports = require("./utils.09cef979.js");
-var $370ea7ef3413c03a$exports = require("./hash-string.62e84f08.js");
+var $bf943af2b72f182b$exports = require("./map-interface.dfaad4a1.js");
+var $370ea7ef3413c03a$exports = require("./map-interface.860fcb7e.js");
 var $eMimP$macrostrathyper = require("@macrostrat/hyper");
 var $eMimP$macrostratmapboxutils = require("@macrostrat/mapbox-utils");
+var $eMimP$mapboxgl = require("mapbox-gl");
 
 
 function $parcel$interopDefault(a) {
@@ -37,6 +38,7 @@ $parcel$export(module.exports, "Elevation", () => $860d9939f7032c69$export$58bfb
 
 
 
+
 function $860d9939f7032c69$export$716098b85fd0efdf(props) {
     const { value: value, unit: unit } = props;
     return (0, ($parcel$interopDefault($eMimP$macrostrathyper)))("span.value-with-unit", [
@@ -63,9 +65,17 @@ function $860d9939f7032c69$export$f195b3550849e560(props) {
     /** Formatted geographic coordinates */ const { position: position, className: className, precision: precision, zoom: zoom } = props;
     let { format: format } = props;
     if (position == null) return null;
-    let lat, lng;
+    let lat;
+    let lng;
     if (Array.isArray(position)) [lng, lat] = position;
-    else ({ lat: lat, lng: lng } = position);
+    else if (position instanceof (0, $eMimP$mapboxgl.LngLat)) [lng, lat] = position.toArray();
+    else if ("lng" in position) {
+        lat = position.lat;
+        lng = position.lng;
+    } else if ("lon" in position) {
+        lat = position.lat;
+        lng = position.lon;
+    }
     if (zoom != null && format == null && precision == null) format = (val, _)=>(0, $eMimP$macrostratmapboxutils.formatCoordForZoomLevel)(val, zoom);
     return (0, ($parcel$interopDefault($eMimP$macrostrathyper)))("div.lnglat-container", {
         className: className
@@ -116,4 +126,4 @@ function $860d9939f7032c69$export$58bfb4f6ec5aa58d(props) {
 $parcel$exportWildcard(module.exports, $370ea7ef3413c03a$exports);
 
 
-//# sourceMappingURL=location-info.92e70042.js.map
+//# sourceMappingURL=map-interface.64823b7c.js.map

package/dist/cjs/map-interface.64823b7c.js.map

@@ -0,0 +1 @@
+{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWO,SAAS,0CAAc,KAAK;IACjC,MAAM,SAAE,KAAK,QAAE,IAAI,EAAE,GAAG;IACxB,OAAO,CAAA,GAAA,gDAAA,EAAE,wBAAwB;QAC/B,CAAA,GAAA,gDAAA,EAAE,cAAc;YAAC;SAAM;QACvB,CAAA,GAAA,gDAAA,EAAE,eAAe;YAAC;SAAI;QACtB,CAAA,GAAA,gDAAA,EAAE,aAAa;YAAC;SAAK;KACtB;AACH;AAEO,SAAS,0CAAY,KAAK;IAC/B,MAAM,SAAE,KAAK,UAAE,MAAM,aAAE,YAAY,WAAG,SAAS,CAAA,GAAA,qCAAU,GAAG,GAAG;IAC/D,MAAM,YAAY,QAAQ,IAAI,MAAM,CAAC,EAAE,GAAG,MAAM,CAAC,EAAE;IAEnD,OAAO,CAAA,GAAA,gDAAA,EAAE,2CAAe;QACtB,OAAO,OAAO,KAAK,GAAG,CAAC,QAAQ,aAAa;QAC5C,MAAM;IACR;AACF;AAcO,SAAS,0CAAa,KAAkB;IAC7C,qCAAqC,GACrC,MAAM,YAAE,QAAQ,aAAE,SAAS,aAAE,SAAS,QAAE,IAAI,EAAE,GAAG;IACjD,IAAI,UAAE,MAAM,EAAE,GAAG;IACjB,IAAI,YAAY,MACd,OAAO;IAGT,IAAI;IACJ,IAAI;IACJ,IAAI,MAAM,OAAO,CAAC,WAChB,CAAC,KAAK,IAAI,GAAG;SACR,IAAI,oBAAoB,CAAA,GAAA,sBAAK,GAClC,CAAC,KAAK,IAAI,GAAG,SAAS,OAAO;SACxB,IAAI,SAAS,UAAU;QAC5B,MAAM,SAAS,GAAG;QAClB,MAAM,SAAS,GAAG;IACpB,OAAO,IAAI,SAAS,UAAU;QAC5B,MAAM,SAAS,GAAG;QAClB,MAAM,SAAS,GAAG;IACpB;IAEA,IAAI,QAAQ,QAAQ,UAAU,QAAQ,aAAa,MACjD,SAAS,CAAC,KAAK,IAAM,CAAA,GAAA,oDAAsB,EAAE,KAAK;IAGpD,OAAO,CAAA,GAAA,gDAAA,EAAE,wBAAwB;mBAAE;IAAU,GAAG;QAC9C,CAAA,GAAA,gDAAA,EAAE,eAAe;YACf,CAAA,GAAA,gDAAA,EAAE,2CAAa;gBACb,OAAO;gBACP,QAAQ;oBAAC;oBAAK;iBAAI;2BAClB;wBACA;YACF;YACA;YACA,CAAA,GAAA,gDAAA,EAAE,2CAAa;gBACb,OAAO,CAAA,GAAA,yCAAW,EAAE;gBACpB,QAAQ;oBAAC;oBAAK;iBAAI;2BAClB;wBACA;YACF;SACD;KACF;AACH;AAEO,SAAS,0CAAU,KAAK;IAC7B,iFAAiF,GACjF,MAAM,aAAE,SAAS,aAAE,SAAS,eAAE,cAAc,MAAM,GAAG;IACrD,IAAI,aAAa,MAAM,OAAO;IAC9B,OAAO,CAAA,GAAA,gDAAA,EAAE,iBAAiB;mBAAE;IAAU,GAAG;QACvC,CAAA,GAAA,gDAAA,EAAE,2CAAe;YAAE,OAAO;YAAW,MAAM;QAAI;QAC/C,CAAA,GAAA,gDAAA,EAAE,EAAE,CAAC,aAAa,kBAAkB;YAClC;YACA,CAAA,GAAA,gDAAA,EAAE,2CAAe;gBAAE,OAAO,CAAA,GAAA,yCAAW,EAAE;gBAAY,MAAM;YAAK;YAC9D;SACD;KACF;AACH","sources":["packages/map-interface/src/location-info/index.ts"],"sourcesContent":["import h from \"@macrostrat/hyper\";\nimport {\n  formatCoordForZoomLevel,\n  metersToFeet,\n  normalizeLng,\n} from \"@macrostrat/mapbox-utils\";\nimport { formatValue } from \"./utils\";\nimport { LngLat } from \"mapbox-gl\";\n\nexport * from \"./hash-string\";\n\nexport function ValueWithUnit(props) {\n  const { value, unit } = props;\n  return h(\"span.value-with-unit\", [\n    h(\"span.value\", [value]),\n    h(\"span.spacer\", [\" \"]),\n    h(\"span.unit\", [unit]),\n  ]);\n}\n\nexport function DegreeCoord(props) {\n  const { value, labels, precision = 3, format = formatValue } = props;\n  const direction = value < 0 ? labels[1] : labels[0];\n\n  return h(ValueWithUnit, {\n    value: format(Math.abs(value), precision) + \"°\",\n    unit: direction,\n  });\n}\n\nexport interface LngLatProps {\n  /** Map position */\n  position: mapboxgl.LngLatLike | null;\n  className?: string;\n  /** Zoom level (used to infer coordinate rounding if provided) */\n  zoom?: number;\n  /** Number of decimal places to round coordinates to */\n  precision?: number;\n  /** Function to format coordinates */\n  format?: (val: number, precision: number) => string;\n}\n\nexport function LngLatCoords(props: LngLatProps) {\n  /** Formatted geographic coordinates */\n  const { position, className, precision, zoom } = props;\n  let { format } = props;\n  if (position == null) {\n    return null;\n  }\n\n  let lat: number;\n  let lng: number;\n  if (Array.isArray(position)) {\n    [lng, lat] = position;\n  } else if (position instanceof LngLat) {\n    [lng, lat] = position.toArray();\n  } else if (\"lng\" in position) {\n    lat = position.lat;\n    lng = position.lng;\n  } else if (\"lon\" in position) {\n    lat = position.lat;\n    lng = position.lon;\n  }\n\n  if (zoom != null && format == null && precision == null) {\n    format = (val, _) => formatCoordForZoomLevel(val, zoom);\n  }\n\n  return h(\"div.lnglat-container\", { className }, [\n    h(\"span.lnglat\", [\n      h(DegreeCoord, {\n        value: lat,\n        labels: [\"N\", \"S\"],\n        precision,\n        format,\n      }),\n      \", \",\n      h(DegreeCoord, {\n        value: normalizeLng(lng),\n        labels: [\"E\", \"W\"],\n        precision,\n        format,\n      }),\n    ]),\n  ]);\n}\n\nexport function Elevation(props) {\n  /** Renders an elevation value in meters and a parenthetical conversion to feet. */\n  const { elevation, className, includeFeet = true } = props;\n  if (elevation == null) return null;\n  return h(\"div.elevation\", { className }, [\n    h(ValueWithUnit, { value: elevation, unit: \"m\" }),\n    h.if(includeFeet)(\"span.secondary\", [\n      \" (\",\n      h(ValueWithUnit, { value: metersToFeet(elevation), unit: \"ft\" }),\n      \")\",\n    ]),\n  ]);\n}\n"],"names":[],"version":3,"file":"map-interface.64823b7c.js.map"}