Toggle password visibility button functionality

by George Y

HTML

<form>
 <span class="suffix-icon" data-testid="input-icon-after" role="button" tabindex="0" aria-label="Toggle password visibility button" aria-pressed="false">
  <svg viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg" height="32" role="img"  class="">
    <title>Eye icon</title>
    <description>Eye icon representing the current status of the toggle password functionality</description>
    <path d="M12.445 16c0-.679.209-1.342.6-1.905a3.531 3.531 0 011.596-1.263 3.678 3.678 0 012.054-.195 3.6 3.6 0 011.821.938c.497.48.836 1.091.973 1.756a3.315 3.315 0 01-.203 1.981 3.46 3.46 0 01-1.31 1.539 3.669 3.669 0 01-3.337.316 3.565 3.565 0 01-1.153-.743 3.421 3.421 0 01-.77-1.112 3.322 3.322 0 01-.27-1.313zM16 18.142c.59 0 1.155-.226 1.572-.628.417-.402.65-.947.65-1.515s-.233-1.114-.65-1.515A2.265 2.265 0 0016 13.857h-.08c.057.136.085.282.08.43 0 .454-.188.89-.521 1.21a1.814 1.814 0 01-1.257.503 1.145 1.145 0 01-.444-.078v.056a2.08 2.08 0 00.164.826c.11.263.274.501.48.702.207.201.453.361.723.47.271.11.562.166.855.167zm-5.35-5.984A7.968 7.968 0 0116 10a7.97 7.97 0 015.35 2.159 10.392 10.392 0 012.581 3.512.826.826 0 010 .658 10.874 10.874 0 01-2.58 3.512A7.965 7.965 0 0116 22a7.963 7.963 0 01-5.35-2.159 10.916 10.916 0 01-2.583-3.512.83.83 0 010-.658 10.428 10.428 0 012.582-3.512zm5.35-.874a6.621 6.621 0 00-4.442 1.814A9.265 9.265 0 009.373 16a9.545 9.545 0 002.185 2.901A6.621 6.621 0 0016 20.715a6.621 6.621 0 004.442-1.814 9.994 9.994 0 002.186-2.9 9.688 9.688 0 00-2.186-2.901A6.621 6.621 0 0016 11.285z" fill="currentColor"></path>
  </svg>
</span>
  
</form>