@macrostrat/map-interface 1.0.9 → 1.0.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (18) hide show
  1. package/CHANGELOG.md +11 -0
  2. package/dist/main.cjs +70 -23
  3. package/dist/main.cjs.map +1 -1
  4. package/dist/main.css +12 -2
  5. package/dist/main.css.map +1 -1
  6. package/dist/module.css +12 -2
  7. package/dist/module.css.map +1 -1
  8. package/dist/module.mjs +72 -25
  9. package/dist/module.mjs.map +1 -1
  10. package/dist/types.d.ts +52 -57
  11. package/dist/types.d.ts.map +1 -1
  12. package/package.json +4 -2
  13. package/src/container.ts +3 -3
  14. package/src/context-panel/index.ts +52 -9
  15. package/src/context-panel/main.module.sass +10 -2
  16. package/src/dev/map-page.ts +9 -6
  17. package/src/helpers.ts +20 -2
  18. package/src/main.module.sass +6 -1
package/dist/main.css.map CHANGED
@@ -1 +1 @@
1
- {"mappings":"ACAA;;;;;;;AAKE;;;;;AAGA;;;;;;;;;;;AASE;;;;;AAIJ;;;;;AAIA;;;;;;AAOA;EACE;;;;;;;ACjCF;;;;AAGE;;;;AAGF;;;;;;;;;AAQE;;;;AAGA;;;;AAGA;;;;AAGF;;;;AAGE;;;;;AAIF;;;;;;;;;;;AAUE;;;;;AAME;;;;;AAKJ;;;;AAGA;;;;;;;;AAQA;EACE;;;;;AC/DF;;;;;;;;;AASI;;;;AAGF;;;;;;AAOA;;;;AAIE;;;;AAGF;;;;AAGA;;;;AAGA;;;;AAME;;;;AAGF;;;;AAIE;;;;;AAME;;;;;;;;;;;;;;;;;;;;;;AAgBJ;;;;;;;;;AAOA;;;;;;;;;;AAYF;;;;;AAME;;;;AAGA;;;;;;;;;;AASA;;;;;;;;;;;;AAQA;;;;;;;;;;;;;;AAWA;;;;;;;;;;;;;;;AAUF;;;;;;;;AAKE;;;;;;;AAKA;;;;;;;;;;;;;;;;;AAYA;;;;;AAGA;;;;AAGA;;;;;;;AAMA;;;;;;AAKA;;;;;;;;;;;;;;;AAWA;;;;AAEF;;;;AAGE;;;;AAEF;;;;;;;;;AAME;;;;;AAGA;;;;;;;;;;;;;;;;AAaI;;;;AAGF;;;;AAGA;;;;AAGF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmCA;;;;;;;;AAOE;;;;;;;;;;;;;;AAYJ;;;;;;;;;AASE;;;;;;AAME;;;;;;AAMJ;EAAA;;;;;;EAOE;;;;;;EAEF;;;;EAKE;;;;EAGA;;;;EASF;;;;;;EAKE;;;;;AAQF;EAMI;;;;;;;;;;;;;;;;;;EAgBF;;;;;;EAKA;;;;;;;;EAMF;;;;;EAKI;;;;EAIA;;;;;;EAKF;;;;;EAIE;;;;;EAIA;;;;EAGE;;;;;;;;EAWA;;;;;;;;;;AASJ;;;;;;;;;AAOE;;;;AAGE;;;;AAMA;;;;AAGF;;;;AAGF;;;;AAGE;;;;AAQA;;;;AAGE;;;;AAIJ;;;;AAGA;EACE;;;;EAGA;;;;;;;;;;;;;;EAcA;;;;EAKA;;;;;AAIE;;;;;;;;;;;;;;ACneN;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBE;;;;;;;AAKE;;;;;AAGF;;;;;AAGF;;;;;;;;;;AAMA;;;;AAGE;;;;AAEE;;;;;AAGF;;;;;;;;;;;AASE;;;;ACjDJ;;;;;;;;;;;;;;AAYE;;;;;;AAIA;;;;AAEA;;;;;;;;;;;;;;AAaA;;;;;AAMA;;;;AAGE;;;;;AAGA;;;;;AAIA;;;;AAEA;;;;;;;;;AAOE;;;;;;;;;;;;AASJ;;;;AAEE;;;;AAEA;;;;;AAGF;;;;AAEE;;;;;AAGE;;;;AAEN;;;;;;;;;;;;;;;;;;;;;;;;AAoBE;;;;;;;;AAKA;;;;;;;;AAKA;;;;AAGA;;;;;;;;;;;AASE;;;;;;;;AAOF;;;;AAGA","sources":["026f05482703be1f","packages/map-interface/src/context-panel/main.module.sass","packages/map-interface/src/location-panel/main.module.sass","packages/map-interface/src/main.module.sass","packages/map-interface/src/dev/main.module.sass","packages/map-interface/src/expansion-panel/main.module.sass"],"sourcesContent":["@import \"ae7b07f141202fc9\";\n@import \"48f0a4a6f8ddc91e\";\n@import \"82cdba93b0548a93\";\n@import \"07c2aff8cd76b425\";\n@import \"b685950deb9cf075\";\n",".searchbar-holder\n transition: margin 300ms\n display: flex\n flex-direction: column\n margin: 0\n .navbar-holder\n display: flex\n flex-direction: row\n .searchbar\n width: 100%\n background-color: var(--panel-background-color)\n border-radius: 5px\n padding: 0 5px\n display: flex\n flex-direction: row\n align-items: center\n gap: 5px\n :global(.bp5-input-group)\n flex-grow: 1\n cursor: text\n\n:global(.bp5-navbar)>.loading-button\n width: 40px\n height: 40px\n\n.status-tongue\n background-color: var(--panel-background-color)\n margin: 5px\n margin-top: -12px\n padding: 0\n padding-top: 12px\n\n@media screen and (max-width: 768px)\n .status-tongue\n max-width: 100vw\n margin: 0\n border-radius: 0\n margin-top: -3px\n",".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: 1em\n border-bottom: 1px solid var(--panel-rule-color)\n\n .spacer\n flex-grow: 1\n\n .left-icon\n padding: 7px\n\n .position-controls :global(.bp5-button)\n font-size: 12px !important\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: hidden\n background-color: var(--panel-background-color)\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 1em\n\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",".map-container\n display: flex\n flex-direction: column\n position: relative\n width: 100%\n height: 100%\n overflow: hidden\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.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\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.panel-card\n padding: 10px\n background-color: var(--panel-background-color)\n overflow: hidden\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 .map-view-container\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 &.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 /* Make map fill page rather than containing div,\n by unsetting map position */\n .map-view-container\n position: unset\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// 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",".feature-panel\n position: relative\n margin: 0 -1em\n\n.key-value\n display: inline-block\n margin-right: 1em\n .key\n font-weight: bold\n font-size: 0.9em\n &:after\n content: ': '\n .value\n font-size: 0.9em\n\n.feature-properties\n position: relative\n &:before\n content: \"–\"\n position: absolute\n top: 4px\n left: 0\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 &:last-child\n border-bottom: none\n\n.tile-info\n display: flex\n flex-direction: row\n align-items: baseline\n h3\n margin-right: 0.5em\n\n.opacity-slider\n margin: 0 1em 0.5em\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","\n.panel-subhead\n padding: 0.2em var(--box-horizontal-padding)\n border-top: 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(--box-horizontal-padding)\n top: -1px\n position: sticky\n h1, h2, h3, h4\n font-family: Montserrat,sans-serif\n font-weight: 700\n margin: 0.2em 0\n h4\n font-weight: 600\n .title\n flex-grow: 1\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 &: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 margin-top: -1px\n padding: 5px 1em 5px\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: 5px 1em 10px\n .expansion-panel\n margin-left: -1em\n margin-right: -1em\n &:first-child\n margin-top: -5px\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.css.map"}
1
+ {"mappings":"ACAA;;;;;;;AAME;;;;;AAIA;;;;;;;;;;;AAUE;;;;;AAIJ;;;;AAGA;;;;;AAIA;;;;;;;AASA;EACE;;;;;;;ACzCF;;;;AAGE;;;;AAGF;;;;;;;;;AAQE;;;;AAGA;;;;AAGA;;;;AAGF;;;;AAGE;;;;;AAIF;;;;;;;;;;;AAUE;;;;;AAME;;;;;AAKJ;;;;AAGA;;;;;;;;AAQA;EACE;;;;;AC/DF;;;;;;;;;AASI;;;;AAGF;;;;;;AAOA;;;;AAIE;;;;AAGF;;;;AAGA;;;;AAGA;;;;AAME;;;;AAGF;;;;AAIE;;;;;AAME;;;;;;;;;;;;;;;;;;;;;;AAgBJ;;;;;;;;;AAOA;;;;;;;;;;AAYF;;;;;AAME;;;;AAGA;;;;;AAKE;;;;;;AAKF;;;;AAEF;;;;AAGE;;;;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;;;;;;;;;;;;;;;;EA4BE;;;;;;;EAMA;;;;;;;;;;;;;;;;;;;;;;;;;EAoBJ;;;;;EAME;;;;EAIA;;;;;;;;;;;EASE;;;;;EAIA;;;;EAGA;;;;EAGE;;;;EAQF;;;;;AAKA;;;;;;;;;;AAQA;;;;AAGA;;;;AAGA;;;;;;;;;;;;;;;;AAeF;;;;AAQE;;;;AAGA;;;;;;;;;EAQF;;;;EAGA;;;;;EAOI;;;;EAGA;;;;;;;;;;;;;;AAaF;EACE;;;;EAGA;;;;EAGA;;;;;AC7eN;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBE;;;;;;;AAKE;;;;;AAGF;;;;;AAGF;;;;;;;;;;AAMA;;;;AAGE;;;;AAEE;;;;;AAGF;;;;;;;;;;;AASE;;;;ACjDJ;;;;;;;;;;;;;;AAYE;;;;;;AAIA;;;;AAEA;;;;;;;;;;;;;;AAaA;;;;;AAMA;;;;AAGE;;;;;AAGA;;;;;AAIA;;;;AAEA;;;;;;;;;AAOE;;;;;;;;;;;;AASJ;;;;AAEE;;;;AAEA;;;;;AAGF;;;;AAEE;;;;;AAGE;;;;AAEN;;;;;;;;;;;;;;;;;;;;;;;;AAoBE;;;;;;;;AAKA;;;;;;;;AAKA;;;;AAGA;;;;;;;;;;;AASE;;;;;;;;AAOF;;;;AAGA","sources":["026f05482703be1f","packages/map-interface/src/context-panel/main.module.sass","packages/map-interface/src/location-panel/main.module.sass","packages/map-interface/src/main.module.sass","packages/map-interface/src/dev/main.module.sass","packages/map-interface/src/expansion-panel/main.module.sass"],"sourcesContent":["@import \"ae7b07f141202fc9\";\n@import \"48f0a4a6f8ddc91e\";\n@import \"82cdba93b0548a93\";\n@import \"07c2aff8cd76b425\";\n@import \"b685950deb9cf075\";\n",".searchbar-holder\n transition: margin 300ms\n display: flex\n flex-direction: column\n margin: 0\n\n .navbar-holder\n display: flex\n flex-direction: row\n\n .searchbar\n width: 100%\n background-color: var(--panel-background-color)\n border-radius: 5px\n padding: var(--navbar-padding, 10px)\n display: flex\n flex-direction: row\n align-items: center\n gap: 5px\n\n :global(.bp5-input-group)\n flex-grow: 1\n cursor: text\n\n.navbar\n min-height: 50px\n\n:global(.bp5-navbar) > .loading-button\n width: 40px\n height: 40px\n\n.status-tongue\n background-color: var(--panel-background-color)\n margin: 5px\n margin-bottom: 0\n margin-top: -12px\n padding: 0\n padding-top: 12px\n overflow: hidden\n\n@media screen and (max-width: 768px)\n .status-tongue\n max-width: 100vw\n margin: 0\n border-radius: 0\n margin-top: -3px\n",".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: 1em\n border-bottom: 1px solid var(--panel-rule-color)\n\n .spacer\n flex-grow: 1\n\n .left-icon\n padding: 7px\n\n .position-controls :global(.bp5-button)\n font-size: 12px !important\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: hidden\n background-color: var(--panel-background-color)\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 1em\n\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",".map-container\n display: flex\n flex-direction: column\n position: relative\n width: 100%\n height: 100%\n overflow: hidden\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.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\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.context-panel-holder>:global(.bp5-card)\n padding: 10px\n background-color: var(--panel-background-color)\n\n.panel-card\n padding: 10px\n background-color: var(--panel-background-color)\n overflow: hidden\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 .map-view-container\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 &.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 /* Make map fill page rather than containing div,\n by unsetting map position */\n .map-view-container\n position: unset\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",".feature-panel\n position: relative\n margin: 0 -1em\n\n.key-value\n display: inline-block\n margin-right: 1em\n .key\n font-weight: bold\n font-size: 0.9em\n &:after\n content: ': '\n .value\n font-size: 0.9em\n\n.feature-properties\n position: relative\n &:before\n content: \"–\"\n position: absolute\n top: 4px\n left: 0\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 &:last-child\n border-bottom: none\n\n.tile-info\n display: flex\n flex-direction: row\n align-items: baseline\n h3\n margin-right: 0.5em\n\n.opacity-slider\n margin: 0 1em 0.5em\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","\n.panel-subhead\n padding: 0.2em var(--box-horizontal-padding)\n border-top: 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(--box-horizontal-padding)\n top: -1px\n position: sticky\n h1, h2, h3, h4\n font-family: Montserrat,sans-serif\n font-weight: 700\n margin: 0.2em 0\n h4\n font-weight: 600\n .title\n flex-grow: 1\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 &: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 margin-top: -1px\n padding: 5px 1em 5px\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: 5px 1em 10px\n .expansion-panel\n margin-left: -1em\n margin-right: -1em\n &:first-child\n margin-top: -5px\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.css.map"}
package/dist/module.css CHANGED
@@ -12,12 +12,12 @@
12
12
 
13
13
  ._8hZKsW_searchbar-holder ._8hZKsW_searchbar {
14
14
  background-color: var(--panel-background-color);
15
+ padding: var(--navbar-padding, 10px);
15
16
  border-radius: 5px;
16
17
  flex-direction: row;
17
18
  align-items: center;
18
19
  gap: 5px;
19
20
  width: 100%;
20
- padding: 0 5px;
21
21
  display: flex;
22
22
  }
23
23
 
@@ -26,6 +26,10 @@
26
26
  flex-grow: 1;
27
27
  }
28
28
 
29
+ ._8hZKsW_navbar {
30
+ min-height: 50px;
31
+ }
32
+
29
33
  .bp5-navbar > ._8hZKsW_loading-button {
30
34
  width: 40px;
31
35
  height: 40px;
@@ -33,8 +37,9 @@
33
37
 
34
38
  ._8hZKsW_status-tongue {
35
39
  background-color: var(--panel-background-color);
36
- margin: -12px 5px 5px;
40
+ margin: -12px 5px 0;
37
41
  padding: 12px 0 0;
42
+ overflow: hidden;
38
43
  }
39
44
 
40
45
  @media screen and (width <= 768px) {
@@ -224,6 +229,11 @@
224
229
  position: absolute;
225
230
  }
226
231
 
232
+ .context-panel-holder_4c0a66 > .bp5-card {
233
+ background-color: var(--panel-background-color);
234
+ padding: 10px;
235
+ }
236
+
227
237
  .panel-card_4c0a66 {
228
238
  background-color: var(--panel-background-color);
229
239
  padding: 10px;
package/dist/module.css.map CHANGED
@@ -1 +1 @@
1
- {"mappings":"ACAA;;;;;;;AAKE;;;;;AAGA;;;;;;;;;;;AASE;;;;;AAIJ;;;;;AAIA;;;;;;AAOA;EACE;;;;;;;ACjCF;;;;AAGE;;;;AAGF;;;;;;;;;AAQE;;;;AAGA;;;;AAGA;;;;AAGF;;;;AAGE;;;;;AAIF;;;;;;;;;;;AAUE;;;;;AAME;;;;;AAKJ;;;;AAGA;;;;;;;;AAQA;EACE;;;;;AC/DF;;;;;;;;;AASI;;;;AAGF;;;;;;AAOA;;;;AAIE;;;;AAGF;;;;AAGA;;;;AAGA;;;;AAME;;;;AAGF;;;;AAIE;;;;;AAME;;;;;;;;;;;;;;;;;;;;;;AAgBJ;;;;;;;;;AAOA;;;;;;;;;;AAYF;;;;;AAME;;;;AAGA;;;;;;;;;;AASA;;;;;;;;;;;;AAQA;;;;;;;;;;;;;;AAWA;;;;;;;;;;;;;;;AAUF;;;;;;;;AAKE;;;;;;;AAKA;;;;;;;;;;;;;;;;;AAYA;;;;;AAGA;;;;AAGA;;;;;;;AAMA;;;;;;AAKA;;;;;;;;;;;;;;;AAWA;;;;AAEF;;;;AAGE;;;;AAEF;;;;;;;;;AAME;;;;;AAGA;;;;;;;;;;;;;;;;AAaI;;;;AAGF;;;;AAGA;;;;AAGF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmCA;;;;;;;;AAOE;;;;;;;;;;;;;;AAYJ;;;;;;;;;AASE;;;;;;AAME;;;;;;AAMJ;EAAA;;;;;;EAOE;;;;;;EAEF;;;;EAKE;;;;EAGA;;;;EASF;;;;;;EAKE;;;;;AAQF;EAMI;;;;;;;;;;;;;;;;;;EAgBF;;;;;;EAKA;;;;;;;;EAMF;;;;;EAKI;;;;EAIA;;;;;;EAKF;;;;;EAIE;;;;;EAIA;;;;EAGE;;;;;;;;EAWA;;;;;;;;;;AASJ;;;;;;;;;AAOE;;;;AAGE;;;;AAMA;;;;AAGF;;;;AAGF;;;;AAGE;;;;AAQA;;;;AAGE;;;;AAIJ;;;;AAGA;EACE;;;;EAGA;;;;;;;;;;;;;;EAcA;;;;EAKA;;;;;AAIE;;;;;;;;;;;;;;ACneN;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBE;;;;;;;AAKE;;;;;AAGF;;;;;AAGF;;;;;;;;;;AAMA;;;;AAGE;;;;AAEE;;;;;AAGF;;;;;;;;;;;AASE;;;;ACjDJ;;;;;;;;;;;;;;AAYE;;;;;;AAIA;;;;AAEA;;;;;;;;;;;;;;AAaA;;;;;AAMA;;;;AAGE;;;;;AAGA;;;;;AAIA;;;;AAEA;;;;;;;;;AAOE;;;;;;;;;;;;AASJ;;;;AAEE;;;;AAEA;;;;;AAGF;;;;AAEE;;;;;AAGE;;;;AAEN;;;;;;;;;;;;;;;;;;;;;;;;AAoBE;;;;;;;;AAKA;;;;;;;;AAKA;;;;AAGA;;;;;;;;;;;AASE;;;;;;;;AAOF;;;;AAGA","sources":["bc15657a39a35746","packages/map-interface/src/context-panel/main.module.sass","packages/map-interface/src/location-panel/main.module.sass","packages/map-interface/src/main.module.sass","packages/map-interface/src/dev/main.module.sass","packages/map-interface/src/expansion-panel/main.module.sass"],"sourcesContent":["@import \"ae7b07f141202fc9\";\n@import \"48f0a4a6f8ddc91e\";\n@import \"82cdba93b0548a93\";\n@import \"07c2aff8cd76b425\";\n@import \"b685950deb9cf075\";\n",".searchbar-holder\n transition: margin 300ms\n display: flex\n flex-direction: column\n margin: 0\n .navbar-holder\n display: flex\n flex-direction: row\n .searchbar\n width: 100%\n background-color: var(--panel-background-color)\n border-radius: 5px\n padding: 0 5px\n display: flex\n flex-direction: row\n align-items: center\n gap: 5px\n :global(.bp5-input-group)\n flex-grow: 1\n cursor: text\n\n:global(.bp5-navbar)>.loading-button\n width: 40px\n height: 40px\n\n.status-tongue\n background-color: var(--panel-background-color)\n margin: 5px\n margin-top: -12px\n padding: 0\n padding-top: 12px\n\n@media screen and (max-width: 768px)\n .status-tongue\n max-width: 100vw\n margin: 0\n border-radius: 0\n margin-top: -3px\n",".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: 1em\n border-bottom: 1px solid var(--panel-rule-color)\n\n .spacer\n flex-grow: 1\n\n .left-icon\n padding: 7px\n\n .position-controls :global(.bp5-button)\n font-size: 12px !important\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: hidden\n background-color: var(--panel-background-color)\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 1em\n\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",".map-container\n display: flex\n flex-direction: column\n position: relative\n width: 100%\n height: 100%\n overflow: hidden\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.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\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.panel-card\n padding: 10px\n background-color: var(--panel-background-color)\n overflow: hidden\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 .map-view-container\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 &.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 /* Make map fill page rather than containing div,\n by unsetting map position */\n .map-view-container\n position: unset\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// 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",".feature-panel\n position: relative\n margin: 0 -1em\n\n.key-value\n display: inline-block\n margin-right: 1em\n .key\n font-weight: bold\n font-size: 0.9em\n &:after\n content: ': '\n .value\n font-size: 0.9em\n\n.feature-properties\n position: relative\n &:before\n content: \"–\"\n position: absolute\n top: 4px\n left: 0\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 &:last-child\n border-bottom: none\n\n.tile-info\n display: flex\n flex-direction: row\n align-items: baseline\n h3\n margin-right: 0.5em\n\n.opacity-slider\n margin: 0 1em 0.5em\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","\n.panel-subhead\n padding: 0.2em var(--box-horizontal-padding)\n border-top: 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(--box-horizontal-padding)\n top: -1px\n position: sticky\n h1, h2, h3, h4\n font-family: Montserrat,sans-serif\n font-weight: 700\n margin: 0.2em 0\n h4\n font-weight: 600\n .title\n flex-grow: 1\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 &: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 margin-top: -1px\n padding: 5px 1em 5px\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: 5px 1em 10px\n .expansion-panel\n margin-left: -1em\n margin-right: -1em\n &:first-child\n margin-top: -5px\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":"module.css.map"}
1
+ {"mappings":"ACAA;;;;;;;AAME;;;;;AAIA;;;;;;;;;;;AAUE;;;;;AAIJ;;;;AAGA;;;;;AAIA;;;;;;;AASA;EACE;;;;;;;ACzCF;;;;AAGE;;;;AAGF;;;;;;;;;AAQE;;;;AAGA;;;;AAGA;;;;AAGF;;;;AAGE;;;;;AAIF;;;;;;;;;;;AAUE;;;;;AAME;;;;;AAKJ;;;;AAGA;;;;;;;;AAQA;EACE;;;;;AC/DF;;;;;;;;;AASI;;;;AAGF;;;;;;AAOA;;;;AAIE;;;;AAGF;;;;AAGA;;;;AAGA;;;;AAME;;;;AAGF;;;;AAIE;;;;;AAME;;;;;;;;;;;;;;;;;;;;;;AAgBJ;;;;;;;;;AAOA;;;;;;;;;;AAYF;;;;;AAME;;;;AAGA;;;;;AAKE;;;;;;AAKF;;;;AAEF;;;;AAGE;;;;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;;;;;;;;;;;;;;;;EA4BE;;;;;;;EAMA;;;;;;;;;;;;;;;;;;;;;;;;;EAoBJ;;;;;EAME;;;;EAIA;;;;;;;;;;;EASE;;;;;EAIA;;;;EAGA;;;;EAGE;;;;EAQF;;;;;AAKA;;;;;;;;;;AAQA;;;;AAGA;;;;AAGA;;;;;;;;;;;;;;;;AAeF;;;;AAQE;;;;AAGA;;;;;;;;;EAQF;;;;EAGA;;;;;EAOI;;;;EAGA;;;;;;;;;;;;;;AAaF;EACE;;;;EAGA;;;;EAGA;;;;;AC7eN;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBE;;;;;;;AAKE;;;;;AAGF;;;;;AAGF;;;;;;;;;;AAMA;;;;AAGE;;;;AAEE;;;;;AAGF;;;;;;;;;;;AASE;;;;ACjDJ;;;;;;;;;;;;;;AAYE;;;;;;AAIA;;;;AAEA;;;;;;;;;;;;;;AAaA;;;;;AAMA;;;;AAGE;;;;;AAGA;;;;;AAIA;;;;AAEA;;;;;;;;;AAOE;;;;;;;;;;;;AASJ;;;;AAEE;;;;AAEA;;;;;AAGF;;;;AAEE;;;;;AAGE;;;;AAEN;;;;;;;;;;;;;;;;;;;;;;;;AAoBE;;;;;;;;AAKA;;;;;;;;AAKA;;;;AAGA;;;;;;;;;;;AASE;;;;;;;;AAOF;;;;AAGA","sources":["bc15657a39a35746","packages/map-interface/src/context-panel/main.module.sass","packages/map-interface/src/location-panel/main.module.sass","packages/map-interface/src/main.module.sass","packages/map-interface/src/dev/main.module.sass","packages/map-interface/src/expansion-panel/main.module.sass"],"sourcesContent":["@import \"ae7b07f141202fc9\";\n@import \"48f0a4a6f8ddc91e\";\n@import \"82cdba93b0548a93\";\n@import \"07c2aff8cd76b425\";\n@import \"b685950deb9cf075\";\n",".searchbar-holder\n transition: margin 300ms\n display: flex\n flex-direction: column\n margin: 0\n\n .navbar-holder\n display: flex\n flex-direction: row\n\n .searchbar\n width: 100%\n background-color: var(--panel-background-color)\n border-radius: 5px\n padding: var(--navbar-padding, 10px)\n display: flex\n flex-direction: row\n align-items: center\n gap: 5px\n\n :global(.bp5-input-group)\n flex-grow: 1\n cursor: text\n\n.navbar\n min-height: 50px\n\n:global(.bp5-navbar) > .loading-button\n width: 40px\n height: 40px\n\n.status-tongue\n background-color: var(--panel-background-color)\n margin: 5px\n margin-bottom: 0\n margin-top: -12px\n padding: 0\n padding-top: 12px\n overflow: hidden\n\n@media screen and (max-width: 768px)\n .status-tongue\n max-width: 100vw\n margin: 0\n border-radius: 0\n margin-top: -3px\n",".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: 1em\n border-bottom: 1px solid var(--panel-rule-color)\n\n .spacer\n flex-grow: 1\n\n .left-icon\n padding: 7px\n\n .position-controls :global(.bp5-button)\n font-size: 12px !important\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: hidden\n background-color: var(--panel-background-color)\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 1em\n\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",".map-container\n display: flex\n flex-direction: column\n position: relative\n width: 100%\n height: 100%\n overflow: hidden\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.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\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.context-panel-holder>:global(.bp5-card)\n padding: 10px\n background-color: var(--panel-background-color)\n\n.panel-card\n padding: 10px\n background-color: var(--panel-background-color)\n overflow: hidden\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 .map-view-container\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 &.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 /* Make map fill page rather than containing div,\n by unsetting map position */\n .map-view-container\n position: unset\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",".feature-panel\n position: relative\n margin: 0 -1em\n\n.key-value\n display: inline-block\n margin-right: 1em\n .key\n font-weight: bold\n font-size: 0.9em\n &:after\n content: ': '\n .value\n font-size: 0.9em\n\n.feature-properties\n position: relative\n &:before\n content: \"–\"\n position: absolute\n top: 4px\n left: 0\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 &:last-child\n border-bottom: none\n\n.tile-info\n display: flex\n flex-direction: row\n align-items: baseline\n h3\n margin-right: 0.5em\n\n.opacity-slider\n margin: 0 1em 0.5em\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","\n.panel-subhead\n padding: 0.2em var(--box-horizontal-padding)\n border-top: 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(--box-horizontal-padding)\n top: -1px\n position: sticky\n h1, h2, h3, h4\n font-family: Montserrat,sans-serif\n font-weight: 700\n margin: 0.2em 0\n h4\n font-weight: 600\n .title\n flex-grow: 1\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 &: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 margin-top: -1px\n padding: 5px 1em 5px\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: 5px 1em 10px\n .expansion-panel\n margin-left: -1em\n margin-right: -1em\n &:first-child\n margin-top: -5px\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":"module.css.map"}
package/dist/module.mjs CHANGED
@@ -1,10 +1,10 @@
1
1
  import "./module.css";
2
2
  import {useMemo as $Zz0sd$useMemo, useState as $Zz0sd$useState, useEffect as $Zz0sd$useEffect, useCallback as $Zz0sd$useCallback, useRef as $Zz0sd$useRef} from "react";
3
- 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";
3
+ import {Spinner as $Zz0sd$Spinner, Button as $Zz0sd$Button, Text as $Zz0sd$Text, Navbar as $Zz0sd$Navbar, Card as $Zz0sd$Card, Icon as $Zz0sd$Icon, Switch as $Zz0sd$Switch, Collapse as $Zz0sd$Collapse} from "@blueprintjs/core";
4
4
  import $Zz0sd$macrostrathyper, {addClassNames as $Zz0sd$addClassNames} from "@macrostrat/hyper";
5
5
  import {useMapStatus as $Zz0sd$useMapStatus, useFocusState as $Zz0sd$useFocusState, isCentered as $Zz0sd$isCentered, LocationFocusButton as $Zz0sd$LocationFocusButton, 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, useMapEaseTo as $Zz0sd$useMapEaseTo, useMapDispatch as $Zz0sd$useMapDispatch, useMapConditionalStyle as $Zz0sd$useMapConditionalStyle} from "@macrostrat/mapbox-react";
6
+ import {Spacer as $Zz0sd$Spacer, ErrorBoundary as $Zz0sd$ErrorBoundary, useToaster as $Zz0sd$useToaster, useDarkMode as $Zz0sd$useDarkMode, useStoredState as $Zz0sd$useStoredState, ToasterContext as $Zz0sd$ToasterContext, DevToolsButtonSlot as $Zz0sd$DevToolsButtonSlot, useInDarkMode as $Zz0sd$useInDarkMode, JSONView as $Zz0sd$JSONView, usePrevious as $Zz0sd$usePrevious} from "@macrostrat/ui-components";
6
7
  import $Zz0sd$classnames from "classnames";
7
- 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, DevToolsButtonSlot as $Zz0sd$DevToolsButtonSlot, JSONView as $Zz0sd$JSONView, usePrevious as $Zz0sd$usePrevious} from "@macrostrat/ui-components";
8
8
  import {formatCoordForZoomLevel as $Zz0sd$formatCoordForZoomLevel, normalizeLng as $Zz0sd$normalizeLng, metersToFeet as $Zz0sd$metersToFeet, getMapboxStyle as $Zz0sd$getMapboxStyle, mergeStyles as $Zz0sd$mergeStyles, mapViewInfo as $Zz0sd$mapViewInfo, getMapPosition as $Zz0sd$getMapPosition, setMapPosition as $Zz0sd$setMapPosition} from "@macrostrat/mapbox-utils";
9
9
  import {format as $Zz0sd$format} from "d3-format";
10
10
  import $Zz0sd$mapboxgl, {ScaleControl as $Zz0sd$ScaleControl, GeolocateControl as $Zz0sd$GeolocateControl, Marker as $Zz0sd$Marker} from "mapbox-gl";
@@ -52,16 +52,19 @@ $parcel$export($6e914c81c8e053da$exports, "FloatingNavbar", () => $6e914c81c8e05
52
52
  var $fbe402416678c280$exports = {};
53
53
 
54
54
  $parcel$export($fbe402416678c280$exports, "loading-button", () => $fbe402416678c280$export$fcaa8d3bc8e9cf1e, (v) => $fbe402416678c280$export$fcaa8d3bc8e9cf1e = v);
55
+ $parcel$export($fbe402416678c280$exports, "navbar", () => $fbe402416678c280$export$58733aaf927c3bbe, (v) => $fbe402416678c280$export$58733aaf927c3bbe = v);
55
56
  $parcel$export($fbe402416678c280$exports, "navbar-holder", () => $fbe402416678c280$export$d8779dd86528d602, (v) => $fbe402416678c280$export$d8779dd86528d602 = v);
56
57
  $parcel$export($fbe402416678c280$exports, "searchbar", () => $fbe402416678c280$export$2ac23befe9d406ee, (v) => $fbe402416678c280$export$2ac23befe9d406ee = v);
57
58
  $parcel$export($fbe402416678c280$exports, "searchbar-holder", () => $fbe402416678c280$export$3a39e67bbbcbd4ae, (v) => $fbe402416678c280$export$3a39e67bbbcbd4ae = v);
58
59
  $parcel$export($fbe402416678c280$exports, "status-tongue", () => $fbe402416678c280$export$764ade2d69041360, (v) => $fbe402416678c280$export$764ade2d69041360 = v);
59
60
  var $fbe402416678c280$export$fcaa8d3bc8e9cf1e;
61
+ var $fbe402416678c280$export$58733aaf927c3bbe;
60
62
  var $fbe402416678c280$export$d8779dd86528d602;
61
63
  var $fbe402416678c280$export$2ac23befe9d406ee;
62
64
  var $fbe402416678c280$export$3a39e67bbbcbd4ae;
63
65
  var $fbe402416678c280$export$764ade2d69041360;
64
66
  $fbe402416678c280$export$fcaa8d3bc8e9cf1e = `_8hZKsW_loading-button`;
67
+ $fbe402416678c280$export$58733aaf927c3bbe = `_8hZKsW_navbar`;
65
68
  $fbe402416678c280$export$d8779dd86528d602 = `_8hZKsW_navbar-holder`;
66
69
  $fbe402416678c280$export$2ac23befe9d406ee = `_8hZKsW_searchbar`;
67
70
  $fbe402416678c280$export$3a39e67bbbcbd4ae = `_8hZKsW_searchbar-holder`;
@@ -69,18 +72,20 @@ $fbe402416678c280$export$764ade2d69041360 = `_8hZKsW_status-tongue`;
69
72
 
70
73
 
71
74
 
75
+
72
76
  const $6e914c81c8e053da$var$h = (0, $Zz0sd$macrostrathyper).styled((0, (/*@__PURE__*/$parcel$interopDefault($fbe402416678c280$exports))));
73
77
  const $6e914c81c8e053da$var$spinnerElement = $6e914c81c8e053da$var$h((0, $Zz0sd$Spinner), {
74
78
  size: 16
75
79
  });
76
- function $6e914c81c8e053da$export$4ec83e90d030b2f3({ isLoading: isLoading = false, onClick: onClick, active: active = false, icon: icon = "menu" }) {
80
+ function $6e914c81c8e053da$export$4ec83e90d030b2f3({ isLoading: isLoading = false, onClick: onClick, active: active = false, large: large = false, icon: icon = "menu", style: style }) {
77
81
  return $6e914c81c8e053da$var$h((0, $Zz0sd$Button), {
78
82
  className: "loading-button",
79
83
  icon: isLoading ? $6e914c81c8e053da$var$spinnerElement : icon,
80
- large: false,
84
+ large: large,
81
85
  minimal: true,
82
86
  onClick: onClick,
83
- active: active && !isLoading
87
+ active: active && !isLoading,
88
+ style: style
84
89
  });
85
90
  }
86
91
  function $6e914c81c8e053da$export$9e3bae3c08bde368(props) {
@@ -93,14 +98,39 @@ function $6e914c81c8e053da$export$9e3bae3c08bde368(props) {
93
98
  isLoading: mapIsLoading
94
99
  });
95
100
  }
96
- function $6e914c81c8e053da$export$a8cc0062d02a3841({ className: className, children: children, statusElement: statusElement = null }) {
101
+ function $6e914c81c8e053da$export$a8cc0062d02a3841({ className: className, children: children, headerElement: headerElement = null, title: title = null, statusElement: statusElement = null, rightElement: rightElement = null, height: height, width: width, style: style = {} }) {
102
+ let _rightElement = null;
103
+ if (rightElement != null) _rightElement = $6e914c81c8e053da$var$h("div.right-element", rightElement);
104
+ let _headerElement = headerElement;
105
+ if (title != null && _headerElement == null) {
106
+ if (typeof title === "string") _headerElement = $6e914c81c8e053da$var$h((0, $Zz0sd$Text), {
107
+ tagName: "h2",
108
+ ellipsize: true
109
+ }, title);
110
+ else _headerElement = title;
111
+ }
112
+ if (_headerElement != null) _headerElement = $6e914c81c8e053da$var$h([
113
+ _headerElement,
114
+ $6e914c81c8e053da$var$h((0, $Zz0sd$Spacer))
115
+ ]);
97
116
  return $6e914c81c8e053da$var$h("div.searchbar-holder", {
98
- className: className
117
+ className: className,
118
+ style: {
119
+ width: width
120
+ }
99
121
  }, [
100
122
  $6e914c81c8e053da$var$h("div.navbar-holder", [
101
123
  $6e914c81c8e053da$var$h((0, $Zz0sd$Navbar), {
102
- className: "searchbar panel"
103
- }, children)
124
+ className: "searchbar navbar panel",
125
+ style: {
126
+ height: height,
127
+ ...style
128
+ }
129
+ }, [
130
+ _headerElement,
131
+ children,
132
+ _rightElement
133
+ ])
104
134
  ]),
105
135
  $6e914c81c8e053da$var$h.if(statusElement != null)((0, $Zz0sd$Card), {
106
136
  className: "status-tongue"
@@ -537,8 +567,8 @@ var $4bdfa9cd8240b2fd$exports = {};
537
567
 
538
568
  $parcel$export($4bdfa9cd8240b2fd$exports, "PanelCard", () => $4bdfa9cd8240b2fd$export$ec68dd77edbe678b);
539
569
  $parcel$export($4bdfa9cd8240b2fd$exports, "DetailPanelStyle", () => $4bdfa9cd8240b2fd$export$612ca936d3ed4784);
540
- $parcel$export($4bdfa9cd8240b2fd$exports, "MapStyledContainer", () => $4bdfa9cd8240b2fd$export$fa395a37c3898ae3);
541
570
  $parcel$export($4bdfa9cd8240b2fd$exports, "MapAreaContainer", () => $4bdfa9cd8240b2fd$export$9fa5da0bcfd0a290);
571
+ $parcel$export($4bdfa9cd8240b2fd$exports, "MapStyledContainer", () => $4bdfa9cd8240b2fd$export$fa395a37c3898ae3);
542
572
 
543
573
  var $1f5c274a1b8d54c3$exports = {};
544
574
 
@@ -560,6 +590,7 @@ $parcel$export($1f5c274a1b8d54c3$exports, "map-control-stack", () => $1f5c274a1b
560
590
  $parcel$export($1f5c274a1b8d54c3$exports, "main-row", () => $1f5c274a1b8d54c3$export$bc4885f800420ea3, (v) => $1f5c274a1b8d54c3$export$bc4885f800420ea3 = v);
561
591
  $parcel$export($1f5c274a1b8d54c3$exports, "map-ui", () => $1f5c274a1b8d54c3$export$7d4a718201bc0bd1, (v) => $1f5c274a1b8d54c3$export$7d4a718201bc0bd1 = v);
562
592
  $parcel$export($1f5c274a1b8d54c3$exports, "mapbox-map", () => $1f5c274a1b8d54c3$export$d0dcaf774d09fc4c, (v) => $1f5c274a1b8d54c3$export$d0dcaf774d09fc4c = v);
593
+ $parcel$export($1f5c274a1b8d54c3$exports, "context-panel-holder", () => $1f5c274a1b8d54c3$export$1113ec858cdbc244, (v) => $1f5c274a1b8d54c3$export$1113ec858cdbc244 = v);
563
594
  $parcel$export($1f5c274a1b8d54c3$exports, "panel-card", () => $1f5c274a1b8d54c3$export$8eff531ff0f1cffe, (v) => $1f5c274a1b8d54c3$export$8eff531ff0f1cffe = v);
564
595
  $parcel$export($1f5c274a1b8d54c3$exports, "context-stack", () => $1f5c274a1b8d54c3$export$a15c1c170cdda69a, (v) => $1f5c274a1b8d54c3$export$a15c1c170cdda69a = v);
565
596
  $parcel$export($1f5c274a1b8d54c3$exports, "searchbar", () => $1f5c274a1b8d54c3$export$2ac23befe9d406ee, (v) => $1f5c274a1b8d54c3$export$2ac23befe9d406ee = v);
@@ -588,7 +619,6 @@ $parcel$export($1f5c274a1b8d54c3$exports, "detail-panel-enter", () => $1f5c274a1
588
619
  $parcel$export($1f5c274a1b8d54c3$exports, "infodrawer-stack", () => $1f5c274a1b8d54c3$export$69fa1b5d46c139b9, (v) => $1f5c274a1b8d54c3$export$69fa1b5d46c139b9 = v);
589
620
  $parcel$export($1f5c274a1b8d54c3$exports, "detail-panel", () => $1f5c274a1b8d54c3$export$c6930745f2610de0, (v) => $1f5c274a1b8d54c3$export$c6930745f2610de0 = v);
590
621
  $parcel$export($1f5c274a1b8d54c3$exports, "adaptive-width", () => $1f5c274a1b8d54c3$export$4db621d3143ef457, (v) => $1f5c274a1b8d54c3$export$4db621d3143ef457 = v);
591
- $parcel$export($1f5c274a1b8d54c3$exports, "context-panel-holder", () => $1f5c274a1b8d54c3$export$1113ec858cdbc244, (v) => $1f5c274a1b8d54c3$export$1113ec858cdbc244 = v);
592
622
  $parcel$export($1f5c274a1b8d54c3$exports, "context-panel-from", () => $1f5c274a1b8d54c3$export$90f42dafd5c24d2d, (v) => $1f5c274a1b8d54c3$export$90f42dafd5c24d2d = v);
593
623
  $parcel$export($1f5c274a1b8d54c3$exports, "context-panel-enter", () => $1f5c274a1b8d54c3$export$9ea3835d1b44cc08, (v) => $1f5c274a1b8d54c3$export$9ea3835d1b44cc08 = v);
594
624
  $parcel$export($1f5c274a1b8d54c3$exports, "detail-panel-floating", () => $1f5c274a1b8d54c3$export$50b37414f37debaa, (v) => $1f5c274a1b8d54c3$export$50b37414f37debaa = v);
@@ -613,6 +643,7 @@ var $1f5c274a1b8d54c3$export$c163dab1f00a51cb;
613
643
  var $1f5c274a1b8d54c3$export$bc4885f800420ea3;
614
644
  var $1f5c274a1b8d54c3$export$7d4a718201bc0bd1;
615
645
  var $1f5c274a1b8d54c3$export$d0dcaf774d09fc4c;
646
+ var $1f5c274a1b8d54c3$export$1113ec858cdbc244;
616
647
  var $1f5c274a1b8d54c3$export$8eff531ff0f1cffe;
617
648
  var $1f5c274a1b8d54c3$export$a15c1c170cdda69a;
618
649
  var $1f5c274a1b8d54c3$export$2ac23befe9d406ee;
@@ -641,7 +672,6 @@ var $1f5c274a1b8d54c3$export$e017ebf46ba443ed;
641
672
  var $1f5c274a1b8d54c3$export$69fa1b5d46c139b9;
642
673
  var $1f5c274a1b8d54c3$export$c6930745f2610de0;
643
674
  var $1f5c274a1b8d54c3$export$4db621d3143ef457;
644
- var $1f5c274a1b8d54c3$export$1113ec858cdbc244;
645
675
  var $1f5c274a1b8d54c3$export$90f42dafd5c24d2d;
646
676
  var $1f5c274a1b8d54c3$export$9ea3835d1b44cc08;
647
677
  var $1f5c274a1b8d54c3$export$50b37414f37debaa;
@@ -666,6 +696,7 @@ $1f5c274a1b8d54c3$export$c163dab1f00a51cb = "map-control-stack_4c0a66";
666
696
  $1f5c274a1b8d54c3$export$bc4885f800420ea3 = "main-row_4c0a66";
667
697
  $1f5c274a1b8d54c3$export$7d4a718201bc0bd1 = "map-ui_4c0a66";
668
698
  $1f5c274a1b8d54c3$export$d0dcaf774d09fc4c = "mapbox-map_4c0a66";
699
+ $1f5c274a1b8d54c3$export$1113ec858cdbc244 = "context-panel-holder_4c0a66";
669
700
  $1f5c274a1b8d54c3$export$8eff531ff0f1cffe = "panel-card_4c0a66";
670
701
  $1f5c274a1b8d54c3$export$a15c1c170cdda69a = "context-stack_4c0a66";
671
702
  $1f5c274a1b8d54c3$export$2ac23befe9d406ee = "searchbar_4c0a66";
@@ -694,7 +725,6 @@ $1f5c274a1b8d54c3$export$e017ebf46ba443ed = "detail-panel-enter_4c0a66";
694
725
  $1f5c274a1b8d54c3$export$69fa1b5d46c139b9 = "infodrawer-stack_4c0a66";
695
726
  $1f5c274a1b8d54c3$export$c6930745f2610de0 = "detail-panel_4c0a66";
696
727
  $1f5c274a1b8d54c3$export$4db621d3143ef457 = "adaptive-width_4c0a66";
697
- $1f5c274a1b8d54c3$export$1113ec858cdbc244 = "context-panel-holder_4c0a66";
698
728
  $1f5c274a1b8d54c3$export$90f42dafd5c24d2d = "context-panel-from_4c0a66";
699
729
  $1f5c274a1b8d54c3$export$9ea3835d1b44cc08 = "context-panel-enter_4c0a66";
700
730
  $1f5c274a1b8d54c3$export$50b37414f37debaa = "detail-panel-floating_4c0a66";
@@ -782,6 +812,7 @@ var $4bdfa9cd8240b2fd$export$612ca936d3ed4784;
782
812
  DetailPanelStyle["FIXED"] = "fixed";
783
813
  DetailPanelStyle["FLOATING"] = "floating";
784
814
  })($4bdfa9cd8240b2fd$export$612ca936d3ed4784 || ($4bdfa9cd8240b2fd$export$612ca936d3ed4784 = {}));
815
+ const $4bdfa9cd8240b2fd$export$9fa5da0bcfd0a290 = (props)=>$4bdfa9cd8240b2fd$var$h($4bdfa9cd8240b2fd$var$MapProviders, $4bdfa9cd8240b2fd$var$h($4bdfa9cd8240b2fd$var$_MapAreaContainer, props));
785
816
  function $4bdfa9cd8240b2fd$var$_MapAreaContainer({ children: children, className: className, navbar: navbar, contextPanel: contextPanel = null, detailPanel: detailPanel = null, detailPanelOpen: detailPanelOpen, contextPanelOpen: contextPanelOpen = true, bottomPanel: bottomPanel = null, mainPanel: mainPanel, mapControls: mapControls = $4bdfa9cd8240b2fd$var$h((0, $91d5aa004eeb2226$export$db1a2e058a06fb5c)), contextStackProps: contextStackProps = null, detailStackProps: detailStackProps = null, detailPanelStyle: detailPanelStyle = "floating", fitViewport: fitViewport = true, showPanelOutlines: showPanelOutlines = false, preventMapInteraction: preventMapInteraction = false, ...rest }) {
786
817
  const _detailPanelOpen = detailPanelOpen ?? detailPanel != null;
787
818
  const contextPanelTrans = (0, $Zz0sd$useTransition)(contextPanelOpen, 800);
@@ -853,7 +884,6 @@ function $4bdfa9cd8240b2fd$var$ContextStack(props) {
853
884
  ]);
854
885
  }
855
886
  const $4bdfa9cd8240b2fd$var$MapProviders = ({ children: children })=>$4bdfa9cd8240b2fd$var$h((0, $Zz0sd$ToasterContext), $4bdfa9cd8240b2fd$var$h((0, $Zz0sd$MapboxMapProvider), children));
856
- const $4bdfa9cd8240b2fd$export$9fa5da0bcfd0a290 = (props)=>$4bdfa9cd8240b2fd$var$h($4bdfa9cd8240b2fd$var$MapProviders, $4bdfa9cd8240b2fd$var$h($4bdfa9cd8240b2fd$var$_MapAreaContainer, props));
857
887
  function $4bdfa9cd8240b2fd$export$fa395a37c3898ae3({ className: className, children: children }) {
858
888
  const mapPosition = (0, $Zz0sd$useMapPosition)();
859
889
  if (mapPosition != null) {
@@ -878,6 +908,7 @@ $parcel$export($4bc3dd5f0732eed3$exports, "MapPaddingManager", () => $4bc3dd5f07
878
908
  $parcel$export($4bc3dd5f0732eed3$exports, "MapMovedReporter", () => $4bc3dd5f0732eed3$export$f6eeee399afc4e9a);
879
909
  $parcel$export($4bc3dd5f0732eed3$exports, "MapLoadingReporter", () => $4bc3dd5f0732eed3$export$e57f9eaa51773f82);
880
910
  $parcel$export($4bc3dd5f0732eed3$exports, "MapMarker", () => $4bc3dd5f0732eed3$export$5c90a91c7455938c);
911
+ $parcel$export($4bc3dd5f0732eed3$exports, "useBasicStylePair", () => $4bc3dd5f0732eed3$export$566518253d2584f8);
881
912
 
882
913
 
883
914
 
@@ -922,6 +953,7 @@ function $82fe09613877ffc2$export$278090850f6b3a9f(mapRef, markerRef, markerPosi
922
953
  }
923
954
 
924
955
 
956
+
925
957
  function $4bc3dd5f0732eed3$export$31b2e088aff2dc5d({ containerRef: containerRef }) {
926
958
  const mapRef = (0, $Zz0sd$useMapRef)();
927
959
  const debouncedResize = (0, $Zz0sd$useRef)((0, $Zz0sd$debounce)(()=>{
@@ -933,16 +965,20 @@ function $4bc3dd5f0732eed3$export$31b2e088aff2dc5d({ containerRef: containerRef
933
965
  });
934
966
  return null;
935
967
  }
936
- function $4bc3dd5f0732eed3$export$2ab96428dea558d6({ containerRef: containerRef, parentRef: parentRef, infoMarkerPosition: infoMarkerPosition }) {
968
+ function $4bc3dd5f0732eed3$export$2ab96428dea558d6({ containerRef: containerRef, parentRef: parentRef, infoMarkerPosition: infoMarkerPosition, debounceTime: debounceTime = 200 }) {
937
969
  const mapRef = (0, $Zz0sd$useMapRef)();
938
970
  const [padding, setPadding] = (0, $Zz0sd$useState)((0, $82fe09613877ffc2$export$bb78f9f01775eef1)(containerRef, parentRef));
939
- const updateMapPadding = (0, $Zz0sd$useCallback)(()=>{
971
+ const _updateMapPadding = (0, $Zz0sd$useCallback)(()=>{
940
972
  const newPadding = (0, $82fe09613877ffc2$export$bb78f9f01775eef1)(containerRef, parentRef);
941
973
  setPadding(newPadding);
942
974
  }, [
943
975
  containerRef.current,
944
976
  parentRef.current
945
977
  ]);
978
+ const updateMapPadding = (0, $Zz0sd$useMemo)(()=>(0, $Zz0sd$debounce)(_updateMapPadding, debounceTime), [
979
+ _updateMapPadding,
980
+ debounceTime
981
+ ]);
946
982
  (0, $Zz0sd$useEffect)(()=>{
947
983
  const map = mapRef.current;
948
984
  if (map == null) return;
@@ -955,6 +991,9 @@ function $4bc3dd5f0732eed3$export$2ab96428dea558d6({ containerRef: containerRef,
955
991
  ref: parentRef,
956
992
  onResize (sz) {
957
993
  updateMapPadding();
994
+ },
995
+ round (n) {
996
+ return Math.round(n);
958
997
  }
959
998
  });
960
999
  // Ideally, we would not have to do this when we know the infobox is loaded
@@ -1067,6 +1106,10 @@ function $4bc3dd5f0732eed3$export$5c90a91c7455938c({ position: position, setPosi
1067
1106
  ]);
1068
1107
  return null;
1069
1108
  }
1109
+ function $4bc3dd5f0732eed3$export$566518253d2584f8() {
1110
+ const inDarkMode = (0, $Zz0sd$useInDarkMode)();
1111
+ return inDarkMode ? "mapbox://styles/mapbox/dark-v10" : "mapbox://styles/mapbox/light-v10";
1112
+ }
1070
1113
 
1071
1114
 
1072
1115
 
@@ -1767,7 +1810,7 @@ function $b8c84b63e75fe4f2$export$617d79dae526d2cf({ features: features }) {
1767
1810
 
1768
1811
 
1769
1812
  const $a281a0612311d660$export$dda1d9f60106f0e9 = (0, $Zz0sd$macrostrathyper).styled((0, (/*@__PURE__*/$parcel$interopDefault($bfe9593b6c29b10b$exports))));
1770
- function $a281a0612311d660$export$c5febf3ae8816972({ title: title = "Map inspector", headerElement: headerElement = null, transformRequest: transformRequest = null, mapPosition: mapPosition = null, mapboxToken: mapboxToken = null, overlayStyle: overlayStyle = null, children: children, style: style, focusedSource: focusedSource = null, focusedSourceTitle: focusedSourceTitle = null, fitViewport: fitViewport = true, projection: projection = null }) {
1813
+ function $a281a0612311d660$export$c5febf3ae8816972({ title: title = "Map inspector", headerElement: headerElement = null, transformRequest: transformRequest = null, mapPosition: mapPosition = null, mapboxToken: mapboxToken = null, overlayStyle: overlayStyle = null, children: children, style: style, focusedSource: focusedSource = null, focusedSourceTitle: focusedSourceTitle = null, fitViewport: fitViewport = true }) {
1771
1814
  /* We apply a custom style to the panel container when we are interacting
1772
1815
  with the search bar, so that we can block map interactions until search
1773
1816
  bar focus is lost.
@@ -1836,14 +1879,18 @@ function $a281a0612311d660$export$c5febf3ae8816972({ title: title = "Map inspect
1836
1879
  };
1837
1880
  }
1838
1881
  return $a281a0612311d660$export$dda1d9f60106f0e9((0, $4bdfa9cd8240b2fd$export$9fa5da0bcfd0a290), {
1839
- navbar: $a281a0612311d660$export$dda1d9f60106f0e9((0, $6e914c81c8e053da$export$a8cc0062d02a3841), [
1840
- headerElement ?? $a281a0612311d660$export$dda1d9f60106f0e9("h2", title),
1841
- $a281a0612311d660$export$dda1d9f60106f0e9((0, $Zz0sd$Spacer)),
1842
- $a281a0612311d660$export$dda1d9f60106f0e9((0, $6e914c81c8e053da$export$9e3bae3c08bde368), {
1882
+ navbar: $a281a0612311d660$export$dda1d9f60106f0e9((0, $6e914c81c8e053da$export$a8cc0062d02a3841), {
1883
+ rightElement: $a281a0612311d660$export$dda1d9f60106f0e9((0, $6e914c81c8e053da$export$9e3bae3c08bde368), {
1884
+ large: true,
1843
1885
  active: isOpen,
1844
- onClick: ()=>setOpen(!isOpen)
1845
- })
1846
- ]),
1886
+ onClick: ()=>setOpen(!isOpen),
1887
+ style: {
1888
+ marginRight: "-5px"
1889
+ }
1890
+ }),
1891
+ headerElement: headerElement,
1892
+ title: title
1893
+ }),
1847
1894
  contextPanel: $a281a0612311d660$export$dda1d9f60106f0e9((0, $4bdfa9cd8240b2fd$export$ec68dd77edbe678b), [
1848
1895
  $a281a0612311d660$export$dda1d9f60106f0e9((0, $Zz0sd$Switch), {
1849
1896
  checked: xRay,
@@ -1904,5 +1951,5 @@ $parcel$exportWildcard($b6d2ac1192949c28$exports, $64ee2eed3ed5ffbc$exports);
1904
1951
 
1905
1952
 
1906
1953
 
1907
- export {$6e914c81c8e053da$export$4ec83e90d030b2f3 as LoadingButton, $6e914c81c8e053da$export$9e3bae3c08bde368 as MapLoadingButton, $6e914c81c8e053da$export$a8cc0062d02a3841 as FloatingNavbar, $f50c3537aaff0cff$export$83f9a19cf91c2d06 as InfoDrawerContainer, $f50c3537aaff0cff$export$a5ddcc2a88716895 as BaseInfoDrawer, $f50c3537aaff0cff$export$aa4baff5242ea6e1 as LocationPanel, $a281a0612311d660$export$dda1d9f60106f0e9 as h, $a281a0612311d660$export$c5febf3ae8816972 as MapInspector, $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$612ca936d3ed4784 as DetailPanelStyle, $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, $bb5f34705d9c44bc$export$8391d1abb505ffb3 as applyMapPositionToHash, $bb5f34705d9c44bc$export$80abf1cbcc3918e4 as getMapPositionForHash, $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};
1954
+ export {$6e914c81c8e053da$export$4ec83e90d030b2f3 as LoadingButton, $6e914c81c8e053da$export$9e3bae3c08bde368 as MapLoadingButton, $6e914c81c8e053da$export$a8cc0062d02a3841 as FloatingNavbar, $f50c3537aaff0cff$export$83f9a19cf91c2d06 as InfoDrawerContainer, $f50c3537aaff0cff$export$a5ddcc2a88716895 as BaseInfoDrawer, $f50c3537aaff0cff$export$aa4baff5242ea6e1 as LocationPanel, $a281a0612311d660$export$dda1d9f60106f0e9 as h, $a281a0612311d660$export$c5febf3ae8816972 as MapInspector, $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$612ca936d3ed4784 as DetailPanelStyle, $4bdfa9cd8240b2fd$export$9fa5da0bcfd0a290 as MapAreaContainer, $4bdfa9cd8240b2fd$export$fa395a37c3898ae3 as MapStyledContainer, $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, $4bc3dd5f0732eed3$export$566518253d2584f8 as useBasicStylePair, $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, $bb5f34705d9c44bc$export$8391d1abb505ffb3 as applyMapPositionToHash, $bb5f34705d9c44bc$export$80abf1cbcc3918e4 as getMapPositionForHash, $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};
1908
1955
  //# sourceMappingURL=module.mjs.map