How inline (nested) modals should work?

How should work modals? I’m trying to use nested modals (from a modal open another one) and the behavior isn’t as expected. But also, I don’t even know if that concept is a bad practice; if so advices are welcome.


The current behavior (there are two modals in the image):

How ionic renders in console (Modals are at the same level):


The expected behavior:

Any suggestions? Thanks!

To get the expected behavior, I have to manually dropped the second (child) modal inside ion-content tags of first (parent) modal from browser console:

Also, the same behavior occurs when I use ModalController from typescript component.