@macrostrat/map-interface 0.1.0 → 0.2.1

package/dist/index.js

@@ -2,9 +2,9 @@ import "./index.css";
 import {useMemo as $Zz0sd$useMemo, useState as $Zz0sd$useState, useEffect as $Zz0sd$useEffect, useCallback as $Zz0sd$useCallback, useRef as $Zz0sd$useRef} from "react";
 import {Spinner as $Zz0sd$Spinner, Button as $Zz0sd$Button, Navbar as $Zz0sd$Navbar, Card as $Zz0sd$Card, Icon as $Zz0sd$Icon, Switch as $Zz0sd$Switch, Collapse as $Zz0sd$Collapse} from "@blueprintjs/core";
 import $Zz0sd$macrostrathyper from "@macrostrat/hyper";
-import {useMapStatus as $Zz0sd$useMapStatus, useFocusState as $Zz0sd$useFocusState, LocationFocusButton as $Zz0sd$LocationFocusButton, isCentered as $Zz0sd$isCentered, ZoomControl as $Zz0sd$ZoomControl, MapboxMapProvider as $Zz0sd$MapboxMapProvider, MapControlWrapper as $Zz0sd$MapControlWrapper, ThreeDControl as $Zz0sd$ThreeDControl, CompassControl as $Zz0sd$CompassControl, GlobeControl as $Zz0sd$GlobeControl, useMapRef as $Zz0sd$useMapRef, useMapEaseToCenter as $Zz0sd$useMapEaseToCenter, useMapDispatch as $Zz0sd$useMapDispatch, useMapConditionalStyle as $Zz0sd$useMapConditionalStyle} from "@macrostrat/mapbox-react";
+import {useMapStatus as $Zz0sd$useMapStatus, useFocusState as $Zz0sd$useFocusState, LocationFocusButton as $Zz0sd$LocationFocusButton, isCentered as $Zz0sd$isCentered, ZoomControl as $Zz0sd$ZoomControl, MapboxMapProvider as $Zz0sd$MapboxMapProvider, useMapPosition as $Zz0sd$useMapPosition, MapControlWrapper as $Zz0sd$MapControlWrapper, ThreeDControl as $Zz0sd$ThreeDControl, CompassControl as $Zz0sd$CompassControl, GlobeControl as $Zz0sd$GlobeControl, useMapRef as $Zz0sd$useMapRef, useMapEaseToCenter as $Zz0sd$useMapEaseToCenter, useMapDispatch as $Zz0sd$useMapDispatch, useMapConditionalStyle as $Zz0sd$useMapConditionalStyle} from "@macrostrat/mapbox-react";
 import $Zz0sd$classnames from "classnames";
-import {ErrorBoundary as $Zz0sd$ErrorBoundary, useToaster as $Zz0sd$useToaster, useDarkMode as $Zz0sd$useDarkMode, useStoredState as $Zz0sd$useStoredState, Spacer as $Zz0sd$Spacer, ToasterContext as $Zz0sd$ToasterContext, JSONView as $Zz0sd$JSONView} from "@macrostrat/ui-components";
+import {ErrorBoundary as $Zz0sd$ErrorBoundary, useToaster as $Zz0sd$useToaster, useDarkMode as $Zz0sd$useDarkMode, useStoredState as $Zz0sd$useStoredState, Spacer as $Zz0sd$Spacer, ToasterContext as $Zz0sd$ToasterContext, JSONView as $Zz0sd$JSONView, usePrevious as $Zz0sd$usePrevious} from "@macrostrat/ui-components";
 import {format as $Zz0sd$format} from "d3-format";
 import $Zz0sd$mapboxgl, {ScaleControl as $Zz0sd$ScaleControl, GeolocateControl as $Zz0sd$GeolocateControl, Marker as $Zz0sd$Marker} from "mapbox-gl";
 import {getMapboxStyle as $Zz0sd$getMapboxStyle, mergeStyles as $Zz0sd$mergeStyles, mapViewInfo as $Zz0sd$mapViewInfo, getMapPosition as $Zz0sd$getMapPosition, setMapPosition as $Zz0sd$setMapPosition} from "@macrostrat/mapbox-utils";
@@ -12,6 +12,7 @@ import $Zz0sd$chromajs from "chroma-js";
 import {useTransition as $Zz0sd$useTransition} from "transition-hook";
 import {debounce as $Zz0sd$debounce} from "underscore";
 import $Zz0sd$useresizeobserver from "use-resize-observer";
+import "mapbox-gl/dist/mapbox-gl.css";
 import {tileToGeoJSON as $Zz0sd$tileToGeoJSON} from "@mapbox/tilebelt";
 import {group as $Zz0sd$group} from "d3-array";
 
@@ -47,18 +48,18 @@ $parcel$export($6e914c81c8e053da$exports, "FloatingNavbar", () => $6e914c81c8e05
 
 var $fbe402416678c280$exports = {};
 
-$parcel$export($fbe402416678c280$exports, "searchbar", () => $fbe402416678c280$export$2ac23befe9d406ee, (v) => $fbe402416678c280$export$2ac23befe9d406ee = v);
 $parcel$export($fbe402416678c280$exports, "searchbar-holder", () => $fbe402416678c280$export$3a39e67bbbcbd4ae, (v) => $fbe402416678c280$export$3a39e67bbbcbd4ae = v);
-$parcel$export($fbe402416678c280$exports, "status-tongue", () => $fbe402416678c280$export$764ade2d69041360, (v) => $fbe402416678c280$export$764ade2d69041360 = v);
 $parcel$export($fbe402416678c280$exports, "navbar-holder", () => $fbe402416678c280$export$d8779dd86528d602, (v) => $fbe402416678c280$export$d8779dd86528d602 = v);
-var $fbe402416678c280$export$2ac23befe9d406ee;
+$parcel$export($fbe402416678c280$exports, "status-tongue", () => $fbe402416678c280$export$764ade2d69041360, (v) => $fbe402416678c280$export$764ade2d69041360 = v);
+$parcel$export($fbe402416678c280$exports, "searchbar", () => $fbe402416678c280$export$2ac23befe9d406ee, (v) => $fbe402416678c280$export$2ac23befe9d406ee = v);
 var $fbe402416678c280$export$3a39e67bbbcbd4ae;
-var $fbe402416678c280$export$764ade2d69041360;
 var $fbe402416678c280$export$d8779dd86528d602;
-$fbe402416678c280$export$2ac23befe9d406ee = `_8hZKsW_searchbar`;
+var $fbe402416678c280$export$764ade2d69041360;
+var $fbe402416678c280$export$2ac23befe9d406ee;
 $fbe402416678c280$export$3a39e67bbbcbd4ae = `_8hZKsW_searchbar-holder`;
-$fbe402416678c280$export$764ade2d69041360 = `_8hZKsW_status-tongue`;
 $fbe402416678c280$export$d8779dd86528d602 = `_8hZKsW_navbar-holder`;
+$fbe402416678c280$export$764ade2d69041360 = `_8hZKsW_status-tongue`;
+$fbe402416678c280$export$2ac23befe9d406ee = `_8hZKsW_searchbar`;
 
 
 
@@ -111,33 +112,36 @@ $parcel$export($f50c3537aaff0cff$exports, "LocationPanel", () => $f50c3537aaff0c
 
 var $29ab0212ea6844d0$exports = {};
 
-$parcel$export($29ab0212ea6844d0$exports, "infodrawer-header-item", () => $29ab0212ea6844d0$export$333d72514239bce8, (v) => $29ab0212ea6844d0$export$333d72514239bce8 = v);
-$parcel$export($29ab0212ea6844d0$exports, "infodrawer-body", () => $29ab0212ea6844d0$export$310e8f86a84c074f, (v) => $29ab0212ea6844d0$export$310e8f86a84c074f = v);
-$parcel$export($29ab0212ea6844d0$exports, "copy-link-button", () => $29ab0212ea6844d0$export$d1352d0c31a65024, (v) => $29ab0212ea6844d0$export$d1352d0c31a65024 = v);
-$parcel$export($29ab0212ea6844d0$exports, "left-icon", () => $29ab0212ea6844d0$export$f750577db09821ce, (v) => $29ab0212ea6844d0$export$f750577db09821ce = v);
-$parcel$export($29ab0212ea6844d0$exports, "loading", () => $29ab0212ea6844d0$export$46c1c92549715335, (v) => $29ab0212ea6844d0$export$46c1c92549715335 = v);
 $parcel$export($29ab0212ea6844d0$exports, "location-panel-header", () => $29ab0212ea6844d0$export$d821beb98a87c6d7, (v) => $29ab0212ea6844d0$export$d821beb98a87c6d7 = v);
-$parcel$export($29ab0212ea6844d0$exports, "spacer", () => $29ab0212ea6844d0$export$8cc075c801fd6817, (v) => $29ab0212ea6844d0$export$8cc075c801fd6817 = v);
+$parcel$export($29ab0212ea6844d0$exports, "left-icon", () => $29ab0212ea6844d0$export$f750577db09821ce, (v) => $29ab0212ea6844d0$export$f750577db09821ce = v);
 $parcel$export($29ab0212ea6844d0$exports, "infodrawer", () => $29ab0212ea6844d0$export$b5017f7ff265217d, (v) => $29ab0212ea6844d0$export$b5017f7ff265217d = v);
+$parcel$export($29ab0212ea6844d0$exports, "infodrawer-body", () => $29ab0212ea6844d0$export$310e8f86a84c074f, (v) => $29ab0212ea6844d0$export$310e8f86a84c074f = v);
+$parcel$export($29ab0212ea6844d0$exports, "copy-link-button", () => $29ab0212ea6844d0$export$d1352d0c31a65024, (v) => $29ab0212ea6844d0$export$d1352d0c31a65024 = v);
 $parcel$export($29ab0212ea6844d0$exports, "position-controls", () => $29ab0212ea6844d0$export$dfae07a3bf0fbd6, (v) => $29ab0212ea6844d0$export$dfae07a3bf0fbd6 = v);
-var $29ab0212ea6844d0$export$333d72514239bce8;
-var $29ab0212ea6844d0$export$310e8f86a84c074f;
-var $29ab0212ea6844d0$export$d1352d0c31a65024;
-var $29ab0212ea6844d0$export$f750577db09821ce;
-var $29ab0212ea6844d0$export$46c1c92549715335;
+$parcel$export($29ab0212ea6844d0$exports, "infodrawer-header-item", () => $29ab0212ea6844d0$export$333d72514239bce8, (v) => $29ab0212ea6844d0$export$333d72514239bce8 = v);
+$parcel$export($29ab0212ea6844d0$exports, "spacer", () => $29ab0212ea6844d0$export$8cc075c801fd6817, (v) => $29ab0212ea6844d0$export$8cc075c801fd6817 = v);
+$parcel$export($29ab0212ea6844d0$exports, "infodrawer-contents", () => $29ab0212ea6844d0$export$69ed3ba502fbf15b, (v) => $29ab0212ea6844d0$export$69ed3ba502fbf15b = v);
+$parcel$export($29ab0212ea6844d0$exports, "loading", () => $29ab0212ea6844d0$export$46c1c92549715335, (v) => $29ab0212ea6844d0$export$46c1c92549715335 = v);
 var $29ab0212ea6844d0$export$d821beb98a87c6d7;
-var $29ab0212ea6844d0$export$8cc075c801fd6817;
+var $29ab0212ea6844d0$export$f750577db09821ce;
 var $29ab0212ea6844d0$export$b5017f7ff265217d;
+var $29ab0212ea6844d0$export$310e8f86a84c074f;
+var $29ab0212ea6844d0$export$d1352d0c31a65024;
 var $29ab0212ea6844d0$export$dfae07a3bf0fbd6;
-$29ab0212ea6844d0$export$333d72514239bce8 = `VPa3-W_infodrawer-header-item`;
-$29ab0212ea6844d0$export$310e8f86a84c074f = `VPa3-W_infodrawer-body`;
-$29ab0212ea6844d0$export$d1352d0c31a65024 = `VPa3-W_copy-link-button`;
-$29ab0212ea6844d0$export$f750577db09821ce = `VPa3-W_left-icon`;
-$29ab0212ea6844d0$export$46c1c92549715335 = `VPa3-W_loading`;
+var $29ab0212ea6844d0$export$333d72514239bce8;
+var $29ab0212ea6844d0$export$8cc075c801fd6817;
+var $29ab0212ea6844d0$export$69ed3ba502fbf15b;
+var $29ab0212ea6844d0$export$46c1c92549715335;
 $29ab0212ea6844d0$export$d821beb98a87c6d7 = `VPa3-W_location-panel-header`;
-$29ab0212ea6844d0$export$8cc075c801fd6817 = `VPa3-W_spacer`;
+$29ab0212ea6844d0$export$f750577db09821ce = `VPa3-W_left-icon`;
 $29ab0212ea6844d0$export$b5017f7ff265217d = `VPa3-W_infodrawer`;
+$29ab0212ea6844d0$export$310e8f86a84c074f = `VPa3-W_infodrawer-body`;
+$29ab0212ea6844d0$export$d1352d0c31a65024 = `VPa3-W_copy-link-button`;
 $29ab0212ea6844d0$export$dfae07a3bf0fbd6 = `VPa3-W_position-controls`;
+$29ab0212ea6844d0$export$333d72514239bce8 = `VPa3-W_infodrawer-header-item`;
+$29ab0212ea6844d0$export$8cc075c801fd6817 = `VPa3-W_spacer`;
+$29ab0212ea6844d0$export$69ed3ba502fbf15b = `VPa3-W_infodrawer-contents`;
+$29ab0212ea6844d0$export$46c1c92549715335 = `VPa3-W_loading`;
 
 
 
@@ -456,7 +460,6 @@ async function $64ee2eed3ed5ffbc$export$e739dc8dfc0db9a6(baseStyle, overlayStyle
 
 var $4bdfa9cd8240b2fd$exports = {};
 
-$parcel$export($4bdfa9cd8240b2fd$exports, "MapInterface", () => $4bdfa9cd8240b2fd$export$57b87f3e07d4bb90);
 $parcel$export($4bdfa9cd8240b2fd$exports, "PanelCard", () => $4bdfa9cd8240b2fd$export$ec68dd77edbe678b);
 $parcel$export($4bdfa9cd8240b2fd$exports, "MapStyledContainer", () => $4bdfa9cd8240b2fd$export$fa395a37c3898ae3);
 $parcel$export($4bdfa9cd8240b2fd$exports, "MapAreaContainer", () => $4bdfa9cd8240b2fd$export$9fa5da0bcfd0a290);
@@ -502,14 +505,12 @@ $parcel$export($1f5c274a1b8d54c3$exports, "map-scale-control", () => $1f5c274a1b
 $parcel$export($1f5c274a1b8d54c3$exports, "detail-panel-enter", () => $1f5c274a1b8d54c3$export$e017ebf46ba443ed, (v) => $1f5c274a1b8d54c3$export$e017ebf46ba443ed = v);
 $parcel$export($1f5c274a1b8d54c3$exports, "infodrawer-stack", () => $1f5c274a1b8d54c3$export$69fa1b5d46c139b9, (v) => $1f5c274a1b8d54c3$export$69fa1b5d46c139b9 = v);
 $parcel$export($1f5c274a1b8d54c3$exports, "detail-panel", () => $1f5c274a1b8d54c3$export$c6930745f2610de0, (v) => $1f5c274a1b8d54c3$export$c6930745f2610de0 = v);
-$parcel$export($1f5c274a1b8d54c3$exports, "panel-open", () => $1f5c274a1b8d54c3$export$10fedbc2931d16b1, (v) => $1f5c274a1b8d54c3$export$10fedbc2931d16b1 = v);
-$parcel$export($1f5c274a1b8d54c3$exports, "layers", () => $1f5c274a1b8d54c3$export$7be255094ccdc533, (v) => $1f5c274a1b8d54c3$export$7be255094ccdc533 = v);
-$parcel$export($1f5c274a1b8d54c3$exports, "settings", () => $1f5c274a1b8d54c3$export$a5a6e0b888b2c992, (v) => $1f5c274a1b8d54c3$export$a5a6e0b888b2c992 = v);
+$parcel$export($1f5c274a1b8d54c3$exports, "context-panel-holder", () => $1f5c274a1b8d54c3$export$1113ec858cdbc244, (v) => $1f5c274a1b8d54c3$export$1113ec858cdbc244 = v);
 $parcel$export($1f5c274a1b8d54c3$exports, "detail-panel-from", () => $1f5c274a1b8d54c3$export$419647d5ce4279cb, (v) => $1f5c274a1b8d54c3$export$419647d5ce4279cb = v);
 $parcel$export($1f5c274a1b8d54c3$exports, "detail-panel-leave", () => $1f5c274a1b8d54c3$export$1d0f1d0b062c3bee, (v) => $1f5c274a1b8d54c3$export$1d0f1d0b062c3bee = v);
-$parcel$export($1f5c274a1b8d54c3$exports, "context-panel", () => $1f5c274a1b8d54c3$export$b4dbb67ffc3cc7a9, (v) => $1f5c274a1b8d54c3$export$b4dbb67ffc3cc7a9 = v);
 $parcel$export($1f5c274a1b8d54c3$exports, "context-panel-from", () => $1f5c274a1b8d54c3$export$90f42dafd5c24d2d, (v) => $1f5c274a1b8d54c3$export$90f42dafd5c24d2d = v);
 $parcel$export($1f5c274a1b8d54c3$exports, "context-panel-enter", () => $1f5c274a1b8d54c3$export$9ea3835d1b44cc08, (v) => $1f5c274a1b8d54c3$export$9ea3835d1b44cc08 = v);
+$parcel$export($1f5c274a1b8d54c3$exports, "context-panel", () => $1f5c274a1b8d54c3$export$b4dbb67ffc3cc7a9, (v) => $1f5c274a1b8d54c3$export$b4dbb67ffc3cc7a9 = v);
 var $1f5c274a1b8d54c3$export$5ec584901c06c5b9;
 var $1f5c274a1b8d54c3$export$2a73fca7b70dce31;
 var $1f5c274a1b8d54c3$export$cc73204c64cc0950;
@@ -549,14 +550,12 @@ var $1f5c274a1b8d54c3$export$b56f659d649f0d92;
 var $1f5c274a1b8d54c3$export$e017ebf46ba443ed;
 var $1f5c274a1b8d54c3$export$69fa1b5d46c139b9;
 var $1f5c274a1b8d54c3$export$c6930745f2610de0;
-var $1f5c274a1b8d54c3$export$10fedbc2931d16b1;
-var $1f5c274a1b8d54c3$export$7be255094ccdc533;
-var $1f5c274a1b8d54c3$export$a5a6e0b888b2c992;
+var $1f5c274a1b8d54c3$export$1113ec858cdbc244;
 var $1f5c274a1b8d54c3$export$419647d5ce4279cb;
 var $1f5c274a1b8d54c3$export$1d0f1d0b062c3bee;
-var $1f5c274a1b8d54c3$export$b4dbb67ffc3cc7a9;
 var $1f5c274a1b8d54c3$export$90f42dafd5c24d2d;
 var $1f5c274a1b8d54c3$export$9ea3835d1b44cc08;
+var $1f5c274a1b8d54c3$export$b4dbb67ffc3cc7a9;
 $1f5c274a1b8d54c3$export$5ec584901c06c5b9 = "map-page_4c0a66";
 $1f5c274a1b8d54c3$export$2a73fca7b70dce31 = "fit-viewport_4c0a66";
 $1f5c274a1b8d54c3$export$cc73204c64cc0950 = "compass-control_4c0a66";
@@ -596,14 +595,12 @@ $1f5c274a1b8d54c3$export$b56f659d649f0d92 = "map-scale-control_4c0a66";
 $1f5c274a1b8d54c3$export$e017ebf46ba443ed = "detail-panel-enter_4c0a66";
 $1f5c274a1b8d54c3$export$69fa1b5d46c139b9 = "infodrawer-stack_4c0a66";
 $1f5c274a1b8d54c3$export$c6930745f2610de0 = "detail-panel_4c0a66";
-$1f5c274a1b8d54c3$export$10fedbc2931d16b1 = "panel-open_4c0a66";
-$1f5c274a1b8d54c3$export$7be255094ccdc533 = "layers_4c0a66";
-$1f5c274a1b8d54c3$export$a5a6e0b888b2c992 = "settings_4c0a66";
+$1f5c274a1b8d54c3$export$1113ec858cdbc244 = "context-panel-holder_4c0a66";
 $1f5c274a1b8d54c3$export$419647d5ce4279cb = "detail-panel-from_4c0a66";
 $1f5c274a1b8d54c3$export$1d0f1d0b062c3bee = "detail-panel-leave_4c0a66";
-$1f5c274a1b8d54c3$export$b4dbb67ffc3cc7a9 = "context-panel_4c0a66";
 $1f5c274a1b8d54c3$export$90f42dafd5c24d2d = "context-panel-from_4c0a66";
 $1f5c274a1b8d54c3$export$9ea3835d1b44cc08 = "context-panel-enter_4c0a66";
+$1f5c274a1b8d54c3$export$b4dbb67ffc3cc7a9 = "context-panel_4c0a66";
 
 
 
@@ -668,9 +665,6 @@ function $91d5aa004eeb2226$export$db1a2e058a06fb5c() {
 
 
 
-function $4bdfa9cd8240b2fd$export$57b87f3e07d4bb90() {
-    return $4bdfa9cd8240b2fd$var$h("div", "Hello world");
-}
 const $4bdfa9cd8240b2fd$var$h = (0, $Zz0sd$macrostrathyper).styled((0, (/*@__PURE__*/$parcel$interopDefault($1f5c274a1b8d54c3$exports))));
 const $4bdfa9cd8240b2fd$export$ec68dd77edbe678b = (props)=>$4bdfa9cd8240b2fd$var$h((0, $Zz0sd$Card), {
         ...props,
@@ -687,25 +681,28 @@ function $4bdfa9cd8240b2fd$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, $Zz0sd$classnames)({
-        searching: false,
+  */ const mainUIClassName = (0, $Zz0sd$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 $4bdfa9cd8240b2fd$var$h($4bdfa9cd8240b2fd$export$fa395a37c3898ae3, {
-        className: (0, $Zz0sd$classnames)("map-page", className),
+        className: (0, $Zz0sd$classnames)("map-page", className, {
+            "fit-viewport": fitViewport
+        }),
         mapPosition: mapPosition
     }, [
         $4bdfa9cd8240b2fd$var$h("div.main-ui", {
-            className: _className,
+            className: mainUIClassName,
             ...rest
         }, [
-            $4bdfa9cd8240b2fd$var$h("div.context-stack", contextStackProps, [
+            $4bdfa9cd8240b2fd$var$h("div.context-stack", [
                 navbar,
-                $4bdfa9cd8240b2fd$var$h.if(contextPanelTrans.shouldMount)([
-                    contextPanel
-                ]), 
+                $4bdfa9cd8240b2fd$var$h("div.context-panel-holder", [
+                    $4bdfa9cd8240b2fd$var$h.if(contextPanelTrans.shouldMount)([
+                        contextPanel
+                    ]), 
+                ]),
+                $4bdfa9cd8240b2fd$var$h("div.spacer"), 
             ]),
             //h(MapView),
             children ?? mainPanel,
@@ -724,7 +721,7 @@ function $4bdfa9cd8240b2fd$var$_MapAreaContainer({ children: children , classNam
 const $4bdfa9cd8240b2fd$var$MapProviders = ({ children: children  })=>$4bdfa9cd8240b2fd$var$h((0, $Zz0sd$ToasterContext), $4bdfa9cd8240b2fd$var$h((0, $Zz0sd$MapboxMapProvider), children));
 const $4bdfa9cd8240b2fd$export$9fa5da0bcfd0a290 = (props)=>$4bdfa9cd8240b2fd$var$h($4bdfa9cd8240b2fd$var$MapProviders, $4bdfa9cd8240b2fd$var$h($4bdfa9cd8240b2fd$var$_MapAreaContainer, props));
 function $4bdfa9cd8240b2fd$export$fa395a37c3898ae3({ className: className , children: children  }) {
-    const { mapPosition: mapPosition  } = (0, $Zz0sd$useMapStatus)();
+    const mapPosition = (0, $Zz0sd$useMapPosition)();
     if (mapPosition != null) {
         const { mapIsRotated: mapIsRotated , mapUse3D: mapUse3D , mapIsGlobal: mapIsGlobal  } = (0, $Zz0sd$mapViewInfo)(mapPosition);
         className = (0, $Zz0sd$classnames)(className, {
@@ -827,6 +824,7 @@ function $4bc3dd5f0732eed3$export$2ab96428dea558d6({ containerRef: containerRef
             updateMapPadding();
         }
     });
+    // Ideally, we would not have to do this when we know the infobox is loaded
     (0, $Zz0sd$useMapEaseToCenter)(infoMarkerPosition, padding);
     return null;
 }
@@ -948,8 +946,11 @@ $parcel$export($9e150e311a3261e9$exports, "MapTerrainManager", () => $9e150e311a
 
 var $1ea1ddb7a7b84e13$exports = {};
 
+$parcel$export($1ea1ddb7a7b84e13$exports, "mapbox-map", () => $1ea1ddb7a7b84e13$export$d0dcaf774d09fc4c, (v) => $1ea1ddb7a7b84e13$export$d0dcaf774d09fc4c = v);
 $parcel$export($1ea1ddb7a7b84e13$exports, "map-view-container", () => $1ea1ddb7a7b84e13$export$11aa7dc57218208d, (v) => $1ea1ddb7a7b84e13$export$11aa7dc57218208d = v);
+var $1ea1ddb7a7b84e13$export$d0dcaf774d09fc4c;
 var $1ea1ddb7a7b84e13$export$11aa7dc57218208d;
+$1ea1ddb7a7b84e13$export$d0dcaf774d09fc4c = `-mD4Aa_mapbox-map`;
 $1ea1ddb7a7b84e13$export$11aa7dc57218208d = `-mD4Aa_map-view-container`;
 
 
@@ -1004,11 +1005,13 @@ function $286fbb15f2139dc1$var$getTerrainSourceID(map) {
 
 
 
+
 const $9e150e311a3261e9$var$h = (0, $Zz0sd$macrostrathyper).styled({
     ...(0, (/*@__PURE__*/$parcel$interopDefault($1ea1ddb7a7b84e13$exports))),
     ...(0, (/*@__PURE__*/$parcel$interopDefault($1f5c274a1b8d54c3$exports)))
 });
-function $9e150e311a3261e9$var$initializeMap(container, args = {}) {
+function $9e150e311a3261e9$var$defaultInitializeMap(container, args = {}) {
+    const { mapPosition: mapPosition , ...rest } = args;
     const map = new (0, $Zz0sd$mapboxgl).Map({
         container: container,
         maxZoom: 18,
@@ -1017,8 +1020,10 @@ function $9e150e311a3261e9$var$initializeMap(container, args = {}) {
         trackResize: true,
         antialias: true,
         optimizeForTerrain: true,
-        ...args
+        ...rest
     });
+    // set initial map position
+    if (mapPosition != null) (0, $Zz0sd$setMapPosition)(map, mapPosition);
     //setMapPosition(map, mapPosition);
     return map;
 }
@@ -1031,7 +1036,7 @@ const $9e150e311a3261e9$var$defaultMapPosition = {
 };
 function $9e150e311a3261e9$export$ab1e7a67d6ec5ad8(props) {
     let { terrainSourceID: terrainSourceID  } = props;
-    const { enableTerrain: enableTerrain = true , style: style , transformRequest: transformRequest , mapPosition: mapPosition = $9e150e311a3261e9$var$defaultMapPosition , children: children , accessToken: accessToken , infoMarkerPosition: infoMarkerPosition , projection: projection ,  } = props;
+    const { enableTerrain: enableTerrain = true , style: style , mapPosition: mapPosition = $9e150e311a3261e9$var$defaultMapPosition , initializeMap: initializeMap = $9e150e311a3261e9$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, $Zz0sd$mapboxgl).accessToken = accessToken;
     const dispatch = (0, $Zz0sd$useMapDispatch)();
@@ -1040,47 +1045,45 @@ function $9e150e311a3261e9$export$ab1e7a67d6ec5ad8(props) {
     const parentRef = (0, $Zz0sd$useRef)();
     // Keep track of map position for reloads
     (0, $Zz0sd$useEffect)(()=>{
-        if (style == null || ref.current == null || dispatch == null) return;
-        if (mapRef?.current != null) return;
-        console.log("Initializing map");
-        const map = $9e150e311a3261e9$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, $Zz0sd$useEffect)(()=>{
-        if (mapRef?.current == null || style == null) return;
-        mapRef?.current?.setStyle(style);
-    }, [
-        mapRef.current,
-        style
-    ]);
-    (0, $Zz0sd$useEffect)(()=>{
-        const map = mapRef.current;
-        if (map == null || mapPosition == null) return;
-        (0, $Zz0sd$setMapPosition)(map, mapPosition);
-    }, [
-        mapRef.current
-    ]);
-    const { mapPosition: _computedMapPosition  } = (0, $Zz0sd$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, $Zz0sd$useMapPosition)();
     const { mapUse3D: mapUse3D , mapIsRotated: mapIsRotated  } = (0, $Zz0sd$mapViewInfo)(_computedMapPosition);
     // Get map projection
     const _projection = mapRef.current?.getProjection()?.name ?? "mercator";
@@ -1219,8 +1222,10 @@ function $1d4d29ef2725aa16$export$86c09739b12f23cd({ tile: tile , color: color =
 
 var $b8c84b63e75fe4f2$exports = {};
 
+$parcel$export($b8c84b63e75fe4f2$exports, "FeatureProperties", () => $b8c84b63e75fe4f2$export$2906e7f4b228efe9);
 $parcel$export($b8c84b63e75fe4f2$exports, "FeatureRecord", () => $b8c84b63e75fe4f2$export$dc87b4d46cea200d);
 $parcel$export($b8c84b63e75fe4f2$exports, "FeatureSelectionHandler", () => $b8c84b63e75fe4f2$export$214daccdda0f4ac6);
+$parcel$export($b8c84b63e75fe4f2$exports, "Features", () => $b8c84b63e75fe4f2$export$617d79dae526d2cf);
 $parcel$export($b8c84b63e75fe4f2$exports, "TileInfo", () => $b8c84b63e75fe4f2$export$43c75dec9d0b96c);
 $parcel$export($b8c84b63e75fe4f2$exports, "FeaturePanel", () => $b8c84b63e75fe4f2$export$43277c51a01761c1);
 
@@ -1238,6 +1243,7 @@ $parcel$export($d570ac304373e71c$exports, "ExpansionPanel", () => $d570ac304373e
 $parcel$export($d570ac304373e71c$exports, "SubExpansionPanel", () => $d570ac304373e71c$export$d7160281aff7c3b8);
 $parcel$export($d570ac304373e71c$exports, "ExpandableDetailsPanel", () => $d570ac304373e71c$export$44ad9ff780615135);
 $parcel$export($d570ac304373e71c$exports, "ExpansionBody", () => $d570ac304373e71c$export$263416b670b3f129);
+$parcel$export($d570ac304373e71c$exports, "PanelSubhead", () => $72e497a412b1da0a$export$ed081779ec3709aa);
 
 
 
@@ -1416,28 +1422,27 @@ function $d570ac304373e71c$export$263416b670b3f129({ title: title , className: c
 
 
 const $b8c84b63e75fe4f2$var$h = (0, $Zz0sd$macrostrathyper).styled((0, (/*@__PURE__*/$parcel$interopDefault($bfe9593b6c29b10b$exports))));
-function $b8c84b63e75fe4f2$var$usePrevious(value) {
-    const ref = (0, $Zz0sd$useRef)();
-    (0, $Zz0sd$useEffect)(()=>{
-        ref.current = value;
-    });
-    return ref.current;
+function $b8c84b63e75fe4f2$export$2906e7f4b228efe9({ data: data , ...rest }) {
+    return $b8c84b63e75fe4f2$var$h("div.feature-properties", [
+        $b8c84b63e75fe4f2$var$h((0, $Zz0sd$JSONView), {
+            data: data,
+            hideRoot: true,
+            ...rest
+        }), 
+    ]);
 }
 function $b8c84b63e75fe4f2$export$dc87b4d46cea200d({ feature: feature  }) {
     const props = feature.properties;
     return $b8c84b63e75fe4f2$var$h("div.feature-record", [
-        $b8c84b63e75fe4f2$var$h.if(Object.keys(props).length > 0)("div.feature-properties", [
-            $b8c84b63e75fe4f2$var$h((0, $Zz0sd$JSONView), {
-                data: props,
-                hideRoot: true
-            }), 
-        ]), 
+        $b8c84b63e75fe4f2$var$h.if(Object.keys(props).length > 0)($b8c84b63e75fe4f2$export$2906e7f4b228efe9, {
+            data: props
+        }), 
     ]);
 }
 function $b8c84b63e75fe4f2$export$214daccdda0f4ac6({ selectedLocation: selectedLocation , setFeatures: setFeatures , radius: radius = 2  }) {
     const mapRef = (0, $Zz0sd$useMapRef)();
     const { isLoading: isLoading  } = (0, $Zz0sd$useMapStatus)();
-    const prevLocation = $b8c84b63e75fe4f2$var$usePrevious(selectedLocation);
+    const prevLocation = (0, $Zz0sd$usePrevious)(selectedLocation);
     (0, $Zz0sd$useEffect)(()=>{
         const map = mapRef?.current;
         if (map == null) return;
@@ -1509,7 +1514,7 @@ function $b8c84b63e75fe4f2$var$LoadingAwareFeatureSet({ features: features , sou
         sourceFeatures.length
     ]);
     if (!isLoaded1) return $b8c84b63e75fe4f2$var$h((0, $Zz0sd$Spinner));
-    return $b8c84b63e75fe4f2$var$h($b8c84b63e75fe4f2$var$Features, {
+    return $b8c84b63e75fe4f2$var$h($b8c84b63e75fe4f2$export$617d79dae526d2cf, {
         features: sourceFeatures
     });
 }
@@ -1590,27 +1595,32 @@ function $b8c84b63e75fe4f2$export$43277c51a01761c1({ features: features , focuse
             className: "basemap-features",
             expanded: focusedSource == null
         }, [
-            $b8c84b63e75fe4f2$var$h($b8c84b63e75fe4f2$var$Features, {
+            $b8c84b63e75fe4f2$var$h($b8c84b63e75fe4f2$var$FeatureGroups, {
                 features: filteredFeatures
             }), 
         ]), 
     ]);
 }
-function $b8c84b63e75fe4f2$var$Features({ features: features1  }) {
+function $b8c84b63e75fe4f2$var$FeatureGroups({ features: features1  }) {
     /** Group features by source and sourceLayer */ if (features1 == null) return null;
     const groups = (0, $Zz0sd$group)(features1, (d)=>`${d.source} - ${d.sourceLayer}`);
-    return $b8c84b63e75fe4f2$var$h("div.features", Array.from(groups).map(([key, features])=>{
+    return $b8c84b63e75fe4f2$var$h("div.feature-groups", Array.from(groups).map(([key, features])=>{
         return $b8c84b63e75fe4f2$var$h("div.feature-group", [
             $b8c84b63e75fe4f2$var$h($b8c84b63e75fe4f2$var$FeatureHeader, {
                 feature: features[0]
             }),
-            features.map((feature, i)=>$b8c84b63e75fe4f2$var$h($b8c84b63e75fe4f2$export$dc87b4d46cea200d, {
-                    key: i,
-                    feature: feature
-                })), 
+            $b8c84b63e75fe4f2$var$h($b8c84b63e75fe4f2$export$617d79dae526d2cf, {
+                features: features
+            }), 
         ]);
     }));
 }
+function $b8c84b63e75fe4f2$export$617d79dae526d2cf({ features: features  }) {
+    return $b8c84b63e75fe4f2$var$h("div.features", features.map((feature, i)=>$b8c84b63e75fe4f2$var$h($b8c84b63e75fe4f2$export$dc87b4d46cea200d, {
+            key: i,
+            feature: feature
+        })));
+}
 
 
 let $a281a0612311d660$export$dce4b6e67bb5f25a;
@@ -1757,5 +1767,5 @@ $parcel$exportWildcard($b6d2ac1192949c28$exports, $64ee2eed3ed5ffbc$exports);
 
 
 
-export {$6e914c81c8e053da$export$4ec83e90d030b2f3 as LoadingButton, $6e914c81c8e053da$export$9e3bae3c08bde368 as MapLoadingButton, $6e914c81c8e053da$export$a8cc0062d02a3841 as FloatingNavbar, $f50c3537aaff0cff$export$83f9a19cf91c2d06 as InfoDrawerContainer, $f50c3537aaff0cff$export$aa4baff5242ea6e1 as LocationPanel, $a281a0612311d660$export$dce4b6e67bb5f25a as MacrostratVectorTileset, $a281a0612311d660$export$cc7c195070dfb906 as MacrostratRasterTileset, $a281a0612311d660$export$dda1d9f60106f0e9 as h, $a281a0612311d660$export$2391061fbdfb71ef as DevMapPage, $1d4d29ef2725aa16$export$86c09739b12f23cd as TileExtentLayer, $b8c84b63e75fe4f2$export$dc87b4d46cea200d as FeatureRecord, $b8c84b63e75fe4f2$export$214daccdda0f4ac6 as FeatureSelectionHandler, $b8c84b63e75fe4f2$export$43c75dec9d0b96c as TileInfo, $b8c84b63e75fe4f2$export$43277c51a01761c1 as FeaturePanel, $64ee2eed3ed5ffbc$export$eff5fb2e10d05b1d as buildXRayStyle, $64ee2eed3ed5ffbc$export$e739dc8dfc0db9a6 as buildInspectorStyle, $4bdfa9cd8240b2fd$export$57b87f3e07d4bb90 as MapInterface, $4bdfa9cd8240b2fd$export$ec68dd77edbe678b as PanelCard, $4bdfa9cd8240b2fd$export$fa395a37c3898ae3 as MapStyledContainer, $4bdfa9cd8240b2fd$export$9fa5da0bcfd0a290 as MapAreaContainer, $9e150e311a3261e9$export$ab1e7a67d6ec5ad8 as MapView, $9e150e311a3261e9$export$cee395a8a2a00b29 as MapTerrainManager, $91d5aa004eeb2226$export$db1a2e058a06fb5c as MapBottomControls, $4bc3dd5f0732eed3$export$31b2e088aff2dc5d as MapResizeManager, $4bc3dd5f0732eed3$export$2ab96428dea558d6 as MapPaddingManager, $4bc3dd5f0732eed3$export$f6eeee399afc4e9a as MapMovedReporter, $4bc3dd5f0732eed3$export$e57f9eaa51773f82 as MapLoadingReporter, $4bc3dd5f0732eed3$export$5c90a91c7455938c as MapMarker, $82fe09613877ffc2$export$bb78f9f01775eef1 as getMapPadding, $82fe09613877ffc2$export$278090850f6b3a9f as useMapMarker, $4fae2d573d730db8$export$716098b85fd0efdf as ValueWithUnit, $4fae2d573d730db8$export$af8082af0bea3eb1 as DegreeCoord, $4fae2d573d730db8$export$f195b3550849e560 as LngLatCoords, $4fae2d573d730db8$export$58bfb4f6ec5aa58d as Elevation, $d570ac304373e71c$export$cea00a9d724d5a32 as ExpansionPanelSummary, $d570ac304373e71c$export$39c134eb0b07cf0e as InfoPanelSection, $d570ac304373e71c$export$40e646e38e6ed100 as ExpansionPanel, $d570ac304373e71c$export$d7160281aff7c3b8 as SubExpansionPanel, $d570ac304373e71c$export$44ad9ff780615135 as ExpandableDetailsPanel, $d570ac304373e71c$export$263416b670b3f129 as ExpansionBody};
+export {$6e914c81c8e053da$export$4ec83e90d030b2f3 as LoadingButton, $6e914c81c8e053da$export$9e3bae3c08bde368 as MapLoadingButton, $6e914c81c8e053da$export$a8cc0062d02a3841 as FloatingNavbar, $f50c3537aaff0cff$export$83f9a19cf91c2d06 as InfoDrawerContainer, $f50c3537aaff0cff$export$aa4baff5242ea6e1 as LocationPanel, $a281a0612311d660$export$dce4b6e67bb5f25a as MacrostratVectorTileset, $a281a0612311d660$export$cc7c195070dfb906 as MacrostratRasterTileset, $a281a0612311d660$export$dda1d9f60106f0e9 as h, $a281a0612311d660$export$2391061fbdfb71ef as DevMapPage, $1d4d29ef2725aa16$export$86c09739b12f23cd as TileExtentLayer, $b8c84b63e75fe4f2$export$2906e7f4b228efe9 as FeatureProperties, $b8c84b63e75fe4f2$export$dc87b4d46cea200d as FeatureRecord, $b8c84b63e75fe4f2$export$214daccdda0f4ac6 as FeatureSelectionHandler, $b8c84b63e75fe4f2$export$617d79dae526d2cf as Features, $b8c84b63e75fe4f2$export$43c75dec9d0b96c as TileInfo, $b8c84b63e75fe4f2$export$43277c51a01761c1 as FeaturePanel, $64ee2eed3ed5ffbc$export$eff5fb2e10d05b1d as buildXRayStyle, $64ee2eed3ed5ffbc$export$e739dc8dfc0db9a6 as buildInspectorStyle, $4bdfa9cd8240b2fd$export$ec68dd77edbe678b as PanelCard, $4bdfa9cd8240b2fd$export$fa395a37c3898ae3 as MapStyledContainer, $4bdfa9cd8240b2fd$export$9fa5da0bcfd0a290 as MapAreaContainer, $9e150e311a3261e9$export$ab1e7a67d6ec5ad8 as MapView, $9e150e311a3261e9$export$cee395a8a2a00b29 as MapTerrainManager, $91d5aa004eeb2226$export$db1a2e058a06fb5c as MapBottomControls, $4bc3dd5f0732eed3$export$31b2e088aff2dc5d as MapResizeManager, $4bc3dd5f0732eed3$export$2ab96428dea558d6 as MapPaddingManager, $4bc3dd5f0732eed3$export$f6eeee399afc4e9a as MapMovedReporter, $4bc3dd5f0732eed3$export$e57f9eaa51773f82 as MapLoadingReporter, $4bc3dd5f0732eed3$export$5c90a91c7455938c as MapMarker, $82fe09613877ffc2$export$bb78f9f01775eef1 as getMapPadding, $82fe09613877ffc2$export$278090850f6b3a9f as useMapMarker, $4fae2d573d730db8$export$716098b85fd0efdf as ValueWithUnit, $4fae2d573d730db8$export$af8082af0bea3eb1 as DegreeCoord, $4fae2d573d730db8$export$f195b3550849e560 as LngLatCoords, $4fae2d573d730db8$export$58bfb4f6ec5aa58d as Elevation, $d570ac304373e71c$export$cea00a9d724d5a32 as ExpansionPanelSummary, $d570ac304373e71c$export$39c134eb0b07cf0e as InfoPanelSection, $d570ac304373e71c$export$40e646e38e6ed100 as ExpansionPanel, $d570ac304373e71c$export$d7160281aff7c3b8 as SubExpansionPanel, $d570ac304373e71c$export$44ad9ff780615135 as ExpandableDetailsPanel, $d570ac304373e71c$export$263416b670b3f129 as ExpansionBody, $72e497a412b1da0a$export$ed081779ec3709aa as PanelSubhead};
 //# sourceMappingURL=index.js.map