ReactJS - InputPass with eye magic button

InputPass.js

import React, { useState } from "react";
import { InputPassword, ButtonViewPassword } from "../globalStyles";

const InputPass = () => {
  const [type, setType] = useState("password");

  function toggle(e) {
    e.preventDefault();
    e.stopPropagation();
    setType(type === "text" ? "password" : "text");
  }

  return (
    <div>
      <InputPassword type={type} />
      <ButtonViewPassword onClick={toggle}>Ver</ButtonViewPassword>
    </div>
  );
};

export default InputPass;