fix: upgrades for expo

Author: RichardLindhout

README.md

@@ -354,8 +354,11 @@ If that is **not possible** use the following props on the surrounding ScrollVie
 This is to prevent the need to press 2 times before save or close button in modal works (1 press for closing keyboard, 1 press for confirm/close)
 [React Native Issue: #10138](https://github.com/facebook/react-native/issues/10138)
 
+
+
 ## Android Caveats
 We recommend Hermes with React Native >= 0.66 you won't need these polyfills at all!
+
 ### Below React Native 0.66
 You will need to add a polyfill for the Intl API on Android if:
 

example/app.json

@@ -12,8 +12,10 @@
       "android",
       "web"
     ],
+    "jsEngine": "hermes",
     "ios": {
-      "supportsTablet": true
+      "supportsTablet": true,
+      "jsEngine": "jsc"
     },
     "assetBundlePatterns": [
       "**/*"

example/metro.config.js

@@ -1,5 +1,5 @@
 const path = require('path')
-const blacklist = require('metro-config/src/defaults/blacklist')
+const exclusionList = require('metro-config/src/defaults/exclusionList')
 const escape = require('escape-string-regexp')
 const pak = require('../package.json')
 
@@ -16,7 +16,7 @@ module.exports = {
   // We need to make sure that only one version is loaded for peerDependencies
   // So we blacklist them at the root, and alias them to the versions in example's node_modules
   resolver: {
-    blacklistRE: blacklist(
+    blacklistRE: exclusionList(
       modules.map(
         (m) =>
           new RegExp(`^${escape(path.join(root, 'node_modules', m))}\\/.*$`)

example/package.json

@@ -12,20 +12,19 @@
     "test": "jest"
   },
   "dependencies": {
-    "expo": "^40.0.0",
-    "expo-splash-screen": "~0.8.1",
-    "react": "16.13.1",
-    "react-dom": "16.13.1",
-    "react-native": "0.63.4",
-    "react-native-paper": "^4.9.1",
-    "react-native-unimodules": "~0.12.0",
-    "react-native-web": "~0.14.9"
+    "expo": "^44.0.0",
+    "expo-splash-screen": "~0.14.1",
+    "react": "17.0.1",
+    "react-dom": "17.0.1",
+    "react-native": "^0.66.4",
+    "react-native-paper": "^4.11.1",
+    "react-native-web": "^0.17.5"
   },
   "devDependencies": {
-    "@babel/core": "~7.12.10",
+    "@babel/core": "^7.12.9",
     "@babel/runtime": "^7.9.6",
     "babel-plugin-module-resolver": "^4.0.0",
-    "babel-preset-expo": "8.3.0",
-    "expo-cli": "^4.0.13"
+    "babel-preset-expo": "9.0.1",
+    "expo-cli": "^5.0.3"
   }
 }

example/src/App.tsx

@@ -198,9 +198,7 @@ function App() {
                 value={inputDate}
                 onChange={setInputDate}
                 inputMode="start"
-                // FIXME : remove the ts error
-                // @ts-ignore
-                autoCompleteType={'birthdate-full'}
+                autoComplete={'birthdate-full'}
               />
             </Row>
             <Row>

example/src/ReadMeExampleDatePickerInput.tsx

@@ -13,7 +13,7 @@ export default function ReadMeExampleDatePickerInput() {
         value={inputDate}
         onChange={(d) => setInputDate(d)}
         inputMode="start"
-        autoCompleteType="birthdate-full"
+        autoComplete="birthdate-full"
         // mode="outlined" (see react-native-paper docs)
         // other react native TextInput props
       />

example/tsconfig.json

@@ -12,5 +12,6 @@
     "resolveJsonModule": true,
     "esModuleInterop": true,
     "moduleResolution": "node"
-  }
+  },
+  "extends": "expo/tsconfig.base"
 }

example/yarn.lock

@@ -54,10 +54,12 @@
     "@types/jest": "^26.0.24",
     "@types/react": "^16.14.20",
     "@types/react-native": "^0.66.1",
+    "babel-loader": "^8.2.3",
     "commitlint": "^11.0.0",
     "eslint": "^7.32.0",
     "eslint-config-prettier": "^8.3.0",
     "eslint-plugin-prettier": "^4.0.0",
+    "expo-cli": "^5.0.3",
     "husky": "^4.2.5",
     "jest": "^26.0.1",
     "pod-install": "^0.1.28",

package.json

@@ -88,7 +88,7 @@ function CalendarEdit({
             validRange={validRange}
             locale={locale}
             withModal={false}
-            autoCompleteType={'off'}
+            autoComplete={'off'}
           />
         ) : null}
         {mode === 'range' ? (
@@ -104,7 +104,7 @@ function CalendarEdit({
               validRange={validRange}
               locale={locale}
               withModal={false}
-              autoCompleteType={'off'}
+              autoComplete={'off'}
             />
             <View style={styles.separator} />
             <DatePickerInput
@@ -117,7 +117,7 @@ function CalendarEdit({
               validRange={validRange}
               locale={locale}
               withModal={false}
-              autoCompleteType={'off'}
+              autoComplete="off"
             />
           </>
         ) : null}