From 6b0c632b9688bbc833644fa8ed4093b7266ad708 Mon Sep 17 00:00:00 2001 From: "paolo.pecis" Date: Thu, 30 Apr 2020 15:47:19 +0200 Subject: [PATCH] Add RN Hide Focus --- HideFocus/RNHideFocus/App.js | 67 +++++---- HideFocus/RNHideFocus/package-lock.json | 180 ++++++++++++++++++++++++ HideFocus/RNHideFocus/package.json | 10 +- 3 files changed, 226 insertions(+), 31 deletions(-) diff --git a/HideFocus/RNHideFocus/App.js b/HideFocus/RNHideFocus/App.js index 40fdd635..7ba85f72 100644 --- a/HideFocus/RNHideFocus/App.js +++ b/HideFocus/RNHideFocus/App.js @@ -1,6 +1,8 @@ +import 'react-native-gesture-handler'; import React from 'react'; import { StyleSheet, Text, View, TouchableOpacity, Body, Header, Title } from 'react-native'; + function changeText(){ console.log("PIPPO"); } @@ -15,48 +17,41 @@ export default class App extends React.Component{ hideFocus(){ console.log("Button clicked") - this.setState({accessible:false, buttonText:"I am no more focusable"}) + this.setState({accessible:false, buttonText:"BUTTON 2: I am no more focusable"}) } render(){ return ( - - - - - this.hideFocus()} > - press to hide BUTTON 2 focus - + <> + + RNChangeFocus + - - - {this.state.buttonText} - - + + this.hideFocus()} > + Press to make BUTTON 2 unfocusable + + + + + + BUTTON 1 + + + + + + {this.state.buttonText} + + - - - BUTTON 3 - - - + ); } } -function App2() { - return ( - - SSSSSSSOpen up App.js tsasddso start working on your app!AAAAAAAAA - - Press to change focus to BUTTON 3 - - - ); -} - const styles = StyleSheet.create({ container: { flex: 1, @@ -70,4 +65,16 @@ const styles = StyleSheet.create({ padding: 10, marginBottom: 20, }, + + header: { + backgroundColor: '#008577', + paddingHorizontal: 20, + paddingVertical: 20, + marginTop: 20, + }, + headerText: { + color: 'white', + }, + + }); diff --git a/HideFocus/RNHideFocus/package-lock.json b/HideFocus/RNHideFocus/package-lock.json index 225ac198..bf54ce07 100644 --- a/HideFocus/RNHideFocus/package-lock.json +++ b/HideFocus/RNHideFocus/package-lock.json @@ -1036,6 +1036,14 @@ "minimist": "^1.2.0" } }, + "@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/vector-icons": { "version": "10.1.0", "resolved": "https://registry.npmjs.org/@expo/vector-icons/-/vector-icons-10.1.0.tgz", @@ -1220,6 +1228,71 @@ "resolved": "https://registry.npmjs.org/@react-native-community/cli-types/-/cli-types-3.0.0.tgz", "integrity": "sha512-ng6Tm537E/M42GjE4TRUxQyL8sRfClcL7bQWblOCoxPZzJ2J3bdALsjeG3vDnVCIfI/R0AeFalN9KjMt0+Z/Zg==" }, + "@react-native-community/masked-view": { + "version": "0.1.6", + "resolved": "https://registry.npmjs.org/@react-native-community/masked-view/-/masked-view-0.1.6.tgz", + "integrity": "sha512-PpMoeXwPUoldCRKDuSi+zK5rT+sJTW6ri6RdGPkSKRzU77Q1d9IaR0O5IKvBj0XSdL3p+dcOa05gk35aGDffBQ==" + }, + "@react-navigation/core": { + "version": "5.3.5", + "resolved": "https://registry.npmjs.org/@react-navigation/core/-/core-5.3.5.tgz", + "integrity": "sha512-s+XL+2r/NS9e0/kcRCBJ2NV7+3zqAqLXFHX2+qzES++oc+gb5A8JSrHjwRUwxMqR2AOqSfz5HSyYXnYIwgl4JQ==", + "requires": { + "@react-navigation/routers": "^5.4.1", + "escape-string-regexp": "^2.0.0", + "nanoid": "^3.0.2", + "query-string": "^6.12.0", + "react-is": "^16.13.0", + "use-subscription": "^1.4.0" + }, + "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==" + }, + "query-string": { + "version": "6.12.1", + "resolved": "https://registry.npmjs.org/query-string/-/query-string-6.12.1.tgz", + "integrity": "sha512-OHj+zzfRMyj3rmo/6G8a5Ifvw3AleL/EbcHMD27YA31Q+cO5lfmQxECkImuNVjcskLcvBRVHNAB3w6udMs1eAA==", + "requires": { + "decode-uri-component": "^0.2.0", + "split-on-first": "^1.0.0", + "strict-uri-encode": "^2.0.0" + } + }, + "strict-uri-encode": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-2.0.0.tgz", + "integrity": "sha1-ucczDHBChi9rFC3CdLvMWGbONUY=" + } + } + }, + "@react-navigation/native": { + "version": "5.1.7", + "resolved": "https://registry.npmjs.org/@react-navigation/native/-/native-5.1.7.tgz", + "integrity": "sha512-0/TWbeorcLb42AN9KYK4rWzZk3RrpX95vIuqzcI5zPlo/Yhs3h+TEXX1s+6n2MT42W8xHPZzK/RaHnBGKD0aLw==", + "requires": { + "@react-navigation/core": "^5.3.5" + } + }, + "@react-navigation/routers": { + "version": "5.4.1", + "resolved": "https://registry.npmjs.org/@react-navigation/routers/-/routers-5.4.1.tgz", + "integrity": "sha512-Gay9yCrE2xuvUUJcbG+giqnh2ZAPyYecO5RJ3tXDztmT+UaJoyHLSfyjkb74gSjij684udtzUKkoXGBbgcANhg==", + "requires": { + "nanoid": "^3.0.2" + } + }, + "@react-navigation/stack": { + "version": "5.2.14", + "resolved": "https://registry.npmjs.org/@react-navigation/stack/-/stack-5.2.14.tgz", + "integrity": "sha512-hVzkqcAXPrZ10Gjtlzl8+Ad9x1p0n0Vn2YTff4xSlZkVVgKcHyTAWg59NL93fvq9T1zJXOCJZ0hoHiFMmNmAlA==", + "requires": { + "color": "^3.1.2", + "react-native-iphone-x-helper": "^1.2.1" + } + }, "@types/color-name": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/@types/color-name/-/color-name-1.1.1.tgz", @@ -1230,6 +1303,11 @@ "resolved": "https://registry.npmjs.org/@types/fbemitter/-/fbemitter-2.0.32.tgz", "integrity": "sha1-jtIE2g9U6cjq7DGx7skeJRMtCCw=" }, + "@types/hammerjs": { + "version": "2.0.36", + "resolved": "https://registry.npmjs.org/@types/hammerjs/-/hammerjs-2.0.36.tgz", + "integrity": "sha512-7TUK/k2/QGpEAv/BCwSHlYu3NXZhQ9ZwBYpzr9tjlPIL2C5BeGhH3DmVavRx3ZNyELX5TLC91JTz/cen6AAtIQ==" + }, "@types/invariant": { "version": "2.2.32", "resolved": "https://registry.npmjs.org/@types/invariant/-/invariant-2.2.32.tgz", @@ -1957,6 +2035,15 @@ "object-visit": "^1.0.0" } }, + "color": { + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/color/-/color-3.1.2.tgz", + "integrity": "sha512-vXTJhHebByxZn3lDvDJYw4lR5+uB3vuoHsuYA5AKuxRVn5wzzIfQKGLBmgdVRHKTJYeK5rvJcHnrd0Li49CFpg==", + "requires": { + "color-convert": "^1.9.1", + "color-string": "^1.5.2" + } + }, "color-convert": { "version": "1.9.3", "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz", @@ -1970,6 +2057,15 @@ "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz", "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=" }, + "color-string": { + "version": "1.5.3", + "resolved": "https://registry.npmjs.org/color-string/-/color-string-1.5.3.tgz", + "integrity": "sha512-dC2C5qeWoYkxki5UAXapdjqO672AM4vZuPGRQfO8b5HKuKGBbKWpITyDYN7TOFKvRW7kOgAn3746clDBMDJyQw==", + "requires": { + "color-name": "^1.0.0", + "simple-swizzle": "^0.2.2" + } + }, "color-support": { "version": "1.1.3", "resolved": "https://registry.npmjs.org/color-support/-/color-support-1.1.3.tgz", @@ -3469,6 +3565,11 @@ "resolved": "https://registry.npmjs.org/hermes-engine/-/hermes-engine-0.2.1.tgz", "integrity": "sha512-eNHUQHuadDMJARpaqvlCZoK/Nitpj6oywq3vQ3wCwEsww5morX34mW5PmKWQTO7aU0ck0hgulxR+EVDlXygGxQ==" }, + "hoist-non-react-statics": { + "version": "2.5.5", + "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz", + "integrity": "sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw==" + }, "hosted-git-info": { "version": "2.8.8", "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.8.8.tgz", @@ -4694,6 +4795,11 @@ "integrity": "sha512-isWHgVjnFjh2x2yuJ/tj3JbwoHu3UC2dX5G/88Cm24yB6YopVgxvBObDY7n5xW6ExmFhJpSEQqFPvq9zaXc8Jw==", "optional": true }, + "nanoid": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.3.tgz", + "integrity": "sha512-Zw8rTOUfh6FlKgkEbHiB1buOF2zOPOQyGirABUWn+9Z7m9PpyoLVkh6Ksc53vBjndINQ2+9LfRPaHxb/u45EGg==" + }, "nanomatch": { "version": "1.2.13", "resolved": "https://registry.npmjs.org/nanomatch/-/nanomatch-1.2.13.tgz", @@ -5621,6 +5727,43 @@ } } }, + "react-native-gesture-handler": { + "version": "1.6.1", + "resolved": "https://registry.npmjs.org/react-native-gesture-handler/-/react-native-gesture-handler-1.6.1.tgz", + "integrity": "sha512-gQgIKhDiYf754yzhhliagLuLupvGb6ZyBdzYzr7aus3Fyi87TLOw63ers+r4kGw0h26oAWTAdHd34JnF4NeL6Q==", + "requires": { + "@egjs/hammerjs": "^2.0.17", + "hoist-non-react-statics": "^2.3.1", + "invariant": "^2.2.4", + "prop-types": "^15.7.2" + } + }, + "react-native-iphone-x-helper": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/react-native-iphone-x-helper/-/react-native-iphone-x-helper-1.2.1.tgz", + "integrity": "sha512-/VbpIEp8tSNNHIvstuA3Swx610whci1Zpc9mqNkqn14DkMbw+ORviln2u0XyHG1kPvvwTNGZY6QpeFwxYaSdbQ==" + }, + "react-native-reanimated": { + "version": "1.7.1", + "resolved": "https://registry.npmjs.org/react-native-reanimated/-/react-native-reanimated-1.7.1.tgz", + "integrity": "sha512-aBwhoQdH4shkeTPbi7vKcAwYOzBp/6zElEKuIOgby11TceoM7y5SgNImC3HbDWWld3QV2PA2AgQGwAy51WgF3Q==", + "requires": { + "fbjs": "^1.0.0" + } + }, + "react-native-safe-area-context": { + "version": "0.7.3", + "resolved": "https://registry.npmjs.org/react-native-safe-area-context/-/react-native-safe-area-context-0.7.3.tgz", + "integrity": "sha512-9Uqu1vlXPi+2cKW/CW6OnHxA76mWC4kF3wvlqzq4DY8hn37AeiXtLFs2WkxH4yXQRrnJdP6ivc65Lz+MqwRZAA==" + }, + "react-native-screens": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/react-native-screens/-/react-native-screens-2.2.0.tgz", + "integrity": "sha512-a0VzxOWot7F9B/GQyDSssBRd3jUJazFnTQS61IiyReWB6aHlFhf3Xz10jBRoURXy1EMCDCHgenmTVTkKHpKyqQ==", + "requires": { + "debounce": "^1.2.0" + } + }, "react-native-view-shot": { "version": "3.1.2", "resolved": "https://registry.npmjs.org/react-native-view-shot/-/react-native-view-shot-3.1.2.tgz", @@ -5643,6 +5786,15 @@ "react-timer-mixin": "^0.13.4" } }, + "react-navigation-stack": { + "version": "2.3.13", + "resolved": "https://registry.npmjs.org/react-navigation-stack/-/react-navigation-stack-2.3.13.tgz", + "integrity": "sha512-WOfrkDnTaGeVU+8+Fm5WHvovN/9o1jHADcOBBGgNN6T8XsYwtGHPr5eQbe77LKYXQ/gX3pcGiOVG3WSBDHzH+w==", + "requires": { + "color": "^3.1.2", + "react-native-iphone-x-helper": "^1.2.1" + } + }, "react-refresh": { "version": "0.4.2", "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.4.2.tgz", @@ -6052,6 +6204,21 @@ "plist": "^3.0.1" } }, + "simple-swizzle": { + "version": "0.2.2", + "resolved": "https://registry.npmjs.org/simple-swizzle/-/simple-swizzle-0.2.2.tgz", + "integrity": "sha1-pNprY1/8zMoz9w0Xy5JZLeleVXo=", + "requires": { + "is-arrayish": "^0.3.1" + }, + "dependencies": { + "is-arrayish": { + "version": "0.3.2", + "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.3.2.tgz", + "integrity": "sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ==" + } + } + }, "slash": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/slash/-/slash-2.0.0.tgz", @@ -6256,6 +6423,11 @@ "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-3.0.5.tgz", "integrity": "sha512-J+FWzZoynJEXGphVIS+XEh3kFSjZX/1i9gFBaWQcB+/tmpe2qUsSBABpcxqxnAxFdiUFEgAX1bjYGQvIZmoz9Q==" }, + "split-on-first": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/split-on-first/-/split-on-first-1.1.0.tgz", + "integrity": "sha512-43ZssAJaMusuKWL8sKUBQXHWOpq8d6CfN/u1p4gUzfJkM05C8rxTmYrkIPTXapZpORA6LkkzcUulJ8FqA7Uudw==" + }, "split-string": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/split-string/-/split-string-3.1.0.tgz", @@ -6688,6 +6860,14 @@ "resolved": "https://registry.npmjs.org/use/-/use-3.1.1.tgz", "integrity": "sha512-cwESVXlO3url9YWlFW/TA9cshCEhtu7IKJ/p5soJ/gGpj7vbvFrAY/eIioQ6Dw23KjZhYgiIo8HOs1nQ2vr/oQ==" }, + "use-subscription": { + "version": "1.4.1", + "resolved": "https://registry.npmjs.org/use-subscription/-/use-subscription-1.4.1.tgz", + "integrity": "sha512-7+IIwDG/4JICrWHL/Q/ZPK5yozEnvRm6vHImu0LKwQlmWGKeiF7mbAenLlK/cTNXrTtXHU/SFASQHzB6+oSJMQ==", + "requires": { + "object-assign": "^4.1.1" + } + }, "util-deprecate": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz", diff --git a/HideFocus/RNHideFocus/package.json b/HideFocus/RNHideFocus/package.json index 3299f4cd..d5c14df9 100644 --- a/HideFocus/RNHideFocus/package.json +++ b/HideFocus/RNHideFocus/package.json @@ -8,11 +8,19 @@ "eject": "expo eject" }, "dependencies": { + "@react-native-community/masked-view": "^0.1.6", + "@react-navigation/native": "^5.1.7", + "@react-navigation/stack": "^5.2.14", "expo": "~37.0.3", "react": "~16.9.0", "react-dom": "~16.9.0", "react-native": "https://github.com/expo/react-native/archive/sdk-37.0.1.tar.gz", - "react-native-web": "~0.11.7" + "react-native-gesture-handler": "~1.6.0", + "react-native-reanimated": "~1.7.0", + "react-native-safe-area-context": "^0.7.3", + "react-native-screens": "~2.2.0", + "react-native-web": "~0.11.7", + "react-navigation-stack": "^2.3.13" }, "devDependencies": { "babel-preset-expo": "~8.1.0", -- 2.18.1