@guardian/interactive-component-library 0.8.6 → 0.8.8

package/dist/components/molecules/canvas-map/lib/View.d.ts

@@ -48,22 +48,7 @@ export class View {
         };
     }, debug?: boolean);
     debug: boolean;
-    projection: {
-        (p: any): number[];
-        invert(p: any): number[];
-        stream(stream: any): any;
-        postclip(_: any, ...args: any[]): any;
-        clipExtent(_: any, ...args: any[]): any[][] | any;
-        scale(_: any, ...args: any[]): number | any;
-        translate(_: any, ...args: any[]): number[] | any;
-        angle(_: any, ...args: any[]): number | any;
-        reflectX(_: any, ...args: any[]): boolean | any;
-        reflectY(_: any, ...args: any[]): boolean | any;
-        fitExtent(extent: any, object: any): any;
-        fitSize(size: any, object: any): any;
-        fitWidth(width: any, object: any): any;
-        fitHeight(height: any, object: any): any;
-    };
+    projection: any;
     bounds: GeoBounds;
     extent: Extent;
     minZoom: number;
@@ -123,8 +108,8 @@ export class View {
      * @returns {Extent} - The extent relative to the current viewport
      */
     projectExtent(extent: Extent): Extent;
-    invert(point: any): number[];
-    invertBounds(bounds: any): number[][];
+    invert(point: any): any;
+    invertBounds(bounds: any): any[];
     getResolution(): number;
     getZoomLevel(): number;
     /**
@@ -145,22 +130,7 @@ export class View {
     getVisibleBounds(transform: ZoomTransform, projection: any): import('./util').GeoBounds;
     getState(): {
         transform: ZoomTransform;
-        projection: {
-            (p: any): number[];
-            invert(p: any): number[];
-            stream(stream: any): any;
-            postclip(_: any, ...args: any[]): any;
-            clipExtent(_: any, ...args: any[]): any[][] | any;
-            scale(_: any, ...args: any[]): number | any;
-            translate(_: any, ...args: any[]): number[] | any;
-            angle(_: any, ...args: any[]): number | any;
-            reflectX(_: any, ...args: any[]): boolean | any;
-            reflectY(_: any, ...args: any[]): boolean | any;
-            fitExtent(extent: any, object: any): any;
-            fitSize(size: any, object: any): any;
-            fitWidth(width: any, object: any): any;
-            fitHeight(height: any, object: any): any;
-        };
+        projection: any;
         zoomLevel: any;
         pixelRatio: number;
         padding: {

package/dist/components/molecules/canvas-map/lib/View.js

@@ -22,7 +22,7 @@ class View {
   }, debug = false) {
     this.debug = debug;
     projection.revision = 0;
-    this.projection = projection;
+    this.projection = projection.copy ? projection.copy() : { ...projection };
     this.bounds = bounds && GeoBounds.convert(bounds);
     this.extent = Extent.convert(extent) || GeoBounds.convert(bounds).toExtent();
     this.minZoom = minZoom;

package/dist/components/molecules/control-change/index.js

@@ -1,4 +1,4 @@
-import { jsxs, jsx } from "preact/jsx-runtime";
+import { jsx, jsxs, Fragment } from "preact/jsx-runtime";
 import { mergeStyles } from "../../../styles/helpers/mergeStyles.js";
 import "preact/hooks";
 import { GradientIcon } from "../../particles/gradient-icon/index.js";
@@ -8,19 +8,21 @@ import "../../particles/relative-time-sentence/index.js";
 import defaultStyles from "./style.module.css.js";
 const ControlChange = ({ previous, next, text, styles }) => {
   styles = mergeStyles({ ...defaultStyles }, styles);
-  let hasChanged = previous && next !== previous;
-  return /* @__PURE__ */ jsxs("div", { className: styles.container, children: [
-    hasChanged ? /* @__PURE__ */ jsx(
+  let changeIcon;
+  if (previous && next && next !== previous) {
+    changeIcon = /* @__PURE__ */ jsx(
       GradientIcon,
       {
         previous,
         next,
-        styles: {
-          previous: styles.previous,
-          next: styles.next
-        }
+        styles: { previous: styles.previous, next: styles.next }
       }
-    ) : /* @__PURE__ */ jsx(CircleIcon, { styles: { circle: `fill-color--${next}` } }),
+    );
+  } else if (next) {
+    changeIcon = /* @__PURE__ */ jsx(CircleIcon, { styles: { circle: `fill-color--${next}` } });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: styles.container, children: [
+    changeIcon && /* @__PURE__ */ jsx(Fragment, { children: changeIcon }),
     /* @__PURE__ */ jsx("strong", { className: styles.text, children: text })
   ] });
 };

package/dist/components/molecules/control-change/style.module.css.js

@@ -1,5 +1,5 @@
-const text = "_text_1b8t2_1";
-const container = "_container_1b8t2_10";
+const text = "_text_lsh6d_1";
+const container = "_container_lsh6d_13";
 const defaultStyles = {
   text,
   container

package/dist/components/molecules/result-summary/index.js

@@ -1,4 +1,4 @@
-import { jsx, jsxs } from "preact/jsx-runtime";
+import { jsx, jsxs, Fragment } from "preact/jsx-runtime";
 import "preact/hooks";
 import { mergeStyles } from "../../../styles/helpers/mergeStyles.js";
 import "preact/compat";
@@ -35,25 +35,29 @@ function ResultSummary({
 }) {
   styles = mergeStyles({ ...defaultStyles }, styles);
   if (isSlim) {
-    let hasChanged = previous && next !== previous;
+    let changeIcon;
+    if (previous && next && next !== previous) {
+      changeIcon = /* @__PURE__ */ jsx(
+        GradientIcon,
+        {
+          previous,
+          next,
+          styles: { previous: styles.previous, next: styles.next }
+        }
+      );
+    } else if (next && !previous) {
+      changeIcon = /* @__PURE__ */ jsx(CircleIcon, { styles: { circle: `fill-color--${next}` } });
+    }
     return /* @__PURE__ */ jsx(
       "div",
       {
         className: `${styles.container} ${styles.containerSlim}`,
         onClick,
         children: /* @__PURE__ */ jsxs("p", { className: `${styles.titleSlim} ${lineClamp && styles.lineClamp}`, children: [
-          hasChanged ? /* @__PURE__ */ jsx(
-            GradientIcon,
-            {
-              previous,
-              next,
-              styles: {
-                previous: styles.previous,
-                next: styles.next
-              }
-            }
-          ) : /* @__PURE__ */ jsx(CircleIcon, { styles: { circle: `fill-color--${next}` } }),
-          " ",
+          changeIcon && /* @__PURE__ */ jsxs(Fragment, { children: [
+            changeIcon,
+            " "
+          ] }),
           title,
           " ",
           /* @__PURE__ */ jsx(RelativeTimeSentence, { timeStamp: timestamp })

package/dist/style.css

@@ -1294,7 +1294,7 @@ body {
   --news-grey-06: #f3f3f3;
   --con: #0077b6;
   --lab: #c70000;
-  --libdem: #e05e00;
+  --libdem: #ff7f0f;
   --green: #39a566;
   --ukip: #bb3b80;
   --snp: #f5dc00;
@@ -1314,7 +1314,7 @@ body {
   --undeclared: #e7e7e7;
   --con-2: #d4edff;
   --lab-2: #ffdbd4;
-  --libdem-2: #ffebdd;
+  --libdem-2: #ffe2cd;
   --green-2: #d3f2de;
   --ukip-2: #ffe6f4;
   --snp-2: #fff7c7;
@@ -2030,16 +2030,19 @@ body.android {
 ._tooltip_11t5d_1 {
   pointer-events: none;
 }
-._text_1b8t2_1 {
+._text_lsh6d_1 {
   color: var(--primary-text-color);
   font-family: var(--text-sans);
   font-size: var(--sans-small);
   line-height: var(--sans-line-height);
   font-weight: 700;
+}
+
+svg + ._text_lsh6d_1 {
   margin-left: var(--space-1);
 }
 
-._container_1b8t2_10 {
+._container_lsh6d_13 {
   font-weight: 700;
 }
 ._wrapper_kh25l_1 {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@guardian/interactive-component-library",
   "private": false,
-  "version": "0.8.6",
+  "version": "0.8.8",
   "packageManager": "pnpm@8.4.0",
   "repository": {
     "type": "git",