Property 'type' does not exist on type 'never'.ts(2339) showing this typescript error while the property type is existing on dom element

Question

import React, { useRef, useState } from 'react'
import style from '../styles/signup.module.scss';

export default function signup() {
  const cPasswordRef = useRef(null)

  const showPassword = (event:any) => {
    if(event.target.checked){
      cPasswordRef.current!.type = "text"; 
    }else{
      cPasswordRef.current!.type = "password"
    }
  }
  return (
    <div className={style.container}>
      <form className={style.regForm}>
            <label className={style.label} htmlFor="c-password">Confirm Password</label>
            <input className={style.textInput} type="password" ref={cPasswordRef} name='c-password' id='c-password' />
         
            <div className={style.showPasswordWrapper}>
              <input type="checkbox" onClick={showPassword} name='show-password' id='show-password' />
              <label htmlFor="show-password">Show password</label>
            </div>
      </form>
    </div>
  )
}

HERE THE TYPE IS COMES FROM DOM PROPERTY BUT TYPESCRIPT THROW THE ERROR TYPE DOESN"T EXIST

Type field is exiting in the ref.current but typescript says its not exist