Update @types/React and fix types

Co-authored-by: Mitchell Hamilton <mitchellhamilton@users.noreply.github.com>
keystonejs · Apr 28, 2022 · 43e17a4 · 43e17a4
1 parent f10d0e0
commit 43e17a4
Show file tree

Hide file tree

Showing 22 changed files with 33 additions and 40 deletions.
diff --git a/design-system/packages/button/package.json b/design-system/packages/button/package.json
@@ -5,7 +5,7 @@
   "main": "dist/keystone-ui-button.cjs.js",
   "module": "dist/keystone-ui-button.esm.js",
   "devDependencies": {
-    "@types/react": "^17.0.37"
+    "@types/react": "^18.0.8"
   },
   "dependencies": {
     "@babel/runtime": "^7.16.3",

diff --git a/design-system/packages/core/package.json b/design-system/packages/core/package.json
@@ -5,7 +5,7 @@
   "main": "dist/keystone-ui-core.cjs.js",
   "module": "dist/keystone-ui-core.esm.js",
   "devDependencies": {
-    "@types/react": "^17.0.37",
+    "@types/react": "^18.0.8",
     "react": "^18.0.0",
     "react-dom": "^18.0.0"
   },

diff --git a/design-system/packages/fields/package.json b/design-system/packages/fields/package.json
@@ -5,7 +5,7 @@
   "main": "dist/keystone-ui-fields.cjs.js",
   "module": "dist/keystone-ui-fields.esm.js",
   "devDependencies": {
-    "@types/react": "^17.0.37"
+    "@types/react": "^18.0.8"
   },
   "dependencies": {
     "@babel/runtime": "^7.16.3",

diff --git a/design-system/packages/fields/src/DatePicker/index.tsx b/design-system/packages/fields/src/DatePicker/index.tsx
@@ -27,7 +27,7 @@ export type DatePickerProps = {
 
 export function useEventCallback<Func extends (...args: any) => any>(callback: Func): Func {
   const callbackRef = useRef(callback);
-  const cb = useCallback((...args) => {
+  const cb = useCallback((...args: any[]) => {
     return callbackRef.current(...args);
   }, []);
   useEffect(() => {

diff --git a/design-system/packages/icons/package.json b/design-system/packages/icons/package.json
@@ -12,7 +12,7 @@
     "@svgr/plugin-jsx": "^6.0.0",
     "@svgr/plugin-prettier": "^5.5.0",
     "@svgr/plugin-svgo": "^6.0.0",
-    "@types/react": "^17.0.37",
+    "@types/react": "^18.0.8",
     "chalk": "^4.1.2",
     "feather-icons": "^4.28.0",
     "fs-extra": "^10.0.0",

diff --git a/design-system/packages/loading/package.json b/design-system/packages/loading/package.json
@@ -5,7 +5,7 @@
   "main": "dist/keystone-ui-loading.cjs.js",
   "module": "dist/keystone-ui-loading.esm.js",
   "devDependencies": {
-    "@types/react": "^17.0.37"
+    "@types/react": "^18.0.8"
   },
   "dependencies": {
     "@babel/runtime": "^7.16.3",

diff --git a/design-system/packages/modals/package.json b/design-system/packages/modals/package.json
@@ -5,7 +5,7 @@
   "main": "dist/keystone-ui-modals.cjs.js",
   "module": "dist/keystone-ui-modals.esm.js",
   "devDependencies": {
-    "@types/react": "^17.0.37"
+    "@types/react": "^18.0.8"
   },
   "dependencies": {
     "@babel/runtime": "^7.16.3",

diff --git a/design-system/packages/modals/src/DrawerController.tsx b/design-system/packages/modals/src/DrawerController.tsx
@@ -26,8 +26,8 @@ export const useDrawerControllerContext = () => {
 export const DrawerController = ({ isOpen, children }: DrawerControllerProps) => {
   return (
     <Transition appear mountOnEnter unmountOnExit in={isOpen} timeout={150}>
-      {(transitionState: TransitionState) => (
-        <DrawerControllerContextProvider value={transitionState}>
+      {(transitionState) => (
+        transitionState === 'unmounted' ? null : <DrawerControllerContextProvider value={transitionState}>
           {children}
         </DrawerControllerContextProvider>
       )}

diff --git a/design-system/packages/notice/package.json b/design-system/packages/notice/package.json
@@ -5,7 +5,7 @@
   "main": "dist/keystone-ui-notice.cjs.js",
   "module": "dist/keystone-ui-notice.esm.js",
   "devDependencies": {
-    "@types/react": "^17.0.37"
+    "@types/react": "^18.0.8"
   },
   "dependencies": {
     "@babel/runtime": "^7.16.3",

diff --git a/design-system/packages/segmented-control/package.json b/design-system/packages/segmented-control/package.json
@@ -5,7 +5,7 @@
   "main": "dist/keystone-ui-segmented-control.cjs.js",
   "module": "dist/keystone-ui-segmented-control.esm.js",
   "devDependencies": {
-    "@types/react": "^17.0.37",
+    "@types/react": "^18.0.8",
     "react": "^18.0.0"
   },
   "dependencies": {

diff --git a/design-system/packages/toast/package.json b/design-system/packages/toast/package.json
@@ -5,7 +5,7 @@
   "main": "dist/keystone-ui-toast.cjs.js",
   "module": "dist/keystone-ui-toast.esm.js",
   "devDependencies": {
-    "@types/react": "^17.0.37",
+    "@types/react": "^18.0.8",
     "react": "^18.0.0"
   },
   "dependencies": {

diff --git a/design-system/website/package.json b/design-system/website/package.json
@@ -21,8 +21,8 @@
     "@keystone-ui/toast": "^5.0.0",
     "@keystone-ui/tooltip": "^5.0.0",
     "@preconstruct/next": "^4.0.0",
-    "@types/react": "^17.0.37",
-    "@types/react-dom": "^17.0.11",
+    "@types/react": "^18.0.8",
+    "@types/react-dom": "^18.0.0",
     "@types/tinycolor2": "^1.4.3",
     "next": "^12.1.5",
     "react": "^18.0.0",

diff --git a/docs/components/primitives/Button.tsx b/docs/components/primitives/Button.tsx
@@ -1,6 +1,6 @@
 /** @jsxRuntime classic */
 /** @jsx jsx */
-import { Fragment, FunctionComponent, ReactNode } from 'react';
+import { Fragment, ElementType, ReactNode } from 'react';
 import { jsx } from '@emotion/react';
 import Link from 'next/link';
 
@@ -128,7 +128,7 @@ export const Button = forwardRefWithAs<'button', ButtonProps>(
     },
     ref
   ) => {
-    let Wrapper: FunctionComponent = Fragment;
+    let Wrapper: ElementType<{ children: ReactNode }> = Fragment;
 
     if (Tag === 'a' && !href) {
       Tag = 'button';

diff --git a/docs/package.json b/docs/package.json
@@ -23,8 +23,8 @@
     "@sindresorhus/slugify": "^1.1.2",
     "@types/gtag.js": "^0.0.10",
     "@types/mdx-js__react": "^1.5.5",
-    "@types/react": "^17.0.37",
-    "@types/react-dom": "^17.0.11",
+    "@types/react": "^18.0.8",
+    "@types/react-dom": "^18.0.0",
     "classnames": "^2.3.1",
     "copy-to-clipboard": "^3.3.1",
     "date-fns": "^2.26.0",

diff --git a/docs/pages/_document.tsx b/docs/pages/_document.tsx
@@ -31,7 +31,7 @@ class MyDocument extends Document {
     return {
       ...initialProps,
       styles: (
-        <React.Fragment>
+        [<React.Fragment key="1">
           {initialProps.styles}
           {data!.styles.map((data, i) => (
             <style
@@ -40,7 +40,7 @@ class MyDocument extends Document {
               dangerouslySetInnerHTML={{ __html: data.css }}
             />
           ))}
-        </React.Fragment>
+        </React.Fragment>]
       ),
     };
   }

diff --git a/examples-staging/basic/package.json b/examples-staging/basic/package.json
@@ -18,7 +18,7 @@
     "@keystone-ui/fields": "^6.0.1",
     "@keystone-ui/icons": "^5.0.0",
     "@keystone-ui/tooltip": "^5.0.0",
-    "@types/react": "^17.0.37",
+    "@types/react": "^18.0.8",
     "graphql": "^15.8.0",
     "graphql-tag": "^2.12.6",
     "react": "^18.0.0",

diff --git a/packages/cloudinary/package.json b/packages/cloudinary/package.json
@@ -10,7 +10,7 @@
     "@keystone-ui/core": "^4.0.0",
     "@keystone-ui/fields": "^6.0.1",
     "@keystone-ui/pill": "^6.0.0",
-    "@types/react": "^17.0.37",
+    "@types/react": "^18.0.8",
     "cloudinary": "^1.27.1",
     "cuid": "^2.1.8",
     "graphql-upload": "^13.0.0",

diff --git a/packages/core/package.json b/packages/core/package.json
@@ -65,7 +65,7 @@
     "@types/pluralize": "^0.0.29",
     "@types/prettier": "^2.4.2",
     "@types/prompts": "^2.0.14",
-    "@types/react": "^17.0.37",
+    "@types/react": "^18.0.8",
     "@types/source-map-support": "^0.5.4",
     "@types/supertest": "^2.0.11",
     "@types/uid-safe": "^2.1.2",

diff --git a/...ges/core/src/___internal-do-not-use-will-break-in-patch/admin-ui/pages/ItemPage/index.tsx b/...ges/core/src/___internal-do-not-use-will-break-in-patch/admin-ui/pages/ItemPage/index.tsx
@@ -51,7 +51,7 @@ type ItemPageProps = {
 
 function useEventCallback<Func extends (...args: any) => any>(callback: Func): Func {
   const callbackRef = useRef(callback);
-  const cb = useCallback((...args) => {
+  const cb = useCallback((...args: any[]) => {
     return callbackRef.current(...args);
   }, []);
   useEffect(() => {

diff --git a/packages/fields-document/package.json b/packages/fields-document/package.json
@@ -33,7 +33,7 @@
     "@keystone-ui/icons": "^5.0.0",
     "@keystone-ui/popover": "^5.0.1",
     "@keystone-ui/tooltip": "^5.0.0",
-    "@types/react": "^17.0.37",
+    "@types/react": "^18.0.8",
     "apollo-server-errors": "^3.3.0",
     "apply-ref": "^1.0.0",
     "fp-ts": "^2.11.5",

diff --git a/packages/fields-document/src/DocumentEditor/utils.ts b/packages/fields-document/src/DocumentEditor/utils.ts
@@ -93,7 +93,7 @@ export function useElementWithSetNodes<TElement extends Element>(
 
 export function useEventCallback<Func extends (...args: any) => any>(callback: Func): Func {
   const callbackRef = useRef(callback);
-  const cb = useCallback((...args) => {
+  const cb = useCallback((...args: any[]) => {
     return callbackRef.current(...args);
   }, []);
   useEffect(() => {

diff --git a/yarn.lock b/yarn.lock
@@ -3491,13 +3491,6 @@
   resolved "https://registry.yarnpkg.com/@types/range-parser/-/range-parser-1.2.4.tgz#cd667bcfdd025213aafb7ca5915a932590acdcdc"
   integrity sha512-EEhsLsD6UsDM1yFhAvy0Cjr6VwmpMWqFBCb9w07wVugF7w9nfajxLuVmngTIpgS6svCnm6Vaw+MZhoDCKnOfsw==
 
-"@types/react-dom@^17.0.11":
-  version "17.0.11"
-  resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-17.0.11.tgz#e1eadc3c5e86bdb5f7684e00274ae228e7bcc466"
-  integrity sha512-f96K3k+24RaLGVu/Y2Ng3e1EbZ8/cVJvypZWd7cy0ofCBaf2lcM46xNhycMZ2xGwbBjRql7hOlZ+e2WlJ5MH3Q==
-  dependencies:
-    "@types/react" "*"
-
 "@types/react-dom@^18.0.0":
   version "18.0.1"
   resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-18.0.1.tgz#cb3cc10ea91141b12c71001fede1017acfbce4db"
@@ -3512,10 +3505,10 @@
   dependencies:
     "@types/react" "*"
 
-"@types/react@*", "@types/react@>=16", "@types/react@^17.0.37":
-  version "17.0.37"
-  resolved "https://registry.yarnpkg.com/@types/react/-/react-17.0.37.tgz#6884d0aa402605935c397ae689deed115caad959"
-  integrity sha512-2FS1oTqBGcH/s0E+CjrCCR9+JMpsu9b69RTFO+40ua43ZqP5MmQ4iUde/dMjWR909KxZwmOQIFq6AV6NjEG5xg==
+"@types/react@*", "@types/react@>=16", "@types/react@^18.0.8":
+  version "18.0.8"
+  resolved "https://registry.yarnpkg.com/@types/react/-/react-18.0.8.tgz#a051eb380a9fbcaa404550543c58e1cf5ce4ab87"
+  integrity sha512-+j2hk9BzCOrrOSJASi5XiOyBbERk9jG5O73Ya4M0env5Ixi6vUNli4qy994AINcEF+1IEHISYFfIT4zwr++LKw==
   dependencies:
     "@types/prop-types" "*"
     "@types/scheduler" "*"
@@ -11165,9 +11158,9 @@ react-transition-group@^4.3.0, react-transition-group@^4.4.1, react-transition-g
     prop-types "^15.6.2"
 
 react@^18.0.0:
-  version "18.0.0"
-  resolved "https://registry.yarnpkg.com/react/-/react-18.0.0.tgz#b468736d1f4a5891f38585ba8e8fb29f91c3cb96"
-  integrity sha512-x+VL6wbT4JRVPm7EGxXhZ8w8LTROaxPXOqhlGyVSrv0sB1jkyFGgXxJ8LVoPRLvPR6/CIZGFmfzqUa2NYeMr2A==
+  version "18.1.0"
+  resolved "https://registry.yarnpkg.com/react/-/react-18.1.0.tgz#6f8620382decb17fdc5cc223a115e2adbf104890"
+  integrity sha512-4oL8ivCz5ZEPyclFQXaNksK3adutVS8l2xzZU0cqEFrE9Sb7fC0EFK5uEk74wIreL1DERyjvsU915j1pcT2uEQ==
   dependencies:
     loose-envify "^1.1.0"