bug: Action sheet does not completely translate off bottom of page with safe areas

[aeharding]

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

v7.x

Current Behavior

When you dismiss an action sheet on a screen with safe areas, the action sheet does not fully transition off the screen before being destroyed.

Once you see it, you cannot unsee :)

Expected Behavior

Action sheet should fully transition off screen before destroy

Steps to Reproduce

1. On device with safe areas, present action sheet
2. Dismiss
3. Observe the very top of action sheet at the bottom of the device viewport disappears because it is not fully off page before being removed

Code Reproduction URL

https://github.com/aeharding/action-sheet-dismiss

Ionic Info

Ionic:

Ionic CLI : 7.1.1 (/Users/aeharding/.nvm/versions/node/v20.8.1/lib/node_modules/@ionic/cli)
Ionic Framework : @ionic/react 7.5.5

Capacitor:

Capacitor CLI : 5.5.1
@capacitor/android : not installed
@capacitor/core : 5.5.1
@capacitor/ios : not installed

Utility:

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

System:

NodeJS : v20.8.1 (/Users/aeharding/.nvm/versions/node/v20.8.1/bin/node)
npm : 10.1.0
OS : macOS Unknown

Additional Information

RPReplay_Final1700098414.MP4

[ionitron-bot]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.