@defra/interactive-map 0.0.41-alpha → 0.0.42-alpha

package/plugins/map-key/dist/umd/im-map-key-plugin.js

@@ -1,2 +1,2 @@
 /*! For license information please see im-map-key-plugin.js.LICENSE.txt */
-"use strict";(this.webpackChunkdefra_DefraMap=this.webpackChunkdefra_DefraMap||[]).push([[414],{374(t,r,e){e.r(r),e.d(r,{manifest:()=>Vt});var n=e(738),o=null,i=function(t){return o=t},a=e(287),l=function(t){var r=t.text;return(0,a.jsx)("div",{className:"im-c-map-key",children:(0,a.jsx)("p",{className:"im-c-map-key__empty-message",children:r})})};function u(t){return u="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},u(t)}var c=function(t,r){if(!t)return null;if("string"==typeof t)return t.trim();if("object"===u(t)){if(r&&t[r])return t[r];var e=Object.values(t)[0];return null!=e?e:null}return null};function f(t){return f="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},f(t)}function s(t,r){var e=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);r&&(n=n.filter(function(r){return Object.getOwnPropertyDescriptor(t,r).enumerable})),e.push.apply(e,n)}return e}function y(t){for(var r=1;r<arguments.length;r++){var e=null!=arguments[r]?arguments[r]:{};r%2?s(Object(e),!0).forEach(function(r){m(t,r,e[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(e)):s(Object(e)).forEach(function(r){Object.defineProperty(t,r,Object.getOwnPropertyDescriptor(e,r))})}return t}function m(t,r,e){return(r=function(t){var r=function(t){if("object"!=f(t)||!t)return t;var r=t[Symbol.toPrimitive];if(void 0!==r){var e=r.call(t,"string");if("object"!=f(e))return e;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(t)}(t);return"symbol"==f(r)?r:r+""}(r))in t?Object.defineProperty(t,r,{value:e,enumerable:!0,configurable:!0,writable:!0}):t[r]=e,t}var p=20,b={xmlns:"http://www.w3.org/2000/svg",width:p,height:p,viewBox:"0 0 ".concat(p," ").concat(p),className:"am-c-map-key-symbol","aria-hidden":"true",focusable:"false"},v=y(y({},b),{},{width:44,height:44,className:"am-c-map-key-symbol am-c-map-key-symbol--point"}),d={"cross-hatch":'<path d="M0 4.486V3.485h3.5V.001h1v3.484h7.002V.001h1v3.484h3.5v1.001h-3.5v7h3.5v.999h-3.5v3.516h-1v-3.516H4.499v3.516h-1v-3.516H0v-.999h3.5v-7H0zm11.501 0H4.499v7h7.002v-7z" fill="{{foregroundColor}}"/>',"diagonal-cross-hatch":'<path d="M0 8.707V7.293L7.293 0h1.414L16 7.293v1.414L8.707 16H7.293L0 8.707zM.707 8L8 15.293 15.293 8 8 .707.707 8z" fill="{{foregroundColor}}"/>',"forward-diagonal-hatch":'<path d="M16 8.707V7.293L7.293 16h1.414L16 8.707zm-16 0L8.707 0H7.293L0 7.293v1.414z" fill="{{foregroundColor}}"/>',"backward-diagonal-hatch":'<path d="M0 8.707V7.293L8.707 16H7.293L0 8.707zm16 0L7.293 0h1.414L16 7.293v1.414z" fill="{{foregroundColor}}"/>',"horizontal-hatch":'<path d="M0 4.5V3.499h15.999V4.5H0zm0 7h15.999V12.5H0v-1.001z" fill="{{foregroundColor}}"/>',"vertical-hatch":'<path d="M3.501 16.001V0h1v16.001h-1zm7.998 0V0h1v16.001h-1z" fill="{{foregroundColor}}"/>',dot:'<path d="M3.999 2A2 2 0 0 1 6 3.999C6 5.103 5.103 6 3.999 6a2 2 0 0 1-1.999-2.001A2 2 0 0 1 3.999 2zm0 7.999C5.103 10 6 10.897 6 12.001A2 2 0 0 1 3.999 14a2 2 0 0 1-1.999-1.999A2 2 0 0 1 3.999 10zM11.999 2A2 2 0 0 1 14 3.999C14 5.103 13.103 6 11.999 6S10 5.103 10 3.999A2 2 0 0 1 11.999 2zm0 7.999c1.104 0 2.001.897 2.001 2.001A2 2 0 0 1 11.999 14 2 2 0 0 1 10 12.001c0-1.104.897-2.001 1.999-2.001z" fill="{{foregroundColor}}"/>',diamond:'<path d="M4 .465L7.535 4 4 7.535.465 4 4 .465zm0 7.999l3.535 3.535L4 15.535.465 11.999 4 8.464zm8-8l3.535 3.535-3.536 3.536L8.464 4 12 .464zm0 8.001L15.536 12 12 15.536 8.465 12 12 8.465z" fill="{{foregroundColor}}"/>'};function h(t,r){(null==r||r>t.length)&&(r=t.length);for(var e=0,n=Array(r);e<r;e++)n[e]=t[e];return n}var g=function(t,r,e){return t.replace(/\{\{foregroundColor\}\}/g,r||"black").replace(/\{\{backgroundColor\}\}/g,e||"transparent")};function S(t,r){if(t){if("string"==typeof t)return j(t,r);var e={}.toString.call(t).slice(8,-1);return"Object"===e&&t.constructor&&(e=t.constructor.name),"Map"===e||"Set"===e?Array.from(t):"Arguments"===e||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(e)?j(t,r):void 0}}function j(t,r){(null==r||r>t.length)&&(r=t.length);for(var e=0,n=Array(r);e<r;e++)n[e]=t[e];return n}var O=new Map,w={register:function(t,r){O.set(t,{id:t,svgContent:r})},get:function(t){return O.get(t)},list:function(){return function(t){if(Array.isArray(t))return j(t)}(t=O.values())||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(t)||S(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}();var t},clear:function(){O.clear()},initialise:function(){var t=this;Object.entries(d).forEach(function(r){var e,n,o=(n=2,function(t){if(Array.isArray(t))return t}(e=r)||function(t,r){var e=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=e){var n,o,i,a,l=[],u=!0,c=!1;try{if(i=(e=e.call(t)).next,0===r){if(Object(e)!==e)return;u=!1}else for(;!(u=(n=i.call(e)).done)&&(l.push(n.value),l.length!==r);u=!0);}catch(t){c=!0,o=t}finally{try{if(!u&&null!=e.return&&(a=e.return(),Object(a)!==a))return}finally{if(c)throw o}}return l}}(e,n)||S(e,n)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()),i=o[0],a=o[1];t.register(i,a)})},getPatternInnerContent:function(t){return t.fillPatternSvgContent?t.fillPatternSvgContent:t.fillPattern&&null!==(r=null===(e=this.get(t.fillPattern))||void 0===e?void 0:e.svgContent)&&void 0!==r?r:null;var r,e},getKeyPatternPaths:function(t,r){var e=this.getPatternInnerContent(t);if(!e)return null;var n=c(t.fillPatternForegroundColor,r)||"black",o=c(t.fillPatternBackgroundColor,r)||"transparent",i=c(t.stroke,r)||n;return{border:g('<path d="M19 2.862v14.275c0 1.028-.835 1.862-1.862 1.862H2.863c-1.028 0-1.862-.835-1.862-1.862V2.862C1.001 1.834 1.836 1 2.863 1h14.275C18.166 1 19 1.835 19 2.862z" fill="{{backgroundColor}}" stroke="{{foregroundColor}}" stroke-width="2"/>',i,o),content:g(e,n,o)}},getPatternImageId:function(t,r){var e=arguments.length>2&&void 0!==arguments[2]?arguments[2]:1,n=this.getPatternInnerContent(t);if(!n)return null;var o=c(t.fillPatternForegroundColor,r)||"black",i=c(t.fillPatternBackgroundColor,r)||"transparent",a=function(t){return Math.max(2,2*t)}(e);return"pattern-".concat(function(t){var r,e=0,n=function(t,r){var e="undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(!e){if(Array.isArray(t)||(e=function(t,r){if(t){if("string"==typeof t)return h(t,r);var e={}.toString.call(t).slice(8,-1);return"Object"===e&&t.constructor&&(e=t.constructor.name),"Map"===e||"Set"===e?Array.from(t):"Arguments"===e||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(e)?h(t,r):void 0}}(t))||r&&t&&"number"==typeof t.length){e&&(t=e);var n=0,o=function(){};return{s:o,n:function(){return n>=t.length?{done:!0}:{done:!1,value:t[n++]}},e:function(t){throw t},f:o}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var i,a=!0,l=!1;return{s:function(){e=e.call(t)},n:function(){var t=e.next();return a=t.done,t},e:function(t){l=!0,i=t},f:function(){try{a||null==e.return||e.return()}finally{if(l)throw i}}}}(t);try{for(n.s();!(r=n.n()).done;){var o=r.value;e=Math.trunc((e<<5)-e+o.codePointAt(0))}}catch(t){n.e(t)}finally{n.f()}return Math.abs(e).toString(36)}(n+o+i),"-").concat(a,"x")}};function k(t){return k="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},k(t)}function C(t,r){var e=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);r&&(n=n.filter(function(r){return Object.getOwnPropertyDescriptor(t,r).enumerable})),e.push.apply(e,n)}return e}function P(t){for(var r=1;r<arguments.length;r++){var e=null!=arguments[r]?arguments[r]:{};r%2?C(Object(e),!0).forEach(function(r){A(t,r,e[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(e)):C(Object(e)).forEach(function(r){Object.defineProperty(t,r,Object.getOwnPropertyDescriptor(e,r))})}return t}function A(t,r,e){return(r=function(t){var r=function(t){if("object"!=k(t)||!t)return t;var r=t[Symbol.toPrimitive];if(void 0!==r){var e=r.call(t,"string");if("object"!=k(e))return e;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(t)}(t);return"symbol"==k(r)?r:r+""}(r))in t?Object.defineProperty(t,r,{value:e,enumerable:!0,configurable:!0,writable:!0}):t[r]=e,t}function x(t,r){(null==r||r>t.length)&&(r=t.length);for(var e=0,n=Array(r);e<r;e++)n[e]=t[e];return n}w.initialise();var I=function(t){var r,e,o=t.keyDefinition,i=t.mapStyle,l=(r=(0,n.useState)(null),e=2,function(t){if(Array.isArray(t))return t}(r)||function(t,r){var e=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=e){var n,o,i,a,l=[],u=!0,c=!1;try{if(i=(e=e.call(t)).next,0===r){if(Object(e)!==e)return;u=!1}else for(;!(u=(n=i.call(e)).done)&&(l.push(n.value),l.length!==r);u=!0);}catch(t){c=!0,o=t}finally{try{if(!u&&null!=e.return&&(a=e.return(),Object(a)!==a))return}finally{if(c)throw o}}return l}}(r,e)||function(t,r){if(t){if("string"==typeof t)return x(t,r);var e={}.toString.call(t).slice(8,-1);return"Object"===e&&t.constructor&&(e=t.constructor.name),"Map"===e||"Set"===e?Array.from(t):"Arguments"===e||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(e)?x(t,r):void 0}}(r,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()),u=l[0],c=l[1];return(0,n.useEffect)(function(){var t=o.style;c(w.getKeyPatternPaths(t,i.id))},[i.id,o]),u?(0,a.jsxs)("svg",P(P({},b),{},{children:[(0,a.jsx)("g",{dangerouslySetInnerHTML:{__html:u.border}}),(0,a.jsx)("g",{transform:"translate(".concat(2,", ").concat(2,")"),dangerouslySetInnerHTML:{__html:u.content}})]})):null},D=new Set(["symbolBackgroundColor","symbolForegroundColor","symbolHaloWidth","symbolGraphic"]),M=function(t){if(!function(t){return!(!t.symbol&&!t.symbolSvgContent)}(t))return{};var r={};return D.forEach(function(e){if(null!=t[e]){var n=e.charAt(6).toLowerCase()+e.slice(7);r[n]=t[e]}}),r},E=function(t,r){var e;return t.symbolViewBox?t.symbolViewBox:null!==(e=null==r?void 0:r.viewBox)&&void 0!==e?e:"0 0 38 38"},T={symbol:"pin",backgroundColor:"#ca3535",foregroundColor:"#ffffff"},L={dot:"M8 3c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.241 5-5-2.24-5-5-5z",cross:"M6 3H10V6H13V10H10V13H6V10H3V6H6Z",diamond:"M8 2L14 8L8 14L2 8Z",triangle:"M8 2L14 14H2Z",square:"M3 3H13V13H3Z"},z={id:"pin",viewBox:"0 0 44 44",anchor:[.5,.9],graphic:L.dot,svg:'<path d="M22 40.999c-3.621 0-8.306-5.864-10.258-8.3C9.02 29.302 6 23.66 6 19.002a16.01 16.01 0 0 1 16-16 16.01 16.01 0 0 1 16 16c0 4.658-3.02 10.3-5.742 13.697-1.952 2.437-6.637 8.3-10.258 8.3z" fill="{{selectedColor}}" stroke="{{activeColor}}" stroke-width="6" paint-order="stroke fill"/>\n  <path d="M22 7.001a12.01 12.01 0 0 1 12 12c0 7.623-10.377 17.998-12 17.998S10 26.624 10 19.001a12.01 12.01 0 0 1 12-12z" fill="{{backgroundColor}}" stroke="{{haloColor}}" stroke-width="2" paint-order="stroke fill"/>\n  <g transform="translate(22, 19) scale(0.8) translate(-8, -8)"><path d="{{graphic}}" fill="{{foregroundColor}}"/></g>'},_={id:"circle",viewBox:"0 0 44 44",anchor:[.5,.5],graphic:L.dot,svg:'<circle cx="22" cy="22" r="16" fill="{{selectedColor}}" stroke="{{activeColor}}" stroke-width="6" paint-order="stroke fill"/>\n  <circle cx="22" cy="22" r="12" fill="{{backgroundColor}}" stroke="{{haloColor}}" stroke-width="2" paint-order="stroke fill"/>\n  <g transform="translate(22, 22) scale(0.8) translate(-8, -8)"><path d="{{graphic}}" fill="{{foregroundColor}}"/></g>'},H={id:"square",viewBox:"0 0 44 44",anchor:[.5,.5],graphic:L.dot,svg:'<path d="M13 6h18c3.863 0 7 3.137 7 7v18c0 3.863-3.137 7-7 7H13c-3.863 0-7-3.137-7-7V13c0-3.863 3.137-7 7-7" fill="{{selectedColor}}" stroke="{{activeColor}}" stroke-width="6" paint-order="stroke fill"/>\n  <path d="M13 34a3 3 0 0 1-3-3V13a3 3 0 0 1 3-3h18a3 3 0 0 1 3 3v18a3 3 0 0 1-3 3H13z" fill-rule="nonzero" fill="{{backgroundColor}}" stroke="{{haloColor}}" stroke-width="2" paint-order="stroke fill"/>\n  <g transform="translate(22, 22) scale(0.8) translate(-8, -8)"><path d="{{graphic}}" fill="{{foregroundColor}}"/></g>'},V={light:{haloColor:"#ffffff",selectedColor:"#0b0c0c",activeColor:"#ffdd00",foregroundColor:"#0b0c0c"},dark:{haloColor:"#0b0c0c",selectedColor:"#ffffff",activeColor:"#ffdd00",foregroundColor:"#ffffff"}},B=function(t,r,e){return new Promise(function(n,o){var i="data:image/svg+xml;charset=utf-8,".concat(encodeURIComponent(t)),a=new Image(r,e);a.onload=function(){var t=document.createElement("canvas");t.width=r,t.height=e;var o=t.getContext("2d");o.drawImage(a,0,0,r,e),n(o.getImageData(0,0,r,e))},a.onerror=function(){o(new Error("Failed to rasterise SVG: ".concat(t.slice(0,80))))},a.src=i})};function G(t){return G="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},G(t)}function N(){var t,r,e="function"==typeof Symbol?Symbol:{},n=e.iterator||"@@iterator",o=e.toStringTag||"@@toStringTag";function i(e,n,o,i){var u=n&&n.prototype instanceof l?n:l,c=Object.create(u.prototype);return U(c,"_invoke",function(e,n,o){var i,l,u,c=0,f=o||[],s=!1,y={p:0,n:0,v:t,a:m,f:m.bind(t,4),d:function(r,e){return i=r,l=0,u=t,y.n=e,a}};function m(e,n){for(l=e,u=n,r=0;!s&&c&&!o&&r<f.length;r++){var o,i=f[r],m=y.p,p=i[2];e>3?(o=p===n)&&(u=i[(l=i[4])?5:(l=3,3)],i[4]=i[5]=t):i[0]<=m&&((o=e<2&&m<i[1])?(l=0,y.v=n,y.n=i[1]):m<p&&(o=e<3||i[0]>n||n>p)&&(i[4]=e,i[5]=n,y.n=p,l=0))}if(o||e>1)return a;throw s=!0,n}return function(o,f,p){if(c>1)throw TypeError("Generator is already running");for(s&&1===f&&m(f,p),l=f,u=p;(r=l<2?t:u)||!s;){i||(l?l<3?(l>1&&(y.n=-1),m(l,u)):y.n=u:y.v=u);try{if(c=2,i){if(l||(o="next"),r=i[o]){if(!(r=r.call(i,u)))throw TypeError("iterator result is not an object");if(!r.done)return r;u=r.value,l<2&&(l=0)}else 1===l&&(r=i.return)&&r.call(i),l<2&&(u=TypeError("The iterator does not provide a '"+o+"' method"),l=1);i=t}else if((r=(s=y.n<0)?u:e.call(n,y))!==a)break}catch(r){i=t,l=1,u=r}finally{c=1}}return{value:r,done:s}}}(e,o,i),!0),c}var a={};function l(){}function u(){}function c(){}r=Object.getPrototypeOf;var f=[][n]?r(r([][n]())):(U(r={},n,function(){return this}),r),s=c.prototype=l.prototype=Object.create(f);function y(t){return Object.setPrototypeOf?Object.setPrototypeOf(t,c):(t.__proto__=c,U(t,o,"GeneratorFunction")),t.prototype=Object.create(s),t}return u.prototype=c,U(s,"constructor",c),U(c,"constructor",u),u.displayName="GeneratorFunction",U(c,o,"GeneratorFunction"),U(s),U(s,o,"Generator"),U(s,n,function(){return this}),U(s,"toString",function(){return"[object Generator]"}),(N=function(){return{w:i,m:y}})()}function U(t,r,e,n){var o=Object.defineProperty;try{o({},"",{})}catch(t){o=0}U=function(t,r,e,n){function i(r,e){U(t,r,function(t){return this._invoke(r,e,t)})}r?o?o(t,r,{value:e,enumerable:!n,configurable:!n,writable:!n}):t[r]=e:(i("next",0),i("throw",1),i("return",2))},U(t,r,e,n)}function K(t,r,e,n,o,i,a){try{var l=t[i](a),u=l.value}catch(t){return void e(t)}l.done?r(u):Promise.resolve(u).then(n,o)}function $(t,r){var e=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);r&&(n=n.filter(function(r){return Object.getOwnPropertyDescriptor(t,r).enumerable})),e.push.apply(e,n)}return e}function F(t){for(var r=1;r<arguments.length;r++){var e=null!=arguments[r]?arguments[r]:{};r%2?$(Object(e),!0).forEach(function(r){W(t,r,e[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(e)):$(Object(e)).forEach(function(r){Object.defineProperty(t,r,Object.getOwnPropertyDescriptor(e,r))})}return t}function W(t,r,e){return(r=function(t){var r=function(t){if("object"!=G(t)||!t)return t;var r=t[Symbol.toPrimitive];if(void 0!==r){var e=r.call(t,"string");if("object"!=G(e))return e;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(t)}(t);return"symbol"==G(r)?r:r+""}(r))in t?Object.defineProperty(t,r,{value:e,enumerable:!0,configurable:!0,writable:!0}):t[r]=e,t}function q(t,r){return function(t){if(Array.isArray(t))return t}(t)||function(t,r){var e=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=e){var n,o,i,a,l=[],u=!0,c=!1;try{if(i=(e=e.call(t)).next,0===r){if(Object(e)!==e)return;u=!1}else for(;!(u=(n=i.call(e)).done)&&(l.push(n.value),l.length!==r);u=!0);}catch(t){c=!0,o=t}finally{try{if(!u&&null!=e.return&&(a=e.return(),Object(a)!==a))return}finally{if(c)throw o}}return l}}(t,r)||Z(t,r)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function Z(t,r){if(t){if("string"==typeof t)return R(t,r);var e={}.toString.call(t).slice(8,-1);return"Object"===e&&t.constructor&&(e=t.constructor.name),"Map"===e||"Set"===e?Array.from(t):"Arguments"===e||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(e)?R(t,r):void 0}}function R(t,r){(null==r||r>t.length)&&(r=t.length);for(var e=0,n=Array(r);e<r;e++)n[e]=t[e];return n}var J=new Map,Q=new Map,X={},Y=function(t){var r,e=0,n=function(t){var r="undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(!r){if(Array.isArray(t)||(r=Z(t))){r&&(t=r);var e=0,n=function(){};return{s:n,n:function(){return e>=t.length?{done:!0}:{done:!1,value:t[e++]}},e:function(t){throw t},f:n}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var o,i=!0,a=!1;return{s:function(){r=r.call(t)},n:function(){var t=r.next();return i=t.done,t},e:function(t){a=!0,o=t},f:function(){try{i||null==r.return||r.return()}finally{if(a)throw o}}}}(t);try{for(n.s();!(r=n.n()).done;){var o=r.value;e=Math.trunc((e<<5)-e+o.codePointAt(0))}}catch(t){n.e(t)}finally{n.f()}return Math.abs(e).toString(36)},tt=new Set(["id","svg","viewBox","anchor","symbol","symbolSvgContent"]);function rt(t,r,e){var n,o,i,a,l=null==e?void 0:e.id,u=Object.fromEntries(Object.entries(t||{}).filter(function(t){var r=q(t,1)[0];return!tt.has(r)})),f=Object.fromEntries(Object.entries(X).filter(function(t){var r=q(t,1)[0];return!tt.has(r)})),s=Object.fromEntries(Object.entries(r).filter(function(t){return null!=q(t,2)[1]})),y=F(F(F(F({},T),f),u),s),m=null!==(n=V[null==e?void 0:e.mapColorScheme])&&void 0!==n?n:V.light;return y.haloColor=null!==(o=null==e?void 0:e.haloColor)&&void 0!==o?o:m.haloColor,y.selectedColor=null!==(i=null==e?void 0:e.selectedColor)&&void 0!==i?i:m.selectedColor,y.activeColor=null!==(a=null==e?void 0:e.activeColor)&&void 0!==a?a:m.activeColor,"string"==typeof y.graphic&&L[y.graphic]&&(y.graphic=L[y.graphic]),Object.fromEntries(Object.entries(y).map(function(t){var r=q(t,2),e=r[0],n=r[1];return[e,c(n,l)||""]}))}function et(t,r){return Object.entries(r).reduce(function(t,r){var e=q(r,2),n=e[0],o=e[1];return t.replaceAll("{{".concat(n,"}}"),o)},t)}var nt={setDefaults:function(t){X=t||{}},getDefaults:function(){return F(F({},T),X)},register:function(t){J.set(t.id,t)},get:function(t){return J.get(t)},list:function(){return function(t){if(Array.isArray(t))return R(t)}(t=J.values())||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(t)||Z(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}();var t},clear:function(){J.clear()},initialise:function(){this.register(z),this.register(_),this.register(H)},resolve:function(t,r,e){var n=rt(t,r||{},e);return t?(n.selectedColor="none",n.activeColor="none",et(t.svg,n)):""},resolveActive:function(t,r,e){var n=rt(t,r||{},e);return t?et(t.svg,n):""},resolveSelected:function(t,r,e){var n=rt(t,r||{},e);return t?(n.activeColor="none",et(t.svg,n)):""},getSymbolImageId:function(t,r){var e=arguments.length>2&&void 0!==arguments[2]&&arguments[2],n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:2,o=this.getSymbolDef(t);if(!o)return null;var i=M(t),a=e?this.resolveActive(o,i,r):this.resolve(o,i,r);return"symbol-".concat(e?"act-":"").concat(Y(a),"-").concat(n,"x")},getSymbolDef:function(t){return t.symbolSvgContent?{svg:t.symbolSvgContent}:t.symbol?this.get(t.symbol):void 0},rasteriseSymbolImage:function(t,r,e,n){var o,i=this;return(o=N().m(function o(){var a,l,u,c,f,s,y,m,p,b,v,d;return N().w(function(o){for(;;)switch(o.n){case 0:if(a=i.getSymbolDef(t)){o.n=1;break}return o.a(2,null);case 1:if(l=M(t),"active"===e?(u=i.resolveActive(a,l,r),c="act-"):"selected"===e?(u=i.resolveSelected(a,l,r),c="sel-"):(u=i.resolve(a,l,r),c=""),f="symbol-".concat(c).concat(Y(u),"-").concat(n,"x"),s=Q.get(f)){o.n=3;break}return y=E(t,a),m=y.split(" ").map(Number),p=q(m,4),b=p[2],v=p[3],d='<svg xmlns="http://www.w3.org/2000/svg" width="'.concat(b*n,'" height="').concat(v*n,'" viewBox="').concat(y,'">').concat(u,"</svg>"),o.n=2,B(d,b*n,v*n);case 2:s=o.v,Q.set(f,s);case 3:return o.a(2,{imageId:f,imageData:s})}},o)}),function(){var t=this,r=arguments;return new Promise(function(e,n){var i=o.apply(t,r);function a(t){K(i,e,n,a,l,"next",t)}function l(t){K(i,e,n,a,l,"throw",t)}a(void 0)})})()}};function ot(t){return ot="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},ot(t)}function it(t,r){var e=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);r&&(n=n.filter(function(r){return Object.getOwnPropertyDescriptor(t,r).enumerable})),e.push.apply(e,n)}return e}function at(t){for(var r=1;r<arguments.length;r++){var e=null!=arguments[r]?arguments[r]:{};r%2?it(Object(e),!0).forEach(function(r){lt(t,r,e[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(e)):it(Object(e)).forEach(function(r){Object.defineProperty(t,r,Object.getOwnPropertyDescriptor(e,r))})}return t}function lt(t,r,e){return(r=function(t){var r=function(t){if("object"!=ot(t)||!t)return t;var r=t[Symbol.toPrimitive];if(void 0!==r){var e=r.call(t,"string");if("object"!=ot(e))return e;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(t)}(t);return"symbol"==ot(r)?r:r+""}(r))in t?Object.defineProperty(t,r,{value:e,enumerable:!0,configurable:!0,writable:!0}):t[r]=e,t}function ut(t,r){return function(t){if(Array.isArray(t))return t}(t)||function(t,r){var e=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=e){var n,o,i,a,l=[],u=!0,c=!1;try{if(i=(e=e.call(t)).next,0===r){if(Object(e)!==e)return;u=!1}else for(;!(u=(n=i.call(e)).done)&&(l.push(n.value),l.length!==r);u=!0);}catch(t){c=!0,o=t}finally{try{if(!u&&null!=e.return&&(a=e.return(),Object(a)!==a))return}finally{if(c)throw o}}return l}}(t,r)||function(t,r){if(t){if("string"==typeof t)return ct(t,r);var e={}.toString.call(t).slice(8,-1);return"Object"===e&&t.constructor&&(e=t.constructor.name),"Map"===e||"Set"===e?Array.from(t):"Arguments"===e||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(e)?ct(t,r):void 0}}(t,r)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function ct(t,r){(null==r||r>t.length)&&(r=t.length);for(var e=0,n=Array(r);e<r;e++)n[e]=t[e];return n}nt.initialise();var ft=function(t){var r=t.keyDefinition,e=t.mapStyle,o=t.symbolDef,i=ut((0,n.useState)(null),2),l=i[0],u=i[1],c=ut((0,n.useState)(null),2),f=c[0],s=c[1];return(0,n.useEffect)(function(){var t,n=r.style,i=null!==(t=null==e?void 0:e.appColorScheme)&&void 0!==t?t:"light",a=at(at({},e),{},{mapColorScheme:i});u(nt.resolve(o,M(n),a)),s(E(n,o))},[e,r]),l&&f?(0,a.jsx)("svg",at(at({},v),{},{viewBox:f,children:(0,a.jsx)("g",{dangerouslySetInnerHTML:{__html:l}})})):null};function st(t){return st="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},st(t)}function yt(t,r){var e=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);r&&(n=n.filter(function(r){return Object.getOwnPropertyDescriptor(t,r).enumerable})),e.push.apply(e,n)}return e}function mt(t){for(var r=1;r<arguments.length;r++){var e=null!=arguments[r]?arguments[r]:{};r%2?yt(Object(e),!0).forEach(function(r){pt(t,r,e[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(e)):yt(Object(e)).forEach(function(r){Object.defineProperty(t,r,Object.getOwnPropertyDescriptor(e,r))})}return t}function pt(t,r,e){return(r=function(t){var r=function(t){if("object"!=st(t)||!t)return t;var r=t[Symbol.toPrimitive];if(void 0!==r){var e=r.call(t,"string");if("object"!=st(e))return e;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(t)}(t);return"symbol"==st(r)?r:r+""}(r))in t?Object.defineProperty(t,r,{value:e,enumerable:!0,configurable:!0,writable:!0}):t[r]=e,t}function bt(t,r){return function(t){if(Array.isArray(t))return t}(t)||function(t,r){var e=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=e){var n,o,i,a,l=[],u=!0,c=!1;try{if(i=(e=e.call(t)).next,0===r){if(Object(e)!==e)return;u=!1}else for(;!(u=(n=i.call(e)).done)&&(l.push(n.value),l.length!==r);u=!0);}catch(t){c=!0,o=t}finally{try{if(!u&&null!=e.return&&(a=e.return(),Object(a)!==a))return}finally{if(c)throw o}}return l}}(t,r)||function(t,r){if(t){if("string"==typeof t)return vt(t,r);var e={}.toString.call(t).slice(8,-1);return"Object"===e&&t.constructor&&(e=t.constructor.name),"Map"===e||"Set"===e?Array.from(t):"Arguments"===e||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(e)?vt(t,r):void 0}}(t,r)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function vt(t,r){(null==r||r>t.length)&&(r=t.length);for(var e=0,n=Array(r);e<r;e++)n[e]=t[e];return n}var dt=function(t){var r=t.mapStyle,e=t.keyDefinition,o=bt((0,n.useState)(2),2),i=o[0],l=o[1],u=bt((0,n.useState)("#ff0000"),2),f=u[0],s=u[1];return(0,n.useEffect)(function(){var t=e.style;l(t.strokeWidth),s(c(t.stroke,r.id))},[r.id,e]),(0,a.jsx)("svg",mt(mt({},b),{},{children:(0,a.jsx)("line",{x1:i/2,y1:10,x2:p-i/2,y2:10,stroke:f,strokeWidth:i,strokeLinecap:"round"})}))};function ht(t){return ht="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},ht(t)}function gt(t,r){var e=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);r&&(n=n.filter(function(r){return Object.getOwnPropertyDescriptor(t,r).enumerable})),e.push.apply(e,n)}return e}function St(t){for(var r=1;r<arguments.length;r++){var e=null!=arguments[r]?arguments[r]:{};r%2?gt(Object(e),!0).forEach(function(r){jt(t,r,e[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(e)):gt(Object(e)).forEach(function(r){Object.defineProperty(t,r,Object.getOwnPropertyDescriptor(e,r))})}return t}function jt(t,r,e){return(r=function(t){var r=function(t){if("object"!=ht(t)||!t)return t;var r=t[Symbol.toPrimitive];if(void 0!==r){var e=r.call(t,"string");if("object"!=ht(e))return e;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(t)}(t);return"symbol"==ht(r)?r:r+""}(r))in t?Object.defineProperty(t,r,{value:e,enumerable:!0,configurable:!0,writable:!0}):t[r]=e,t}function Ot(t,r){return function(t){if(Array.isArray(t))return t}(t)||function(t,r){var e=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=e){var n,o,i,a,l=[],u=!0,c=!1;try{if(i=(e=e.call(t)).next,0===r){if(Object(e)!==e)return;u=!1}else for(;!(u=(n=i.call(e)).done)&&(l.push(n.value),l.length!==r);u=!0);}catch(t){c=!0,o=t}finally{try{if(!u&&null!=e.return&&(a=e.return(),Object(a)!==a))return}finally{if(c)throw o}}return l}}(t,r)||function(t,r){if(t){if("string"==typeof t)return wt(t,r);var e={}.toString.call(t).slice(8,-1);return"Object"===e&&t.constructor&&(e=t.constructor.name),"Map"===e||"Set"===e?Array.from(t):"Arguments"===e||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(e)?wt(t,r):void 0}}(t,r)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function wt(t,r){(null==r||r>t.length)&&(r=t.length);for(var e=0,n=Array(r);e<r;e++)n[e]=t[e];return n}var kt=function(t){var r=t.mapStyle,e=t.keyDefinition,o=Ot((0,n.useState)(2),2),i=o[0],l=o[1],u=Ot((0,n.useState)("#ff0000"),2),f=u[0],s=u[1],y=Ot((0,n.useState)("#ff0000"),2),m=y[0],v=y[1];return(0,n.useEffect)(function(){var t=e.style;l(t.strokeWidth),s(c(t.fill,r.id)),v(c(t.stroke,r.id))},[r.id,e]),(0,a.jsx)("svg",St(St({},b),{},{children:(0,a.jsx)("rect",{x:i/2,y:i/2,width:p-i,height:p-i,rx:i,ry:i,fill:f,stroke:m,strokeWidth:i,strokeLinejoin:"round"})}))};function Ct(t,r){return function(t){if(Array.isArray(t))return t}(t)||function(t,r){var e=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=e){var n,o,i,a,l=[],u=!0,c=!1;try{if(i=(e=e.call(t)).next,0===r){if(Object(e)!==e)return;u=!1}else for(;!(u=(n=i.call(e)).done)&&(l.push(n.value),l.length!==r);u=!0);}catch(t){c=!0,o=t}finally{try{if(!u&&null!=e.return&&(a=e.return(),Object(a)!==a))return}finally{if(c)throw o}}return l}}(t,r)||function(t,r){if(t){if("string"==typeof t)return Pt(t,r);var e={}.toString.call(t).slice(8,-1);return"Object"===e&&t.constructor&&(e=t.constructor.name),"Map"===e||"Set"===e?Array.from(t):"Arguments"===e||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(e)?Pt(t,r):void 0}}(t,r)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function Pt(t,r){(null==r||r>t.length)&&(r=t.length);for(var e=0,n=Array(r);e<r;e++)n[e]=t[e];return n}var At=function(t){var r=t.keyDefinition,e=t.mapStyle,o=Ct((0,n.useState)(null),2),i=o[0],l=o[1],u=Ct((0,n.useState)(null),2),c=u[0],f=u[1];return(0,n.useEffect)(function(){if(r){var t=r.hasSymbol,e=r.hasPattern,n=r.style;if(t){var o=nt.getSymbolDef(n);f(o),l(o?"symbol":"rect")}else e?l("pattern"):"line"===n.keySymbolShape?l("line"):l("rect")}else l(null)},[r]),i?"symbol"===i?(0,a.jsx)(ft,{mapStyle:e,keyDefinition:r,symbolDef:c}):"pattern"===i?(0,a.jsx)(I,{mapStyle:e,keyDefinition:r}):"line"===i?(0,a.jsx)(dt,{mapStyle:e,keyDefinition:r}):(0,a.jsx)(kt,{mapStyle:e,keyDefinition:r}):null};function xt(t,r){return function(t){if(Array.isArray(t))return t}(t)||function(t,r){var e=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=e){var n,o,i,a,l=[],u=!0,c=!1;try{if(i=(e=e.call(t)).next,0===r){if(Object(e)!==e)return;u=!1}else for(;!(u=(n=i.call(e)).done)&&(l.push(n.value),l.length!==r);u=!0);}catch(t){c=!0,o=t}finally{try{if(!u&&null!=e.return&&(a=e.return(),Object(a)!==a))return}finally{if(c)throw o}}return l}}(t,r)||function(t,r){if(t){if("string"==typeof t)return It(t,r);var e={}.toString.call(t).slice(8,-1);return"Object"===e&&t.constructor&&(e=t.constructor.name),"Map"===e||"Set"===e?Array.from(t):"Arguments"===e||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(e)?It(t,r):void 0}}(t,r)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function It(t,r){(null==r||r>t.length)&&(r=t.length);for(var e=0,n=Array(r);e<r;e++)n[e]=t[e];return n}var Dt=function(t){var r=t.keyDefinition,e=t.mapStyle,o=xt((0,n.useState)(""),2),i=o[0],l=o[1],u=xt((0,n.useState)(""),2),f=u[0],s=u[1];return(0,n.useEffect)(function(){l(r.label),s(c(r.symbolDescription,e.id))},[r,e.id]),(0,a.jsxs)("dl",{className:"im-c-map-key__item",children:[(0,a.jsx)("dt",{className:"im-c-map-key__item-symbol",children:(0,a.jsx)(At,{keyDefinition:r,mapStyle:e})}),(0,a.jsxs)("dd",{className:"im-c-map-key__item-label",children:[i,f&&(0,a.jsxs)("span",{className:"govuk-visually-hidden",children:["(",f,")"]})]})]})},Mt=function(t){var r=t.headingId,e=t.label,n=t.keyDefinitions,o=t.mapStyle;return(0,a.jsxs)("section",{className:"im-c-map-key__group","aria-labelledby":r,children:[(0,a.jsx)("h3",{id:r,className:"im-c-map-key__group-heading",children:e}),n.map(function(t){return(0,a.jsx)(Dt,{keyDefinition:t,mapStyle:o},"".concat(t.id))})]})};function Et(t,r){(null==r||r>t.length)&&(r=t.length);for(var e=0,n=Array(r);e<r;e++)n[e]=t[e];return n}var Tt="im-c-map-key",Lt=function(t){var r=t.item,e=t.mapStyle;return"group"===r.type?(0,a.jsx)(Mt,{headingId:"key-heading-".concat(r.id),label:r.groupLabel,keyDefinitions:r.keyDefinitions,mapStyle:e}):(0,a.jsx)(Dt,{keyDefinition:r.keyDefinition,mapStyle:e})},zt=function(t){var r=t.noKeyItemText,e=t.keyGroups,o=t.hasGroups,i=t.mapStyle;if(null==e||!e.length)return(0,a.jsx)(l,{text:r});var u,c,f=(u=(0,n.useState)("im-c-map-key"),c=2,function(t){if(Array.isArray(t))return t}(u)||function(t,r){var e=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=e){var n,o,i,a,l=[],u=!0,c=!1;try{if(i=(e=e.call(t)).next,0===r){if(Object(e)!==e)return;u=!1}else for(;!(u=(n=i.call(e)).done)&&(l.push(n.value),l.length!==r);u=!0);}catch(t){c=!0,o=t}finally{try{if(!u&&null!=e.return&&(a=e.return(),Object(a)!==a))return}finally{if(c)throw o}}return l}}(u,c)||function(t,r){if(t){if("string"==typeof t)return Et(t,r);var e={}.toString.call(t).slice(8,-1);return"Object"===e&&t.constructor&&(e=t.constructor.name),"Map"===e||"Set"===e?Array.from(t):"Arguments"===e||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(e)?Et(t,r):void 0}}(u,c)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()),s=f[0],y=f[1];return(0,n.useEffect)(function(){return y(o?"".concat(Tt," ").concat("im-c-map-key--has-groups"):Tt)},[o]),(0,a.jsx)("div",{className:s,children:e.map(function(t){return(0,a.jsx)(Lt,{item:t,mapStyle:i},t.id)})})};function _t(t,r){return function(t){if(Array.isArray(t))return t}(t)||function(t,r){var e=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=e){var n,o,i,a,l=[],u=!0,c=!1;try{if(i=(e=e.call(t)).next,0===r){if(Object(e)!==e)return;u=!1}else for(;!(u=(n=i.call(e)).done)&&(l.push(n.value),l.length!==r);u=!0);}catch(t){c=!0,o=t}finally{try{if(!u&&null!=e.return&&(a=e.return(),Object(a)!==a))return}finally{if(c)throw o}}return l}}(t,r)||function(t,r){if(t){if("string"==typeof t)return Ht(t,r);var e={}.toString.call(t).slice(8,-1);return"Object"===e&&t.constructor&&(e=t.constructor.name),"Map"===e||"Set"===e?Array.from(t):"Arguments"===e||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(e)?Ht(t,r):void 0}}(t,r)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function Ht(t,r){(null==r||r>t.length)&&(r=t.length);for(var e=0,n=Array(r);e<r;e++)n[e]=t[e];return n}var Vt={InitComponent:function(t){var r=t.mapState,e=t.services.eventBus;(0,n.useEffect)(function(){r.isMapReady&&e.requestOnce("datasets:registry",i)},[r.isMapReady])},panels:[{id:"mapKey",label:"Key",mobile:{slot:"drawer",modal:!0},tablet:{slot:"left-top",width:"260px"},desktop:{slot:"left-top",width:"280px"},render:function(t){var r=t.mapState.mapStyle,e=t.pluginConfig.noKeyItemText,i=t.services.eventBus,l=_t((0,n.useState)([]),2),u=l[0],c=l[1],f=_t((0,n.useState)(!1),2),s=f[0],y=f[1],m=_t((0,n.useState)(o),2),p=m[0],b=m[1],v=function(){var t=p.keyItems(),r=t.items,e=t.hasGroups;c(r),y(e)},d=function(t){p.invalidateKeyItemsOnMenuStateChange(t),v()};return(0,n.useEffect)(function(){return p?(v(),i.on("menu:changed",d).on("datasets:changed",v),function(){return i.off("menu:changed",d).off("datasets:changed",v)}):(i.requestOnce("datasets:registry",b),function(){})},[p]),(0,a.jsx)(zt,{noKeyItemText:e,keyGroups:u,hasGroups:s,mapStyle:r})}}],buttons:[{id:"mapKey",panelId:"mapKey",label:"Key",iconId:"key",mobile:{slot:"top-left",showLabel:!1},tablet:{slot:"top-left",showLabel:!0},desktop:{slot:"top-left",showLabel:!0}}],icons:[{id:"key",svgContent:'<path d="M3 5h.01"/><path d="M3 12h.01"/><path d="M3 19h.01"/><path d="M8 5h13"/><path d="M8 12h13"/><path d="M8 19h13"/>'}]}}}]);
+"use strict";(this.webpackChunkdefra_DefraMap=this.webpackChunkdefra_DefraMap||[]).push([[414],{374(t,e,r){r.r(e),r.d(e,{manifest:()=>Ct});var n=r(738),o=null,i=function(t){return o=t},a=r(287),l=function(t){var e=t.text;return(0,a.jsx)("div",{className:"im-c-map-key",children:(0,a.jsx)("p",{className:"im-c-map-key__empty-message",children:e})})};function c(t){return c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},c(t)}var u=function(t,e){if(!t)return null;if("string"==typeof t)return t.trim();if("object"===c(t)){if(e&&t[e])return t[e];var r=Object.values(t)[0];return null!=r?r:null}return null};function f(t){return f="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},f(t)}function s(t,e){var r=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);e&&(n=n.filter(function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})),r.push.apply(r,n)}return r}function y(t){for(var e=1;e<arguments.length;e++){var r=null!=arguments[e]?arguments[e]:{};e%2?s(Object(r),!0).forEach(function(e){p(t,e,r[e])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(r)):s(Object(r)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(r,e))})}return t}function p(t,e,r){return(e=function(t){var e=function(t){if("object"!=f(t)||!t)return t;var e=t[Symbol.toPrimitive];if(void 0!==e){var r=e.call(t,"string");if("object"!=f(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(t)}(t);return"symbol"==f(e)?e:e+""}(e))in t?Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}):t[e]=r,t}var m=20,b={xmlns:"http://www.w3.org/2000/svg",width:m,height:m,viewBox:"0 0 ".concat(m," ").concat(m),className:"am-c-map-key-symbol","aria-hidden":"true",focusable:"false"},v=y(y({},b),{},{width:44,height:44,className:"am-c-map-key-symbol am-c-map-key-symbol--point"}),d={"cross-hatch":'<path d="M0 4.486V3.485h3.5V.001h1v3.484h7.002V.001h1v3.484h3.5v1.001h-3.5v7h3.5v.999h-3.5v3.516h-1v-3.516H4.499v3.516h-1v-3.516H0v-.999h3.5v-7H0zm11.501 0H4.499v7h7.002v-7z" fill="{{foregroundColor}}"/>',"diagonal-cross-hatch":'<path d="M0 8.707V7.293L7.293 0h1.414L16 7.293v1.414L8.707 16H7.293L0 8.707zM.707 8L8 15.293 15.293 8 8 .707.707 8z" fill="{{foregroundColor}}"/>',"forward-diagonal-hatch":'<path d="M16 8.707V7.293L7.293 16h1.414L16 8.707zm-16 0L8.707 0H7.293L0 7.293v1.414z" fill="{{foregroundColor}}"/>',"backward-diagonal-hatch":'<path d="M0 8.707V7.293L8.707 16H7.293L0 8.707zm16 0L7.293 0h1.414L16 7.293v1.414z" fill="{{foregroundColor}}"/>',"horizontal-hatch":'<path d="M0 4.5V3.499h15.999V4.5H0zm0 7h15.999V12.5H0v-1.001z" fill="{{foregroundColor}}"/>',"vertical-hatch":'<path d="M3.501 16.001V0h1v16.001h-1zm7.998 0V0h1v16.001h-1z" fill="{{foregroundColor}}"/>',dot:'<path d="M3.999 2A2 2 0 0 1 6 3.999C6 5.103 5.103 6 3.999 6a2 2 0 0 1-1.999-2.001A2 2 0 0 1 3.999 2zm0 7.999C5.103 10 6 10.897 6 12.001A2 2 0 0 1 3.999 14a2 2 0 0 1-1.999-1.999A2 2 0 0 1 3.999 10zM11.999 2A2 2 0 0 1 14 3.999C14 5.103 13.103 6 11.999 6S10 5.103 10 3.999A2 2 0 0 1 11.999 2zm0 7.999c1.104 0 2.001.897 2.001 2.001A2 2 0 0 1 11.999 14 2 2 0 0 1 10 12.001c0-1.104.897-2.001 1.999-2.001z" fill="{{foregroundColor}}"/>',diamond:'<path d="M4 .465L7.535 4 4 7.535.465 4 4 .465zm0 7.999l3.535 3.535L4 15.535.465 11.999 4 8.464zm8-8l3.535 3.535-3.536 3.536L8.464 4 12 .464zm0 8.001L15.536 12 12 15.536 8.465 12 12 8.465z" fill="{{foregroundColor}}"/>'};function h(t,e){(null==e||e>t.length)&&(e=t.length);for(var r=0,n=Array(e);r<e;r++)n[r]=t[r];return n}var g=function(t,e,r){return t.replace(/\{\{foregroundColor\}\}/g,e||"black").replace(/\{\{backgroundColor\}\}/g,r||"transparent")};function S(t,e){if(t){if("string"==typeof t)return j(t,e);var r={}.toString.call(t).slice(8,-1);return"Object"===r&&t.constructor&&(r=t.constructor.name),"Map"===r||"Set"===r?Array.from(t):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?j(t,e):void 0}}function j(t,e){(null==e||e>t.length)&&(e=t.length);for(var r=0,n=Array(e);r<e;r++)n[r]=t[r];return n}var O=new Map,w={register:function(t,e){O.set(t,{id:t,svgContent:e})},get:function(t){return O.get(t)},list:function(){return function(t){if(Array.isArray(t))return j(t)}(t=O.values())||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(t)||S(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}();var t},clear:function(){O.clear()},initialise:function(){var t=this;Object.entries(d).forEach(function(e){var r,n,o=(n=2,function(t){if(Array.isArray(t))return t}(r=e)||function(t,e){var r=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=r){var n,o,i,a,l=[],c=!0,u=!1;try{if(i=(r=r.call(t)).next,0===e){if(Object(r)!==r)return;c=!1}else for(;!(c=(n=i.call(r)).done)&&(l.push(n.value),l.length!==e);c=!0);}catch(t){u=!0,o=t}finally{try{if(!c&&null!=r.return&&(a=r.return(),Object(a)!==a))return}finally{if(u)throw o}}return l}}(r,n)||S(r,n)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()),i=o[0],a=o[1];t.register(i,a)})},getPatternInnerContent:function(t){return t.fillPatternSvgContent?t.fillPatternSvgContent:t.fillPattern&&null!==(e=null===(r=this.get(t.fillPattern))||void 0===r?void 0:r.svgContent)&&void 0!==e?e:null;var e,r},getKeyPatternPaths:function(t,e){var r=this.getPatternInnerContent(t);if(!r)return null;var n=u(t.fillPatternForegroundColor,e)||"black",o=u(t.fillPatternBackgroundColor,e)||"transparent",i=u(t.stroke,e)||n;return{border:g('<path d="M19 2.862v14.275c0 1.028-.835 1.862-1.862 1.862H2.863c-1.028 0-1.862-.835-1.862-1.862V2.862C1.001 1.834 1.836 1 2.863 1h14.275C18.166 1 19 1.835 19 2.862z" fill="{{backgroundColor}}" stroke="{{foregroundColor}}" stroke-width="2"/>',i,o),content:g(r,n,o)}},getPatternImageId:function(t,e){var r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:1,n=this.getPatternInnerContent(t);if(!n)return null;var o=u(t.fillPatternForegroundColor,e)||"black",i=u(t.fillPatternBackgroundColor,e)||"transparent",a=function(t){return Math.max(2,2*t)}(r);return"pattern-".concat(function(t){var e,r=0,n=function(t,e){var r="undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(!r){if(Array.isArray(t)||(r=function(t,e){if(t){if("string"==typeof t)return h(t,e);var r={}.toString.call(t).slice(8,-1);return"Object"===r&&t.constructor&&(r=t.constructor.name),"Map"===r||"Set"===r?Array.from(t):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?h(t,e):void 0}}(t))||e&&t&&"number"==typeof t.length){r&&(t=r);var n=0,o=function(){};return{s:o,n:function(){return n>=t.length?{done:!0}:{done:!1,value:t[n++]}},e:function(t){throw t},f:o}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var i,a=!0,l=!1;return{s:function(){r=r.call(t)},n:function(){var t=r.next();return a=t.done,t},e:function(t){l=!0,i=t},f:function(){try{a||null==r.return||r.return()}finally{if(l)throw i}}}}(t);try{for(n.s();!(e=n.n()).done;){var o=e.value;r=Math.trunc((r<<5)-r+o.codePointAt(0))}}catch(t){n.e(t)}finally{n.f()}return Math.abs(r).toString(36)}(n+o+i),"-").concat(a,"x")}};function k(t){return k="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},k(t)}function P(t,e){var r=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);e&&(n=n.filter(function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})),r.push.apply(r,n)}return r}function C(t){for(var e=1;e<arguments.length;e++){var r=null!=arguments[e]?arguments[e]:{};e%2?P(Object(r),!0).forEach(function(e){x(t,e,r[e])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(r)):P(Object(r)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(r,e))})}return t}function x(t,e,r){return(e=function(t){var e=function(t){if("object"!=k(t)||!t)return t;var e=t[Symbol.toPrimitive];if(void 0!==e){var r=e.call(t,"string");if("object"!=k(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(t)}(t);return"symbol"==k(e)?e:e+""}(e))in t?Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}):t[e]=r,t}w.initialise();var D=function(t){var e=t.keyDefinition,r=t.mapStyle,n=e.style,o=w.getKeyPatternPaths(n,r.id);return o?(0,a.jsxs)("svg",C(C({},b),{},{children:[(0,a.jsx)("g",{dangerouslySetInnerHTML:{__html:o.border}}),(0,a.jsx)("g",{transform:"translate(".concat(2,", ").concat(2,")"),dangerouslySetInnerHTML:{__html:o.content}})]})):null},A=new Set(["symbolBackgroundColor","symbolForegroundColor","symbolHaloWidth","symbolGraphic"]),I=function(t){if(!function(t){return!(!t.symbol&&!t.symbolSvgContent)}(t))return{};var e={};return A.forEach(function(r){if(null!=t[r]){var n=r.charAt(6).toLowerCase()+r.slice(7);e[n]=t[r]}}),e},M=function(t,e){var r;return t.symbolViewBox?t.symbolViewBox:null!==(r=null==e?void 0:e.viewBox)&&void 0!==r?r:"0 0 38 38"},E={symbol:"pin",backgroundColor:"#ca3535",foregroundColor:"#ffffff"},L={dot:"M8 3c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.241 5-5-2.24-5-5-5z",cross:"M6 3H10V6H13V10H10V13H6V10H3V6H6Z",diamond:"M8 2L14 8L8 14L2 8Z",triangle:"M8 2L14 14H2Z",square:"M3 3H13V13H3Z"},z={id:"pin",viewBox:"0 0 44 44",anchor:[.5,.9],graphic:L.dot,svg:'<path d="M22 40.999c-3.621 0-8.306-5.864-10.258-8.3C9.02 29.302 6 23.66 6 19.002a16.01 16.01 0 0 1 16-16 16.01 16.01 0 0 1 16 16c0 4.658-3.02 10.3-5.742 13.697-1.952 2.437-6.637 8.3-10.258 8.3z" fill="{{selectedColor}}" stroke="{{activeColor}}" stroke-width="6" paint-order="stroke fill"/>\n  <path d="M22 7.001a12.01 12.01 0 0 1 12 12c0 7.623-10.377 17.998-12 17.998S10 26.624 10 19.001a12.01 12.01 0 0 1 12-12z" fill="{{backgroundColor}}" stroke="{{haloColor}}" stroke-width="2" paint-order="stroke fill"/>\n  <g transform="translate(22, 19) scale(0.8) translate(-8, -8)"><path d="{{graphic}}" fill="{{foregroundColor}}"/></g>'},_={id:"circle",viewBox:"0 0 44 44",anchor:[.5,.5],graphic:L.dot,svg:'<circle cx="22" cy="22" r="16" fill="{{selectedColor}}" stroke="{{activeColor}}" stroke-width="6" paint-order="stroke fill"/>\n  <circle cx="22" cy="22" r="12" fill="{{backgroundColor}}" stroke="{{haloColor}}" stroke-width="2" paint-order="stroke fill"/>\n  <g transform="translate(22, 22) scale(0.8) translate(-8, -8)"><path d="{{graphic}}" fill="{{foregroundColor}}"/></g>'},H={id:"square",viewBox:"0 0 44 44",anchor:[.5,.5],graphic:L.dot,svg:'<path d="M13 6h18c3.863 0 7 3.137 7 7v18c0 3.863-3.137 7-7 7H13c-3.863 0-7-3.137-7-7V13c0-3.863 3.137-7 7-7" fill="{{selectedColor}}" stroke="{{activeColor}}" stroke-width="6" paint-order="stroke fill"/>\n  <path d="M13 34a3 3 0 0 1-3-3V13a3 3 0 0 1 3-3h18a3 3 0 0 1 3 3v18a3 3 0 0 1-3 3H13z" fill-rule="nonzero" fill="{{backgroundColor}}" stroke="{{haloColor}}" stroke-width="2" paint-order="stroke fill"/>\n  <g transform="translate(22, 22) scale(0.8) translate(-8, -8)"><path d="{{graphic}}" fill="{{foregroundColor}}"/></g>'},T={light:{haloColor:"#ffffff",selectedColor:"#0b0c0c",activeColor:"#ffdd00",foregroundColor:"#0b0c0c"},dark:{haloColor:"#0b0c0c",selectedColor:"#ffffff",activeColor:"#ffdd00",foregroundColor:"#ffffff"}},V=function(t,e,r){return new Promise(function(n,o){var i="data:image/svg+xml;charset=utf-8,".concat(encodeURIComponent(t)),a=new Image(e,r);a.onload=function(){var t=document.createElement("canvas");t.width=e,t.height=r;var o=t.getContext("2d");o.drawImage(a,0,0,e,r),n(o.getImageData(0,0,e,r))},a.onerror=function(){o(new Error("Failed to rasterise SVG: ".concat(t.slice(0,80))))},a.src=i})};function B(t){return B="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},B(t)}function G(){var t,e,r="function"==typeof Symbol?Symbol:{},n=r.iterator||"@@iterator",o=r.toStringTag||"@@toStringTag";function i(r,n,o,i){var c=n&&n.prototype instanceof l?n:l,u=Object.create(c.prototype);return N(u,"_invoke",function(r,n,o){var i,l,c,u=0,f=o||[],s=!1,y={p:0,n:0,v:t,a:p,f:p.bind(t,4),d:function(e,r){return i=e,l=0,c=t,y.n=r,a}};function p(r,n){for(l=r,c=n,e=0;!s&&u&&!o&&e<f.length;e++){var o,i=f[e],p=y.p,m=i[2];r>3?(o=m===n)&&(c=i[(l=i[4])?5:(l=3,3)],i[4]=i[5]=t):i[0]<=p&&((o=r<2&&p<i[1])?(l=0,y.v=n,y.n=i[1]):p<m&&(o=r<3||i[0]>n||n>m)&&(i[4]=r,i[5]=n,y.n=m,l=0))}if(o||r>1)return a;throw s=!0,n}return function(o,f,m){if(u>1)throw TypeError("Generator is already running");for(s&&1===f&&p(f,m),l=f,c=m;(e=l<2?t:c)||!s;){i||(l?l<3?(l>1&&(y.n=-1),p(l,c)):y.n=c:y.v=c);try{if(u=2,i){if(l||(o="next"),e=i[o]){if(!(e=e.call(i,c)))throw TypeError("iterator result is not an object");if(!e.done)return e;c=e.value,l<2&&(l=0)}else 1===l&&(e=i.return)&&e.call(i),l<2&&(c=TypeError("The iterator does not provide a '"+o+"' method"),l=1);i=t}else if((e=(s=y.n<0)?c:r.call(n,y))!==a)break}catch(e){i=t,l=1,c=e}finally{u=1}}return{value:e,done:s}}}(r,o,i),!0),u}var a={};function l(){}function c(){}function u(){}e=Object.getPrototypeOf;var f=[][n]?e(e([][n]())):(N(e={},n,function(){return this}),e),s=u.prototype=l.prototype=Object.create(f);function y(t){return Object.setPrototypeOf?Object.setPrototypeOf(t,u):(t.__proto__=u,N(t,o,"GeneratorFunction")),t.prototype=Object.create(s),t}return c.prototype=u,N(s,"constructor",u),N(u,"constructor",c),c.displayName="GeneratorFunction",N(u,o,"GeneratorFunction"),N(s),N(s,o,"Generator"),N(s,n,function(){return this}),N(s,"toString",function(){return"[object Generator]"}),(G=function(){return{w:i,m:y}})()}function N(t,e,r,n){var o=Object.defineProperty;try{o({},"",{})}catch(t){o=0}N=function(t,e,r,n){function i(e,r){N(t,e,function(t){return this._invoke(e,r,t)})}e?o?o(t,e,{value:r,enumerable:!n,configurable:!n,writable:!n}):t[e]=r:(i("next",0),i("throw",1),i("return",2))},N(t,e,r,n)}function K(t,e,r,n,o,i,a){try{var l=t[i](a),c=l.value}catch(t){return void r(t)}l.done?e(c):Promise.resolve(c).then(n,o)}function F(t,e){var r=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);e&&(n=n.filter(function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})),r.push.apply(r,n)}return r}function U(t){for(var e=1;e<arguments.length;e++){var r=null!=arguments[e]?arguments[e]:{};e%2?F(Object(r),!0).forEach(function(e){W(t,e,r[e])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(r)):F(Object(r)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(r,e))})}return t}function W(t,e,r){return(e=function(t){var e=function(t){if("object"!=B(t)||!t)return t;var e=t[Symbol.toPrimitive];if(void 0!==e){var r=e.call(t,"string");if("object"!=B(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(t)}(t);return"symbol"==B(e)?e:e+""}(e))in t?Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}):t[e]=r,t}function q(t,e){return function(t){if(Array.isArray(t))return t}(t)||function(t,e){var r=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=r){var n,o,i,a,l=[],c=!0,u=!1;try{if(i=(r=r.call(t)).next,0===e){if(Object(r)!==r)return;c=!1}else for(;!(c=(n=i.call(r)).done)&&(l.push(n.value),l.length!==e);c=!0);}catch(t){u=!0,o=t}finally{try{if(!c&&null!=r.return&&(a=r.return(),Object(a)!==a))return}finally{if(u)throw o}}return l}}(t,e)||Z(t,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function Z(t,e){if(t){if("string"==typeof t)return $(t,e);var r={}.toString.call(t).slice(8,-1);return"Object"===r&&t.constructor&&(r=t.constructor.name),"Map"===r||"Set"===r?Array.from(t):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?$(t,e):void 0}}function $(t,e){(null==e||e>t.length)&&(e=t.length);for(var r=0,n=Array(e);r<e;r++)n[r]=t[r];return n}var R=new Map,J=new Map,Q={},X=function(t){var e,r=0,n=function(t){var e="undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(!e){if(Array.isArray(t)||(e=Z(t))){e&&(t=e);var r=0,n=function(){};return{s:n,n:function(){return r>=t.length?{done:!0}:{done:!1,value:t[r++]}},e:function(t){throw t},f:n}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var o,i=!0,a=!1;return{s:function(){e=e.call(t)},n:function(){var t=e.next();return i=t.done,t},e:function(t){a=!0,o=t},f:function(){try{i||null==e.return||e.return()}finally{if(a)throw o}}}}(t);try{for(n.s();!(e=n.n()).done;){var o=e.value;r=Math.trunc((r<<5)-r+o.codePointAt(0))}}catch(t){n.e(t)}finally{n.f()}return Math.abs(r).toString(36)},Y=new Set(["id","svg","viewBox","anchor","symbol","symbolSvgContent"]);function tt(t,e,r){var n,o,i,a,l=null==r?void 0:r.id,c=Object.fromEntries(Object.entries(t||{}).filter(function(t){var e=q(t,1)[0];return!Y.has(e)})),f=Object.fromEntries(Object.entries(Q).filter(function(t){var e=q(t,1)[0];return!Y.has(e)})),s=Object.fromEntries(Object.entries(e).filter(function(t){return null!=q(t,2)[1]})),y=U(U(U(U({},E),f),c),s),p=null!==(n=T[null==r?void 0:r.mapColorScheme])&&void 0!==n?n:T.light;return y.haloColor=null!==(o=null==r?void 0:r.haloColor)&&void 0!==o?o:p.haloColor,y.selectedColor=null!==(i=null==r?void 0:r.selectedColor)&&void 0!==i?i:p.selectedColor,y.activeColor=null!==(a=null==r?void 0:r.activeColor)&&void 0!==a?a:p.activeColor,"string"==typeof y.graphic&&L[y.graphic]&&(y.graphic=L[y.graphic]),Object.fromEntries(Object.entries(y).map(function(t){var e=q(t,2),r=e[0],n=e[1];return[r,u(n,l)||""]}))}function et(t,e){return Object.entries(e).reduce(function(t,e){var r=q(e,2),n=r[0],o=r[1];return t.replaceAll("{{".concat(n,"}}"),o)},t)}var rt={setDefaults:function(t){Q=t||{}},getDefaults:function(){return U(U({},E),Q)},register:function(t){R.set(t.id,t)},get:function(t){return R.get(t)},list:function(){return function(t){if(Array.isArray(t))return $(t)}(t=R.values())||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(t)||Z(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}();var t},clear:function(){R.clear()},initialise:function(){this.register(z),this.register(_),this.register(H)},resolve:function(t,e,r){var n=tt(t,e||{},r);return t?(n.selectedColor="none",n.activeColor="none",et(t.svg,n)):""},resolveActive:function(t,e,r){var n=tt(t,e||{},r);return t?et(t.svg,n):""},resolveSelected:function(t,e,r){var n=tt(t,e||{},r);return t?(n.activeColor="none",et(t.svg,n)):""},getSymbolImageId:function(t,e){var r=arguments.length>2&&void 0!==arguments[2]&&arguments[2],n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:2,o=this.getSymbolDef(t);if(!o)return null;var i=I(t),a=r?this.resolveActive(o,i,e):this.resolve(o,i,e);return"symbol-".concat(r?"act-":"").concat(X(a),"-").concat(n,"x")},getSymbolDef:function(t){return t.symbolSvgContent?{svg:t.symbolSvgContent}:t.symbol?this.get(t.symbol):void 0},rasteriseSymbolImage:function(t,e,r,n){var o,i=this;return(o=G().m(function o(){var a,l,c,u,f,s,y,p,m,b,v,d;return G().w(function(o){for(;;)switch(o.n){case 0:if(a=i.getSymbolDef(t)){o.n=1;break}return o.a(2,null);case 1:if(l=I(t),"active"===r?(c=i.resolveActive(a,l,e),u="act-"):"selected"===r?(c=i.resolveSelected(a,l,e),u="sel-"):(c=i.resolve(a,l,e),u=""),f="symbol-".concat(u).concat(X(c),"-").concat(n,"x"),s=J.get(f)){o.n=3;break}return y=M(t,a),p=y.split(" ").map(Number),m=q(p,4),b=m[2],v=m[3],d='<svg xmlns="http://www.w3.org/2000/svg" width="'.concat(b*n,'" height="').concat(v*n,'" viewBox="').concat(y,'">').concat(c,"</svg>"),o.n=2,V(d,b*n,v*n);case 2:s=o.v,J.set(f,s);case 3:return o.a(2,{imageId:f,imageData:s})}},o)}),function(){var t=this,e=arguments;return new Promise(function(r,n){var i=o.apply(t,e);function a(t){K(i,r,n,a,l,"next",t)}function l(t){K(i,r,n,a,l,"throw",t)}a(void 0)})})()}};function nt(t){return nt="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},nt(t)}function ot(t,e){var r=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);e&&(n=n.filter(function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})),r.push.apply(r,n)}return r}function it(t){for(var e=1;e<arguments.length;e++){var r=null!=arguments[e]?arguments[e]:{};e%2?ot(Object(r),!0).forEach(function(e){at(t,e,r[e])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(r)):ot(Object(r)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(r,e))})}return t}function at(t,e,r){return(e=function(t){var e=function(t){if("object"!=nt(t)||!t)return t;var e=t[Symbol.toPrimitive];if(void 0!==e){var r=e.call(t,"string");if("object"!=nt(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(t)}(t);return"symbol"==nt(e)?e:e+""}(e))in t?Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}):t[e]=r,t}rt.initialise();var lt=function(t){var e,r=t.keyDefinition,n=t.mapStyle,o=t.symbolDef,i=r.style,l=null!==(e=null==n?void 0:n.appColorScheme)&&void 0!==e?e:"light",c=it(it({},n),{},{mapColorScheme:l}),u=rt.resolve(o,I(i),c),f=M(i,o);return u&&f?(0,a.jsx)("svg",it(it({},v),{},{viewBox:f,children:(0,a.jsx)("g",{dangerouslySetInnerHTML:{__html:u}})})):null};function ct(t){return ct="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},ct(t)}function ut(t,e){var r=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);e&&(n=n.filter(function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})),r.push.apply(r,n)}return r}function ft(t){for(var e=1;e<arguments.length;e++){var r=null!=arguments[e]?arguments[e]:{};e%2?ut(Object(r),!0).forEach(function(e){st(t,e,r[e])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(r)):ut(Object(r)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(r,e))})}return t}function st(t,e,r){return(e=function(t){var e=function(t){if("object"!=ct(t)||!t)return t;var e=t[Symbol.toPrimitive];if(void 0!==e){var r=e.call(t,"string");if("object"!=ct(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(t)}(t);return"symbol"==ct(e)?e:e+""}(e))in t?Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}):t[e]=r,t}var yt=function(t){var e=t.mapStyle,r=t.keyDefinition.style,n=r.strokeWidth,o=u(r.stroke,e.id);return(0,a.jsx)("svg",ft(ft({},b),{},{children:(0,a.jsx)("line",{x1:n/2,y1:10,x2:m-n/2,y2:10,stroke:o,strokeWidth:n,strokeLinecap:"round"})}))};function pt(t){return pt="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},pt(t)}function mt(t,e){var r=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);e&&(n=n.filter(function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})),r.push.apply(r,n)}return r}function bt(t){for(var e=1;e<arguments.length;e++){var r=null!=arguments[e]?arguments[e]:{};e%2?mt(Object(r),!0).forEach(function(e){vt(t,e,r[e])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(r)):mt(Object(r)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(r,e))})}return t}function vt(t,e,r){return(e=function(t){var e=function(t){if("object"!=pt(t)||!t)return t;var e=t[Symbol.toPrimitive];if(void 0!==e){var r=e.call(t,"string");if("object"!=pt(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(t)}(t);return"symbol"==pt(e)?e:e+""}(e))in t?Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}):t[e]=r,t}var dt=function(t){var e=t.mapStyle,r=t.keyDefinition.style,n=r.strokeWidth,o=u(r.fill,e.id),i=u(r.stroke,e.id);return(0,a.jsx)("svg",bt(bt({},b),{},{children:(0,a.jsx)("rect",{x:n/2,y:n/2,width:m-n,height:m-n,rx:n,ry:n,fill:o,stroke:i,strokeWidth:n,strokeLinejoin:"round"})}))},ht=function(t){var e=t.keyDefinition,r=t.mapStyle,n=function(t){if(!t)return{symbolShape:null,symbolDef:null};var e=t.hasSymbol,r=t.hasPattern,n=t.style;if(e){var o=rt.getSymbolDef(n);return{symbolShape:o?"symbol":"rect",symbolDef:o}}return r?{symbolShape:"pattern",symbolDef:null}:"line"===n.keySymbolShape?{symbolShape:"line",symbolDef:null}:{symbolShape:"rect",symbolDef:null}}(e),o=n.symbolShape,i=n.symbolDef;return o?"symbol"===o?(0,a.jsx)(lt,{mapStyle:r,keyDefinition:e,symbolDef:i}):"pattern"===o?(0,a.jsx)(D,{mapStyle:r,keyDefinition:e}):"line"===o?(0,a.jsx)(yt,{mapStyle:r,keyDefinition:e}):(0,a.jsx)(dt,{mapStyle:r,keyDefinition:e}):null},gt=function(t){var e=t.keyDefinition,r=t.mapStyle,n=e.label,o=u(e.symbolDescription,r.id);return(0,a.jsxs)("dl",{className:"im-c-map-key__item",children:[(0,a.jsx)("dt",{className:"im-c-map-key__item-symbol",children:(0,a.jsx)(ht,{keyDefinition:e,mapStyle:r})}),(0,a.jsxs)("dd",{className:"im-c-map-key__item-label",children:[n,o&&(0,a.jsxs)("span",{className:"govuk-visually-hidden",children:["(",o,")"]})]})]})},St=function(t){var e=t.headingId,r=t.label,n=t.keyDefinitions,o=t.mapStyle;return(0,a.jsxs)("section",{className:"im-c-map-key__group","aria-labelledby":e,children:[(0,a.jsx)("h3",{id:e,className:"im-c-map-key__group-heading",children:r}),n.map(function(t){return(0,a.jsx)(gt,{keyDefinition:t,mapStyle:o},"".concat(t.id))})]})},jt="im-c-map-key",Ot=function(t){var e=t.item,r=t.mapStyle;return"group"===e.type?(0,a.jsx)(St,{headingId:"key-heading-".concat(e.id),label:e.groupLabel,keyDefinitions:e.keyDefinitions,mapStyle:r}):(0,a.jsx)(gt,{keyDefinition:e.keyDefinition,mapStyle:r})},wt=function(t){var e=t.noKeyItemText,r=t.keyGroups,n=t.hasGroups,o=t.mapStyle;if(null==r||!r.length)return(0,a.jsx)(l,{text:e});var i=n?"".concat(jt," ").concat("im-c-map-key--has-groups"):jt;return(0,a.jsx)("div",{className:i,children:r.map(function(t){return(0,a.jsx)(Ot,{item:t,mapStyle:o},t.id)})})};function kt(t,e){return function(t){if(Array.isArray(t))return t}(t)||function(t,e){var r=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=r){var n,o,i,a,l=[],c=!0,u=!1;try{if(i=(r=r.call(t)).next,0===e){if(Object(r)!==r)return;c=!1}else for(;!(c=(n=i.call(r)).done)&&(l.push(n.value),l.length!==e);c=!0);}catch(t){u=!0,o=t}finally{try{if(!c&&null!=r.return&&(a=r.return(),Object(a)!==a))return}finally{if(u)throw o}}return l}}(t,e)||function(t,e){if(t){if("string"==typeof t)return Pt(t,e);var r={}.toString.call(t).slice(8,-1);return"Object"===r&&t.constructor&&(r=t.constructor.name),"Map"===r||"Set"===r?Array.from(t):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?Pt(t,e):void 0}}(t,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function Pt(t,e){(null==e||e>t.length)&&(e=t.length);for(var r=0,n=Array(e);r<e;r++)n[r]=t[r];return n}var Ct={InitComponent:function(t){var e=t.mapState,r=t.services.eventBus;(0,n.useEffect)(function(){e.isMapReady&&r.requestOnce("datasets:registry",i)},[e.isMapReady])},panels:[{id:"mapKey",label:"Key",mobile:{slot:"drawer",modal:!0},tablet:{slot:"left-top",width:"260px"},desktop:{slot:"left-top",width:"280px"},render:function(t){var e=t.mapState.mapStyle,r=t.pluginConfig.noKeyItemText,i=t.services.eventBus,l=kt((0,n.useState)(o),2),c=l[0],u=l[1],f=kt((0,n.useState)(function(){var t;return null!==(t=null==c?void 0:c.keyItems().items)&&void 0!==t?t:[]}),2),s=f[0],y=f[1],p=kt((0,n.useState)(function(){var t;return null!==(t=null==c?void 0:c.keyItems().hasGroups)&&void 0!==t&&t}),2),m=p[0],b=p[1],v=function(){var t=c.keyItems(),e=t.items,r=t.hasGroups;y(e),b(r)},d=function(t){c.invalidateKeyItemsOnMenuStateChange(t),v()};return(0,n.useEffect)(function(){return c?(v(),i.on("menu:changed",d).on("datasets:changed",v),function(){return i.off("menu:changed",d).off("datasets:changed",v)}):(i.requestOnce("datasets:registry",u),function(){})},[c]),(0,a.jsx)(wt,{noKeyItemText:r,keyGroups:s,hasGroups:m,mapStyle:e})}}],buttons:[{id:"mapKey",panelId:"mapKey",label:"Key",iconId:"key",mobile:{slot:"top-left",showLabel:!1},tablet:{slot:"top-left",showLabel:!0},desktop:{slot:"top-left",showLabel:!0}}],icons:[{id:"key",svgContent:'<path d="M3 5h.01"/><path d="M3 12h.01"/><path d="M3 19h.01"/><path d="M8 5h13"/><path d="M8 12h13"/><path d="M8 19h13"/>'}]}}}]);

package/plugins/map-key/src/components/Key/Key.jsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react'
+import React from 'react'
 import { EmptyKey } from './EmptyKey.jsx'
 import { KeyItem } from './KeyItem.jsx'
 import { KeyGroupItem } from './KeyGroupItem.jsx'
@@ -30,8 +30,10 @@ export const Key = ({
   if (!keyGroups?.length) {
     return (<EmptyKey text={noKeyItemText} />)
   }
-  const [className, setClassName] = useState('im-c-map-key')
-  useEffect(() => setClassName(hasGroups ? `${keyClassName} ${keyGroupsClassName}` : keyClassName), [hasGroups])
+  // Pure derivation of hasGroups — computed directly during render (see KeyItem.jsx for why:
+  // staging this through useState/useEffect meant a mount with groups briefly rendered without
+  // the --has-groups modifier, using flat spacing before the effect corrected it).
+  const className = hasGroups ? `${keyClassName} ${keyGroupsClassName}` : keyClassName
 
   return (
     <div className={className}>

package/plugins/map-key/src/components/Key/Key.module.scss

@@ -16,6 +16,12 @@
   padding-bottom: 5px;
 }
 
+.im-c-map-key__empty-message {
+  margin: 0;
+  font-size: 1rem;
+  color: var(--foreground-color);
+}
+
 .im-c-map-key__group-heading {
   padding-top: 15px;
   padding-bottom: 10px;

package/plugins/map-key/src/components/Key/KeyItem.jsx

@@ -1,15 +1,12 @@
-import { useEffect, useState } from 'react'
 import { getValueForStyle } from '../../../../../src/utils/getValueForStyle.js'
 import { KeySvg } from './KeySvg.jsx'
 
 export const KeyItem = ({ keyDefinition, mapStyle }) => {
-  const [label, setLabel] = useState('')
-  const [symbolDescription, setSymbolDescription] = useState('')
-
-  useEffect(() => {
-    setLabel(keyDefinition.label)
-    setSymbolDescription(getValueForStyle(keyDefinition.symbolDescription, mapStyle.id))
-  }, [keyDefinition, mapStyle.id])
+  // Pure derivations of props — computed directly on every render rather than staged through
+  // useState/useEffect, so there's no post-mount frame where the label/description are blank
+  // (every panel reopen mounts this fresh, so that frame was visible as a flicker).
+  const label = keyDefinition.label
+  const symbolDescription = getValueForStyle(keyDefinition.symbolDescription, mapStyle.id)
 
   return (
     <dl className='im-c-map-key__item'>

package/plugins/map-key/src/components/Key/KeySvg.jsx

@@ -1,32 +1,31 @@
-import { useEffect, useState } from 'react'
 import { KeySvgPattern } from './KeySvgPattern.jsx'
 import { KeySvgSymbol } from './KeySvgSymbol.jsx'
 import { KeySvgLine } from './KeySvgLine.jsx'
 import { KeySvgRect } from './KeySvgRect.jsx'
 import { symbolRegistry } from '../../registry/index.js'
 
-export const KeySvg = ({ keyDefinition, mapStyle }) => {
-  const [symbolShape, setSymbolShape] = useState(null)
-  const [symbolDef, setSymbolDef] = useState(null)
+// Pure derivation of keyDefinition — computed directly during render (see KeyItem.jsx for why:
+// staging this through useState/useEffect meant every fresh mount painted a blank symbol first).
+const getSymbolShape = (keyDefinition) => {
+  if (!keyDefinition) {
+    return { symbolShape: null, symbolDef: null }
+  }
+  const { hasSymbol, hasPattern, style } = keyDefinition
+  if (hasSymbol) {
+    const symbolDef = symbolRegistry.getSymbolDef(style)
+    return { symbolShape: symbolDef ? 'symbol' : 'rect', symbolDef }
+  }
+  if (hasPattern) {
+    return { symbolShape: 'pattern', symbolDef: null }
+  }
+  if (style.keySymbolShape === 'line') {
+    return { symbolShape: 'line', symbolDef: null }
+  }
+  return { symbolShape: 'rect', symbolDef: null }
+}
 
-  useEffect(() => {
-    if (!keyDefinition) {
-      setSymbolShape(null)
-      return
-    }
-    const { hasSymbol, hasPattern, style } = keyDefinition
-    if (hasSymbol) {
-      const _symbolDef = symbolRegistry.getSymbolDef(style)
-      setSymbolDef(_symbolDef)
-      setSymbolShape(_symbolDef ? 'symbol' : 'rect')
-    } else if (hasPattern) {
-      setSymbolShape('pattern')
-    } else if (style.keySymbolShape === 'line') {
-      setSymbolShape('line')
-    } else {
-      setSymbolShape('rect')
-    }
-  }, [keyDefinition])
+export const KeySvg = ({ keyDefinition, mapStyle }) => {
+  const { symbolShape, symbolDef } = getSymbolShape(keyDefinition)
 
   if (!symbolShape) {
     return null

package/plugins/map-key/src/components/Key/KeySvgLine.jsx

@@ -1,16 +1,10 @@
-import { useEffect, useState } from 'react'
 import { svgProps, SVG_SIZE, SVG_CENTER } from './svgProperties.js'
 import { getValueForStyle } from '../../../../../src/utils/getValueForStyle.js'
 
 export const KeySvgLine = ({ mapStyle, keyDefinition }) => {
-  const [strokeWidth, setStrokeWidth] = useState(2)
-  const [stroke, setStroke] = useState('#ff0000')
-
-  useEffect(() => {
-    const { style } = keyDefinition
-    setStrokeWidth(style.strokeWidth)
-    setStroke(getValueForStyle(style.stroke, mapStyle.id))
-  }, [mapStyle.id, keyDefinition])
+  const { style } = keyDefinition
+  const strokeWidth = style.strokeWidth
+  const stroke = getValueForStyle(style.stroke, mapStyle.id)
 
   return (
     <svg {...svgProps}>

package/plugins/map-key/src/components/Key/KeySvgPattern.jsx

@@ -1,15 +1,10 @@
-import { useEffect, useState } from 'react'
 import { svgProps } from './svgProperties.js'
 import { patternRegistry } from '../../registry/index.js'
 const PATTERN_INSET = 2
 
 export const KeySvgPattern = ({ keyDefinition, mapStyle }) => {
-  const [paths, setPaths] = useState(null)
-
-  useEffect(() => {
-    const { style } = keyDefinition
-    setPaths(patternRegistry.getKeyPatternPaths(style, mapStyle.id))
-  }, [mapStyle.id, keyDefinition])
+  const { style } = keyDefinition
+  const paths = patternRegistry.getKeyPatternPaths(style, mapStyle.id)
 
   if (!paths) {
     return null

package/plugins/map-key/src/components/Key/KeySvgPattern.test.jsx

@@ -52,4 +52,10 @@ describe('KeySvgPattern', () => {
     const { container } = render(<KeySvgPattern {...defaultProps} />)
     expect(container.querySelector('#content-el')).toBeTruthy()
   })
+
+  it('renders nothing when getKeyPatternPaths returns falsy', () => {
+    getKeyPatternPaths.mockReturnValue(null)
+    const { container } = render(<KeySvgPattern {...defaultProps} />)
+    expect(container.firstChild).toBeNull()
+  })
 })

package/plugins/map-key/src/components/Key/KeySvgRect.jsx

@@ -1,18 +1,11 @@
-import { useEffect, useState } from 'react'
 import { getValueForStyle } from '../../../../../src/utils/getValueForStyle.js'
 import { svgProps, SVG_SIZE } from './svgProperties.js'
 
 export const KeySvgRect = ({ mapStyle, keyDefinition }) => {
-  const [strokeWidth, setStrokeWidth] = useState(2)
-  const [fill, setFill] = useState('#ff0000')
-  const [stroke, setStroke] = useState('#ff0000')
-
-  useEffect(() => {
-    const { style } = keyDefinition
-    setStrokeWidth(style.strokeWidth)
-    setFill(getValueForStyle(style.fill, mapStyle.id))
-    setStroke(getValueForStyle(style.stroke, mapStyle.id))
-  }, [mapStyle.id, keyDefinition])
+  const { style } = keyDefinition
+  const strokeWidth = style.strokeWidth
+  const fill = getValueForStyle(style.fill, mapStyle.id)
+  const stroke = getValueForStyle(style.stroke, mapStyle.id)
 
   return (
     <svg {...svgProps}>

package/plugins/map-key/src/components/Key/KeySvgSymbol.jsx

@@ -1,19 +1,13 @@
-import { useEffect, useState } from 'react'
 import { getSymbolStyleColors, getSymbolViewBox } from '../../../../../src/utils/symbolUtils.js'
 import { svgSymbolProps } from './svgProperties.js'
 import { symbolRegistry } from '../../registry/index.js'
 
 export const KeySvgSymbol = ({ keyDefinition, mapStyle, symbolDef }) => {
-  const [resolvedSvg, setResolvedSvg] = useState(null)
-  const [viewBox, setViewBox] = useState(null)
-
-  useEffect(() => {
-    const { style } = keyDefinition
-    const mapColorScheme = mapStyle?.appColorScheme ?? 'light'
-    const keyMapStyle = { ...mapStyle, mapColorScheme }
-    setResolvedSvg(symbolRegistry.resolve(symbolDef, getSymbolStyleColors(style), keyMapStyle))
-    setViewBox(getSymbolViewBox(style, symbolDef))
-  }, [mapStyle, keyDefinition])
+  const { style } = keyDefinition
+  const mapColorScheme = mapStyle?.appColorScheme ?? 'light'
+  const keyMapStyle = { ...mapStyle, mapColorScheme }
+  const resolvedSvg = symbolRegistry.resolve(symbolDef, getSymbolStyleColors(style), keyMapStyle)
+  const viewBox = getSymbolViewBox(style, symbolDef)
 
   if (!(resolvedSvg && viewBox)) {
     return null

package/plugins/map-key/src/components/Key/KeySvgSymbol.test.jsx

@@ -76,4 +76,16 @@ describe('KeySvgSymbol', () => {
     const callArg = mockResolve.mock.calls[0][2]
     expect(callArg.mapColorScheme).toBe('dark')
   })
+
+  it('renders nothing when resolve returns falsy', () => {
+    mockResolve.mockReturnValue(null)
+    const { container } = render(<KeySvgSymbol {...defaultProps} />)
+    expect(container.firstChild).toBeNull()
+  })
+
+  it('renders nothing when getSymbolViewBox returns falsy', () => {
+    getSymbolViewBox.mockReturnValue(null)
+    const { container } = render(<KeySvgSymbol {...defaultProps} />)
+    expect(container.firstChild).toBeNull()
+  })
 })

package/plugins/map-key/src/components/Key/MapKey.jsx

@@ -8,9 +8,12 @@ export function MapKey ({
   pluginConfig: { noKeyItemText },
   services: { eventBus }
 }) {
-  const [keyGroups, setKeyGroups] = useState([])
-  const [hasGroups, setHasGroups] = useState(false)
   const [datasetRegistry, setDatasetRegistry] = useState(getDatasetRegistry())
+  // Lazily seed from the registry (already populated whenever the key is opened after
+  // datasets:ready) so the first paint shows real content instead of flashing the empty
+  // state while the effect below catches up on the next tick.
+  const [keyGroups, setKeyGroups] = useState(() => datasetRegistry?.keyItems().items ?? [])
+  const [hasGroups, setHasGroups] = useState(() => datasetRegistry?.keyItems().hasGroups ?? false)
 
   const getKeyItems = () => {
     const { items, hasGroups: _hasGroups } = datasetRegistry.keyItems()

package/plugins/map-key/src/components/Key/MapKey.test.jsx

@@ -6,16 +6,21 @@ jest.mock('../../registry/index.js', () => ({
   getDatasetRegistry: jest.fn()
 }))
 
+// eslint-disable-next-line no-var -- jest.mock factories may only reference vars prefixed "mock"
+var mockKeyRenderCount = 0
 jest.mock('./Key.jsx', () => ({
-  Key: ({ noKeyItemText, keyGroups, hasGroups, mapStyle }) => (
-    <div
-      data-testid='key'
-      data-no-key-item-text={noKeyItemText}
-      data-has-groups={String(hasGroups)}
-      data-map-style-id={mapStyle.id}
-      data-key-groups-length={keyGroups.length}
-    />
-  )
+  Key: ({ noKeyItemText, keyGroups, hasGroups, mapStyle }) => {
+    mockKeyRenderCount++
+    return (
+      <div
+        data-testid='key'
+        data-no-key-item-text={noKeyItemText}
+        data-has-groups={String(hasGroups)}
+        data-map-style-id={mapStyle.id}
+        data-key-groups-length={keyGroups.length}
+      />
+    )
+  }
 }))
 
 const makeEventBus = () => {
@@ -44,6 +49,7 @@ const baseProps = () => ({
 beforeEach(() => {
   jest.clearAllMocks()
   eventBus = makeEventBus()
+  mockKeyRenderCount = 0
 })
 
 describe('MapKey', () => {
@@ -84,6 +90,15 @@ describe('MapKey', () => {
       expect(getByTestId('key').dataset.hasGroups).toBe('true')
     })
 
+    // Regression: when the registry is already populated at mount (e.g. reopening the key
+    // panel after datasets:ready), Key must render with real data straight away rather than
+    // painting the empty state first and flashing to the real content once the mount effect
+    // catches up — see MapKey.jsx's lazy useState initializers.
+    it('renders Key only once, already carrying the real items, instead of flashing empty first', () => {
+      render(<MapKey {...baseProps()} />)
+      expect(mockKeyRenderCount).toBe(1)
+    })
+
     it('registers menu:changed and datasets:changed listeners', () => {
       render(<MapKey {...baseProps()} />)
       expect(eventBus.on).toHaveBeenCalledWith('menu:changed', expect.any(Function))
@@ -99,18 +114,20 @@ describe('MapKey', () => {
 
     it('refreshes key items when datasets:changed fires', () => {
       render(<MapKey {...baseProps()} />)
+      const callsAtMount = registry.keyItems.mock.calls.length
       const onDatasetsChanged = eventBus.on.mock.calls.find(([e]) => e === 'datasets:changed')[1]
       act(() => { onDatasetsChanged() })
-      expect(registry.keyItems).toHaveBeenCalledTimes(2)
+      expect(registry.keyItems).toHaveBeenCalledTimes(callsAtMount + 1)
     })
 
     it('invalidates and refreshes key items when menu:changed fires', () => {
       render(<MapKey {...baseProps()} />)
+      const callsAtMount = registry.keyItems.mock.calls.length
       const onMenuChanged = eventBus.on.mock.calls.find(([e]) => e === 'menu:changed')[1]
       const menuState = { someKey: 'value' }
       act(() => { onMenuChanged(menuState) })
       expect(registry.invalidateKeyItemsOnMenuStateChange).toHaveBeenCalledWith(menuState)
-      expect(registry.keyItems).toHaveBeenCalledTimes(2)
+      expect(registry.keyItems).toHaveBeenCalledTimes(callsAtMount + 1)
     })
   })
 

package/src/App/components/KeyboardHelp/KeyboardHelp.jsx

@@ -3,6 +3,9 @@ import React from 'react'
 import { useConfig } from '../../store/configContext'
 import { useApp } from '../../store/appContext.js'
 import { Tabs } from '../Tabs/Tabs.jsx'
+import { groupIntoTabs } from '../../renderer/groupIntoTabs.js'
+
+const DEFAULT_GROUP = 'Navigate'
 
 const ShortcutList = ({ items }) => (
   <dl className='im-c-keyboard-help__list'>
@@ -15,26 +18,22 @@ const ShortcutList = ({ items }) => (
   </dl>
 )
 
-const buildGroupMap = (shortcuts) => shortcuts.reduce((acc, shortcut) => {
-  const group = shortcut.group || 'Navigate'
-  if (!acc[group]) {
-    acc[group] = []
-  }
-  acc[group].push(shortcut)
-  return acc
-}, {})
-
-const getDefaultTab = (groupEntries, context) => {
-  const exactMatch = groupEntries.find(([, items]) =>
-    items.some(s => (s.context ?? 'viewport') === context)
+/**
+ * Picks which tab should be active on open: the first tab containing a shortcut whose own
+ * context matches exactly, else the first tab containing a global-context shortcut, else
+ * just the first tab. Domain-specific to keyboard shortcuts — not part of groupIntoTabs.
+ */
+const getDefaultTab = (tabs, context) => {
+  const exactMatch = tabs.find(tab =>
+    tab.items.some(({ shortcut }) => (shortcut.context ?? 'viewport') === context)
   )
   if (exactMatch) {
-    return exactMatch[0]
+    return exactMatch.name
   }
-  const globalMatch = groupEntries.find(([, items]) =>
-    items.some(s => s.context === 'global')
+  const globalMatch = tabs.find(tab =>
+    tab.items.some(({ shortcut }) => shortcut.context === 'global')
   )
-  return globalMatch?.[0] ?? groupEntries[0][0]
+  return globalMatch?.name ?? tabs[0].name
 }
 
 // eslint-disable-next-line camelcase, react/jsx-pascal-case
@@ -46,10 +45,13 @@ export const KeyboardHelp = ({ context = 'viewport' }) => { // NOSONAR: project
   const shortcuts = listboxIsActive
     ? allShortcuts
     : allShortcuts.filter(s => s.context !== 'listbox')
-  const groupMap = buildGroupMap(shortcuts)
-  const groupEntries = Object.entries(groupMap)
 
-  if (groupEntries.length <= 1) {
+  const tabs = groupIntoTabs({
+    items: shortcuts.map(shortcut => ({ id: shortcut.id, order: 0, tab: shortcut.group, shortcut })),
+    fallbackLabel: DEFAULT_GROUP
+  })
+
+  if (!tabs) {
     return (
       <div className='im-c-keyboard-help'>
         <ShortcutList items={shortcuts} />
@@ -57,14 +59,14 @@ export const KeyboardHelp = ({ context = 'viewport' }) => { // NOSONAR: project
     )
   }
 
-  const tabs = groupEntries.map(([name, items]) => ({
-    name,
-    content: <ShortcutList items={items} />
+  const tabProps = tabs.map(tab => ({
+    name: tab.name,
+    content: <ShortcutList items={tab.items.map(({ shortcut }) => shortcut)} />
   }))
 
   return (
     <div className='im-c-keyboard-help'>
-      <Tabs tabs={tabs} defaultTab={getDefaultTab(groupEntries, context)} />
+      <Tabs tabs={tabProps} defaultTab={getDefaultTab(tabs, context)} />
     </div>
   )
 }