Upgrade to typescript 4

package.json

@@ -7,10 +7,18 @@
   "sideEffects": false,
   "files": [
     "lib/",
-    "esm/"
+    "esm/",
+    "ts4.1/"
   ],
   "types": "lib/index.d.ts",
   "typings": "lib/index.d.ts",
+  "typesVersions": {
+    ">=4.0": {
+      "*": [
+        "ts4.1/*"
+      ]
+    }
+  },
   "scripts": {
     "start": "yarn storybook",
     "test": "jest --maxWorkers 2",
@@ -23,7 +31,8 @@
     "build:cjs": "tsc",
     "build:es": "tsc -m esNext --outDir esm",
     "build": "yarn build:cjs && yarn build:es",
-    "clean": "rimraf lib storybook-static esm",
+    "postbuild": "node scripts/backportTypes.js",
+    "clean": "rimraf lib storybook-static esm ts4.1",
     "storybook": "start-storybook -p 6008",
     "storybook:build": "build-storybook",
     "storybook:upload": "gh-pages -d storybook-static --git \"$(which git)\"",
@@ -100,12 +109,14 @@
     "eslint-plugin-react-hooks": "4.2.0",
     "fork-ts-checker-webpack-plugin": "5.2.1",
     "gh-pages": "3.1.0",
+    "glob": "^7.1.6",
     "husky": "4.3.7",
     "jest": "26.6.3",
     "jest-localstorage-mock": "2.4.6",
     "keyboardjs": "2.6.4",
     "lint-staged": "10.5.3",
     "markdown-loader": "5.1.0",
+    "mkdirp": "^1.0.4",
     "prettier": "2.2.1",
     "raf-stub": "3.0.0",
     "react": "16.14.0",
@@ -122,7 +133,7 @@
     "ts-jest": "26.4.4",
     "ts-loader": "8.0.14",
     "ts-node": "9.1.1",
-    "typescript": "3.9.7"
+    "typescript": "4.1.3"
   },
   "config": {
     "commitizen": {

scripts/backportTypes.js

@@ -0,0 +1,66 @@
+const fs = require("fs");
+const path = require("path");
+const glob = require("glob");
+const mkdirp = require("mkdirp");
+
+const VERSION_DIRNAME = "ts4.1";
+const DEST_DIRS = "esm|lib";
+
+glob(`./+(${DEST_DIRS})/**/*.d.ts`, (err, files) => {
+  if (err) {
+    throw err;
+  }
+  Promise.all(files.map(filePath => copyFile(filePath, path.resolve(VERSION_DIRNAME, filePath)))).then(result => {
+    console.log(`Successfuly copied ${result.length} files to ${VERSION_DIRNAME}.`);
+
+    console.log("Patching original useGeolocation.d.ts files.");
+    glob(`./+(${DEST_DIRS})/useGeolocation.d.ts`, (err, files) => {
+      if (err) {
+        throw err;
+      }
+      return Promise.all(
+        files.map(
+          filePath =>
+            new Promise((resolve, reject) => {
+              fs.readFile(filePath, (err, content) => {
+                if (err) {
+                  reject(err);
+                } else {
+                  const contentString = `${content}`;
+                  console.log(`Patching ${filePath} to be compatible with TypeScript < 4.0`);
+
+                  const newContent = contentString.replace("GeolocationPositionError", "PositionError");
+
+                  fs.writeFile(filePath, newContent, err => {
+                    if (err) {
+                      reject(err);
+                    } else {
+                      console.log(`Sucessfully patched ${filePath}`);
+                      resolve(filePath);
+                    }
+                  });
+                }
+              });
+            })
+        )
+      );
+    });
+  });
+});
+
+/**
+ * Safely copies a file from filePath to dest.
+ */
+
+async function copyFile(filePath, dest) {
+  await mkdirp(path.dirname(dest));
+  return new Promise((resolve, reject) =>
+    fs.copyFile(filePath, dest, err => {
+      if (err) {
+        reject(err);
+      } else {
+        resolve(dest);
+      }
+    })
+  );
+}

src/useFullscreen.ts

@@ -45,9 +45,9 @@ const useFullscreen = (ref: RefObject<Element>, on: boolean, options: FullScreen
         setIsFullscreen(false);
       }
       screenfull.on('change', onChange);
-    } else if (video && video.current && video.current.webkitEnterFullscreen) {
-      video.current.webkitEnterFullscreen();
-      video.current.addEventListener('webkitendfullscreen', onWebkitEndFullscreen);
+    } else if (video && video.current && 'webkitEnterFullscreen' in video.current) {
+      (video.current as any).webkitEnterFullscreen();
+      (video.current as any).addEventListener('webkitendfullscreen', onWebkitEndFullscreen);
       setIsFullscreen(true);
     } else {
       onClose();
@@ -61,9 +61,9 @@ const useFullscreen = (ref: RefObject<Element>, on: boolean, options: FullScreen
           screenfull.off('change', onChange);
           screenfull.exit();
         } catch {}
-      } else if (video && video.current && video.current.webkitExitFullscreen) {
-        video.current.removeEventListener('webkitendfullscreen', onWebkitEndFullscreen);
-        video.current.webkitExitFullscreen();
+      } else if (video && video.current && 'webkitExitFullscreen' in video.current) {
+        (video.current as any).removeEventListener('webkitendfullscreen', onWebkitEndFullscreen);
+        (video.current as any).webkitExitFullscreen();
       }
     };
   }, [on, video, ref]);

src/useGeolocation.ts

@@ -10,7 +10,7 @@ export interface GeoLocationSensorState {
   longitude: number | null;
   speed: number | null;
   timestamp: number | null;
-  error?: Error | PositionError;
+  error?: Error | GeolocationPositionError;
 }
 
 const useGeolocation = (options?: PositionOptions): GeoLocationSensorState => {
@@ -43,7 +43,7 @@ const useGeolocation = (options?: PositionOptions): GeoLocationSensorState => {
       });
     }
   };
-  const onEventError = (error: PositionError) =>
+  const onEventError = (error: GeolocationPositionError) =>
     mounted && setState((oldState) => ({ ...oldState, loading: false, error }));
 
   useEffect(() => {

src/useMultiStateValidator.ts

@@ -7,7 +7,7 @@ export type MultiStateValidator<V extends ValidityState, S extends MultiStateVal
 export function useMultiStateValidator<V extends ValidityState, S extends MultiStateValidatorStates, I extends V>(
   states: S,
   validator: MultiStateValidator<V, S>,
-  initialValidity: I = [undefined] as I
+  initialValidity: I = ([undefined] as unknown) as I
 ): UseStateValidatorReturn<V> {
   if (typeof states !== 'object') {
     throw new Error('states expected to be an object or array, got ' + typeof states);

src/useStateValidator.ts

@@ -13,7 +13,7 @@ export type UseStateValidatorReturn<V> = [V, () => void];
 export default function useStateValidator<V extends ValidityState, S, I extends V>(
   state: S,
   validator: StateValidator<V, S>,
-  initialState: I = [undefined] as I
+  initialState: I = ([undefined] as unknown) as I
 ): UseStateValidatorReturn<V> {
   const validatorInner = useRef(validator);
   const stateInner = useRef(state);

yarn.lock

@@ -6525,7 +6525,7 @@ debug@^4.2.0:
   dependencies:
     ms "2.1.2"
 
-debuglog@*, debuglog@^1.0.1:
+debuglog@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/debuglog/-/debuglog-1.0.1.tgz#aa24ffb9ac3df9a2351837cfb2d279360cd78492"
   integrity sha1-qiT/uaw9+aI1GDfPstJ5NgzXhJI=
@@ -9266,7 +9266,7 @@ import-local@^3.0.2:
     pkg-dir "^4.2.0"
     resolve-cwd "^3.0.0"
 
-imurmurhash@*, imurmurhash@^0.1.4:
+imurmurhash@^0.1.4:
   version "0.1.4"
   resolved "https://registry.yarnpkg.com/imurmurhash/-/imurmurhash-0.1.4.tgz#9218b9b2b928a238b13dc4fb6b6d576f231453ea"
   integrity sha1-khi5srkoojixPcT7a21XbyMUU+o=
@@ -10984,11 +10984,6 @@ lockfile@^1.0.4:
   dependencies:
     signal-exit "^3.0.2"
 
-lodash._baseindexof@*:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/lodash._baseindexof/-/lodash._baseindexof-3.1.0.tgz#fe52b53a1c6761e42618d654e4a25789ed61822c"
-  integrity sha1-/lK1OhxnYeQmGNZU5KJXie1hgiw=
-
 lodash._baseuniq@~4.6.0:
   version "4.6.0"
   resolved "https://registry.yarnpkg.com/lodash._baseuniq/-/lodash._baseuniq-4.6.0.tgz#0ebb44e456814af7905c6212fa2c9b2d51b841e8"
@@ -10997,33 +10992,11 @@ lodash._baseuniq@~4.6.0:
     lodash._createset "~4.0.0"
     lodash._root "~3.0.0"
 
-lodash._bindcallback@*:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/lodash._bindcallback/-/lodash._bindcallback-3.0.1.tgz#e531c27644cf8b57a99e17ed95b35c748789392e"
-  integrity sha1-5THCdkTPi1epnhftlbNcdIeJOS4=
-
-lodash._cacheindexof@*:
-  version "3.0.2"
-  resolved "https://registry.yarnpkg.com/lodash._cacheindexof/-/lodash._cacheindexof-3.0.2.tgz#3dc69ac82498d2ee5e3ce56091bafd2adc7bde92"
-  integrity sha1-PcaayCSY0u5ePOVgkbr9Ktx73pI=
-
-lodash._createcache@*:
-  version "3.1.2"
-  resolved "https://registry.yarnpkg.com/lodash._createcache/-/lodash._createcache-3.1.2.tgz#56d6a064017625e79ebca6b8018e17440bdcf093"
-  integrity sha1-VtagZAF2JeeevKa4AY4XRAvc8JM=
-  dependencies:
-    lodash._getnative "^3.0.0"
-
 lodash._createset@~4.0.0:
   version "4.0.3"
   resolved "https://registry.yarnpkg.com/lodash._createset/-/lodash._createset-4.0.3.tgz#0f4659fbb09d75194fa9e2b88a6644d363c9fe26"
   integrity sha1-D0ZZ+7CddRlPqeK4imZE02PJ/iY=
 
-lodash._getnative@*, lodash._getnative@^3.0.0:
-  version "3.9.1"
-  resolved "https://registry.yarnpkg.com/lodash._getnative/-/lodash._getnative-3.9.1.tgz#570bc7dede46d61cdcde687d65d3eecbaa3aaff5"
-  integrity sha1-VwvH3t5G1hzc3mh9ZdPuy6o6r/U=
-
 lodash._root@~3.0.0:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/lodash._root/-/lodash._root-3.0.1.tgz#fba1c4524c19ee9a5f8136b4609f017cf4ded692"
@@ -11079,11 +11052,6 @@ [email protected], lodash.memoize@^4.1.2:
   resolved "https://registry.yarnpkg.com/lodash.memoize/-/lodash.memoize-4.1.2.tgz#bcc6c49a42a2840ed997f323eada5ecd182e0bfe"
   integrity sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4=
 
-lodash.restparam@*:
-  version "3.6.1"
-  resolved "https://registry.yarnpkg.com/lodash.restparam/-/lodash.restparam-3.6.1.tgz#936a4e309ef330a7645ed4145986c85ae5b20805"
-  integrity sha1-k2pOMJ7zMKdkXtQUWYbIWuWyCAU=
-
 lodash.set@^4.3.2:
   version "4.3.2"
   resolved "https://registry.yarnpkg.com/lodash.set/-/lodash.set-4.3.2.tgz#d8757b1da807dde24816b0d6a84bea1a76230b23"
@@ -12195,7 +12163,6 @@ npm@^6.10.3, npm@^6.14.8:
     cmd-shim "^3.0.3"
     columnify "~1.5.4"
     config-chain "^1.1.12"
-    debuglog "*"
     detect-indent "~5.0.0"
     detect-newline "^2.1.0"
     dezalgo "~1.0.3"
@@ -12210,7 +12177,6 @@ npm@^6.10.3, npm@^6.14.8:
     has-unicode "~2.0.1"
     hosted-git-info "^2.8.8"
     iferr "^1.0.2"
-    imurmurhash "*"
     infer-owner "^1.0.4"
     inflight "~1.0.6"
     inherits "^2.0.4"
@@ -12229,14 +12195,8 @@ npm@^6.10.3, npm@^6.14.8:
     libnpx "^10.2.4"
     lock-verify "^2.1.0"
     lockfile "^1.0.4"
-    lodash._baseindexof "*"
     lodash._baseuniq "~4.6.0"
-    lodash._bindcallback "*"
-    lodash._cacheindexof "*"
-    lodash._createcache "*"
-    lodash._getnative "*"
     lodash.clonedeep "~4.5.0"
-    lodash.restparam "*"
     lodash.union "~4.6.0"
     lodash.uniq "~4.5.0"
     lodash.without "~4.4.0"
@@ -16306,10 +16266,10 @@ typedarray@^0.0.6:
   resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
   integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=
 
-typescript@3.9.7:
-  version "3.9.7"
-  resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.9.7.tgz#98d600a5ebdc38f40cb277522f12dc800e9e25fa"
-  integrity sha512-BLbiRkiBzAwsjut4x/dsibSTB6yWpwT5qWmC2OfuCg3GgVQCSgMs4vEctYPhsaGtd0AeuuHMkjZ2h2WG8MSzRw==
+typescript@4.1.3:
+  version "4.1.3"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.1.3.tgz#519d582bd94cba0cf8934c7d8e8467e473f53bb7"
+  integrity sha512-B3ZIOf1IKeH2ixgHhj6la6xdwR9QrLC5d1VKeCSY4tvkqhF2eqd9O7txNlS0PO3GrBAFIdr3L1ndNwteUbZLYg==
 
 ua-parser-js@^0.7.18:
   version "0.7.20"