smooth_auth_sheet 0.1.1 copy "smooth_auth_sheet: ^0.1.1" to clipboard
smooth_auth_sheet: ^0.1.1 copied to clipboard

Reusable, modern auth/profile bottom sheet for Flutter with Google-first login CTA.

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:smooth_auth_sheet/smooth_auth_sheet.dart';

void main() => runApp(const ExampleApp());

class ExampleApp extends StatelessWidget {
  const ExampleApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'smooth_auth_sheet Example',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.blue),
        useMaterial3: true,
      ),
      darkTheme: ThemeData(
        colorScheme: ColorScheme.fromSeed(
          seedColor: Colors.blue,
          brightness: Brightness.dark,
        ),
        useMaterial3: true,
      ),
      home: const HomePage(),
      debugShowCheckedModeBanner: false,
    );
  }
}

class HomePage extends StatefulWidget {
  const HomePage({super.key});

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  bool _isLoggedIn = false;
  AuthUserProfile? _profile;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('smooth_auth_sheet Demo'),
      ),
      body: Center(
        child: SingleChildScrollView(
          padding: const EdgeInsets.all(24),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              if (!_isLoggedIn) ...[
                const Icon(Icons.lock_outline, size: 72, color: Colors.grey),
                const SizedBox(height: 24),
                Text(
                  'Not Logged In',
                  style: Theme.of(context).textTheme.headlineSmall,
                ),
                const SizedBox(height: 8),
                Text(
                  'Tap the button below to open the login sheet.',
                  style: Theme.of(context).textTheme.bodyMedium,
                  textAlign: TextAlign.center,
                ),
              ] else ...[
                const Icon(Icons.lock_open_rounded,
                    size: 72, color: Colors.green),
                const SizedBox(height: 24),
                Text(
                  'Welcome, ${_profile?.name ?? "User"}',
                  style: Theme.of(context).textTheme.headlineSmall,
                ),
                const SizedBox(height: 8),
                Text(
                  _profile?.email ?? 'No email',
                  style: Theme.of(context).textTheme.bodyMedium,
                ),
              ],
              const SizedBox(height: 32),
              FilledButton.icon(
                onPressed: _isLoggedIn ? _showProfileSheet : _showLoginSheet,
                icon: Icon(_isLoggedIn ? Icons.person : Icons.login),
                label: Text(_isLoggedIn ? 'View Profile' : 'Sign In'),
              ),
            ],
          ),
        ),
      ),
    );
  }

  void _showLoginSheet() {
    showSmoothAuthSheet<void>(
      context: context,
      child: SmoothAuthSheet(
        mode: AuthSheetMode.login,
        title: 'Sign In Securely',
        subtitle: 'Connect your account to sync across devices.',
        googleButtonLabel: 'Continue with Google',
        secondaryActionLabel: 'Skip for now',
        onGoogleSignIn: () async {
          await Future<void>.delayed(const Duration(milliseconds: 500));
          if (!mounted) return;

          setState(() {
            _isLoggedIn = true;
            _profile = const AuthUserProfile(
              name: 'Elia Zavatta',
              email: 'info@eliazavatta.it',
            );
          });

          Navigator.of(context).pop();
          ScaffoldMessenger.of(context).showSnackBar(
            const SnackBar(content: Text('Signed in successfully!')),
          );
        },
        onSecondaryAction: () async {
          Navigator.of(context).pop();
          ScaffoldMessenger.of(context).showSnackBar(
            const SnackBar(content: Text('Skipped sign-in')),
          );
        },
      ),
    );
  }

  void _showProfileSheet() {
    showSmoothAuthSheet<void>(
      context: context,
      child: SmoothAuthSheet(
        mode: AuthSheetMode.profile,
        profile: _profile,
        profileActions: <Widget>[
          ListTile(
            leading: const Icon(Icons.settings),
            title: const Text('Settings'),
            onTap: () {
              Navigator.of(context).pop();
              ScaffoldMessenger.of(context).showSnackBar(
                const SnackBar(content: Text('Settings opened')),
              );
            },
          ),
          ListTile(
            leading: const Icon(Icons.help),
            title: const Text('Help & Support'),
            onTap: () {
              Navigator.of(context).pop();
              ScaffoldMessenger.of(context).showSnackBar(
                const SnackBar(content: Text('Help opened')),
              );
            },
          ),
        ],
        onLogout: () async {
          setState(() {
            _isLoggedIn = false;
            _profile = null;
          });
          if (mounted) {
            Navigator.of(context).pop();
            ScaffoldMessenger.of(context).showSnackBar(
              const SnackBar(content: Text('Signed out')),
            );
          }
        },
      ),
    );
  }
}
0
likes
150
points
66
downloads

Documentation

API reference

Publisher

unverified uploader

Weekly Downloads

Reusable, modern auth/profile bottom sheet for Flutter with Google-first login CTA.

Repository (GitHub)
View/report issues

Topics

#flutter #authentication #bottom-sheet #login #ui

License

MIT (license)

Dependencies

flutter

More

Packages that depend on smooth_auth_sheet