ionic-team / ionic-framework

A powerful cross-platform UI toolkit for building native-quality iOS, Android, and Progressive Web Apps with HTML, CSS, and JavaScript.
https://ionicframework.com
MIT License
51.11k stars 13.5k forks source link

bug: Issues with React 19 types #29991

Open aeharding opened 2 weeks ago

aeharding commented 2 weeks ago

Prerequisites

Ionic Framework Version

v8.x

Current Behavior

I've been playing with React 19. I've noticed that Ionic has issues with some of the React 19 types. (This PR is proposed by core React team.)

https://github.com/DefinitelyTyped/DefinitelyTyped/pull/69022

Some components do work, like IonButton. But lots don't, like IonBackButton and IonApp:

'IonBackButton' cannot be used as a JSX component.
  Its type '{ new (props: Props | Readonly<Props>): { context: NavContextState; clickButton: (e: MouseEvent<Element, MouseEvent>) => void; ... 17 more ...; UNSAFE_componentWillUpdate?(nextProps: Readonly<...>, nextState: Readonly<...>, nextContext: any): void; }; new (props: Props, context: any): { ...; }; readonly displayName:...' is not a valid JSX element type.

Expected Behavior

All components work with React 19.

Given that React 19 will be released imminently, I think it would be smart to get ahead of this :)

Steps to Reproduce

  1. Open https://stackblitz.com/edit/i9zdvi-adpda9
  2. Observe type issues with

Code Reproduction URL

https://stackblitz.com/edit/i9zdvi-adpda9

Ionic Info

Running stackblitz

Additional Information

Good news: Ionic works great with 19 so far in my testing, just issues with types :)

tanner-reits commented 2 weeks ago

@aeharding Thanks for letting us know! Since React 19 and the associated types aren't released yet, this will be something we have to wait on for the time being. I'll make sure this is labeled so we can keep track of it and ensure everything is working when React 19 comes around.