animations not working

[vijayalakshmiNagaraj]

import React from 'react';
import 'animate.css';
import './style.css';
import { useEffect,useState } from 'react';
import { Image } from '@components';
import { images } from '../ReferenceImages';
import { Animated } from 'react-animated-css';
import 'animate.css'

export const LoginAnimation = () => {
const[isVisi,setISVisi]=useState(false)
console.log(isVisi,"hfvckxbk")

return (

<h1 className='' style={{ height: '500px' }}>
demo

  <div className='col-6'>
 <Animated animationIn="slideInRight" animationOut="fadeOutLeftBig" animationInDuration={800} animationOutDuration={800} isVisible={isVisi} >
    <div> <h1>demo</h1></div>
 </Animated> 
 <button onClick={()=>{setISVisi(!isVisi)}}>click</button>
 <Image src={images.loginImage} className='bg-primary' height={'500px'} />
  </div>
  </div>

</div>

);
};

[QuocVietHa08]

@vijayalakshmiNagaraj Hey there, can you show your package.json to me? I have the same problem with react 18