Revert "chore(deps-dev): bump @types/react from 18.0.21 to 18.0.25 (#…

[robinmetral]

This reverts commit 0650528.

Purpose

This version bump caused compatibility issues with web apps using Circuit on React 17.

It looks like the underlying HTML element types for components (such as HTMLAttributes<HTMLParagraphElement> for Body) is incompatible between React 17 and 18 types:

The error messages point to two recent changes in the React 18 types:

• React: Move nonce to global attributes DefinitelyTyped/DefinitelyTyped#62879
• [@types/react] Add onResize event to video elements DefinitelyTyped/DefinitelyTyped#63076

Approach and changes

Before downgrading I tried:

• to upgrade the React types to v18 in the web app, but this caused too many other clashes with the internal React 17 version (and upgrading React there is not an option yet)
• to redeclare/override the Circuit UI types, without success

Definition of done

• Development completed
• Reviewers assigned
• Unit and integration tests
• Meets minimum browser support
• Meets accessibility requirements

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated
oss-circuit-ui	✅ Ready (Inspect)	Visit Preview	Nov 8, 2022 at 2:16PM (UTC)

[changeset-bot]

⚠️ No Changeset found

Latest commit: 3f38b9b

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

[Click here if you're a maintainer who wants to add a changeset to this PR](https://github.com/sumup-oss/circuit-ui/new/revert-1825-dependabot/npm_and_yarn/types/react-18.0.25?filename=.changeset/soft-mangos-work.md&value=---%0A%22%40sumup%2Fcircuit-ui%22%3A%20patch%0A---%0A%0ARevert%20%22chore(deps-dev)%3A%20bump%20%40types%2Freact%20from%2018.0.21%20to%2018.0.25%20(%23%E2%80%A6%0A)

[codecov]

Codecov Report

Merging #1831 (3f38b9b) into main (2a8c6e6) will not change coverage.
The diff coverage is n/a.

@@           Coverage Diff           @@
##             main    #1831   +/-   ##
=======================================
  Coverage   91.20%   91.20%           
=======================================
  Files         170      170           
  Lines        3662     3662           
  Branches     1220     1220           
=======================================
  Hits         3340     3340           
  Misses        303      303           
  Partials       19       19           

[robinmetral]

Update: I noticed that the nonce change (DefinitelyTyped/DefinitelyTyped#62879) was released in @types/react@17.0.52 and upgrading the package in the web app solves the issue.

This wasn't done for the onResize change (DefinitelyTyped/DefinitelyTyped#63076), see DefinitelyTyped/DefinitelyTyped#63076 (comment). If we can't contribute this to the @types package we can surely patch it in the web app, so this revert is probably not necessary—will keep the PR open in draft status for visibility

[robinmetral]

A short-term fix for the issue is to extend the namespace of the React 17 types in apps using Circuit UI:

import { ReactEventHandler } from 'react';

declare global {
  namespace React {
    interface DOMAttributes<T> {
      onResize?: ReactEventHandler<T> | undefined;
      onResizeCapture?: ReactEventHandler<T> | undefined;
    }
  }
}

Downsides here:

• Extending namespaces feels a bit hacky
• It makes it seem like onResize is available in React 17, while it isn't. (This isn't great but unlikely to cause issues, since onResize isn't commonly used. Even if it were, a developer would quickly notice that their onResize handlers are ignored in React 17.)

Let's see if anything better comes out of the conversation over at DefinitelyTyped. But even if nothing does, it feels like downgrading types isn't the solution here, hence, closing this PR.