Modal over a Modal - no Backdrop on first one

[vfilatov]

If you put another Modal inside of ModalBody, the parent doesn't get grey. It was working fine in "sveltestrap": "^3.13.0"

https://svelte.dev/repl/f96a0919e17546e4930c52e5d860a6cc?version=3.37.0

[vfilatov]

Looks it got broken in 4.0.0-beta.1 as it still was working in 4.0.0-alpha.5

[vfilatov]

workaround

add container prop to the second Modal

<Modal isOpen={open2} {toggle2} size="sm" container="inline">
    <ModalHeader {toggle2}>Another Modal title</ModalHeader>
    <ModalBody>But, it does not</ModalBody>
    <ModalFooter>
        <Button color="secondary" on:click={toggle2}>Cancel</Button>
    </ModalFooter>
</Modal>

[bestguy]

Thanks, yes we thought defaulting to append to body was a better default, but happy to look at what's breaking here.

[bestguy]

So officially Bootstrap does not support multiple modals, and looking at the backdrop styles Bootstrap provides they use fixed z-index values that are always under the modals - so I'm not clear how it should/could work in this use case.

I'm leaning towards your workaround being the "official" way we could support multiple Modals, and thinking we could close the issue. (We can update docs if useful). Thoughts on this @vfilatov ?

[vfilatov]

I'm fine with close this issue as long as "workaround" works :) Would nice to add an example to the demo page.

[bestguy]

Cool I'll update docs before closing. Thanks for the heads up.