I've two files one is "Expertise.jsx" and another one is "AnimatedContentBox.jsx".

This is how "Expertise.jsx" looks like

export default function Expertise(){
    return (
        <div className="expertise">
            <div className="container">
                {
                <>
                <AnimatedContentBox list={"item1","item2","item3"}/>
                </>
                }   
            </div>
        </div>
    );
}

And this is "AnimatedContentBox.jsx"

export default function AnimatedContentBox(props){
    console.log(props.list);
    const listItems = numbers.map((number) =>  <li>{number}</li>);
    return (
        <div className="list"> 
            <ul>
                {listItems}
            </ul>
        </div>
}