refactor: prefer the shared password field with toggle

Author: FatumaA

lib/src/components/supa_email_auth.dart

@@ -1,5 +1,6 @@
 import 'package:email_validator/email_validator.dart';
 import 'package:flutter/material.dart';
+import 'package:supabase_auth_ui/src/components/_supa_password_field.dart';
 import 'package:supabase_auth_ui/src/localizations/supa_email_auth_localization.dart';
 import 'package:supabase_auth_ui/src/utils/constants.dart';
 import 'package:supabase_flutter/supabase_flutter.dart';
@@ -328,7 +329,10 @@ class _SupaEmailAuthState extends State<SupaEmailAuth> {
             ),
             if (!_isRecoveringPassword) ...[
               spacer(16),
-              TextFormField(
+              SupaPasswordField(
+                controller: _passwordController,
+                labelText: localization.enterPassword,
+                prefixIcon: widget.prefixIconPassword,
                 autofillHints: _isSigningIn
                     ? [AutofillHints.password]
                     : [AutofillHints.newPassword],
@@ -343,12 +347,6 @@ class _SupaEmailAuthState extends State<SupaEmailAuth> {
                       }
                       return null;
                     },
-                decoration: InputDecoration(
-                  prefixIcon: widget.prefixIconPassword,
-                  label: Text(localization.enterPassword),
-                ),
-                obscureText: true,
-                controller: _passwordController,
                 onFieldSubmitted: (_) {
                   if (widget.metadataFields == null || _isSigningIn) {
                     _signInSignUp();
@@ -357,13 +355,10 @@ class _SupaEmailAuthState extends State<SupaEmailAuth> {
               ),
               if (widget.showConfirmPasswordField && !_isSigningIn) ...[
                 spacer(16),
-                TextFormField(
+                SupaPasswordField(
                   controller: _confirmPasswordController,
-                  decoration: InputDecoration(
-                    prefixIcon: widget.prefixIconPassword,
-                    label: Text(localization.confirmPassword),
-                  ),
-                  obscureText: true,
+                  labelText: localization.confirmPassword,
+                  prefixIcon: widget.prefixIconPassword,
                   validator: (value) {
                     if (value != _passwordController.text) {
                       return localization.confirmPasswordError;

lib/src/components/supa_phone_auth.dart

@@ -1,4 +1,5 @@
 import 'package:flutter/material.dart';
+import 'package:supabase_auth_ui/src/components/_supa_password_field.dart';
 import 'package:supabase_auth_ui/src/utils/constants.dart';
 import 'package:supabase_auth_ui/supabase_auth_ui.dart';
 
@@ -10,7 +11,7 @@ class SupaPhoneAuth extends StatefulWidget {
   /// Method to be called when the auth action is success
   final void Function(AuthResponse response) onSuccess;
 
-  /// Method to be called when the auth action threw an excepction
+  /// Method to be called when the auth action threw an exception
   final void Function(Object error)? onError;
 
   /// Localization for the form
@@ -71,7 +72,10 @@ class _SupaPhoneAuthState extends State<SupaPhoneAuth> {
               controller: _phone,
             ),
             spacer(16),
-            TextFormField(
+            SupaPasswordField(
+              controller: _password,
+              labelText: localization.enterPassword,
+              prefixIcon: const Icon(Icons.lock),
               autofillHints: isSigningIn
                   ? [AutofillHints.password]
                   : [AutofillHints.newPassword],
@@ -82,12 +86,6 @@ class _SupaPhoneAuthState extends State<SupaPhoneAuth> {
                 }
                 return null;
               },
-              decoration: InputDecoration(
-                prefixIcon: const Icon(Icons.lock),
-                label: Text(localization.enterPassword),
-              ),
-              obscureText: true,
-              controller: _password,
             ),
             spacer(16),
             ElevatedButton(

lib/src/components/supa_reset_password.dart

@@ -1,4 +1,5 @@
 import 'package:flutter/material.dart';
+import 'package:supabase_auth_ui/src/components/_supa_password_field.dart';
 import 'package:supabase_auth_ui/src/localizations/supa_reset_password_localization.dart';
 import 'package:supabase_auth_ui/src/utils/constants.dart';
 import 'package:supabase_flutter/supabase_flutter.dart';
@@ -47,19 +48,17 @@ class _SupaResetPasswordState extends State<SupaResetPassword> {
       child: Column(
         crossAxisAlignment: CrossAxisAlignment.stretch,
         children: [
-          TextFormField(
+          SupaPasswordField(
+            controller: _password,
+            labelText: localization.enterPassword,
+            prefixIcon: const Icon(Icons.lock),
             autofillHints: const [AutofillHints.newPassword],
             validator: (value) {
               if (value == null || value.isEmpty || value.length < 6) {
                 return localization.passwordLengthError;
               }
               return null;
             },
-            decoration: InputDecoration(
-              prefixIcon: const Icon(Icons.lock),
-              label: Text(localization.enterPassword),
-            ),
-            controller: _password,
           ),
           spacer(16),
           ElevatedButton(