yakubsubasi/flutter-auth-ui

Supabase Auth UI library for Flutter

flutter-auth-ui 📱

A simple library of predefined widgets to easily and quickly create auth components using Flutter and Supabase.

⚠️ Developer Preview: This is a developer preview and there maybe some breaking changes until we release v1.0.0.

Email Auth

Use a SupaEmailAuth widget to create an email and password signin/ signup form.

You can pass metadataFields to add additional fields to the signup form to pass as metadata to Supabase.

// Create a Signup form
SupaEmailAuth(
    authAction: AuthAction.signUp,
    redirectUrl: kIsWeb
          ? null
          : 'io.supabase.flutter://reset-callback/'
    onSuccess: (GotrueSessionResponse response) { 
        // do something, for example: navigate('home');
    },
    onError: (error) {
        // do something, for example: navigate("wait_for_email");
    },
    metadataFields: [
        MetaDataField(
            prefixIcon: const Icon(Icons.person),
            label: 'Username',
            key: 'username',
            validator: (val) {
                if (val == null || val.isEmpty) {
                return 'Please enter something';
                }
                return null;
            },
        ),
    ],
)
// Create a Signin form
SupaEmailAuth(
    authAction: AuthAction.signIn,
    redirectUrl: kIsWeb
          ? null
          : 'io.supabase.flutter://reset-callback/',
    onSuccess: (GotrueSessionResponse response) { 
        // do something, for example: navigate('home');
    },
    onError: (error) {
        // do something, for example: navigate("wait_for_email");
    },
)

Magic Link Auth

Use SupaMagicAuth widget to create a magic link signIn form.

SupaMagicAuth(
    redirectUrl: kIsWeb
          ? null
          : 'io.supabase.flutter://reset-callback/',
    onSuccess: (Session response) { 
        // do something, for example: navigate('home');
    },
    onError: (error) {
        // do something, for example: navigate("wait_for_email");
    },
)

Reset password

Use SupaResetPassword to create a password reset form.

SupaResetPassword(
    accessToken: session.accessToken,
    redirectUrl: kIsWeb
          ? null
          : 'io.supabase.flutter://reset-callback/',
    onSuccess: (GotrueUserResponse response) { 
        // do something, for example: navigate('home');
    },
    onError: (error) {
        // do something, for example: navigate("wait_for_email");
    },
)

Social Auth

Use SupaSocialsAuth to create list of social login buttons.

SupaSocialsAuth(
    socialProviders: [
        SocialProviders.apple,
        SocialProviders.google,
    ],
    colored: true,
    redirectUrl: kIsWeb
          ? null
          : 'io.supabase.flutter://reset-callback/',
    onSuccess: (Session response) { 
        // do something, for example: navigate('home');
    },
    onError: (error) {
        // do something, for example: navigate("wait_for_email");
    },
)