@macrostrat/map-interface 0.1.0 → 0.2.0

package/dist/index.cjs

@@ -12,6 +12,7 @@ var $9B3TU$chromajs = require("chroma-js");
 var $9B3TU$transitionhook = require("transition-hook");
 var $9B3TU$underscore = require("underscore");
 var $9B3TU$useresizeobserver = require("use-resize-observer");
+require("mapbox-gl/dist/mapbox-gl.css");
 var $9B3TU$mapboxtilebelt = require("@mapbox/tilebelt");
 var $9B3TU$d3array = require("d3-array");
 
@@ -48,17 +49,17 @@ $parcel$export($fce5fc950d1fe35b$exports, "FloatingNavbar", () => $fce5fc950d1fe
 var $7a1b0f72a2e7f87d$exports = {};
 
 $parcel$export($7a1b0f72a2e7f87d$exports, "navbar-holder", () => $7a1b0f72a2e7f87d$export$d8779dd86528d602, (v) => $7a1b0f72a2e7f87d$export$d8779dd86528d602 = v);
-$parcel$export($7a1b0f72a2e7f87d$exports, "status-tongue", () => $7a1b0f72a2e7f87d$export$764ade2d69041360, (v) => $7a1b0f72a2e7f87d$export$764ade2d69041360 = v);
-$parcel$export($7a1b0f72a2e7f87d$exports, "searchbar-holder", () => $7a1b0f72a2e7f87d$export$3a39e67bbbcbd4ae, (v) => $7a1b0f72a2e7f87d$export$3a39e67bbbcbd4ae = v);
 $parcel$export($7a1b0f72a2e7f87d$exports, "searchbar", () => $7a1b0f72a2e7f87d$export$2ac23befe9d406ee, (v) => $7a1b0f72a2e7f87d$export$2ac23befe9d406ee = v);
+$parcel$export($7a1b0f72a2e7f87d$exports, "searchbar-holder", () => $7a1b0f72a2e7f87d$export$3a39e67bbbcbd4ae, (v) => $7a1b0f72a2e7f87d$export$3a39e67bbbcbd4ae = v);
+$parcel$export($7a1b0f72a2e7f87d$exports, "status-tongue", () => $7a1b0f72a2e7f87d$export$764ade2d69041360, (v) => $7a1b0f72a2e7f87d$export$764ade2d69041360 = v);
 var $7a1b0f72a2e7f87d$export$d8779dd86528d602;
-var $7a1b0f72a2e7f87d$export$764ade2d69041360;
-var $7a1b0f72a2e7f87d$export$3a39e67bbbcbd4ae;
 var $7a1b0f72a2e7f87d$export$2ac23befe9d406ee;
+var $7a1b0f72a2e7f87d$export$3a39e67bbbcbd4ae;
+var $7a1b0f72a2e7f87d$export$764ade2d69041360;
 $7a1b0f72a2e7f87d$export$d8779dd86528d602 = `_8hZKsW_navbar-holder`;
-$7a1b0f72a2e7f87d$export$764ade2d69041360 = `_8hZKsW_status-tongue`;
-$7a1b0f72a2e7f87d$export$3a39e67bbbcbd4ae = `_8hZKsW_searchbar-holder`;
 $7a1b0f72a2e7f87d$export$2ac23befe9d406ee = `_8hZKsW_searchbar`;
+$7a1b0f72a2e7f87d$export$3a39e67bbbcbd4ae = `_8hZKsW_searchbar-holder`;
+$7a1b0f72a2e7f87d$export$764ade2d69041360 = `_8hZKsW_status-tongue`;
 
 
 
@@ -111,33 +112,36 @@ $parcel$export($2bc7c1e4e7da7fdf$exports, "LocationPanel", () => $2bc7c1e4e7da7f
 
 var $a8d7c4c397e52cf6$exports = {};
 
-$parcel$export($a8d7c4c397e52cf6$exports, "infodrawer-body", () => $a8d7c4c397e52cf6$export$310e8f86a84c074f, (v) => $a8d7c4c397e52cf6$export$310e8f86a84c074f = v);
-$parcel$export($a8d7c4c397e52cf6$exports, "copy-link-button", () => $a8d7c4c397e52cf6$export$d1352d0c31a65024, (v) => $a8d7c4c397e52cf6$export$d1352d0c31a65024 = v);
+$parcel$export($a8d7c4c397e52cf6$exports, "left-icon", () => $a8d7c4c397e52cf6$export$f750577db09821ce, (v) => $a8d7c4c397e52cf6$export$f750577db09821ce = v);
 $parcel$export($a8d7c4c397e52cf6$exports, "infodrawer-header-item", () => $a8d7c4c397e52cf6$export$333d72514239bce8, (v) => $a8d7c4c397e52cf6$export$333d72514239bce8 = v);
+$parcel$export($a8d7c4c397e52cf6$exports, "spacer", () => $a8d7c4c397e52cf6$export$8cc075c801fd6817, (v) => $a8d7c4c397e52cf6$export$8cc075c801fd6817 = v);
 $parcel$export($a8d7c4c397e52cf6$exports, "infodrawer", () => $a8d7c4c397e52cf6$export$b5017f7ff265217d, (v) => $a8d7c4c397e52cf6$export$b5017f7ff265217d = v);
-$parcel$export($a8d7c4c397e52cf6$exports, "left-icon", () => $a8d7c4c397e52cf6$export$f750577db09821ce, (v) => $a8d7c4c397e52cf6$export$f750577db09821ce = v);
+$parcel$export($a8d7c4c397e52cf6$exports, "copy-link-button", () => $a8d7c4c397e52cf6$export$d1352d0c31a65024, (v) => $a8d7c4c397e52cf6$export$d1352d0c31a65024 = v);
 $parcel$export($a8d7c4c397e52cf6$exports, "loading", () => $a8d7c4c397e52cf6$export$46c1c92549715335, (v) => $a8d7c4c397e52cf6$export$46c1c92549715335 = v);
-$parcel$export($a8d7c4c397e52cf6$exports, "spacer", () => $a8d7c4c397e52cf6$export$8cc075c801fd6817, (v) => $a8d7c4c397e52cf6$export$8cc075c801fd6817 = v);
-$parcel$export($a8d7c4c397e52cf6$exports, "position-controls", () => $a8d7c4c397e52cf6$export$dfae07a3bf0fbd6, (v) => $a8d7c4c397e52cf6$export$dfae07a3bf0fbd6 = v);
 $parcel$export($a8d7c4c397e52cf6$exports, "location-panel-header", () => $a8d7c4c397e52cf6$export$d821beb98a87c6d7, (v) => $a8d7c4c397e52cf6$export$d821beb98a87c6d7 = v);
-var $a8d7c4c397e52cf6$export$310e8f86a84c074f;
-var $a8d7c4c397e52cf6$export$d1352d0c31a65024;
+$parcel$export($a8d7c4c397e52cf6$exports, "infodrawer-contents", () => $a8d7c4c397e52cf6$export$69ed3ba502fbf15b, (v) => $a8d7c4c397e52cf6$export$69ed3ba502fbf15b = v);
+$parcel$export($a8d7c4c397e52cf6$exports, "position-controls", () => $a8d7c4c397e52cf6$export$dfae07a3bf0fbd6, (v) => $a8d7c4c397e52cf6$export$dfae07a3bf0fbd6 = v);
+$parcel$export($a8d7c4c397e52cf6$exports, "infodrawer-body", () => $a8d7c4c397e52cf6$export$310e8f86a84c074f, (v) => $a8d7c4c397e52cf6$export$310e8f86a84c074f = v);
+var $a8d7c4c397e52cf6$export$f750577db09821ce;
 var $a8d7c4c397e52cf6$export$333d72514239bce8;
+var $a8d7c4c397e52cf6$export$8cc075c801fd6817;
 var $a8d7c4c397e52cf6$export$b5017f7ff265217d;
-var $a8d7c4c397e52cf6$export$f750577db09821ce;
+var $a8d7c4c397e52cf6$export$d1352d0c31a65024;
 var $a8d7c4c397e52cf6$export$46c1c92549715335;
-var $a8d7c4c397e52cf6$export$8cc075c801fd6817;
-var $a8d7c4c397e52cf6$export$dfae07a3bf0fbd6;
 var $a8d7c4c397e52cf6$export$d821beb98a87c6d7;
-$a8d7c4c397e52cf6$export$310e8f86a84c074f = `VPa3-W_infodrawer-body`;
-$a8d7c4c397e52cf6$export$d1352d0c31a65024 = `VPa3-W_copy-link-button`;
+var $a8d7c4c397e52cf6$export$69ed3ba502fbf15b;
+var $a8d7c4c397e52cf6$export$dfae07a3bf0fbd6;
+var $a8d7c4c397e52cf6$export$310e8f86a84c074f;
+$a8d7c4c397e52cf6$export$f750577db09821ce = `VPa3-W_left-icon`;
 $a8d7c4c397e52cf6$export$333d72514239bce8 = `VPa3-W_infodrawer-header-item`;
+$a8d7c4c397e52cf6$export$8cc075c801fd6817 = `VPa3-W_spacer`;
 $a8d7c4c397e52cf6$export$b5017f7ff265217d = `VPa3-W_infodrawer`;
-$a8d7c4c397e52cf6$export$f750577db09821ce = `VPa3-W_left-icon`;
+$a8d7c4c397e52cf6$export$d1352d0c31a65024 = `VPa3-W_copy-link-button`;
 $a8d7c4c397e52cf6$export$46c1c92549715335 = `VPa3-W_loading`;
-$a8d7c4c397e52cf6$export$8cc075c801fd6817 = `VPa3-W_spacer`;
-$a8d7c4c397e52cf6$export$dfae07a3bf0fbd6 = `VPa3-W_position-controls`;
 $a8d7c4c397e52cf6$export$d821beb98a87c6d7 = `VPa3-W_location-panel-header`;
+$a8d7c4c397e52cf6$export$69ed3ba502fbf15b = `VPa3-W_infodrawer-contents`;
+$a8d7c4c397e52cf6$export$dfae07a3bf0fbd6 = `VPa3-W_position-controls`;
+$a8d7c4c397e52cf6$export$310e8f86a84c074f = `VPa3-W_infodrawer-body`;
 
 
 
@@ -502,14 +506,12 @@ $parcel$export($35f1bc0112883d51$exports, "map-scale-control", () => $35f1bc0112
 $parcel$export($35f1bc0112883d51$exports, "detail-panel-enter", () => $35f1bc0112883d51$export$e017ebf46ba443ed, (v) => $35f1bc0112883d51$export$e017ebf46ba443ed = v);
 $parcel$export($35f1bc0112883d51$exports, "infodrawer-stack", () => $35f1bc0112883d51$export$69fa1b5d46c139b9, (v) => $35f1bc0112883d51$export$69fa1b5d46c139b9 = v);
 $parcel$export($35f1bc0112883d51$exports, "detail-panel", () => $35f1bc0112883d51$export$c6930745f2610de0, (v) => $35f1bc0112883d51$export$c6930745f2610de0 = v);
-$parcel$export($35f1bc0112883d51$exports, "panel-open", () => $35f1bc0112883d51$export$10fedbc2931d16b1, (v) => $35f1bc0112883d51$export$10fedbc2931d16b1 = v);
-$parcel$export($35f1bc0112883d51$exports, "layers", () => $35f1bc0112883d51$export$7be255094ccdc533, (v) => $35f1bc0112883d51$export$7be255094ccdc533 = v);
-$parcel$export($35f1bc0112883d51$exports, "settings", () => $35f1bc0112883d51$export$a5a6e0b888b2c992, (v) => $35f1bc0112883d51$export$a5a6e0b888b2c992 = v);
+$parcel$export($35f1bc0112883d51$exports, "context-panel-holder", () => $35f1bc0112883d51$export$1113ec858cdbc244, (v) => $35f1bc0112883d51$export$1113ec858cdbc244 = v);
 $parcel$export($35f1bc0112883d51$exports, "detail-panel-from", () => $35f1bc0112883d51$export$419647d5ce4279cb, (v) => $35f1bc0112883d51$export$419647d5ce4279cb = v);
 $parcel$export($35f1bc0112883d51$exports, "detail-panel-leave", () => $35f1bc0112883d51$export$1d0f1d0b062c3bee, (v) => $35f1bc0112883d51$export$1d0f1d0b062c3bee = v);
-$parcel$export($35f1bc0112883d51$exports, "context-panel", () => $35f1bc0112883d51$export$b4dbb67ffc3cc7a9, (v) => $35f1bc0112883d51$export$b4dbb67ffc3cc7a9 = v);
 $parcel$export($35f1bc0112883d51$exports, "context-panel-from", () => $35f1bc0112883d51$export$90f42dafd5c24d2d, (v) => $35f1bc0112883d51$export$90f42dafd5c24d2d = v);
 $parcel$export($35f1bc0112883d51$exports, "context-panel-enter", () => $35f1bc0112883d51$export$9ea3835d1b44cc08, (v) => $35f1bc0112883d51$export$9ea3835d1b44cc08 = v);
+$parcel$export($35f1bc0112883d51$exports, "context-panel", () => $35f1bc0112883d51$export$b4dbb67ffc3cc7a9, (v) => $35f1bc0112883d51$export$b4dbb67ffc3cc7a9 = v);
 var $35f1bc0112883d51$export$5ec584901c06c5b9;
 var $35f1bc0112883d51$export$2a73fca7b70dce31;
 var $35f1bc0112883d51$export$cc73204c64cc0950;
@@ -549,14 +551,12 @@ var $35f1bc0112883d51$export$b56f659d649f0d92;
 var $35f1bc0112883d51$export$e017ebf46ba443ed;
 var $35f1bc0112883d51$export$69fa1b5d46c139b9;
 var $35f1bc0112883d51$export$c6930745f2610de0;
-var $35f1bc0112883d51$export$10fedbc2931d16b1;
-var $35f1bc0112883d51$export$7be255094ccdc533;
-var $35f1bc0112883d51$export$a5a6e0b888b2c992;
+var $35f1bc0112883d51$export$1113ec858cdbc244;
 var $35f1bc0112883d51$export$419647d5ce4279cb;
 var $35f1bc0112883d51$export$1d0f1d0b062c3bee;
-var $35f1bc0112883d51$export$b4dbb67ffc3cc7a9;
 var $35f1bc0112883d51$export$90f42dafd5c24d2d;
 var $35f1bc0112883d51$export$9ea3835d1b44cc08;
+var $35f1bc0112883d51$export$b4dbb67ffc3cc7a9;
 $35f1bc0112883d51$export$5ec584901c06c5b9 = "map-page_4c0a66";
 $35f1bc0112883d51$export$2a73fca7b70dce31 = "fit-viewport_4c0a66";
 $35f1bc0112883d51$export$cc73204c64cc0950 = "compass-control_4c0a66";
@@ -596,14 +596,12 @@ $35f1bc0112883d51$export$b56f659d649f0d92 = "map-scale-control_4c0a66";
 $35f1bc0112883d51$export$e017ebf46ba443ed = "detail-panel-enter_4c0a66";
 $35f1bc0112883d51$export$69fa1b5d46c139b9 = "infodrawer-stack_4c0a66";
 $35f1bc0112883d51$export$c6930745f2610de0 = "detail-panel_4c0a66";
-$35f1bc0112883d51$export$10fedbc2931d16b1 = "panel-open_4c0a66";
-$35f1bc0112883d51$export$7be255094ccdc533 = "layers_4c0a66";
-$35f1bc0112883d51$export$a5a6e0b888b2c992 = "settings_4c0a66";
+$35f1bc0112883d51$export$1113ec858cdbc244 = "context-panel-holder_4c0a66";
 $35f1bc0112883d51$export$419647d5ce4279cb = "detail-panel-from_4c0a66";
 $35f1bc0112883d51$export$1d0f1d0b062c3bee = "detail-panel-leave_4c0a66";
-$35f1bc0112883d51$export$b4dbb67ffc3cc7a9 = "context-panel_4c0a66";
 $35f1bc0112883d51$export$90f42dafd5c24d2d = "context-panel-from_4c0a66";
 $35f1bc0112883d51$export$9ea3835d1b44cc08 = "context-panel-enter_4c0a66";
+$35f1bc0112883d51$export$b4dbb67ffc3cc7a9 = "context-panel_4c0a66";
 
 
 
@@ -687,25 +685,28 @@ function $c3311f59335df34d$var$_MapAreaContainer({ children: children , classNam
       the search bar on mobile platforms
     - These styles are doubly applied so we can have both namespaced and
       outside-accessible styles for each case.
-  */ const _className = (0, ($parcel$interopDefault($9B3TU$classnames)))({
-        searching: false,
+  */ const mainUIClassName = (0, ($parcel$interopDefault($9B3TU$classnames)))({
         "detail-panel-open": _detailPanelOpen,
-        "map-context-open": _detailPanelOpen,
-        "fit-viewport": fitViewport
+        "map-context-open": contextPanelOpen
     }, `context-panel-${contextPanelTrans.stage}`, `map-context-${contextPanelTrans.stage}`, `detail-panel-${detailPanelTrans.stage}`, `map-detail-${detailPanelTrans.stage}`);
     return $c3311f59335df34d$var$h($c3311f59335df34d$export$fa395a37c3898ae3, {
-        className: (0, ($parcel$interopDefault($9B3TU$classnames)))("map-page", className),
+        className: (0, ($parcel$interopDefault($9B3TU$classnames)))("map-page", className, {
+            "fit-viewport": fitViewport
+        }),
         mapPosition: mapPosition
     }, [
         $c3311f59335df34d$var$h("div.main-ui", {
-            className: _className,
+            className: mainUIClassName,
             ...rest
         }, [
-            $c3311f59335df34d$var$h("div.context-stack", contextStackProps, [
+            $c3311f59335df34d$var$h("div.context-stack", [
                 navbar,
-                $c3311f59335df34d$var$h.if(contextPanelTrans.shouldMount)([
-                    contextPanel
-                ]), 
+                $c3311f59335df34d$var$h("div.context-panel-holder", [
+                    $c3311f59335df34d$var$h.if(contextPanelTrans.shouldMount)([
+                        contextPanel
+                    ]), 
+                ]),
+                $c3311f59335df34d$var$h("div.spacer"), 
             ]),
             //h(MapView),
             children ?? mainPanel,
@@ -724,7 +725,7 @@ function $c3311f59335df34d$var$_MapAreaContainer({ children: children , classNam
 const $c3311f59335df34d$var$MapProviders = ({ children: children  })=>$c3311f59335df34d$var$h((0, $9B3TU$macrostratuicomponents.ToasterContext), $c3311f59335df34d$var$h((0, $9B3TU$macrostratmapboxreact.MapboxMapProvider), children));
 const $c3311f59335df34d$export$9fa5da0bcfd0a290 = (props)=>$c3311f59335df34d$var$h($c3311f59335df34d$var$MapProviders, $c3311f59335df34d$var$h($c3311f59335df34d$var$_MapAreaContainer, props));
 function $c3311f59335df34d$export$fa395a37c3898ae3({ className: className , children: children  }) {
-    const { mapPosition: mapPosition  } = (0, $9B3TU$macrostratmapboxreact.useMapStatus)();
+    const mapPosition = (0, $9B3TU$macrostratmapboxreact.useMapPosition)();
     if (mapPosition != null) {
         const { mapIsRotated: mapIsRotated , mapUse3D: mapUse3D , mapIsGlobal: mapIsGlobal  } = (0, $9B3TU$macrostratmapboxutils.mapViewInfo)(mapPosition);
         className = (0, ($parcel$interopDefault($9B3TU$classnames)))(className, {
@@ -949,8 +950,11 @@ $parcel$export($12b6032029db16d4$exports, "MapTerrainManager", () => $12b6032029
 var $094b46e231302b09$exports = {};
 
 $parcel$export($094b46e231302b09$exports, "map-view-container", () => $094b46e231302b09$export$11aa7dc57218208d, (v) => $094b46e231302b09$export$11aa7dc57218208d = v);
+$parcel$export($094b46e231302b09$exports, "mapbox-map", () => $094b46e231302b09$export$d0dcaf774d09fc4c, (v) => $094b46e231302b09$export$d0dcaf774d09fc4c = v);
 var $094b46e231302b09$export$11aa7dc57218208d;
+var $094b46e231302b09$export$d0dcaf774d09fc4c;
 $094b46e231302b09$export$11aa7dc57218208d = `-mD4Aa_map-view-container`;
+$094b46e231302b09$export$d0dcaf774d09fc4c = `-mD4Aa_mapbox-map`;
 
 
 
@@ -1004,11 +1008,13 @@ function $ecfbeec2ae4211a4$var$getTerrainSourceID(map) {
 
 
 
+
 const $12b6032029db16d4$var$h = (0, ($parcel$interopDefault($9B3TU$macrostrathyper))).styled({
     ...(0, (/*@__PURE__*/$parcel$interopDefault($094b46e231302b09$exports))),
     ...(0, (/*@__PURE__*/$parcel$interopDefault($35f1bc0112883d51$exports)))
 });
-function $12b6032029db16d4$var$initializeMap(container, args = {}) {
+function $12b6032029db16d4$var$defaultInitializeMap(container, args = {}) {
+    const { mapPosition: mapPosition , ...rest } = args;
     const map = new (0, ($parcel$interopDefault($9B3TU$mapboxgl))).Map({
         container: container,
         maxZoom: 18,
@@ -1017,8 +1023,10 @@ function $12b6032029db16d4$var$initializeMap(container, args = {}) {
         trackResize: true,
         antialias: true,
         optimizeForTerrain: true,
-        ...args
+        ...rest
     });
+    // set initial map position
+    if (mapPosition != null) (0, $9B3TU$macrostratmapboxutils.setMapPosition)(map, mapPosition);
     //setMapPosition(map, mapPosition);
     return map;
 }
@@ -1031,7 +1039,7 @@ const $12b6032029db16d4$var$defaultMapPosition = {
 };
 function $12b6032029db16d4$export$ab1e7a67d6ec5ad8(props) {
     let { terrainSourceID: terrainSourceID  } = props;
-    const { enableTerrain: enableTerrain = true , style: style , transformRequest: transformRequest , mapPosition: mapPosition = $12b6032029db16d4$var$defaultMapPosition , children: children , accessToken: accessToken , infoMarkerPosition: infoMarkerPosition , projection: projection ,  } = props;
+    const { enableTerrain: enableTerrain = true , style: style , mapPosition: mapPosition = $12b6032029db16d4$var$defaultMapPosition , initializeMap: initializeMap = $12b6032029db16d4$var$defaultInitializeMap , children: children , accessToken: accessToken , infoMarkerPosition: infoMarkerPosition , transformRequest: transformRequest , projection: projection , onMapLoaded: onMapLoaded = null , onStyleLoaded: onStyleLoaded = null , ...rest } = props;
     if (enableTerrain) terrainSourceID ??= "mapbox-3d-dem";
     if (accessToken != null) (0, ($parcel$interopDefault($9B3TU$mapboxgl))).accessToken = accessToken;
     const dispatch = (0, $9B3TU$macrostratmapboxreact.useMapDispatch)();
@@ -1040,47 +1048,45 @@ function $12b6032029db16d4$export$ab1e7a67d6ec5ad8(props) {
     const parentRef = (0, $9B3TU$react.useRef)();
     // Keep track of map position for reloads
     (0, $9B3TU$react.useEffect)(()=>{
-        if (style == null || ref.current == null || dispatch == null) return;
-        if (mapRef?.current != null) return;
-        console.log("Initializing map");
-        const map = $12b6032029db16d4$var$initializeMap(ref.current, {
+        if (style == null) return;
+        if (mapRef.current != null) {
+            console.log("Setting style", style);
+            mapRef.current.setStyle(style);
+            return;
+        }
+        const map = initializeMap(ref.current, {
             style: style,
-            transformRequest: transformRequest,
-            projection: projection
+            projection: projection,
+            mapPosition: mapPosition,
+            ...rest
+        });
+        map.on("style.load", ()=>{
+            onStyleLoaded?.(map);
+            dispatch({
+                type: "set-style-loaded",
+                payload: true
+            });
         });
+        onMapLoaded?.(map);
         dispatch({
             type: "set-map",
             payload: map
         });
-        console.log("Map initialized");
-        return ()=>{
-            map.remove();
-            dispatch({
-                type: "set-map",
-                payload: null
-            });
-        };
     }, [
-        transformRequest,
-        dispatch,
         style
     ]);
     // Map style updating
-    (0, $9B3TU$react.useEffect)(()=>{
-        if (mapRef?.current == null || style == null) return;
-        mapRef?.current?.setStyle(style);
-    }, [
-        mapRef.current,
-        style
-    ]);
-    (0, $9B3TU$react.useEffect)(()=>{
-        const map = mapRef.current;
-        if (map == null || mapPosition == null) return;
-        (0, $9B3TU$macrostratmapboxutils.setMapPosition)(map, mapPosition);
-    }, [
-        mapRef.current
-    ]);
-    const { mapPosition: _computedMapPosition  } = (0, $9B3TU$macrostratmapboxreact.useMapStatus)();
+    // useEffect(() => {
+    //   if (mapRef?.current == null || style == null) return;
+    //   mapRef?.current?.setStyle(style);
+    // }, [mapRef.current, style]);
+    // Set map position if it changes
+    // useEffect(() => {
+    //   const map = mapRef.current;
+    //   if (map == null || mapPosition == null) return;
+    //   setMapPosition(map, mapPosition);
+    // }, [mapPosition]);
+    const _computedMapPosition = (0, $9B3TU$macrostratmapboxreact.useMapPosition)();
     const { mapUse3D: mapUse3D , mapIsRotated: mapIsRotated  } = (0, $9B3TU$macrostratmapboxutils.mapViewInfo)(_computedMapPosition);
     // Get map projection
     const _projection = mapRef.current?.getProjection()?.name ?? "mercator";
@@ -1219,8 +1225,10 @@ function $abbe8d0af34cbbed$export$86c09739b12f23cd({ tile: tile , color: color =
 
 var $db14eb7a5c07abdb$exports = {};
 
+$parcel$export($db14eb7a5c07abdb$exports, "FeatureProperties", () => $db14eb7a5c07abdb$export$2906e7f4b228efe9);
 $parcel$export($db14eb7a5c07abdb$exports, "FeatureRecord", () => $db14eb7a5c07abdb$export$dc87b4d46cea200d);
 $parcel$export($db14eb7a5c07abdb$exports, "FeatureSelectionHandler", () => $db14eb7a5c07abdb$export$214daccdda0f4ac6);
+$parcel$export($db14eb7a5c07abdb$exports, "Features", () => $db14eb7a5c07abdb$export$617d79dae526d2cf);
 $parcel$export($db14eb7a5c07abdb$exports, "TileInfo", () => $db14eb7a5c07abdb$export$43c75dec9d0b96c);
 $parcel$export($db14eb7a5c07abdb$exports, "FeaturePanel", () => $db14eb7a5c07abdb$export$43277c51a01761c1);
 
@@ -1238,6 +1246,7 @@ $parcel$export($750d69d73bfbdc9a$exports, "ExpansionPanel", () => $750d69d73bfbd
 $parcel$export($750d69d73bfbdc9a$exports, "SubExpansionPanel", () => $750d69d73bfbdc9a$export$d7160281aff7c3b8);
 $parcel$export($750d69d73bfbdc9a$exports, "ExpandableDetailsPanel", () => $750d69d73bfbdc9a$export$44ad9ff780615135);
 $parcel$export($750d69d73bfbdc9a$exports, "ExpansionBody", () => $750d69d73bfbdc9a$export$263416b670b3f129);
+$parcel$export($750d69d73bfbdc9a$exports, "PanelSubhead", () => $a0970d22776f9f4c$export$ed081779ec3709aa);
 
 
 
@@ -1416,28 +1425,27 @@ function $750d69d73bfbdc9a$export$263416b670b3f129({ title: title , className: c
 
 
 const $db14eb7a5c07abdb$var$h = (0, ($parcel$interopDefault($9B3TU$macrostrathyper))).styled((0, (/*@__PURE__*/$parcel$interopDefault($33088e8384af337c$exports))));
-function $db14eb7a5c07abdb$var$usePrevious(value) {
-    const ref = (0, $9B3TU$react.useRef)();
-    (0, $9B3TU$react.useEffect)(()=>{
-        ref.current = value;
-    });
-    return ref.current;
+function $db14eb7a5c07abdb$export$2906e7f4b228efe9({ data: data , ...rest }) {
+    return $db14eb7a5c07abdb$var$h("div.feature-properties", [
+        $db14eb7a5c07abdb$var$h((0, $9B3TU$macrostratuicomponents.JSONView), {
+            data: data,
+            hideRoot: true,
+            ...rest
+        }), 
+    ]);
 }
 function $db14eb7a5c07abdb$export$dc87b4d46cea200d({ feature: feature  }) {
     const props = feature.properties;
     return $db14eb7a5c07abdb$var$h("div.feature-record", [
-        $db14eb7a5c07abdb$var$h.if(Object.keys(props).length > 0)("div.feature-properties", [
-            $db14eb7a5c07abdb$var$h((0, $9B3TU$macrostratuicomponents.JSONView), {
-                data: props,
-                hideRoot: true
-            }), 
-        ]), 
+        $db14eb7a5c07abdb$var$h.if(Object.keys(props).length > 0)($db14eb7a5c07abdb$export$2906e7f4b228efe9, {
+            data: props
+        }), 
     ]);
 }
 function $db14eb7a5c07abdb$export$214daccdda0f4ac6({ selectedLocation: selectedLocation , setFeatures: setFeatures , radius: radius = 2  }) {
     const mapRef = (0, $9B3TU$macrostratmapboxreact.useMapRef)();
     const { isLoading: isLoading  } = (0, $9B3TU$macrostratmapboxreact.useMapStatus)();
-    const prevLocation = $db14eb7a5c07abdb$var$usePrevious(selectedLocation);
+    const prevLocation = (0, $9B3TU$macrostratuicomponents.usePrevious)(selectedLocation);
     (0, $9B3TU$react.useEffect)(()=>{
         const map = mapRef?.current;
         if (map == null) return;
@@ -1509,7 +1517,7 @@ function $db14eb7a5c07abdb$var$LoadingAwareFeatureSet({ features: features , sou
         sourceFeatures.length
     ]);
     if (!isLoaded1) return $db14eb7a5c07abdb$var$h((0, $9B3TU$blueprintjscore.Spinner));
-    return $db14eb7a5c07abdb$var$h($db14eb7a5c07abdb$var$Features, {
+    return $db14eb7a5c07abdb$var$h($db14eb7a5c07abdb$export$617d79dae526d2cf, {
         features: sourceFeatures
     });
 }
@@ -1590,27 +1598,32 @@ function $db14eb7a5c07abdb$export$43277c51a01761c1({ features: features , focuse
             className: "basemap-features",
             expanded: focusedSource == null
         }, [
-            $db14eb7a5c07abdb$var$h($db14eb7a5c07abdb$var$Features, {
+            $db14eb7a5c07abdb$var$h($db14eb7a5c07abdb$var$FeatureGroups, {
                 features: filteredFeatures
             }), 
         ]), 
     ]);
 }
-function $db14eb7a5c07abdb$var$Features({ features: features1  }) {
+function $db14eb7a5c07abdb$var$FeatureGroups({ features: features1  }) {
     /** Group features by source and sourceLayer */ if (features1 == null) return null;
     const groups = (0, $9B3TU$d3array.group)(features1, (d)=>`${d.source} - ${d.sourceLayer}`);
-    return $db14eb7a5c07abdb$var$h("div.features", Array.from(groups).map(([key, features])=>{
+    return $db14eb7a5c07abdb$var$h("div.feature-groups", Array.from(groups).map(([key, features])=>{
         return $db14eb7a5c07abdb$var$h("div.feature-group", [
             $db14eb7a5c07abdb$var$h($db14eb7a5c07abdb$var$FeatureHeader, {
                 feature: features[0]
             }),
-            features.map((feature, i)=>$db14eb7a5c07abdb$var$h($db14eb7a5c07abdb$export$dc87b4d46cea200d, {
-                    key: i,
-                    feature: feature
-                })), 
+            $db14eb7a5c07abdb$var$h($db14eb7a5c07abdb$export$617d79dae526d2cf, {
+                features: features
+            }), 
         ]);
     }));
 }
+function $db14eb7a5c07abdb$export$617d79dae526d2cf({ features: features  }) {
+    return $db14eb7a5c07abdb$var$h("div.features", features.map((feature, i)=>$db14eb7a5c07abdb$var$h($db14eb7a5c07abdb$export$dc87b4d46cea200d, {
+            key: i,
+            feature: feature
+        })));
+}
 
 
 let $6f5ca387ac26c0b5$export$dce4b6e67bb5f25a;