Add drawing canva for playground

3 years ago · 323d146926
parent d1ea797292
commit 323d146926
18 changed files with 7884 additions and 30 deletions
--- a/.vs/iut-expo-starter/FileContentIndex/26bb8f95-1889-4e51-8030-dd44af0da4f7.vsidx
+++ b/.vs/iut-expo-starter/FileContentIndex/26bb8f95-1889-4e51-8030-dd44af0da4f7.vsidx
--- a/.vs/iut-expo-starter/FileContentIndex/57eaa9c3-72cb-4bc5-a6d7-8a7f3513fafc.vsidx
+++ b/.vs/iut-expo-starter/FileContentIndex/57eaa9c3-72cb-4bc5-a6d7-8a7f3513fafc.vsidx
--- a/.vs/iut-expo-starter/FileContentIndex/5cdbe43f-5b13-4cf7-b1e5-aeb3a934826b.vsidx
+++ b/.vs/iut-expo-starter/FileContentIndex/5cdbe43f-5b13-4cf7-b1e5-aeb3a934826b.vsidx
--- a/.vs/iut-expo-starter/FileContentIndex/96ad2cb2-fbcb-4d26-a619-e41bd8b27c2f.vsidx
+++ b/.vs/iut-expo-starter/FileContentIndex/96ad2cb2-fbcb-4d26-a619-e41bd8b27c2f.vsidx
--- a/.vs/iut-expo-starter/FileContentIndex/ab9ac88f-0ede-4229-9198-026149e48485.vsidx
+++ b/.vs/iut-expo-starter/FileContentIndex/ab9ac88f-0ede-4229-9198-026149e48485.vsidx
--- a/.vs/iut-expo-starter/FileContentIndex/c1e56655-c906-4d50-85cf-87c5dac77327.vsidx
+++ b/.vs/iut-expo-starter/FileContentIndex/c1e56655-c906-4d50-85cf-87c5dac77327.vsidx
--- a/.vs/iut-expo-starter/FileContentIndex/c52f95f9-f04c-4016-b700-f38c1fc9073c.vsidx
+++ b/.vs/iut-expo-starter/FileContentIndex/c52f95f9-f04c-4016-b700-f38c1fc9073c.vsidx
--- a/.vs/iut-expo-starter/FileContentIndex/e764a80d-e03a-436c-82d3-f160e33e6c50.vsidx
+++ b/.vs/iut-expo-starter/FileContentIndex/e764a80d-e03a-436c-82d3-f160e33e6c50.vsidx
--- a/.vs/iut-expo-starter/v17/.wsuo
+++ b/.vs/iut-expo-starter/v17/.wsuo
--- a/.vs/slnx.sqlite
+++ b/.vs/slnx.sqlite
--- a/components/DrawingCanva.tsx
+++ b/components/DrawingCanva.tsx
@ -0,0 +1,61 @@
+import React, { useRef }  from 'react';
+import { SketchCanvas, SketchCanvasRef } from 'rn-perfect-sketch-canvas';
+import { StyleSheet, Button, View } from 'react-native';
+import { SvgUri } from 'react-native-svg';
+
+
+type DrawingCanvaProps = {
+    backgroundImage: string;
+}
+
+const DrawingCanva = (props: DrawingCanvaProps) => {
+
+    const canvasRef = useRef<SketchCanvasRef>(null);
+
+
+
+    return (
+        <View style={styles.container}>
+            <SvgUri width="250"
+                uri={props.backgroundImage}
+                style={styles.back}
+                opacity={0.1}
+                />
+        <SketchCanvas
+                ref={canvasRef}
+                strokeColor={'black'}
+                strokeWidth={4}
+                containerStyle={styles.canvas}
+            />
+
+            <View style={styles.menu}>
+                <Button color="#FF5C5C" onPress={canvasRef.current?.reset} title="Reset" />
+                <Button color="#FF5C5C" onPress={canvasRef.current?.undo} title="Undo" />
+            </View>
+        </View>
+    );
+};
+
+const styles = StyleSheet.create({
+    container: {
+        flex: 1,
+        height: "100%",
+        width: "100%",
+        alignItems: "center"
+    },
+    back: {
+        position: "absolute"
+    },
+    canvas: {
+        height: 250,
+        width: 250,
+        borderWidth: 2,
+        borderColor: "black"
+    },
+    menu: {
+        flexDirection: "row",
+        justifyContent: "space-evenly",
+    }
+});
+
+export default DrawingCanva;
--- a/components/Icon.tsx
+++ b/components/Icon.tsx
@ -1,16 +0,0 @@
-import React from 'react';
-import { Svg } from 'react-native-svg';
-
-type IconProps = {
-    path: string;
-    size: number;
-}
-
-const Icon = (props: IconProps) => {
-
-    return (
-
-    );
-};
-
-export default Icon;
--- a/components/TabBar.tsx
+++ b/components/TabBar.tsx
@ -48,7 +48,7 @@ const TabBar = () => {

    const Tab = createBottomTabNavigator();
    return (
-            <NavigationContainer >
+            <NavigationContainer>
                <Tab.Navigator
                screenOptions={tabOptions}
                initialRouteName="Learn"
--- a/package-lock.json
+++ b/package-lock.json
@ -8,21 +8,28 @@
      "name": "expo-init",
      "version": "1.0.0",
      "dependencies": {
+        "@benjeau/react-native-draw": "^0.8.3",
        "@react-navigation/bottom-tabs": "^6.5.4",
        "@react-navigation/native": "^6.1.3",
+        "@shopify/react-native-skia": "0.1.157",
        "expo": "~47.0.12",
+        "expo-2d-context": "^0.0.3",
        "expo-status-bar": "~1.4.2",
        "react": "18.1.0",
        "react-dom": "18.1.0",
        "react-native": "0.70.5",
+        "react-native-canvas": "^0.1.38",
        "react-native-feather": "^1.1.2",
+        "react-native-gesture-handler": "^2.8.0",
        "react-native-svg": "13.4.0",
-        "react-native-web": "~0.18.9"
+        "react-native-web": "~0.18.9",
+        "rn-perfect-sketch-canvas": "^0.3.0"
      },
      "devDependencies": {
        "@babel/core": "^7.12.9",
        "@types/react": "~18.0.14",
        "@types/react-native": "~0.70.6",
+        "@types/react-native-canvas": "^0.1.9",
        "typescript": "^4.6.3"
      }
    },
@ -1786,6 +1793,31 @@
        "node": ">=6.9.0"
      }
    },
+    "node_modules/@benjeau/react-native-draw": {
+      "version": "0.8.3",
+      "resolved": "https://registry.npmjs.org/@benjeau/react-native-draw/-/react-native-draw-0.8.3.tgz",
+      "integrity": "sha512-3VvIkBPyZ+WuGzMBww3aDmSdyJXelRuqaQ55WLqedpRgUdWWVhIneguL4824gRVKotD2u1eDfe5avnvHb2/CDQ==",
+      "dependencies": {
+        "@luncheon/simplify-svg-path": "^0.1.4"
+      },
+      "peerDependencies": {
+        "react": "*",
+        "react-native": "*",
+        "react-native-gesture-handler": ">=2.0.0",
+        "react-native-svg": ">=12.0.0"
+      }
+    },
+    "node_modules/@egjs/hammerjs": {
+      "version": "2.0.17",
+      "resolved": "https://registry.npmjs.org/@egjs/hammerjs/-/hammerjs-2.0.17.tgz",
+      "integrity": "sha512-XQsZgjm2EcVUiZQf11UBJQfmZeEmOW8DpI1gsFeln6w0ae0ii4dMQEQ0kjl6DspdWX1aGY1/loyXnP0JS06e/A==",
+      "dependencies": {
+        "@types/hammerjs": "^2.0.36"
+      },
+      "engines": {
+        "node": ">=0.8.0"
+      }
+    },
    "node_modules/@expo/bunyan": {
      "version": "4.0.0",
      "resolved": "https://registry.npmjs.org/@expo/bunyan/-/bunyan-4.0.0.tgz",
@ -3285,6 +3317,11 @@
        "@jridgewell/sourcemap-codec": "1.4.14"
      }
    },
+    "node_modules/@luncheon/simplify-svg-path": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/@luncheon/simplify-svg-path/-/simplify-svg-path-0.1.5.tgz",
+      "integrity": "sha512-D7oBkAz65OfFgHBRuQ2eXhm/+pQcYyC41jE+TJ4Hi/5+12qgG1mzk0DMpTKVsqJLYn8gbq9roUSLbaEy4M5MRw=="
+    },
    "node_modules/@nodelib/fs.scandir": {
      "version": "2.1.5",
      "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
@ -4616,6 +4653,30 @@
        "join-component": "^1.1.0"
      }
    },
+    "node_modules/@shopify/react-native-skia": {
+      "version": "0.1.157",
+      "resolved": "https://registry.npmjs.org/@shopify/react-native-skia/-/react-native-skia-0.1.157.tgz",
+      "integrity": "sha512-dqOUn2SQ94WJRUAd+LufOyQlNvmCjKFlvVljbi/UjPK47to9Q1zd5amUxPa5acvOrolKsEaNHgiFzOBMyRf0nA==",
+      "hasInstallScript": true,
+      "dependencies": {
+        "@babel/plugin-proposal-nullish-coalescing-operator": "^7.18.6",
+        "canvaskit-wasm": "0.36.1",
+        "react-reconciler": "^0.27.0"
+      },
+      "bin": {
+        "setup-skia-web": "scripts/setup-canvaskit.js"
+      },
+      "peerDependencies": {
+        "react": ">=18.0",
+        "react-native": ">=0.64",
+        "react-native-reanimated": ">=2.0.0"
+      },
+      "peerDependenciesMeta": {
+        "react-native-reanimated": {
+          "optional": true
+        }
+      }
+    },
    "node_modules/@sideway/address": {
      "version": "4.1.4",
      "resolved": "https://registry.npmjs.org/@sideway/address/-/address-4.1.4.tgz",
@ -4639,6 +4700,11 @@
      "resolved": "https://registry.npmjs.org/@sinclair/typebox/-/typebox-0.25.21.tgz",
      "integrity": "sha512-gFukHN4t8K4+wVC+ECqeqwzBDeFeTzBXroBTqE6vcWrQGbEUpHO7LYdG0f4xnvYq4VOEwITSlHlp0JBAIFMS/g=="
    },
+    "node_modules/@types/hammerjs": {
+      "version": "2.0.41",
+      "resolved": "https://registry.npmjs.org/@types/hammerjs/-/hammerjs-2.0.41.tgz",
+      "integrity": "sha512-ewXv/ceBaJprikMcxCmWU1FKyMAQ2X7a9Gtmzw8fcg2kIePI1crERDM818W+XYrxqdBBOdlf2rm137bU+BltCA=="
+    },
    "node_modules/@types/istanbul-lib-coverage": {
      "version": "2.0.4",
      "resolved": "https://registry.npmjs.org/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.4.tgz",
@ -4691,6 +4757,16 @@
        "@types/react": "*"
      }
    },
+    "node_modules/@types/react-native-canvas": {
+      "version": "0.1.9",
+      "resolved": "https://registry.npmjs.org/@types/react-native-canvas/-/react-native-canvas-0.1.9.tgz",
+      "integrity": "sha512-W02xK0lIt9vKk4LNYIOAMQfuW4nbMCeiqCNOdxvCnTyVVhnBjcChdBgELaedUlFk6y71mOOR6sfonOC1TqWeuw==",
+      "dev": true,
+      "dependencies": {
+        "@types/react": "*",
+        "@types/react-native": "*"
+      }
+    },
    "node_modules/@types/scheduler": {
      "version": "0.16.2",
      "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz",
@ -4770,6 +4846,16 @@
        "node": ">= 0.6"
      }
    },
+    "node_modules/adaptive-bezier-curve": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/adaptive-bezier-curve/-/adaptive-bezier-curve-1.0.3.tgz",
+      "integrity": "sha512-mDcwN284LlNAdunqnVmS0PAoDNHKze/PY8zvpCdxzyXD+ZZFeMWQ3FKNBw0VMOd9IfnhIyzAWJDXzRcWnXtoSg=="
+    },
+    "node_modules/adaptive-quadratic-curve": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/adaptive-quadratic-curve/-/adaptive-quadratic-curve-1.0.2.tgz",
+      "integrity": "sha512-D6NxIKnelgRDqQijGR6FQzdWPgs4bC7H54LyukFKxTkoZW4+zNemU2JevF4BuMraoxYogvAIMRc2LD5oSCL34g=="
+    },
    "node_modules/agent-base": {
      "version": "6.0.2",
      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-6.0.2.tgz",
@ -5531,6 +5617,11 @@
        }
      ]
    },
+    "node_modules/canvaskit-wasm": {
+      "version": "0.36.1",
+      "resolved": "https://registry.npmjs.org/canvaskit-wasm/-/canvaskit-wasm-0.36.1.tgz",
+      "integrity": "sha512-6IHlBBc9zDQBTHiGuz4Rf0j/P/ulW24q/yW+QY517e7jwQoM0nJ1+L3h4wUpfC4eQrcpVPQY8ZFbqMbUCzDxTw=="
+    },
    "node_modules/chalk": {
      "version": "2.4.2",
      "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
@ -6098,6 +6189,11 @@
        "node": ">=8"
      }
    },
+    "node_modules/css-font-parser": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/css-font-parser/-/css-font-parser-0.2.3.tgz",
+      "integrity": "sha512-QhdfNV+RjQLVg24d/ls4I8UrA/5WCeEfUmi1je8ISPr7RGZJXwWU2AwZpCiUmWuLZW7dKaB3ER0Bq1W9UhEUag=="
+    },
    "node_modules/css-in-js-utils": {
      "version": "3.1.0",
      "resolved": "https://registry.npmjs.org/css-in-js-utils/-/css-in-js-utils-3.1.0.tgz",
@ -6158,6 +6254,11 @@
      "integrity": "sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw==",
      "dev": true
    },
+    "node_modules/ctx-polyfill": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/ctx-polyfill/-/ctx-polyfill-1.1.4.tgz",
+      "integrity": "sha512-tz65F3/zmZ2+CMtn4MhNhYi/yIN9dKnItMKzSkH2GE6dBpAIbUR0K5pSHWqUL3OuNBCA70DKlWZYUClHfydIXg=="
+    },
    "node_modules/dag-map": {
      "version": "1.0.2",
      "resolved": "https://registry.npmjs.org/dag-map/-/dag-map-1.0.2.tgz",
@ -6367,6 +6468,19 @@
        }
      ]
    },
+    "node_modules/domexception": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/domexception/-/domexception-1.0.1.tgz",
+      "integrity": "sha512-raigMkn7CJNNo6Ihro1fzG7wr3fHuYVytzquZKX5n0yizGsTcYgzdIUwj1X9pK0VvjeihV+XiclP+DjwbsSKug==",
+      "dependencies": {
+        "webidl-conversions": "^4.0.2"
+      }
+    },
+    "node_modules/domexception/node_modules/webidl-conversions": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-4.0.2.tgz",
+      "integrity": "sha512-YQ+BmxuTgd6UXZW3+ICGfyqRyHXVlD5GtQr5+qjiNW7bF0cqrzX500HVXPBOvgXb5YnzDd+h0zqyv61KUD7+Sg=="
+    },
    "node_modules/domhandler": {
      "version": "5.0.3",
      "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-5.0.3.tgz",
@ -6394,6 +6508,11 @@
        "url": "https://github.com/fb55/domutils?sponsor=1"
      }
    },
+    "node_modules/earcut": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/earcut/-/earcut-2.1.1.tgz",
+      "integrity": "sha512-+BGT9Mffq3Oxf2nDOtzaJDd9P8g/z3WNYGO84Q23hDBot5VU8DNGY73Vc94eVDvHjMyhonnuEg+DNwEQ6iZn3w=="
+    },
    "node_modules/ee-first": {
      "version": "1.1.1",
      "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
@ -6727,6 +6846,26 @@
        "expo-error-recovery": "~4.0.1"
      }
    },
+    "node_modules/expo-2d-context": {
+      "version": "0.0.3",
+      "resolved": "https://registry.npmjs.org/expo-2d-context/-/expo-2d-context-0.0.3.tgz",
+      "integrity": "sha512-loO/cIj5owNXv0GJxEQ7Sm1vlGOYoJwHCaf2uiPKG3BZm+gQw6GnDgxN+2WDisNZKLTjnMLUGP1HhBsNnElt6g==",
+      "dependencies": {
+        "adaptive-bezier-curve": "1.0.3",
+        "adaptive-quadratic-curve": "1.0.2",
+        "color-convert": "^1.9.3",
+        "css-font-parser": "0.2.3",
+        "domexception": "1.0.1",
+        "earcut": "2.1.1",
+        "gl-matrix": "^2.4.0",
+        "parse-bmfont-ascii": "1.0.6",
+        "string-format": "0.5.0",
+        "tess2": "^1.0.0"
+      },
+      "peerDependencies": {
+        "expo-asset": "*"
+      }
+    },
    "node_modules/expo-application": {
      "version": "5.0.1",
      "resolved": "https://registry.npmjs.org/expo-application/-/expo-application-5.0.1.tgz",
@ -7355,6 +7494,11 @@
        "node": ">=6"
      }
    },
+    "node_modules/gl-matrix": {
+      "version": "2.8.1",
+      "resolved": "https://registry.npmjs.org/gl-matrix/-/gl-matrix-2.8.1.tgz",
+      "integrity": "sha512-0YCjVpE3pS5XWlN3J4X7AiAx65+nqAI54LndtVFnQZB6G/FVLkZH8y8V6R3cIoOQR4pUdfwQGd1iwyoXHJ4Qfw=="
+    },
    "node_modules/glob": {
      "version": "7.1.6",
      "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.6.tgz",
@ -7551,6 +7695,19 @@
        "node": ">=8"
      }
    },
+    "node_modules/hoist-non-react-statics": {
+      "version": "3.3.2",
+      "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz",
+      "integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==",
+      "dependencies": {
+        "react-is": "^16.7.0"
+      }
+    },
+    "node_modules/hoist-non-react-statics/node_modules/react-is": {
+      "version": "16.13.1",
+      "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
+      "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
+    },
    "node_modules/hosted-git-info": {
      "version": "3.0.8",
      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-3.0.8.tgz",
@ -10048,6 +10205,11 @@
        "node": ">=6"
      }
    },
+    "node_modules/parse-bmfont-ascii": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/parse-bmfont-ascii/-/parse-bmfont-ascii-1.0.6.tgz",
+      "integrity": "sha512-U4RrVsUFCleIOBsIGYOMKjn9PavsGOXxbvYGtMOEfnId0SVNsgehXh1DxUdVPLoxd5mvcEtvmKs2Mmf0Mpa1ZA=="
+    },
    "node_modules/parse-json": {
      "version": "4.0.0",
      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-4.0.0.tgz",
@ -10138,6 +10300,11 @@
        "node": ">=8"
      }
    },
+    "node_modules/perfect-freehand": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/perfect-freehand/-/perfect-freehand-1.2.0.tgz",
+      "integrity": "sha512-h/0ikF1M3phW7CwpZ5MMvKnfpHficWoOEyr//KVNTxV4F6deRK1eYMtHyBKEAKFK0aXIEUK9oBvlF6PNXMDsAw=="
+    },
    "node_modules/picocolors": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
@ -10422,6 +10589,26 @@
        "node": ">= 6"
      }
    },
+    "node_modules/prop-types": {
+      "version": "15.8.1",
+      "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
+      "integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==",
+      "dependencies": {
+        "loose-envify": "^1.4.0",
+        "object-assign": "^4.1.1",
+        "react-is": "^16.13.1"
+      }
+    },
+    "node_modules/prop-types/node_modules/react-is": {
+      "version": "16.13.1",
+      "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
+      "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
+    },
+    "node_modules/proxy-compare": {
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/proxy-compare/-/proxy-compare-2.4.0.tgz",
+      "integrity": "sha512-FD8KmQUQD6Mfpd0hywCOzcon/dbkFP8XBd9F1ycbKtvVsfv6TsFUKJ2eC0Iz2y+KzlkdT1Z8SY6ZSgm07zOyqg=="
+    },
    "node_modules/pump": {
      "version": "3.0.0",
      "resolved": "https://registry.npmjs.org/pump/-/pump-3.0.0.tgz",
@ -10647,6 +10834,17 @@
        "react": "18.1.0"
      }
    },
+    "node_modules/react-native-canvas": {
+      "version": "0.1.38",
+      "resolved": "https://registry.npmjs.org/react-native-canvas/-/react-native-canvas-0.1.38.tgz",
+      "integrity": "sha512-DjtN921PKoa2liYF8hKq1263xg2o47Bj/1E/+l75GPicT2RV/x/Y1HBrLvFVCR3OO+UslXEC5BtRjfxDoh/Bug==",
+      "dependencies": {
+        "ctx-polyfill": "^1.1.4"
+      },
+      "peerDependencies": {
+        "react-native-webview": ">=5.10.0 || >=6.1.0"
+      }
+    },
    "node_modules/react-native-codegen": {
      "version": "0.70.6",
      "resolved": "https://registry.npmjs.org/react-native-codegen/-/react-native-codegen-0.70.6.tgz",
@ -10667,6 +10865,22 @@
        "react-native-svg": ">=5.3"
      }
    },
+    "node_modules/react-native-gesture-handler": {
+      "version": "2.8.0",
+      "resolved": "https://registry.npmjs.org/react-native-gesture-handler/-/react-native-gesture-handler-2.8.0.tgz",
+      "integrity": "sha512-poOSfz/w0IyD6Qwq7aaIRRfEaVTl1ecQFoyiIbpOpfNTjm2B1niY2FLrdVQIOtIOe+K9nH55Qal04nr4jGkHdQ==",
+      "dependencies": {
+        "@egjs/hammerjs": "^2.0.17",
+        "hoist-non-react-statics": "^3.3.0",
+        "invariant": "^2.2.4",
+        "lodash": "^4.17.21",
+        "prop-types": "^15.7.2"
+      },
+      "peerDependencies": {
+        "react": "*",
+        "react-native": "*"
+      }
+    },
    "node_modules/react-native-gradle-plugin": {
      "version": "0.70.3",
      "resolved": "https://registry.npmjs.org/react-native-gradle-plugin/-/react-native-gradle-plugin-0.70.3.tgz",
@ -10727,6 +10941,29 @@
        "react-dom": "^17.0.2 || ^18.0.0"
      }
    },
+    "node_modules/react-native-webview": {
+      "version": "11.26.1",
+      "resolved": "https://registry.npmjs.org/react-native-webview/-/react-native-webview-11.26.1.tgz",
+      "integrity": "sha512-hC7BkxOpf+z0UKhxFSFTPAM4shQzYmZHoELa6/8a/MspcjEP7ukYKpuSUTLDywQditT8yI9idfcKvfZDKQExGw==",
+      "peer": true,
+      "dependencies": {
+        "escape-string-regexp": "2.0.0",
+        "invariant": "2.2.4"
+      },
+      "peerDependencies": {
+        "react": "*",
+        "react-native": "*"
+      }
+    },
+    "node_modules/react-native-webview/node_modules/escape-string-regexp": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-2.0.0.tgz",
+      "integrity": "sha512-UpzcLCXolUWcNu5HtVMHYdXJjArjsF9C0aNnquZYY4uW/Vu0miy5YoWvbV345HauVvcAUnpRuhMMcqTcGOY2+w==",
+      "peer": true,
+      "engines": {
+        "node": ">=8"
+      }
+    },
    "node_modules/react-native/node_modules/@react-native/normalize-color": {
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/@react-native/normalize-color/-/normalize-color-2.0.0.tgz",
@ -10740,6 +10977,29 @@
        "asap": "~2.0.6"
      }
    },
+    "node_modules/react-reconciler": {
+      "version": "0.27.0",
+      "resolved": "https://registry.npmjs.org/react-reconciler/-/react-reconciler-0.27.0.tgz",
+      "integrity": "sha512-HmMDKciQjYmBRGuuhIaKA1ba/7a+UsM5FzOZsMO2JYHt9Jh8reCb7j1eDC95NOyUlKM9KRyvdx0flBuDvYSBoA==",
+      "dependencies": {
+        "loose-envify": "^1.1.0",
+        "scheduler": "^0.21.0"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      },
+      "peerDependencies": {
+        "react": "^18.0.0"
+      }
+    },
+    "node_modules/react-reconciler/node_modules/scheduler": {
+      "version": "0.21.0",
+      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.21.0.tgz",
+      "integrity": "sha512-1r87x5fz9MXqswA2ERLo0EbOAU74DpIUO090gIasYTqlVoJeMcl+Z1Rg7WHz+qtPujhS/hGIt9kxZOYBV3faRQ==",
+      "dependencies": {
+        "loose-envify": "^1.1.0"
+      }
+    },
    "node_modules/react-refresh": {
      "version": "0.4.3",
      "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.4.3.tgz",
@ -11025,6 +11285,20 @@
        "rimraf": "bin.js"
      }
    },
+    "node_modules/rn-perfect-sketch-canvas": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/rn-perfect-sketch-canvas/-/rn-perfect-sketch-canvas-0.3.0.tgz",
+      "integrity": "sha512-qK82NW1YjlKSK9oT3iGrPBYiEKkygVHGqVSupwTSbIJJ+SaRodQ2Td+QZ86inFcYQqJJ+EcpFzTpZ2Ln2+Zfow==",
+      "dependencies": {
+        "perfect-freehand": "^1.1.0",
+        "valtio": "^1.6.1"
+      },
+      "peerDependencies": {
+        "@shopify/react-native-skia": "*",
+        "react": "*",
+        "react-native": "*"
+      }
+    },
    "node_modules/run-parallel": {
      "version": "1.2.0",
      "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz",
@ -11766,6 +12040,11 @@
        "safe-buffer": "~5.1.0"
      }
    },
+    "node_modules/string-format": {
+      "version": "0.5.0",
+      "resolved": "https://registry.npmjs.org/string-format/-/string-format-0.5.0.tgz",
+      "integrity": "sha512-c/CiKQMy7uuEzi+Tsvnn63/PQw/F7IOSLHNuQ44Eypd0x5VvFnDXMd2T9H0ntphv8nrHAKoZcINPb/yitOAB/g=="
+    },
    "node_modules/string-width": {
      "version": "4.2.3",
      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
@ -12080,6 +12359,11 @@
        "url": "https://github.com/sponsors/sindresorhus"
      }
    },
+    "node_modules/tess2": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/tess2/-/tess2-1.0.0.tgz",
+      "integrity": "sha512-iSWBSOUoPn3cCT26L5Wi6mvVgL11RV4kReSnVIIPdMN7qNpkL5SLKen5BJcWj+ZTN7kK6JrHBdqTV7vvL8g+9w=="
+    },
    "node_modules/text-table": {
      "version": "0.2.0",
      "resolved": "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz",
@ -12554,6 +12838,26 @@
        "builtins": "^1.0.3"
      }
    },
+    "node_modules/valtio": {
+      "version": "1.9.0",
+      "resolved": "https://registry.npmjs.org/valtio/-/valtio-1.9.0.tgz",
+      "integrity": "sha512-mQLFsAlKbYascZygFQh6lXuDjU5WHLoeZ8He4HqMnWfasM96V6rDbeFkw1XeG54xycmDonr/Jb4xgviHtuySrA==",
+      "dependencies": {
+        "proxy-compare": "2.4.0",
+        "use-sync-external-store": "1.2.0"
+      },
+      "engines": {
+        "node": ">=12.20.0"
+      },
+      "peerDependencies": {
+        "react": ">=16.8"
+      },
+      "peerDependenciesMeta": {
+        "react": {
+          "optional": true
+        }
+      }
+    },
    "node_modules/vary": {
      "version": "1.1.2",
      "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
@ -14054,6 +14358,22 @@
        "to-fast-properties": "^2.0.0"
      }
    },
+    "@benjeau/react-native-draw": {
+      "version": "0.8.3",
+      "resolved": "https://registry.npmjs.org/@benjeau/react-native-draw/-/react-native-draw-0.8.3.tgz",
+      "integrity": "sha512-3VvIkBPyZ+WuGzMBww3aDmSdyJXelRuqaQ55WLqedpRgUdWWVhIneguL4824gRVKotD2u1eDfe5avnvHb2/CDQ==",
+      "requires": {
+        "@luncheon/simplify-svg-path": "^0.1.4"
+      }
+    },
+    "@egjs/hammerjs": {
+      "version": "2.0.17",
+      "resolved": "https://registry.npmjs.org/@egjs/hammerjs/-/hammerjs-2.0.17.tgz",
+      "integrity": "sha512-XQsZgjm2EcVUiZQf11UBJQfmZeEmOW8DpI1gsFeln6w0ae0ii4dMQEQ0kjl6DspdWX1aGY1/loyXnP0JS06e/A==",
+      "requires": {
+        "@types/hammerjs": "^2.0.36"
+      }
+    },
    "@expo/bunyan": {
      "version": "4.0.0",
      "resolved": "https://registry.npmjs.org/@expo/bunyan/-/bunyan-4.0.0.tgz",
@ -15244,6 +15564,11 @@
        "@jridgewell/sourcemap-codec": "1.4.14"
      }
    },
+    "@luncheon/simplify-svg-path": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/@luncheon/simplify-svg-path/-/simplify-svg-path-0.1.5.tgz",
+      "integrity": "sha512-D7oBkAz65OfFgHBRuQ2eXhm/+pQcYyC41jE+TJ4Hi/5+12qgG1mzk0DMpTKVsqJLYn8gbq9roUSLbaEy4M5MRw=="
+    },
    "@nodelib/fs.scandir": {
      "version": "2.1.5",
      "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
@ -16233,6 +16558,16 @@
        "join-component": "^1.1.0"
      }
    },
+    "@shopify/react-native-skia": {
+      "version": "0.1.157",
+      "resolved": "https://registry.npmjs.org/@shopify/react-native-skia/-/react-native-skia-0.1.157.tgz",
+      "integrity": "sha512-dqOUn2SQ94WJRUAd+LufOyQlNvmCjKFlvVljbi/UjPK47to9Q1zd5amUxPa5acvOrolKsEaNHgiFzOBMyRf0nA==",
+      "requires": {
+        "@babel/plugin-proposal-nullish-coalescing-operator": "^7.18.6",
+        "canvaskit-wasm": "0.36.1",
+        "react-reconciler": "^0.27.0"
+      }
+    },
    "@sideway/address": {
      "version": "4.1.4",
      "resolved": "https://registry.npmjs.org/@sideway/address/-/address-4.1.4.tgz",
@ -16256,6 +16591,11 @@
      "resolved": "https://registry.npmjs.org/@sinclair/typebox/-/typebox-0.25.21.tgz",
      "integrity": "sha512-gFukHN4t8K4+wVC+ECqeqwzBDeFeTzBXroBTqE6vcWrQGbEUpHO7LYdG0f4xnvYq4VOEwITSlHlp0JBAIFMS/g=="
    },
+    "@types/hammerjs": {
+      "version": "2.0.41",
+      "resolved": "https://registry.npmjs.org/@types/hammerjs/-/hammerjs-2.0.41.tgz",
+      "integrity": "sha512-ewXv/ceBaJprikMcxCmWU1FKyMAQ2X7a9Gtmzw8fcg2kIePI1crERDM818W+XYrxqdBBOdlf2rm137bU+BltCA=="
+    },
    "@types/istanbul-lib-coverage": {
      "version": "2.0.4",
      "resolved": "https://registry.npmjs.org/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.4.tgz",
@ -16308,6 +16648,16 @@
        "@types/react": "*"
      }
    },
+    "@types/react-native-canvas": {
+      "version": "0.1.9",
+      "resolved": "https://registry.npmjs.org/@types/react-native-canvas/-/react-native-canvas-0.1.9.tgz",
+      "integrity": "sha512-W02xK0lIt9vKk4LNYIOAMQfuW4nbMCeiqCNOdxvCnTyVVhnBjcChdBgELaedUlFk6y71mOOR6sfonOC1TqWeuw==",
+      "dev": true,
+      "requires": {
+        "@types/react": "*",
+        "@types/react-native": "*"
+      }
+    },
    "@types/scheduler": {
      "version": "0.16.2",
      "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz",
@ -16372,6 +16722,16 @@
        "negotiator": "0.6.3"
      }
    },
+    "adaptive-bezier-curve": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/adaptive-bezier-curve/-/adaptive-bezier-curve-1.0.3.tgz",
+      "integrity": "sha512-mDcwN284LlNAdunqnVmS0PAoDNHKze/PY8zvpCdxzyXD+ZZFeMWQ3FKNBw0VMOd9IfnhIyzAWJDXzRcWnXtoSg=="
+    },
+    "adaptive-quadratic-curve": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/adaptive-quadratic-curve/-/adaptive-quadratic-curve-1.0.2.tgz",
+      "integrity": "sha512-D6NxIKnelgRDqQijGR6FQzdWPgs4bC7H54LyukFKxTkoZW4+zNemU2JevF4BuMraoxYogvAIMRc2LD5oSCL34g=="
+    },
    "agent-base": {
      "version": "6.0.2",
      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-6.0.2.tgz",
@ -16952,6 +17312,11 @@
      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001447.tgz",
      "integrity": "sha512-bdKU1BQDPeEXe9A39xJnGtY0uRq/z5osrnXUw0TcK+EYno45Y+U7QU9HhHEyzvMDffpYadFXi3idnSNkcwLkTw=="
    },
+    "canvaskit-wasm": {
+      "version": "0.36.1",
+      "resolved": "https://registry.npmjs.org/canvaskit-wasm/-/canvaskit-wasm-0.36.1.tgz",
+      "integrity": "sha512-6IHlBBc9zDQBTHiGuz4Rf0j/P/ulW24q/yW+QY517e7jwQoM0nJ1+L3h4wUpfC4eQrcpVPQY8ZFbqMbUCzDxTw=="
+    },
    "chalk": {
      "version": "2.4.2",
      "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
@ -17399,6 +17764,11 @@
      "resolved": "https://registry.npmjs.org/crypto-random-string/-/crypto-random-string-2.0.0.tgz",
      "integrity": "sha512-v1plID3y9r/lPhviJ1wrXpLeyUIGAZ2SHNYTEapm7/8A9nLPoyvVp3RK/EPFqn5kEznyWgYZNsRtYYIWbuG8KA=="
    },
+    "css-font-parser": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/css-font-parser/-/css-font-parser-0.2.3.tgz",
+      "integrity": "sha512-QhdfNV+RjQLVg24d/ls4I8UrA/5WCeEfUmi1je8ISPr7RGZJXwWU2AwZpCiUmWuLZW7dKaB3ER0Bq1W9UhEUag=="
+    },
    "css-in-js-utils": {
      "version": "3.1.0",
      "resolved": "https://registry.npmjs.org/css-in-js-utils/-/css-in-js-utils-3.1.0.tgz",
@ -17446,6 +17816,11 @@
      "integrity": "sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw==",
      "dev": true
    },
+    "ctx-polyfill": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/ctx-polyfill/-/ctx-polyfill-1.1.4.tgz",
+      "integrity": "sha512-tz65F3/zmZ2+CMtn4MhNhYi/yIN9dKnItMKzSkH2GE6dBpAIbUR0K5pSHWqUL3OuNBCA70DKlWZYUClHfydIXg=="
+    },
    "dag-map": {
      "version": "1.0.2",
      "resolved": "https://registry.npmjs.org/dag-map/-/dag-map-1.0.2.tgz",
@ -17590,6 +17965,21 @@
      "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.3.0.tgz",
      "integrity": "sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw=="
    },
+    "domexception": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/domexception/-/domexception-1.0.1.tgz",
+      "integrity": "sha512-raigMkn7CJNNo6Ihro1fzG7wr3fHuYVytzquZKX5n0yizGsTcYgzdIUwj1X9pK0VvjeihV+XiclP+DjwbsSKug==",
+      "requires": {
+        "webidl-conversions": "^4.0.2"
+      },
+      "dependencies": {
+        "webidl-conversions": {
+          "version": "4.0.2",
+          "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-4.0.2.tgz",
+          "integrity": "sha512-YQ+BmxuTgd6UXZW3+ICGfyqRyHXVlD5GtQr5+qjiNW7bF0cqrzX500HVXPBOvgXb5YnzDd+h0zqyv61KUD7+Sg=="
+        }
+      }
+    },
    "domhandler": {
      "version": "5.0.3",
      "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-5.0.3.tgz",
@ -17608,6 +17998,11 @@
        "domhandler": "^5.0.1"
      }
    },
+    "earcut": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/earcut/-/earcut-2.1.1.tgz",
+      "integrity": "sha512-+BGT9Mffq3Oxf2nDOtzaJDd9P8g/z3WNYGO84Q23hDBot5VU8DNGY73Vc94eVDvHjMyhonnuEg+DNwEQ6iZn3w=="
+    },
    "ee-first": {
      "version": "1.1.1",
      "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
@ -17866,6 +18261,23 @@
        "uuid": "^3.4.0"
      }
    },
+    "expo-2d-context": {
+      "version": "0.0.3",
+      "resolved": "https://registry.npmjs.org/expo-2d-context/-/expo-2d-context-0.0.3.tgz",
+      "integrity": "sha512-loO/cIj5owNXv0GJxEQ7Sm1vlGOYoJwHCaf2uiPKG3BZm+gQw6GnDgxN+2WDisNZKLTjnMLUGP1HhBsNnElt6g==",
+      "requires": {
+        "adaptive-bezier-curve": "1.0.3",
+        "adaptive-quadratic-curve": "1.0.2",
+        "color-convert": "^1.9.3",
+        "css-font-parser": "0.2.3",
+        "domexception": "1.0.1",
+        "earcut": "2.1.1",
+        "gl-matrix": "^2.4.0",
+        "parse-bmfont-ascii": "1.0.6",
+        "string-format": "0.5.0",
+        "tess2": "^1.0.0"
+      }
+    },
    "expo-application": {
      "version": "5.0.1",
      "resolved": "https://registry.npmjs.org/expo-application/-/expo-application-5.0.1.tgz",
@ -18357,6 +18769,11 @@
      "resolved": "https://registry.npmjs.org/getenv/-/getenv-1.0.0.tgz",
      "integrity": "sha512-7yetJWqbS9sbn0vIfliPsFgoXMKn/YMF+Wuiog97x+urnSRRRZ7xB+uVkwGKzRgq9CDFfMQnE9ruL5DHv9c6Xg=="
    },
+    "gl-matrix": {
+      "version": "2.8.1",
+      "resolved": "https://registry.npmjs.org/gl-matrix/-/gl-matrix-2.8.1.tgz",
+      "integrity": "sha512-0YCjVpE3pS5XWlN3J4X7AiAx65+nqAI54LndtVFnQZB6G/FVLkZH8y8V6R3cIoOQR4pUdfwQGd1iwyoXHJ4Qfw=="
+    },
    "glob": {
      "version": "7.1.6",
      "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.6.tgz",
@ -18500,6 +18917,21 @@
        "source-map": "^0.7.3"
      }
    },
+    "hoist-non-react-statics": {
+      "version": "3.3.2",
+      "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz",
+      "integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==",
+      "requires": {
+        "react-is": "^16.7.0"
+      },
+      "dependencies": {
+        "react-is": {
+          "version": "16.13.1",
+          "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
+          "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
+        }
+      }
+    },
    "hosted-git-info": {
      "version": "3.0.8",
      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-3.0.8.tgz",
@ -20428,6 +20860,11 @@
      "resolved": "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz",
      "integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ=="
    },
+    "parse-bmfont-ascii": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/parse-bmfont-ascii/-/parse-bmfont-ascii-1.0.6.tgz",
+      "integrity": "sha512-U4RrVsUFCleIOBsIGYOMKjn9PavsGOXxbvYGtMOEfnId0SVNsgehXh1DxUdVPLoxd5mvcEtvmKs2Mmf0Mpa1ZA=="
+    },
    "parse-json": {
      "version": "4.0.0",
      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-4.0.0.tgz",
@ -20494,6 +20931,11 @@
      "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz",
      "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw=="
    },
+    "perfect-freehand": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/perfect-freehand/-/perfect-freehand-1.2.0.tgz",
+      "integrity": "sha512-h/0ikF1M3phW7CwpZ5MMvKnfpHficWoOEyr//KVNTxV4F6deRK1eYMtHyBKEAKFK0aXIEUK9oBvlF6PNXMDsAw=="
+    },
    "picocolors": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
@ -20702,6 +21144,28 @@
        "sisteransi": "^1.0.5"
      }
    },
+    "prop-types": {
+      "version": "15.8.1",
+      "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
+      "integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==",
+      "requires": {
+        "loose-envify": "^1.4.0",
+        "object-assign": "^4.1.1",
+        "react-is": "^16.13.1"
+      },
+      "dependencies": {
+        "react-is": {
+          "version": "16.13.1",
+          "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
+          "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
+        }
+      }
+    },
+    "proxy-compare": {
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/proxy-compare/-/proxy-compare-2.4.0.tgz",
+      "integrity": "sha512-FD8KmQUQD6Mfpd0hywCOzcon/dbkFP8XBd9F1ycbKtvVsfv6TsFUKJ2eC0Iz2y+KzlkdT1Z8SY6ZSgm07zOyqg=="
+    },
    "pump": {
      "version": "3.0.0",
      "resolved": "https://registry.npmjs.org/pump/-/pump-3.0.0.tgz",
@ -20872,6 +21336,14 @@
        }
      }
    },
+    "react-native-canvas": {
+      "version": "0.1.38",
+      "resolved": "https://registry.npmjs.org/react-native-canvas/-/react-native-canvas-0.1.38.tgz",
+      "integrity": "sha512-DjtN921PKoa2liYF8hKq1263xg2o47Bj/1E/+l75GPicT2RV/x/Y1HBrLvFVCR3OO+UslXEC5BtRjfxDoh/Bug==",
+      "requires": {
+        "ctx-polyfill": "^1.1.4"
+      }
+    },
    "react-native-codegen": {
      "version": "0.70.6",
      "resolved": "https://registry.npmjs.org/react-native-codegen/-/react-native-codegen-0.70.6.tgz",
@ -20889,6 +21361,18 @@
      "integrity": "sha512-qBc0+XegKkX4JV6ykgScasguEV3RdlbYp9IrCMnbozngOgJ7vi76pyRpb+dnZ1AZVkYsbYnpdA9JXeP7EJbMCA==",
      "requires": {}
    },
+    "react-native-gesture-handler": {
+      "version": "2.8.0",
+      "resolved": "https://registry.npmjs.org/react-native-gesture-handler/-/react-native-gesture-handler-2.8.0.tgz",
+      "integrity": "sha512-poOSfz/w0IyD6Qwq7aaIRRfEaVTl1ecQFoyiIbpOpfNTjm2B1niY2FLrdVQIOtIOe+K9nH55Qal04nr4jGkHdQ==",
+      "requires": {
+        "@egjs/hammerjs": "^2.0.17",
+        "hoist-non-react-statics": "^3.3.0",
+        "invariant": "^2.2.4",
+        "lodash": "^4.17.21",
+        "prop-types": "^15.7.2"
+      }
+    },
    "react-native-gradle-plugin": {
      "version": "0.70.3",
      "resolved": "https://registry.npmjs.org/react-native-gradle-plugin/-/react-native-gradle-plugin-0.70.3.tgz",
@ -20934,6 +21418,43 @@
        "styleq": "^0.1.2"
      }
    },
+    "react-native-webview": {
+      "version": "11.26.1",
+      "resolved": "https://registry.npmjs.org/react-native-webview/-/react-native-webview-11.26.1.tgz",
+      "integrity": "sha512-hC7BkxOpf+z0UKhxFSFTPAM4shQzYmZHoELa6/8a/MspcjEP7ukYKpuSUTLDywQditT8yI9idfcKvfZDKQExGw==",
+      "peer": true,
+      "requires": {
+        "escape-string-regexp": "2.0.0",
+        "invariant": "2.2.4"
+      },
+      "dependencies": {
+        "escape-string-regexp": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-2.0.0.tgz",
+          "integrity": "sha512-UpzcLCXolUWcNu5HtVMHYdXJjArjsF9C0aNnquZYY4uW/Vu0miy5YoWvbV345HauVvcAUnpRuhMMcqTcGOY2+w==",
+          "peer": true
+        }
+      }
+    },
+    "react-reconciler": {
+      "version": "0.27.0",
+      "resolved": "https://registry.npmjs.org/react-reconciler/-/react-reconciler-0.27.0.tgz",
+      "integrity": "sha512-HmMDKciQjYmBRGuuhIaKA1ba/7a+UsM5FzOZsMO2JYHt9Jh8reCb7j1eDC95NOyUlKM9KRyvdx0flBuDvYSBoA==",
+      "requires": {
+        "loose-envify": "^1.1.0",
+        "scheduler": "^0.21.0"
+      },
+      "dependencies": {
+        "scheduler": {
+          "version": "0.21.0",
+          "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.21.0.tgz",
+          "integrity": "sha512-1r87x5fz9MXqswA2ERLo0EbOAU74DpIUO090gIasYTqlVoJeMcl+Z1Rg7WHz+qtPujhS/hGIt9kxZOYBV3faRQ==",
+          "requires": {
+            "loose-envify": "^1.1.0"
+          }
+        }
+      }
+    },
    "react-refresh": {
      "version": "0.4.3",
      "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.4.3.tgz",
@ -21160,6 +21681,15 @@
        "glob": "^7.1.3"
      }
    },
+    "rn-perfect-sketch-canvas": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/rn-perfect-sketch-canvas/-/rn-perfect-sketch-canvas-0.3.0.tgz",
+      "integrity": "sha512-qK82NW1YjlKSK9oT3iGrPBYiEKkygVHGqVSupwTSbIJJ+SaRodQ2Td+QZ86inFcYQqJJ+EcpFzTpZ2Ln2+Zfow==",
+      "requires": {
+        "perfect-freehand": "^1.1.0",
+        "valtio": "^1.6.1"
+      }
+    },
    "run-parallel": {
      "version": "1.2.0",
      "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz",
@ -21753,6 +22283,11 @@
        "safe-buffer": "~5.1.0"
      }
    },
+    "string-format": {
+      "version": "0.5.0",
+      "resolved": "https://registry.npmjs.org/string-format/-/string-format-0.5.0.tgz",
+      "integrity": "sha512-c/CiKQMy7uuEzi+Tsvnn63/PQw/F7IOSLHNuQ44Eypd0x5VvFnDXMd2T9H0ntphv8nrHAKoZcINPb/yitOAB/g=="
+    },
    "string-width": {
      "version": "4.2.3",
      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
@ -21977,6 +22512,11 @@
        }
      }
    },
+    "tess2": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/tess2/-/tess2-1.0.0.tgz",
+      "integrity": "sha512-iSWBSOUoPn3cCT26L5Wi6mvVgL11RV4kReSnVIIPdMN7qNpkL5SLKen5BJcWj+ZTN7kK6JrHBdqTV7vvL8g+9w=="
+    },
    "text-table": {
      "version": "0.2.0",
      "resolved": "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz",
@ -22327,6 +22867,15 @@
        "builtins": "^1.0.3"
      }
    },
+    "valtio": {
+      "version": "1.9.0",
+      "resolved": "https://registry.npmjs.org/valtio/-/valtio-1.9.0.tgz",
+      "integrity": "sha512-mQLFsAlKbYascZygFQh6lXuDjU5WHLoeZ8He4HqMnWfasM96V6rDbeFkw1XeG54xycmDonr/Jb4xgviHtuySrA==",
+      "requires": {
+        "proxy-compare": "2.4.0",
+        "use-sync-external-store": "1.2.0"
+      }
+    },
    "vary": {
      "version": "1.1.2",
      "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
--- a/package.json
+++ b/package.json
@ -9,21 +9,28 @@
    "web": "expo start --web"
  },
  "dependencies": {
+    "@benjeau/react-native-draw": "^0.8.3",
    "@react-navigation/bottom-tabs": "^6.5.4",
    "@react-navigation/native": "^6.1.3",
+    "@shopify/react-native-skia": "0.1.157",
    "expo": "~47.0.12",
+    "expo-2d-context": "^0.0.3",
    "expo-status-bar": "~1.4.2",
    "react": "18.1.0",
    "react-dom": "18.1.0",
    "react-native": "0.70.5",
+    "react-native-canvas": "^0.1.38",
    "react-native-feather": "^1.1.2",
+    "react-native-gesture-handler": "^2.8.0",
    "react-native-svg": "13.4.0",
-    "react-native-web": "~0.18.9"
+    "react-native-web": "~0.18.9",
+    "rn-perfect-sketch-canvas": "^0.3.0"
  },
  "devDependencies": {
    "@babel/core": "^7.12.9",
    "@types/react": "~18.0.14",
    "@types/react-native": "~0.70.6",
+    "@types/react-native-canvas": "^0.1.9",
    "typescript": "^4.6.3"
  },
  "private": true
--- a/pages/Playground.tsx
+++ b/pages/Playground.tsx
@ -1,5 +1,6 @@
 import React, { useEffect, useState } from 'react';
 import { Text, View, StyleSheet } from 'react-native';
+import DrawingCanva from '../components/DrawingCanva';
 import KanjiCard from '../components/KanjiCard';


@ -7,7 +8,7 @@ const Playground = () => {

    return (
        <View style={playgroundStyle.container}>
-            <Text>Play !</Text>
+            <DrawingCanva backgroundImage="https://media.kanjialive.com/kanji_strokes/otozu(reru)_11.svg"/>
        </View>
    );
 };
--- a/yarn-error.log
+++ b/yarn-error.log
--- a/yarn.lock
+++ b/yarn.lock
@ -1062,6 +1062,20 @@
    "@babel/helper-validator-identifier" "^7.19.1"
    "to-fast-properties" "^2.0.0"

+"@benjeau/react-native-draw@^0.8.3":
+  "integrity" "sha512-3VvIkBPyZ+WuGzMBww3aDmSdyJXelRuqaQ55WLqedpRgUdWWVhIneguL4824gRVKotD2u1eDfe5avnvHb2/CDQ=="
+  "resolved" "https://registry.npmjs.org/@benjeau/react-native-draw/-/react-native-draw-0.8.3.tgz"
+  "version" "0.8.3"
+  dependencies:
+    "@luncheon/simplify-svg-path" "^0.1.4"
+
+"@egjs/hammerjs@^2.0.17":
+  "integrity" "sha512-XQsZgjm2EcVUiZQf11UBJQfmZeEmOW8DpI1gsFeln6w0ae0ii4dMQEQ0kjl6DspdWX1aGY1/loyXnP0JS06e/A=="
+  "resolved" "https://registry.npmjs.org/@egjs/hammerjs/-/hammerjs-2.0.17.tgz"
+  "version" "2.0.17"
+  dependencies:
+    "@types/hammerjs" "^2.0.36"
+
 "@expo/bunyan@^4.0.0", "@expo/bunyan@4.0.0":
  "integrity" "sha512-Ydf4LidRB/EBI+YrB+cVLqIseiRfjUI/AeHBgjGMtq3GroraDu81OV7zqophRgupngoL3iS3JUMDMnxO7g39qA=="
  "resolved" "https://registry.npmjs.org/@expo/bunyan/-/bunyan-4.0.0.tgz"
@ -1479,6 +1493,11 @@
    "@jridgewell/resolve-uri" "3.1.0"
    "@jridgewell/sourcemap-codec" "1.4.14"

+"@luncheon/simplify-svg-path@^0.1.4":
+  "integrity" "sha512-D7oBkAz65OfFgHBRuQ2eXhm/+pQcYyC41jE+TJ4Hi/5+12qgG1mzk0DMpTKVsqJLYn8gbq9roUSLbaEy4M5MRw=="
+  "resolved" "https://registry.npmjs.org/@luncheon/simplify-svg-path/-/simplify-svg-path-0.1.5.tgz"
+  "version" "0.1.5"
+
 "@nodelib/fs.scandir@2.1.5":
  "integrity" "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g=="
  "resolved" "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz"
@ -1772,6 +1791,15 @@
    "component-type" "^1.2.1"
    "join-component" "^1.1.0"

+"@shopify/react-native-skia@*", "@shopify/react-native-skia@0.1.157":
+  "integrity" "sha512-dqOUn2SQ94WJRUAd+LufOyQlNvmCjKFlvVljbi/UjPK47to9Q1zd5amUxPa5acvOrolKsEaNHgiFzOBMyRf0nA=="
+  "resolved" "https://registry.npmjs.org/@shopify/react-native-skia/-/react-native-skia-0.1.157.tgz"
+  "version" "0.1.157"
+  dependencies:
+    "@babel/plugin-proposal-nullish-coalescing-operator" "^7.18.6"
+    "canvaskit-wasm" "0.36.1"
+    "react-reconciler" "^0.27.0"
+
 "@sideway/address@^4.1.3":
  "integrity" "sha512-7vwq+rOHVWjyXxVlR76Agnvhy8I9rpzjosTESvmhNeXOXdZZB15Fl+TI9x1SiHZH5Jv2wTGduSxFDIaq0m3DUw=="
  "resolved" "https://registry.npmjs.org/@sideway/address/-/address-4.1.4.tgz"
@ -1794,6 +1822,11 @@
  "resolved" "https://registry.npmjs.org/@sinclair/typebox/-/typebox-0.25.21.tgz"
  "version" "0.25.21"

+"@types/hammerjs@^2.0.36":
+  "integrity" "sha512-ewXv/ceBaJprikMcxCmWU1FKyMAQ2X7a9Gtmzw8fcg2kIePI1crERDM818W+XYrxqdBBOdlf2rm137bU+BltCA=="
+  "resolved" "https://registry.npmjs.org/@types/hammerjs/-/hammerjs-2.0.41.tgz"
+  "version" "2.0.41"
+
 "@types/istanbul-lib-coverage@*", "@types/istanbul-lib-coverage@^2.0.0":
  "integrity" "sha512-z/QT1XN4K4KYuslS23k62yDIDLwLFkzxOuMplDtObz0+y7VqJCaO2o+SPwHCvLFZh7xazvvoor2tA/hPz9ee7g=="
  "resolved" "https://registry.npmjs.org/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.4.tgz"
@ -1823,7 +1856,15 @@
  "resolved" "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.5.tgz"
  "version" "15.7.5"

-"@types/react-native@~0.70.6":
+"@types/react-native-canvas@^0.1.9":
+  "integrity" "sha512-W02xK0lIt9vKk4LNYIOAMQfuW4nbMCeiqCNOdxvCnTyVVhnBjcChdBgELaedUlFk6y71mOOR6sfonOC1TqWeuw=="
+  "resolved" "https://registry.npmjs.org/@types/react-native-canvas/-/react-native-canvas-0.1.9.tgz"
+  "version" "0.1.9"
+  dependencies:
+    "@types/react" "*"
+    "@types/react-native" "*"
+
+"@types/react-native@*", "@types/react-native@~0.70.6":
  "integrity" "sha512-0C6sIo13ztzM2llaWdTq0Vpscx3VdU0T8F45kEurWv3l5n+BHm/Mkr8Z+N29eXDYGhTvCz5y2jegB8JyiVa5kw=="
  "resolved" "https://registry.npmjs.org/@types/react-native/-/react-native-0.70.9.tgz"
  "version" "0.70.9"
@ -1911,6 +1952,16 @@
    "mime-types" "~2.1.34"
    "negotiator" "0.6.3"

+"adaptive-bezier-curve@1.0.3":
+  "integrity" "sha512-mDcwN284LlNAdunqnVmS0PAoDNHKze/PY8zvpCdxzyXD+ZZFeMWQ3FKNBw0VMOd9IfnhIyzAWJDXzRcWnXtoSg=="
+  "resolved" "https://registry.npmjs.org/adaptive-bezier-curve/-/adaptive-bezier-curve-1.0.3.tgz"
+  "version" "1.0.3"
+
+"adaptive-quadratic-curve@1.0.2":
+  "integrity" "sha512-D6NxIKnelgRDqQijGR6FQzdWPgs4bC7H54LyukFKxTkoZW4+zNemU2JevF4BuMraoxYogvAIMRc2LD5oSCL34g=="
+  "resolved" "https://registry.npmjs.org/adaptive-quadratic-curve/-/adaptive-quadratic-curve-1.0.2.tgz"
+  "version" "1.0.2"
+
 "agent-base@6":
  "integrity" "sha512-RZNwNclF7+MS/8bDg70amg32dyeZGZxiDuQmZxKLAlQjr3jGyLx+4Kkk58UO7D2QdgFIQCovuSuZESne6RG6XQ=="
  "resolved" "https://registry.npmjs.org/agent-base/-/agent-base-6.0.2.tgz"
@ -2459,6 +2510,11 @@
  "resolved" "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001447.tgz"
  "version" "1.0.30001447"

+"canvaskit-wasm@0.36.1":
+  "integrity" "sha512-6IHlBBc9zDQBTHiGuz4Rf0j/P/ulW24q/yW+QY517e7jwQoM0nJ1+L3h4wUpfC4eQrcpVPQY8ZFbqMbUCzDxTw=="
+  "resolved" "https://registry.npmjs.org/canvaskit-wasm/-/canvaskit-wasm-0.36.1.tgz"
+  "version" "0.36.1"
+
 "chalk@^2.0.0", "chalk@^2.0.1", "chalk@^2.4.2":
  "integrity" "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ=="
  "resolved" "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz"
@ -2574,7 +2630,7 @@
    "map-visit" "^1.0.0"
    "object-visit" "^1.0.0"

-"color-convert@^1.9.0":
+"color-convert@^1.9.0", "color-convert@^1.9.3":
  "integrity" "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg=="
  "resolved" "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz"
  "version" "1.9.3"
@ -2784,6 +2840,11 @@
  "resolved" "https://registry.npmjs.org/crypto-random-string/-/crypto-random-string-2.0.0.tgz"
  "version" "2.0.0"

+"css-font-parser@0.2.3":
+  "integrity" "sha512-QhdfNV+RjQLVg24d/ls4I8UrA/5WCeEfUmi1je8ISPr7RGZJXwWU2AwZpCiUmWuLZW7dKaB3ER0Bq1W9UhEUag=="
+  "resolved" "https://registry.npmjs.org/css-font-parser/-/css-font-parser-0.2.3.tgz"
+  "version" "0.2.3"
+
 "css-in-js-utils@^3.1.0":
  "integrity" "sha512-fJAcud6B3rRu+KHYk+Bwf+WFL2MDCJJ1XG9x137tJQ0xYxor7XziQtuGFbWNdqrvF4Tk26O3H73nfVqXt/fW1A=="
  "resolved" "https://registry.npmjs.org/css-in-js-utils/-/css-in-js-utils-3.1.0.tgz"
@ -2820,6 +2881,11 @@
  "resolved" "https://registry.npmjs.org/csstype/-/csstype-3.1.1.tgz"
  "version" "3.1.1"

+"ctx-polyfill@^1.1.4":
+  "integrity" "sha512-tz65F3/zmZ2+CMtn4MhNhYi/yIN9dKnItMKzSkH2GE6dBpAIbUR0K5pSHWqUL3OuNBCA70DKlWZYUClHfydIXg=="
+  "resolved" "https://registry.npmjs.org/ctx-polyfill/-/ctx-polyfill-1.1.4.tgz"
+  "version" "1.1.4"
+
 "dag-map@~1.0.0":
  "integrity" "sha512-+LSAiGFwQ9dRnRdOeaj7g47ZFJcOUPukAP8J3A3fuZ1g9Y44BG+P1sgApjLXTQPOzC4+7S9Wr8kXsfpINM4jpw=="
  "resolved" "https://registry.npmjs.org/dag-map/-/dag-map-1.0.2.tgz"
@ -2982,6 +3048,13 @@
  "resolved" "https://registry.npmjs.org/domelementtype/-/domelementtype-2.3.0.tgz"
  "version" "2.3.0"

+"domexception@1.0.1":
+  "integrity" "sha512-raigMkn7CJNNo6Ihro1fzG7wr3fHuYVytzquZKX5n0yizGsTcYgzdIUwj1X9pK0VvjeihV+XiclP+DjwbsSKug=="
+  "resolved" "https://registry.npmjs.org/domexception/-/domexception-1.0.1.tgz"
+  "version" "1.0.1"
+  dependencies:
+    "webidl-conversions" "^4.0.2"
+
 "domhandler@^5.0.1", "domhandler@^5.0.2":
  "integrity" "sha512-cgwlv/1iFQiFnU96XXgROh8xTeetsnJiDsTc7TYCLFd9+/WNkIqPTxiM/8pSd8VIrhXGTf1Ny1q1hquVqDJB5w=="
  "resolved" "https://registry.npmjs.org/domhandler/-/domhandler-5.0.3.tgz"
@ -2998,6 +3071,11 @@
    "domelementtype" "^2.3.0"
    "domhandler" "^5.0.1"

+"earcut@2.1.1":
+  "integrity" "sha512-+BGT9Mffq3Oxf2nDOtzaJDd9P8g/z3WNYGO84Q23hDBot5VU8DNGY73Vc94eVDvHjMyhonnuEg+DNwEQ6iZn3w=="
+  "resolved" "https://registry.npmjs.org/earcut/-/earcut-2.1.1.tgz"
+  "version" "2.1.1"
+
 "ee-first@1.1.1":
  "integrity" "sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow=="
  "resolved" "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz"
@ -3087,6 +3165,11 @@
  "resolved" "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz"
  "version" "4.0.0"

+"escape-string-regexp@2.0.0":
+  "integrity" "sha512-UpzcLCXolUWcNu5HtVMHYdXJjArjsF9C0aNnquZYY4uW/Vu0miy5YoWvbV345HauVvcAUnpRuhMMcqTcGOY2+w=="
+  "resolved" "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-2.0.0.tgz"
+  "version" "2.0.0"
+
 "esprima@^4.0.0", "esprima@~4.0.0":
  "integrity" "sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A=="
  "resolved" "https://registry.npmjs.org/esprima/-/esprima-4.0.1.tgz"
@ -3138,12 +3221,28 @@
    "snapdragon" "^0.8.1"
    "to-regex" "^3.0.1"

+"expo-2d-context@^0.0.3":
+  "integrity" "sha512-loO/cIj5owNXv0GJxEQ7Sm1vlGOYoJwHCaf2uiPKG3BZm+gQw6GnDgxN+2WDisNZKLTjnMLUGP1HhBsNnElt6g=="
+  "resolved" "https://registry.npmjs.org/expo-2d-context/-/expo-2d-context-0.0.3.tgz"
+  "version" "0.0.3"
+  dependencies:
+    "adaptive-bezier-curve" "1.0.3"
+    "adaptive-quadratic-curve" "1.0.2"
+    "color-convert" "^1.9.3"
+    "css-font-parser" "0.2.3"
+    "domexception" "1.0.1"
+    "earcut" "2.1.1"
+    "gl-matrix" "^2.4.0"
+    "parse-bmfont-ascii" "1.0.6"
+    "string-format" "0.5.0"
+    "tess2" "^1.0.0"
+
 "expo-application@~5.0.1":
  "integrity" "sha512-bThxK5zH/Lc2tkCvEXGjfM7ayvOVmPWYcWzXsMIU1RtG73TyXo4cq+73FvfDNIWn6gKS0WyMcmoPB3WXEV/jsw=="
  "resolved" "https://registry.npmjs.org/expo-application/-/expo-application-5.0.1.tgz"
  "version" "5.0.1"

-"expo-asset@~8.7.0":
+"expo-asset@*", "expo-asset@~8.7.0":
  "integrity" "sha512-lkoNsHK6vf+outISB6/37SonXcAL6Buw0ycjiwQVFfpOBKpkQa+zw5wm1m3KwjH2txmR3xdIzcpWsJkgovYCvQ=="
  "resolved" "https://registry.npmjs.org/expo-asset/-/expo-asset-8.7.0.tgz"
  "version" "8.7.0"
@ -3565,6 +3664,11 @@
  "resolved" "https://registry.npmjs.org/getenv/-/getenv-1.0.0.tgz"
  "version" "1.0.0"

+"gl-matrix@^2.4.0":
+  "integrity" "sha512-0YCjVpE3pS5XWlN3J4X7AiAx65+nqAI54LndtVFnQZB6G/FVLkZH8y8V6R3cIoOQR4pUdfwQGd1iwyoXHJ4Qfw=="
+  "resolved" "https://registry.npmjs.org/gl-matrix/-/gl-matrix-2.8.1.tgz"
+  "version" "2.8.1"
+
 "glob-parent@^5.1.2":
  "integrity" "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow=="
  "resolved" "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz"
@ -3701,6 +3805,13 @@
  dependencies:
    "source-map" "^0.7.3"

+"hoist-non-react-statics@^3.3.0":
+  "integrity" "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw=="
+  "resolved" "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz"
+  "version" "3.3.2"
+  dependencies:
+    "react-is" "^16.7.0"
+
 "hosted-git-info@^3.0.2":
  "integrity" "sha512-aXpmwoOhRBrw6X3j0h5RloK4x1OzsxMPyxqIHyNfSe2pypkVTZFpEiRoSipPEPlMrh0HW/XsjkJ5WgnCirpNUw=="
  "resolved" "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-3.0.8.tgz"
@ -3811,7 +3922,7 @@
    "default-gateway" "^4.2.0"
    "ipaddr.js" "^1.9.0"

-"invariant@^2.2.4":
+"invariant@^2.2.4", "invariant@2.2.4":
  "integrity" "sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA=="
  "resolved" "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz"
  "version" "2.2.4"
@ -4345,7 +4456,7 @@
  "resolved" "https://registry.npmjs.org/lodash.throttle/-/lodash.throttle-4.1.1.tgz"
  "version" "4.1.1"

-"lodash@^4.17.13", "lodash@^4.17.4":
+"lodash@^4.17.13", "lodash@^4.17.21", "lodash@^4.17.4":
  "integrity" "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
  "resolved" "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz"
  "version" "4.17.21"
@ -4374,7 +4485,7 @@
    "dayjs" "^1.8.15"
    "yargs" "^15.1.0"

-"loose-envify@^1.0.0", "loose-envify@^1.1.0", "loose-envify@^1.3.1":
+"loose-envify@^1.0.0", "loose-envify@^1.1.0", "loose-envify@^1.3.1", "loose-envify@^1.4.0":
  "integrity" "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q=="
  "resolved" "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz"
  "version" "1.4.0"
@ -5254,6 +5365,11 @@
  "resolved" "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz"
  "version" "2.2.0"

+"parse-bmfont-ascii@1.0.6":
+  "integrity" "sha512-U4RrVsUFCleIOBsIGYOMKjn9PavsGOXxbvYGtMOEfnId0SVNsgehXh1DxUdVPLoxd5mvcEtvmKs2Mmf0Mpa1ZA=="
+  "resolved" "https://registry.npmjs.org/parse-bmfont-ascii/-/parse-bmfont-ascii-1.0.6.tgz"
+  "version" "1.0.6"
+
 "parse-json@^4.0.0":
  "integrity" "sha512-aOIos8bujGN93/8Ox/jPLh7RwVnPEysynVFE+fQZyg6jKELEHwzgKdLRFHUgXJL6kylijVSBC4BvN9OmsB48Rw=="
  "resolved" "https://registry.npmjs.org/parse-json/-/parse-json-4.0.0.tgz"
@ -5322,6 +5438,11 @@
  "resolved" "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz"
  "version" "4.0.0"

+"perfect-freehand@^1.1.0":
+  "integrity" "sha512-h/0ikF1M3phW7CwpZ5MMvKnfpHficWoOEyr//KVNTxV4F6deRK1eYMtHyBKEAKFK0aXIEUK9oBvlF6PNXMDsAw=="
+  "resolved" "https://registry.npmjs.org/perfect-freehand/-/perfect-freehand-1.2.0.tgz"
+  "version" "1.2.0"
+
 "picocolors@^1.0.0":
  "integrity" "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ=="
  "resolved" "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz"
@ -5431,6 +5552,20 @@
    "kleur" "^3.0.3"
    "sisteransi" "^1.0.5"

+"prop-types@^15.7.2":
+  "integrity" "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg=="
+  "resolved" "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz"
+  "version" "15.8.1"
+  dependencies:
+    "loose-envify" "^1.4.0"
+    "object-assign" "^4.1.1"
+    "react-is" "^16.13.1"
+
+"proxy-compare@2.4.0":
+  "integrity" "sha512-FD8KmQUQD6Mfpd0hywCOzcon/dbkFP8XBd9F1ycbKtvVsfv6TsFUKJ2eC0Iz2y+KzlkdT1Z8SY6ZSgm07zOyqg=="
+  "resolved" "https://registry.npmjs.org/proxy-compare/-/proxy-compare-2.4.0.tgz"
+  "version" "2.4.0"
+
 "pump@^3.0.0":
  "integrity" "sha512-LwZy+p3SFs1Pytd/jYct4wpv49HiYCqd9Rlc5ZVdk0V+8Yzv6jR5Blk3TRmPL1ft69TxP0IMZGJ+WPFU2BFhww=="
  "resolved" "https://registry.npmjs.org/pump/-/pump-3.0.0.tgz"
@ -5527,6 +5662,23 @@
  "resolved" "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz"
  "version" "16.13.1"

+"react-is@^16.13.1":
+  "integrity" "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
+  "resolved" "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz"
+  "version" "16.13.1"
+
+"react-is@^16.7.0":
+  "integrity" "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
+  "resolved" "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz"
+  "version" "16.13.1"
+
+"react-native-canvas@^0.1.38":
+  "integrity" "sha512-DjtN921PKoa2liYF8hKq1263xg2o47Bj/1E/+l75GPicT2RV/x/Y1HBrLvFVCR3OO+UslXEC5BtRjfxDoh/Bug=="
+  "resolved" "https://registry.npmjs.org/react-native-canvas/-/react-native-canvas-0.1.38.tgz"
+  "version" "0.1.38"
+  dependencies:
+    "ctx-polyfill" "^1.1.4"
+
 "react-native-codegen@^0.70.6":
  "integrity" "sha512-kdwIhH2hi+cFnG5Nb8Ji2JwmcCxnaOOo9440ov7XDzSvGfmUStnCzl+MCW8jLjqHcE4icT7N9y+xx4f50vfBTw=="
  "resolved" "https://registry.npmjs.org/react-native-codegen/-/react-native-codegen-0.70.6.tgz"
@ -5542,6 +5694,17 @@
  "resolved" "https://registry.npmjs.org/react-native-feather/-/react-native-feather-1.1.2.tgz"
  "version" "1.1.2"

+"react-native-gesture-handler@^2.8.0", "react-native-gesture-handler@>=2.0.0":
+  "integrity" "sha512-poOSfz/w0IyD6Qwq7aaIRRfEaVTl1ecQFoyiIbpOpfNTjm2B1niY2FLrdVQIOtIOe+K9nH55Qal04nr4jGkHdQ=="
+  "resolved" "https://registry.npmjs.org/react-native-gesture-handler/-/react-native-gesture-handler-2.8.0.tgz"
+  "version" "2.8.0"
+  dependencies:
+    "@egjs/hammerjs" "^2.0.17"
+    "hoist-non-react-statics" "^3.3.0"
+    "invariant" "^2.2.4"
+    "lodash" "^4.17.21"
+    "prop-types" "^15.7.2"
+
 "react-native-gradle-plugin@^0.70.3":
  "integrity" "sha512-oOanj84fJEXUg9FoEAQomA8ISG+DVIrTZ3qF7m69VQUJyOGYyDZmPqKcjvRku4KXlEH6hWO9i4ACLzNBh8gC0A=="
  "resolved" "https://registry.npmjs.org/react-native-gradle-plugin/-/react-native-gradle-plugin-0.70.3.tgz"
@ -5560,7 +5723,7 @@
    "react-freeze" "^1.0.0"
    "warn-once" "^0.1.0"

-"react-native-svg@>=5.3", "react-native-svg@13.4.0":
+"react-native-svg@>=12.0.0", "react-native-svg@>=5.3", "react-native-svg@13.4.0":
  "integrity" "sha512-B3TwK+H0+JuRhYPzF21AgqMt4fjhCwDZ9QUtwNstT5XcslJBXC0FoTkdZo8IEb1Sv4suSqhZwlAY6lwOv3tHag=="
  "resolved" "https://registry.npmjs.org/react-native-svg/-/react-native-svg-13.4.0.tgz"
  "version" "13.4.0"
@ -5581,7 +5744,15 @@
    "postcss-value-parser" "^4.2.0"
    "styleq" "^0.1.2"

-"react-native@*", "react-native@>=0.46", "react-native@0.70.5":
+"react-native-webview@>=5.10.0 || >=6.1.0":
+  "integrity" "sha512-hC7BkxOpf+z0UKhxFSFTPAM4shQzYmZHoELa6/8a/MspcjEP7ukYKpuSUTLDywQditT8yI9idfcKvfZDKQExGw=="
+  "resolved" "https://registry.npmjs.org/react-native-webview/-/react-native-webview-11.26.1.tgz"
+  "version" "11.26.1"
+  dependencies:
+    "escape-string-regexp" "2.0.0"
+    "invariant" "2.2.4"
+
+"react-native@*", "react-native@>=0.46", "react-native@>=0.64", "react-native@0.70.5":
  "integrity" "sha512-5NZM80LC3L+TIgQX/09yiyy48S73wMgpIgN5cCv3XTMR394+KpDI3rBZGH4aIgWWuwijz31YYVF5504+9n2Zfw=="
  "resolved" "https://registry.npmjs.org/react-native/-/react-native-0.70.5.tgz"
  "version" "0.70.5"
@ -5619,6 +5790,14 @@
    "whatwg-fetch" "^3.0.0"
    "ws" "^6.1.4"

+"react-reconciler@^0.27.0":
+  "integrity" "sha512-HmMDKciQjYmBRGuuhIaKA1ba/7a+UsM5FzOZsMO2JYHt9Jh8reCb7j1eDC95NOyUlKM9KRyvdx0flBuDvYSBoA=="
+  "resolved" "https://registry.npmjs.org/react-reconciler/-/react-reconciler-0.27.0.tgz"
+  "version" "0.27.0"
+  dependencies:
+    "loose-envify" "^1.1.0"
+    "scheduler" "^0.21.0"
+
 "react-refresh@^0.4.0":
  "integrity" "sha512-Hwln1VNuGl/6bVwnd0Xdn1e84gT/8T9aYNL+HAKDArLCS7LWjwr7StE30IEYbIkx0Vi3vs+coQxe+SQDbGbbpA=="
  "resolved" "https://registry.npmjs.org/react-refresh/-/react-refresh-0.4.3.tgz"
@ -5632,7 +5811,7 @@
    "object-assign" "^4.1.1"
    "react-is" "^16.12.0 || ^17.0.0 || ^18.0.0"

-"react@*", "react@^16.0.0 || ^17.0.0 || ^18.0.0", "react@^16.8.0 || ^17.0.0 || ^18.0.0", "react@^17.0.2 || ^18.0.0", "react@^18.1.0", "react@>=17.0.0", "react@18.1.0":
+"react@*", "react@^16.0.0 || ^17.0.0 || ^18.0.0", "react@^16.8.0 || ^17.0.0 || ^18.0.0", "react@^17.0.2 || ^18.0.0", "react@^18.0.0", "react@^18.1.0", "react@>=16.8", "react@>=17.0.0", "react@>=18.0", "react@18.1.0":
  "integrity" "sha512-4oL8ivCz5ZEPyclFQXaNksK3adutVS8l2xzZU0cqEFrE9Sb7fC0EFK5uEk74wIreL1DERyjvsU915j1pcT2uEQ=="
  "resolved" "https://registry.npmjs.org/react/-/react-18.1.0.tgz"
  "version" "18.1.0"
@ -5871,6 +6050,14 @@
  dependencies:
    "glob" "^7.1.3"

+"rn-perfect-sketch-canvas@^0.3.0":
+  "integrity" "sha512-qK82NW1YjlKSK9oT3iGrPBYiEKkygVHGqVSupwTSbIJJ+SaRodQ2Td+QZ86inFcYQqJJ+EcpFzTpZ2Ln2+Zfow=="
+  "resolved" "https://registry.npmjs.org/rn-perfect-sketch-canvas/-/rn-perfect-sketch-canvas-0.3.0.tgz"
+  "version" "0.3.0"
+  dependencies:
+    "perfect-freehand" "^1.1.0"
+    "valtio" "^1.6.1"
+
 "run-parallel@^1.1.9":
  "integrity" "sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA=="
  "resolved" "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz"
@ -5905,6 +6092,13 @@
  "resolved" "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz"
  "version" "1.2.4"

+"scheduler@^0.21.0":
+  "integrity" "sha512-1r87x5fz9MXqswA2ERLo0EbOAU74DpIUO090gIasYTqlVoJeMcl+Z1Rg7WHz+qtPujhS/hGIt9kxZOYBV3faRQ=="
+  "resolved" "https://registry.npmjs.org/scheduler/-/scheduler-0.21.0.tgz"
+  "version" "0.21.0"
+  dependencies:
+    "loose-envify" "^1.1.0"
+
 "scheduler@^0.22.0":
  "integrity" "sha512-6QAm1BgQI88NPYymgGQLCZgvep4FyePDWFpXVK+zNSUgHwlqpJy8VEh8Et0KxTACS4VWwMousBElAZOH9nkkoQ=="
  "resolved" "https://registry.npmjs.org/scheduler/-/scheduler-0.22.0.tgz"
@ -6240,6 +6434,11 @@
  dependencies:
    "safe-buffer" "~5.1.0"

+"string-format@0.5.0":
+  "integrity" "sha512-c/CiKQMy7uuEzi+Tsvnn63/PQw/F7IOSLHNuQ44Eypd0x5VvFnDXMd2T9H0ntphv8nrHAKoZcINPb/yitOAB/g=="
+  "resolved" "https://registry.npmjs.org/string-format/-/string-format-0.5.0.tgz"
+  "version" "0.5.0"
+
 "string-width@^4.1.0", "string-width@^4.2.0":
  "integrity" "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g=="
  "resolved" "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz"
@ -6423,6 +6622,11 @@
    "ansi-escapes" "^4.2.1"
    "supports-hyperlinks" "^2.0.0"

+"tess2@^1.0.0":
+  "integrity" "sha512-iSWBSOUoPn3cCT26L5Wi6mvVgL11RV4kReSnVIIPdMN7qNpkL5SLKen5BJcWj+ZTN7kK6JrHBdqTV7vvL8g+9w=="
+  "resolved" "https://registry.npmjs.org/tess2/-/tess2-1.0.0.tgz"
+  "version" "1.0.0"
+
 "text-table@^0.2.0":
  "integrity" "sha512-N+8UisAXDGk8PFXP4HAzVR9nbfmVJ3zYLAWiTIoqC5v5isinhr+r5uaO8+7r3BMfuNIufIsA7RdpVgacC2cSpw=="
  "resolved" "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz"
@ -6705,7 +6909,7 @@
  "resolved" "https://registry.npmjs.org/use-latest-callback/-/use-latest-callback-0.1.5.tgz"
  "version" "0.1.5"

-"use-sync-external-store@^1.0.0":
+"use-sync-external-store@^1.0.0", "use-sync-external-store@1.2.0":
  "integrity" "sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA=="
  "resolved" "https://registry.npmjs.org/use-sync-external-store/-/use-sync-external-store-1.2.0.tgz"
  "version" "1.2.0"
@ -6757,6 +6961,14 @@
  dependencies:
    "builtins" "^1.0.3"

+"valtio@^1.6.1":
+  "integrity" "sha512-mQLFsAlKbYascZygFQh6lXuDjU5WHLoeZ8He4HqMnWfasM96V6rDbeFkw1XeG54xycmDonr/Jb4xgviHtuySrA=="
+  "resolved" "https://registry.npmjs.org/valtio/-/valtio-1.9.0.tgz"
+  "version" "1.9.0"
+  dependencies:
+    "proxy-compare" "2.4.0"
+    "use-sync-external-store" "1.2.0"
+
 "vary@~1.1.2":
  "integrity" "sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg=="
  "resolved" "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz"
@ -6791,6 +7003,11 @@
  "resolved" "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-3.0.1.tgz"
  "version" "3.0.1"

+"webidl-conversions@^4.0.2":
+  "integrity" "sha512-YQ+BmxuTgd6UXZW3+ICGfyqRyHXVlD5GtQr5+qjiNW7bF0cqrzX500HVXPBOvgXb5YnzDd+h0zqyv61KUD7+Sg=="
+  "resolved" "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-4.0.2.tgz"
+  "version" "4.0.2"
+
 "whatwg-fetch@^3.0.0":
  "integrity" "sha512-bJlen0FcuU/0EMLrdbJ7zOnW6ITZLrZMIarMUVmdKtsGvZna8vxKYaexICWPfZ8qwf9fzNq+UEIZrnSaApt6RA=="
  "resolved" "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-3.6.2.tgz"