Angular using vanilla JS implementation, styles hidden

Using the vanilla JS implementation and when I initialise the modal I can see that it gets added to the DOM however it looks like the css is missing some styles to actually make it display, for example the first div of the modal looks like this with properties hidden, opacity 0 etc and child elements are also similar.

.fdJEgN {
    transition: opacity 0.1s ease-in-out 0s;
    text-align: center;
    position: fixed;
    width: 100vw;
    height: 100vh;
    margin-left: -50vw;
    top: 0px;
    left: 50%;
    z-index: 2;
    will-change: opacity;
    background-color: rgba(0, 0, 0, 0.4);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    display: flex;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
}

[useless-token-dev]

had the same issue fixed it by using window.updateWeb3Modal and changing Modal state manually

await window.updateWeb3Modal({ show: true });
await web3Modal.connect();
await window.updateWeb3Modal({ show: false });

[hackyguru]

Thanks for helping out @useless-token-dev 😃 Closing this issue now because W3MV2 is launched and it will be framework agnostic. More details would be included in the docs later.