feat: Add prefilled email, password to SupaEmailAuth

CHANGELOG.md

@@ -1,3 +1,7 @@
+## Unreleased
+
+- feat: Add `enableAutomaticFormSubmission` flag to prevent automatic form submission when pressing Enter on on-screen keyboard in all auth components (SupaEmailAuth, SupaPhoneAuth, SupaMagicAuth, SupaResetPassword)
+
 ## 0.5.5
 
 - feat: Add Confirm Password Field to SupaEmailAuth Component for Sign-Up Process [#129](https://github.com/supabase-community/flutter-auth-ui/pull/129)

README.md

@@ -133,3 +133,53 @@ SupaSocialsAuth(
 
 This library uses bare Flutter components so that you can control the appearance of the components using your own theme.
 See theme example in example/lib/sign_in.dart
+
+## Controlling Form Submission Behavior
+
+All auth components (`SupaEmailAuth`, `SupaPhoneAuth`, `SupaMagicAuth`, and `SupaResetPassword`) support the `enableAutomaticFormSubmission` parameter to control whether pressing Enter/Done on the on-screen keyboard automatically submits the form.
+
+By default, this is set to `true` for backward compatibility, which means pressing Enter will submit the form. If you want users to be forced to explicitly tap the submit button, set this to `false`:
+
+```dart
+SupaEmailAuth(
+  redirectTo: kIsWeb ? null : 'io.mydomain.myapp://callback',
+  enableAutomaticFormSubmission: false, // Disable auto-submit on Enter
+  onSignInComplete: (response) {
+    // do something, for example: navigate('home');
+  },
+  onSignUpComplete: (response) {
+    // do something, for example: navigate("wait_for_email");
+  },
+),
+```
+
+This applies to all auth components:
+
+```dart
+// Phone Auth
+SupaPhoneAuth(
+  authAction: SupaAuthAction.signIn,
+  enableAutomaticFormSubmission: false,
+  onSuccess: (response) {
+    // handle success
+  },
+),
+
+// Magic Link Auth
+SupaMagicAuth(
+  redirectUrl: kIsWeb ? null : 'io.supabase.flutter://reset-callback/',
+  enableAutomaticFormSubmission: false,
+  onSuccess: (Session response) {
+    // handle success
+  },
+),
+
+// Reset Password
+SupaResetPassword(
+  accessToken: supabase.auth.currentSession?.accessToken,
+  enableAutomaticFormSubmission: false,
+  onSuccess: (UserResponse response) {
+    // handle success
+  },
+),
+```

example/lib/main.dart

@@ -3,10 +3,11 @@ import 'package:flutter/material.dart';
 import 'package:supabase_auth_ui/supabase_auth_ui.dart';
 
 import './home.dart';
-import './sign_in.dart';
 import './magic_link.dart';
+import './phone_sign_in.dart';
+import './sign_in.dart';
+import './sign_in_prefilled.dart';
 import './update_password.dart';
-import 'phone_sign_in.dart';
 import './verify_phone.dart';
 
 void main() async {
@@ -34,14 +35,15 @@ class MyApp extends StatelessWidget {
           border: OutlineInputBorder(),
         ),
       ),
-      initialRoute: '/',
+      initialRoute: '/prefilled',
       routes: {
         '/': (context) => const SignUp(),
         '/magic_link': (context) => const MagicLink(),
         '/update_password': (context) => const UpdatePassword(),
         '/phone_sign_in': (context) => const PhoneSignIn(),
         '/phone_sign_up': (context) => const PhoneSignUp(),
         '/verify_phone': (context) => const VerifyPhone(),
+        '/prefilled': (context) => const SignInPrefilled(),
         '/home': (context) => const Home(),
       },
       onUnknownRoute: (RouteSettings settings) {

example/lib/sign_in_prefilled.dart

@@ -0,0 +1,68 @@
+import 'package:flutter/foundation.dart';
+import 'package:flutter/gestures.dart';
+import 'package:flutter/material.dart';
+import 'package:supabase_auth_ui/supabase_auth_ui.dart';
+
+import 'constants.dart';
+
+class SignInPrefilled extends StatelessWidget {
+  const SignInPrefilled({Key? key}) : super(key: key);
+  @override
+  Widget build(BuildContext context) {
+    void navigateHome(AuthResponse response) {
+      Navigator.of(context).pushReplacementNamed('/home');
+    }
+
+    return Scaffold(
+      appBar: appBar('Sign In (Prefilled)'),
+      body: ListView(
+        padding: const EdgeInsets.all(24.0),
+        children: [
+          SupaEmailAuth(
+            prefilledEmail: "[email protected]",
+            prefilledPassword: "password",
+            redirectTo: kIsWeb ? null : 'io.supabase.flutter://',
+            onSignInComplete: navigateHome,
+            onSignUpComplete: navigateHome,
+            metadataFields: [
+              MetaDataField(
+                prefixIcon: const Icon(Icons.person),
+                label: 'Username',
+                key: 'username',
+                validator: (val) {
+                  if (val == null || val.isEmpty) {
+                    return 'Please enter something';
+                  }
+                  return null;
+                },
+              ),
+              BooleanMetaDataField(
+                label: 'Keep me up to date with the latest news and updates.',
+                key: 'marketing_consent',
+                checkboxPosition: ListTileControlAffinity.leading,
+              ),
+              BooleanMetaDataField(
+                key: 'terms_agreement',
+                isRequired: true,
+                checkboxPosition: ListTileControlAffinity.leading,
+                richLabelSpans: [
+                  const TextSpan(text: 'I have read and agree to the '),
+                  TextSpan(
+                    text: 'Terms and Conditions',
+                    style: const TextStyle(
+                      color: Colors.blue,
+                    ),
+                    recognizer: TapGestureRecognizer()
+                      ..onTap = () {
+                        // Handle tap on Terms and Conditions
+                      },
+                  ),
+                ],
+              ),
+            ],
+          ),
+        ],
+      ),
+    );
+  }
+}