Forked react-map-interaction to change zoom scale

.yalc/react-map-interaction/.yalcignore

@@ -0,0 +1,13 @@
+/.storybook
+/example
+/src
+/stories
+.babelrc
+.gitignore
+.mocharc.json
+.nvmrc
+*.md
+*.sh
+example.gif
+mochaTestSetup.js
+webpack.config.js

.yalc/react-map-interaction/package.json

@@ -0,0 +1,36 @@
+{
+  "name": "react-map-interaction",
+  "version": "2.0.0+760fcdb2",
+  "description": "'Add map like zooming and dragging to any element'",
+  "main": "dist/react-map-interaction.js",
+  "scripts": {
+    "test": "./node_modules/mocha/bin/mocha",
+    "test:watch": "./node_modules/mocha/bin/mocha --watch",
+    "test:cover": "nyc ./node_modules/mocha/bin/mocha",
+    "dist": "webpack --config webpack.config.js --mode production",
+    "dist:dev": "npm run dist && ./copy-to-example.sh",
+    "storybook": "start-storybook -p 6006",
+    "build-storybook": "build-storybook"
+  },
+  "keywords": [
+    "react",
+    "zoom",
+    "pan",
+    "pinch",
+    "data visualization",
+    "map"
+  ],
+  "author": "Transcriptic",
+  "private": false,
+  "license": "MIT",
+  "peerDependencies": {
+    "react": "^16.3.0",
+    "prop-types": "^15.0.0"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/transcriptic/react-map-interaction"
+  },
+  "dependencies": {},
+  "yalcSig": "760fcdb2b8c4ce14979304df32411d35"
+}

.yalc/react-map-interaction/yalc.sig

@@ -0,0 +1 @@
+760fcdb2b8c4ce14979304df32411d35

apps/blueprints/src/components/FullscreenImage.tsx

@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import { css } from "@emotion/react";
 import { MapInteractionCSS } from "react-map-interaction";
 import { Image } from "@chakra-ui/image";
@@ -51,6 +51,13 @@ export const FullscreenImage: React.FC<FullscreenImageProps> = ({ alt, src }) =>
     translation: { x: window.innerWidth * 0.05, y: 30 },
   });
 
+  useEffect(() => {
+    setState({
+      scale: 0.9,
+      translation: { x: window.innerWidth * 0.05, y: 30 },
+    });
+  }, [src]);
+
   return (
     <>
       <StyledImage>

package.json

@@ -57,7 +57,7 @@
     "react-cookie": "4.0.3",
     "react-dom": "17.0.1",
     "react-icons": "4.2.0",
-    "react-map-interaction": "2.0.0",
+    "react-map-interaction": "file:.yalc/react-map-interaction",
     "react-markdown": "5.0.3",
     "react-multi-select-component": "3.1.6",
     "sharp": "0.27.2",

yalc.lock

@@ -5,6 +5,11 @@
       "signature": "4db8c378010b5990474548640c7c809e",
       "file": true,
       "replaced": "./fbe-editor-v1.0.0.tgz"
+    },
+    "react-map-interaction": {
+      "signature": "760fcdb2b8c4ce14979304df32411d35",
+      "file": true,
+      "replaced": "2.0.0"
     }
   }
 }