@defra/interactive-map 0.0.24-alpha → 0.0.26-alpha

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 (25) hide show
  1. package/dist/css/index.css +1 -1
  2. package/docs/api/map-style-config.md +69 -2
  3. package/package.json +4 -3
  4. package/plugins/beta/draw-ml/dist/css/index.css +21 -1
  5. package/plugins/beta/scale-bar/dist/css/index.css +31 -1
  6. package/plugins/search/dist/css/index.css +250 -1
  7. package/providers/beta/openlayers/dist/esm/im-openlayers-provider.js +1 -1
  8. package/providers/beta/openlayers/dist/umd/im-openlayers-provider.js +1 -1
  9. package/providers/beta/openlayers/dist/umd/index.js +1 -1
  10. package/providers/beta/openlayers/src/appEvents.js +25 -36
  11. package/providers/beta/openlayers/src/appEvents.test.js +99 -121
  12. package/providers/beta/openlayers/src/mapEvents.js +2 -4
  13. package/providers/beta/openlayers/src/mapEvents.test.js +27 -0
  14. package/providers/beta/openlayers/src/openlayersProvider.js +23 -8
  15. package/providers/beta/openlayers/src/openlayersProvider.test.js +60 -5
  16. package/providers/beta/openlayers/src/utils/spatial.js +18 -14
  17. package/providers/beta/openlayers/src/utils/spatial.test.js +4 -2
  18. package/providers/beta/openlayers/src/utils/tileLayers.js +133 -0
  19. package/providers/beta/openlayers/src/utils/tileLayers.test.js +256 -0
  20. package/providers/maplibre/dist/esm/im-maplibre-provider.js +1 -1
  21. package/providers/maplibre/dist/umd/im-maplibre-provider.js +1 -1
  22. package/providers/maplibre/src/utils/maplibreFixes.js +1 -1
  23. package/src/App/layout/layout.module.scss +1 -0
  24. package/src/types.js +11 -1
  25. package/webpack.dev.mjs +8 -4
package/dist/css/index.css CHANGED
@@ -1 +1 @@
1
- :root{--foreground-color: #0b0c0c;--background-color: #ffffff;--focus-border-color: #0b0c0c;--focus-outline-color: #ffdd00;--button-background-color: #ffffff;--button-hover-color: #f3f2f1;--primary-button-color: #00703c;--primary-button-hover-color: #005a30;--primary-button-box-shadow: inset 0 -2px 0 #002d18;--tertiary-button-border-color: #505a5f;--disabled-button-opacity: 0.4;--pressed-button-foreground-color: #ffffff;--pressed-button-border-color: #0b0c0c;--pressed-button-background-color: #0b0c0c;--scrollable-outline: 3px solid #ffdd00;--scrollable-outline-offset: -3px;--scrollable-box-shadow: inset 0 0 0 6px #002d18;--tooltip-background-color: #383F43;--tooltip-foreground-color: #ffffff;--modal-background-color: #0b0c0c;--modal-backdrop-opacity: 0.4;--attributions-foreground-color: #0b0c0c;--attributions-background-color: #ffffff80;--fixed-foreground-color: #0b0c0c;--app-border-color: #cecece;--content-border-color: #f3f2f1;--secondary-text-color: #505a5f;--image-placeholder-color: #b1b4b6;--content-link-color: #1d70b8}:root .im-o-app--dark-app{--foreground-color: #ffffff;--background-color: #383F43;--focus-border-color: #0b0c0c;--focus-outline-color: #ffdd00;--button-background-color: #383F43;--button-hover-color: #505a5f;--primary-button-color: #ffffff;--primary-button-hover-color: #b1b4b6;--primary-button-box-shadow: none;--tertiary-button-border-color: #f3f2f1;--tertiary-button-box-shadow: none;--disabled-button-opacity: 0.4;--pressed-button-foreground-color: #0b0c0c;--pressed-button-border-color: #ffffff;--pressed-button-background-color: #ffffff;--content-border-color: #505a5f;--secondary-text-color: #f3f2f1;--content-link-color: #ffffff}:root{--font-family: gds transport,arial,sans-serif;--font-size: 16px;--line-height: 1.25em}:root{--button-box-shadow: 0 -2px 20px rgba(0,0,0,.1), 0 0 12px rgba(0,0,0,.1);--panel-box-shadow: 0 -2px 20px rgba(0,0,0,.1), 0 0 12px rgba(0,0,0,.1);--shadow-clip-size: 20px}:root{--duration: 0.2s}:root{--primary-gap: 15px;--divider-gap: 10px;--button-size: 40px;--icon-size: 24px;--button-padding: 8px;--button-icon-label-offset: 7px;--label-button-padding: 10px;--app-border-width: 1px;--button-border-radius: 0px;--panel-border-radius: 0px;--focus-border-width: 3px;--focus-outline-width: 3px;--modal-offset-top: 0px;--modal-offset-right: 0px;--tooltip-padding: 10px;--tooltip-offset: 10px;--tooltip-arrow-size: 8px;--tooltip-font-size: 14px;--tooltip-border-radius: 3px;--min-panel-width: 260px;--panel-close-button-gap: 4px;--panel-heading-margin-top: 12px;--panel-margin: 15px;--banner-close-button-gap: 0px;--banner-max-desktop-width: 400px;--banner-collapse-margin: 14px;--popup-menu-min-width: 200px;--popup-menu-max-width: 300px;--action-bar-max-width: calc(100% - (var(--button-size) * 2) - (var(--primary-gap) * 4));--attributions-padding: 2px 5px;--attributions-font-size: 12px}:root{--kbd-font-family: monospace;--kbd-background-color: var(--background-color);--kbd-foreground-color: var(--tooltip-background-color);--kbd-border: 2px solid #e7e7e7;--kbd-border-radius: 4px;--kbd-font-size: .825rem;--kbd-padding: 2px 4px;--kbd-tooltip-border: none}:root .im-o-app--dark-app{--kbd-background-color: var(--background-color);--kbd-foreground-color: var(--tooltip-foreground-color);--kbd-tooltip-border: 2px solid #505a5f;--kbd-border: 2px solid #505a5f}.im-o-app *,.im-o-app *::before,.im-o-app *::after{box-sizing:border-box}.im-o-app *{margin:0}.im-o-app img,.im-o-app picture,.im-o-app video,.im-o-app canvas,.im-o-app svg{display:block}.im-o-app input,.im-o-app button,.im-o-app textarea,.im-o-app select{font:inherit}.im-o-app p,.im-o-app h1,.im-o-app h2,.im-o-app h3,.im-o-app h4,.im-o-app h5,.im-o-app h6{overflow-wrap:break-word}.im-o-app{visibility:visible;font-family:var(--font-family);font-size:var(--font-size);line-height:var(--line-height);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;color:var(--foreground-color);background-color:var(--background-color);-webkit-overflow-scrolling:touch;touch-action:pan-x pan-y}.im-is-fullscreen>.im-o-app{position:fixed;z-index:999;top:0;bottom:0;left:0;right:0;width:100%}.im-o-app__overlay,.im-o-app__modal{pointer-events:none}.im-e-heading-s,.im-e-heading-m,.im-e-heading-l{margin:0;font-weight:600}.im-e-heading-l{font-size:1.5rem;line-height:1.25}.im-e-heading-m{font-size:1.25rem;line-height:1.25}.im-e-heading-s{font-size:1rem;line-height:1.25}kbd{font-family:var(--kbd-font-family);border:var(--kbd-border);background-color:var(--kbd-background-color);color:var(--kbd-foreground-color);border-radius:var(--kbd-border-radius);font-size:var(--kbd-font-size);padding:var(--kbd-padding)}.im-o-app{position:relative;width:100%;height:100%;min-height:0;overflow:hidden;touch-action:none}.im-o-app__overlay{position:absolute;z-index:1;box-sizing:border-box;flex-direction:row;display:flex;justify-content:space-between;top:0;left:0;width:100%;height:100%;min-height:0;visibility:visible;opacity:1}@media(prefers-reduced-motion: no-preference){.im-o-app__overlay{transition:opacity var(--duration) ease-in}}.im-o-app__side{position:relative;display:flex;flex-direction:column;z-index:3;flex-shrink:0;height:100%}.im-o-app__main{position:relative;display:flex;flex-direction:column;width:100%;min-width:0;height:100%;min-height:0;flex-wrap:nowrap;padding:var(--primary-gap)}.im-o-app__side .im-c-panel{height:100%;border:0;border-radius:var(--panel-border-radius)}.im-o-app__side .im-c-panel::before{content:"";pointer-events:none;position:absolute;top:0;left:0;height:100%;width:100%;border-radius:calc(var(--panel-border-radius));box-shadow:var(--panel-box-shadow)}.im-o-app__side .im-c-panel:focus{outline:0}.im-o-app__side .im-c-panel[data-focus-visible=true]{outline:3px solid rgba(0,0,0,0)}.im-o-app__side .im-c-panel::after{content:"";pointer-events:none;position:absolute;z-index:99;top:var(--focus-border-width);right:var(--focus-border-width);bottom:var(--focus-border-width);left:var(--focus-border-width);border:var(--focus-border-width) solid var(--focus-border-color);outline:var(--focus-outline-width) solid var(--focus-outline-color);border-radius:calc(var(--panel-border-radius) - 2px);opacity:0}@media(prefers-reduced-motion: no-preference){.im-o-app__side .im-c-panel::after{transition:opacity var(--duration) ease}}.im-o-app__side .im-c-panel[data-focus-visible=true]::after{opacity:1}.im-o-app__side .im-c-panel,.im-o-app__side .im-c-panel::before,.im-o-app__side .im-c-panel::after{border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:0;border-bottom-right-radius:0}.im-o-app__side .im-c-panel::before{clip-path:inset(-20px -20px -20px -20px)}.im-o-app__banner{display:flex;flex-direction:column;gap:var(--divider-gap)}.im-o-app__banner .im-c-panel:last-child{margin-bottom:var(--divider-gap)}.im-o-app__top{display:flex;margin-bottom:auto;justify-content:space-between;align-items:flex-start;width:100%;gap:var(--divider-gap)}.im-o-app__top-col{display:flex;flex:1 1 auto;gap:var(--divider-gap)}.im-o-app__top-col:not(:empty){padding-bottom:var(--divider-gap)}.im-o-app__top-col:first-child,.im-o-app__top-col:last-child{flex:1 1 calc(var(--button-size) + var(--primary-gap)*2);max-width:var(--top-col-width, 100%)}.im-o-app__top-col:first-child{justify-content:flex-start}.im-o-app__top-col:last-child{justify-content:flex-end}.im-o-app__top-col:nth-child(2){justify-content:center}.im-o-app__inset{display:flex;flex-direction:column;position:absolute;gap:var(--divider-gap);top:var(--left-offset-top)}.im-o-app__left{position:absolute;display:flex;flex-direction:column;left:var(--primary-gap);top:var(--left-offset-top);bottom:var(--left-offset-bottom);gap:var(--divider-gap)}.im-o-app__left>*:empty{display:none}.im-o-app__left-top{display:flex;flex-direction:column;align-items:flex-start;min-height:0;position:relative;gap:var(--divider-gap)}.im-o-app__left-bottom{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;min-height:0;margin-top:auto;position:relative;gap:var(--divider-gap)}.im-o-app__middle{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;z-index:-1}.im-o-app__right{position:absolute;display:flex;flex-direction:column;right:var(--primary-gap);top:var(--right-offset-top);bottom:var(--right-offset-bottom);gap:var(--divider-gap)}.im-o-app__right-top{display:flex;flex-direction:column;flex:0 0 auto;align-items:flex-end;position:relative;gap:var(--divider-gap)}.im-o-app__right-bottom{display:flex;flex-direction:column;flex:0 0 auto;margin-top:auto;align-items:flex-end;position:relative;gap:var(--divider-gap)}.im-o-app__bottom{display:flex;justify-content:space-between;align-items:flex-end;z-index:-2}.im-o-app__bottom-col{display:flex;min-width:auto}.im-o-app__bottom-col:first-child{flex-direction:row;align-items:flex-end;flex-shrink:0;gap:var(--divider-gap)}.im-o-app__bottom-col:last-child{position:relative;flex:1 1 auto;flex-direction:column;align-items:flex-end;min-width:0}.im-o-app__bottom-left,.im-o-app__bottom-right{display:flex;flex-direction:row;gap:var(--divider-gap)}.im-o-app__bottom-right{justify-content:flex-end}.im-o-app__attributions:not(:empty){position:absolute;bottom:calc(var(--primary-gap)*-1);right:calc(var(--primary-gap)*-1);display:flex;justify-content:flex-end}.im-o-app__drawer{z-index:1}.im-o-app__drawer .im-c-panel,.im-o-app__drawer .im-c-panel::before,.im-o-app__drawer .im-c-panel::after{border-bottom-left-radius:0;border-bottom-right-radius:0}.im-o-app__drawer .im-c-panel::before{clip-path:inset(-20px -20px 0 -20px)}.im-o-app__actions{display:flex;flex-shrink:0;justify-content:center;text-align:center}.im-o-app__actions .im-c-panel__body{overflow:visible}.im-o-app .im-o-app__modal{display:flex;position:absolute;top:0;left:0;width:100%;height:100%;z-index:99}.im-o-app .im-o-app__modal .im-c-panel{position:absolute;top:0;right:0;bottom:auto;left:0;z-index:1000}.im-o-app .im-o-app__modal .im-c-panel+.im-o-app__modal-backdrop{position:absolute;top:0;left:0;width:100%;height:100%;background-color:var(--modal-background-color);opacity:var(--modal-backdrop-opacity);pointer-events:auto}.im-o-app .im-o-app__modal .im-c-panel--side{width:100%;max-width:80%;border:0;border-radius:var(--panel-border-radius)}.im-o-app .im-o-app__modal .im-c-panel--side::before{content:"";pointer-events:none;position:absolute;top:0;left:0;height:100%;width:100%;border-radius:calc(var(--panel-border-radius));box-shadow:var(--panel-box-shadow)}.im-o-app .im-o-app__modal .im-c-panel--side:focus{outline:0}.im-o-app .im-o-app__modal .im-c-panel--side[data-focus-visible=true]{outline:3px solid rgba(0,0,0,0)}.im-o-app .im-o-app__modal .im-c-panel--side::after{content:"";pointer-events:none;position:absolute;z-index:99;top:var(--focus-border-width);right:var(--focus-border-width);bottom:var(--focus-border-width);left:var(--focus-border-width);border:var(--focus-border-width) solid var(--focus-border-color);outline:var(--focus-outline-width) solid var(--focus-outline-color);border-radius:calc(var(--panel-border-radius) - 2px);opacity:0}@media(prefers-reduced-motion: no-preference){.im-o-app .im-o-app__modal .im-c-panel--side::after{transition:opacity var(--duration) ease}}.im-o-app .im-o-app__modal .im-c-panel--side[data-focus-visible=true]::after{opacity:1}.im-o-app .im-o-app__modal .im-c-panel--side,.im-o-app .im-o-app__modal .im-c-panel--side::before,.im-o-app .im-o-app__modal .im-c-panel--side::after{border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:0;border-bottom-right-radius:0}.im-o-app .im-o-app__modal .im-c-panel--side::before{clip-path:inset(-20px -20px -20px -20px)}.im-o-app .im-o-app__modal .im-c-panel--inset{inset:var(--modal-inset);max-width:calc(100% - var(--primary-gap)*2);max-height:var(--modal-max-height)}.im-o-app .im-o-app__modal .im-c-panel--left-top,.im-o-app .im-o-app__modal .im-c-panel.im-c-panel--left-top-button{inset:var(--left-offset-top) auto auto var(--primary-gap);max-height:calc(100% - var(--left-offset-top) - var(--primary-gap))}.im-o-app .im-o-app__modal .im-c-panel--left-bottom,.im-o-app .im-o-app__modal .im-c-panel.im-c-panel--left-bottom-button{inset:auto auto var(--left-offset-bottom) var(--primary-gap);max-height:calc(100% - var(--left-offset-bottom) - var(--primary-gap))}.im-o-app .im-o-app__modal .im-c-panel--right-top,.im-o-app .im-o-app__modal .im-c-panel.im-c-panel--right-top-button{inset:var(--right-offset-top) var(--primary-gap) auto auto;max-height:calc(100% - var(--right-offset-top) - var(--primary-gap))}.im-o-app .im-o-app__modal .im-c-panel--right-bottom,.im-o-app .im-o-app__modal .im-c-panel.im-c-panel--right-bottom-button{inset:auto var(--primary-gap) var(--right-offset-bottom) auto;max-height:calc(100% - var(--right-offset-bottom) - var(--primary-gap))}.im-o-app .im-o-app__modal .im-c-panel--middle{position:relative;margin:auto;width:100%;max-width:calc(100% - var(--primary-gap)*2);max-height:calc(100% - var(--primary-gap)*2)}.im-o-app .im-o-app__modal .im-c-panel--drawer{top:auto;bottom:0;max-height:85%}.im-o-app .im-o-app__modal .im-c-panel--drawer,.im-o-app .im-o-app__modal .im-c-panel--drawer::before,.im-o-app .im-o-app__modal .im-c-panel--drawer::after{border-bottom-left-radius:0;border-bottom-right-radius:0}.im-o-app .im-o-app__modal .im-c-panel--drawer::before{clip-path:inset(-20px -20px 0 -20px)}.im-o-app .im-o-app__modal [class*=im-c-panel--][class*=-button]{inset:var(--modal-inset);max-height:var(--modal-max-height)}.im-o-app--mobile .im-o-app__modal .im-c-panel--banner,.im-o-app--tablet .im-o-app__modal .im-c-panel--banner{margin:var(--primary-gap)}.im-o-app--mobile .im-o-app__banner,.im-o-app--tablet .im-o-app__banner{z-index:9}.im-o-app--desktop .im-o-app__modal .im-c-panel--banner{margin-top:var(--primary-gap)}.im-o-app--inline{border:var(--app-border-width) solid var(--app-border-color);box-sizing:border-box}.im-o-app__overlay--not-ready{visibility:hidden;opacity:0}.im-o-app--desktop .im-c-panel--banner{margin-left:auto;margin-right:auto;max-width:var(--banner-max-desktop-width)}.im-o-app--tablet .im-o-app__actions,.im-o-app--desktop .im-o-app__actions{position:absolute;width:100%;left:0;bottom:calc(var(--primary-gap)*2)}.im-o-app--tablet .im-o-app__actions .im-c-panel,.im-o-app--desktop .im-o-app__actions .im-c-panel{max-width:var(--action-bar-max-width)}@media(prefers-reduced-motion: no-preference){.im-o-app--tablet .im-o-app__actions .im-c-actions,.im-o-app--desktop .im-o-app__actions .im-c-actions{transition:opacity var(--duration) ease}}.im-o-app--tablet .im-o-app__actions .im-c-actions--hidden,.im-o-app--desktop .im-o-app__actions .im-c-actions--hidden{opacity:0}.im-o-app--mobile .im-o-app__drawer,.im-o-app--mobile .im-o-app__actions{margin:var(--primary-gap) calc(var(--primary-gap)*-1) calc(var(--primary-gap)*-1) calc(var(--primary-gap)*-1)}.im-o-app--mobile .im-o-app__drawer .im-c-panel,.im-o-app--mobile .im-o-app__actions .im-c-panel{width:100%}.im-o-app--mobile .im-o-app__drawer .im-c-panel,.im-o-app--mobile .im-o-app__drawer .im-c-panel::before,.im-o-app--mobile .im-o-app__drawer .im-c-panel::after,.im-o-app--mobile .im-o-app__actions .im-c-panel,.im-o-app--mobile .im-o-app__actions .im-c-panel::before,.im-o-app--mobile .im-o-app__actions .im-c-panel::after{border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:0;border-bottom-right-radius:0}.im-o-app--mobile .im-o-app__drawer .im-c-panel::before,.im-o-app--mobile .im-o-app__actions .im-c-panel::before{clip-path:inset(-20px -20px -20px -20px)}.im-o-app--mobile .im-o-app__drawer .im-c-panel{clip-path:inset(-20px 0 0 0)}.im-o-app--mobile .im-o-app__drawer .im-c-panel::after,.im-o-app--mobile .im-o-app__actions .im-c-panel::after,.im-o-app__modal .im-c-panel--drawer::after{top:var(--focus-border-width);right:var(--focus-border-width);bottom:var(--focus-border-width);left:var(--focus-border-width)}.im-o-app--mobile .im-o-app__side{position:absolute;left:0;top:0;width:100%;max-width:80%;pointer-events:none}.im-c-keyboard-help__list{margin:0;color:var(--foreground-color)}.im-c-keyboard-help__item{display:table;padding:10px 0;width:100%;border-top:1px solid var(--content-border-color)}.im-c-keyboard-help__item:last-child{padding-bottom:0}.im-c-keyboard-help__group:last-child .im-c-keyboard-help__item:last-child{padding-bottom:0}.im-c-keyboard-help__title{display:table-cell;width:45%}.im-c-keyboard-help__description{display:table-cell}.im-o-app--mobile .im-c-keyboard-help__title{width:100%;display:block}.im-o-app--mobile .im-c-keyboard-help__description{display:block;margin-top:5px}.im-c-tabs__panel .im-c-keyboard-help__item:first-child{border-top:0}.im-c-tabs__list{position:relative;display:flex;flex-wrap:wrap;padding:0;margin:0;border-bottom:1px solid var(--app-border-color);z-index:1}.im-c-tabs__tab{position:relative;appearance:none;background:var(--button-hover-color);border:1px solid rgba(0,0,0,0);border-bottom:none;padding:7.5px 15px;margin:5px 5px 5px 0;cursor:pointer;color:var(--foreground-color);font-size:inherit;font-weight:normal;outline:3px solid rgba(0,0,0,0)}.im-c-tabs__tab[aria-selected=true]{background:var(--background-color);border-color:var(--app-border-color);border-bottom-color:var(--background-color);margin-top:0;margin-bottom:-1px}.im-c-tabs__tab:focus .im-c-tabs__label{outline:3px solid rgba(0,0,0,0);color:var(--focus-border-color);background-color:var(--focus-outline-color);box-shadow:0 -2px var(--focus-outline-color),0 4px var(--focus-border-color);text-decoration:none}.im-c-tabs__tab:not([aria-selected=true]):hover{background-color:var(--content-border-color)}.im-c-tabs__tab:not([aria-selected=true]) .im-c-tabs__label{text-decoration:underline;text-underline-offset:3px}.im-c-tabs__tab:not([aria-selected=true]):hover .im-c-tabs__label{text-decoration-thickness:3px}.im-c-button-wrapper{position:relative}.im-c-button-wrapper .im-c-panel{position:absolute;right:calc(100% + var(--divider-gap));top:0}.im-c-map-button{border:0;border-radius:var(--button-border-radius)}.im-c-map-button::before{content:"";pointer-events:none;position:absolute;top:0;left:0;height:100%;width:100%;border-radius:calc(var(--button-border-radius));box-shadow:var(--button-box-shadow)}.im-c-map-button:focus{outline:0}.im-c-map-button[data-focus-visible=true]{outline:3px solid rgba(0,0,0,0)}.im-c-map-button::after{content:"";pointer-events:none;position:absolute;z-index:99;top:-1px;right:-1px;bottom:-1px;left:-1px;border:var(--focus-border-width) solid var(--focus-border-color);outline:var(--focus-outline-width) solid var(--focus-outline-color);border-radius:calc(var(--button-border-radius) - 2px);opacity:0}@media(prefers-reduced-motion: no-preference){.im-c-map-button::after{transition:opacity var(--duration) ease}}.im-c-map-button[data-focus-visible=true]::after{opacity:1}.im-c-map-button{display:flex;justify-content:center;align-items:center;padding-left:var(--button-padding);padding-right:var(--button-padding);pointer-events:auto;color:var(--foreground-color);background-color:var(--button-background-color);min-height:var(--button-size);min-width:var(--button-size);user-select:none;cursor:pointer}.im-c-map-button--primary[aria-disabled=true],.im-c-map-button--tertiary[aria-disabled=true]{opacity:var(--disabled-button-opacity)}.im-c-map-button svg{pointer-events:none;width:var(--icon-size);height:var(--icon-size);flex-shrink:0}.im-c-map-button svg+span{margin-left:var(--button-icon-label-offset);white-space:nowrap}@media(hover: hover)and (pointer: fine){.im-c-map-button:hover{background-color:var(--button-hover-color)}}@media(hover: hover)and (pointer: fine)and (prefers-reduced-motion: no-preference){.im-c-map-button:hover{transition:background-color var(--duration) ease}}.im-c-map-button--with-label{padding-left:var(--label-button-padding);padding-right:var(--label-button-padding)}.im-c-map-button--primary{color:var(--background-color);background-color:var(--primary-button-color);box-shadow:var(--primary-button-box-shadow)}.im-c-map-button--primary span{white-space:nowrap;padding:0 var(--button-icon-label-offset)}.im-c-map-button--primary svg+span{padding-left:0}.im-c-map-button--primary::before{box-shadow:none}@media(hover: hover)and (pointer: fine){.im-c-map-button--primary:hover{background-color:var(--primary-button-hover-color)}}.im-c-map-button--tertiary{border:1px solid var(--tertiary-button-border-color);box-shadow:var(--tertiary-button-box-shadow)}.im-c-map-button--tertiary span{white-space:nowrap;padding:0 5px}.im-c-map-button--tertiary svg+span{padding-left:0}.im-c-map-button--tertiary::before{box-shadow:none}.im-o-app__right .im-c-button-group{display:flex;flex-direction:column}.im-o-app__right .im-c-button-group .im-c-button-wrapper:first-child .im-c-map-button,.im-o-app__right .im-c-button-group .im-c-button-wrapper:first-child .im-c-map-button::before,.im-o-app__right .im-c-button-group .im-c-button-wrapper:first-child .im-c-map-button::after{border-bottom-left-radius:0;border-bottom-right-radius:0}.im-o-app__right .im-c-button-group .im-c-button-wrapper:first-child .im-c-map-button::before{clip-path:inset(-20px -20px 0 -20px)}.im-o-app__right .im-c-button-group .im-c-button-wrapper:not(:first-child):not(:last-child) .im-c-map-button,.im-o-app__right .im-c-button-group .im-c-button-wrapper:not(:first-child):not(:last-child) .im-c-map-button::before,.im-o-app__right .im-c-button-group .im-c-button-wrapper:not(:first-child):not(:last-child) .im-c-map-button::after{border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:0;border-bottom-right-radius:0}.im-o-app__right .im-c-button-group .im-c-button-wrapper:not(:first-child):not(:last-child) .im-c-map-button::before{clip-path:inset(-20px -20px -20px -20px)}.im-o-app__right .im-c-button-group .im-c-button-wrapper:not(:first-child):not(:last-child) .im-c-map-button::before{clip-path:inset(0 -20px 0 -20px)}.im-o-app__right .im-c-button-group .im-c-button-wrapper:last-child .im-c-map-button{margin-top:0}.im-o-app__right .im-c-button-group .im-c-button-wrapper:last-child .im-c-map-button,.im-o-app__right .im-c-button-group .im-c-button-wrapper:last-child .im-c-map-button::before,.im-o-app__right .im-c-button-group .im-c-button-wrapper:last-child .im-c-map-button::after{border-top-left-radius:0;border-top-right-radius:0}.im-o-app__right .im-c-button-group .im-c-button-wrapper:last-child .im-c-map-button::before{clip-path:inset(0 -20px -20px -20px)}.im-o-app__top .im-c-button-group{display:flex;flex-direction:row}.im-o-app__top .im-c-button-group .im-c-button-wrapper:first-child .im-c-map-button,.im-o-app__top .im-c-button-group .im-c-button-wrapper:first-child .im-c-map-button::before,.im-o-app__top .im-c-button-group .im-c-button-wrapper:first-child .im-c-map-button::after{border-top-right-radius:0;border-bottom-right-radius:0}.im-o-app__top .im-c-button-group .im-c-button-wrapper:first-child .im-c-map-button::before{clip-path:inset(-20px 0 -20px -20px)}.im-o-app__top .im-c-button-group .im-c-button-wrapper:not(:first-child):not(:last-child) .im-c-map-button,.im-o-app__top .im-c-button-group .im-c-button-wrapper:not(:first-child):not(:last-child) .im-c-map-button::before,.im-o-app__top .im-c-button-group .im-c-button-wrapper:not(:first-child):not(:last-child) .im-c-map-button::after{border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:0;border-bottom-right-radius:0}.im-o-app__top .im-c-button-group .im-c-button-wrapper:not(:first-child):not(:last-child) .im-c-map-button::before{clip-path:inset(-20px -20px -20px -20px)}.im-o-app__top .im-c-button-group .im-c-button-wrapper:not(:first-child):not(:last-child) .im-c-map-button::before{clip-path:inset(-20px 0 -20px 0)}.im-o-app__top .im-c-button-group .im-c-button-wrapper:last-child .im-c-map-button,.im-o-app__top .im-c-button-group .im-c-button-wrapper:last-child .im-c-map-button::before,.im-o-app__top .im-c-button-group .im-c-button-wrapper:last-child .im-c-map-button::after{border-top-left-radius:0;border-bottom-left-radius:0}.im-o-app__top .im-c-button-group .im-c-button-wrapper:last-child .im-c-map-button::before{clip-path:inset(-20px -20px -20px 0)}.im-c-map-button[aria-haspopup=true][aria-expanded=true] svg{transform:rotate(180deg)}.im-c-map-button[aria-disabled=true]:not(.im-c-map-button--primary):not(.im-c-map-button--tertiary) svg,.im-c-map-button[aria-disabled=true]:not(.im-c-map-button--primary):not(.im-c-map-button--tertiary) span{opacity:var(--disabled-button-opacity)}.im-o-app__actions .im-c-map-button[aria-pressed=true]{color:var(--pressed-button-foreground-color);border-color:var(--pressed-button-border-color);background-color:var(--pressed-button-background-color)}.im-c-panel{border:0;border-radius:var(--panel-border-radius)}.im-c-panel::before{content:"";pointer-events:none;position:absolute;top:0;left:0;height:100%;width:100%;border-radius:calc(var(--panel-border-radius));box-shadow:var(--panel-box-shadow)}.im-c-panel:focus{outline:0}.im-c-panel[data-focus-visible=true]{outline:3px solid rgba(0,0,0,0)}.im-c-panel::after{content:"";pointer-events:none;position:absolute;z-index:99;top:-1px;right:-1px;bottom:-1px;left:-1px;border:var(--focus-border-width) solid var(--focus-border-color);outline:var(--focus-outline-width) solid var(--focus-outline-color);border-radius:calc(var(--panel-border-radius) - 2px);opacity:0}@media(prefers-reduced-motion: no-preference){.im-c-panel::after{transition:opacity var(--duration) ease}}.im-c-panel[data-focus-visible=true]::after{opacity:1}.im-c-panel{position:relative;display:flex;flex-direction:column;max-height:100vh;min-height:0;min-width:var(--min-panel-width);pointer-events:auto;background-color:var(--background-color)}.im-c-panel__heading{display:flex;padding:var(--panel-heading-margin-top) calc(var(--panel-close-button-gap)*2 + var(--button-size)) var(--panel-margin) var(--panel-margin);color:var(--foreground-color)}.im-c-panel__close{border:0;border-radius:var(--button-border-radius)}.im-c-panel__close::before{content:"";pointer-events:none;position:absolute;top:0;left:0;height:100%;width:100%;border-radius:calc(var(--button-border-radius));box-shadow:var(--button-box-shadow)}.im-c-panel__close:focus{outline:0}.im-c-panel__close[data-focus-visible=true]{outline:3px solid rgba(0,0,0,0)}.im-c-panel__close::after{content:"";pointer-events:none;position:absolute;z-index:99;top:-1px;right:-1px;bottom:-1px;left:-1px;border:var(--focus-border-width) solid var(--focus-border-color);outline:var(--focus-outline-width) solid var(--focus-outline-color);border-radius:calc(var(--button-border-radius) - 2px);opacity:0}@media(prefers-reduced-motion: no-preference){.im-c-panel__close::after{transition:opacity var(--duration) ease}}.im-c-panel__close[data-focus-visible=true]::after{opacity:1}.im-c-panel__close{border:0;position:absolute;top:var(--panel-close-button-gap);right:var(--panel-close-button-gap);padding-left:var(--button-padding);padding-right:var(--button-padding);min-height:var(--button-size);min-width:var(--button-size);color:var(--foreground-color);background-color:rgba(0,0,0,0);cursor:pointer}.im-c-panel__body{padding:0 var(--panel-margin) var(--panel-margin);overflow:auto}.im-c-panel__body[data-focus-visible=true]{outline:var(--scrollable-outline);outline-offset:var(--scrollable-outline-offset);box-shadow:var(--scrollable-box-shadow)}.im-c-panel__close::before{content:none}@media(prefers-reduced-motion: no-preference){.im-c-panel__close:hover{transition:background-color var(--duration) ease}}.im-c-panel__close:hover{background-color:var(--button-hover-color)}.im-o-app--mobile .im-c-panel--bottom{border:0;border-radius:var(--panel-border-radius)}.im-o-app--mobile .im-c-panel--bottom::before{content:"";pointer-events:none;position:absolute;top:0;left:0;height:100%;width:100%;border-radius:calc(var(--panel-border-radius));box-shadow:var(--panel-box-shadow)}.im-o-app--mobile .im-c-panel--bottom:focus{outline:0}.im-o-app--mobile .im-c-panel--bottom[data-focus-visible=true]{outline:3px solid rgba(0,0,0,0)}.im-o-app--mobile .im-c-panel--bottom::after{content:"";pointer-events:none;position:absolute;z-index:99;top:var(--focus-border-width);right:var(--focus-border-width);bottom:var(--focus-border-width);left:var(--focus-border-width);border:var(--focus-border-width) solid var(--focus-border-color);outline:var(--focus-outline-width) solid var(--focus-outline-color);border-radius:calc(var(--panel-border-radius) - 2px);opacity:0}@media(prefers-reduced-motion: no-preference){.im-o-app--mobile .im-c-panel--bottom::after{transition:opacity var(--duration) ease}}.im-o-app--mobile .im-c-panel--bottom[data-focus-visible=true]::after{opacity:1}.im-o-app--mobile .im-c-panel--bottom,.im-o-app--mobile .im-c-panel--bottom::before,.im-o-app--mobile .im-c-panel--bottom::after{border-bottom-left-radius:0;border-bottom-right-radius:0}.im-o-app--mobile .im-c-panel--bottom::before{clip-path:inset(-20px -20px 0 -20px)}.im-o-app--desktop .im-c-panel--banner.im-c-panel--no-heading .im-c-panel__close{top:var(--banner-close-button-gap);right:var(--banner-close-button-gap)}.im-o-app--desktop .im-c-panel--banner.im-c-panel--no-heading .im-c-panel__body--offset{padding-top:10px;padding-bottom:10px}.im-c-panel__body--offset{padding-right:calc(var(--button-size) + var(--divider-gap))}.im-c-icon--narrow{margin-left:-3px;margin-right:-3px}.im-c-viewport{width:100%;height:100%;background-color:var(--background-colour);-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0);border:0;border-radius:0px}.im-c-viewport::before{content:"";pointer-events:none;position:absolute;top:0;left:0;height:100%;width:100%;border-radius:0px}.im-c-viewport:focus{outline:0}.im-c-viewport[data-focus-visible=true]{outline:3px solid rgba(0,0,0,0)}.im-c-viewport::after{content:"";pointer-events:none;position:absolute;z-index:99;top:var(--focus-border-width);right:var(--focus-border-width);bottom:var(--focus-border-width);left:var(--focus-border-width);border:var(--focus-border-width) solid var(--focus-border-color);outline:var(--focus-outline-width) solid var(--focus-outline-color);border-radius:-2px;opacity:0}@media(prefers-reduced-motion: no-preference){.im-c-viewport::after{transition:opacity var(--duration) ease}}.im-c-viewport[data-focus-visible=true]::after{opacity:1}.im-c-viewport__map-container{width:100%;height:100%}.im-c-viewport__map-container>*:first-child{overflow:visible;transform-origin:top left}.im-c-viewport__safezone{position:absolute;pointer-events:none;z-index:1}.im-c-viewport__markers{position:absolute;inset:0;pointer-events:none}.im-c-viewport--medium .im-c-viewport__map-container{width:66.66%;height:66.66%}.im-c-viewport--medium .im-c-viewport__map-container>*:first-child{transform:scale(1.5)}.im-c-viewport--large .im-c-viewport__map-container{width:50%;height:50%}.im-c-viewport--large .im-c-viewport__map-container>*:first-child{transform:scale(2)}.im-c-tooltip-wrapper{position:relative;display:inline-block;z-index:1}.im-c-tooltip-wrapper:hover,.im-c-tooltip-wrapper--has-focus{z-index:2}.im-c-tooltip{position:absolute;z-index:10;visibility:hidden;pointer-events:none;opacity:0;color:var(--tooltip-foreground-color);background-color:var(--tooltip-background-color);border-radius:var(--tooltip-border-radius);white-space:nowrap;padding:var(--tooltip-padding);font-size:var(--tooltip-font-size);line-height:1.2}@media(prefers-reduced-motion: no-preference){.im-c-tooltip{transition:opacity var(--duration) ease,visibility var(--duration) ease}}.im-c-tooltip::after{content:"";position:absolute;box-sizing:border-box;z-index:-1;width:var(--tooltip-arrow-size);height:var(--tooltip-arrow-size);color:var(--tooltip-background-color);border:calc(var(--tooltip-arrow-size)/2) solid currentcolor}.im-c-tooltip--is-visible{opacity:1;visibility:visible;pointer-events:auto}.im-c-tooltip--hidden{width:0;overflow:hidden}.im-c-tooltip--left{top:50%;transform:translateY(-50%);left:auto;right:calc(100% + var(--tooltip-offset))}.im-c-tooltip--left::after{top:50%;transform:translateY(-50%) rotate(45deg);right:calc(var(--tooltip-arrow-size)/2*-1)}.im-c-tooltip--right{top:50%;transform:translateY(-50%);right:auto;left:calc(100% + var(--tooltip-offset))}.im-c-tooltip--right::after{top:50%;transform:translateY(-50%) rotate(45deg);left:calc(var(--tooltip-arrow-size)/2*-1)}.im-c-tooltip--bottom{top:calc(100% + var(--tooltip-offset));left:50%;transform:translateX(-50%)}.im-c-tooltip--bottom::after{left:50%;transform:translateX(-50%) rotate(45deg);top:calc(var(--tooltip-arrow-size)/2*-1)}.im-c-tooltip--top{bottom:calc(100% + var(--tooltip-offset));left:50%;transform:translateX(-50%)}.im-c-tooltip--top::after{left:50%;transform:translateX(-50%) rotate(45deg);bottom:calc(var(--tooltip-arrow-size)/2*-1)}.im-c-popup-menu{border:0;border-radius:var(--button-border-radius)}.im-c-popup-menu::before{content:"";pointer-events:none;position:absolute;top:0;left:0;height:100%;width:100%;border-radius:calc(var(--button-border-radius));box-shadow:var(--button-box-shadow)}.im-c-popup-menu:focus{outline:0}.im-c-popup-menu[data-focus-visible=true]{outline:3px solid rgba(0,0,0,0)}.im-c-popup-menu::after{content:"";pointer-events:none;position:absolute;z-index:99;top:-1px;right:-1px;bottom:-1px;left:-1px;border:var(--focus-border-width) solid var(--focus-border-color);outline:var(--focus-outline-width) solid var(--focus-outline-color);border-radius:calc(var(--button-border-radius) - 2px);opacity:0}@media(prefers-reduced-motion: no-preference){.im-c-popup-menu::after{transition:opacity var(--duration) ease}}.im-c-popup-menu[data-focus-visible=true]::after{opacity:1}.im-c-popup-menu{background-color:var(--background-color);position:fixed;z-index:9999;list-style:none;margin:0;padding:0}.im-c-popup-menu[data-direction=below]{margin-top:var(--divider-gap)}.im-c-popup-menu[data-direction=above]{margin-bottom:var(--divider-gap)}.im-c-popup-menu[data-halign=center]{transform:translateX(-50%)}.im-c-popup-menu__item{display:flex;position:relative;align-items:center;padding:var(--divider-gap);border-top:1px solid var(--button-hover-color);text-align:left;cursor:pointer;min-width:var(--popup-menu-min-width);max-width:var(--popup-menu-max-width)}.im-c-popup-menu__item:first-child{border-top:0}@media(hover: hover)and (pointer: fine){.im-c-popup-menu__item:hover:not(.im-c-popup-menu__item--selected){background-color:var(--button-hover-color)}}.im-c-popup-menu__item:hover:not(.im-c-popup-menu__item--selected) .im-c-popup-menu__item-label{text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:2px;text-decoration-color:var(--foreground-color);text-decoration-skip-ink:none}.im-c-popup-menu__item--selected{background-color:var(--button-hover-color)}.im-c-popup-menu__item--selected .im-c-popup-menu__item-label{outline:3px solid rgba(0,0,0,0);color:var(--focus-border-color);background-color:var(--focus-outline-color);box-shadow:0 -2px var(--focus-outline-color),0 4px var(--focus-border-color);text-decoration:none}.im-c-popup-menu__item svg+span{margin-left:calc(var(--button-icon-label-offset) + 3px);white-space:nowrap}.im-c-popup-menu__item[aria-disabled=true] .im-c-popup-menu__item-label,.im-c-popup-menu__item[aria-disabled=true] svg{opacity:.5}.im-c-popup-menu__item[role=menuitemcheckbox]{padding-right:75px}.im-c-popup-menu__item[role=menuitemcheckbox]::before{content:"";position:absolute;border:1px solid var(--foreground-color);left:auto;top:12px;right:12px;width:20px;height:20px;opacity:.2}.im-c-popup-menu__item[role=menuitemcheckbox]::after{content:"";position:absolute;top:17px;left:auto;right:16px;width:12px;height:6.5px;border:solid;border-width:0 0 3px 3px;transform:rotate(-45deg);opacity:0}.im-c-popup-menu__item[role=menuitemcheckbox][aria-checked=true]::before{top:10px;right:10px;width:24px;height:24px;border-width:2px;opacity:1}.im-c-popup-menu__item[role=menuitemcheckbox][aria-checked=true]::after{opacity:1}.im-c-popup-menu__item[role=menuitemcheckbox]:hover::before,.im-c-popup-menu__item--selected[role=menuitemcheckbox]::before,.im-c-popup-menu__item--selected[role=menuitemcheckbox][aria-checked=true]::before{top:10px;right:10px;width:24px;height:24px;border-width:4px;outline:3px solid rgba(0,0,0,0);outline-offset:1px;box-shadow:0 0 0 3px #fd0;opacity:1}.im-c-attributions{color:var(--attributions-foreground-color);background-color:var(--attributions-background-color);padding:var(--attributions-padding);font-size:var(--attributions-font-size);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.im-c-logo{align-self:center;flex-shrink:0;height:auto;width:auto;user-select:none}.im-o-hints{position:absolute;bottom:var(--hint-bottom, var(--primary-gap));left:50%;transform:translateX(-50%);z-index:1001}.im-c-hints{display:flex;flex-direction:column;align-items:center;gap:var(--divider-gap)}.im-c-hints__hint{text-wrap:nowrap;color:var(--tooltip-foreground-color);background-color:var(--tooltip-background-color);border-radius:var(--tooltip-border-radius);padding:var(--tooltip-padding);font-size:var(--tooltip-font-size);line-height:1.2}.im-c-hints__hint kbd{border:var(--kbd-tooltip-border)}.im-c-cross-hair{position:absolute;top:0;left:0;pointer-events:none;margin:-19px 0 0 -19px}.im-c-cross-hair path{stroke-width:3;stroke:var(--map-overlay-halo-color);fill:var(--map-overlay-foreground-color);paint-order:stroke fill}.im-c-markers{position:absolute;top:0;left:0;pointer-events:none}.im-c-marker{position:absolute;left:0;top:0;pointer-events:none}.im-c-marker-wrapper{position:absolute;left:0;top:0;pointer-events:none}.im-c-marker__svg{display:block;pointer-events:none}.im-c-marker__label{position:absolute;bottom:100%;left:50%;transform:translateX(-50%);white-space:nowrap;pointer-events:none;color:var(--tooltip-foreground-color);background-color:var(--tooltip-background-color);border-radius:var(--tooltip-border-radius);padding:var(--tooltip-padding);font-size:var(--tooltip-font-size);line-height:1.2}.im-c-marker__label--standalone{bottom:0}.im-c-marker__label--standalone::after{content:"";position:absolute;top:calc(100% - 1px);left:50%;transform:translateX(-50%);border:calc(var(--tooltip-arrow-size) - 2px) solid rgba(0,0,0,0);border-top-color:var(--tooltip-background-color)}.im-c-features{position:absolute;inset:0;pointer-events:none;list-style:none;margin:0;padding:0;border:0;border-radius:0px}.im-c-features::before{content:"";pointer-events:none;position:absolute;top:0;left:0;height:100%;width:100%;border-radius:0px}.im-c-features:focus{outline:0}.im-c-features[data-focus-visible=true]{outline:3px solid rgba(0,0,0,0)}.im-c-features::after{content:"";pointer-events:none;position:absolute;z-index:99;top:var(--focus-border-width);right:var(--focus-border-width);bottom:var(--focus-border-width);left:var(--focus-border-width);border:var(--focus-border-width) solid var(--focus-border-color);outline:var(--focus-outline-width) solid var(--focus-outline-color);border-radius:-2px;opacity:0}@media(prefers-reduced-motion: no-preference){.im-c-features::after{transition:opacity var(--duration) ease}}.im-c-features[data-focus-visible=true]::after{opacity:1}.im-c-features[data-focus-visible=true][aria-activedescendant]::after{opacity:0}.im-c-features [role=option]{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.im-c-actions{position:relative;display:flex;flex-direction:row;justify-content:center;gap:calc(var(--divider-gap)/2);padding:var(--panel-margin);max-height:200px}.im-c-actions--border-top{border-top:1px solid var(--app-border-color)}.im-c-actions--hidden{max-height:0;padding-top:0;padding-bottom:0;border:0}.im-c-actions .im-c-button-wrapper--wide{display:flex;flex:1 1 0}.im-c-actions .im-c-map-button--primary,.im-c-actions .im-c-map-button--tertiary{width:100%}.im-o-app--tablet .im-c-actions,.im-o-app--desktop .im-c-actions{min-width:0}.im-c-open-map-button{font-family:-apple-system,blinkmacsystemfont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Fira Sans","Droid Sans","Helvetica Neue",sans-serif;display:inline-flex;text-decoration:none;border:1px solid #505a5f;white-space:nowrap;padding:10px}.im-c-open-map-button svg+span{padding-left:8px}.im-c-open-map-button span{color:#1d70b8}.im-c-open-map-button:hover{background-color:#f3f2f1}.im-c-open-map-button:active span{color:#0b0c0c}.im-c-open-map-button:focus{border-color:rgba(0,0,0,0);outline:3px solid rgba(0,0,0,0);color:#0b0c0c;background-color:#fd0;box-shadow:0 -2px #fd0,0 4px #0b0c0c;text-decoration:none}.im-c-open-map-button:focus span{color:#0b0c0c}.im-c-error{padding:15px;margin-bottom:30px;border:5px solid #b1b4b6}.im-is-loading{visibility:hidden}.im-has-js{position:fixed;overflow:hidden;top:0;right:0;bottom:0;left:0}.im-is-fullscreen{height:100%;overflow-y:visible;overscroll-behavior-y:none}.im-is-fullscreen body{position:fixed;overflow:hidden;top:0;right:0;bottom:0;left:0}.maplibregl-canvas-container canvas{image-rendering:pixelated;outline:0}.maplibregl-control-container{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.maplibregl-control-container *{pointer-events:auto}.maplibregl-symbols{display:none}.im-u-visually-hidden{position:absolute;width:1px;height:1px;margin:0;padding:0;overflow:hidden;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);border:0;white-space:nowrap}
1
+ :root{--foreground-color: #0b0c0c;--background-color: #ffffff;--focus-border-color: #0b0c0c;--focus-outline-color: #ffdd00;--button-background-color: #ffffff;--button-hover-color: #f3f2f1;--primary-button-color: #00703c;--primary-button-hover-color: #005a30;--primary-button-box-shadow: inset 0 -2px 0 #002d18;--tertiary-button-border-color: #505a5f;--disabled-button-opacity: 0.4;--pressed-button-foreground-color: #ffffff;--pressed-button-border-color: #0b0c0c;--pressed-button-background-color: #0b0c0c;--scrollable-outline: 3px solid #ffdd00;--scrollable-outline-offset: -3px;--scrollable-box-shadow: inset 0 0 0 6px #002d18;--tooltip-background-color: #383F43;--tooltip-foreground-color: #ffffff;--modal-background-color: #0b0c0c;--modal-backdrop-opacity: 0.4;--attributions-foreground-color: #0b0c0c;--attributions-background-color: #ffffff80;--fixed-foreground-color: #0b0c0c;--app-border-color: #cecece;--content-border-color: #f3f2f1;--secondary-text-color: #505a5f;--image-placeholder-color: #b1b4b6;--content-link-color: #1d70b8}:root .im-o-app--dark-app{--foreground-color: #ffffff;--background-color: #383F43;--focus-border-color: #0b0c0c;--focus-outline-color: #ffdd00;--button-background-color: #383F43;--button-hover-color: #505a5f;--primary-button-color: #ffffff;--primary-button-hover-color: #b1b4b6;--primary-button-box-shadow: none;--tertiary-button-border-color: #f3f2f1;--tertiary-button-box-shadow: none;--disabled-button-opacity: 0.4;--pressed-button-foreground-color: #0b0c0c;--pressed-button-border-color: #ffffff;--pressed-button-background-color: #ffffff;--content-border-color: #505a5f;--secondary-text-color: #f3f2f1;--content-link-color: #ffffff}:root{--font-family: gds transport,arial,sans-serif;--font-size: 16px;--line-height: 1.25em}:root{--button-box-shadow: 0 -2px 20px rgba(0,0,0,.1), 0 0 12px rgba(0,0,0,.1);--panel-box-shadow: 0 -2px 20px rgba(0,0,0,.1), 0 0 12px rgba(0,0,0,.1);--shadow-clip-size: 20px}:root{--duration: 0.2s}:root{--primary-gap: 15px;--divider-gap: 10px;--button-size: 40px;--icon-size: 24px;--button-padding: 8px;--button-icon-label-offset: 7px;--label-button-padding: 10px;--app-border-width: 1px;--button-border-radius: 0px;--panel-border-radius: 0px;--focus-border-width: 3px;--focus-outline-width: 3px;--modal-offset-top: 0px;--modal-offset-right: 0px;--tooltip-padding: 10px;--tooltip-offset: 10px;--tooltip-arrow-size: 8px;--tooltip-font-size: 14px;--tooltip-border-radius: 3px;--min-panel-width: 260px;--panel-close-button-gap: 4px;--panel-heading-margin-top: 12px;--panel-margin: 15px;--banner-close-button-gap: 0px;--banner-max-desktop-width: 400px;--banner-collapse-margin: 14px;--popup-menu-min-width: 200px;--popup-menu-max-width: 300px;--action-bar-max-width: calc(100% - (var(--button-size) * 2) - (var(--primary-gap) * 4));--attributions-padding: 2px 5px;--attributions-font-size: 12px}:root{--kbd-font-family: monospace;--kbd-background-color: var(--background-color);--kbd-foreground-color: var(--tooltip-background-color);--kbd-border: 2px solid #e7e7e7;--kbd-border-radius: 4px;--kbd-font-size: .825rem;--kbd-padding: 2px 4px;--kbd-tooltip-border: none}:root .im-o-app--dark-app{--kbd-background-color: var(--background-color);--kbd-foreground-color: var(--tooltip-foreground-color);--kbd-tooltip-border: 2px solid #505a5f;--kbd-border: 2px solid #505a5f}.im-o-app *,.im-o-app *::before,.im-o-app *::after{box-sizing:border-box}.im-o-app *{margin:0}.im-o-app img,.im-o-app picture,.im-o-app video,.im-o-app canvas,.im-o-app svg{display:block}.im-o-app input,.im-o-app button,.im-o-app textarea,.im-o-app select{font:inherit}.im-o-app p,.im-o-app h1,.im-o-app h2,.im-o-app h3,.im-o-app h4,.im-o-app h5,.im-o-app h6{overflow-wrap:break-word}.im-o-app{visibility:visible;font-family:var(--font-family);font-size:var(--font-size);line-height:var(--line-height);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;color:var(--foreground-color);background-color:var(--background-color);-webkit-overflow-scrolling:touch;touch-action:pan-x pan-y}.im-is-fullscreen>.im-o-app{position:fixed;z-index:999;top:0;bottom:0;left:0;right:0;width:100%}.im-o-app__overlay,.im-o-app__modal{pointer-events:none}.im-e-heading-s,.im-e-heading-m,.im-e-heading-l{margin:0;font-weight:600}.im-e-heading-l{font-size:1.5rem;line-height:1.25}.im-e-heading-m{font-size:1.25rem;line-height:1.25}.im-e-heading-s{font-size:1rem;line-height:1.25}kbd{font-family:var(--kbd-font-family);border:var(--kbd-border);background-color:var(--kbd-background-color);color:var(--kbd-foreground-color);border-radius:var(--kbd-border-radius);font-size:var(--kbd-font-size);padding:var(--kbd-padding)}.im-o-app{position:relative;width:100%;height:100%;min-height:0;overflow:hidden;touch-action:none}.im-o-app__overlay{position:absolute;z-index:1;box-sizing:border-box;flex-direction:row;display:flex;justify-content:space-between;top:0;left:0;width:100%;height:100%;min-height:0;visibility:visible;opacity:1}@media(prefers-reduced-motion: no-preference){.im-o-app__overlay{transition:opacity var(--duration) ease-in}}.im-o-app__side{position:relative;display:flex;flex-direction:column;z-index:3;flex-shrink:0;height:100%}.im-o-app__main{position:relative;display:flex;flex-direction:column;width:100%;min-width:0;height:100%;min-height:0;flex-wrap:nowrap;padding:var(--primary-gap)}.im-o-app__side .im-c-panel{height:100%;border:0;border-radius:var(--panel-border-radius)}.im-o-app__side .im-c-panel::before{content:"";pointer-events:none;position:absolute;top:0;left:0;height:100%;width:100%;border-radius:calc(var(--panel-border-radius));box-shadow:var(--panel-box-shadow)}.im-o-app__side .im-c-panel:focus{outline:0}.im-o-app__side .im-c-panel[data-focus-visible=true]{outline:3px solid rgba(0,0,0,0)}.im-o-app__side .im-c-panel::after{content:"";pointer-events:none;position:absolute;z-index:99;top:var(--focus-border-width);right:var(--focus-border-width);bottom:var(--focus-border-width);left:var(--focus-border-width);border:var(--focus-border-width) solid var(--focus-border-color);outline:var(--focus-outline-width) solid var(--focus-outline-color);border-radius:calc(var(--panel-border-radius) - 2px);opacity:0}@media(prefers-reduced-motion: no-preference){.im-o-app__side .im-c-panel::after{transition:opacity var(--duration) ease}}.im-o-app__side .im-c-panel[data-focus-visible=true]::after{opacity:1}.im-o-app__side .im-c-panel,.im-o-app__side .im-c-panel::before,.im-o-app__side .im-c-panel::after{border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:0;border-bottom-right-radius:0}.im-o-app__side .im-c-panel::before{clip-path:inset(-20px -20px -20px -20px)}.im-o-app__banner{display:flex;flex-direction:column;gap:var(--divider-gap)}.im-o-app__banner .im-c-panel:last-child{margin-bottom:var(--divider-gap)}.im-o-app__top{display:flex;margin-bottom:auto;justify-content:space-between;align-items:flex-start;width:100%;gap:var(--divider-gap)}.im-o-app__top-col{display:flex;flex:1 1 auto;gap:var(--divider-gap)}.im-o-app__top-col:not(:empty){padding-bottom:var(--divider-gap)}.im-o-app__top-col:first-child,.im-o-app__top-col:last-child{flex:1 1 calc(var(--button-size) + var(--primary-gap)*2);max-width:var(--top-col-width, 100%)}.im-o-app__top-col:first-child{justify-content:flex-start}.im-o-app__top-col:last-child{justify-content:flex-end}.im-o-app__top-col:nth-child(2){justify-content:center}.im-o-app__inset{display:flex;flex-direction:column;position:absolute;gap:var(--divider-gap);top:var(--left-offset-top)}.im-o-app__left{position:absolute;display:flex;flex-direction:column;left:var(--primary-gap);top:var(--left-offset-top);bottom:var(--left-offset-bottom);gap:var(--divider-gap)}.im-o-app__left>*:empty{display:none}.im-o-app__left-top{display:flex;flex-direction:column;align-items:flex-start;min-height:0;position:relative;gap:var(--divider-gap)}.im-o-app__left-bottom{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;min-height:0;margin-top:auto;position:relative;gap:var(--divider-gap)}.im-o-app__middle{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;z-index:-1}.im-o-app__right{position:absolute;display:flex;flex-direction:column;right:var(--primary-gap);top:var(--right-offset-top);bottom:var(--right-offset-bottom);gap:var(--divider-gap)}.im-o-app__right-top{display:flex;flex-direction:column;flex:0 0 auto;align-items:flex-end;position:relative;gap:var(--divider-gap)}.im-o-app__right-bottom{display:flex;flex-direction:column;flex:0 0 auto;margin-top:auto;align-items:flex-end;position:relative;gap:var(--divider-gap)}.im-o-app__bottom{display:flex;justify-content:space-between;align-items:flex-end;z-index:-2}.im-o-app__bottom-col{display:flex;min-width:auto}.im-o-app__bottom-col:first-child{flex-direction:row;align-items:flex-end;flex-shrink:0;gap:var(--divider-gap)}.im-o-app__bottom-col:last-child{position:relative;flex:1 1 auto;flex-direction:column;align-items:flex-end;min-width:0}.im-o-app__bottom-left,.im-o-app__bottom-right{display:flex;flex-direction:row;gap:var(--divider-gap)}.im-o-app__bottom-right{justify-content:flex-end}.im-o-app__attributions:not(:empty){position:absolute;bottom:calc(var(--primary-gap)*-1);right:calc(var(--primary-gap)*-1);display:flex;justify-content:flex-end}.im-o-app__drawer{z-index:1}.im-o-app__drawer .im-c-panel,.im-o-app__drawer .im-c-panel::before,.im-o-app__drawer .im-c-panel::after{border-bottom-left-radius:0;border-bottom-right-radius:0}.im-o-app__drawer .im-c-panel::before{clip-path:inset(-20px -20px 0 -20px)}.im-o-app__actions{display:flex;flex-shrink:0;justify-content:center;text-align:center}.im-o-app__actions .im-c-panel__body{overflow:visible}.im-o-app .im-o-app__modal{display:flex;position:absolute;top:0;left:0;width:100%;height:100%;z-index:99}.im-o-app .im-o-app__modal .im-c-panel{position:absolute;top:0;right:0;bottom:auto;left:0;z-index:1000}.im-o-app .im-o-app__modal .im-c-panel+.im-o-app__modal-backdrop{position:absolute;top:0;left:0;width:100%;height:100%;background-color:var(--modal-background-color);opacity:var(--modal-backdrop-opacity);pointer-events:auto}.im-o-app .im-o-app__modal .im-c-panel--side{width:100%;max-width:80%;bottom:0;border:0;border-radius:var(--panel-border-radius)}.im-o-app .im-o-app__modal .im-c-panel--side::before{content:"";pointer-events:none;position:absolute;top:0;left:0;height:100%;width:100%;border-radius:calc(var(--panel-border-radius));box-shadow:var(--panel-box-shadow)}.im-o-app .im-o-app__modal .im-c-panel--side:focus{outline:0}.im-o-app .im-o-app__modal .im-c-panel--side[data-focus-visible=true]{outline:3px solid rgba(0,0,0,0)}.im-o-app .im-o-app__modal .im-c-panel--side::after{content:"";pointer-events:none;position:absolute;z-index:99;top:var(--focus-border-width);right:var(--focus-border-width);bottom:var(--focus-border-width);left:var(--focus-border-width);border:var(--focus-border-width) solid var(--focus-border-color);outline:var(--focus-outline-width) solid var(--focus-outline-color);border-radius:calc(var(--panel-border-radius) - 2px);opacity:0}@media(prefers-reduced-motion: no-preference){.im-o-app .im-o-app__modal .im-c-panel--side::after{transition:opacity var(--duration) ease}}.im-o-app .im-o-app__modal .im-c-panel--side[data-focus-visible=true]::after{opacity:1}.im-o-app .im-o-app__modal .im-c-panel--side,.im-o-app .im-o-app__modal .im-c-panel--side::before,.im-o-app .im-o-app__modal .im-c-panel--side::after{border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:0;border-bottom-right-radius:0}.im-o-app .im-o-app__modal .im-c-panel--side::before{clip-path:inset(-20px -20px -20px -20px)}.im-o-app .im-o-app__modal .im-c-panel--inset{inset:var(--modal-inset);max-width:calc(100% - var(--primary-gap)*2);max-height:var(--modal-max-height)}.im-o-app .im-o-app__modal .im-c-panel--left-top,.im-o-app .im-o-app__modal .im-c-panel.im-c-panel--left-top-button{inset:var(--left-offset-top) auto auto var(--primary-gap);max-height:calc(100% - var(--left-offset-top) - var(--primary-gap))}.im-o-app .im-o-app__modal .im-c-panel--left-bottom,.im-o-app .im-o-app__modal .im-c-panel.im-c-panel--left-bottom-button{inset:auto auto var(--left-offset-bottom) var(--primary-gap);max-height:calc(100% - var(--left-offset-bottom) - var(--primary-gap))}.im-o-app .im-o-app__modal .im-c-panel--right-top,.im-o-app .im-o-app__modal .im-c-panel.im-c-panel--right-top-button{inset:var(--right-offset-top) var(--primary-gap) auto auto;max-height:calc(100% - var(--right-offset-top) - var(--primary-gap))}.im-o-app .im-o-app__modal .im-c-panel--right-bottom,.im-o-app .im-o-app__modal .im-c-panel.im-c-panel--right-bottom-button{inset:auto var(--primary-gap) var(--right-offset-bottom) auto;max-height:calc(100% - var(--right-offset-bottom) - var(--primary-gap))}.im-o-app .im-o-app__modal .im-c-panel--middle{position:relative;margin:auto;width:100%;max-width:calc(100% - var(--primary-gap)*2);max-height:calc(100% - var(--primary-gap)*2)}.im-o-app .im-o-app__modal .im-c-panel--drawer{top:auto;bottom:0;max-height:85%}.im-o-app .im-o-app__modal .im-c-panel--drawer,.im-o-app .im-o-app__modal .im-c-panel--drawer::before,.im-o-app .im-o-app__modal .im-c-panel--drawer::after{border-bottom-left-radius:0;border-bottom-right-radius:0}.im-o-app .im-o-app__modal .im-c-panel--drawer::before{clip-path:inset(-20px -20px 0 -20px)}.im-o-app .im-o-app__modal [class*=im-c-panel--][class*=-button]{inset:var(--modal-inset);max-height:var(--modal-max-height)}.im-o-app--mobile .im-o-app__modal .im-c-panel--banner,.im-o-app--tablet .im-o-app__modal .im-c-panel--banner{margin:var(--primary-gap)}.im-o-app--mobile .im-o-app__banner,.im-o-app--tablet .im-o-app__banner{z-index:9}.im-o-app--desktop .im-o-app__modal .im-c-panel--banner{margin-top:var(--primary-gap)}.im-o-app--inline{border:var(--app-border-width) solid var(--app-border-color);box-sizing:border-box}.im-o-app__overlay--not-ready{visibility:hidden;opacity:0}.im-o-app--desktop .im-c-panel--banner{margin-left:auto;margin-right:auto;max-width:var(--banner-max-desktop-width)}.im-o-app--tablet .im-o-app__actions,.im-o-app--desktop .im-o-app__actions{position:absolute;width:100%;left:0;bottom:calc(var(--primary-gap)*2)}.im-o-app--tablet .im-o-app__actions .im-c-panel,.im-o-app--desktop .im-o-app__actions .im-c-panel{max-width:var(--action-bar-max-width)}@media(prefers-reduced-motion: no-preference){.im-o-app--tablet .im-o-app__actions .im-c-actions,.im-o-app--desktop .im-o-app__actions .im-c-actions{transition:opacity var(--duration) ease}}.im-o-app--tablet .im-o-app__actions .im-c-actions--hidden,.im-o-app--desktop .im-o-app__actions .im-c-actions--hidden{opacity:0}.im-o-app--mobile .im-o-app__drawer,.im-o-app--mobile .im-o-app__actions{margin:var(--primary-gap) calc(var(--primary-gap)*-1) calc(var(--primary-gap)*-1) calc(var(--primary-gap)*-1)}.im-o-app--mobile .im-o-app__drawer .im-c-panel,.im-o-app--mobile .im-o-app__actions .im-c-panel{width:100%}.im-o-app--mobile .im-o-app__drawer .im-c-panel,.im-o-app--mobile .im-o-app__drawer .im-c-panel::before,.im-o-app--mobile .im-o-app__drawer .im-c-panel::after,.im-o-app--mobile .im-o-app__actions .im-c-panel,.im-o-app--mobile .im-o-app__actions .im-c-panel::before,.im-o-app--mobile .im-o-app__actions .im-c-panel::after{border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:0;border-bottom-right-radius:0}.im-o-app--mobile .im-o-app__drawer .im-c-panel::before,.im-o-app--mobile .im-o-app__actions .im-c-panel::before{clip-path:inset(-20px -20px -20px -20px)}.im-o-app--mobile .im-o-app__drawer .im-c-panel{clip-path:inset(-20px 0 0 0)}.im-o-app--mobile .im-o-app__drawer .im-c-panel::after,.im-o-app--mobile .im-o-app__actions .im-c-panel::after,.im-o-app__modal .im-c-panel--drawer::after{top:var(--focus-border-width);right:var(--focus-border-width);bottom:var(--focus-border-width);left:var(--focus-border-width)}.im-o-app--mobile .im-o-app__side{position:absolute;left:0;top:0;width:100%;max-width:80%;pointer-events:none}.im-c-keyboard-help__list{margin:0;color:var(--foreground-color)}.im-c-keyboard-help__item{display:table;padding:10px 0;width:100%;border-top:1px solid var(--content-border-color)}.im-c-keyboard-help__item:last-child{padding-bottom:0}.im-c-keyboard-help__group:last-child .im-c-keyboard-help__item:last-child{padding-bottom:0}.im-c-keyboard-help__title{display:table-cell;width:45%}.im-c-keyboard-help__description{display:table-cell}.im-o-app--mobile .im-c-keyboard-help__title{width:100%;display:block}.im-o-app--mobile .im-c-keyboard-help__description{display:block;margin-top:5px}.im-c-tabs__panel .im-c-keyboard-help__item:first-child{border-top:0}.im-c-tabs__list{position:relative;display:flex;flex-wrap:wrap;padding:0;margin:0;border-bottom:1px solid var(--app-border-color);z-index:1}.im-c-tabs__tab{position:relative;appearance:none;background:var(--button-hover-color);border:1px solid rgba(0,0,0,0);border-bottom:none;padding:7.5px 15px;margin:5px 5px 5px 0;cursor:pointer;color:var(--foreground-color);font-size:inherit;font-weight:normal;outline:3px solid rgba(0,0,0,0)}.im-c-tabs__tab[aria-selected=true]{background:var(--background-color);border-color:var(--app-border-color);border-bottom-color:var(--background-color);margin-top:0;margin-bottom:-1px}.im-c-tabs__tab:focus .im-c-tabs__label{outline:3px solid rgba(0,0,0,0);color:var(--focus-border-color);background-color:var(--focus-outline-color);box-shadow:0 -2px var(--focus-outline-color),0 4px var(--focus-border-color);text-decoration:none}.im-c-tabs__tab:not([aria-selected=true]):hover{background-color:var(--content-border-color)}.im-c-tabs__tab:not([aria-selected=true]) .im-c-tabs__label{text-decoration:underline;text-underline-offset:3px}.im-c-tabs__tab:not([aria-selected=true]):hover .im-c-tabs__label{text-decoration-thickness:3px}.im-c-button-wrapper{position:relative}.im-c-button-wrapper .im-c-panel{position:absolute;right:calc(100% + var(--divider-gap));top:0}.im-c-map-button{border:0;border-radius:var(--button-border-radius)}.im-c-map-button::before{content:"";pointer-events:none;position:absolute;top:0;left:0;height:100%;width:100%;border-radius:calc(var(--button-border-radius));box-shadow:var(--button-box-shadow)}.im-c-map-button:focus{outline:0}.im-c-map-button[data-focus-visible=true]{outline:3px solid rgba(0,0,0,0)}.im-c-map-button::after{content:"";pointer-events:none;position:absolute;z-index:99;top:-1px;right:-1px;bottom:-1px;left:-1px;border:var(--focus-border-width) solid var(--focus-border-color);outline:var(--focus-outline-width) solid var(--focus-outline-color);border-radius:calc(var(--button-border-radius) - 2px);opacity:0}@media(prefers-reduced-motion: no-preference){.im-c-map-button::after{transition:opacity var(--duration) ease}}.im-c-map-button[data-focus-visible=true]::after{opacity:1}.im-c-map-button{display:flex;justify-content:center;align-items:center;padding-left:var(--button-padding);padding-right:var(--button-padding);pointer-events:auto;color:var(--foreground-color);background-color:var(--button-background-color);min-height:var(--button-size);min-width:var(--button-size);user-select:none;cursor:pointer}.im-c-map-button--primary[aria-disabled=true],.im-c-map-button--tertiary[aria-disabled=true]{opacity:var(--disabled-button-opacity)}.im-c-map-button svg{pointer-events:none;width:var(--icon-size);height:var(--icon-size);flex-shrink:0}.im-c-map-button svg+span{margin-left:var(--button-icon-label-offset);white-space:nowrap}@media(hover: hover)and (pointer: fine){.im-c-map-button:hover{background-color:var(--button-hover-color)}}@media(hover: hover)and (pointer: fine)and (prefers-reduced-motion: no-preference){.im-c-map-button:hover{transition:background-color var(--duration) ease}}.im-c-map-button--with-label{padding-left:var(--label-button-padding);padding-right:var(--label-button-padding)}.im-c-map-button--primary{color:var(--background-color);background-color:var(--primary-button-color);box-shadow:var(--primary-button-box-shadow)}.im-c-map-button--primary span{white-space:nowrap;padding:0 var(--button-icon-label-offset)}.im-c-map-button--primary svg+span{padding-left:0}.im-c-map-button--primary::before{box-shadow:none}@media(hover: hover)and (pointer: fine){.im-c-map-button--primary:hover{background-color:var(--primary-button-hover-color)}}.im-c-map-button--tertiary{border:1px solid var(--tertiary-button-border-color);box-shadow:var(--tertiary-button-box-shadow)}.im-c-map-button--tertiary span{white-space:nowrap;padding:0 5px}.im-c-map-button--tertiary svg+span{padding-left:0}.im-c-map-button--tertiary::before{box-shadow:none}.im-o-app__right .im-c-button-group{display:flex;flex-direction:column}.im-o-app__right .im-c-button-group .im-c-button-wrapper:first-child .im-c-map-button,.im-o-app__right .im-c-button-group .im-c-button-wrapper:first-child .im-c-map-button::before,.im-o-app__right .im-c-button-group .im-c-button-wrapper:first-child .im-c-map-button::after{border-bottom-left-radius:0;border-bottom-right-radius:0}.im-o-app__right .im-c-button-group .im-c-button-wrapper:first-child .im-c-map-button::before{clip-path:inset(-20px -20px 0 -20px)}.im-o-app__right .im-c-button-group .im-c-button-wrapper:not(:first-child):not(:last-child) .im-c-map-button,.im-o-app__right .im-c-button-group .im-c-button-wrapper:not(:first-child):not(:last-child) .im-c-map-button::before,.im-o-app__right .im-c-button-group .im-c-button-wrapper:not(:first-child):not(:last-child) .im-c-map-button::after{border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:0;border-bottom-right-radius:0}.im-o-app__right .im-c-button-group .im-c-button-wrapper:not(:first-child):not(:last-child) .im-c-map-button::before{clip-path:inset(-20px -20px -20px -20px)}.im-o-app__right .im-c-button-group .im-c-button-wrapper:not(:first-child):not(:last-child) .im-c-map-button::before{clip-path:inset(0 -20px 0 -20px)}.im-o-app__right .im-c-button-group .im-c-button-wrapper:last-child .im-c-map-button{margin-top:0}.im-o-app__right .im-c-button-group .im-c-button-wrapper:last-child .im-c-map-button,.im-o-app__right .im-c-button-group .im-c-button-wrapper:last-child .im-c-map-button::before,.im-o-app__right .im-c-button-group .im-c-button-wrapper:last-child .im-c-map-button::after{border-top-left-radius:0;border-top-right-radius:0}.im-o-app__right .im-c-button-group .im-c-button-wrapper:last-child .im-c-map-button::before{clip-path:inset(0 -20px -20px -20px)}.im-o-app__top .im-c-button-group{display:flex;flex-direction:row}.im-o-app__top .im-c-button-group .im-c-button-wrapper:first-child .im-c-map-button,.im-o-app__top .im-c-button-group .im-c-button-wrapper:first-child .im-c-map-button::before,.im-o-app__top .im-c-button-group .im-c-button-wrapper:first-child .im-c-map-button::after{border-top-right-radius:0;border-bottom-right-radius:0}.im-o-app__top .im-c-button-group .im-c-button-wrapper:first-child .im-c-map-button::before{clip-path:inset(-20px 0 -20px -20px)}.im-o-app__top .im-c-button-group .im-c-button-wrapper:not(:first-child):not(:last-child) .im-c-map-button,.im-o-app__top .im-c-button-group .im-c-button-wrapper:not(:first-child):not(:last-child) .im-c-map-button::before,.im-o-app__top .im-c-button-group .im-c-button-wrapper:not(:first-child):not(:last-child) .im-c-map-button::after{border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:0;border-bottom-right-radius:0}.im-o-app__top .im-c-button-group .im-c-button-wrapper:not(:first-child):not(:last-child) .im-c-map-button::before{clip-path:inset(-20px -20px -20px -20px)}.im-o-app__top .im-c-button-group .im-c-button-wrapper:not(:first-child):not(:last-child) .im-c-map-button::before{clip-path:inset(-20px 0 -20px 0)}.im-o-app__top .im-c-button-group .im-c-button-wrapper:last-child .im-c-map-button,.im-o-app__top .im-c-button-group .im-c-button-wrapper:last-child .im-c-map-button::before,.im-o-app__top .im-c-button-group .im-c-button-wrapper:last-child .im-c-map-button::after{border-top-left-radius:0;border-bottom-left-radius:0}.im-o-app__top .im-c-button-group .im-c-button-wrapper:last-child .im-c-map-button::before{clip-path:inset(-20px -20px -20px 0)}.im-c-map-button[aria-haspopup=true][aria-expanded=true] svg{transform:rotate(180deg)}.im-c-map-button[aria-disabled=true]:not(.im-c-map-button--primary):not(.im-c-map-button--tertiary) svg,.im-c-map-button[aria-disabled=true]:not(.im-c-map-button--primary):not(.im-c-map-button--tertiary) span{opacity:var(--disabled-button-opacity)}.im-o-app__actions .im-c-map-button[aria-pressed=true]{color:var(--pressed-button-foreground-color);border-color:var(--pressed-button-border-color);background-color:var(--pressed-button-background-color)}.im-c-panel{border:0;border-radius:var(--panel-border-radius)}.im-c-panel::before{content:"";pointer-events:none;position:absolute;top:0;left:0;height:100%;width:100%;border-radius:calc(var(--panel-border-radius));box-shadow:var(--panel-box-shadow)}.im-c-panel:focus{outline:0}.im-c-panel[data-focus-visible=true]{outline:3px solid rgba(0,0,0,0)}.im-c-panel::after{content:"";pointer-events:none;position:absolute;z-index:99;top:-1px;right:-1px;bottom:-1px;left:-1px;border:var(--focus-border-width) solid var(--focus-border-color);outline:var(--focus-outline-width) solid var(--focus-outline-color);border-radius:calc(var(--panel-border-radius) - 2px);opacity:0}@media(prefers-reduced-motion: no-preference){.im-c-panel::after{transition:opacity var(--duration) ease}}.im-c-panel[data-focus-visible=true]::after{opacity:1}.im-c-panel{position:relative;display:flex;flex-direction:column;max-height:100vh;min-height:0;min-width:var(--min-panel-width);pointer-events:auto;background-color:var(--background-color)}.im-c-panel__heading{display:flex;padding:var(--panel-heading-margin-top) calc(var(--panel-close-button-gap)*2 + var(--button-size)) var(--panel-margin) var(--panel-margin);color:var(--foreground-color)}.im-c-panel__close{border:0;border-radius:var(--button-border-radius)}.im-c-panel__close::before{content:"";pointer-events:none;position:absolute;top:0;left:0;height:100%;width:100%;border-radius:calc(var(--button-border-radius));box-shadow:var(--button-box-shadow)}.im-c-panel__close:focus{outline:0}.im-c-panel__close[data-focus-visible=true]{outline:3px solid rgba(0,0,0,0)}.im-c-panel__close::after{content:"";pointer-events:none;position:absolute;z-index:99;top:-1px;right:-1px;bottom:-1px;left:-1px;border:var(--focus-border-width) solid var(--focus-border-color);outline:var(--focus-outline-width) solid var(--focus-outline-color);border-radius:calc(var(--button-border-radius) - 2px);opacity:0}@media(prefers-reduced-motion: no-preference){.im-c-panel__close::after{transition:opacity var(--duration) ease}}.im-c-panel__close[data-focus-visible=true]::after{opacity:1}.im-c-panel__close{border:0;position:absolute;top:var(--panel-close-button-gap);right:var(--panel-close-button-gap);padding-left:var(--button-padding);padding-right:var(--button-padding);min-height:var(--button-size);min-width:var(--button-size);color:var(--foreground-color);background-color:rgba(0,0,0,0);cursor:pointer}.im-c-panel__body{padding:0 var(--panel-margin) var(--panel-margin);overflow:auto}.im-c-panel__body[data-focus-visible=true]{outline:var(--scrollable-outline);outline-offset:var(--scrollable-outline-offset);box-shadow:var(--scrollable-box-shadow)}.im-c-panel__close::before{content:none}@media(prefers-reduced-motion: no-preference){.im-c-panel__close:hover{transition:background-color var(--duration) ease}}.im-c-panel__close:hover{background-color:var(--button-hover-color)}.im-o-app--mobile .im-c-panel--bottom{border:0;border-radius:var(--panel-border-radius)}.im-o-app--mobile .im-c-panel--bottom::before{content:"";pointer-events:none;position:absolute;top:0;left:0;height:100%;width:100%;border-radius:calc(var(--panel-border-radius));box-shadow:var(--panel-box-shadow)}.im-o-app--mobile .im-c-panel--bottom:focus{outline:0}.im-o-app--mobile .im-c-panel--bottom[data-focus-visible=true]{outline:3px solid rgba(0,0,0,0)}.im-o-app--mobile .im-c-panel--bottom::after{content:"";pointer-events:none;position:absolute;z-index:99;top:var(--focus-border-width);right:var(--focus-border-width);bottom:var(--focus-border-width);left:var(--focus-border-width);border:var(--focus-border-width) solid var(--focus-border-color);outline:var(--focus-outline-width) solid var(--focus-outline-color);border-radius:calc(var(--panel-border-radius) - 2px);opacity:0}@media(prefers-reduced-motion: no-preference){.im-o-app--mobile .im-c-panel--bottom::after{transition:opacity var(--duration) ease}}.im-o-app--mobile .im-c-panel--bottom[data-focus-visible=true]::after{opacity:1}.im-o-app--mobile .im-c-panel--bottom,.im-o-app--mobile .im-c-panel--bottom::before,.im-o-app--mobile .im-c-panel--bottom::after{border-bottom-left-radius:0;border-bottom-right-radius:0}.im-o-app--mobile .im-c-panel--bottom::before{clip-path:inset(-20px -20px 0 -20px)}.im-o-app--desktop .im-c-panel--banner.im-c-panel--no-heading .im-c-panel__close{top:var(--banner-close-button-gap);right:var(--banner-close-button-gap)}.im-o-app--desktop .im-c-panel--banner.im-c-panel--no-heading .im-c-panel__body--offset{padding-top:10px;padding-bottom:10px}.im-c-panel__body--offset{padding-right:calc(var(--button-size) + var(--divider-gap))}.im-c-icon--narrow{margin-left:-3px;margin-right:-3px}.im-c-viewport{width:100%;height:100%;background-color:var(--background-colour);-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0);border:0;border-radius:0px}.im-c-viewport::before{content:"";pointer-events:none;position:absolute;top:0;left:0;height:100%;width:100%;border-radius:0px}.im-c-viewport:focus{outline:0}.im-c-viewport[data-focus-visible=true]{outline:3px solid rgba(0,0,0,0)}.im-c-viewport::after{content:"";pointer-events:none;position:absolute;z-index:99;top:var(--focus-border-width);right:var(--focus-border-width);bottom:var(--focus-border-width);left:var(--focus-border-width);border:var(--focus-border-width) solid var(--focus-border-color);outline:var(--focus-outline-width) solid var(--focus-outline-color);border-radius:-2px;opacity:0}@media(prefers-reduced-motion: no-preference){.im-c-viewport::after{transition:opacity var(--duration) ease}}.im-c-viewport[data-focus-visible=true]::after{opacity:1}.im-c-viewport__map-container{width:100%;height:100%}.im-c-viewport__map-container>*:first-child{overflow:visible;transform-origin:top left}.im-c-viewport__safezone{position:absolute;pointer-events:none;z-index:1}.im-c-viewport__markers{position:absolute;inset:0;pointer-events:none}.im-c-viewport--medium .im-c-viewport__map-container{width:66.66%;height:66.66%}.im-c-viewport--medium .im-c-viewport__map-container>*:first-child{transform:scale(1.5)}.im-c-viewport--large .im-c-viewport__map-container{width:50%;height:50%}.im-c-viewport--large .im-c-viewport__map-container>*:first-child{transform:scale(2)}.im-c-tooltip-wrapper{position:relative;display:inline-block;z-index:1}.im-c-tooltip-wrapper:hover,.im-c-tooltip-wrapper--has-focus{z-index:2}.im-c-tooltip{position:absolute;z-index:10;visibility:hidden;pointer-events:none;opacity:0;color:var(--tooltip-foreground-color);background-color:var(--tooltip-background-color);border-radius:var(--tooltip-border-radius);white-space:nowrap;padding:var(--tooltip-padding);font-size:var(--tooltip-font-size);line-height:1.2}@media(prefers-reduced-motion: no-preference){.im-c-tooltip{transition:opacity var(--duration) ease,visibility var(--duration) ease}}.im-c-tooltip::after{content:"";position:absolute;box-sizing:border-box;z-index:-1;width:var(--tooltip-arrow-size);height:var(--tooltip-arrow-size);color:var(--tooltip-background-color);border:calc(var(--tooltip-arrow-size)/2) solid currentcolor}.im-c-tooltip--is-visible{opacity:1;visibility:visible;pointer-events:auto}.im-c-tooltip--hidden{width:0;overflow:hidden}.im-c-tooltip--left{top:50%;transform:translateY(-50%);left:auto;right:calc(100% + var(--tooltip-offset))}.im-c-tooltip--left::after{top:50%;transform:translateY(-50%) rotate(45deg);right:calc(var(--tooltip-arrow-size)/2*-1)}.im-c-tooltip--right{top:50%;transform:translateY(-50%);right:auto;left:calc(100% + var(--tooltip-offset))}.im-c-tooltip--right::after{top:50%;transform:translateY(-50%) rotate(45deg);left:calc(var(--tooltip-arrow-size)/2*-1)}.im-c-tooltip--bottom{top:calc(100% + var(--tooltip-offset));left:50%;transform:translateX(-50%)}.im-c-tooltip--bottom::after{left:50%;transform:translateX(-50%) rotate(45deg);top:calc(var(--tooltip-arrow-size)/2*-1)}.im-c-tooltip--top{bottom:calc(100% + var(--tooltip-offset));left:50%;transform:translateX(-50%)}.im-c-tooltip--top::after{left:50%;transform:translateX(-50%) rotate(45deg);bottom:calc(var(--tooltip-arrow-size)/2*-1)}.im-c-popup-menu{border:0;border-radius:var(--button-border-radius)}.im-c-popup-menu::before{content:"";pointer-events:none;position:absolute;top:0;left:0;height:100%;width:100%;border-radius:calc(var(--button-border-radius));box-shadow:var(--button-box-shadow)}.im-c-popup-menu:focus{outline:0}.im-c-popup-menu[data-focus-visible=true]{outline:3px solid rgba(0,0,0,0)}.im-c-popup-menu::after{content:"";pointer-events:none;position:absolute;z-index:99;top:-1px;right:-1px;bottom:-1px;left:-1px;border:var(--focus-border-width) solid var(--focus-border-color);outline:var(--focus-outline-width) solid var(--focus-outline-color);border-radius:calc(var(--button-border-radius) - 2px);opacity:0}@media(prefers-reduced-motion: no-preference){.im-c-popup-menu::after{transition:opacity var(--duration) ease}}.im-c-popup-menu[data-focus-visible=true]::after{opacity:1}.im-c-popup-menu{background-color:var(--background-color);position:fixed;z-index:9999;list-style:none;margin:0;padding:0}.im-c-popup-menu[data-direction=below]{margin-top:var(--divider-gap)}.im-c-popup-menu[data-direction=above]{margin-bottom:var(--divider-gap)}.im-c-popup-menu[data-halign=center]{transform:translateX(-50%)}.im-c-popup-menu__item{display:flex;position:relative;align-items:center;padding:var(--divider-gap);border-top:1px solid var(--button-hover-color);text-align:left;cursor:pointer;min-width:var(--popup-menu-min-width);max-width:var(--popup-menu-max-width)}.im-c-popup-menu__item:first-child{border-top:0}@media(hover: hover)and (pointer: fine){.im-c-popup-menu__item:hover:not(.im-c-popup-menu__item--selected){background-color:var(--button-hover-color)}}.im-c-popup-menu__item:hover:not(.im-c-popup-menu__item--selected) .im-c-popup-menu__item-label{text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:2px;text-decoration-color:var(--foreground-color);text-decoration-skip-ink:none}.im-c-popup-menu__item--selected{background-color:var(--button-hover-color)}.im-c-popup-menu__item--selected .im-c-popup-menu__item-label{outline:3px solid rgba(0,0,0,0);color:var(--focus-border-color);background-color:var(--focus-outline-color);box-shadow:0 -2px var(--focus-outline-color),0 4px var(--focus-border-color);text-decoration:none}.im-c-popup-menu__item svg+span{margin-left:calc(var(--button-icon-label-offset) + 3px);white-space:nowrap}.im-c-popup-menu__item[aria-disabled=true] .im-c-popup-menu__item-label,.im-c-popup-menu__item[aria-disabled=true] svg{opacity:.5}.im-c-popup-menu__item[role=menuitemcheckbox]{padding-right:75px}.im-c-popup-menu__item[role=menuitemcheckbox]::before{content:"";position:absolute;border:1px solid var(--foreground-color);left:auto;top:12px;right:12px;width:20px;height:20px;opacity:.2}.im-c-popup-menu__item[role=menuitemcheckbox]::after{content:"";position:absolute;top:17px;left:auto;right:16px;width:12px;height:6.5px;border:solid;border-width:0 0 3px 3px;transform:rotate(-45deg);opacity:0}.im-c-popup-menu__item[role=menuitemcheckbox][aria-checked=true]::before{top:10px;right:10px;width:24px;height:24px;border-width:2px;opacity:1}.im-c-popup-menu__item[role=menuitemcheckbox][aria-checked=true]::after{opacity:1}.im-c-popup-menu__item[role=menuitemcheckbox]:hover::before,.im-c-popup-menu__item--selected[role=menuitemcheckbox]::before,.im-c-popup-menu__item--selected[role=menuitemcheckbox][aria-checked=true]::before{top:10px;right:10px;width:24px;height:24px;border-width:4px;outline:3px solid rgba(0,0,0,0);outline-offset:1px;box-shadow:0 0 0 3px #fd0;opacity:1}.im-c-attributions{color:var(--attributions-foreground-color);background-color:var(--attributions-background-color);padding:var(--attributions-padding);font-size:var(--attributions-font-size);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.im-c-logo{align-self:center;flex-shrink:0;height:auto;width:auto;user-select:none}.im-o-hints{position:absolute;bottom:var(--hint-bottom, var(--primary-gap));left:50%;transform:translateX(-50%);z-index:1001}.im-c-hints{display:flex;flex-direction:column;align-items:center;gap:var(--divider-gap)}.im-c-hints__hint{text-wrap:nowrap;color:var(--tooltip-foreground-color);background-color:var(--tooltip-background-color);border-radius:var(--tooltip-border-radius);padding:var(--tooltip-padding);font-size:var(--tooltip-font-size);line-height:1.2}.im-c-hints__hint kbd{border:var(--kbd-tooltip-border)}.im-c-cross-hair{position:absolute;top:0;left:0;pointer-events:none;margin:-19px 0 0 -19px}.im-c-cross-hair path{stroke-width:3;stroke:var(--map-overlay-halo-color);fill:var(--map-overlay-foreground-color);paint-order:stroke fill}.im-c-markers{position:absolute;top:0;left:0;pointer-events:none}.im-c-marker{position:absolute;left:0;top:0;pointer-events:none}.im-c-marker-wrapper{position:absolute;left:0;top:0;pointer-events:none}.im-c-marker__svg{display:block;pointer-events:none}.im-c-marker__label{position:absolute;bottom:100%;left:50%;transform:translateX(-50%);white-space:nowrap;pointer-events:none;color:var(--tooltip-foreground-color);background-color:var(--tooltip-background-color);border-radius:var(--tooltip-border-radius);padding:var(--tooltip-padding);font-size:var(--tooltip-font-size);line-height:1.2}.im-c-marker__label--standalone{bottom:0}.im-c-marker__label--standalone::after{content:"";position:absolute;top:calc(100% - 1px);left:50%;transform:translateX(-50%);border:calc(var(--tooltip-arrow-size) - 2px) solid rgba(0,0,0,0);border-top-color:var(--tooltip-background-color)}.im-c-features{position:absolute;inset:0;pointer-events:none;list-style:none;margin:0;padding:0;border:0;border-radius:0px}.im-c-features::before{content:"";pointer-events:none;position:absolute;top:0;left:0;height:100%;width:100%;border-radius:0px}.im-c-features:focus{outline:0}.im-c-features[data-focus-visible=true]{outline:3px solid rgba(0,0,0,0)}.im-c-features::after{content:"";pointer-events:none;position:absolute;z-index:99;top:var(--focus-border-width);right:var(--focus-border-width);bottom:var(--focus-border-width);left:var(--focus-border-width);border:var(--focus-border-width) solid var(--focus-border-color);outline:var(--focus-outline-width) solid var(--focus-outline-color);border-radius:-2px;opacity:0}@media(prefers-reduced-motion: no-preference){.im-c-features::after{transition:opacity var(--duration) ease}}.im-c-features[data-focus-visible=true]::after{opacity:1}.im-c-features[data-focus-visible=true][aria-activedescendant]::after{opacity:0}.im-c-features [role=option]{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.im-c-actions{position:relative;display:flex;flex-direction:row;justify-content:center;gap:calc(var(--divider-gap)/2);padding:var(--panel-margin);max-height:200px}.im-c-actions--border-top{border-top:1px solid var(--app-border-color)}.im-c-actions--hidden{max-height:0;padding-top:0;padding-bottom:0;border:0}.im-c-actions .im-c-button-wrapper--wide{display:flex;flex:1 1 0}.im-c-actions .im-c-map-button--primary,.im-c-actions .im-c-map-button--tertiary{width:100%}.im-o-app--tablet .im-c-actions,.im-o-app--desktop .im-c-actions{min-width:0}.im-c-open-map-button{font-family:-apple-system,blinkmacsystemfont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Fira Sans","Droid Sans","Helvetica Neue",sans-serif;display:inline-flex;text-decoration:none;border:1px solid #505a5f;white-space:nowrap;padding:10px}.im-c-open-map-button svg+span{padding-left:8px}.im-c-open-map-button span{color:#1d70b8}.im-c-open-map-button:hover{background-color:#f3f2f1}.im-c-open-map-button:active span{color:#0b0c0c}.im-c-open-map-button:focus{border-color:rgba(0,0,0,0);outline:3px solid rgba(0,0,0,0);color:#0b0c0c;background-color:#fd0;box-shadow:0 -2px #fd0,0 4px #0b0c0c;text-decoration:none}.im-c-open-map-button:focus span{color:#0b0c0c}.im-c-error{padding:15px;margin-bottom:30px;border:5px solid #b1b4b6}.im-is-loading{visibility:hidden}.im-has-js{position:fixed;overflow:hidden;top:0;right:0;bottom:0;left:0}.im-is-fullscreen{height:100%;overflow-y:visible;overscroll-behavior-y:none}.im-is-fullscreen body{position:fixed;overflow:hidden;top:0;right:0;bottom:0;left:0}.maplibregl-canvas-container canvas{image-rendering:pixelated;outline:0}.maplibregl-control-container{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.maplibregl-control-container *{pointer-events:auto}.maplibregl-symbols{display:none}.im-u-visually-hidden{position:absolute;width:1px;height:1px;margin:0;padding:0;overflow:hidden;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);border:0;white-space:nowrap}
package/docs/api/map-style-config.md CHANGED
@@ -13,18 +13,85 @@ Unique identifier for the style. Used to reference the style programmatically.
13
13
 
14
14
  ---
15
15
 
16
+ ### `type`
17
+ **Type:** `'raster' | 'ogc-vt'`
18
+
19
+ > [!NOTE]
20
+ > This property is only relevant when using the **OpenLayers provider**. The ESRI and MapLibre providers always use the standard Mapbox GL vector tile format and ignore this property.
21
+
22
+ Allows the OpenLayers provider to support raster, standard vector tile, and OGC API - Tiles basemaps. When omitted, OpenLayers uses the standard Mapbox GL vector tile path — the same format ESRI and MapLibre always use.
23
+
24
+ - `'raster'` — XYZ raster tile source. `url` should be a tile URL template with `{x}`, `{y}`, `{z}` placeholders.
25
+ - `'ogc-vt'` — OGC API - Tiles vector tile source. `url` should point to an OGC style endpoint that returns a Mapbox GL style document.
26
+
27
+ ---
28
+
29
+ ### `renderMode`
30
+ **Type:** `'hybrid' | 'vector'`
31
+
32
+ > [!NOTE]
33
+ > This property is only relevant when using the **OpenLayers provider** with vector tile styles (standard or `'ogc-vt'`). It is ignored for raster styles and by other providers.
34
+
35
+ Sets the render mode on the OpenLayers `VectorTileLayer`. When omitted, OpenLayers defaults to `'hybrid'`.
36
+
37
+ - `'hybrid'` (default) — polygon and line elements are rendered as images, so pixels are scaled during zoom animations. Point symbols and texts are accurately rendered as vectors and can stay upright on rotated views, but get lifted above all polygon and line elements.
38
+ - `'vector'` — everything is rendered as vectors and the original render order is maintained. Use this mode for improved performance and visual experience on vector tile layers with not too many rendered features (e.g. for highlighting a subset of features of another layer with the same source).
39
+
40
+ ```js
41
+ // Standard vector tile
42
+ {
43
+ id: 'outdoor',
44
+ url: 'https://raw.githubusercontent.com/OrdnanceSurvey/OS-Vector-Tile-API-Stylesheets/main/OS_VTS_27700_Outdoor.json',
45
+ renderMode: 'vector'
46
+ }
47
+
48
+ // OGC vector tile
49
+ {
50
+ id: 'outdoor-ngd',
51
+ type: 'ogc-vt',
52
+ url: 'https://api.os.uk/maps/vector/ngd/ota/v1/collections/ngd-base/styles/27700?key=YOUR_API_KEY',
53
+ renderMode: 'vector'
54
+ }
55
+ ```
56
+
57
+ ---
58
+
16
59
  ### `url`
17
60
  **Type:** `string`
18
61
  **Required**
19
62
 
20
- URL to the style.json (Mapbox Style Specification).
63
+ URL that returns a Mapbox GL style document (Mapbox Style Specification).
64
+
65
+ ```js
66
+ // OS Vector Tile API — Outdoor (EPSG:27700)
67
+ {
68
+ url: 'https://raw.githubusercontent.com/OrdnanceSurvey/OS-Vector-Tile-API-Stylesheets/main/OS_VTS_27700_Outdoor.json'
69
+ }
70
+ ```
71
+
72
+ > [!NOTE]
73
+ > The **OpenLayers provider** supports two additional URL forms via the `type` property.
74
+ >
75
+ > ```js
76
+ > // type 'ogc-vt' — OS NGD OGC API - Tiles, Outdoor (EPSG:27700)
77
+ > {
78
+ > type: 'ogc-vt',
79
+ > url: 'https://api.os.uk/maps/vector/ngd/ota/v1/collections/ngd-base/styles/27700?key=YOUR_API_KEY'
80
+ > }
81
+ >
82
+ > // type 'raster' — OS Maps API, Raster Outdoor (EPSG:27700)
83
+ > {
84
+ > type: 'raster',
85
+ > url: 'https://api.os.uk/maps/raster/v1/zxy/Outdoor_27700/{z}/{x}/{y}.png?key=YOUR_API_KEY'
86
+ > }
87
+ > ```
21
88
 
22
89
  ---
23
90
 
24
91
  ### `label`
25
92
  **Type:** `string`
26
93
 
27
- Display label for the style. Shown in style switcher UI.
94
+ Display label for the style.
28
95
 
29
96
  ---
30
97
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@defra/interactive-map",
3
- "version": "0.0.24-alpha",
3
+ "version": "0.0.26-alpha",
4
4
  "description": "An accessible map component",
5
5
  "repository": {
6
6
  "type": "git",
@@ -137,8 +137,6 @@
137
137
  },
138
138
  "devDependencies": {
139
139
  "@arcgis/core": "^5.0.9",
140
- "ol": "^10.9.0",
141
- "proj4": "^2.20.8",
142
140
  "@babel/core": "^7.28.0",
143
141
  "@babel/plugin-transform-runtime": "^7.29.0",
144
142
  "@babel/preset-env": "^7.28.0",
@@ -180,6 +178,9 @@
180
178
  "mini-css-extract-plugin": "^2.9.2",
181
179
  "node-fetch": "^3.3.2",
182
180
  "npm-run-all": "^4.1.5",
181
+ "ol": "^10.9.0",
182
+ "ol-mapbox-style": "^13.4.1",
183
+ "proj4": "^2.20.8",
183
184
  "react": "^19.2.4",
184
185
  "react-dom": "^19.2.4",
185
186
  "remove-files-webpack-plugin": "^1.5.0",
package/plugins/beta/draw-ml/dist/css/index.css CHANGED
@@ -1 +1,21 @@
1
- .touch-vertex-target circle{fill:var(--map-overlay-foreground-color)}.touch-vertex-target path{fill:var(--map-overlay-halo-color)}.im-c-actions .im-c-button-wrapper--draw-done,.im-c-actions .im-c-button-wrapper--draw-menu,.im-c-actions .im-c-button-wrapper--draw-cancel{width:33.33%}.im-o-app--tablet .im-c-actions .im-c-button-wrapper--draw-done,.im-o-app--tablet .im-c-actions .im-c-button-wrapper--draw-menu,.im-o-app--tablet .im-c-actions .im-c-button-wrapper--draw-cancel,.im-o-app--desktop .im-c-actions .im-c-button-wrapper--draw-done,.im-o-app--desktop .im-c-actions .im-c-button-wrapper--draw-menu,.im-o-app--desktop .im-c-actions .im-c-button-wrapper--draw-cancel{width:100px}
1
+ .touch-vertex-target circle {
2
+ fill: var(--map-overlay-foreground-color);
3
+ }
4
+ .touch-vertex-target path {
5
+ fill: var(--map-overlay-halo-color);
6
+ }
7
+
8
+ .im-c-actions .im-c-button-wrapper--draw-done,
9
+ .im-c-actions .im-c-button-wrapper--draw-menu,
10
+ .im-c-actions .im-c-button-wrapper--draw-cancel {
11
+ width: 33.33%;
12
+ }
13
+
14
+ .im-o-app--tablet .im-c-actions .im-c-button-wrapper--draw-done,
15
+ .im-o-app--tablet .im-c-actions .im-c-button-wrapper--draw-menu,
16
+ .im-o-app--tablet .im-c-actions .im-c-button-wrapper--draw-cancel,
17
+ .im-o-app--desktop .im-c-actions .im-c-button-wrapper--draw-done,
18
+ .im-o-app--desktop .im-c-actions .im-c-button-wrapper--draw-menu,
19
+ .im-o-app--desktop .im-c-actions .im-c-button-wrapper--draw-cancel {
20
+ width: 100px;
21
+ }
package/plugins/beta/scale-bar/dist/css/index.css CHANGED
@@ -1 +1,31 @@
1
- .im-c-scale-bar{position:relative;margin-left:auto;margin-bottom:1px;text-align:right;padding-bottom:5px;color:var(--map-overlay-foreground-color);user-select:none;height:25px;width:100px}.im-c-scale-bar__label{text-shadow:-1px -1px 0 var(--map-overlay-halo-color),1px -1px 0 var(--map-overlay-halo-color),-1px 1px 0 var(--map-overlay-halo-color),1px 1px 0 var(--map-overlay-halo-color)}.im-c-scale-bar::after{content:"";position:absolute;bottom:0;left:0;height:4px;width:100%;background-color:var(--map-overlay-foreground-color);box-shadow:-1px -1px 0 var(--map-overlay-halo-color),1px -1px 0 var(--map-overlay-halo-color),-1px 1px 0 var(--map-overlay-halo-color),1px 1px 0 var(--map-overlay-halo-color)}@media(forced-colors: active){.im-c-scale-bar::after{background-color:Canvas}}
1
+ .im-c-scale-bar {
2
+ position: relative;
3
+ margin-left: auto;
4
+ margin-bottom: 1px;
5
+ text-align: right;
6
+ padding-bottom: 5px;
7
+ color: var(--map-overlay-foreground-color);
8
+ user-select: none;
9
+ height: 25px;
10
+ width: 100px;
11
+ }
12
+
13
+ .im-c-scale-bar__label {
14
+ text-shadow: -1px -1px 0 var(--map-overlay-halo-color), 1px -1px 0 var(--map-overlay-halo-color), -1px 1px 0 var(--map-overlay-halo-color), 1px 1px 0 var(--map-overlay-halo-color);
15
+ }
16
+
17
+ .im-c-scale-bar::after {
18
+ content: "";
19
+ position: absolute;
20
+ bottom: 0;
21
+ left: 0;
22
+ height: 4px;
23
+ width: 100%;
24
+ background-color: var(--map-overlay-foreground-color);
25
+ box-shadow: -1px -1px 0 var(--map-overlay-halo-color), 1px -1px 0 var(--map-overlay-halo-color), -1px 1px 0 var(--map-overlay-halo-color), 1px 1px 0 var(--map-overlay-halo-color);
26
+ }
27
+ @media (forced-colors: active) {
28
+ .im-c-scale-bar::after {
29
+ background-color: Canvas;
30
+ }
31
+ }
package/plugins/search/dist/css/index.css CHANGED
@@ -1 +1,250 @@
1
- .im-c-search-form{display:none;padding:0;min-height:auto;border-radius:0}.im-c-search-form:before{border-radius:0;box-shadow:none}.im-o-app--mobile .im-c-search-form{position:absolute;left:0;top:0;right:0;height:auto;overflow:visible;filter:var(--search-drop-shadow)}.im-o-app--tablet .im-c-search-form,.im-o-app--desktop .im-c-search-form{position:relative;overflow:visible;border-radius:var(--button-border-radius);box-shadow:none;filter:var(--search-drop-shadow)}.im-o-app--tablet .im-c-search-form:before,.im-o-app--desktop .im-c-search-form:before{border-radius:var(--button-border-radius)}.im-o-app--tablet .im-c-search-form .im-c-search-suggestions,.im-o-app--desktop .im-c-search-form .im-c-search-suggestions{position:absolute;top:calc(100% + 1px);left:0;right:0;z-index:1}.im-c-search__status{position:absolute;top:100%;left:0;right:0;padding:var(--divider-gap) calc(var(--divider-gap) + 2px);background-color:var(--background-color);border-top:1px solid var(--button-hover-color);border-bottom-left-radius:var(--button-border-radius);border-bottom-right-radius:var(--button-border-radius)}.im-o-app--mobile .im-c-search-form--default-expanded{position:relative;margin:calc(-1*var(--primary-gap)) calc(-1*var(--primary-gap)) 0}.im-o-app--mobile .im-c-search-form--default-expanded .im-c-search-suggestions{position:absolute;top:100%;width:100%;left:0}.im-c-search-open-button{position:relative}.im-c-search-close-button{position:relative}.im-c-search-close-button:before{box-shadow:none}.im-c-search-close-button[data-focus-visible=true]{z-index:1}.im-c-search-submit-button:before{box-shadow:none}.im-c-search-submit-button[data-focus-visible=true]{z-index:1}.im-c-search-suggestions{max-height:calc(100vh - 66px);overflow-y:auto;scroll-padding:0;margin:0;padding:0;background-color:var(--background-color);list-style:none}.im-c-search-suggestions__item{margin:0;padding:calc(var(--divider-gap) + 2px) var(--primary-gap);position:relative;color:var(--secondary-text-color);border-top:1px solid var(--button-hover-color);cursor:pointer}.im-c-search-suggestions__item mark{font-weight:bold;color:var(--foreground-color);background-color:rgba(0,0,0,0);pointer-events:none}@media(hover: hover)and (pointer: fine){.im-c-search-suggestions__item:hover:not([aria-selected=true]){background-color:var(--button-hover-color)}}.im-c-search-suggestions__item[aria-selected=true]{background-color:var(--button-hover-color)}.im-c-search-suggestions__item[aria-selected=true] mark{color:var(--fixed-foreground-color)}.im-c-search-suggestions__item:hover:not([aria-selected=true]) .im-c-search-suggestions__label{text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:2px;text-decoration-color:var(--foreground-color);text-decoration-skip-ink:none}.im-c-search-suggestions__item[aria-selected=true] .im-c-search-suggestions__label{outline:3px solid rgba(0,0,0,0);color:var(--focus-border-color);background-color:var(--focus-outline-color);box-shadow:0 -2px var(--focus-outline-color),0 4px var(--focus-border-color);text-decoration:none}.im-c-search-suggestions__label{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.im-o-app--mobile .im-c-search-form--default-expanded .im-c-search-suggestions{box-shadow:var(--panel-box-shadow);clip-path:inset(0px 0px -20px 0px)}.im-o-app--tablet .im-c-search-suggestions,.im-o-app--desktop .im-c-search-suggestions{border-bottom-left-radius:var(--button-border-radius);border-bottom-right-radius:var(--button-border-radius)}.im-o-app--tablet .im-c-search-suggestions__item,.im-o-app--desktop .im-c-search-suggestions__item{padding:var(--divider-gap) calc(var(--divider-gap) + 2px)}:root{--search-drop-shadow: drop-shadow(0 -2px 20px rgba(0,0,0,.1)) drop-shadow(0 0 12px rgba(0,0,0,.1))}.im-c-search__input-container{display:flex;position:relative;flex:1 1 auto;min-height:auto;height:var(--button-size)}.im-c-search__input-container:before{content:"";z-index:1;position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;border-radius:var(--button-border-radius);border:2px solid var(--foreground-color);pointer-events:none}.im-c-search__input-container:after{position:absolute;content:"";pointer-events:none;z-index:99;top:-1px;right:-1px;bottom:-1px;left:-1px;border:var(--focus-border-width) solid var(--focus-border-color);outline:var(--focus-outline-width) solid var(--focus-outline-color);border-radius:calc(var(--button-border-radius) - 2px);opacity:0}@media(prefers-reduced-motion: no-preference){.im-c-search__input-container:after{transition:opacity var(--duration) ease}}.im-o-app .im-c-search__input{width:100%;color:var(--foreground-color);background-color:rgba(0,0,0,0);font-size:1rem;border:0;padding:var(--divider-gap) calc(var(--divider-gap) + 2px);outline:0}.im-o-app .im-c-search__input:focus{outline:3px solid rgba(0,0,0,0);box-shadow:none}.im-o-app .im-c-search__input::placeholder{color:var(--foreground-color)}.im-o-app .im-c-search__input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;display:none}.im-o-app .im-c-search__input::-moz-search-clear{display:none}.im-c-search__hint{display:none}.im-o-app--exclusive-control .im-o-app__top .im-c-button-wrapper,.im-o-app--exclusive-control .im-o-app__right .im-c-button-wrapper{opacity:0;z-index:-1}.im-o-app--exclusive-control .im-o-app__left-top .im-c-panel,.im-o-app--exclusive-control .im-o-app__left-bottom .im-c-panel,.im-o-app--exclusive-control .im-o-app__right-top .im-c-panel,.im-o-app--exclusive-control .im-o-app__right-bottom .im-c-panel{opacity:0;z-index:-1}.im-o-app--mobile .im-c-search__input-container{margin:var(--primary-gap)}.im-c-search__input-container--keyboard-focus-within:after{opacity:1}
1
+ .im-c-search-form {
2
+ display: none;
3
+ padding: 0;
4
+ min-height: auto;
5
+ border-radius: 0;
6
+ }
7
+ .im-c-search-form:before {
8
+ border-radius: 0;
9
+ box-shadow: none;
10
+ }
11
+
12
+ .im-o-app--mobile .im-c-search-form {
13
+ position: absolute;
14
+ left: 0;
15
+ top: 0;
16
+ right: 0;
17
+ height: auto;
18
+ overflow: visible;
19
+ filter: var(--search-drop-shadow);
20
+ }
21
+
22
+ .im-o-app--tablet .im-c-search-form,
23
+ .im-o-app--desktop .im-c-search-form {
24
+ position: relative;
25
+ overflow: visible;
26
+ border-radius: var(--button-border-radius);
27
+ box-shadow: none;
28
+ filter: var(--search-drop-shadow);
29
+ }
30
+ .im-o-app--tablet .im-c-search-form:before,
31
+ .im-o-app--desktop .im-c-search-form:before {
32
+ border-radius: var(--button-border-radius);
33
+ }
34
+ .im-o-app--tablet .im-c-search-form .im-c-search-suggestions,
35
+ .im-o-app--desktop .im-c-search-form .im-c-search-suggestions {
36
+ position: absolute;
37
+ top: calc(100% + 1px);
38
+ left: 0;
39
+ right: 0;
40
+ z-index: 1;
41
+ }
42
+
43
+ .im-c-search__status {
44
+ position: absolute;
45
+ top: 100%;
46
+ left: 0;
47
+ right: 0;
48
+ padding: var(--divider-gap) calc(var(--divider-gap) + 2px);
49
+ background-color: var(--background-color);
50
+ border-top: 1px solid var(--button-hover-color);
51
+ border-bottom-left-radius: var(--button-border-radius);
52
+ border-bottom-right-radius: var(--button-border-radius);
53
+ }
54
+
55
+ .im-o-app--mobile .im-c-search-form--default-expanded {
56
+ position: relative;
57
+ margin: calc(-1 * var(--primary-gap)) calc(-1 * var(--primary-gap)) 0;
58
+ }
59
+ .im-o-app--mobile .im-c-search-form--default-expanded .im-c-search-suggestions {
60
+ position: absolute;
61
+ top: 100%;
62
+ width: 100%;
63
+ left: 0;
64
+ }
65
+
66
+ .im-c-search-open-button {
67
+ position: relative;
68
+ }
69
+
70
+ .im-c-search-close-button {
71
+ position: relative;
72
+ }
73
+ .im-c-search-close-button:before {
74
+ box-shadow: none;
75
+ }
76
+ .im-c-search-close-button[data-focus-visible=true] {
77
+ z-index: 1;
78
+ }
79
+
80
+ .im-c-search-submit-button:before {
81
+ box-shadow: none;
82
+ }
83
+ .im-c-search-submit-button[data-focus-visible=true] {
84
+ z-index: 1;
85
+ }
86
+
87
+ .im-c-search-suggestions {
88
+ max-height: calc(100vh - 66px);
89
+ overflow-y: auto;
90
+ scroll-padding: 0;
91
+ margin: 0;
92
+ padding: 0;
93
+ background-color: var(--background-color);
94
+ list-style: none;
95
+ }
96
+
97
+ .im-c-search-suggestions__item {
98
+ margin: 0;
99
+ padding: calc(var(--divider-gap) + 2px) var(--primary-gap);
100
+ position: relative;
101
+ color: var(--secondary-text-color);
102
+ border-top: 1px solid var(--button-hover-color);
103
+ cursor: pointer;
104
+ }
105
+ .im-c-search-suggestions__item mark {
106
+ font-weight: bold;
107
+ color: var(--foreground-color);
108
+ background-color: transparent;
109
+ pointer-events: none;
110
+ }
111
+ @media (hover: hover) and (pointer: fine) {
112
+ .im-c-search-suggestions__item:hover:not([aria-selected=true]) {
113
+ background-color: var(--button-hover-color);
114
+ }
115
+ }
116
+ .im-c-search-suggestions__item[aria-selected=true] {
117
+ background-color: var(--button-hover-color);
118
+ }
119
+ .im-c-search-suggestions__item[aria-selected=true] mark {
120
+ color: var(--fixed-foreground-color);
121
+ }
122
+ .im-c-search-suggestions__item:hover:not([aria-selected=true]) .im-c-search-suggestions__label {
123
+ text-decoration: underline;
124
+ text-underline-offset: 2px;
125
+ text-decoration-thickness: 2px;
126
+ text-decoration-color: var(--foreground-color);
127
+ text-decoration-skip-ink: none;
128
+ }
129
+ .im-c-search-suggestions__item[aria-selected=true] .im-c-search-suggestions__label {
130
+ outline: 3px solid rgba(0, 0, 0, 0);
131
+ color: var(--focus-border-color);
132
+ background-color: var(--focus-outline-color);
133
+ box-shadow: 0 -2px var(--focus-outline-color), 0 4px var(--focus-border-color);
134
+ text-decoration: none;
135
+ }
136
+
137
+ .im-c-search-suggestions__label {
138
+ display: block;
139
+ overflow: hidden;
140
+ white-space: nowrap;
141
+ text-overflow: ellipsis;
142
+ }
143
+
144
+ .im-o-app--mobile .im-c-search-form--default-expanded .im-c-search-suggestions {
145
+ box-shadow: var(--panel-box-shadow);
146
+ clip-path: inset(0px 0px -20px 0px);
147
+ }
148
+
149
+ .im-o-app--tablet .im-c-search-suggestions,
150
+ .im-o-app--desktop .im-c-search-suggestions {
151
+ border-bottom-left-radius: var(--button-border-radius);
152
+ border-bottom-right-radius: var(--button-border-radius);
153
+ }
154
+ .im-o-app--tablet .im-c-search-suggestions__item,
155
+ .im-o-app--desktop .im-c-search-suggestions__item {
156
+ padding: var(--divider-gap) calc(var(--divider-gap) + 2px);
157
+ }
158
+
159
+ :root {
160
+ --search-drop-shadow: drop-shadow(0 -2px 20px rgba(0,0,0,.1)) drop-shadow(0 0 12px rgba(0,0,0,.1));
161
+ }
162
+
163
+ .im-c-search__input-container {
164
+ display: flex;
165
+ position: relative;
166
+ flex: 1 1 auto;
167
+ min-height: auto;
168
+ height: var(--button-size);
169
+ }
170
+ .im-c-search__input-container:before {
171
+ content: "";
172
+ z-index: 1;
173
+ position: absolute;
174
+ top: -1px;
175
+ right: -1px;
176
+ bottom: -1px;
177
+ left: -1px;
178
+ border-radius: var(--button-border-radius);
179
+ border: 2px solid var(--foreground-color);
180
+ pointer-events: none;
181
+ }
182
+ .im-c-search__input-container:after {
183
+ position: absolute;
184
+ content: "";
185
+ pointer-events: none;
186
+ z-index: 99;
187
+ top: -1px;
188
+ right: -1px;
189
+ bottom: -1px;
190
+ left: -1px;
191
+ border: var(--focus-border-width) solid var(--focus-border-color);
192
+ outline: var(--focus-outline-width) solid var(--focus-outline-color);
193
+ border-radius: calc(var(--button-border-radius) - 2px);
194
+ opacity: 0;
195
+ }
196
+ @media (prefers-reduced-motion: no-preference) {
197
+ .im-c-search__input-container:after {
198
+ transition: opacity var(--duration) ease;
199
+ }
200
+ }
201
+
202
+ .im-o-app .im-c-search__input {
203
+ width: 100%;
204
+ color: var(--foreground-color);
205
+ background-color: transparent;
206
+ font-size: 1rem;
207
+ border: 0;
208
+ padding: var(--divider-gap) calc(var(--divider-gap) + 2px);
209
+ outline: 0;
210
+ }
211
+ .im-o-app .im-c-search__input:focus {
212
+ outline: 3px solid transparent;
213
+ box-shadow: none;
214
+ }
215
+ .im-o-app .im-c-search__input::placeholder {
216
+ color: var(--foreground-color);
217
+ }
218
+ .im-o-app .im-c-search__input::-webkit-search-cancel-button {
219
+ -webkit-appearance: none;
220
+ appearance: none;
221
+ display: none;
222
+ }
223
+ .im-o-app .im-c-search__input::-moz-search-clear {
224
+ display: none;
225
+ }
226
+
227
+ .im-c-search__hint {
228
+ display: none;
229
+ }
230
+
231
+ .im-o-app--exclusive-control .im-o-app__top .im-c-button-wrapper,
232
+ .im-o-app--exclusive-control .im-o-app__right .im-c-button-wrapper {
233
+ opacity: 0;
234
+ z-index: -1;
235
+ }
236
+ .im-o-app--exclusive-control .im-o-app__left-top .im-c-panel,
237
+ .im-o-app--exclusive-control .im-o-app__left-bottom .im-c-panel,
238
+ .im-o-app--exclusive-control .im-o-app__right-top .im-c-panel,
239
+ .im-o-app--exclusive-control .im-o-app__right-bottom .im-c-panel {
240
+ opacity: 0;
241
+ z-index: -1;
242
+ }
243
+
244
+ .im-o-app--mobile .im-c-search__input-container {
245
+ margin: var(--primary-gap);
246
+ }
247
+
248
+ .im-c-search__input-container--keyboard-focus-within:after {
249
+ opacity: 1;
250
+ }