qr reader

11 files changed, 415 insertions, 109 deletions

diff --git a/packages/taler-wallet-webextension/package.json b/packages/taler-wallet-webextension/package.json
index b62bae081..8d823e60d 100644
--- a/packages/taler-wallet-webextension/package.json
+++ b/packages/taler-wallet-webextension/package.json
@@ -27,6 +27,7 @@
     "history": "4.10.1",
     "preact": "^10.6.5",
     "preact-router": "3.2.1",
+    "qr-scanner": "^1.4.1",
     "qrcode-generator": "^1.4.4",
     "tslib": "^2.3.1",
     "ws": "7.4.5"
diff --git a/packages/taler-wallet-webextension/src/NavigationBar.tsx b/packages/taler-wallet-webextension/src/NavigationBar.tsx
index f782575de..edcf44d35 100644
--- a/packages/taler-wallet-webextension/src/NavigationBar.tsx
+++ b/packages/taler-wallet-webextension/src/NavigationBar.tsx
@@ -33,6 +33,7 @@ import {
 } from "./components/styled/index.js";
 import { useTranslationContext } from "./context/translation.js";
 import settingsIcon from "./svg/settings_black_24dp.svg";
+import qrIcon from "./svg/qr_code_24px.svg";
 
 /**
  * List of pages used by the wallet
@@ -101,6 +102,7 @@ export const Pages = {
   ),
   backupProviderAdd: "/backup/provider/add",
 
+  qr: "/qr",
   settings: "/settings",
   settingsExchangeAdd: pageDefinition<{ currency?: string }>(
     "/settings/exchange/add/:currency?",
@@ -127,13 +129,22 @@ export function PopupNavBar({ path = "" }: { path?: string }): VNode {
       <a href={Pages.backup} class={path.startsWith("/backup") ? "active" : ""}>
         <i18n.Translate>Backup</i18n.Translate>
       </a>
-      <a href={Pages.settings}>
-        <SvgIcon
-          title={i18n.str`Settings`}
-          dangerouslySetInnerHTML={{ __html: settingsIcon }}
-          color="white"
-        />
-      </a>
+      <div style={{ display: "flex", paddingTop: 4, justifyContent: "right" }}>
+        <a href={Pages.qr}>
+          <SvgIcon
+            title={i18n.str`QR Reader`}
+            dangerouslySetInnerHTML={{ __html: qrIcon }}
+            color="white"
+          />
+        </a>
+        <a href={Pages.settings}>
+          <SvgIcon
+            title={i18n.str`Settings`}
+            dangerouslySetInnerHTML={{ __html: settingsIcon }}
+            color="white"
+          />
+        </a>
+      </div>
     </NavigationHeader>
   );
 }
@@ -162,12 +173,24 @@ export function WalletNavBar({ path = "" }: { path?: string }): VNode {
           </a>
         </JustInDevMode>
 
-        <a
-          href={Pages.settings}
-          class={path.startsWith("/settings") ? "active" : ""}
+        <div
+          style={{ display: "flex", paddingTop: 4, justifyContent: "right" }}
         >
-          <i18n.Translate>Settings</i18n.Translate>
-        </a>
+          <a href={Pages.qr}>
+            <SvgIcon
+              title={i18n.str`QR Reader`}
+              dangerouslySetInnerHTML={{ __html: qrIcon }}
+              color="white"
+            />
+          </a>
+          <a href={Pages.settings}>
+            <SvgIcon
+              title={i18n.str`Settings`}
+              dangerouslySetInnerHTML={{ __html: settingsIcon }}
+              color="white"
+            />
+          </a>
+        </div>
       </NavigationHeader>
     </NavigationHeaderHolder>
   );
diff --git a/packages/taler-wallet-webextension/src/components/styled/index.tsx b/packages/taler-wallet-webextension/src/components/styled/index.tsx
index 2430be7c1..70f996743 100644
--- a/packages/taler-wallet-webextension/src/components/styled/index.tsx
+++ b/packages/taler-wallet-webextension/src/components/styled/index.tsx
@@ -820,7 +820,8 @@ export const NavigationHeader = styled.div`
     width: 500px;
   }
 
-  & > a {
+  & > a,
+  & > div {
     color: #f8faf7;
     display: inline-block;
     width: 100%;
@@ -837,18 +838,20 @@ export const NavigationHeader = styled.div`
   }
 `;
 
-export const SvgIcon = styled.div<{
+interface SvgIconProps {
   title: string;
   color: string;
   onClick?: any;
-}>`
+}
+export const SvgIcon = styled.div<SvgIconProps>`
   & > svg {
     fill: ${({ color }) => color};
   }
   width: 24px;
   height: 24px;
-  margin-left: auto;
+  margin-left: 8px;
   margin-right: 8px;
+  display: inline;
   padding: 4px;
   cursor: ${({ onClick }) => (onClick ? "pointer" : "inherit")};
 `;
@@ -857,7 +860,7 @@ export const Icon = styled.div`
   background-color: gray;
   width: 24px;
   height: 24px;
-  margin-left: auto;
+  margin-left: 8px;
   margin-right: 8px;
   padding: 4px;
 `;
diff --git a/packages/taler-wallet-webextension/src/mui/InputFile.tsx b/packages/taler-wallet-webextension/src/mui/InputFile.tsx
new file mode 100644
index 000000000..2b67dc99b
--- /dev/null
+++ b/packages/taler-wallet-webextension/src/mui/InputFile.tsx
@@ -0,0 +1,78 @@
+/*
+ This file is part of GNU Taler
+ (C) 2022 Taler Systems S.A.
+
+ GNU Taler is free software; you can redistribute it and/or modify it under the
+ terms of the GNU General Public License as published by the Free Software
+ Foundation; either version 3, or (at your option) any later version.
+
+ GNU Taler is distributed in the hope that it will be useful, but WITHOUT ANY
+ WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
+ A PARTICULAR PURPOSE.  See the GNU General Public License for more details.
+
+ You should have received a copy of the GNU General Public License along with
+ GNU Taler; see the file COPYING.  If not, see <http://www.gnu.org/licenses/>
+ */
+
+/**
+ *
+ * @author Sebastian Javier Marchano (sebasjm)
+ */
+import { ComponentChildren, h, VNode } from "preact";
+import { useRef, useState } from "preact/hooks";
+import { Button } from "./Button.js";
+// import { MAX_IMAGE_SIZE as MAX_IMAGE_UPLOAD_SIZE } from "../../utils/constants";
+// import { InputProps, useField } from "./useField";
+
+const MAX_IMAGE_UPLOAD_SIZE = 1024 * 1024;
+
+interface Props {
+  children: ComponentChildren;
+  onChange: (v: string) => void;
+}
+
+export function InputFile<T>({ onChange, children }: Props): VNode {
+  const image = useRef<HTMLInputElement>(null);
+
+  const [sizeError, setSizeError] = useState(false);
+
+  return (
+    <div>
+      <p>
+        <Button
+          variant="contained"
+          onClick={async () => image.current?.click()}
+        >
+          {children}
+        </Button>
+        <input
+          ref={image}
+          style={{ display: "none" }}
+          type="file"
+          name={String(name)}
+          onChange={(e) => {
+            const f: FileList | null = e.currentTarget.files;
+            if (!f || f.length != 1) {
+              return;
+            }
+            if (f[0].size > MAX_IMAGE_UPLOAD_SIZE) {
+              setSizeError(true);
+              return;
+            }
+            setSizeError(false);
+            return f[0].arrayBuffer().then((b) => {
+              const b64 = btoa(
+                new Uint8Array(b).reduce(
+                  (data, byte) => data + String.fromCharCode(byte),
+                  "",
+                ),
+              );
+              return onChange(`data:${f[0].type};base64,${b64}` as any);
+            });
+          }}
+        />
+      </p>
+      {sizeError && <p>Image should be smaller than 1 MB</p>}
+    </div>
+  );
+}
diff --git a/packages/taler-wallet-webextension/src/popup/Application.tsx b/packages/taler-wallet-webextension/src/popup/Application.tsx
index 521679237..be3c8a2f8 100644
--- a/packages/taler-wallet-webextension/src/popup/Application.tsx
+++ b/packages/taler-wallet-webextension/src/popup/Application.tsx
@@ -133,6 +133,7 @@ export function Application(): VNode {
                   path={Pages.backupProviderAdd}
                   component={RedirectToWalletPage}
                 />
+                <Route path={Pages.qr} component={RedirectToWalletPage} />
                 <Route path={Pages.settings} component={RedirectToWalletPage} />
                 <Route
                   path={Pages.settingsExchangeAdd.pattern}
diff --git a/packages/taler-wallet-webextension/src/svg/qr_code_24px.svg b/packages/taler-wallet-webextension/src/svg/qr_code_24px.svg
new file mode 100644
index 000000000..c0c158359
--- /dev/null
+++ b/packages/taler-wallet-webextension/src/svg/qr_code_24px.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24" viewBox="0 0 24 24" width="24"><g><rect fill="none" height="24" width="24"/></g><g><g><path d="M3,11h8V3H3V11z M5,5h4v4H5V5z"/><path d="M3,21h8v-8H3V21z M5,15h4v4H5V15z"/><path d="M13,3v8h8V3H13z M19,9h-4V5h4V9z"/><rect height="2" width="2" x="19" y="19"/><rect height="2" width="2" x="13" y="13"/><rect height="2" width="2" x="15" y="15"/><rect height="2" width="2" x="13" y="17"/><rect height="2" width="2" x="15" y="19"/><rect height="2" width="2" x="17" y="17"/><rect height="2" width="2" x="17" y="13"/><rect height="2" width="2" x="19" y="15"/></g></g></svg>
\ No newline at end of file
diff --git a/packages/taler-wallet-webextension/src/wallet/Application.tsx b/packages/taler-wallet-webextension/src/wallet/Application.tsx
index f6cef7e90..f559e54db 100644
--- a/packages/taler-wallet-webextension/src/wallet/Application.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/Application.tsx
@@ -51,6 +51,8 @@ import { ProviderDetailPage } from "./ProviderDetailPage.js";
 import { SettingsPage } from "./Settings.js";
 import { TransactionPage } from "./Transaction.js";
 import { WelcomePage } from "./Welcome.js";
+import { QrReaderPage } from "./QrReader.js";
+import { platform } from "../platform/api.js";
 
 export function Application(): VNode {
   const [globalNotification, setGlobalNotification] = useState<
@@ -162,6 +164,14 @@ export function Application(): VNode {
               {/**
                * PENDING
                */}
+              <Route
+                path={Pages.qr}
+                component={QrReaderPage}
+                onDetected={(talerActionUrl: string) => {
+                  platform.openWalletURIFromPopup(talerActionUrl);
+                }}
+              />
+
               <Route path={Pages.settings} component={SettingsPage} />
 
               {/**
diff --git a/packages/taler-wallet-webextension/src/wallet/QrReader.stories.tsx b/packages/taler-wallet-webextension/src/wallet/QrReader.stories.tsx
new file mode 100644
index 000000000..ba5a78570
--- /dev/null
+++ b/packages/taler-wallet-webextension/src/wallet/QrReader.stories.tsx
@@ -0,0 +1,29 @@
+/*
+ This file is part of GNU Taler
+ (C) 2022 Taler Systems S.A.
+
+ GNU Taler is free software; you can redistribute it and/or modify it under the
+ terms of the GNU General Public License as published by the Free Software
+ Foundation; either version 3, or (at your option) any later version.
+
+ GNU Taler is distributed in the hope that it will be useful, but WITHOUT ANY
+ WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
+ A PARTICULAR PURPOSE.  See the GNU General Public License for more details.
+
+ You should have received a copy of the GNU General Public License along with
+ GNU Taler; see the file COPYING.  If not, see <http://www.gnu.org/licenses/>
+ */
+
+/**
+ *
+ * @author Sebastian Javier Marchano (sebasjm)
+ */
+
+import { createExample } from "../test-utils.js";
+import { QrReaderPage } from "./QrReader.js";
+
+export default {
+  title: "wallet/qr",
+};
+
+export const Reading = createExample(QrReaderPage, {});
diff --git a/packages/taler-wallet-webextension/src/wallet/QrReader.tsx b/packages/taler-wallet-webextension/src/wallet/QrReader.tsx
new file mode 100644
index 000000000..9c9ab7ce4
--- /dev/null
+++ b/packages/taler-wallet-webextension/src/wallet/QrReader.tsx
@@ -0,0 +1,146 @@
+/*
+ This file is part of GNU Taler
+ (C) 2022 Taler Systems S.A.
+
+ GNU Taler is free software; you can redistribute it and/or modify it under the
+ terms of the GNU General Public License as published by the Free Software
+ Foundation; either version 3, or (at your option) any later version.
+
+ GNU Taler is distributed in the hope that it will be useful, but WITHOUT ANY
+ WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
+ A PARTICULAR PURPOSE.  See the GNU General Public License for more details.
+
+ You should have received a copy of the GNU General Public License along with
+ GNU Taler; see the file COPYING.  If not, see <http://www.gnu.org/licenses/>
+ */
+
+import { classifyTalerUri, TalerUriType } from "@gnu-taler/taler-util";
+import { styled } from "@linaria/react";
+import { Fragment, h, VNode } from "preact";
+import { Ref, useEffect, useRef, useState } from "preact/hooks";
+import QrScanner from "qr-scanner";
+import { Alert } from "../mui/Alert.js";
+import { Button } from "../mui/Button.js";
+import { TextField } from "../mui/TextField.js";
+
+const QrVideo = styled.video`
+  width: 80%;
+  margin-left: auto;
+  margin-right: auto;
+  padding: 8px;
+  background-color: black;
+`;
+
+const Container = styled.div`
+  display: flex;
+  flex-direction: column;
+  & > * {
+    margin-bottom: 20px;
+  }
+`;
+
+interface Props {
+  onDetected: (url: string) => void;
+}
+
+export function QrReaderPage({ onDetected }: Props): VNode {
+  const videoRef = useRef<HTMLVideoElement>(null);
+  // const imageRef = useRef<HTMLImageElement>(null);
+  const qrScanner = useRef<QrScanner | null>(null);
+  const [value, onChange] = useState("");
+  const [active, setActive] = useState(false);
+
+  function start(): void {
+    qrScanner.current!.start();
+    onChange("");
+    setActive(true);
+  }
+  function stop(): void {
+    qrScanner.current!.stop();
+    setActive(false);
+  }
+
+  function check(v: string) {
+    return (
+      v.startsWith("taler://") && classifyTalerUri(v) !== TalerUriType.Unknown
+    );
+  }
+
+  useEffect(() => {
+    if (!videoRef.current) {
+      console.log("vide was not ready");
+      return;
+    }
+    const elem = videoRef.current;
+    setTimeout(() => {
+      qrScanner.current = new QrScanner(
+        elem,
+        ({ data, cornerPoints }) => {
+          if (check(data)) {
+            onDetected(data);
+            return;
+          }
+          onChange(data);
+          stop();
+        },
+        {
+          maxScansPerSecond: 5, //default 25
+          highlightScanRegion: true,
+        },
+      );
+      start();
+    }, 1);
+    return () => {
+      qrScanner.current?.destroy();
+    };
+  }, []);
+
+  const isValid = check(value);
+
+  return (
+    <Container>
+      {/* <InputFile onChange={(f) => scanImage(imageRef, f)}>
+        Read QR from file
+      </InputFile>
+      <div ref={imageRef} /> */}
+      <QrVideo ref={videoRef} />
+      <TextField
+        label="Taler URI"
+        variant="standard"
+        fullWidth
+        value={value}
+        onChange={onChange}
+      />
+      {isValid && (
+        <Button variant="contained" onClick={async () => onDetected(value)}>
+          Open
+        </Button>
+      )}
+      {!active && !isValid && (
+        <Fragment>
+          <Alert severity="error">
+            URI is not valid. Taler URI should start with `taler://`
+          </Alert>
+          <Button variant="contained" onClick={async () => start()}>
+            Try another
+          </Button>
+        </Fragment>
+      )}
+    </Container>
+  );
+}
+
+async function scanImage(
+  imageRef: Ref<HTMLImageElement>,
+  image: string,
+): Promise<void> {
+  const imageEl = new Image();
+  imageEl.src = image;
+  imageEl.width = 200;
+  imageRef.current!.appendChild(imageEl);
+  QrScanner.scanImage(image, {
+    alsoTryWithoutScanRegion: true,
+  })
+    .then((result) => console.log(result))
+    .catch((error) => console.log(error || "No QR code found."));
+}
diff --git a/packages/taler-wallet-webextension/src/wallet/index.stories.tsx b/packages/taler-wallet-webextension/src/wallet/index.stories.tsx
index 4754721de..fc09ea541 100644
--- a/packages/taler-wallet-webextension/src/wallet/index.stories.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/index.stories.tsx
@@ -34,6 +34,7 @@ import * as a13 from "./Transaction.stories.js";
 import * as a14 from "./Welcome.stories.js";
 import * as a15 from "./AddNewActionView.stories.js";
 import * as a16 from "./DeveloperPage.stories.js";
+import * as a17 from "./QrReader.stories.js";
 
 export default [
   a1,
@@ -51,4 +52,5 @@ export default [
   a14,
   a15,
   a16,
+  a17,
 ];
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 43bedddd2..f2cc55f27 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -1,4 +1,4 @@
-lockfileVersion: 5.4
+lockfileVersion: 5.3
 
 importers:
 
@@ -357,6 +357,7 @@ importers:
       preact-cli: ^3.3.5
       preact-render-to-string: ^5.1.19
       preact-router: 3.2.1
+      qr-scanner: ^1.4.1
       qrcode-generator: ^1.4.4
       rimraf: ^3.0.2
       tslib: ^2.3.1
@@ -369,6 +370,7 @@ importers:
       history: 4.10.1
       preact: 10.6.5
       preact-router: 3.2.1_preact@10.6.5
+      qr-scanner: 1.4.1
       qrcode-generator: 1.4.4
       tslib: 2.3.1
       ws: 7.4.5
@@ -384,7 +386,7 @@ importers:
       '@linaria/react': 3.0.0-beta.4
       '@linaria/webpack-loader': 3.0.0-beta.4_@babel+core@7.13.16
       '@testing-library/preact': 2.0.1_preact@10.6.5
-      '@testing-library/preact-hooks': 1.1.0_vfcmu6iy7nffpurikpgxo6gwxi
+      '@testing-library/preact-hooks': 1.1.0_a944ca7918fb4a57d22853cd7778d6ba
       '@types/chai': 4.3.0
       '@types/chrome': 0.0.176
       '@types/history': 4.7.9
@@ -397,7 +399,7 @@ importers:
       mocha: 9.2.0
       nyc: 15.1.0
       polished: 4.1.4
-      preact-cli: 3.3.5_mvcuzfcaha7xgb2vtvvy6e3v4a
+      preact-cli: 3.3.5_65454c9440383f7307559d6b8f1375e0
       preact-render-to-string: 5.1.19_preact@10.6.5
       rimraf: 3.0.2
       typescript: 4.5.5
@@ -701,7 +703,7 @@ packages:
       '@babel/core': 7.17.2
       '@babel/helper-compilation-targets': 7.16.7_@babel+core@7.17.2
       '@babel/helper-module-imports': 7.16.7
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
       '@babel/traverse': 7.17.0
       debug: 4.3.3
       lodash.debounce: 4.0.8
@@ -1034,7 +1036,7 @@ packages:
       '@babel/core': ^7.0.0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining/7.16.7_@babel+core@7.13.16:
@@ -1056,7 +1058,7 @@ packages:
       '@babel/core': ^7.13.0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
       '@babel/helper-skip-transparent-expression-wrappers': 7.16.0
       '@babel/plugin-proposal-optional-chaining': 7.16.7_@babel+core@7.17.2
     dev: true
@@ -1082,7 +1084,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
       '@babel/helper-remap-async-to-generator': 7.16.8
       '@babel/plugin-syntax-async-generators': 7.8.4_@babel+core@7.17.2
     transitivePeerDependencies:
@@ -1137,7 +1139,7 @@ packages:
     dependencies:
       '@babel/core': 7.17.2
       '@babel/helper-create-class-features-plugin': 7.17.1_@babel+core@7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
       '@babel/plugin-syntax-class-static-block': 7.14.5_@babel+core@7.17.2
     transitivePeerDependencies:
       - supports-color
@@ -1177,7 +1179,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
       '@babel/plugin-syntax-dynamic-import': 7.8.3_@babel+core@7.17.2
     dev: true
 
@@ -1199,7 +1201,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
       '@babel/plugin-syntax-export-namespace-from': 7.8.3_@babel+core@7.17.2
     dev: true
 
@@ -1221,7 +1223,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
       '@babel/plugin-syntax-json-strings': 7.8.3_@babel+core@7.17.2
     dev: true
 
@@ -1243,7 +1245,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
       '@babel/plugin-syntax-logical-assignment-operators': 7.10.4_@babel+core@7.17.2
     dev: true
 
@@ -1265,7 +1267,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
       '@babel/plugin-syntax-nullish-coalescing-operator': 7.8.3_@babel+core@7.17.2
     dev: true
 
@@ -1287,7 +1289,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
       '@babel/plugin-syntax-numeric-separator': 7.10.4_@babel+core@7.17.2
     dev: true
 
@@ -1337,7 +1339,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
       '@babel/plugin-syntax-optional-catch-binding': 7.8.3_@babel+core@7.17.2
     dev: true
 
@@ -1360,7 +1362,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
       '@babel/helper-skip-transparent-expression-wrappers': 7.16.0
       '@babel/plugin-syntax-optional-chaining': 7.8.3_@babel+core@7.17.2
     dev: true
@@ -1386,7 +1388,7 @@ packages:
     dependencies:
       '@babel/core': 7.17.2
       '@babel/helper-create-class-features-plugin': 7.17.1_@babel+core@7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     transitivePeerDependencies:
       - supports-color
     dev: true
@@ -1415,7 +1417,7 @@ packages:
       '@babel/core': 7.17.2
       '@babel/helper-annotate-as-pure': 7.16.7
       '@babel/helper-create-class-features-plugin': 7.17.1_@babel+core@7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
       '@babel/plugin-syntax-private-property-in-object': 7.14.5_@babel+core@7.17.2
     transitivePeerDependencies:
       - supports-color
@@ -1440,7 +1442,7 @@ packages:
     dependencies:
       '@babel/core': 7.17.2
       '@babel/helper-create-regexp-features-plugin': 7.17.0_@babel+core@7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-syntax-async-generators/7.8.4_@babel+core@7.13.16:
@@ -1458,7 +1460,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-syntax-class-properties/7.12.13_@babel+core@7.13.16:
@@ -1476,7 +1478,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-syntax-class-static-block/7.14.5_@babel+core@7.13.16:
@@ -1496,7 +1498,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-syntax-decorators/7.17.0_@babel+core@7.17.2:
@@ -1542,7 +1544,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-syntax-json-strings/7.8.3_@babel+core@7.13.16:
@@ -1560,7 +1562,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-syntax-jsx/7.16.7_@babel+core@7.17.2:
@@ -1588,7 +1590,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-syntax-nullish-coalescing-operator/7.8.3_@babel+core@7.13.16:
@@ -1606,7 +1608,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-syntax-numeric-separator/7.10.4_@babel+core@7.13.16:
@@ -1624,7 +1626,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-syntax-object-rest-spread/7.8.3_@babel+core@7.13.16:
@@ -1642,7 +1644,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-syntax-optional-catch-binding/7.8.3_@babel+core@7.13.16:
@@ -1660,7 +1662,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-syntax-optional-chaining/7.8.3_@babel+core@7.13.16:
@@ -1678,7 +1680,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-syntax-private-property-in-object/7.14.5_@babel+core@7.13.16:
@@ -1698,7 +1700,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-syntax-top-level-await/7.14.5_@babel+core@7.13.16:
@@ -1718,7 +1720,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-syntax-typescript/7.14.5_@babel+core@7.13.16:
@@ -1758,7 +1760,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-transform-async-to-generator/7.16.8_@babel+core@7.13.16:
@@ -1783,7 +1785,7 @@ packages:
     dependencies:
       '@babel/core': 7.17.2
       '@babel/helper-module-imports': 7.16.7
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
       '@babel/helper-remap-async-to-generator': 7.16.8
     transitivePeerDependencies:
       - supports-color
@@ -1806,7 +1808,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-transform-block-scoping/7.16.7_@babel+core@7.13.16:
@@ -1826,7 +1828,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-transform-classes/7.16.7_@babel+core@7.13.16:
@@ -1859,7 +1861,7 @@ packages:
       '@babel/helper-environment-visitor': 7.16.7
       '@babel/helper-function-name': 7.16.7
       '@babel/helper-optimise-call-expression': 7.16.7
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
       '@babel/helper-replace-supers': 7.16.7
       '@babel/helper-split-export-declaration': 7.16.7
       globals: 11.12.0
@@ -1884,7 +1886,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-transform-destructuring/7.16.7_@babel+core@7.13.16:
@@ -1904,7 +1906,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-transform-dotall-regex/7.16.7_@babel+core@7.13.16:
@@ -1926,7 +1928,7 @@ packages:
     dependencies:
       '@babel/core': 7.17.2
       '@babel/helper-create-regexp-features-plugin': 7.17.0_@babel+core@7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-transform-duplicate-keys/7.16.7_@babel+core@7.13.16:
@@ -1946,7 +1948,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-transform-exponentiation-operator/7.16.7_@babel+core@7.13.16:
@@ -1968,7 +1970,7 @@ packages:
     dependencies:
       '@babel/core': 7.17.2
       '@babel/helper-builder-binary-assignment-operator-visitor': 7.16.7
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-transform-for-of/7.16.7_@babel+core@7.13.16:
@@ -1988,7 +1990,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-transform-function-name/7.16.7_@babel+core@7.13.16:
@@ -2012,7 +2014,7 @@ packages:
       '@babel/core': 7.17.2
       '@babel/helper-compilation-targets': 7.16.7_@babel+core@7.17.2
       '@babel/helper-function-name': 7.16.7
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-transform-literals/7.16.7_@babel+core@7.13.16:
@@ -2032,7 +2034,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-transform-member-expression-literals/7.16.7_@babel+core@7.13.16:
@@ -2052,7 +2054,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-transform-modules-amd/7.16.7_@babel+core@7.13.16:
@@ -2076,8 +2078,8 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-module-transforms': 7.18.0
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-module-transforms': 7.16.7
+      '@babel/helper-plugin-utils': 7.16.7
       babel-plugin-dynamic-import-node: 2.3.3
     transitivePeerDependencies:
       - supports-color
@@ -2098,28 +2100,28 @@ packages:
       - supports-color
     dev: true
 
-  /@babel/plugin-transform-modules-commonjs/7.18.2_@babel+core@7.13.16:
-    resolution: {integrity: sha512-f5A865gFPAJAEE0K7F/+nm5CmAE3y8AWlMBG9unu5j9+tk50UQVK0QS8RNxSp7MJf0wh97uYyLWt3Zvu71zyOQ==}
+  /@babel/plugin-transform-modules-commonjs/7.16.8_@babel+core@7.17.2:
+    resolution: {integrity: sha512-oflKPvsLT2+uKQopesJt3ApiaIS2HW+hzHFcwRNtyDGieAeC/dIHZX8buJQ2J2X1rxGPy4eRcUijm3qcSPjYcA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
     dependencies:
-      '@babel/core': 7.13.16
-      '@babel/helper-module-transforms': 7.18.0
-      '@babel/helper-plugin-utils': 7.17.12
-      '@babel/helper-simple-access': 7.18.2
+      '@babel/core': 7.17.2
+      '@babel/helper-module-transforms': 7.16.7
+      '@babel/helper-plugin-utils': 7.16.7
+      '@babel/helper-simple-access': 7.16.7
       babel-plugin-dynamic-import-node: 2.3.3
     transitivePeerDependencies:
       - supports-color
     dev: true
 
-  /@babel/plugin-transform-modules-commonjs/7.18.2_@babel+core@7.17.2:
+  /@babel/plugin-transform-modules-commonjs/7.18.2_@babel+core@7.13.16:
     resolution: {integrity: sha512-f5A865gFPAJAEE0K7F/+nm5CmAE3y8AWlMBG9unu5j9+tk50UQVK0QS8RNxSp7MJf0wh97uYyLWt3Zvu71zyOQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
     dependencies:
-      '@babel/core': 7.17.2
+      '@babel/core': 7.13.16
       '@babel/helper-module-transforms': 7.18.0
       '@babel/helper-plugin-utils': 7.17.12
       '@babel/helper-simple-access': 7.18.2
@@ -2152,8 +2154,8 @@ packages:
     dependencies:
       '@babel/core': 7.17.2
       '@babel/helper-hoist-variables': 7.16.7
-      '@babel/helper-module-transforms': 7.18.0
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-module-transforms': 7.16.7
+      '@babel/helper-plugin-utils': 7.16.7
       '@babel/helper-validator-identifier': 7.16.7
       babel-plugin-dynamic-import-node: 2.3.3
     transitivePeerDependencies:
@@ -2180,8 +2182,8 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-module-transforms': 7.18.0
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-module-transforms': 7.16.7
+      '@babel/helper-plugin-utils': 7.16.7
     transitivePeerDependencies:
       - supports-color
     dev: true
@@ -2223,7 +2225,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-transform-object-assign/7.16.7_@babel+core@7.17.2:
@@ -2256,7 +2258,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
       '@babel/helper-replace-supers': 7.16.7
     transitivePeerDependencies:
       - supports-color
@@ -2279,7 +2281,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-transform-property-literals/7.16.7_@babel+core@7.13.16:
@@ -2299,7 +2301,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-transform-react-jsx-source/7.14.5_@babel+core@7.13.16:
@@ -2363,7 +2365,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-transform-runtime/7.17.0_@babel+core@7.13.16:
@@ -2400,7 +2402,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-transform-spread/7.16.7_@babel+core@7.13.16:
@@ -2421,7 +2423,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
       '@babel/helper-skip-transparent-expression-wrappers': 7.16.0
     dev: true
 
@@ -2442,7 +2444,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-transform-template-literals/7.16.7_@babel+core@7.13.16:
@@ -2462,7 +2464,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-transform-typeof-symbol/7.16.7_@babel+core@7.13.16:
@@ -2482,7 +2484,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-transform-typescript/7.15.0_@babel+core@7.13.16:
@@ -2530,7 +2532,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/plugin-transform-unicode-regex/7.16.7_@babel+core@7.13.16:
@@ -2552,7 +2554,7 @@ packages:
     dependencies:
       '@babel/core': 7.17.2
       '@babel/helper-create-regexp-features-plugin': 7.17.0_@babel+core@7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.16.7
     dev: true
 
   /@babel/preset-env/7.16.11_@babel+core@7.13.16:
@@ -2697,7 +2699,7 @@ packages:
       '@babel/plugin-transform-literals': 7.16.7_@babel+core@7.17.2
       '@babel/plugin-transform-member-expression-literals': 7.16.7_@babel+core@7.17.2
       '@babel/plugin-transform-modules-amd': 7.16.7_@babel+core@7.17.2
-      '@babel/plugin-transform-modules-commonjs': 7.18.2_@babel+core@7.17.2
+      '@babel/plugin-transform-modules-commonjs': 7.16.8_@babel+core@7.17.2
       '@babel/plugin-transform-modules-systemjs': 7.16.7_@babel+core@7.17.2
       '@babel/plugin-transform-modules-umd': 7.16.7_@babel+core@7.17.2
       '@babel/plugin-transform-named-capturing-groups-regex': 7.16.8_@babel+core@7.17.2
@@ -2744,7 +2746,7 @@ packages:
       '@babel/core': ^7.0.0-0
     dependencies:
       '@babel/core': 7.17.2
-      '@babel/helper-plugin-utils': 7.17.12
+      '@babel/helper-plugin-utils': 7.14.5
       '@babel/plugin-proposal-unicode-property-regex': 7.16.7_@babel+core@7.17.2
       '@babel/plugin-transform-dotall-regex': 7.16.7_@babel+core@7.17.2
       '@babel/types': 7.17.0
@@ -3297,7 +3299,7 @@ packages:
     resolution: {integrity: sha512-MUhT5m2XNN5NsZl4GnpuvlzLo6VSTa/+wBfBd3fiWUvHGhv0GF9hnA1pd//v0uJaKwUnVRQ1hYElxCV7DtYsCQ==}
     dev: true
 
-  /@prefresh/webpack/3.3.2_dveknyjmyxkzkf4ybureeu5fae:
+  /@prefresh/webpack/3.3.2_1d48a6e12cc5d59517980d224253a501:
     resolution: {integrity: sha512-1cX0t5G7IXWO2164sl2O32G02BzDl6C4UUZWfDb0x1CQM1g3It9PSLWd+rIlHfSg4MEU9YHM8e6/OK8uavRJhA==}
     peerDependencies:
       '@prefresh/babel-plugin': ^0.4.0
@@ -3311,7 +3313,7 @@ packages:
       webpack: 4.46.0
     dev: true
 
-  /@rollup/plugin-babel/5.3.0_eo4ysck2y4fwt6qmry2tzgdkqi:
+  /@rollup/plugin-babel/5.3.0_@babel+core@7.17.2+rollup@2.67.2:
     resolution: {integrity: sha512-9uIC8HZOnVLrLHxayq/PTzw+uS25E14KPUBh5ktF+18Mjo5yK0ToMMx6epY0uEgkjwJw0aBW4x2horYXh8juWw==}
     engines: {node: '>= 10.0.0'}
     peerDependencies:
@@ -3450,7 +3452,7 @@ packages:
       pretty-format: 26.6.2
     dev: true
 
-  /@testing-library/preact-hooks/1.1.0_vfcmu6iy7nffpurikpgxo6gwxi:
+  /@testing-library/preact-hooks/1.1.0_a944ca7918fb4a57d22853cd7778d6ba:
     resolution: {integrity: sha512-+JIor+NsOHkK3oIrwMDGKGHXTN0JJi462dBJlj4FNbGaDPTlctE6eu2ranWQirh7/FJMkWfzQCP+tk7jmY8ZrQ==}
     peerDependencies:
       '@testing-library/preact': ^2.0.0
@@ -3613,6 +3615,10 @@ packages:
     resolution: {integrity: sha512-YofkM6fGv4gDJq78g4j0mMuGMkZVxZDgtU0JRdx6FgiJDG+0fY0GKVolOV8WqVmEhLCXkQRjwDdKyPxJp/uucg==}
     dev: true
 
+  /@types/offscreencanvas/2019.7.0:
+    resolution: {integrity: sha512-PGcyveRIpL1XIqK8eBsmRBt76eFgtzuPiSTyKHZxnGemp2yzGzWpjYKAfK3wIMiU7eH+851yEpiuP8JZerTmWg==}
+    dev: false
+
   /@types/parse-json/4.0.0:
     resolution: {integrity: sha512-//oorEZjL6sbPcKUaCdIGlIUeH26mgzimjBB77G6XRgnDl/L5wOnpyBGRe/Mmf5CVW3PwEBE1NjiMZ/ssFh4wA==}
     dev: true
@@ -4565,33 +4571,33 @@ packages:
       esutils: 2.0.3
     dev: true
 
-  /babel-loader/8.2.3_@babel+core@7.13.16:
+  /babel-loader/8.2.3_60b7ed408fec1293d95f86d9ceaa88ca:
     resolution: {integrity: sha512-n4Zeta8NC3QAsuyiizu0GkmRcQ6clkV9WFUnUf1iXP//IeSKbWjofW3UHyZVwlOB4y039YQKefawyTn64Zwbuw==}
     engines: {node: '>= 8.9'}
     peerDependencies:
       '@babel/core': ^7.0.0
       webpack: '>=2'
     dependencies:
-      '@babel/core': 7.13.16
+      '@babel/core': 7.17.2
       find-cache-dir: 3.3.2
       loader-utils: 1.4.0
       make-dir: 3.1.0
       schema-utils: 2.7.1
+      webpack: 4.46.0
     dev: true
 
-  /babel-loader/8.2.3_mc362qep5qjjhwk7q3m45kuizi:
+  /babel-loader/8.2.3_@babel+core@7.13.16:
     resolution: {integrity: sha512-n4Zeta8NC3QAsuyiizu0GkmRcQ6clkV9WFUnUf1iXP//IeSKbWjofW3UHyZVwlOB4y039YQKefawyTn64Zwbuw==}
     engines: {node: '>= 8.9'}
     peerDependencies:
       '@babel/core': ^7.0.0
       webpack: '>=2'
     dependencies:
-      '@babel/core': 7.17.2
+      '@babel/core': 7.13.16
       find-cache-dir: 3.3.2
       loader-utils: 1.4.0
       make-dir: 3.1.0
       schema-utils: 2.7.1
-      webpack: 4.46.0
     dev: true
 
   /babel-plugin-dynamic-import-node/2.3.3:
@@ -7613,7 +7619,7 @@ packages:
     resolution: {integrity: sha1-+8cfDEGt6zf5bFd60e1C2P2sypE=}
     dev: true
 
-  /fork-ts-checker-webpack-plugin/4.1.6_e7hrjdrs22zc4syxbltzlwluhe:
+  /fork-ts-checker-webpack-plugin/4.1.6_typescript@4.2.4+webpack@4.46.0:
     resolution: {integrity: sha512-DUxuQaKoqfNne8iikd14SAkh5uw4+8vNifp6gmA73yYNS6ywLIWSLD/n/mBzHQRpW3J7rbATEakmiA8JvkTyZw==}
     engines: {node: '>=6.11.5', yarn: '>=1.0.0'}
     peerDependencies:
@@ -10697,7 +10703,7 @@ packages:
       yaml: 1.10.2
     dev: true
 
-  /postcss-loader/4.3.0_sa6x6oa3aqtj2o2n4wqcmgxr4e:
+  /postcss-loader/4.3.0_postcss@8.4.6+webpack@4.46.0:
     resolution: {integrity: sha512-M/dSoIiNDOo8Rk0mUqoj4kpGq91gcxCfb9PoyZVdZ76/AuhxylHDYZblNE8o+EQ9AMSASeMFEKxZf5aU6wlx1Q==}
     engines: {node: '>= 10.13.0'}
     peerDependencies:
@@ -11198,7 +11204,7 @@ packages:
       source-map-js: 1.0.2
     dev: true
 
-  /preact-cli/3.3.5_mvcuzfcaha7xgb2vtvvy6e3v4a:
+  /preact-cli/3.3.5_65454c9440383f7307559d6b8f1375e0:
     resolution: {integrity: sha512-qtIk8WtheEoY192UoKFQD14cw5CoUnYs9A+gIL95H/WT4aw8Z4CvxsB6+eELMZnsruakkq7OQMd0xRrfyoZNgA==}
     engines: {node: '>=12'}
     hasBin: true
@@ -11227,11 +11233,11 @@ packages:
       '@babel/preset-typescript': 7.16.7_@babel+core@7.17.2
       '@preact/async-loader': 3.0.1_preact@10.6.5
       '@prefresh/babel-plugin': 0.4.1
-      '@prefresh/webpack': 3.3.2_dveknyjmyxkzkf4ybureeu5fae
+      '@prefresh/webpack': 3.3.2_1d48a6e12cc5d59517980d224253a501
       '@types/webpack': 4.41.32
       autoprefixer: 10.4.2_postcss@8.4.6
       babel-esm-plugin: 0.9.0_webpack@4.46.0
-      babel-loader: 8.2.3_mc362qep5qjjhwk7q3m45kuizi
+      babel-loader: 8.2.3_60b7ed408fec1293d95f86d9ceaa88ca
       babel-plugin-macros: 3.1.0
       babel-plugin-transform-react-remove-prop-types: 0.4.24
       browserslist: 4.19.1
@@ -11245,7 +11251,7 @@ packages:
       envinfo: 7.8.1
       esm: 3.2.25
       file-loader: 6.2.0_webpack@4.46.0
-      fork-ts-checker-webpack-plugin: 4.1.6_e7hrjdrs22zc4syxbltzlwluhe
+      fork-ts-checker-webpack-plugin: 4.1.6_typescript@4.2.4+webpack@4.46.0
       get-port: 5.1.1
       gittar: 0.1.1
       glob: 7.2.0
@@ -11263,7 +11269,7 @@ packages:
       pnp-webpack-plugin: 1.7.0_typescript@4.2.4
       postcss: 8.4.6
       postcss-load-config: 3.1.2
-      postcss-loader: 4.3.0_sa6x6oa3aqtj2o2n4wqcmgxr4e
+      postcss-loader: 4.3.0_postcss@8.4.6+webpack@4.46.0
       preact: 10.6.5
       preact-render-to-string: 5.1.19_preact@10.6.5
       progress-bar-webpack-plugin: 2.1.0_webpack@4.46.0
@@ -11280,7 +11286,7 @@ packages:
       terser-webpack-plugin: 4.2.3_webpack@4.46.0
       typescript: 4.2.4
       update-notifier: 5.1.0
-      url-loader: 4.1.1_lit45vopotvaqup7lrvlnvtxwy
+      url-loader: 4.1.1_file-loader@6.2.0+webpack@4.46.0
       validate-npm-package-name: 3.0.0
       webpack: 4.46.0
       webpack-bundle-analyzer: 4.5.0
@@ -11527,6 +11533,12 @@ packages:
     engines: {node: '>=0.6.0', teleport: '>=0.2.0'}
     dev: true
 
+  /qr-scanner/1.4.1:
+    resolution: {integrity: sha512-xiR90NONHTfTwaFgW/ihlqjGMIZg6ExHDOvGQRba1TvV+WVw7GoDArIOt21e+RO+9WiO4AJJq+mwc5f4BnGH3w==}
+    dependencies:
+      '@types/offscreencanvas': 2019.7.0
+    dev: false
+
   /qrcode-generator/1.4.4:
     resolution: {integrity: sha512-HM7yY8O2ilqhmULxGMpcHSF1EhJJ9yBj8gvDEuZ6M+KGJ0YY2hKpnXvRD+hZPLrDVck3ExIGhmPtSdcjC+guuw==}
     dev: false
@@ -13382,7 +13394,7 @@ packages:
     deprecated: Please see https://github.com/lydell/urix#deprecated
     dev: true
 
-  /url-loader/4.1.1_lit45vopotvaqup7lrvlnvtxwy:
+  /url-loader/4.1.1_file-loader@6.2.0+webpack@4.46.0:
     resolution: {integrity: sha512-3BTV812+AVHHOJQO8O5MkWgZ5aosP7GnROJwvzLS9hWDj00lZ6Z0wNak423Lp9PBZN05N+Jk/N5Si8jRAlGyWA==}
     engines: {node: '>= 10.13.0'}
     peerDependencies:
@@ -13848,7 +13860,7 @@ packages:
       '@babel/core': 7.17.2
       '@babel/preset-env': 7.16.11_@babel+core@7.17.2
       '@babel/runtime': 7.17.2
-      '@rollup/plugin-babel': 5.3.0_eo4ysck2y4fwt6qmry2tzgdkqi
+      '@rollup/plugin-babel': 5.3.0_@babel+core@7.17.2+rollup@2.67.2
       '@rollup/plugin-node-resolve': 11.2.1_rollup@2.67.2
       '@rollup/plugin-replace': 2.4.2_rollup@2.67.2
       '@surma/rollup-plugin-off-main-thread': 2.2.3