@guardian/interactive-component-library 0.1.0-alpha.10

package/dist/interactive-component-library.umd.cjs

@@ -0,0 +1,2977 @@
+(function(global2, factory) {
+  typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("preact/jsx-runtime"), require("preact/hooks"), require("preact/compat"), require("preact"), require("d3-scale"), require("d3-geo")) : typeof define === "function" && define.amd ? define(["exports", "preact/jsx-runtime", "preact/hooks", "preact/compat", "preact", "d3-scale", "d3-geo"], factory) : (global2 = typeof globalThis !== "undefined" ? globalThis : global2 || self, factory(global2["interactive-component-library"] = {}, global2["preact/jsx-runtime"], global2["preact/hooks"], global2["preact/compat"], global2.preact, global2["d3-scale"], global2["d3-geo"]));
+})(this, function(exports2, jsxRuntime, hooks, compat, preact, d3Scale, d3Geo) {
+  "use strict";
+  const main = "";
+  const group = "_group_nq9z3_1";
+  const rotated = "_rotated_nq9z3_6";
+  const path$4 = "_path_nq9z3_10";
+  const active = "_active_nq9z3_14";
+  const defaultStyles$q = {
+    group,
+    rotated,
+    path: path$4,
+    active
+  };
+  function mergeStyles(firstStyle, secondStyle) {
+    if (!secondStyle)
+      return firstStyle;
+    if (typeof firstStyle === "string") {
+      if (typeof secondStyle !== "string") {
+        throw new Error("Styles to merge must be of the same type");
+      }
+      return firstStyle.concat(" ", secondStyle);
+    }
+    const allKeys = /* @__PURE__ */ new Set([...Object.keys(firstStyle), ...Object.keys(secondStyle)]);
+    const merged = Array.from(allKeys).reduce((result, key) => {
+      const classNames = [];
+      if (firstStyle && key in firstStyle) {
+        classNames.push(firstStyle[key]);
+      }
+      if (secondStyle && key in secondStyle) {
+        classNames.push(secondStyle[key]);
+      }
+      result[key] = classNames.join(" ");
+      return result;
+    }, {});
+    return merged;
+  }
+  const DIRECTION = {
+    up: "up",
+    down: "down"
+  };
+  function Chevron({
+    active: active2 = false,
+    direction = DIRECTION.down,
+    styles: styles2
+  }) {
+    const defaultStylesCopy = {
+      ...defaultStyles$q
+    };
+    if (active2) {
+      defaultStylesCopy.path = mergeStyles(defaultStyles$q.path, defaultStyles$q.active);
+    }
+    if (direction === DIRECTION.up) {
+      defaultStylesCopy.group = mergeStyles(defaultStyles$q.group, defaultStyles$q.rotated);
+    }
+    styles2 = mergeStyles(defaultStylesCopy, styles2);
+    return jsxRuntime.jsx("svg", {
+      width: "16",
+      height: "24",
+      viewBox: "0 0 16 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: jsxRuntime.jsx("g", {
+        className: styles2.group,
+        style: "transform-box: fill-box;",
+        children: jsxRuntime.jsx("path", {
+          "fill-rule": "evenodd",
+          "clip-rule": "evenodd",
+          d: "M7.80569 10.7123L11.6344 15H12.365L16.1938 10.7123L15.4997 10L11.9997 13L8.49976 10L7.80569 10.7123Z",
+          className: styles2.path
+        })
+      })
+    });
+  }
+  const container$4 = "_container_jzalm_1";
+  const dot = "_dot_jzalm_6";
+  const circle$1 = "_circle_jzalm_13";
+  const text$4 = "_text_jzalm_17";
+  const defaultStyles$p = {
+    container: container$4,
+    dot,
+    circle: circle$1,
+    text: text$4
+  };
+  const DOT_TYPE = {
+    round: "round",
+    square: "square"
+  };
+  const LegendItem = ({
+    dotType = DOT_TYPE.round,
+    text: text2,
+    styles: styles2,
+    abbreviation
+  }) => {
+    const defaultStylesCopy = {
+      ...defaultStyles$p
+    };
+    if (dotType === DOT_TYPE.round) {
+      defaultStylesCopy.dot = mergeStyles(defaultStyles$p.dot, defaultStyles$p.circle);
+    }
+    styles2 = mergeStyles(defaultStylesCopy, styles2);
+    return jsxRuntime.jsxs("div", {
+      className: styles2.container,
+      children: [jsxRuntime.jsx("span", {
+        className: `${styles2.dot} bg-color--${abbreviation}`
+      }), jsxRuntime.jsx("p", {
+        className: styles2.text,
+        children: text2
+      })]
+    });
+  };
+  function isDarkColor(color) {
+    let r, g, b;
+    if (color.match(/^rgb/)) {
+      color = color.match(/^rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*(\d+(?:\.\d+)?))?\)$/);
+      r = color[1];
+      g = color[2];
+      b = color[3];
+    } else {
+      color = +`0x${color.slice(1).replace(color.length < 5 && /./g, "$&$&")}`;
+      r = color >> 16;
+      g = color >> 8 & 255;
+      b = color & 255;
+    }
+    const hsp = Math.sqrt(0.299 * (r * r) + 0.587 * (g * g) + 0.114 * (b * b));
+    if (hsp > 140) {
+      return false;
+    }
+    return true;
+  }
+  const bar$2 = "_bar_wmb0k_1";
+  const label$1 = "_label_wmb0k_5";
+  const backgroundRect = "_backgroundRect_wmb0k_11";
+  const defaultStyles$o = {
+    bar: bar$2,
+    label: label$1,
+    backgroundRect
+  };
+  function StackedBar({
+    stack,
+    width,
+    height,
+    showBackgroundRect = false,
+    createSVG = true,
+    styles: styles2
+  }) {
+    const rectElements = hooks.useRef([]);
+    const textElements = hooks.useRef([]);
+    const [hideLabels, setHideLabels] = hooks.useState(true);
+    hooks.useLayoutEffect(() => {
+      for (let index2 = 0; index2 < stack.length; index2++) {
+        const rectElement = rectElements.current[index2];
+        const textElement = textElements.current[index2];
+        const paddingX = 8;
+        const hideText = textElement.getBBox().width + paddingX > rectElement.getBBox().width;
+        const rectStyle = window.getComputedStyle(rectElement);
+        const rectColor = rectStyle.getPropertyValue("fill");
+        const textColor = isDarkColor(rectColor) ? "#FFF" : "#121212";
+        textElement.style.fill = textColor;
+        if (hideText) {
+          setHideLabels(true);
+          return;
+        }
+      }
+      setHideLabels(false);
+    }, [stack, width, height]);
+    styles2 = mergeStyles({
+      ...defaultStyles$o
+    }, styles2);
+    let totalWidth = 0;
+    const content2 = stack.map((d2, index2) => {
+      const itemWidth = d2.fraction * width;
+      const value = jsxRuntime.jsxs("g", {
+        transform: `translate(${totalWidth}, 0)`,
+        children: [jsxRuntime.jsx("rect", {
+          ref: (element) => rectElements.current[index2] = element,
+          width: itemWidth,
+          height,
+          className: `${styles2.bar} fill-color--${d2.abbreviation}`,
+          style: {
+            fill: d2.fill
+          },
+          "shape-rendering": "crispEdges"
+        }), jsxRuntime.jsx("text", {
+          ref: (element) => textElements.current[index2] = element,
+          x: itemWidth - 4,
+          y: height / 2,
+          "text-anchor": "end",
+          "alignment-baseline": "central",
+          "text-rendering": "optimizeLegibility",
+          className: styles2.label,
+          style: {
+            visibility: hideLabels ? "hidden" : "visible"
+          },
+          children: d2.label
+        })]
+      }, index2);
+      totalWidth += itemWidth;
+      return value;
+    });
+    const backgroundRect2 = jsxRuntime.jsx("g", {
+      children: jsxRuntime.jsx("rect", {
+        x: "0",
+        y: "0",
+        height,
+        width,
+        className: styles2.backgroundRect
+      })
+    });
+    if (createSVG) {
+      return jsxRuntime.jsxs("svg", {
+        overflow: "hidden",
+        width,
+        height,
+        viewBox: `0 0 ${width} ${height}`,
+        xmlns: "http://www.w3.org/2000/svg",
+        children: [showBackgroundRect && backgroundRect2, content2]
+      });
+    }
+    return jsxRuntime.jsx(jsxRuntime.Fragment, {
+      children: content2
+    });
+  }
+  const svg$7 = "_svg_un4gp_1";
+  const previous = "_previous_un4gp_7";
+  const next = "_next_un4gp_11";
+  const defaultStyles$n = {
+    svg: svg$7,
+    previous,
+    next
+  };
+  const GradientIcon = ({
+    previous: previous2,
+    next: next2,
+    styles: styles2
+  }) => {
+    styles2 = mergeStyles({
+      ...defaultStyles$n
+    }, styles2);
+    const gradientId = hooks.useId();
+    return jsxRuntime.jsxs("svg", {
+      class: styles2.svg,
+      width: "24",
+      height: "11",
+      viewBox: "0 0 24 11",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [jsxRuntime.jsx("path", {
+        d: "M0 5.434C0 2.43288 2.43288 0 5.434 0H5.69626C6.85818 0 7.9797 0.426401 8.84813 1.19834C10.6456 2.79612 13.3544 2.79612 15.1519 1.19834C16.0203 0.426401 17.1418 0 18.3037 0L18.566 0C21.5671 0 24 2.43288 24 5.434V5.566C24 8.56712 21.5671 11 18.566 11H18.3037C17.1418 11 16.0203 10.5736 15.1519 9.80166C13.3544 8.20388 10.6456 8.20388 8.84813 9.80166C7.9797 10.5736 6.85818 11 5.69626 11H5.434C2.43288 11 0 8.56712 0 5.566V5.434Z",
+        fill: `url(#${gradientId})`
+      }), jsxRuntime.jsx("defs", {
+        children: jsxRuntime.jsxs("linearGradient", {
+          id: gradientId,
+          x1: "5.5",
+          y1: "5.5",
+          x2: "12",
+          y2: "5.5",
+          gradientUnits: "userSpaceOnUse",
+          children: [jsxRuntime.jsx("stop", {
+            class: `${styles2.previous} stop-color--${previous2}`
+          }), jsxRuntime.jsx("stop", {
+            class: `${styles2.next} stop-color--${next2}`,
+            offset: "1"
+          })]
+        })
+      })]
+    });
+  };
+  const button$4 = "_button_kpmyt_1";
+  const svg$6 = "_svg_kpmyt_14";
+  const defaultStyles$m = {
+    button: button$4,
+    svg: svg$6
+  };
+  const InfoButton = ({
+    onClick,
+    styles: styles2
+  }) => {
+    styles2 = mergeStyles({
+      ...defaultStyles$m
+    }, styles2);
+    return jsxRuntime.jsx("button", {
+      class: styles2.button,
+      onClick,
+      children: jsxRuntime.jsx("svg", {
+        class: styles2.svg,
+        viewBox: "0 0 5 13",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: jsxRuntime.jsx("path", {
+          d: "m3.72905 10.8229v.5256c-.11944.0955-.28666.1672-.45388.2628-.16723.0716-.35834.1433-.54945.215-.19111.0716-.38222.1194-.57333.1433s-.38222.0478-.54945.0478c-.38222 0-.621109-.0717-.764442-.215-.167222-.1434-.238889-.3106-.238889-.4778 0-.1911.023889-.3822.047778-.5733s.071667-.3823.119445-.6211l1.003328-4.56282-.931662-.215v-.50167c.143333-.04777.334442-.11944.597222-.19111.23889-.07166.50167-.11944.78833-.16722.28667-.04778.54945-.09556.81223-.11944.26277-.02389.50166-.04778.71666-.04778l.26278.16722-1.33778 6.33052zm.45389-8.02663c-.215.19111-.52555.28667-.88389.28667-.33444 0-.62111-.09556-.86-.28667-.215-.19111-.33444-.43-.33444-.74056 0-.33444.11944-.59722.33444-.78833s.50167-.286667.86-.286667c.38223 0 .66889.095557.88389.286667s.33445.45389.33445.78833c-.02389.31056-.11945.54945-.33445.74056z"
+        })
+      })
+    });
+  };
+  const circleicon = "_circleicon_1ge2m_1";
+  const rect = "_rect_1ge2m_7";
+  const defaultStyles$l = {
+    circleicon,
+    rect
+  };
+  const CircleIcon = ({
+    abbreviation,
+    styles: styles2
+  }) => {
+    styles2 = mergeStyles({
+      ...defaultStyles$l
+    }, styles2);
+    return jsxRuntime.jsx("svg", {
+      style: styles2.circleicon,
+      fill: "none",
+      height: "11",
+      viewBox: "0 0 11 11",
+      width: "11",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: jsxRuntime.jsx("rect", {
+        class: `${styles2.rect}  fill-color--${abbreviation}`,
+        height: "11",
+        rx: "5.5",
+        width: "11"
+      })
+    });
+  };
+  const text$3 = "_text_1okyv_1";
+  const defaultStyles$k = {
+    text: text$3
+  };
+  var commonjsGlobal = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
+  function getDefaultExportFromCjs(x) {
+    return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, "default") ? x["default"] : x;
+  }
+  var dayjs_min = { exports: {} };
+  (function(module2, exports3) {
+    !function(t, e) {
+      module2.exports = e();
+    }(commonjsGlobal, function() {
+      var t = 1e3, e = 6e4, n2 = 36e5, r = "millisecond", i = "second", s2 = "minute", u2 = "hour", a = "day", o = "week", c2 = "month", f = "quarter", h = "year", d2 = "date", l = "Invalid Date", $ = /^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/, y = /\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g, M = { name: "en", weekdays: "Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"), months: "January_February_March_April_May_June_July_August_September_October_November_December".split("_"), ordinal: function(t2) {
+        var e2 = ["th", "st", "nd", "rd"], n3 = t2 % 100;
+        return "[" + t2 + (e2[(n3 - 20) % 10] || e2[n3] || e2[0]) + "]";
+      } }, m = function(t2, e2, n3) {
+        var r2 = String(t2);
+        return !r2 || r2.length >= e2 ? t2 : "" + Array(e2 + 1 - r2.length).join(n3) + t2;
+      }, v = { s: m, z: function(t2) {
+        var e2 = -t2.utcOffset(), n3 = Math.abs(e2), r2 = Math.floor(n3 / 60), i2 = n3 % 60;
+        return (e2 <= 0 ? "+" : "-") + m(r2, 2, "0") + ":" + m(i2, 2, "0");
+      }, m: function t2(e2, n3) {
+        if (e2.date() < n3.date())
+          return -t2(n3, e2);
+        var r2 = 12 * (n3.year() - e2.year()) + (n3.month() - e2.month()), i2 = e2.clone().add(r2, c2), s3 = n3 - i2 < 0, u3 = e2.clone().add(r2 + (s3 ? -1 : 1), c2);
+        return +(-(r2 + (n3 - i2) / (s3 ? i2 - u3 : u3 - i2)) || 0);
+      }, a: function(t2) {
+        return t2 < 0 ? Math.ceil(t2) || 0 : Math.floor(t2);
+      }, p: function(t2) {
+        return { M: c2, y: h, w: o, d: a, D: d2, h: u2, m: s2, s: i, ms: r, Q: f }[t2] || String(t2 || "").toLowerCase().replace(/s$/, "");
+      }, u: function(t2) {
+        return void 0 === t2;
+      } }, g = "en", D = {};
+      D[g] = M;
+      var p2 = "$isDayjsObject", S = function(t2) {
+        return t2 instanceof _2 || !(!t2 || !t2[p2]);
+      }, w = function t2(e2, n3, r2) {
+        var i2;
+        if (!e2)
+          return g;
+        if ("string" == typeof e2) {
+          var s3 = e2.toLowerCase();
+          D[s3] && (i2 = s3), n3 && (D[s3] = n3, i2 = s3);
+          var u3 = e2.split("-");
+          if (!i2 && u3.length > 1)
+            return t2(u3[0]);
+        } else {
+          var a2 = e2.name;
+          D[a2] = e2, i2 = a2;
+        }
+        return !r2 && i2 && (g = i2), i2 || !r2 && g;
+      }, O = function(t2, e2) {
+        if (S(t2))
+          return t2.clone();
+        var n3 = "object" == typeof e2 ? e2 : {};
+        return n3.date = t2, n3.args = arguments, new _2(n3);
+      }, b = v;
+      b.l = w, b.i = S, b.w = function(t2, e2) {
+        return O(t2, { locale: e2.$L, utc: e2.$u, x: e2.$x, $offset: e2.$offset });
+      };
+      var _2 = function() {
+        function M2(t2) {
+          this.$L = w(t2.locale, null, true), this.parse(t2), this.$x = this.$x || t2.x || {}, this[p2] = true;
+        }
+        var m2 = M2.prototype;
+        return m2.parse = function(t2) {
+          this.$d = function(t3) {
+            var e2 = t3.date, n3 = t3.utc;
+            if (null === e2)
+              return /* @__PURE__ */ new Date(NaN);
+            if (b.u(e2))
+              return /* @__PURE__ */ new Date();
+            if (e2 instanceof Date)
+              return new Date(e2);
+            if ("string" == typeof e2 && !/Z$/i.test(e2)) {
+              var r2 = e2.match($);
+              if (r2) {
+                var i2 = r2[2] - 1 || 0, s3 = (r2[7] || "0").substring(0, 3);
+                return n3 ? new Date(Date.UTC(r2[1], i2, r2[3] || 1, r2[4] || 0, r2[5] || 0, r2[6] || 0, s3)) : new Date(r2[1], i2, r2[3] || 1, r2[4] || 0, r2[5] || 0, r2[6] || 0, s3);
+              }
+            }
+            return new Date(e2);
+          }(t2), this.init();
+        }, m2.init = function() {
+          var t2 = this.$d;
+          this.$y = t2.getFullYear(), this.$M = t2.getMonth(), this.$D = t2.getDate(), this.$W = t2.getDay(), this.$H = t2.getHours(), this.$m = t2.getMinutes(), this.$s = t2.getSeconds(), this.$ms = t2.getMilliseconds();
+        }, m2.$utils = function() {
+          return b;
+        }, m2.isValid = function() {
+          return !(this.$d.toString() === l);
+        }, m2.isSame = function(t2, e2) {
+          var n3 = O(t2);
+          return this.startOf(e2) <= n3 && n3 <= this.endOf(e2);
+        }, m2.isAfter = function(t2, e2) {
+          return O(t2) < this.startOf(e2);
+        }, m2.isBefore = function(t2, e2) {
+          return this.endOf(e2) < O(t2);
+        }, m2.$g = function(t2, e2, n3) {
+          return b.u(t2) ? this[e2] : this.set(n3, t2);
+        }, m2.unix = function() {
+          return Math.floor(this.valueOf() / 1e3);
+        }, m2.valueOf = function() {
+          return this.$d.getTime();
+        }, m2.startOf = function(t2, e2) {
+          var n3 = this, r2 = !!b.u(e2) || e2, f2 = b.p(t2), l2 = function(t3, e3) {
+            var i2 = b.w(n3.$u ? Date.UTC(n3.$y, e3, t3) : new Date(n3.$y, e3, t3), n3);
+            return r2 ? i2 : i2.endOf(a);
+          }, $2 = function(t3, e3) {
+            return b.w(n3.toDate()[t3].apply(n3.toDate("s"), (r2 ? [0, 0, 0, 0] : [23, 59, 59, 999]).slice(e3)), n3);
+          }, y2 = this.$W, M3 = this.$M, m3 = this.$D, v2 = "set" + (this.$u ? "UTC" : "");
+          switch (f2) {
+            case h:
+              return r2 ? l2(1, 0) : l2(31, 11);
+            case c2:
+              return r2 ? l2(1, M3) : l2(0, M3 + 1);
+            case o:
+              var g2 = this.$locale().weekStart || 0, D2 = (y2 < g2 ? y2 + 7 : y2) - g2;
+              return l2(r2 ? m3 - D2 : m3 + (6 - D2), M3);
+            case a:
+            case d2:
+              return $2(v2 + "Hours", 0);
+            case u2:
+              return $2(v2 + "Minutes", 1);
+            case s2:
+              return $2(v2 + "Seconds", 2);
+            case i:
+              return $2(v2 + "Milliseconds", 3);
+            default:
+              return this.clone();
+          }
+        }, m2.endOf = function(t2) {
+          return this.startOf(t2, false);
+        }, m2.$set = function(t2, e2) {
+          var n3, o2 = b.p(t2), f2 = "set" + (this.$u ? "UTC" : ""), l2 = (n3 = {}, n3[a] = f2 + "Date", n3[d2] = f2 + "Date", n3[c2] = f2 + "Month", n3[h] = f2 + "FullYear", n3[u2] = f2 + "Hours", n3[s2] = f2 + "Minutes", n3[i] = f2 + "Seconds", n3[r] = f2 + "Milliseconds", n3)[o2], $2 = o2 === a ? this.$D + (e2 - this.$W) : e2;
+          if (o2 === c2 || o2 === h) {
+            var y2 = this.clone().set(d2, 1);
+            y2.$d[l2]($2), y2.init(), this.$d = y2.set(d2, Math.min(this.$D, y2.daysInMonth())).$d;
+          } else
+            l2 && this.$d[l2]($2);
+          return this.init(), this;
+        }, m2.set = function(t2, e2) {
+          return this.clone().$set(t2, e2);
+        }, m2.get = function(t2) {
+          return this[b.p(t2)]();
+        }, m2.add = function(r2, f2) {
+          var d3, l2 = this;
+          r2 = Number(r2);
+          var $2 = b.p(f2), y2 = function(t2) {
+            var e2 = O(l2);
+            return b.w(e2.date(e2.date() + Math.round(t2 * r2)), l2);
+          };
+          if ($2 === c2)
+            return this.set(c2, this.$M + r2);
+          if ($2 === h)
+            return this.set(h, this.$y + r2);
+          if ($2 === a)
+            return y2(1);
+          if ($2 === o)
+            return y2(7);
+          var M3 = (d3 = {}, d3[s2] = e, d3[u2] = n2, d3[i] = t, d3)[$2] || 1, m3 = this.$d.getTime() + r2 * M3;
+          return b.w(m3, this);
+        }, m2.subtract = function(t2, e2) {
+          return this.add(-1 * t2, e2);
+        }, m2.format = function(t2) {
+          var e2 = this, n3 = this.$locale();
+          if (!this.isValid())
+            return n3.invalidDate || l;
+          var r2 = t2 || "YYYY-MM-DDTHH:mm:ssZ", i2 = b.z(this), s3 = this.$H, u3 = this.$m, a2 = this.$M, o2 = n3.weekdays, c3 = n3.months, f2 = n3.meridiem, h2 = function(t3, n4, i3, s4) {
+            return t3 && (t3[n4] || t3(e2, r2)) || i3[n4].slice(0, s4);
+          }, d3 = function(t3) {
+            return b.s(s3 % 12 || 12, t3, "0");
+          }, $2 = f2 || function(t3, e3, n4) {
+            var r3 = t3 < 12 ? "AM" : "PM";
+            return n4 ? r3.toLowerCase() : r3;
+          };
+          return r2.replace(y, function(t3, r3) {
+            return r3 || function(t4) {
+              switch (t4) {
+                case "YY":
+                  return String(e2.$y).slice(-2);
+                case "YYYY":
+                  return b.s(e2.$y, 4, "0");
+                case "M":
+                  return a2 + 1;
+                case "MM":
+                  return b.s(a2 + 1, 2, "0");
+                case "MMM":
+                  return h2(n3.monthsShort, a2, c3, 3);
+                case "MMMM":
+                  return h2(c3, a2);
+                case "D":
+                  return e2.$D;
+                case "DD":
+                  return b.s(e2.$D, 2, "0");
+                case "d":
+                  return String(e2.$W);
+                case "dd":
+                  return h2(n3.weekdaysMin, e2.$W, o2, 2);
+                case "ddd":
+                  return h2(n3.weekdaysShort, e2.$W, o2, 3);
+                case "dddd":
+                  return o2[e2.$W];
+                case "H":
+                  return String(s3);
+                case "HH":
+                  return b.s(s3, 2, "0");
+                case "h":
+                  return d3(1);
+                case "hh":
+                  return d3(2);
+                case "a":
+                  return $2(s3, u3, true);
+                case "A":
+                  return $2(s3, u3, false);
+                case "m":
+                  return String(u3);
+                case "mm":
+                  return b.s(u3, 2, "0");
+                case "s":
+                  return String(e2.$s);
+                case "ss":
+                  return b.s(e2.$s, 2, "0");
+                case "SSS":
+                  return b.s(e2.$ms, 3, "0");
+                case "Z":
+                  return i2;
+              }
+              return null;
+            }(t3) || i2.replace(":", "");
+          });
+        }, m2.utcOffset = function() {
+          return 15 * -Math.round(this.$d.getTimezoneOffset() / 15);
+        }, m2.diff = function(r2, d3, l2) {
+          var $2, y2 = this, M3 = b.p(d3), m3 = O(r2), v2 = (m3.utcOffset() - this.utcOffset()) * e, g2 = this - m3, D2 = function() {
+            return b.m(y2, m3);
+          };
+          switch (M3) {
+            case h:
+              $2 = D2() / 12;
+              break;
+            case c2:
+              $2 = D2();
+              break;
+            case f:
+              $2 = D2() / 3;
+              break;
+            case o:
+              $2 = (g2 - v2) / 6048e5;
+              break;
+            case a:
+              $2 = (g2 - v2) / 864e5;
+              break;
+            case u2:
+              $2 = g2 / n2;
+              break;
+            case s2:
+              $2 = g2 / e;
+              break;
+            case i:
+              $2 = g2 / t;
+              break;
+            default:
+              $2 = g2;
+          }
+          return l2 ? $2 : b.a($2);
+        }, m2.daysInMonth = function() {
+          return this.endOf(c2).$D;
+        }, m2.$locale = function() {
+          return D[this.$L];
+        }, m2.locale = function(t2, e2) {
+          if (!t2)
+            return this.$L;
+          var n3 = this.clone(), r2 = w(t2, e2, true);
+          return r2 && (n3.$L = r2), n3;
+        }, m2.clone = function() {
+          return b.w(this.$d, this);
+        }, m2.toDate = function() {
+          return new Date(this.valueOf());
+        }, m2.toJSON = function() {
+          return this.isValid() ? this.toISOString() : null;
+        }, m2.toISOString = function() {
+          return this.$d.toISOString();
+        }, m2.toString = function() {
+          return this.$d.toUTCString();
+        }, M2;
+      }(), k = _2.prototype;
+      return O.prototype = k, [["$ms", r], ["$s", i], ["$m", s2], ["$H", u2], ["$W", a], ["$M", c2], ["$y", h], ["$D", d2]].forEach(function(t2) {
+        k[t2[1]] = function(e2) {
+          return this.$g(e2, t2[0], t2[1]);
+        };
+      }), O.extend = function(t2, e2) {
+        return t2.$i || (t2(e2, _2, O), t2.$i = true), O;
+      }, O.locale = w, O.isDayjs = S, O.unix = function(t2) {
+        return O(1e3 * t2);
+      }, O.en = D[g], O.Ls = D, O.p = {}, O;
+    });
+  })(dayjs_min);
+  var dayjs_minExports = dayjs_min.exports;
+  const dayjs = /* @__PURE__ */ getDefaultExportFromCjs(dayjs_minExports);
+  var relativeTime$1 = { exports: {} };
+  (function(module2, exports3) {
+    !function(r, e) {
+      module2.exports = e();
+    }(commonjsGlobal, function() {
+      return function(r, e, t) {
+        r = r || {};
+        var n2 = e.prototype, o = { future: "in %s", past: "%s ago", s: "a few seconds", m: "a minute", mm: "%d minutes", h: "an hour", hh: "%d hours", d: "a day", dd: "%d days", M: "a month", MM: "%d months", y: "a year", yy: "%d years" };
+        function i(r2, e2, t2, o2) {
+          return n2.fromToBase(r2, e2, t2, o2);
+        }
+        t.en.relativeTime = o, n2.fromToBase = function(e2, n3, i2, d3, u2) {
+          for (var f, a, s2, l = i2.$locale().relativeTime || o, h = r.thresholds || [{ l: "s", r: 44, d: "second" }, { l: "m", r: 89 }, { l: "mm", r: 44, d: "minute" }, { l: "h", r: 89 }, { l: "hh", r: 21, d: "hour" }, { l: "d", r: 35 }, { l: "dd", r: 25, d: "day" }, { l: "M", r: 45 }, { l: "MM", r: 10, d: "month" }, { l: "y", r: 17 }, { l: "yy", d: "year" }], m = h.length, c2 = 0; c2 < m; c2 += 1) {
+            var y = h[c2];
+            y.d && (f = d3 ? t(e2).diff(i2, y.d, true) : i2.diff(e2, y.d, true));
+            var p2 = (r.rounding || Math.round)(Math.abs(f));
+            if (s2 = f > 0, p2 <= y.r || !y.r) {
+              p2 <= 1 && c2 > 0 && (y = h[c2 - 1]);
+              var v = l[y.l];
+              u2 && (p2 = u2("" + p2)), a = "string" == typeof v ? v.replace("%d", p2) : v(p2, n3, y.l, s2);
+              break;
+            }
+          }
+          if (n3)
+            return a;
+          var M = s2 ? l.future : l.past;
+          return "function" == typeof M ? M(a) : M.replace("%s", a);
+        }, n2.to = function(r2, e2) {
+          return i(r2, e2, this, true);
+        }, n2.from = function(r2, e2) {
+          return i(r2, e2, this);
+        };
+        var d2 = function(r2) {
+          return r2.$u ? t.utc() : t();
+        };
+        n2.toNow = function(r2) {
+          return this.to(d2(this), r2);
+        }, n2.fromNow = function(r2) {
+          return this.from(d2(this), r2);
+        };
+      };
+    });
+  })(relativeTime$1);
+  var relativeTimeExports = relativeTime$1.exports;
+  const relativeTime = /* @__PURE__ */ getDefaultExportFromCjs(relativeTimeExports);
+  dayjs.extend(relativeTime);
+  const RelativeTimeSentence = ({
+    timeStamp,
+    styles: styles2
+  }) => {
+    styles2 = mergeStyles({
+      ...defaultStyles$k
+    }, styles2);
+    let timeSince = dayjs(timeStamp).fromNow();
+    return jsxRuntime.jsx("span", {
+      className: styles2.text,
+      children: timeSince
+    });
+  };
+  const pageContainer = "_pageContainer_1s0yq_9";
+  const sideBorders = "_sideBorders_1s0yq_42";
+  const defaultStyles$j = {
+    pageContainer,
+    sideBorders
+  };
+  function Container({
+    children,
+    sideBorders: sideBorders2 = false,
+    styles: styles2
+  }) {
+    const {
+      pageContainer: pageContainer2,
+      sideBorders: sideBordersStyle
+    } = mergeStyles(defaultStyles$j, styles2);
+    return jsxRuntime.jsx("div", {
+      className: [pageContainer2, sideBorders2 && sideBordersStyle].join(" "),
+      children
+    });
+  }
+  const bar$1 = "_bar_17pyf_9";
+  const defaultStyles$i = {
+    bar: bar$1
+  };
+  function ChangeBar({
+    fraction,
+    positive,
+    party,
+    width,
+    height,
+    styles: styles2
+  }) {
+    let centre = parseFloat(width) / 2;
+    let barwidth = parseFloat(fraction) * (parseFloat(width) / 2);
+    let negleft = `${centre - barwidth}px`;
+    let posleft = `${centre}px`;
+    let thisStyles = ` height: ${height}; width: ${barwidth}px; ${positive ? `left: ${posleft}` : `left: ${negleft}`}`;
+    let thisColor = ` bg-color--${party}`;
+    styles2 = mergeStyles({
+      ...defaultStyles$i
+    }, styles2);
+    return jsxRuntime.jsx("div", {
+      className: styles2.wrapper,
+      style: `width: ${width}px`,
+      children: jsxRuntime.jsx("div", {
+        className: styles2.bar.concat(thisColor),
+        style: thisStyles
+      })
+    });
+  }
+  const svg$5 = "_svg_886i1_9";
+  const dividingLineColor = "_dividingLineColor_886i1_16";
+  const square = "_square_886i1_20";
+  const corner = "_corner_886i1_24";
+  const defaultStyles$h = {
+    svg: svg$5,
+    dividingLineColor,
+    square,
+    corner
+  };
+  const SquareCutCornerIcon = ({
+    cornerColor,
+    squareColor,
+    squareSize,
+    styles: styles2
+  }) => {
+    styles2 = mergeStyles({
+      ...defaultStyles$h
+    }, styles2);
+    let cornerSize = squareSize * 0.625;
+    let cornerMargin = squareSize < 100 ? squareSize / 6 : 10;
+    return jsxRuntime.jsx("svg", {
+      width: squareSize,
+      height: squareSize,
+      className: styles2.svg,
+      viewBox: `0 0 ${squareSize} ${squareSize}`,
+      children: jsxRuntime.jsxs("g", {
+        id: "square-cutoff-corner-icon",
+        children: [jsxRuntime.jsx("rect", {
+          id: "square",
+          fill: squareColor,
+          className: styles2.square,
+          width: squareSize,
+          height: squareSize
+        }), jsxRuntime.jsxs("g", {
+          id: "corner",
+          children: [jsxRuntime.jsx("polygon", {
+            id: "cornerTriangleBg",
+            className: styles2.dividingLineColor,
+            points: `0,0 0,${cornerSize} ${cornerSize},0`
+          }), jsxRuntime.jsx("polygon", {
+            id: "cornerTriangle",
+            fill: cornerColor,
+            className: styles2.corner,
+            points: `0,0 0,${cornerSize - cornerMargin} ${cornerSize - cornerMargin},0`
+          })]
+        })]
+      })
+    });
+  };
+  const stackedGridContainer = "_stackedGridContainer_1e05o_1";
+  const stackedGridRotateItems0 = "_stackedGridRotateItems0_1e05o_13";
+  const stackedGridRotateItems90 = "_stackedGridRotateItems90_1e05o_19";
+  const stackedGridRotateItems180 = "_stackedGridRotateItems180_1e05o_25";
+  const stackedGridRotateItems270 = "_stackedGridRotateItems270_1e05o_31";
+  const defaultStyles$g = {
+    stackedGridContainer,
+    stackedGridRotateItems0,
+    stackedGridRotateItems90,
+    stackedGridRotateItems180,
+    stackedGridRotateItems270
+  };
+  const getItemRotate = (fromBottom, fromLeft) => {
+    if (fromBottom && fromLeft) {
+      return "stackedGridRotateItems270";
+    } else if (fromBottom && !fromLeft) {
+      return "stackedGridRotateItems180";
+    } else if (!fromBottom && !fromLeft) {
+      return "stackedGridRotateItems90";
+    } else if (!fromBottom && fromLeft) {
+      return "stackedGridRotateItems0";
+    }
+  };
+  const getContainerFlip = (fromBottom, fromLeft) => {
+    let scaleX = fromLeft ? 1 : -1;
+    let scaleY = fromBottom ? -1 : 1;
+    return `scale(${scaleX}, ${scaleY})`;
+  };
+  const StackedGrid = ({
+    fromLeft,
+    fromBottom,
+    containerWidth,
+    children,
+    styles: styles2
+  }) => {
+    let containerFlip = getContainerFlip(fromBottom, fromLeft);
+    let itemRotateClass = getItemRotate(fromBottom, fromLeft);
+    let flexStyles = {
+      display: "flex",
+      flexDirection: "row",
+      flexWrap: "wrap",
+      width: containerWidth,
+      transform: containerFlip
+    };
+    styles2 = mergeStyles(defaultStyles$g, styles2);
+    return jsxRuntime.jsx("div", {
+      style: flexStyles,
+      className: `${styles2.stackedGridContainer} ${styles2[itemRotateClass]}`,
+      children
+    });
+  };
+  const svg$4 = "_svg_l2fsl_9";
+  const squareFill = "_squareFill_l2fsl_16";
+  const defaultStyles$f = {
+    svg: svg$4,
+    squareFill
+  };
+  const SquareIcon = ({
+    color,
+    size,
+    styles: styles2
+  }) => {
+    styles2 = mergeStyles({
+      ...defaultStyles$f
+    }, styles2);
+    return jsxRuntime.jsx("svg", {
+      width: size,
+      height: size,
+      className: styles2.svg,
+      viewBox: `0 0 ${size} ${size}`,
+      children: jsxRuntime.jsx("rect", {
+        id: "square",
+        fill: color,
+        className: styles2.squareFill,
+        width: size,
+        height: size
+      })
+    });
+  };
+  const button$3 = "_button_1fees_1";
+  const icon = "_icon_1fees_6";
+  const defaultStyles$e = {
+    button: button$3,
+    icon
+  };
+  function ArrowButton({
+    direction = "right",
+    disabled = false,
+    styles: styles2,
+    onClick
+  }) {
+    styles2 = mergeStyles(defaultStyles$e, styles2);
+    return jsxRuntime.jsx("button", {
+      className: styles2.button,
+      disabled,
+      onClick,
+      children: jsxRuntime.jsxs("svg", {
+        className: [styles2.icon, direction].join(" "),
+        viewBox: "0 0 28 28",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: [jsxRuntime.jsx("circle", {
+          cx: 14,
+          cy: 14,
+          r: "13",
+          "fill-rule": "nonzero"
+        }), jsxRuntime.jsx("g", {
+          transform: "translate(6 7)",
+          children: jsxRuntime.jsx("path", {
+            d: "M0.667319 7.63692L12.8497 7.63692L8.07231 13.3539L8.69338 13.975L15.334 7.31842L15.334 6.68143L8.69338 0.0249018L8.07231 0.645966L12.8497 6.36294L0.667319 6.36294L0.667319 7.63692Z",
+            fill: "#121212"
+          })
+        })]
+      })
+    });
+  }
+  const button$2 = "_button_19t7j_1";
+  const buttonInner$1 = "_buttonInner_19t7j_6";
+  const defaultStyles$d = {
+    button: button$2,
+    buttonInner: buttonInner$1
+  };
+  function Button({
+    type = "regular",
+    onClick,
+    styles: styles2,
+    children
+  }) {
+    styles2 = mergeStyles(defaultStyles$d, styles2);
+    return jsxRuntime.jsx("button", {
+      className: styles2.button,
+      "data-type": type,
+      onClick,
+      children: jsxRuntime.jsx("div", {
+        className: styles2.buttonInner,
+        children
+      })
+    });
+  }
+  const button$1 = "_button_6w12u_1";
+  const buttonBorder = "_buttonBorder_6w12u_10";
+  const svg$3 = "_svg_6w12u_18";
+  const path$3 = "_path_6w12u_24";
+  const defaultStyles$c = {
+    button: button$1,
+    buttonBorder,
+    svg: svg$3,
+    path: path$3
+  };
+  function CloseButton({
+    border = true,
+    onClick,
+    styles: styles2
+  }) {
+    styles2 = mergeStyles(defaultStyles$c, styles2);
+    return jsxRuntime.jsx("button", {
+      className: [styles2.button, border && styles2.buttonBorder].join(" "),
+      onClick,
+      children: jsxRuntime.jsx("svg", {
+        className: styles2.svg,
+        viewBox: "0 0 17 17",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: jsxRuntime.jsx("path", {
+          className: styles2.path,
+          "fill-rule": "evenodd",
+          "clip-rule": "evenodd",
+          d: "M8.32497 10.025L15.5499 16.6499L16.6249 15.5749L10.025 8.32497L16.6249 1.075L15.5499 0L8.32497 6.62498L1.075 0.0249999L0 1.1L6.62498 8.32497L0 15.5499L1.075 16.6249L8.32497 10.025Z"
+        })
+      })
+    });
+  }
+  const sortAscending = (accessor) => {
+    return (a, b) => {
+      const valueA = a[accessor];
+      const valueB = b[accessor];
+      if (valueA < valueB)
+        return -1;
+      if (valueA > valueB)
+        return 1;
+      return 0;
+    };
+  };
+  const sortDescending = (accessor) => {
+    return (a, b) => {
+      const valueA = a[accessor];
+      const valueB = b[accessor];
+      if (valueA > valueB)
+        return -1;
+      if (valueA < valueB)
+        return 1;
+      return 0;
+    };
+  };
+  function useTable({
+    columns,
+    data,
+    sortState
+  }) {
+    const sortedData = hooks.useMemo(() => {
+      if (sortState.columnIndex < 0) {
+        return data;
+      }
+      const column = columns[sortState.columnIndex];
+      const sortFunction = sortState.ascending ? sortAscending(column.accessor) : sortDescending(column.accessor);
+      return data.toSorted(sortFunction);
+    }, [columns, data, sortState]);
+    const columnModels = hooks.useMemo(() => {
+      return columns.map((column, columnIndex) => {
+        const isSorted = sortState.columnIndex === columnIndex && sortState;
+        return new ColumnModel(columnIndex, column, isSorted);
+      });
+    }, [columns, sortState]);
+    const rowModels = hooks.useMemo(() => {
+      return sortedData.map((d2, rowIndex) => {
+        const cells = columnModels.map((column, columnIndex) => {
+          return new CellModel(column, columnIndex, d2, column.cell);
+        });
+        return new RowModel(rowIndex, cells);
+      });
+    }, [columnModels, sortedData]);
+    return {
+      columns: columnModels,
+      rows: rowModels
+    };
+  }
+  class ColumnModel {
+    constructor(index2, definition, isSorted) {
+      this.index = index2;
+      this.definition = definition;
+      this.isSorted = isSorted;
+      this.defaultValue = definition.defaultValue;
+    }
+    get id() {
+      return this.definition.id || this.header;
+    }
+    get accessor() {
+      return this.definition.accessor;
+    }
+    get header() {
+      return this.definition.header;
+    }
+    get headerProps() {
+      return {
+        text: this.header,
+        sortable: this.definition.sortable,
+        isSorted: this.isSorted,
+        ...this.headerCellStyle
+      };
+    }
+    get cell() {
+      return this.definition.cell;
+    }
+    get styles() {
+      return this.definition.styles;
+    }
+  }
+  class RowModel {
+    constructor(index2, cells) {
+      this.index = index2;
+      this.cells = cells;
+    }
+    get id() {
+      return this.index;
+    }
+  }
+  class CellModel {
+    constructor(column, columnIndex, row, cell) {
+      this.column = column;
+      this.columnIndex = columnIndex;
+      this.row = row;
+      this.cell = cell;
+    }
+    get id() {
+      return this.columnIndex;
+    }
+    get displayValue() {
+      if (this.cell) {
+        return this.cell(this.row);
+      }
+      if (!Object.prototype.hasOwnProperty.call(this.row, this.column.accessor)) {
+        if (this.column.defaultValue) {
+          return this.column.defaultValue.toString();
+        }
+        const rowData = JSON.stringify(this.row, null, 2);
+        throw new Error(`Missing value for key ${this.column.accessor} in ${rowData}`);
+      }
+      return this.row[this.column.accessor].toString();
+    }
+  }
+  const table = "_table_1b75c_9";
+  const hideHeader = "_hideHeader_1b75c_18";
+  const hideHeaderNoBorder = "_hideHeaderNoBorder_1b75c_27";
+  const headerCell = "_headerCell_1b75c_31";
+  const headerCellButton = "_headerCellButton_1b75c_39";
+  const bodyRow = "_bodyRow_1b75c_48";
+  const bodyCell = "_bodyCell_1b75c_53";
+  const defaultStyles$b = {
+    table,
+    hideHeader,
+    hideHeaderNoBorder,
+    headerCell,
+    headerCellButton,
+    bodyRow,
+    bodyCell
+  };
+  function Table({
+    columns,
+    data,
+    hideHeader: hideHeader2 = false,
+    styles: styles2
+  }) {
+    const [sortState, setSortState] = hooks.useState(() => {
+      const columnIndex = columns.findIndex((column) => {
+        if ("sort" in column) {
+          return true;
+        }
+        return false;
+      });
+      const ascending = columnIndex >= 0 ? columns[columnIndex].sort.ascending : false;
+      return {
+        columnIndex,
+        ascending
+      };
+    });
+    const table2 = useTable({
+      columns,
+      data,
+      sortState
+    });
+    const sortByColumn = (index2) => {
+      setSortState((currentState) => {
+        return {
+          columnIndex: index2,
+          ascending: index2 === currentState.columnIndex ? !currentState.ascending : false
+        };
+      });
+    };
+    styles2 = mergeStyles(defaultStyles$b, styles2);
+    return jsxRuntime.jsxs("table", {
+      className: styles2.table,
+      children: [jsxRuntime.jsx("thead", {
+        className: hideHeader2 && styles2.hideHeader,
+        children: jsxRuntime.jsx("tr", {
+          children: table2.columns.map((column, index2) => {
+            var _a;
+            return jsxRuntime.jsx("th", {
+              className: mergeStyles(styles2.headerCell, (_a = column.styles) == null ? void 0 : _a.headerCell),
+              children: jsxRuntime.jsx(HeaderCell, {
+                styles: mergeStyles(styles2, column.styles),
+                onClick: () => sortByColumn(index2),
+                ...column.headerProps
+              }, index2)
+            }, column.id);
+          })
+        })
+      }), jsxRuntime.jsx("tbody", {
+        className: hideHeader2 && styles2.hideHeaderNoBorder,
+        children: table2.rows.map((row) => {
+          return jsxRuntime.jsx("tr", {
+            className: styles2.bodyRow,
+            children: row.cells.map((cell) => {
+              var _a;
+              return jsxRuntime.jsx("td", {
+                className: mergeStyles(styles2.bodyCell, (_a = cell.column.styles) == null ? void 0 : _a.bodyCell),
+                children: cell.displayValue
+              }, cell.id);
+            })
+          }, row.id);
+        })
+      })]
+    });
+  }
+  function HeaderCell({
+    text: text2,
+    sortable,
+    isSorted,
+    styles: styles2,
+    onClick
+  }) {
+    if (!sortable) {
+      return text2;
+    }
+    let direction = "down";
+    if ((isSorted == null ? void 0 : isSorted.ascending) === false) {
+      direction = "up";
+    }
+    return jsxRuntime.jsxs("button", {
+      onClick,
+      className: styles2.headerCellButton,
+      children: [jsxRuntime.jsx("span", {
+        children: text2
+      }), jsxRuntime.jsx(Chevron, {
+        active: !!isSorted,
+        direction
+      })]
+    });
+  }
+  function preventOverlap(labelPositions, iteration = 0, labelHeight = 12) {
+    const maxIterations = 10;
+    let totalOverlap = 0;
+    for (let index2 = 1; index2 < labelPositions.length; index2++) {
+      const previousElement = labelPositions[index2 - 1];
+      const element = labelPositions[index2];
+      const overlap = previousElement.y - (element.y - labelHeight);
+      if (overlap < 0) {
+        continue;
+      }
+      previousElement.y -= overlap / 2;
+      element.y += overlap / 2;
+      totalOverlap += overlap;
+    }
+    if (totalOverlap > 0 && iteration < maxIterations) {
+      return preventOverlap(labelPositions, iteration + 1);
+    }
+    return labelPositions;
+  }
+  function uniqueBy(array, key) {
+    return [...array.reduce((map, d2) => map.set(d2[key], d2), /* @__PURE__ */ new Map()).values()];
+  }
+  function positionLabels(labels) {
+    labels = uniqueBy(labels, "value");
+    labels.sort((a, b) => a.y - b.y);
+    return preventOverlap(labels);
+  }
+  function scaleLinear(domain, range) {
+    const [domainMin, domainMax] = domain;
+    const [rangeMin, rangeMax] = range;
+    const slope = (rangeMax - rangeMin) / (domainMax - domainMin);
+    const intercept = rangeMin - slope * domainMin;
+    return function(x) {
+      return slope * x + intercept;
+    };
+  }
+  function useWindowSize() {
+    const [windowSize, setWindowSize] = hooks.useState(() => {
+      if (typeof window === "undefined")
+        return {
+          width: 0,
+          height: 0
+        };
+      return {
+        width: window.innerWidth,
+        height: window.innerHeight
+      };
+    });
+    hooks.useEffect(() => {
+      if (typeof window === "undefined")
+        return;
+      function handleResize() {
+        setWindowSize({
+          width: window.innerWidth,
+          height: window.innerHeight
+        });
+      }
+      window.addEventListener("resize", handleResize);
+      return () => {
+        window.removeEventListener("resize", handleResize);
+      };
+    }, []);
+    return windowSize;
+  }
+  const slopeChartContainer = "_slopeChartContainer_gj7pr_1";
+  const svg$2 = "_svg_gj7pr_5";
+  const line = "_line_gj7pr_9";
+  const circle = "_circle_gj7pr_14";
+  const label = "_label_gj7pr_18";
+  const y1Label = "_y1Label_gj7pr_24";
+  const y2Label = "_y2Label_gj7pr_28";
+  const axis$1 = "_axis_gj7pr_32";
+  const axisLabel = "_axisLabel_gj7pr_37";
+  const defaultStyles$a = {
+    slopeChartContainer,
+    svg: svg$2,
+    line,
+    circle,
+    label,
+    y1Label,
+    y2Label,
+    axis: axis$1,
+    axisLabel
+  };
+  const SlopeChart = ({
+    domain,
+    lines,
+    y1Label: y1Label2 = (d2) => d2.y1,
+    y2Label: y2Label2 = (d2) => d2.y2,
+    axis: axis2,
+    styles: styles2,
+    padding = {
+      left: 24,
+      right: 24,
+      top: 20,
+      bottom: 20
+    }
+  }) => {
+    const wrapperRef = hooks.useRef(null);
+    const windowSize = useWindowSize();
+    const [width, setWidth] = hooks.useState(0);
+    const contentWidth = Math.floor(width - padding.left - padding.right);
+    const contentHeight = contentWidth;
+    const height = contentHeight + padding.top + padding.bottom;
+    const yScale = scaleLinear(domain, [contentHeight, 0]);
+    const show = width > 0;
+    hooks.useLayoutEffect(() => {
+      const newWidth = wrapperRef.current.getBoundingClientRect().width;
+      setWidth(newWidth);
+    }, [windowSize]);
+    const y1Labels = hooks.useMemo(() => {
+      let labels = lines.map((d2) => ({
+        y: yScale(d2.y1),
+        value: y1Label2(d2)
+      }));
+      return positionLabels(labels);
+    }, [lines, y1Label2, yScale]);
+    const y2Labels = hooks.useMemo(() => {
+      let labels = lines.map((d2) => ({
+        y: yScale(d2.y2),
+        value: y2Label2(d2)
+      }));
+      return positionLabels(labels);
+    }, [lines, y2Label2, yScale]);
+    styles2 = mergeStyles({
+      ...defaultStyles$a
+    }, styles2);
+    const chart = jsxRuntime.jsx("svg", {
+      class: styles2.svg,
+      width,
+      height,
+      children: jsxRuntime.jsxs("g", {
+        transform: `translate(${padding.left} ${padding.top})`,
+        children: [jsxRuntime.jsxs("g", {
+          transform: `translate(0 ${contentHeight})`,
+          children: [jsxRuntime.jsx("line", {
+            x1: 0,
+            x2: contentWidth,
+            className: styles2.axis,
+            "shape-rendering": "crispEdges"
+          }), jsxRuntime.jsx("text", {
+            "dominant-baseline": "hanging",
+            className: [styles2.label, styles2.axisLabel].join(" "),
+            children: axis2.startLabel
+          }), jsxRuntime.jsx("text", {
+            x: contentWidth,
+            "dominant-baseline": "hanging",
+            "text-anchor": "end",
+            className: [styles2.label, styles2.axisLabel].join(" "),
+            children: axis2.endLabel
+          })]
+        }), lines.map((line2, index2) => {
+          const itemStyles = mergeStyles({
+            ...styles2
+          }, line2.styles);
+          return jsxRuntime.jsxs("g", {
+            children: [jsxRuntime.jsx("line", {
+              x1: 0,
+              y1: yScale(line2.y1),
+              x2: contentWidth,
+              y2: yScale(line2.y2),
+              className: `${itemStyles.line} stroke-color--${line2.abbreviation}`
+            }), jsxRuntime.jsx("circle", {
+              cx: 0,
+              cy: yScale(line2.y1),
+              r: 4,
+              className: `${itemStyles.circle} fill-color--${line2.abbreviation}`
+            }), jsxRuntime.jsx("circle", {
+              cx: contentWidth,
+              cy: yScale(line2.y2),
+              r: 4,
+              className: `${itemStyles.circle} fill-color--${line2.abbreviation}`
+            })]
+          }, index2);
+        }), y1Labels.map((label2, index2) => {
+          return jsxRuntime.jsx("g", {
+            children: jsxRuntime.jsx("text", {
+              x: 0,
+              y: label2.y,
+              className: [styles2.label, styles2.y1Label].join(" "),
+              "text-anchor": "end",
+              "dominant-baseline": "middle",
+              children: label2.value
+            })
+          }, index2);
+        }), y2Labels.map((label2, index2) => {
+          return jsxRuntime.jsx("g", {
+            children: jsxRuntime.jsx("text", {
+              x: contentWidth,
+              y: label2.y,
+              className: [styles2.label, styles2.y2Label].join(" "),
+              "text-anchor": "start",
+              "dominant-baseline": "middle",
+              children: label2.value
+            })
+          }, index2);
+        })]
+      })
+    });
+    return jsxRuntime.jsx("div", {
+      class: styles2.slopeChartContainer,
+      ref: wrapperRef,
+      children: show && chart
+    });
+  };
+  const useTooltipTarget = (targetElement, trackPosition) => {
+    const [targetRect, setTargetRect] = hooks.useState();
+    const [position, setPosition] = hooks.useState(null);
+    const [hoverActive, setHoverActive] = hooks.useState(false);
+    const onMouseMove = ({
+      clientX,
+      clientY,
+      currentTarget
+    }) => {
+      const rect2 = currentTarget.getBoundingClientRect();
+      const x = clientX - rect2.left;
+      const y = clientY - rect2.top;
+      requestAnimationFrame(() => {
+        setPosition({
+          x,
+          y
+        });
+        setHoverActive(true);
+      });
+    };
+    const onMouseOut = () => {
+      requestAnimationFrame(() => {
+        setHoverActive(false);
+      });
+    };
+    hooks.useEffect(() => {
+      setTargetRect(targetElement.getBoundingClientRect());
+      if (trackPosition) {
+        targetElement.addEventListener("mousemove", onMouseMove);
+        targetElement.addEventListener("mouseout", onMouseOut);
+      }
+      return () => {
+        if (trackPosition) {
+          targetElement.removeEventListener("mousemove", onMouseMove);
+          targetElement.removeEventListener("mouseout", onMouseOut);
+        }
+      };
+    }, [targetElement, trackPosition]);
+    return {
+      targetRect,
+      positionInTarget: position,
+      hoverActive
+    };
+  };
+  function n(n2) {
+    return (r) => {
+      n2.forEach((n3) => {
+        "function" == typeof n3 ? n3(r) : null != n3 && (n3.current = r);
+      });
+    };
+  }
+  var T, c;
+  !function(e) {
+    e.APPEAR = "appear", e.APPEAR_ACTIVE = "appearActive", e.APPEAR_DONE = "appearDone", e.ENTER = "enter", e.ENTER_ACTIVE = "enterActive", e.ENTER_DONE = "enterDone", e.EXIT = "exit", e.EXIT_ACTIVE = "exitActive", e.EXIT_DONE = "exitDone";
+  }(T || (T = {})), function(e) {
+    e.ENTER = "onEnter", e.ENTERING = "onEntering", e.ENTERED = "onEntered", e.EXIT = "onExit", e.EXITING = "onExiting", e.EXITED = "onExited";
+  }(c || (c = {}));
+  const s = { [T.APPEAR]: [c.ENTER, T.APPEAR_ACTIVE], [T.APPEAR_ACTIVE]: [c.ENTERING, T.APPEAR_DONE, true], [T.APPEAR_DONE]: [c.ENTERED], [T.ENTER]: [c.ENTER, T.ENTER_ACTIVE], [T.ENTER_ACTIVE]: [c.ENTERING, T.ENTER_DONE, true], [T.ENTER_DONE]: [c.ENTERED], [T.EXIT]: [c.EXIT, T.EXIT_ACTIVE], [T.EXIT_ACTIVE]: [c.EXITING, T.EXIT_DONE, true], [T.EXIT_DONE]: [c.EXITED] };
+  var u = (r) => {
+    const { children: c2, in: u2 = false, appear: A = false, enter: N2 = true, exit: l = true, duration: I = 500, alwaysMounted: p2 = false, addEndListener: R2 } = r, P2 = hooks.useRef(), _2 = hooks.useRef();
+    let d2 = false;
+    const [f, D] = hooks.useState(() => (d2 = true, u2 ? A ? T.APPEAR : T.APPEAR_DONE : T.EXIT_DONE));
+    hooks.useEffect(() => {
+      var e;
+      const { setTimeout: E, clearTimeout: t } = window, [n2, o, i] = s[f];
+      return null == (e = r[n2]) || e.call(r, P2.current), o && (i ? R2 ? R2(P2.current, () => D(o)) : _2.current = E(D, I, o) : D(o)), () => {
+        t(_2.current);
+      };
+    }, [f, I]), hooks.useLayoutEffect(() => {
+      d2 || D(u2 ? N2 ? T.ENTER : T.ENTER_DONE : l ? T.EXIT : T.EXIT_DONE);
+    }, [u2]);
+    const X = hooks.useMemo(() => {
+      const e = {};
+      return Object.values(T).forEach((r2) => {
+        e[r2] = f === r2;
+      }), e;
+    }, [f]);
+    if (!p2 && f === T.EXIT_DONE)
+      return null;
+    const O = c2(X, f);
+    return preact.cloneElement(O, { ref: n([P2, O.ref]) });
+  };
+  function N(e, r) {
+    if (null == e)
+      return {};
+    var E, t, n2 = {}, o = Object.keys(e);
+    for (t = 0; t < o.length; t++)
+      r.indexOf(E = o[t]) >= 0 || (n2[E] = e[E]);
+    return n2;
+  }
+  const p = ["children", "classNames"], R = { [T.APPEAR]: "-appear", [T.APPEAR_ACTIVE]: "-appear-active", [T.APPEAR_DONE]: "-appear-done", [T.ENTER]: "-enter", [T.ENTER_ACTIVE]: "-enter-active", [T.ENTER_DONE]: "-enter-done", [T.EXIT]: "-exit", [T.EXIT_ACTIVE]: "-exit-active", [T.EXIT_DONE]: "-exit-done" }, P = (...e) => e.filter((e2) => !!e2).join(" "), _ = (e, r) => "string" == typeof r ? `${r}${R[e]}` : r[e];
+  var d = (E) => {
+    const { children: t, classNames: n2 } = E, o = N(E, p);
+    return preact.createElement(u, o, (r, E2) => {
+      const { className: o2 } = t.props, i = hooks.useMemo(() => P(o2, ((e, r2) => {
+        const E3 = _(e, r2);
+        switch (e) {
+          case T.APPEAR_ACTIVE:
+            return P(_(T.APPEAR, r2), E3);
+          case T.ENTER_ACTIVE:
+            return P(_(T.ENTER, r2), E3);
+          case T.EXIT_ACTIVE:
+            return P(_(T.EXIT, r2), E3);
+          default:
+            return E3;
+        }
+      })(E2, n2)), [o2, n2, E2]);
+      return preact.cloneElement(t, { className: i });
+    });
+  };
+  const transitionContainer = "_transitionContainer_1gzlr_1";
+  const modalBox = "_modalBox_1gzlr_13";
+  const enter = "_enter_1gzlr_21";
+  const exitDone = "_exitDone_1gzlr_22";
+  const enterActive = "_enterActive_1gzlr_31";
+  const exit = "_exit_1gzlr_22";
+  const styles$4 = {
+    transitionContainer,
+    modalBox,
+    enter,
+    exitDone,
+    enterActive,
+    exit
+  };
+  function Modal({
+    visible = false,
+    children
+  }) {
+    return jsxRuntime.jsx(d, {
+      in: visible,
+      duration: 300,
+      classNames: styles$4,
+      alwaysMounted: true,
+      children: jsxRuntime.jsx("div", {
+        class: styles$4.transitionContainer,
+        children: jsxRuntime.jsx("div", {
+          class: styles$4.modalBox,
+          children
+        })
+      })
+    });
+  }
+  const tooltip = "_tooltip_11t5d_1";
+  const defaultStyles$9 = {
+    tooltip
+  };
+  const TooltipType = {
+    float: "float",
+    modal: "modal"
+  };
+  function Tooltip({
+    for: targetElement,
+    renderIn: refOrSelector,
+    type = TooltipType.float,
+    styles: styles2,
+    children
+  }) {
+    if (!targetElement)
+      throw new Error("Target for tooltip cannot be undefined");
+    const [tooltipPosition, setTooltipPosition] = hooks.useState({
+      x: 0,
+      y: 0
+    });
+    const [displayElement, setDisplayElement] = hooks.useState(null);
+    const trackPosition = typeof children === "function";
+    const {
+      targetRect,
+      positionInTarget,
+      hoverActive
+    } = useTooltipTarget(targetElement, trackPosition);
+    const tooltipRef = hooks.useRef(null);
+    styles2 = mergeStyles(defaultStyles$9, styles2);
+    hooks.useEffect(() => {
+      let element = null;
+      if (typeof refOrSelector === "string") {
+        element = document.querySelector(refOrSelector);
+      } else if ("current" in refOrSelector) {
+        element = refOrSelector.current;
+      } else {
+        throw new Error("renderIn prop needs to be a selector or ref (from useRef)");
+      }
+      setDisplayElement(element);
+    }, [refOrSelector]);
+    hooks.useLayoutEffect(() => {
+      if (!tooltipRef.current)
+        return;
+      if (trackPosition && positionInTarget) {
+        const newPosition = tooltipPositionForPoint({
+          targetRect,
+          positionInTarget,
+          tooltip: tooltipRef.current,
+          displayElement
+        });
+        setTooltipPosition(newPosition);
+      } else if (!trackPosition) {
+        const newPosition = tooltipPositionForRect({
+          targetRect,
+          tooltip: tooltipRef.current,
+          displayElement
+        });
+        setTooltipPosition(newPosition);
+      }
+    }, [trackPosition, targetRect, positionInTarget, displayElement, tooltipRef]);
+    if (!displayElement)
+      return;
+    const displayTooltip = hoverActive || !trackPosition;
+    const fixedStyle = type === TooltipType.modal ? {} : {
+      display: displayTooltip ? "block" : "none",
+      position: "fixed",
+      left: tooltipPosition.x,
+      top: tooltipPosition.y,
+      zIndex: 100
+    };
+    const tooltip2 = jsxRuntime.jsxs("div", {
+      ref: tooltipRef,
+      className: styles2.tooltip,
+      style: fixedStyle,
+      children: [positionInTarget && children(positionInTarget), !trackPosition && children]
+    });
+    return compat.createPortal(type === TooltipType.modal ? jsxRuntime.jsx(Modal, {
+      visible: hoverActive,
+      children: tooltip2
+    }) : tooltip2, displayElement);
+  }
+  function tooltipPositionForPoint({
+    targetRect,
+    positionInTarget,
+    tooltip: tooltip2,
+    displayElement
+  }) {
+    const newPosition = {
+      x: positionInTarget.x + targetRect.x,
+      y: positionInTarget.y + targetRect.y
+    };
+    const tooltipWidth = tooltip2.offsetWidth;
+    const tooltipHeight = tooltip2.offsetHeight;
+    const displayElementRect = displayElement.getBoundingClientRect();
+    if (newPosition.x + tooltipWidth > displayElementRect.right) {
+      newPosition.x -= tooltipWidth;
+    }
+    if (newPosition.y + tooltipHeight > displayElementRect.bottom) {
+      newPosition.y -= tooltipHeight;
+    }
+    return newPosition;
+  }
+  function tooltipPositionForRect({
+    targetRect,
+    tooltip: tooltip2,
+    displayElement
+  }) {
+    const newPosition = {
+      x: targetRect.right,
+      y: targetRect.top
+    };
+    const tooltipWidth = tooltip2.offsetWidth;
+    const tooltipHeight = tooltip2.offsetHeight;
+    const displayElementRect = displayElement.getBoundingClientRect();
+    if (newPosition.x + tooltipWidth > displayElementRect.right) {
+      newPosition.x = targetRect.left - tooltipWidth;
+    }
+    if (newPosition.y - tooltipHeight < displayElementRect.top) {
+      newPosition.y = targetRect.bottom;
+    }
+    return newPosition;
+  }
+  const text$2 = "_text_1b8t2_1";
+  const container$3 = "_container_1b8t2_10";
+  const defaultStyles$8 = {
+    text: text$2,
+    container: container$3
+  };
+  const ControlChange = ({
+    previous: previous2,
+    next: next2,
+    text: text2,
+    styles: styles2
+  }) => {
+    styles2 = mergeStyles({
+      ...defaultStyles$8
+    }, styles2);
+    let hasChanged = next2 !== previous2;
+    return jsxRuntime.jsx("div", {
+      class: styles2.container,
+      children: jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [hasChanged ? jsxRuntime.jsx(GradientIcon, {
+          previous: previous2,
+          next: next2,
+          styles: {
+            previous: styles2.previous,
+            next: styles2.next
+          }
+        }) : jsxRuntime.jsx(CircleIcon, {
+          abbreviation: next2,
+          styles: {
+            rect: styles2.next
+          }
+        }), jsxRuntime.jsx("strong", {
+          className: styles2.text,
+          children: text2
+        })]
+      })
+    });
+  };
+  const toplineResult = "_toplineResult_lvw57_9";
+  const name = "_name_lvw57_12";
+  const displayNumbers = "_displayNumbers_lvw57_25";
+  const mainNumber = "_mainNumber_lvw57_34";
+  const secondaryNumber = "_secondaryNumber_lvw57_38";
+  const displayRow = "_displayRow_lvw57_45";
+  const displayColumn = "_displayColumn_lvw57_51";
+  const topRow = "_topRow_lvw57_55";
+  const defaultStyles$7 = {
+    toplineResult,
+    name,
+    displayNumbers,
+    mainNumber,
+    secondaryNumber,
+    displayRow,
+    displayColumn,
+    topRow
+  };
+  const ToplineResult = ({
+    name: name2,
+    mainNumber: mainNumber2,
+    secondaryNumber: secondaryNumber2,
+    styles: styles2,
+    displayRow: displayRow2 = false,
+    abbreviation,
+    onMouseOver,
+    onInfoPress,
+    showInfoButton = false
+  }) => {
+    styles2 = mergeStyles({
+      ...defaultStyles$7
+    }, styles2);
+    const displayStyle = displayRow2 ? styles2.displayRow : styles2.displayColumn;
+    return jsxRuntime.jsxs("div", {
+      class: styles2.toplineResult,
+      onMouseOver,
+      children: [jsxRuntime.jsxs("div", {
+        class: styles2.topRow,
+        children: [jsxRuntime.jsx("span", {
+          class: `${styles2.name} before-color--${abbreviation}`,
+          children: name2
+        }), " ", showInfoButton && jsxRuntime.jsx("span", {
+          class: styles2.infoButton,
+          children: jsxRuntime.jsx(InfoButton, {
+            onClick: onInfoPress
+          })
+        })]
+      }), jsxRuntime.jsxs("div", {
+        class: `${styles2.displayNumbers} ${displayStyle}`,
+        children: [jsxRuntime.jsx("div", {
+          class: styles2.mainNumber,
+          children: mainNumber2
+        }), jsxRuntime.jsx("div", {
+          class: styles2.secondaryNumber,
+          children: secondaryNumber2
+        })]
+      })]
+    });
+  };
+  const section = "_section_te61d_9";
+  const borderTop = "_borderTop_te61d_13";
+  const header = "_header_te61d_45";
+  const content = "_content_te61d_65";
+  const defaultStyles$6 = {
+    section,
+    borderTop,
+    header,
+    content
+  };
+  const PageSection = compat.forwardRef(({
+    children,
+    styles: styles2,
+    borderTop: borderTop2 = false
+  }, ref) => {
+    styles2 = mergeStyles({
+      ...defaultStyles$6
+    }, styles2);
+    return jsxRuntime.jsxs("section", {
+      ref,
+      className: [styles2.section, borderTop2 && styles2.borderTop].join(" "),
+      children: [jsxRuntime.jsx("div", {
+        className: styles2.header,
+        children: children.header
+      }), jsxRuntime.jsx("div", {
+        className: styles2.content,
+        children: children.content
+      })]
+    });
+  });
+  const text$1 = "_text_lo5h3_1";
+  const axis = "_axis_lo5h3_6";
+  const bar = "_bar_lo5h3_10";
+  const defaultStyles$5 = {
+    text: text$1,
+    axis,
+    bar
+  };
+  const ColumnChart = ({
+    columns,
+    maxValue,
+    minValue,
+    chartHeight,
+    chartWidth,
+    columnWidth,
+    columnPadding,
+    styles: styles2
+  }) => {
+    styles2 = mergeStyles(defaultStyles$5, styles2);
+    const yScale = d3Scale.scaleLinear([maxValue, minValue], [0, chartHeight]);
+    return jsxRuntime.jsxs("svg", {
+      width: chartWidth,
+      height: chartHeight,
+      style: "",
+      children: [columns.map((column, index2) => {
+        const getHeight = (input2) => {
+          return yScale(0) - yScale(input2);
+        };
+        let totalColumnWidth = Number(columnWidth) + Number(columnPadding.left) + Number(columnPadding.right);
+        return jsxRuntime.jsxs("g", {
+          children: [jsxRuntime.jsx("rect", {
+            x: index2 * totalColumnWidth,
+            height: getHeight(Math.abs(column.value)),
+            width: columnWidth,
+            y: column.value > 0 ? yScale(column.value) : yScale(0),
+            fill: column.color,
+            className: `${styles2.bar} fill-color--${column.id}`,
+            id: column.id
+          }, index2), jsxRuntime.jsx("text", {
+            className: styles2.text,
+            x: index2 * totalColumnWidth + 2,
+            y: column.value < 0 ? yScale(0) - 6 : yScale(0) + 20,
+            children: column.label
+          })]
+        }, index2);
+      }), jsxRuntime.jsx("rect", {
+        className: styles2.axis,
+        x: 0,
+        y: yScale(0),
+        width: chartWidth,
+        height: 1
+      })]
+    });
+  };
+  const text = "_text_vd5ly_1";
+  const container$2 = "_container_vd5ly_9";
+  const title$1 = "_title_vd5ly_16";
+  const subtitle = "_subtitle_vd5ly_33";
+  const blurb = "_blurb_vd5ly_44";
+  const leftCell = "_leftCell_vd5ly_55";
+  const rightCell = "_rightCell_vd5ly_55";
+  const mugshot = "_mugshot_vd5ly_71";
+  const defaultStyles$4 = {
+    text,
+    container: container$2,
+    title: title$1,
+    subtitle,
+    blurb,
+    leftCell,
+    rightCell,
+    mugshot
+  };
+  const PartyProfile = ({
+    styles: styles2,
+    title: title2,
+    subtitle: subtitle2,
+    blurb: blurb2,
+    imgSrc,
+    abbreviation
+  }) => {
+    styles2 = mergeStyles({
+      ...defaultStyles$4
+    }, styles2);
+    return jsxRuntime.jsx("div", {
+      class: styles2.container,
+      children: jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [jsxRuntime.jsxs("div", {
+          className: styles2.leftCell,
+          children: [jsxRuntime.jsx("h3", {
+            className: `${styles2.title}`,
+            children: title2
+          }), jsxRuntime.jsx("div", {
+            className: styles2.subtitle,
+            children: subtitle2
+          }), jsxRuntime.jsx("div", {
+            className: styles2.blurb,
+            children: blurb2
+          })]
+        }), jsxRuntime.jsx("div", {
+          className: styles2.rightCell,
+          children: jsxRuntime.jsx("img", {
+            src: imgSrc,
+            className: `${styles2.mugshot} bg-color--${abbreviation}`
+          })
+        })]
+      })
+    });
+  };
+  var epsilon$1 = 1e-6;
+  function noop() {
+  }
+  var x0 = Infinity, y0 = x0, x1 = -x0, y1 = x1;
+  var boundsStream = {
+    point: boundsPoint,
+    lineStart: noop,
+    lineEnd: noop,
+    polygonStart: noop,
+    polygonEnd: noop,
+    result: function() {
+      var bounds = [[x0, y0], [x1, y1]];
+      x1 = y1 = -(y0 = x0 = Infinity);
+      return bounds;
+    }
+  };
+  function boundsPoint(x, y) {
+    if (x < x0)
+      x0 = x;
+    if (x > x1)
+      x1 = x;
+    if (y < y0)
+      y0 = y;
+    if (y > y1)
+      y1 = y;
+  }
+  function fitExtent(projection, extent, object) {
+    var w = extent[1][0] - extent[0][0], h = extent[1][1] - extent[0][1], clip = projection.clipExtent && projection.clipExtent();
+    projection.scale(150).translate([0, 0]);
+    if (clip != null)
+      projection.clipExtent(null);
+    d3Geo.geoStream(object, projection.stream(boundsStream));
+    var b = boundsStream.result(), k = Math.min(w / (b[1][0] - b[0][0]), h / (b[1][1] - b[0][1])), x = +extent[0][0] + (w - k * (b[1][0] + b[0][0])) / 2, y = +extent[0][1] + (h - k * (b[1][1] + b[0][1])) / 2;
+    if (clip != null)
+      projection.clipExtent(clip);
+    return projection.scale(k * 150).translate([x, y]);
+  }
+  function fitSize(projection, size, object) {
+    return fitExtent(projection, [[0, 0], size], object);
+  }
+  const pi = Math.PI, tau = 2 * pi, epsilon = 1e-6, tauEpsilon = tau - epsilon;
+  function Path() {
+    this._x0 = this._y0 = // start of current subpath
+    this._x1 = this._y1 = null;
+    this._ = "";
+  }
+  function path$2() {
+    return new Path();
+  }
+  Path.prototype = path$2.prototype = {
+    constructor: Path,
+    moveTo: function(x, y) {
+      this._ += "M" + (this._x0 = this._x1 = +x) + "," + (this._y0 = this._y1 = +y);
+    },
+    closePath: function() {
+      if (this._x1 !== null) {
+        this._x1 = this._x0, this._y1 = this._y0;
+        this._ += "Z";
+      }
+    },
+    lineTo: function(x, y) {
+      this._ += "L" + (this._x1 = +x) + "," + (this._y1 = +y);
+    },
+    quadraticCurveTo: function(x12, y12, x, y) {
+      this._ += "Q" + +x12 + "," + +y12 + "," + (this._x1 = +x) + "," + (this._y1 = +y);
+    },
+    bezierCurveTo: function(x12, y12, x2, y2, x, y) {
+      this._ += "C" + +x12 + "," + +y12 + "," + +x2 + "," + +y2 + "," + (this._x1 = +x) + "," + (this._y1 = +y);
+    },
+    arcTo: function(x12, y12, x2, y2, r) {
+      x12 = +x12, y12 = +y12, x2 = +x2, y2 = +y2, r = +r;
+      var x02 = this._x1, y02 = this._y1, x21 = x2 - x12, y21 = y2 - y12, x01 = x02 - x12, y01 = y02 - y12, l01_2 = x01 * x01 + y01 * y01;
+      if (r < 0)
+        throw new Error("negative radius: " + r);
+      if (this._x1 === null) {
+        this._ += "M" + (this._x1 = x12) + "," + (this._y1 = y12);
+      } else if (!(l01_2 > epsilon))
+        ;
+      else if (!(Math.abs(y01 * x21 - y21 * x01) > epsilon) || !r) {
+        this._ += "L" + (this._x1 = x12) + "," + (this._y1 = y12);
+      } else {
+        var x20 = x2 - x02, y20 = y2 - y02, l21_2 = x21 * x21 + y21 * y21, l20_2 = x20 * x20 + y20 * y20, l21 = Math.sqrt(l21_2), l01 = Math.sqrt(l01_2), l = r * Math.tan((pi - Math.acos((l21_2 + l01_2 - l20_2) / (2 * l21 * l01))) / 2), t01 = l / l01, t21 = l / l21;
+        if (Math.abs(t01 - 1) > epsilon) {
+          this._ += "L" + (x12 + t01 * x01) + "," + (y12 + t01 * y01);
+        }
+        this._ += "A" + r + "," + r + ",0,0," + +(y01 * x20 > x01 * y20) + "," + (this._x1 = x12 + t21 * x21) + "," + (this._y1 = y12 + t21 * y21);
+      }
+    },
+    arc: function(x, y, r, a0, a1, ccw) {
+      x = +x, y = +y, r = +r, ccw = !!ccw;
+      var dx = r * Math.cos(a0), dy = r * Math.sin(a0), x02 = x + dx, y02 = y + dy, cw = 1 ^ ccw, da = ccw ? a0 - a1 : a1 - a0;
+      if (r < 0)
+        throw new Error("negative radius: " + r);
+      if (this._x1 === null) {
+        this._ += "M" + x02 + "," + y02;
+      } else if (Math.abs(this._x1 - x02) > epsilon || Math.abs(this._y1 - y02) > epsilon) {
+        this._ += "L" + x02 + "," + y02;
+      }
+      if (!r)
+        return;
+      if (da < 0)
+        da = da % tau + tau;
+      if (da > tauEpsilon) {
+        this._ += "A" + r + "," + r + ",0,1," + cw + "," + (x - dx) + "," + (y - dy) + "A" + r + "," + r + ",0,1," + cw + "," + (this._x1 = x02) + "," + (this._y1 = y02);
+      } else if (da > epsilon) {
+        this._ += "A" + r + "," + r + ",0," + +(da >= pi) + "," + cw + "," + (this._x1 = x + r * Math.cos(a1)) + "," + (this._y1 = y + r * Math.sin(a1));
+      }
+    },
+    rect: function(x, y, w, h) {
+      this._ += "M" + (this._x0 = this._x1 = +x) + "," + (this._y0 = this._y1 = +y) + "h" + +w + "v" + +h + "h" + -w + "Z";
+    },
+    toString: function() {
+      return this._;
+    }
+  };
+  function multiplex(streams) {
+    var n2 = streams.length;
+    return {
+      point: function(x, y) {
+        var i = -1;
+        while (++i < n2)
+          streams[i].point(x, y);
+      },
+      sphere: function() {
+        var i = -1;
+        while (++i < n2)
+          streams[i].sphere();
+      },
+      lineStart: function() {
+        var i = -1;
+        while (++i < n2)
+          streams[i].lineStart();
+      },
+      lineEnd: function() {
+        var i = -1;
+        while (++i < n2)
+          streams[i].lineEnd();
+      },
+      polygonStart: function() {
+        var i = -1;
+        while (++i < n2)
+          streams[i].polygonStart();
+      },
+      polygonEnd: function() {
+        var i = -1;
+        while (++i < n2)
+          streams[i].polygonEnd();
+      }
+    };
+  }
+  function geoAlbersUk() {
+    var cache, cacheStream, main2 = d3Geo.geoAlbers().rotate([4.4, 0.8]).center([0, 55.4]).parallels([50, 60]), mainPoint, shetland = d3Geo.geoAlbers().rotate([4.4, 0.8]).center([0, 55.4]).parallels([50, 60]), shetlandPoint, point, pointStream = {
+      point: function(x, y) {
+        point = [x, y];
+      }
+    };
+    function albersUk(coordinates) {
+      var x = coordinates[0], y = coordinates[1];
+      return point = null, (mainPoint.point(x, y), point) || (shetlandPoint.point(x, y), point);
+    }
+    albersUk.invert = function(coordinates) {
+      var k = main2.scale(), t = main2.translate(), x = (coordinates[0] - t[0]) / k, y = (coordinates[1] - t[1]) / k;
+      return (y >= -0.089 && y < 0.06 && x >= 0.029 && x < 0.046 ? shetland : main2).invert(coordinates);
+    };
+    albersUk.stream = function(stream) {
+      return cache && cacheStream === stream ? cache : cache = multiplex([
+        main2.stream(cacheStream = stream),
+        shetland.stream(stream)
+      ]);
+    };
+    albersUk.precision = function(_2) {
+      if (!arguments.length)
+        return main2.precision();
+      main2.precision(_2), shetland.precision(_2);
+      return reset();
+    };
+    albersUk.scale = function(_2) {
+      if (!arguments.length)
+        return main2.scale();
+      main2.scale(_2), shetland.scale(_2);
+      return albersUk.translate(main2.translate());
+    };
+    albersUk.translate = function(_2) {
+      if (!arguments.length)
+        return main2.translate();
+      var k = main2.scale(), x = +_2[0], y = +_2[1];
+      mainPoint = main2.translate(_2).clipExtent([
+        [x - 0.065 * k, y - 0.089 * k],
+        [x + 0.075 * k, y + 0.089 * k]
+      ]).stream(pointStream);
+      shetlandPoint = shetland.translate([x + 0.01 * k, y + 0.025 * k]).clipExtent([
+        [x + 0.029 * k + epsilon$1, y - 0.089 * k + epsilon$1],
+        [x + 0.046 * k - epsilon$1, y - 0.06 * k - epsilon$1]
+      ]).stream(pointStream);
+      return reset();
+    };
+    albersUk.fitExtent = function(extent, object) {
+      return fitExtent(albersUk, extent, object);
+    };
+    albersUk.fitSize = function(size, object) {
+      return fitSize(albersUk, size, object);
+    };
+    function reset() {
+      cache = cacheStream = null;
+      return albersUk;
+    }
+    albersUk.drawCompositionBorders = function(context) {
+      var ul, ur, ld, ll;
+      ul = main2([-1.113205870242365, 59.64920050773357]);
+      ur = main2([0.807899092399606, 59.59085836472269]);
+      ld = main2([0.5778611961420386, 57.93467822832577]);
+      ll = main2([-1.25867782078448, 57.99029450085142]);
+      context.moveTo(ul[0], ul[1]);
+      context.lineTo(ur[0], ur[1]);
+      context.lineTo(ld[0], ld[1]);
+      context.lineTo(ll[0], ll[1]);
+      context.closePath();
+    };
+    albersUk.getCompositionBorders = function() {
+      var context = path$2();
+      this.drawCompositionBorders(context);
+      return context.toString();
+    };
+    return albersUk.scale(2800);
+  }
+  function bboxFeature(bounds) {
+    const minLon = bounds[0][0];
+    const minLat = bounds[0][1];
+    const maxLon = bounds[1][0];
+    const maxLat = bounds[1][1];
+    const feature = {
+      type: "Feature",
+      properties: {},
+      geometry: {
+        coordinates: [[[minLon, maxLat], [maxLon, maxLat], [maxLon, minLat], [minLon, minLat], [minLon, maxLat]]],
+        type: "Polygon"
+      }
+    };
+    return feature;
+  }
+  const MapContext = preact.createContext();
+  function SVGMapProvider({
+    id,
+    mapRef,
+    width,
+    height,
+    padding,
+    config,
+    zoom,
+    selectedFeature,
+    children
+  }) {
+    const contentSize = hooks.useMemo(() => ({
+      width: width - padding.left - padding.right,
+      height: height - padding.top - padding.bottom
+    }), [width, height, padding]);
+    const projection = hooks.useMemo(() => {
+      return config.projection.fitSize([contentSize.width, contentSize.height], bboxFeature(config.bounds));
+    }, [contentSize, config]);
+    const path2 = d3Geo.geoPath().projection(projection);
+    const context = {
+      id,
+      mapRef,
+      projection,
+      config,
+      path: path2,
+      size: {
+        width,
+        height
+      },
+      contentSize,
+      padding,
+      zoom,
+      extent: [[0, 0], [width, height]],
+      selectedFeature
+    };
+    return jsxRuntime.jsx(MapContext.Provider, {
+      value: context,
+      children
+    });
+  }
+  const path$1 = "_path_1cwd5_9";
+  const defaultStyles$3 = {
+    path: path$1
+  };
+  function CompositionBorders({
+    styles: styles2
+  }) {
+    const {
+      projection
+    } = hooks.useContext(MapContext);
+    styles2 = mergeStyles(defaultStyles$3, styles2);
+    return jsxRuntime.jsx("path", {
+      className: styles2.path,
+      d: projection.getCompositionBorders()
+    });
+  }
+  function SVGRenderer({
+    children
+  }) {
+    const {
+      id,
+      mapRef,
+      config,
+      size,
+      selectedFeature,
+      padding
+    } = hooks.useContext(MapContext);
+    return jsxRuntime.jsx("svg", {
+      id,
+      ref: mapRef,
+      width: size.width,
+      height: size.height,
+      viewBox: `0 0 ${size.width} ${size.height}`,
+      xmlns: "http://www.w3.org/2000/svg",
+      onClick: () => {
+        if (selectedFeature) {
+          selectedFeature.value = null;
+        }
+      },
+      children: jsxRuntime.jsxs("g", {
+        transform: `translate(${padding.left} ${padding.top})`,
+        children: [jsxRuntime.jsx("g", {
+          children
+        }), config.drawCompositionBorders && Object.prototype.hasOwnProperty.call(config.projection, "getCompositionBorders") && jsxRuntime.jsx(CompositionBorders, {})]
+      })
+    });
+  }
+  function useContainerSize(containerRef) {
+    const windowSize = useWindowSize();
+    const [containerSize, setContainerSize] = hooks.useState();
+    hooks.useLayoutEffect(() => {
+      const container2 = containerRef.current;
+      if (!container2)
+        return;
+      setContainerSize({
+        width: container2.clientWidth,
+        height: container2.clientHeight
+      });
+    }, [containerRef, windowSize]);
+    return containerSize;
+  }
+  const container$1 = "_container_cyrny_1";
+  const svg$1 = "_svg_cyrny_6";
+  const styles$3 = {
+    container: container$1,
+    svg: svg$1
+  };
+  function dynamicPropValue(prop, d2, index2) {
+    if (typeof prop === "function") {
+      return prop(d2, index2);
+    }
+    return prop;
+  }
+  function Polygon({
+    id,
+    features,
+    fill = null,
+    stroke = null,
+    strokeWidth = 1,
+    styles: styles2
+  }) {
+    const context = hooks.useContext(MapContext);
+    return jsxRuntime.jsx(jsxRuntime.Fragment, {
+      children: features.map((d2, index2) => {
+        return jsxRuntime.jsx("path", {
+          id: dynamicPropValue(id, d2, index2),
+          className: dynamicPropValue(styles2, d2, index2),
+          fill: dynamicPropValue(fill, d2, index2),
+          stroke: dynamicPropValue(stroke, d2, index2),
+          "stroke-width": dynamicPropValue(strokeWidth, d2, index2),
+          d: context.path(d2)
+        }, index2);
+      })
+    });
+  }
+  function Line({
+    id,
+    features,
+    stroke = null,
+    strokeWidth = 1,
+    styles: styles2
+  }) {
+    const context = hooks.useContext(MapContext);
+    const draw = (ctx, path2) => {
+      for (const feature of features) {
+        ctx.beginPath();
+        ctx.lineWidth = strokeWidth / context.pixelRatio;
+        ctx.strokeStyle = stroke;
+        path2(feature);
+        ctx.stroke();
+      }
+    };
+    hooks.useEffect(() => {
+      if (context.config.drawToCanvas) {
+        context.register(draw);
+      }
+      return () => {
+        if (context.config.drawToCanvas) {
+          context.unregister(draw);
+        }
+      };
+    }, []);
+    if (context.config.drawToCanvas) {
+      return "<!--Line layer-->";
+    }
+    return jsxRuntime.jsx(jsxRuntime.Fragment, {
+      children: features.map((d2, index2) => {
+        const initialStrokeWidth = dynamicPropValue(strokeWidth, d2, index2);
+        const scaledStrokeWidth = initialStrokeWidth / context.zoomScale;
+        return jsxRuntime.jsx("path", {
+          id: dynamicPropValue(id, d2, index2),
+          stroke: dynamicPropValue(stroke, d2, index2),
+          "stroke-line-join": "round",
+          "stroke-width": scaledStrokeWidth,
+          fill: "none",
+          className: dynamicPropValue(styles2, d2, index2),
+          d: context.path(d2)
+        }, index2);
+      })
+    });
+  }
+  function Prerendered({
+    url
+  }) {
+    const context = hooks.useContext(MapContext);
+    const {
+      width,
+      height
+    } = context.contentSize;
+    return jsxRuntime.jsx("image", {
+      width,
+      height,
+      href: url
+    });
+  }
+  function Point({
+    id,
+    features,
+    radius = 4,
+    fill = null,
+    stroke = null,
+    strokeWidth = 1,
+    styles: styles2
+  }) {
+    const context = hooks.useContext(MapContext);
+    return jsxRuntime.jsx(jsxRuntime.Fragment, {
+      children: features.map((d2, index2) => {
+        const [cx, cy] = context.projection(d2.geometry.coordinates);
+        return jsxRuntime.jsx("circle", {
+          id: dynamicPropValue(id, d2, index2),
+          cx,
+          cy,
+          r: dynamicPropValue(radius, d2, index2),
+          className: dynamicPropValue(styles2, d2, index2),
+          fill: dynamicPropValue(fill, d2, index2),
+          stroke: dynamicPropValue(stroke, d2, index2),
+          strokeWidth: dynamicPropValue(strokeWidth, d2, index2)
+        }, index2);
+      })
+    });
+  }
+  const index = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+    __proto__: null,
+    CompositionBorders,
+    Line,
+    Point,
+    Polygon,
+    Prerendered
+  }, Symbol.toStringTag, { value: "Module" }));
+  const Projection = {
+    geoAlbersUKComposite: geoAlbersUk(),
+    geoAlbersEngland: d3Geo.geoAlbers().center([0, 52.7]).rotate([1.1743, 0]).parallels([50, 54]),
+    geoMercator: d3Geo.geoMercator()
+  };
+  const MapConfiguration = {
+    UKComposite: {
+      projection: Projection.geoAlbersUKComposite,
+      bounds: [[-8.642194417322951, 49.88234469492934], [1.7683086664999994, 60.8456995072]],
+      drawCompositionBorders: true,
+      drawToCanvas: false
+    },
+    England: {
+      projection: Projection.geoAlbersEngland,
+      bounds: [[-6.41866730264044, 49.8647926027119], [1.76370537625026, 55.8111151140706]],
+      drawCompositionBorders: false,
+      drawToCanvas: false
+    },
+    London: {
+      projection: d3Geo.geoMercator(),
+      bounds: [[-0.510356073504132, 51.2867586289553], [0.334043866981608, 51.6918768002741]],
+      drawCompositionBorders: false,
+      drawToCanvas: false
+    }
+  };
+  const ZERO_PADDING = {
+    top: 0,
+    right: 0,
+    bottom: 0,
+    left: 0
+  };
+  const DEFAULT_ZOOM = {
+    enabled: false,
+    minZoom: 1,
+    maxZoom: 8
+  };
+  const Map$1 = compat.forwardRef(({
+    id,
+    width,
+    height,
+    config,
+    children,
+    padding = {
+      top: 20,
+      right: 20,
+      bottom: 20,
+      left: 20
+    },
+    zoom,
+    selectedFeature
+  }, ref) => {
+    padding = padding || ZERO_PADDING;
+    zoom = Object.assign(DEFAULT_ZOOM, zoom);
+    const containerRef = hooks.useRef();
+    const [isReady, setIsReady] = hooks.useState(false);
+    hooks.useLayoutEffect(() => {
+      if (!isReady) {
+        setIsReady(true);
+      }
+    }, [isReady]);
+    hooks.useImperativeHandle(
+      ref,
+      () => ({
+        isReady,
+        getContainer: () => containerRef.current,
+        findFeatureAtPoint
+      }),
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+      [isReady]
+    );
+    function findFeatureAtPoint({
+      x,
+      y
+    }) {
+      const adjustedPoint = [x - padding.left, y - padding.top];
+      const coordinates = config.projection.invert(adjustedPoint);
+      for (const child of preact.toChildArray(children)) {
+        if (Object.prototype.hasOwnProperty.call(child.props, "features")) {
+          const features = child.props.features;
+          for (const feature of features) {
+            if (d3Geo.geoContains(feature, coordinates)) {
+              return feature;
+            }
+          }
+        }
+      }
+      return null;
+    }
+    const containerSize = useContainerSize(containerRef);
+    const containerStyle = hooks.useMemo(() => {
+      const style = {};
+      if (width > 0)
+        style["width"] = width;
+      if (height > 0)
+        style["height"] = height;
+      return style;
+    }, [width, height]);
+    const mapRef = hooks.useRef();
+    const renderSVG = containerSize && !config.drawToCanvas;
+    return jsxRuntime.jsx("div", {
+      ref: containerRef,
+      className: styles$3.container,
+      style: containerStyle,
+      children: renderSVG && jsxRuntime.jsx(SVGMapProvider, {
+        id,
+        width: containerSize.width,
+        height: containerSize.height,
+        padding,
+        config,
+        mapRef,
+        selectedFeature,
+        zoom,
+        children: jsxRuntime.jsx(SVGRenderer, {
+          children
+        })
+      })
+    });
+  });
+  const container = "_container_azu4a_1";
+  const paragraph = "_paragraph_azu4a_12";
+  const defaultStyles$2 = {
+    container,
+    paragraph
+  };
+  function ResultSummary({
+    previous: previous2,
+    next: next2,
+    title: title2,
+    text: text2,
+    timestamp,
+    styles: styles2
+  }) {
+    styles2 = mergeStyles({
+      ...defaultStyles$2
+    }, styles2);
+    return jsxRuntime.jsxs("div", {
+      class: styles2.container,
+      children: [jsxRuntime.jsx(ControlChange, {
+        previous: previous2,
+        next: next2,
+        text: title2
+      }), jsxRuntime.jsx("p", {
+        className: styles2.paragraph,
+        children: text2
+      }), jsxRuntime.jsx(RelativeTimeSentence, {
+        timeStamp: timestamp
+      })]
+    });
+  }
+  const svg = "_svg_1dms8_1";
+  const path = "_path_1dms8_8";
+  const styles$2 = {
+    svg,
+    path
+  };
+  function SearchIcon() {
+    return jsxRuntime.jsx("svg", {
+      viewBox: "0 0 20 20",
+      xmlns: "http://www.w3.org/2000/svg",
+      className: styles$2.svg,
+      children: jsxRuntime.jsx("path", {
+        className: styles$2.path,
+        "fill-rule": "evenodd",
+        "clip-rule": "evenodd",
+        d: "M7.273 0c4.022 0 7.25 3.295 7.25 7.273a7.226 7.226 0 01-7.25 7.25C3.25 14.523 0 11.295 0 7.273 0 3.295 3.25 0 7.273 0zm0 1.84A5.403 5.403 0 001.84 7.274c0 3 2.409 5.454 5.432 5.454 3 0 5.454-2.454 5.454-5.454 0-3.023-2.454-5.432-5.454-5.432zM20 18.16l-5.432-5.432h-.932l-.909.91v.931L18.16 20 20 18.159z"
+      })
+    });
+  }
+  const searchContainer = "_searchContainer_g5w44_1";
+  const input = "_input_g5w44_5";
+  const searchIcon = "_searchIcon_g5w44_21";
+  const clearButton = "_clearButton_g5w44_30";
+  const suggestions = "_suggestions_g5w44_36";
+  const suggestion = "_suggestion_g5w44_36";
+  const selected = "_selected_g5w44_59";
+  const highlighted = "_highlighted_g5w44_63";
+  const defaultStyles$1 = {
+    searchContainer,
+    input,
+    searchIcon,
+    clearButton,
+    suggestions,
+    suggestion,
+    selected,
+    highlighted
+  };
+  function SearchInput({
+    placeholder,
+    inputValue,
+    maxSuggestions = 5,
+    onInputChange,
+    onSubmit,
+    onSelect,
+    onClear,
+    styles: styles2
+  }) {
+    var _a, _b, _c;
+    styles2 = mergeStyles(defaultStyles$1, styles2);
+    const inputRef = hooks.useRef(null);
+    const [selectedIndex, setSelectedIndex] = hooks.useState(-1);
+    const [suggestions2, setSuggestions] = hooks.useState();
+    const [showSuggestions, setShowSuggestions] = hooks.useState(true);
+    function onKeyDown(event) {
+      if (event.key === "ArrowDown") {
+        event.preventDefault();
+        setSelectedIndex((currentIndex) => Math.min(currentIndex + 1, suggestions2.length - 1));
+      } else if (event.key === "ArrowUp") {
+        event.preventDefault();
+        setSelectedIndex((currentIndex) => Math.max(currentIndex - 1, -1));
+      } else if (event.key === "Enter" && selectedIndex >= 0) {
+        event.preventDefault();
+        onSelectSuggestion(suggestions2[selectedIndex]);
+      } else if (event.key === "Enter") {
+        onSubmit(inputRef.current.value);
+      }
+    }
+    async function inputChanged(input2) {
+      let suggestions22 = await onInputChange(input2);
+      if (suggestions22) {
+        suggestions22 = suggestions22.slice(0, maxSuggestions);
+      }
+      setSuggestions(suggestions22);
+      setSelectedIndex(-1);
+    }
+    function onSelectSuggestion(suggestion2) {
+      onSelect(suggestion2);
+      inputRef.current.value = suggestion2.text;
+      inputRef.current.blur();
+    }
+    const showClearButton = ((_a = inputRef.current) == null ? void 0 : _a.value) && ((_b = inputRef.current) == null ? void 0 : _b.value) !== "";
+    return jsxRuntime.jsxs("div", {
+      className: styles2.searchContainer,
+      children: [jsxRuntime.jsx("input", {
+        name: "search",
+        placeholder,
+        ref: inputRef,
+        type: "text",
+        "aria-label": "Search input",
+        value: inputValue,
+        onKeyDown,
+        onInput: (e) => {
+          inputChanged(e.target.value);
+        },
+        onBlur: () => {
+          setShowSuggestions(false);
+        },
+        onFocus: (e) => {
+          e.target.select();
+          setShowSuggestions(true);
+        },
+        className: styles2.input
+      }), jsxRuntime.jsx("div", {
+        className: styles2.searchIcon,
+        children: jsxRuntime.jsx(SearchIcon, {})
+      }), showClearButton && jsxRuntime.jsx("div", {
+        className: styles2.clearButton,
+        children: jsxRuntime.jsx(CloseButton, {
+          border: false,
+          onClick: () => {
+            const emptyValue = "";
+            inputRef.current.value = emptyValue;
+            inputChanged(emptyValue);
+            inputRef.current.focus();
+            onClear();
+          }
+        })
+      }), showSuggestions && jsxRuntime.jsx(SuggestionList, {
+        suggestions: suggestions2,
+        highlightText: (_c = inputRef.current) == null ? void 0 : _c.value,
+        selectedIndex,
+        styles: styles2,
+        onMouseOver: (_2, index2) => setSelectedIndex(index2),
+        onSelect: onSelectSuggestion
+      })]
+    });
+  }
+  function SuggestionList({
+    suggestions: suggestions2,
+    highlightText,
+    selectedIndex,
+    styles: styles2,
+    onMouseOver,
+    onSelect
+  }) {
+    if (!suggestions2 || suggestions2.length === 0)
+      return;
+    return jsxRuntime.jsx("ul", {
+      className: styles2.suggestions,
+      "aria-label": "Search suggestions",
+      children: suggestions2.map((d2, index2) => {
+        return jsxRuntime.jsx("li", {
+          "aria-label": d2.text,
+          className: [styles2.suggestion, index2 === selectedIndex && styles2.selected].join(" "),
+          onMouseDown: (e) => e.preventDefault(),
+          onMouseOver: () => onMouseOver(d2, index2),
+          onClick: () => {
+            onSelect(d2);
+          },
+          children: d2.text.split(new RegExp(`(${highlightText})`, "ig")).map((part, i) => i % 2 === 1 ? jsxRuntime.jsx("span", {
+            className: styles2.highlighted,
+            children: part
+          }, i) : part)
+        }, index2);
+      })
+    });
+  }
+  const coalitionsWrapper = "_coalitionsWrapper_1ahqy_9";
+  const coalitionsContainer = "_coalitionsContainer_1ahqy_14";
+  const coalition = "_coalition_1ahqy_9";
+  const title = "_title_1ahqy_27";
+  const description = "_description_1ahqy_28";
+  const thresholdText = "_thresholdText_1ahqy_43";
+  const thresholdTextBold = "_thresholdTextBold_1ahqy_54";
+  const thresholdDot = "_thresholdDot_1ahqy_61";
+  const thresholdLine = "_thresholdLine_1ahqy_61";
+  const defaultStyles = {
+    coalitionsWrapper,
+    coalitionsContainer,
+    coalition,
+    title,
+    description,
+    thresholdText,
+    thresholdTextBold,
+    thresholdDot,
+    thresholdLine
+  };
+  function CoalitionsTracker({
+    coalitions,
+    threshold,
+    barChartHeight = 32,
+    listMembersAccessor = "parties",
+    listMemberTotalAccessor = "totalSeats",
+    listDescriptionAccessor = "description",
+    abbreviationAccessor = "abbreviation",
+    thresholdTextBold: thresholdTextBold2,
+    thresholdText: thresholdText2,
+    styles: styles2
+  }) {
+    const wrapperRef = hooks.useRef(null);
+    const thresholdTextRef = hooks.useRef(null);
+    const [width, setWidth] = hooks.useState(0);
+    const biggestListTotal = Math.max(...coalitions.map((l) => l[listMembersAccessor].reduce((acc, cur) => acc + cur[listMemberTotalAccessor], 0)));
+    const windowSize = useWindowSize();
+    const thresholdTextMinWidth = windowSize.width < 740 ? 66 : 150;
+    const thresholdDotWidth = 11;
+    const thresholdTextPaddingLeft = 5;
+    const maxBarWidth = width - thresholdTextMinWidth - (thresholdDotWidth - 1) / 2 - thresholdTextPaddingLeft;
+    const thresholdLeft = threshold / biggestListTotal * maxBarWidth;
+    const parsedLists = coalitions.map((coalition2) => {
+      const listTotal = coalition2[listMembersAccessor].reduce((acc, cur) => acc + cur[listMemberTotalAccessor], 0);
+      return {
+        title: coalition2["name"],
+        description: coalition2[listDescriptionAccessor],
+        height: barChartHeight,
+        width: listTotal / biggestListTotal * maxBarWidth,
+        stack: coalition2[listMembersAccessor].map((m) => {
+          const listTotal2 = coalition2[listMembersAccessor].reduce((acc, cur) => acc + cur[listMemberTotalAccessor], 0);
+          return {
+            label: m[listMemberTotalAccessor],
+            fraction: m[listMemberTotalAccessor] / listTotal2,
+            abbreviation: m[abbreviationAccessor]
+          };
+        }).sort((a, b) => b.fraction - a.fraction)
+      };
+    });
+    styles2 = mergeStyles(defaultStyles, styles2);
+    hooks.useLayoutEffect(() => {
+      const newWidth = wrapperRef.current.getBoundingClientRect().width;
+      setWidth(newWidth);
+    }, [windowSize]);
+    const renderCoalition = (list, index2) => {
+      if (list.width <= 0) {
+        return;
+      }
+      return jsxRuntime.jsxs("div", {
+        className: styles2.coalition,
+        style: {
+          position: "relative",
+          zIndex: 2
+        },
+        children: [jsxRuntime.jsx("h4", {
+          className: styles2.title,
+          children: list.title
+        }), jsxRuntime.jsx("p", {
+          className: styles2.description,
+          style: {
+            maxWidth: thresholdLeft <= 620 ? thresholdLeft - 8 : 620
+          },
+          children: list.description
+        }), jsxRuntime.jsx(StackedBar, {
+          stack: list.stack,
+          width: list.width,
+          height: barChartHeight,
+          createSVG: true
+        })]
+      }, index2);
+    };
+    return jsxRuntime.jsxs("div", {
+      ref: wrapperRef,
+      className: styles2.coalitionsWrapper,
+      children: [jsxRuntime.jsx("div", {
+        className: styles2.coalitionsContainer,
+        children: parsedLists.map(renderCoalition)
+      }), jsxRuntime.jsx("div", {
+        className: styles2.thresholdDot,
+        style: {
+          position: "absolute",
+          height: thresholdDotWidth,
+          width: thresholdDotWidth,
+          top: 0,
+          left: 0.5 + thresholdLeft - thresholdDotWidth / 2
+        }
+      }), jsxRuntime.jsx("div", {
+        className: styles2.thresholdLine,
+        style: {
+          position: "absolute",
+          height: "100%",
+          width: 1,
+          top: 0,
+          left: thresholdLeft
+        }
+      }), jsxRuntime.jsxs("div", {
+        ref: thresholdTextRef,
+        className: styles2.thresholdText,
+        style: {
+          position: "absolute",
+          minWidth: thresholdTextMinWidth,
+          width: "auto",
+          top: -(thresholdDotWidth + 1) / 2,
+          left: thresholdLeft + (thresholdDotWidth - 1) / 2 + thresholdTextPaddingLeft
+        },
+        children: [thresholdTextBold2 && jsxRuntime.jsx("span", {
+          className: styles2.thresholdTextBold,
+          children: thresholdTextBold2
+        }), thresholdText2 && jsxRuntime.jsx("span", {
+          children: thresholdText2
+        })]
+      })]
+    });
+  }
+  const gradient$1 = "_gradient_plpaq_9";
+  const firstStop = "_firstStop_plpaq_24";
+  const lastStop = "_lastStop_plpaq_29";
+  const styles$1 = {
+    gradient: gradient$1,
+    firstStop,
+    lastStop
+  };
+  function Gradient() {
+    return jsxRuntime.jsxs("svg", {
+      width: "100%",
+      height: "100%",
+      viewBox: "0 0 10 10",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      preserveAspectRatio: "none",
+      children: [jsxRuntime.jsx("g", {
+        className: styles$1.gradient,
+        children: jsxRuntime.jsx("rect", {
+          fill: "url(#paint0_linear_3798_6653)"
+        })
+      }), jsxRuntime.jsx("defs", {
+        children: jsxRuntime.jsxs("linearGradient", {
+          id: "paint0_linear_3798_6653",
+          x1: "0%",
+          y1: "0%",
+          x2: "100%",
+          y2: "0%",
+          children: [jsxRuntime.jsx("stop", {
+            className: styles$1.firstStop
+          }), jsxRuntime.jsx("stop", {
+            className: styles$1.lastStop,
+            offset: "1"
+          })]
+        })
+      })]
+    });
+  }
+  const ticker = "_ticker_1tpek_9";
+  const tickerItems = "_tickerItems_1tpek_19";
+  const tickerItem = "_tickerItem_1tpek_19";
+  const controls = "_controls_1tpek_41";
+  const gradient = "_gradient_1tpek_56";
+  const buttons = "_buttons_1tpek_70";
+  const button = "_button_1tpek_70";
+  const buttonInner = "_buttonInner_1tpek_96";
+  const styles = {
+    ticker,
+    tickerItems,
+    tickerItem,
+    controls,
+    gradient,
+    buttons,
+    button,
+    buttonInner
+  };
+  function totalSizeForElements(elements) {
+    return Array.from(elements).reduce((totalSize, element) => {
+      totalSize.width += element.clientWidth;
+      totalSize.height += element.clientHeight;
+      return totalSize;
+    }, {
+      width: 0,
+      height: 0
+    });
+  }
+  function Ticker({
+    maxItems = 20,
+    onStateChange,
+    children
+  }) {
+    const [offset, setOffset] = hooks.useState(0);
+    const windowSize = useWindowSize();
+    const tickerRef = hooks.useRef();
+    const tickerItemsRef = hooks.useRef();
+    const [hideButtons, setHideButtons] = hooks.useState(false);
+    const [nextButtonDisabled, setNextButtonDisabled] = hooks.useState(false);
+    const [expanded, setExpanded] = hooks.useState(false);
+    const childArray = preact.toChildArray(children);
+    hooks.useLayoutEffect(() => {
+      const tickerItemsContainer = tickerItemsRef.current;
+      if (tickerItemsContainer) {
+        const {
+          width,
+          height
+        } = totalSizeForElements(tickerItemsContainer.children);
+        const hideButtons2 = windowSize.width >= 480 ? width <= tickerItemsContainer.clientWidth : height <= tickerItemsContainer.clientHeight;
+        setHideButtons(hideButtons2);
+        if (tickerItemsContainer.children.length > 0) {
+          const itemWidth = tickerItemsContainer.children[0].clientWidth;
+          const nextButtonDisabled2 = offset * itemWidth > width - tickerItemsContainer.clientWidth;
+          setNextButtonDisabled(nextButtonDisabled2);
+        }
+      }
+    }, [offset, windowSize, childArray, setHideButtons, setNextButtonDisabled]);
+    function toggleExpandedState() {
+      setExpanded((expanded2) => {
+        const newState = !expanded2;
+        if (onStateChange)
+          onStateChange({
+            expanded: newState
+          });
+        return newState;
+      });
+    }
+    return jsxRuntime.jsxs("div", {
+      ref: tickerRef,
+      className: styles.ticker,
+      style: `--ticker-offset: ${offset}`,
+      "data-expanded": expanded,
+      children: [jsxRuntime.jsx("div", {
+        ref: tickerItemsRef,
+        className: styles.tickerItems,
+        children: childArray.map((child, index2) => jsxRuntime.jsx("div", {
+          className: styles.tickerItem,
+          children: child
+        }, index2))
+      }), jsxRuntime.jsxs("div", {
+        className: styles.controls,
+        style: hideButtons && {
+          display: "none"
+        },
+        children: [jsxRuntime.jsx("div", {
+          className: styles.gradient,
+          children: jsxRuntime.jsx(Gradient, {})
+        }), jsxRuntime.jsxs("div", {
+          className: styles.buttons,
+          children: [jsxRuntime.jsx(ArrowButton, {
+            onClick: () => setOffset((d2) => d2 + 1),
+            disabled: nextButtonDisabled
+          }), jsxRuntime.jsx(ArrowButton, {
+            direction: "left",
+            onClick: () => setOffset((d2) => d2 - 1),
+            disabled: offset <= 0
+          })]
+        }), jsxRuntime.jsx("div", {
+          className: styles.button,
+          children: jsxRuntime.jsx(Button, {
+            type: "small",
+            styles: {
+              buttonInner: styles.buttonInner
+            },
+            onClick: toggleExpandedState,
+            children: expanded ? "Show less" : `Show ${maxItems} most recent`
+          })
+        })]
+      })]
+    });
+  }
+  exports2.ArrowButton = ArrowButton;
+  exports2.Button = Button;
+  exports2.ChangeBar = ChangeBar;
+  exports2.Chevron = Chevron;
+  exports2.CircleIcon = CircleIcon;
+  exports2.CloseButton = CloseButton;
+  exports2.CoalitionsTracker = CoalitionsTracker;
+  exports2.ColumnChart = ColumnChart;
+  exports2.Container = Container;
+  exports2.ControlChange = ControlChange;
+  exports2.GradientIcon = GradientIcon;
+  exports2.InfoButton = InfoButton;
+  exports2.LegendItem = LegendItem;
+  exports2.Map = Map$1;
+  exports2.MapConfiguration = MapConfiguration;
+  exports2.MapLayers = index;
+  exports2.PageSection = PageSection;
+  exports2.PartyProfile = PartyProfile;
+  exports2.Projection = Projection;
+  exports2.RelativeTimeSentence = RelativeTimeSentence;
+  exports2.ResultSummary = ResultSummary;
+  exports2.SearchInput = SearchInput;
+  exports2.SlopeChart = SlopeChart;
+  exports2.SquareCutCornerIcon = SquareCutCornerIcon;
+  exports2.SquareIcon = SquareIcon;
+  exports2.StackedBar = StackedBar;
+  exports2.StackedGrid = StackedGrid;
+  exports2.Table = Table;
+  exports2.Ticker = Ticker;
+  exports2.Tooltip = Tooltip;
+  exports2.TooltipType = TooltipType;
+  exports2.ToplineResult = ToplineResult;
+  Object.defineProperty(exports2, Symbol.toStringTag, { value: "Module" });
+});
+//# sourceMappingURL=interactive-component-library.umd.cjs.map