fix: only display 1p autofill on email, username and password fields

This commit is contained in:
Scott Wilson
2025-12-08 10:16:27 -08:00
parent a6631217f1
commit 1ffcb484c6

View File

@@ -65,6 +65,12 @@ const inputParentContainerVariants = cva("inline-flex font-inter items-center bo
} }
}); });
const data1pIgnore = (autoComplete?: string) => {
if (!autoComplete) return true;
return !autoComplete.match(/(email|password|username)/i);
};
export type InputProps = Omit<InputHTMLAttributes<HTMLInputElement>, "size"> & export type InputProps = Omit<InputHTMLAttributes<HTMLInputElement>, "size"> &
VariantProps<typeof inputVariants> & VariantProps<typeof inputVariants> &
Props; Props;
@@ -86,6 +92,7 @@ export const Input = forwardRef<HTMLInputElement, InputProps>(
isReadOnly, isReadOnly,
autoCapitalization, autoCapitalization,
warning, warning,
autoComplete,
...props ...props
}, },
ref ref
@@ -116,6 +123,8 @@ export const Input = forwardRef<HTMLInputElement, InputProps>(
readOnly={isReadOnly} readOnly={isReadOnly}
disabled={isDisabled} disabled={isDisabled}
onInput={handleInput} onInput={handleInput}
autoComplete={autoComplete}
data-1p-ignore={data1pIgnore(autoComplete)}
className={twMerge( className={twMerge(
leftIcon ? "pl-10" : "pl-2.5", leftIcon ? "pl-10" : "pl-2.5",
rightIcon || warning ? "pr-10" : "pr-2.5", rightIcon || warning ? "pr-10" : "pr-2.5",