Debes modificar la expresion regular en tu segunda funcion "replace".
e.target.value = e.target.value.replace(/[^\dA-Z]/g, '').replace(/(.{4})/g, '$1 ').trim();
Tu segundo replace es el que añade el espacio que deseas a tu texto, y el valor actual es 4 por lo que incluira un espacio cada 4 caracteres.
e.target.value = e.target.value.replace(/[^\dA-Z]/g, '').replace(/(.{3})/g, '$1 ').trim();
Este segundo fragmento cumple con lo que deseas.
Te recomiendo leer sobre la función "replace" y sobre expresiones regulares para que puedas entenderlas y construirlas o modificarlas para que cumplan con los requerimientos que tengas.
https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Global_Objects/String/replace
https://developer.mozilla.org/es/docs/Web/JavaScript/Guide/Regular_Expressions
https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Global_Objects/RegExp