I tried to update the array words in handleEnter by setWord() and putting {text} in a new div. But it doesn't work. {text} didn't update.

import { Typewriter, useTypewriter, Cursor } from 'react-simple-typewriter'
import './terminal.css';

function Terminal() {

  let initialWords = [
    'Welcome to Blabla', 
    '#EnjoyToTheFuture!', 
    '', 
    "I'm going to ask you some questions...are you ready? (y / n)"
  ]

  const [word, setWord] = useState(initialWords);

  const [wrap, setWrap] = useState(false);

  const {text} = useTypewriter({
      words: [word[0], word[1], word[2], word[3]],
      loop: 1,
      typeSpeed: 100,
      cursor: true, 
  },);



  const handleEnter = (e) => {
    if (e.key === 'Enter') {
      let newWords = ['Test']
      setWord(newWords);
      setWrap(true);
    }
  }

  return (
      <div className='m-3 p-3 terminal-cont rounded border '>
          { !wrap ? (
            <div className='text-white h5 text'>{text}  
            { text !== word[3] && <Cursor cursorStyle='_' /> }
            { text === word[3] && <input className='input px-2' type='text' autoFocus onKeyDown={handleEnter}></input> }
          </div> ): (
            <div className='text-white h5 text'>
              {text}
            </div>
            )
          }
      </div>
      
  );
}
  
export default Terminal;