-
Notifications
You must be signed in to change notification settings - Fork 13.4k
Description
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.x
Current Behavior
Using IonPopover inside an IonModal opened with useIonModal doesn't catch any mouse event.
Expected Behavior
IonPopover should work the same, regardless of where it is used.
Steps to Reproduce
Inside a parent component, I have:
const [open, dismiss] = useIonModal(ModalComponent);
The code of the modal is very simple:
function ModalComponent() {
return <>
<div onClick={console.log}>click</div>
<IonPopover isOpen={true}><div onClick={console.log}>click</div></IonPopover>
</>
}
Clicking on the first div works, whereas clicking on the second doesn't.
Code Reproduction URL
https://stackblitz.com/edit/ek9ubvph?file=src%2Fmain.tsx
Ionic Info
Ionic:
Ionic CLI : 7.2.0 (/Users/user/.nvm/versions/node/v20.18.0/lib/node_modules/@ionic/cli)
Ionic Framework : @ionic/react 8.3.2
Capacitor:
Capacitor CLI : 6.1.2
@capacitor/android : 6.1.2
@capacitor/core : 6.1.2
@capacitor/ios : not installed
Utility:
cordova-res : 0.15.4
native-run : 2.0.1
System:
NodeJS : v20.18.0 (/Users/user/.nvm/versions/node/v20.18.0/bin/node)
npm : 11.0.0
OS : macOS Unknown
Additional Information
No response