Prerequisites

• I have read the Contributing Guidelines.
• I agree to follow the Code of Conduct.
• I have searched for existing issues that already report this problem, without success.

Ionic Framework Version

v8.7.3

Current Behavior

Changing the viewport layout (switching between landscape an portrait mode in mobile devices or between mobile and desktop mode in the browser devtools) triggers the presentingElement IonPage animation used when a Card Modal is opened (leaning back into the background) although the modal was never opened.

When the modal is opened the animation works fine. It seems like Ionic detects the viewport change and tries to adapt the card modal and IonPage acting as presenting element, whether it is open (correct) or closed (unwanted behavior). This only occurs in IonPage's that contain a Card Modal.

You can watch this glitch in the following video:

I have also created a stackblitz sandbox with a minimal project to reproduce the problem seen in the video:

https://stackblitz.com/edit/laa3hcpx-qkdepaut

Expected Behavior

If the modal is not opened, viewport changes should not trigger the leaning back animation in the presentingElement IonPage that contains the Card Modal.

Steps to Reproduce

1. Set up an Ionic React project with an IonPage containing a Card Modal or test it in this sandbox
2. Change the viewport dimensions by either:
   -- Switching between landscape and portrait modes in mobile devices
   -- Switching between landscape and portrait modes in the browser devtools.
   -- In Android devices focusing on the IonSearchBar also triggers the error since the virtual keyboard changes the viewport.
3. See how the IonPage animates as if a CarModal is being opened, leaning back, and it stays that way until you open and close the modal or restart the app.

Code Reproduction URL

https://stackblitz.com/edit/laa3hcpx-qkdepaut

Ionic Info

[WARN] You are not in an Ionic project directory. Project context may be missing.

Ionic:

Ionic CLI : 7.2.1

Utility:

cordova-res : not installed globally
native-run : not installed globally

System:

NodeJS : v22.19.0
npm : 11.5.2
OS : Linux 6.8

Additional Information

Please mind that i am only using the Ionic Components in an existing React Project. I am not using Capacitor or any of the other native features. I'm using Ionic version 8.7.3.