Animations not working, autoClose not working

Oddly, animations are not working for me at all. When the toast appears, there is no animation. Similarly, when I manually close the toast, there is an abrupt close with no animation. And because autoClose is dependent on the animation, the toast will never close until triggered manually.

I have the CSS file referenced correctly, and styling seems to work otherwise. My implementation is as follows:

Container:

<ToastContainer
    position="top-right"
    type="error"
    autoClose={4000}
    hideProgressBar={false}
    closeOnClick={true}
    pauseOnHover={true}
/>

Trigger code (tried placing this in various areas in my code with the same result):

toast('message', {
    type: toast.TYPE.ERROR,
    autoClose: 3000,
    hideProgressBar: false,
    pauseOnHover: true,
});

I’ve tried every variation of settings to no avail. This was attempted using the newest versions of Chrome and Safari. What could be going wrong here?

[JustFly1984]

I have CSS modules in my project, and just copied all CSS from the module and added :global prefix to each one. I do not have animations nor autoClose working.

[chiragbhansali]

@fkhadra Can you please add this to the documentation? It might be helpful for people using CSS Modules.