{"id":51331854,"url":"https://github.com/supabase-community/supabase_auth_ui","last_synced_at":"2026-07-01T23:30:35.498Z","repository":{"id":37800310,"uuid":"501079190","full_name":"supabase-community/supabase_auth_ui","owner":"supabase-community","description":"Supabase Auth UI library for Flutter","archived":false,"fork":false,"pushed_at":"2026-06-23T12:47:21.000Z","size":3552,"stargazers_count":156,"open_issues_count":11,"forks_count":81,"subscribers_count":12,"default_branch":"main","last_synced_at":"2026-06-23T12:55:06.962Z","etag":null,"topics":["authentication","dart","flutter","supabase"],"latest_commit_sha":null,"homepage":"https://supabase.com","language":"Dart","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/supabase-community.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2022-06-08T02:57:38.000Z","updated_at":"2026-06-23T12:47:34.000Z","dependencies_parsed_at":"2024-04-13T01:26:23.789Z","dependency_job_id":"acb24e43-f27f-4a88-82ed-2344d1c05926","html_url":"https://github.com/supabase-community/supabase_auth_ui","commit_stats":{"total_commits":195,"total_committers":24,"mean_commits":8.125,"dds":0.6153846153846154,"last_synced_commit":"1d7c37caae7b274f54c07ee0ab4fe8517075e3ed"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/supabase-community/supabase_auth_ui","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/supabase-community%2Fsupabase_auth_ui","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/supabase-community%2Fsupabase_auth_ui/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/supabase-community%2Fsupabase_auth_ui/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/supabase-community%2Fsupabase_auth_ui/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/supabase-community","download_url":"https://codeload.github.com/supabase-community/supabase_auth_ui/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/supabase-community%2Fsupabase_auth_ui/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":35027339,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-07-01T02:00:05.325Z","response_time":130,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["authentication","dart","flutter","supabase"],"created_at":"2026-07-01T23:30:30.938Z","updated_at":"2026-07-01T23:30:35.490Z","avatar_url":"https://github.com/supabase-community.png","language":"Dart","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cbr /\u003e\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://supabase.com\"\u003e\n    \u003cimg alt=\"Supabase Logo\" width=\"300\" src=\"https://raw.githubusercontent.com/supabase/supabase/master/packages/common/assets/images/logo-preview.jpg\"\u003e\n  \u003c/a\u003e\n\n  \u003ch1 align=\"center\"\u003esupabase_auth_ui\u003c/h1\u003e\n\n  \u003cp align=\"center\"\u003e\n    A simple library of predefined widgets to easily and quickly create auth components using Flutter and \u003ca href=\"https://supabase.com\"\u003eSupabase\u003c/a\u003e.\n  \u003c/p\u003e\n\n  \u003cp align=\"center\"\u003e\n    \u003ca href=\"https://supabase.com/docs/guides/auth\"\u003eGuides\u003c/a\u003e\n    ·\n    \u003ca href=\"https://pub.dev/documentation/supabase_auth_ui/latest/\"\u003eReference Docs\u003c/a\u003e\n  \u003c/p\u003e\n\u003c/p\u003e\n\n\u003cdiv align=\"center\"\u003e\n\n[![Package](https://img.shields.io/pub/v/supabase_auth_ui.svg)](https://pub.dev/packages/supabase_auth_ui)\n[![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](#license)\n\n\u003c/div\u003e\n\n![Supabase Auth UI](https://raw.githubusercontent.com/supabase-community/supabase_auth_ui/main/screenshots/supabase_auth_ui.png 'Supabase Auth UI Sample')\n\n## Email Auth\n\nUse a `SupaEmailAuth` widget to create an email and password signin/ signup form.\nIt also contains a button to toggle to display a forgot password form.\n\nYou can pass `metadataFields` to add additional fields to the signup form to pass as metadata to Supabase.\n\nYou need to setup deep links in your app to if you have enabled email confirmation. Learn more about deep links on the [supabase_flutter README](https://pub.dev/packages/supabase_flutter#deep-links).\n\n```dart\n// Create a Email sign-in/sign-up form\nSupaEmailAuth(\n  redirectTo: kIsWeb ? null : 'io.mydomain.myapp://callback',\n  onSignInComplete: (response) {\n    // do something, for example: navigate('home');\n  },\n  onSignUpComplete: (response) {\n    // do something, for example: navigate(\"wait_for_email\");\n  },\n  metadataFields: [\n    // Creates an additional TextField for string metadata, for example:\n    // {'username': 'exampleUsername'}\n    MetaDataField(\n      prefixIcon: const Icon(Icons.person),\n      label: 'Username',\n      key: 'username',\n      validator: (val) {\n        if (val == null || val.isEmpty) {\n          return 'Please enter something';\n        }\n        return null;\n      },\n    ),\n\n    // Creates a CheckboxListTile for boolean metadata, for example:\n    // {'marketing_consent': true}\n    BooleanMetaDataField(\n      label: 'I wish to receive marketing emails',\n      key: 'marketing_consent',\n      checkboxPosition: ListTileControlAffinity.leading,\n    ),\n    // Supports interactive text. Fields can be marked as required, blocking form\n    // submission unless the checkbox is checked.\n    BooleanMetaDataField(\n      key: 'terms_agreement',\n      isRequired: true,\n      checkboxPosition: ListTileControlAffinity.leading,\n      richLabelSpans: [\n        const TextSpan(\n            text: 'I have read and agree to the '),\n        TextSpan(\n          text: 'Terms and Conditions',\n          style: const TextStyle(\n            color: Colors.blue,\n          ),\n          recognizer: TapGestureRecognizer()\n            ..onTap = () {\n              // do something, for example: navigate(\"terms_and_conditions\");\n            },\n        ),\n      ],\n    ),\n  ],\n)\n```\n\nYou can prefill the email and/or password fields by passing `prefilledEmail` and `prefilledPassword`. The corresponding fields will be initialized with these values, which the user can still edit.\n\n```dart\nSupaEmailAuth(\n  prefilledEmail: 'mail@example.com',\n  prefilledPassword: 'password',\n  onSignInComplete: (response) {\n    // do something, for example: navigate('home');\n  },\n  onSignUpComplete: (response) {\n    // do something, for example: navigate(\"wait_for_email\");\n  },\n),\n```\n\n`SupaEmailAuth` exposes a few more options worth knowing about:\n\n- `passwordValidator`: provide your own password validation function to enforce password rules.\n- `showConfirmPasswordField`: show a \"confirm password\" field on the sign-up form.\n- `useOtpForPasswordRecovery`: recover the password with a one-time code instead of a magic link.\n- `extraMetadata`: pass static metadata on sign up that isn't tied to a form field.\n- `resetPasswordRedirectTo`: the deep link to redirect to after a password reset email.\n- `onPasswordResetEmailSent`, `onToggleSignIn`, `onToggleRecoverPassword`: callbacks for the corresponding events.\n- `prefixIconEmail`, `prefixIconPassword`, `prefixIconOtp`: override the default field icons.\n\n## Magic Link Auth\n\nUse `SupaMagicAuth` widget to create a magic link signIn form. You need to setup deep links in your app to use magic link. Learn more about deep links on the [supabase_flutter README](https://pub.dev/packages/supabase_flutter#deep-links).\n\n```dart\nSupaMagicAuth(\n  redirectUrl: kIsWeb ? null : 'io.supabase.flutter://login-callback/',\n  onSuccess: (Session response) {\n    // do something, for example: navigate('home');\n  },\n  onError: (error) {\n    // do something, for example: navigate(\"wait_for_email\");\n  },\n),\n```\n\n## Reset password\n\nUse `SupaResetPassword` to create a password reset form.\n\n```dart\nSupaResetPassword(\n  accessToken: supabase.auth.currentSession?.accessToken,\n  onSuccess: (UserResponse response) {\n    // do something, for example: navigate('home');\n  },\n  onError: (error) {\n    // do something, for example: navigate(\"wait_for_email\");\n  },\n),\n```\n\n## Phone Auth\n\nUse `SupaPhoneAuth` to create a phone and password sign-in/sign-up form. Pass `SupaAuthAction.signIn` or `SupaAuthAction.signUp` to control which action the form performs.\n\n```dart\nSupaPhoneAuth(\n  authAction: SupaAuthAction.signUp,\n  onSuccess: (AuthResponse response) {\n    // do something, for example: navigate('home');\n  },\n),\n```\n\nAfter signing up, use `SupaVerifyPhone` to verify the phone number with the OTP code that was sent over SMS.\n\n```dart\nSupaVerifyPhone(\n  onSuccess: (AuthResponse response) {\n    // do something, for example: navigate('home');\n  },\n),\n```\n\n## Social Auth\n\nUse `SupaSocialsAuth` to create list of social login buttons. You need to setup deep links in your app to use social auth. Learn more about deep links on the [supabase_flutter README](https://pub.dev/packages/supabase_flutter#deep-links).\n\n```dart\nSupaSocialsAuth(\n    socialProviders: [\n        OAuthProvider.apple,\n        OAuthProvider.google,\n    ],\n    colored: true,\n    redirectUrl: kIsWeb\n          ? null\n          : 'io.supabase.flutter://login-callback/',\n    onSuccess: (Session response) {\n        // do something, for example: navigate('home');\n    },\n    onError: (error) {\n        // do something, for example: navigate(\"wait_for_email\");\n    },\n),\n```\n\n### Native Google and Apple sign in\n\nOn mobile and desktop you can use the native sign in dialogs instead of the\nbrowser-based OAuth flow. `SupaSocialsAuth` falls back to the web OAuth flow on\nany platform where the native flow is not available or not configured, so it is\nsafe to leave these options enabled across all platforms.\n\nBefore wiring up the UI, configure the providers in your Supabase project and\nin each platform as described in the\n[native Google sign in](https://supabase.com/docs/guides/auth/social-login/auth-google?platform=flutter#using-native-sign-in)\nand\n[native Apple sign in](https://supabase.com/docs/guides/auth/social-login/auth-apple?platform=flutter#using-native-sign-in)\nguides.\n\n#### Native Google\n\nNative Google sign in is used when you pass a `nativeGoogleAuthConfig` and the\nclient ID for the current platform is set. Otherwise the web OAuth flow is used.\n\n- On Android, set `webClientId`.\n- On iOS, set `iosClientId`.\n\nThe client IDs are the ones you registered with Google Cloud. See the\n[`google_sign_in`](https://pub.dev/packages/google_sign_in) package for the\nrequired platform setup (iOS URL scheme, etc.).\n\n#### Native Apple\n\nNative Apple sign in is enabled by default (`enableNativeAppleAuth: true`) and is\nused on iOS and macOS. On other platforms the web OAuth flow is used. It requires\nthe \"Sign in with Apple\" capability to be added to your app in Xcode. See the\n[`sign_in_with_apple`](https://pub.dev/packages/sign_in_with_apple) package for\nthe platform setup.\n\n```dart\nSupaSocialsAuth(\n    socialProviders: [\n        OAuthProvider.apple,\n        OAuthProvider.google,\n    ],\n    // Enables native Google sign in on Android and iOS.\n    nativeGoogleAuthConfig: const NativeGoogleAuthConfig(\n        webClientId: 'YOUR_WEB_CLIENT_ID',\n        iosClientId: 'YOUR_IOS_CLIENT_ID',\n    ),\n    // Native Apple sign in is used on iOS and macOS by default.\n    enableNativeAppleAuth: true,\n    onSuccess: (Session response) {\n        // do something, for example: navigate('home');\n    },\n),\n```\n\n`SupaSocialsAuth` also supports:\n\n- `socialButtonVariant`: render the buttons as `SocialButtonVariant.iconAndText` (default) or `SocialButtonVariant.icon` for icon-only buttons.\n- `scopes`: request additional OAuth scopes per provider.\n- `queryParams`: pass custom query parameters per provider.\n- `colored`: use the provider brand colors (defaults to `true`).\n- `authScreenLaunchMode`: control how the OAuth browser screen is launched.\n\n## Theming\n\nThis library uses bare Flutter components so that you can control the appearance of the components using your own theme. The fields and buttons respect your `ThemeData`, so styling them through `InputDecorationTheme`, `ElevatedButtonTheme`, and the rest of your app theme works as expected.\n\nSee the theme example in [`example/lib/sign_in.dart`](example/lib/sign_in.dart).\n\n## Example\n\nA full example app covering every widget is available in the [`example`](example) directory.\n\n## Controlling Form Submission Behavior\n\nAll 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.\n\nBy 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`:\n\n```dart\nSupaEmailAuth(\n  redirectTo: kIsWeb ? null : 'io.mydomain.myapp://callback',\n  enableAutomaticFormSubmission: false, // Disable auto-submit on Enter\n  onSignInComplete: (response) {\n    // do something, for example: navigate('home');\n  },\n  onSignUpComplete: (response) {\n    // do something, for example: navigate(\"wait_for_email\");\n  },\n),\n```\n\nThis applies to all auth components:\n\n```dart\n// Phone Auth\nSupaPhoneAuth(\n  authAction: SupaAuthAction.signIn,\n  enableAutomaticFormSubmission: false,\n  onSuccess: (response) {\n    // handle success\n  },\n),\n\n// Magic Link Auth\nSupaMagicAuth(\n  redirectUrl: kIsWeb ? null : 'io.supabase.flutter://login-callback/',\n  enableAutomaticFormSubmission: false,\n  onSuccess: (Session response) {\n    // handle success\n  },\n),\n\n// Reset Password\nSupaResetPassword(\n  accessToken: supabase.auth.currentSession?.accessToken,\n  enableAutomaticFormSubmission: false,\n  onSuccess: (UserResponse response) {\n    // handle success\n  },\n),\n```\n\n## Localization\n\nThe widgets resolve their strings through Flutter's standard localization\nmechanism. Register `SupabaseAuthUILocalizations.delegate` on your app and the\nstrings are picked from the active locale:\n\n```dart\nMaterialApp(\n  localizationsDelegates: SupabaseAuthUILocalizations.localizationsDelegates,\n  supportedLocales: SupabaseAuthUILocalizations.supportedLocales,\n  home: const MyHomePage(),\n);\n```\n\n`SupabaseAuthUILocalizations.localizationsDelegates` bundles the package\ndelegate together with the `GlobalMaterialLocalizations`,\n`GlobalWidgetsLocalizations`, and `GlobalCupertinoLocalizations` delegates. If\nyou already register your own delegates, add `SupabaseAuthUILocalizations.delegate`\nto your existing list instead.\n\nThe package ships English (`en`) out of the box and falls back to it when no\ndelegate is registered.\n\n### Translating or overriding strings\n\nTo translate the UI or reword it, supply your own\n`LocalizationsDelegate\u003cSupabaseAuthUILocalizations\u003e` that returns a subclass of\n`SupabaseAuthUILocalizations` with the strings you want, and register it before\nthe bundled delegate:\n\n```dart\nclass MyAuthLocalizations extends SupabaseAuthUILocalizations {\n  MyAuthLocalizations() : super('en');\n\n  @override\n  String get signIn =\u003e 'Log in';\n\n  @override\n  String get signUp =\u003e 'Create account';\n\n  // ...override the rest as needed.\n}\n\nclass MyAuthLocalizationsDelegate\n    extends LocalizationsDelegate\u003cSupabaseAuthUILocalizations\u003e {\n  const MyAuthLocalizationsDelegate();\n\n  @override\n  bool isSupported(Locale locale) =\u003e locale.languageCode == 'en';\n\n  @override\n  Future\u003cSupabaseAuthUILocalizations\u003e load(Locale locale) =\u003e\n      SynchronousFuture(MyAuthLocalizations());\n\n  @override\n  bool shouldReload(covariant LocalizationsDelegate old) =\u003e false;\n}\n```\n\nThe social sign-in button labels can be customized per provider through the\n`oAuthButtonLabels` parameter on `SupaSocialsAuth`:\n\n```dart\nSupaSocialsAuth(\n  socialProviders: const [OAuthProvider.azure],\n  oAuthButtonLabels: {OAuthProvider.azure: 'Microsoft (Azure)'},\n  onSuccess: (session) {\n    // do something, for example: navigate('home');\n  },\n),\n```\n\n## Contributing\n\n- Fork the repo on [GitHub](https://github.com/supabase-community/supabase_auth_ui)\n- Clone the project to your own machine\n- Commit changes to your own branch\n- Push your work back up to your fork\n- Submit a Pull request so that we can review your changes and merge\n\n## License\n\nThis repo is licensed under MIT.\n\n## Resources\n\n- [Supabase Flutter SDK (`supabase_flutter`)](https://github.com/supabase/supabase-flutter)\n- [Quickstart: Flutter](https://supabase.com/docs/guides/with-flutter)\n- [Flutter Tutorial: building a Flutter chat app](https://supabase.com/blog/flutter-tutorial-building-a-chat-app)\n- [Flutter Tutorial - Part 2: Authentication and Authorization with RLS](https://supabase.com/blog/flutter-authentication-and-authorization-with-rls)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsupabase-community%2Fsupabase_auth_ui","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsupabase-community%2Fsupabase_auth_ui","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsupabase-community%2Fsupabase_auth_ui/lists"}