Disable password managers on some password forms (#503)

* Update index.tsx

add the data-lpignore attribute to the password component and remove redundant {} on autoComplete

* Update index.tsx

* add other password managers and disable ignore on main login

src/components/forms/passwd/index.tsx

@@ -8,6 +8,8 @@ type PasswdProps = JSX.IntrinsicElements["input"] & {
   locked?: boolean;
   /** This is optional in case an onChange override is necessary... */
   setValue?: React.Dispatch<React.SetStateAction<string>>;
+  /** Whether to ignore password managers */
+  ignorePasswordManager?: boolean;
 };
 
 type PasswdRef = HTMLInputElement;
@@ -22,16 +24,27 @@ export const Passwd = forwardRef<PasswdRef, PasswdProps>(
       setValue,
       placeholder,
       locked = false,
+      ignorePasswordManager = true,
       ...restProps
     }: PasswdProps,
     ref,
   ) => {
     const [reveal, setReveal] = useState(false);
 
+    // Create object with conditional password manager attributes
+    const passwordManagerAttributes = ignorePasswordManager
+      ? {
+          "data-lpignore": "true",
+          "data-1p-ignore": "",
+          "data-form-type": "other",
+          "data-bwignore": "",
+        }
+      : {};
+
     return (
       <div className="passwd">
         <input
-          autoComplete={"off"}
+          autoComplete="off"
           ref={ref}
           type={reveal ? "text" : "password"}
           name={name}
@@ -43,6 +56,7 @@ export const Passwd = forwardRef<PasswdRef, PasswdProps>(
             }
           }}
           {...restProps}
+          {...passwordManagerAttributes}
         />
         {!locked && (
           <button

src/containers/login/login.tsx

@@ -99,6 +99,7 @@ export const Login = () => {
           value={password}
           placeholder="Password"
           setValue={setPassword}
+          ignorePasswordManager={false}
         />
         {message && <Message message={message} />}
         <Button type="submit">Log in</Button>