Upgrade @types/react to latest 18.x (#48645)

Required for https://github.com/vercel/next.js/pull/48641 [React 18 types changelog](https://github.com/DefinitelyTyped/DefinitelyTyped/pull/56210) Revealed some bugs in `React.Children` typings that were hidden due to `{}` being part of `ReactNode` before 18.x types. The rest is mostly missing `children` props types.
2023-04-21 11:33:23 +02:00 · 2023-04-21 11:33:23 +02:00 · db0086703e
commit db0086703e
parent e952160049
34 changed files with 104 additions and 87 deletions
--- a/package.json
+++ b/package.json
@ -86,13 +86,13 @@
    "@types/jest": "24.0.13",
    "@types/node": "14.14.31",
    "@types/node-fetch": "2.6.1",
-    "@types/react": "16.9.17",
-    "@types/react-dom": "16.9.4",
+    "@types/react": "18.0.37",
+    "@types/react-dom": "18.0.11",
    "@types/relay-runtime": "13.0.0",
    "@types/selenium-webdriver": "4.0.15",
    "@types/sharp": "0.29.3",
    "@types/string-hash": "1.1.1",
-    "@types/trusted-types": "2.0.2",
+    "@types/trusted-types": "2.0.3",
    "@typescript-eslint/eslint-plugin": "4.29.1",
    "@typescript-eslint/parser": "4.29.1",
    "@vercel/fetch": "6.1.1",
@ -240,7 +240,9 @@
    "@babel/core": "7.18.0",
    "@babel/parser": "7.18.0",
    "@babel/types": "7.18.0",
-    "@babel/traverse": "7.18.0"
+    "@babel/traverse": "7.18.0",
+    "@types/react": "18.0.37",
+    "@types/react-dom": "18.0.11"
  },
  "engines": {
    "node": ">=14.18.0"
--- a/packages/next/package.json
+++ b/packages/next/package.json
@ -174,9 +174,9 @@
    "@types/node-fetch": "2.6.1",
    "@types/path-to-regexp": "1.7.0",
    "@types/platform": "1.3.4",
-    "@types/react": "16.9.17",
-    "@types/react-dom": "16.9.4",
-    "@types/react-is": "16.7.1",
+    "@types/react": "18.0.37",
+    "@types/react-dom": "18.0.11",
+    "@types/react-is": "17.0.3",
    "@types/semver": "7.3.1",
    "@types/send": "0.14.4",
    "@types/shell-quote": "1.7.1",
--- a/packages/next/src/client/components/error-boundary.tsx
+++ b/packages/next/src/client/components/error-boundary.tsx
@ -31,6 +31,7 @@ export type ErrorComponent = React.ComponentType<{
 }>

 export interface ErrorBoundaryProps {
+  children?: React.ReactNode
  errorComponent: ErrorComponent
  errorStyles?: React.ReactNode | undefined
 }
--- a/packages/next/src/client/components/react-dev-overlay/hot-reloader-client.tsx
+++ b/packages/next/src/client/components/react-dev-overlay/hot-reloader-client.tsx
@ -4,7 +4,6 @@ import React, {
  useEffect,
  useReducer,
  useMemo,
-  // @ts-expect-error TODO-APP: startTransition exists
  startTransition,
 } from 'react'
 import stripAnsi from 'next/dist/compiled/strip-ansi'
--- a/packages/next/src/client/components/react-dev-overlay/internal/components/Dialog/Dialog.tsx
+++ b/packages/next/src/client/components/react-dev-overlay/internal/components/Dialog/Dialog.tsx
@ -2,6 +2,7 @@ import * as React from 'react'
 import { useOnClickOutside } from '../../hooks/use-on-click-outside'

 export type DialogProps = {
+  children?: React.ReactNode
  type: 'error' | 'warning'
  'aria-labelledby': string
  'aria-describedby': string
@ -15,7 +16,7 @@ const Dialog: React.FC<DialogProps> = function Dialog({
  ...props
 }) {
  const [dialog, setDialog] = React.useState<HTMLDivElement | null>(null)
-  const onDialog = React.useCallback((node) => {
+  const onDialog = React.useCallback((node: HTMLDivElement | null) => {
    setDialog(node)
  }, [])
  useOnClickOutside(dialog, onClose)
--- a/packages/next/src/client/components/react-dev-overlay/internal/components/Dialog/DialogBody.tsx
+++ b/packages/next/src/client/components/react-dev-overlay/internal/components/Dialog/DialogBody.tsx
@ -1,6 +1,7 @@
 import * as React from 'react'

 export type DialogBodyProps = {
+  children?: React.ReactNode
  className?: string
 }

--- a/packages/next/src/client/components/react-dev-overlay/internal/components/Dialog/DialogContent.tsx
+++ b/packages/next/src/client/components/react-dev-overlay/internal/components/Dialog/DialogContent.tsx
@ -1,6 +1,7 @@
 import * as React from 'react'

 export type DialogContentProps = {
+  children?: React.ReactNode
  className?: string
 }

--- a/packages/next/src/client/components/react-dev-overlay/internal/components/Dialog/DialogHeader.tsx
+++ b/packages/next/src/client/components/react-dev-overlay/internal/components/Dialog/DialogHeader.tsx
@ -1,6 +1,7 @@
 import * as React from 'react'

 export type DialogHeaderProps = {
+  children?: React.ReactNode
  className?: string
 }

--- a/packages/next/src/client/components/react-dev-overlay/internal/components/LeftRightDialogHeader/LeftRightDialogHeader.tsx
+++ b/packages/next/src/client/components/react-dev-overlay/internal/components/LeftRightDialogHeader/LeftRightDialogHeader.tsx
@ -2,6 +2,7 @@ import * as React from 'react'
 import { CloseIcon } from '../../icons/CloseIcon'

 export type LeftRightDialogHeaderProps = {
+  children?: React.ReactNode
  className?: string
  previous: (() => void) | null
  next: (() => void) | null
--- a/packages/next/src/client/components/react-dev-overlay/internal/components/Overlay/Overlay.tsx
+++ b/packages/next/src/client/components/react-dev-overlay/internal/components/Overlay/Overlay.tsx
@ -3,7 +3,11 @@ import allyTrap from './maintain--tab-focus'
 import * as React from 'react'
 import { lock, unlock } from './body-locker'

-export type OverlayProps = { className?: string; fixed?: boolean }
+export type OverlayProps = {
+  children?: React.ReactNode
+  className?: string
+  fixed?: boolean
+}

 const Overlay: React.FC<OverlayProps> = function Overlay({
  className,
--- a/packages/next/src/client/components/react-dev-overlay/internal/components/Toast/Toast.tsx
+++ b/packages/next/src/client/components/react-dev-overlay/internal/components/Toast/Toast.tsx
@ -1,6 +1,7 @@
 import * as React from 'react'

 export type ToastProps = {
+  children?: React.ReactNode
  onClick?: (ev: React.MouseEvent<HTMLDivElement, MouseEvent>) => void
  className?: string
 }
--- a/packages/next/src/client/components/react-dev-overlay/internal/helpers/use-websocket.ts
+++ b/packages/next/src/client/components/react-dev-overlay/internal/helpers/use-websocket.ts
@ -30,7 +30,7 @@ export function useWebsocket(assetPrefix: string) {

 export function useSendMessage(webSocketRef: ReturnType<typeof useWebsocket>) {
  const sendMessage = useCallback(
-    (data) => {
+    (data: string) => {
      const socket = webSocketRef.current
      if (!socket || socket.readyState !== socket.OPEN) {
        return
--- a/packages/next/src/client/image.tsx
+++ b/packages/next/src/client/image.tsx
@ -145,7 +145,6 @@ type ImageElementProps = Omit<ImageProps, 'src' | 'alt' | 'loader'> & {
  imgStyle: ImgElementStyle
  blurStyle: ImgElementStyle
  isLazy: boolean
-  fetchPriority: string
  fill?: boolean
  loading: LoadingValue
  config: ImageConfig
@ -420,7 +419,6 @@ const ImageElement = forwardRef<HTMLImageElement | null, ImageElementProps>(
        <img
          {...rest}
          {...getDynamicProps(fetchPriority)}
-          // @ts-expect-error - TODO: upgrade to `@types/react@18`
          loading={loading}
          width={widthInt}
          height={heightInt}
@ -534,7 +532,6 @@ const Image = forwardRef<HTMLImageElement | null, ImageProps>(
      onLoadingComplete,
      placeholder = 'empty',
      blurDataURL,
-      // @ts-expect-error - TODO: upgrade to `@types/react@18`
      fetchPriority,
      layout,
      objectFit,
@ -972,7 +969,6 @@ const Image = forwardRef<HTMLImageElement | null, ImageProps>(
              rel="preload"
              as="image"
              href={imgAttributes.srcSet ? undefined : imgAttributes.src}
-              // @ts-expect-error - TODO: upgrade to `@types/react@18`
              imageSrcSet={imgAttributes.srcSet}
              imageSizes={imgAttributes.sizes}
              crossOrigin={rest.crossOrigin}
--- a/packages/next/src/client/index.tsx
+++ b/packages/next/src/client/index.tsx
@ -9,7 +9,6 @@ import type {
 } from '../shared/lib/router/router'

 import React from 'react'
-// @ts-expect-error upgrade react types to react 18
 import ReactDOM from 'react-dom/client'
 import { HeadManagerContext } from '../shared/lib/head-manager-context'
 import mitt, { MittEmitter } from '../shared/lib/mitt'
@ -101,6 +100,7 @@ let CachedComponent: React.ComponentType
 ;(self as any).__next_require__ = __webpack_require__

 class Container extends React.Component<{
+  children?: React.ReactNode
  fn: (err: Error, info?: any) => void
 }> {
  componentDidCatch(componentErr: Error, info: any) {
@ -509,6 +509,7 @@ function renderReactElement(
  if (!reactRoot) {
    // Unlike with createRoot, you don't need a separate root.render() call here
    reactRoot = ReactDOM.hydrateRoot(domEl, reactEl, {
+      // @ts-expect-error Missing errorInfo in @types/react
      onRecoverableError,
    })
    // TODO: Remove shouldHydrate variable when React 18 is stable as it can depend on `reactRoot` existing
--- a/packages/next/src/client/legacy/image.tsx
+++ b/packages/next/src/client/legacy/image.tsx
@ -976,7 +976,6 @@ export default function Image({
    React.LinkHTMLAttributes<HTMLLinkElement>,
    HTMLLinkElement
  > = {
-    // @ts-expect-error upgrade react types to react 18
    imageSrcSet: imgAttributes.srcSet,
    imageSizes: imgAttributes.sizes,
    crossOrigin: rest.crossOrigin,
--- a/packages/next/src/client/link.tsx
+++ b/packages/next/src/client/link.tsx
@ -224,7 +224,6 @@ function linkClicked(
  }

  if (isAppRouter) {
-    // @ts-expect-error startTransition exists.
    React.startTransition(navigate)
  } else {
    navigate()
--- a/packages/next/src/client/script.tsx
+++ b/packages/next/src/client/script.tsx
@ -91,7 +91,8 @@ const loadScript = (props: ScriptProps): void => {
  })

  if (dangerouslySetInnerHTML) {
-    el.innerHTML = dangerouslySetInnerHTML.__html || ''
+    // Casting since lib.dom.d.ts doesn't have TrustedHTML yet.
+    el.innerHTML = (dangerouslySetInnerHTML.__html as string) || ''

    afterLoad()
  } else if (children) {
@ -264,7 +265,9 @@ function Script(props: ScriptProps): JSX.Element | null {
      if (!src) {
        // For inlined scripts, we put the content in `children`.
        if (restProps.dangerouslySetInnerHTML) {
-          restProps.children = restProps.dangerouslySetInnerHTML.__html
+          // Casting since lib.dom.d.ts doesn't have TrustedHTML yet.
+          restProps.children = restProps.dangerouslySetInnerHTML
+            .__html as string
          delete restProps.dangerouslySetInnerHTML
        }

--- a/packages/next/src/pages/_document.tsx
+++ b/packages/next/src/pages/_document.tsx
@ -24,7 +24,7 @@ export { DocumentContext, DocumentInitialProps, DocumentProps }

 export type OriginProps = {
  nonce?: string
-  crossOrigin?: string
+  crossOrigin?: 'anonymous' | 'use-credentials' | '' | undefined
  children?: React.ReactNode
 }

@ -259,9 +259,7 @@ function getPreNextWorkerScripts(context: HtmlProps, props: OriginProps) {

          let srcProps: {
            src?: string
-            dangerouslySetInnerHTML?: {
-              __html: string
-            }
+            dangerouslySetInnerHTML?: ScriptProps['dangerouslySetInnerHTML']
          } = {}

          if (src) {
@ -582,7 +580,9 @@ export class Head extends React.Component<HeadProps> {
          src,
          ...scriptProps
        } = file
-        let html = ''
+        let html: NonNullable<
+          ScriptProps['dangerouslySetInnerHTML']
+        >['__html'] = ''

        if (dangerouslySetInnerHTML && dangerouslySetInnerHTML.__html) {
          html = dangerouslySetInnerHTML.__html
@ -602,7 +602,10 @@ export class Head extends React.Component<HeadProps> {
            key={scriptProps.id || index}
            nonce={nonce}
            data-nscript="beforeInteractive"
-            crossOrigin={crossOrigin || process.env.__NEXT_CROSS_ORIGIN}
+            crossOrigin={
+              crossOrigin ||
+              (process.env.__NEXT_CROSS_ORIGIN as typeof crossOrigin)
+            }
          />
        )
      })
@ -624,7 +627,7 @@ export class Head extends React.Component<HeadProps> {
    return getPolyfillScripts(this.context, this.props)
  }

-  makeStylesheetInert(node: ReactNode): ReactNode[] {
+  makeStylesheetInert(node: ReactNode[]): ReactNode[] {
    return React.Children.map(node, (c: any) => {
      if (
        c?.type === 'link' &&
@ -650,7 +653,8 @@ export class Head extends React.Component<HeadProps> {
      }

      return c
-    }).filter(Boolean)
+      // @types/react bug. Returned value from .map will not be `null` if you pass in `[null]`
+    })!.filter(Boolean)
  }

  render() {
@ -711,7 +715,9 @@ export class Head extends React.Component<HeadProps> {
      })
      head = cssPreloads.concat(otherHeadElements)
    }
-    let children = React.Children.toArray(this.props.children).filter(Boolean)
+    let children: React.ReactNode[] = React.Children.toArray(
+      this.props.children
+    ).filter(Boolean)
    // show a warning if Head contains <title> (only in development)
    if (process.env.NODE_ENV !== 'production') {
      children = React.Children.map(children, (child: any) => {
@ -731,7 +737,8 @@ export class Head extends React.Component<HeadProps> {
          }
        }
        return child
-      })
+        // @types/react bug. Returned value from .map will not be `null` if you pass in `[null]`
+      })!
      if (this.props.crossOrigin)
        console.warn(
          'Warning: `Head` attribute `crossOrigin` is deprecated. https://nextjs.org/docs/messages/doc-crossorigin-deprecated'
@ -791,7 +798,8 @@ export class Head extends React.Component<HeadProps> {
        }
      }
      return child
-    })
+      // @types/react bug. Returned value from .map will not be `null` if you pass in `[null]`
+    })!

    const files: DocumentFiles = getDocumentFiles(
      this.context.buildManifest,
--- a/packages/next/src/server/base-server.ts
+++ b/packages/next/src/server/base-server.ts
@ -236,7 +236,7 @@ export default abstract class Server<ServerOptions extends Options = Options> {
    distDir: string
    runtime?: ServerRuntime
    serverComponents?: boolean
-    crossOrigin?: string
+    crossOrigin?: 'anonymous' | 'use-credentials' | '' | undefined
    supportsDynamicHTML?: boolean
    isBot?: boolean
    clientReferenceManifest?: ClientReferenceManifest
--- a/packages/next/src/server/render.tsx
+++ b/packages/next/src/server/render.tsx
@ -263,7 +263,7 @@ export type RenderOptsPartial = {
  runtime?: ServerRuntime
  serverComponents?: boolean
  customServer?: boolean
-  crossOrigin?: string
+  crossOrigin?: 'anonymous' | 'use-credentials' | '' | undefined
  images: ImageConfigComplete
  largePageDataBytes?: number
  isOnDemandRevalidate?: boolean
--- a/packages/next/src/shared/lib/dynamic.tsx
+++ b/packages/next/src/shared/lib/dynamic.tsx
@ -78,7 +78,7 @@ export default function dynamic<P = {}>(
  dynamicOptions: DynamicOptions<P> | Loader<P>,
  options?: DynamicOptions<P>
 ): React.ComponentType<P> {
-  let loadableFn: LoadableFn<P> = Loadable
+  let loadableFn = Loadable as LoadableFn<P>

  let loadableOptions: LoadableOptions<P> = {
    // A loading component is not required, so we default it
--- a/packages/next/src/shared/lib/head.tsx
+++ b/packages/next/src/shared/lib/head.tsx
@ -30,7 +30,9 @@ function onlyReactElement(
  // Adds support for React.Fragment
  if (child.type === React.Fragment) {
    return list.concat(
+      // @ts-expect-error @types/react does not remove fragments but this could also return ReactPortal[]
      React.Children.toArray(child.props.children).reduce(
+        // @ts-expect-error @types/react does not remove fragments but this could also return ReactPortal[]
        (
          fragmentList: Array<React.ReactElement<any>>,
          fragmentChild: React.ReactChild
--- a/packages/next/src/shared/lib/html-context.ts
+++ b/packages/next/src/shared/lib/html-context.ts
@ -37,7 +37,7 @@ export type HtmlProps = {
  disableOptimizedLoading?: boolean
  styles?: React.ReactElement[] | React.ReactFragment
  head?: Array<JSX.Element | null>
-  crossOrigin?: string
+  crossOrigin?: 'anonymous' | 'use-credentials' | '' | undefined
  optimizeCss?: any
  optimizeFonts?: FontConfig
  nextConfigOutput?: 'standalone' | 'export'
--- a/packages/next/src/shared/lib/side-effect.tsx
+++ b/packages/next/src/shared/lib/side-effect.tsx
@ -23,7 +23,9 @@ export default function SideEffect(props: SideEffectProps) {
  function emitChange() {
    if (headManager && headManager.mountedInstances) {
      const headElements = Children.toArray(
-        Array.from(headManager.mountedInstances as Set<unknown>).filter(Boolean)
+        Array.from(headManager.mountedInstances as Set<React.ReactNode>).filter(
+          Boolean
+        )
      ) as React.ReactElement[]
      headManager.updateHead(reduceComponentsToState(headElements, props))
    }
--- a/packages/next/types/index.d.ts
+++ b/packages/next/types/index.d.ts
@ -47,6 +47,12 @@ declare module 'react' {
    nonce?: string
  }

+  // <img fetchPriority=""> support
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars -- It's actually required for module augmentation to work.
+  interface ImgHTMLAttributes<T> {
+    fetchPriority?: 'high' | 'low' | 'auto' | undefined
+  }
+
  function use<T>(promise: Promise<T> | React.Context<T>): T
  function cache<T extends Function>(fn: T): T
 }
--- a/packages/react-dev-overlay/src/internal/ErrorBoundary.tsx
+++ b/packages/react-dev-overlay/src/internal/ErrorBoundary.tsx
@ -1,6 +1,7 @@
 import React from 'react'

 type ErrorBoundaryProps = {
+  children?: React.ReactNode
  onError: (error: Error, componentStack: string | null) => void
  globalOverlay?: boolean
  isMounted?: boolean
--- a/packages/react-dev-overlay/src/internal/components/Dialog/Dialog.tsx
+++ b/packages/react-dev-overlay/src/internal/components/Dialog/Dialog.tsx
@ -2,6 +2,7 @@ import * as React from 'react'
 import { useOnClickOutside } from '../../hooks/use-on-click-outside'

 export type DialogProps = {
+  children?: React.ReactNode
  type: 'error' | 'warning'
  'aria-labelledby': string
  'aria-describedby': string
@ -15,7 +16,7 @@ const Dialog: React.FC<DialogProps> = function Dialog({
  ...props
 }) {
  const [dialog, setDialog] = React.useState<HTMLDivElement | null>(null)
-  const onDialog = React.useCallback((node) => {
+  const onDialog = React.useCallback((node: HTMLDivElement | null) => {
    setDialog(node)
  }, [])
  useOnClickOutside(dialog, onClose)
--- a/packages/react-dev-overlay/src/internal/components/Dialog/DialogBody.tsx
+++ b/packages/react-dev-overlay/src/internal/components/Dialog/DialogBody.tsx
@ -1,6 +1,7 @@
 import * as React from 'react'

 export type DialogBodyProps = {
+  children?: React.ReactNode
  className?: string
 }

--- a/packages/react-dev-overlay/src/internal/components/Dialog/DialogContent.tsx
+++ b/packages/react-dev-overlay/src/internal/components/Dialog/DialogContent.tsx
@ -1,6 +1,7 @@
 import * as React from 'react'

 export type DialogContentProps = {
+  children?: React.ReactNode
  className?: string
 }

--- a/packages/react-dev-overlay/src/internal/components/Dialog/DialogHeader.tsx
+++ b/packages/react-dev-overlay/src/internal/components/Dialog/DialogHeader.tsx
@ -1,6 +1,7 @@
 import * as React from 'react'

 export type DialogHeaderProps = {
+  children?: React.ReactNode
  className?: string
 }

--- a/packages/react-dev-overlay/src/internal/components/LeftRightDialogHeader/LeftRightDialogHeader.tsx
+++ b/packages/react-dev-overlay/src/internal/components/LeftRightDialogHeader/LeftRightDialogHeader.tsx
@ -2,6 +2,7 @@ import * as React from 'react'
 import { CloseIcon } from '../../icons/CloseIcon'

 export type LeftRightDialogHeaderProps = {
+  children?: React.ReactNode
  className?: string
  previous: (() => void) | null
  next: (() => void) | null
--- a/packages/react-dev-overlay/src/internal/components/Overlay/Overlay.tsx
+++ b/packages/react-dev-overlay/src/internal/components/Overlay/Overlay.tsx
@ -3,7 +3,11 @@ import allyTrap from './maintain--tab-focus'
 import * as React from 'react'
 import { lock, unlock } from './body-locker'

-export type OverlayProps = { className?: string; fixed?: boolean }
+export type OverlayProps = {
+  children?: React.ReactNode
+  className?: string
+  fixed?: boolean
+}

 const Overlay: React.FC<OverlayProps> = function Overlay({
  className,
--- a/packages/react-dev-overlay/src/internal/components/Toast/Toast.tsx
+++ b/packages/react-dev-overlay/src/internal/components/Toast/Toast.tsx
@ -1,6 +1,7 @@
 import * as React from 'react'

 export type ToastProps = {
+  children?: React.ReactNode
  onClick?: (ev: React.MouseEvent<HTMLDivElement, MouseEvent>) => void
  className?: string
 }
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@ -7,6 +7,8 @@ overrides:
  '@babel/parser': 7.18.0
  '@babel/types': 7.18.0
  '@babel/traverse': 7.18.0
+  '@types/react': 18.0.37
+  '@types/react-dom': 18.0.11

 importers:

@ -45,13 +47,13 @@ importers:
      '@types/jest': 24.0.13
      '@types/node': 14.14.31
      '@types/node-fetch': 2.6.1
-      '@types/react': 16.9.17
-      '@types/react-dom': 16.9.4
+      '@types/react': 18.0.37
+      '@types/react-dom': 18.0.11
      '@types/relay-runtime': 13.0.0
      '@types/selenium-webdriver': 4.0.15
      '@types/sharp': 0.29.3
      '@types/string-hash': 1.1.1
-      '@types/trusted-types': 2.0.2
+      '@types/trusted-types': 2.0.3
      '@typescript-eslint/eslint-plugin': 4.29.1
      '@typescript-eslint/parser': 4.29.1
      '@vercel/fetch': 6.1.1
@ -226,13 +228,13 @@ importers:
      '@types/jest': 24.0.13
      '@types/node': 14.14.31
      '@types/node-fetch': 2.6.1
-      '@types/react': 16.9.17
-      '@types/react-dom': 16.9.4
+      '@types/react': 18.0.37
+      '@types/react-dom': 18.0.11
      '@types/relay-runtime': 13.0.0
      '@types/selenium-webdriver': 4.0.15
      '@types/sharp': 0.29.3
      '@types/string-hash': 1.1.1
-      '@types/trusted-types': 2.0.2
+      '@types/trusted-types': 2.0.3
      '@typescript-eslint/eslint-plugin': 4.29.1_qxyn66xcaddhgaahwkbomftvi4
      '@typescript-eslint/parser': 4.29.1_6x3mpmmsttbpxxsctsorxedanu
      '@vercel/fetch': 6.1.1_fii5qhbaymjqmfm7e2spxc5z4m
@ -564,9 +566,9 @@ importers:
      '@types/node-fetch': 2.6.1
      '@types/path-to-regexp': 1.7.0
      '@types/platform': 1.3.4
-      '@types/react': 16.9.17
-      '@types/react-dom': 16.9.4
-      '@types/react-is': 16.7.1
+      '@types/react': 18.0.37
+      '@types/react-dom': 18.0.11
+      '@types/react-is': 17.0.3
      '@types/semver': 7.3.1
      '@types/send': 0.14.4
      '@types/shell-quote': 1.7.1
@ -784,9 +786,9 @@ importers:
      '@types/node-fetch': 2.6.1
      '@types/path-to-regexp': 1.7.0
      '@types/platform': 1.3.4
-      '@types/react': 16.9.17
-      '@types/react-dom': 16.9.4
-      '@types/react-is': 16.7.1
+      '@types/react': 18.0.37
+      '@types/react-dom': 18.0.11
+      '@types/react-is': 17.0.3
      '@types/semver': 7.3.1
      '@types/send': 0.14.4
      '@types/shell-quote': 1.7.1
@ -1005,8 +1007,8 @@ importers:
    specifiers:
      '@types/node': ^18.11.11
      '@types/platform': ^1.3.4
-      '@types/react': ^18.0.26
-      '@types/react-dom': ^18.0.9
+      '@types/react': 18.0.37
+      '@types/react-dom': 18.0.11
      '@vercel/ncc': ^0.36.0
      '@vercel/turbopack-dev': https://gitpkg.vercel.app/vercel/turbo/crates/turbopack-dev/js?turbopack-230420.2
      '@vercel/turbopack-node': https://gitpkg.vercel.app/vercel/turbo/crates/turbopack-node/js?turbopack-230420.2
@ -1035,7 +1037,7 @@ importers:
    devDependencies:
      '@types/node': 18.11.18
      '@types/platform': 1.3.4
-      '@types/react': 18.0.28
+      '@types/react': 18.0.37
      '@types/react-dom': 18.0.11
      '@vercel/ncc': 0.36.1
      find-up: 6.3.0
@ -6037,7 +6039,7 @@ packages:
      react: '>=16'
    dependencies:
      '@types/mdx': 2.0.3
-      '@types/react': 16.9.17
+      '@types/react': 18.0.37
      react: 18.2.0

  /@mrmlnc/readdir-enhanced/2.2.1:
@ -6852,7 +6854,7 @@ packages:
    dependencies:
      '@babel/runtime': 7.16.7
      '@testing-library/dom': 8.13.0
-      '@types/react-dom': 17.0.14
+      '@types/react-dom': 18.0.11
      react: 18.2.0
      react-dom: 18.2.0_react@18.2.0
    dev: true
@ -7327,43 +7329,24 @@ packages:
    resolution: {integrity: sha512-ewFXqrQHlFsgc09MK5jP5iR7vumV/BYayNC6PgJO2LPe8vrnNFyjQjSppfEngITi0qvfKtzFvgKymGheFM9UOA==}
    dev: true

-  /@types/react-dom/16.9.4:
-    resolution: {integrity: sha512-fya9xteU/n90tda0s+FtN5Ym4tbgxpq/hb/Af24dvs6uYnYn+fspaxw5USlw0R8apDNwxsqumdRoCoKitckQqw==}
-    dependencies:
-      '@types/react': 16.9.17
-    dev: true
-
-  /@types/react-dom/17.0.14:
-    resolution: {integrity: sha512-H03xwEP1oXmSfl3iobtmQ/2dHF5aBHr8aUMwyGZya6OW45G+xtdzmq6HkncefiBt5JU8DVyaWl/nWZbjZCnzAQ==}
-    dependencies:
-      '@types/react': 16.9.17
-    dev: true
-
  /@types/react-dom/18.0.11:
    resolution: {integrity: sha512-O38bPbI2CWtgw/OoQoY+BRelw7uysmXbWvw3nLWO21H1HSh+GOlqPuXshJfjmpNlKiiSDG9cc1JZAaMmVdcTlw==}
    dependencies:
-      '@types/react': 18.0.28
+      '@types/react': 18.0.37
    dev: true

-  /@types/react-is/16.7.1:
-    resolution: {integrity: sha512-dMLFD2cCsxtDgMkTydQCM0PxDq8vwc6uN5M/jRktDfYvH3nQj6pjC9OrCXS2lKlYoYTNJorI/dI8x9dpLshexQ==}
+  /@types/react-is/17.0.3:
+    resolution: {integrity: sha512-aBTIWg1emtu95bLTLx0cpkxwGW3ueZv71nE2YFBpL8k/z5czEW8yYpOo8Dp+UUAFAtKwNaOsh/ioSeQnWlZcfw==}
    dependencies:
-      '@types/react': 16.9.17
+      '@types/react': 18.0.37
    dev: true

-  /@types/react/16.9.17:
-    resolution: {integrity: sha512-UP27In4fp4sWF5JgyV6pwVPAQM83Fj76JOcg02X5BZcpSu5Wx+fP9RMqc2v0ssBoQIFvD5JdKY41gjJJKmw6Bg==}
-    dependencies:
-      '@types/prop-types': 15.7.3
-      csstype: 2.6.8
-
-  /@types/react/18.0.28:
-    resolution: {integrity: sha512-RD0ivG1kEztNBdoAK7lekI9M+azSnitIn85h4iOiaLjaTrMjzslhaqCGaI4IyCJ1RljWiLCEu4jyrLLgqxBTew==}
+  /@types/react/18.0.37:
+    resolution: {integrity: sha512-4yaZZtkRN3ZIQD3KSEwkfcik8s0SWV+82dlJot1AbGYHCzJkWP3ENBY6wYeDRmKZ6HkrgoGAmR2HqdwYGp6OEw==}
    dependencies:
      '@types/prop-types': 15.7.3
      '@types/scheduler': 0.16.2
      csstype: 3.0.10
-    dev: true

  /@types/relay-runtime/13.0.0:
    resolution: {integrity: sha512-yzv6F8EZPWA2rtfFP2qMluS8tsz1q4lfdYxLegCshdAjX5uqxTR2pAliATj9wrzD6OMZF4fl9aU+Y+zmSfm2EA==}
@ -7394,7 +7377,6 @@ packages:

  /@types/scheduler/0.16.2:
    resolution: {integrity: sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew==}
-    dev: true

  /@types/selenium-webdriver/4.0.15:
    resolution: {integrity: sha512-5760PIZkzhPejy3hsKAdCKe5LJygGdxLKOLxmZL9GEUcFlO5OgzM6G2EbdbvOnaw4xvUSa9Uip6Ipwkih12BPA==}
@ -7462,8 +7444,8 @@ packages:
      '@types/node': 18.11.18
    dev: true

-  /@types/trusted-types/2.0.2:
-    resolution: {integrity: sha512-F5DIZ36YVLE+PN+Zwws4kJogq47hNgX3Nx6WyDJ3kcplxyke3XIzB8uK5n/Lpm1HBsbGzd6nmGehL8cPekP+Tg==}
+  /@types/trusted-types/2.0.3:
+    resolution: {integrity: sha512-NfQ4gyz38SL8sDNrSixxU2Os1a5xcdFxipAFxYEuLUlvU2uDwS4NUpsImcf1//SlWItCVMMLiylsxbmNMToV/g==}
    dev: true

  /@types/ua-parser-js/0.7.36:
@ -10819,12 +10801,8 @@ packages:
      cssom: 0.3.8
    dev: true

-  /csstype/2.6.8:
-    resolution: {integrity: sha512-msVS9qTuMT5zwAGCVm4mxfrZ18BNc6Csd0oJAtiFMZ1FAx1CCvy2+5MDmYoix63LM/6NDbNtodCiGYGmFgO0dA==}
-
  /csstype/3.0.10:
    resolution: {integrity: sha512-2u44ZG2OcNUO9HDp/Jl8C07x6pU/eTR3ncV91SiK3dhG9TWvRVsCoJw14Ckx5DgWkzGA3waZWO3d7pgqpUI/XA==}
-    dev: true

  /currently-unhandled/0.4.1:
    resolution: {integrity: sha512-/fITjgjGU50vjQ4FH6eUoYu+iUoUKIXws2hL15JJpIR+BbTxaXQsMuuyjtNh2WqsSBS5nsaZHFsFecyw5CCAng==}