How to implement mask for cpf and zipcode fields?

Question

Good afternoon! I'm developing a registration form for studies in React and I wanted to use the mask library for the cpf and zip code fields using the react-input-mask lib with the Material UI lib. But I'm having difficulty when implementing the mask. Below is my code.

      <TextField 
        onChange={(event) => setCPF(event.target.value)}
        value={cpf}
        error={!error.cpf.validate}
        helperText={error.cpf.text}
        onBlur={validateFields}
        placeholder='11122233310'
        id='cpf'
        label='CPF'
        name='cpf'
        type='number'
        variant='outlined'
        fullWidth
        margin='normal'
        required
      />

      <TextField 
        value={zipcode}
        onChange={(event) => setZipCode(event.target.value)}
        onBlur={validateFields}
        error={!error.zipcode.validate}
        helperText={error.zipcode.text}
        placeholder='00000-000'
        id='zipcode'
        label='zipcode'
        type='number'
        name='zipcode'
        variant='outlined'
        margin='normal'
        required
      />