kasy-cli 1.10.0 → 1.13.0

package/templates/firebase/ios/Runner/Assets.xcassets/LaunchBackground.imageset/Contents.json

@@ -2,16 +2,17 @@
   "images" : [
     {
       "filename" : "background.png",
-      "idiom" : "universal",
-      "scale" : "1x"
+      "idiom" : "universal"
     },
     {
-      "idiom" : "universal",
-      "scale" : "2x"
-    },
-    {
-      "idiom" : "universal",
-      "scale" : "3x"
+      "appearances" : [
+        {
+          "appearance" : "luminosity",
+          "value" : "dark"
+        }
+      ],
+      "filename" : "darkbackground.png",
+      "idiom" : "universal"
     }
   ],
   "info" : {

package/templates/firebase/ios/Runner/Assets.xcassets/LaunchImage.imageset/Contents.json

@@ -5,15 +5,48 @@
       "idiom" : "universal",
       "scale" : "1x"
     },
+    {
+      "appearances" : [
+        {
+          "appearance" : "luminosity",
+          "value" : "dark"
+        }
+      ],
+      "filename" : "LaunchImageDark.png",
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
     {
       "filename" : "LaunchImage@2x.png",
       "idiom" : "universal",
       "scale" : "2x"
     },
+    {
+      "appearances" : [
+        {
+          "appearance" : "luminosity",
+          "value" : "dark"
+        }
+      ],
+      "filename" : "LaunchImageDark@2x.png",
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
     {
       "filename" : "LaunchImage@3x.png",
       "idiom" : "universal",
       "scale" : "3x"
+    },
+    {
+      "appearances" : [
+        {
+          "appearance" : "luminosity",
+          "value" : "dark"
+        }
+      ],
+      "filename" : "LaunchImageDark@3x.png",
+      "idiom" : "universal",
+      "scale" : "3x"
     }
   ],
   "info" : {

package/templates/firebase/ios/Runner/Base.lproj/LaunchScreen.storyboard

@@ -38,7 +38,7 @@
         </scene>
     </scenes>
     <resources>
-        <image name="LaunchImage" width="2732" height="2732"/>
+        <image name="LaunchImage" width="512" height="512"/>
         <image name="LaunchBackground" width="1" height="1"/>
     </resources>
 </document>

package/templates/firebase/lib/core/initializer/onstart_widget.dart

@@ -64,7 +64,13 @@ class _InitializerState extends ConsumerState<Initializer> {
         Sentry.captureException(e, stackTrace: s);
         ref.read(onStartProvider.notifier).notifyError(e.toString());
       } finally {
-        FlutterNativeSplash.remove();
+        // Defer splash removal until after the next frame is painted so the
+        // onReady widget renders under the splash before it disappears.
+        // Without this, the splash is removed before the new frame paints,
+        // briefly revealing the onLoading widget (visible flash).
+        WidgetsBinding.instance.addPostFrameCallback((_) {
+          FlutterNativeSplash.remove();
+        });
       }
     });
   }

package/templates/firebase/lib/core/theme/providers/theme_provider.dart

@@ -17,13 +17,8 @@ class ThemeProvider extends InheritedNotifier<AppTheme> {
 
   @override
   bool updateShouldNotify(covariant InheritedNotifier<AppTheme> oldWidget) {
-    final isModeChanged = oldWidget.notifier!.mode != notifier!.mode;
-    if (isModeChanged) {
-      // keeep the same theme when switching between light and dark mode while hot reloading
-      notifier!.mode = oldWidget.notifier!.mode;
-      notifier!.setSystemBarColor();
-    }
-    return false;
+    return oldWidget.notifier != notifier ||
+        oldWidget.notifier?.mode != notifier?.mode;
   }
 
   static AppTheme of(BuildContext context) =>
@@ -37,7 +32,7 @@ class ThemeProvider extends InheritedNotifier<AppTheme> {
 ///
 /// Defining a theme for light and dark should only change the colors
 /// not redefining everything. (see ./docs/theme.md)
-class AppTheme with ChangeNotifier {
+class AppTheme with ChangeNotifier, WidgetsBindingObserver {
   final KasyTheme? lightTheme;
   final KasyTheme? darkTheme;
   final SharedPreferences sharedPreferences;
@@ -50,6 +45,7 @@ class AppTheme with ChangeNotifier {
     this.darkTheme,
   }) {
     mode = _loadFromPrefs();
+    WidgetsBinding.instance.addObserver(this);
     setSystemBarColor();
   }
 
@@ -135,25 +131,55 @@ class AppTheme with ChangeNotifier {
     );
   }
 
-  /// automatically toggle between light and dark mode
-  /// call this using AppTheme.of(context).toggle()
-  void toggle() {
-    mode = mode == ThemeMode.light ? ThemeMode.dark : ThemeMode.light;
+  @override
+  void didChangePlatformBrightness() {
+    super.didChangePlatformBrightness();
+    if (mode == ThemeMode.system) {
+      setSystemBarColor();
+      notifyListeners();
+    }
+  }
+
+  @override
+  void dispose() {
+    WidgetsBinding.instance.removeObserver(this);
+    super.dispose();
+  }
+
+  /// Resolves [mode] to either light or dark by reading the system brightness
+  /// when [mode] is [ThemeMode.system].
+  ThemeMode get effectiveMode {
+    if (mode != ThemeMode.system) return mode;
+    final brightness =
+        WidgetsBinding.instance.platformDispatcher.platformBrightness;
+    return brightness == Brightness.dark ? ThemeMode.dark : ThemeMode.light;
+  }
+
+  /// Set the theme mode and persist the preference.
+  void setMode(ThemeMode newMode) {
+    if (mode == newMode) return;
+    mode = newMode;
     _saveInPrefs(mode);
-    notifyListeners();
     setSystemBarColor();
+    notifyListeners();
+  }
+
+  /// Toggle between light and dark based on the effective (visible) mode.
+  /// If the user is in system mode, this picks the opposite of the
+  /// currently displayed brightness and switches out of system mode.
+  void toggle() {
+    final next =
+        effectiveMode == ThemeMode.light ? ThemeMode.dark : ThemeMode.light;
+    setMode(next);
   }
 
   void setSystemBarColor() {
+    final isLight = effectiveMode == ThemeMode.light;
     SystemChrome.setSystemUIOverlayStyle(
       SystemUiOverlayStyle(
         statusBarColor: Colors.transparent,
-        statusBarBrightness:
-            mode == ThemeMode.light ? Brightness.light : Brightness.dark,
-        statusBarIconBrightness:
-            mode == ThemeMode.light ? Brightness.dark : Brightness.light,
-        // statusBarColor: Colors.black, // color for android
-        // statusBarBrightness: Brightness.light, // for ios Dark = white status
+        statusBarBrightness: isLight ? Brightness.light : Brightness.dark,
+        statusBarIconBrightness: isLight ? Brightness.dark : Brightness.light,
       ),
     );
   }
@@ -189,11 +215,7 @@ class AppTheme with ChangeNotifier {
   ThemeData get darkThemeData => darkTheme!.data.materialTheme;
 
   KasyTheme get current {
-    if (mode == ThemeMode.light) {
-      return lightTheme!;
-    } else {
-      return darkTheme!;
-    }
+    return effectiveMode == ThemeMode.dark ? darkTheme! : lightTheme!;
   }
 
   ThemeMode _loadFromPrefs() {
@@ -202,6 +224,8 @@ class AppTheme with ChangeNotifier {
       return ThemeMode.dark;
     } else if (themeMode == ThemeMode.light.name) {
       return ThemeMode.light;
+    } else if (themeMode == ThemeMode.system.name) {
+      return ThemeMode.system;
     }
     return mode;
   }

package/templates/firebase/lib/features/onboarding/ui/components/onboarding_features.dart

@@ -5,11 +5,13 @@ import 'package:kasy_kit/i18n/translations.g.dart';
 class OnboardingFeatureOne extends StatelessWidget {
   final String nextRoute;
   final VoidCallback? onSkip;
+  final VoidCallback? onLogin;
 
   const OnboardingFeatureOne({
     super.key,
     required this.nextRoute,
     this.onSkip,
+    this.onLogin,
   });
 
   @override
@@ -25,6 +27,8 @@ class OnboardingFeatureOne extends StatelessWidget {
       progress: 0.1,
       onSkip: onSkip,
       skipLabel: translations.skip,
+      onSecondary: onLogin,
+      secondaryLabel: onLogin != null ? translations.login : null,
     );
   }
 }

package/templates/firebase/lib/features/onboarding/ui/onboarding_page.dart

@@ -33,6 +33,7 @@ class OnboardingPage extends ConsumerWidget {
               onSkip: () => Navigator.of(context).pushReplacementNamed(
                 'skip_loader',
               ),
+              onLogin: () => ref.read(goRouterProvider).go('/signin'),
             ),
             settings: settings,
           ),

package/templates/firebase/lib/features/onboarding/ui/widgets/onboarding_feature.dart

@@ -20,6 +20,8 @@ class OnboardingStep extends StatelessWidget {
   final bool withBg;
   final VoidCallback? onSkip;
   final String? skipLabel;
+  final VoidCallback? onSecondary;
+  final String? secondaryLabel;
 
   const OnboardingStep({
     super.key,
@@ -35,6 +37,8 @@ class OnboardingStep extends StatelessWidget {
     this.image,
     this.onSkip,
     this.skipLabel,
+    this.onSecondary,
+    this.secondaryLabel,
   });
 
   @override
@@ -128,6 +132,15 @@ class OnboardingStep extends StatelessWidget {
             }
           },
         ),
+        if (onSecondary != null && secondaryLabel != null) ...[
+          const SizedBox(height: KasySpacing.xs),
+          KasyButton(
+            label: secondaryLabel!,
+            variant: KasyButtonVariant.link,
+            expand: true,
+            onPressed: onSecondary,
+          ),
+        ],
       ],
     );
 

package/templates/firebase/lib/features/settings/settings_page.dart

@@ -426,35 +426,175 @@ class HapticFeedbackSwitcher extends ConsumerWidget {
   }
 }
 
-class ThemeSwitcher extends StatefulWidget {
+class ThemeSwitcher extends StatelessWidget {
   const ThemeSwitcher({super.key});
 
+  IconData _iconFor(ThemeMode mode) {
+    switch (mode) {
+      case ThemeMode.system:
+        return KasyIcons.phoneAndroid;
+      case ThemeMode.dark:
+        return KasyIcons.darkMode;
+      case ThemeMode.light:
+        return KasyIcons.lightMode;
+    }
+  }
+
   @override
-  State<ThemeSwitcher> createState() => _ThemeSwitcherState();
+  Widget build(BuildContext context) {
+    final tr = context.t.settings;
+    final theme = ThemeProvider.of(context);
+    final options = <({ThemeMode mode, IconData icon, String label})>[
+      (
+        mode: ThemeMode.system,
+        icon: KasyIcons.phoneAndroid,
+        label: tr.theme_option_system,
+      ),
+      (
+        mode: ThemeMode.light,
+        icon: KasyIcons.lightMode,
+        label: tr.theme_option_light,
+      ),
+      (
+        mode: ThemeMode.dark,
+        icon: KasyIcons.darkMode,
+        label: tr.theme_option_dark,
+      ),
+    ];
+    return Padding(
+      padding: const EdgeInsets.symmetric(vertical: KasySpacing.sm),
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.stretch,
+        children: [
+          Row(
+            children: [
+              Icon(
+                _iconFor(theme.mode),
+                size: 21,
+                color: context.colors.onSurface,
+              ),
+              const SizedBox(width: KasySpacing.sm),
+              Expanded(
+                child: Text(
+                  tr.theme_title,
+                  style: context.textTheme.titleMedium?.copyWith(
+                    color: context.colors.onSurface,
+                  ),
+                ),
+              ),
+            ],
+          ),
+          const SizedBox(height: KasySpacing.sm),
+          _ThemeModeSegmented(
+            current: theme.mode,
+            options: options,
+            onChanged: theme.setMode,
+          ),
+        ],
+      ),
+    );
+  }
 }
 
-class _ThemeSwitcherState extends State<ThemeSwitcher> {
-  bool darkMode = false;
+class _ThemeModeSegmented extends StatelessWidget {
+  const _ThemeModeSegmented({
+    required this.current,
+    required this.options,
+    required this.onChanged,
+  });
+
+  final ThemeMode current;
+  final List<({ThemeMode mode, IconData icon, String label})> options;
+  final ValueChanged<ThemeMode> onChanged;
 
   @override
-  void didChangeDependencies() {
-    super.didChangeDependencies();
-    WidgetsBinding.instance.addPostFrameCallback((_) {
-      darkMode = ThemeProvider.of(context).mode == ThemeMode.dark;
-      setState(() {});
-    });
+  Widget build(BuildContext context) {
+    final trackColor = context.colors.onSurface.withValues(alpha: 0.06);
+    return Container(
+      padding: const EdgeInsets.all(3),
+      decoration: BoxDecoration(
+        color: trackColor,
+        borderRadius: BorderRadius.circular(10),
+      ),
+      child: Row(
+        children: [
+          for (final opt in options)
+            Expanded(
+              child: _ThemeModeSegment(
+                icon: opt.icon,
+                label: opt.label,
+                selected: current == opt.mode,
+                onTap: () => onChanged(opt.mode),
+              ),
+            ),
+        ],
+      ),
+    );
   }
+}
+
+class _ThemeModeSegment extends StatelessWidget {
+  const _ThemeModeSegment({
+    required this.icon,
+    required this.label,
+    required this.selected,
+    required this.onTap,
+  });
+
+  final IconData icon;
+  final String label;
+  final bool selected;
+  final VoidCallback onTap;
 
   @override
   Widget build(BuildContext context) {
-    return SettingsSwitchTile(
-      icon: darkMode ? KasyIcons.darkMode : KasyIcons.lightMode,
-      title: context.t.settings.theme_title,
-      value: darkMode,
-      onChanged: (value) {
-        setState(() => darkMode = value);
-        ThemeProvider.of(context).toggle();
-      },
+    final selectedBg = context.colors.surface;
+    final selectedFg = context.colors.onSurface;
+    final unselectedFg = context.colors.muted;
+    return Semantics(
+      button: true,
+      selected: selected,
+      label: label,
+      child: GestureDetector(
+        onTap: onTap,
+        behavior: HitTestBehavior.opaque,
+        child: AnimatedContainer(
+          duration: const Duration(milliseconds: 160),
+          curve: Curves.easeOut,
+          padding: const EdgeInsets.symmetric(vertical: 8),
+          decoration: BoxDecoration(
+            color: selected ? selectedBg : Colors.transparent,
+            borderRadius: BorderRadius.circular(8),
+            boxShadow: selected
+                ? [
+                    BoxShadow(
+                      color: Colors.black.withValues(alpha: 0.06),
+                      blurRadius: 4,
+                      offset: const Offset(0, 1),
+                    ),
+                  ]
+                : const [],
+          ),
+          child: Column(
+            mainAxisSize: MainAxisSize.min,
+            children: [
+              Icon(
+                icon,
+                size: 18,
+                color: selected ? selectedFg : unselectedFg,
+              ),
+              const SizedBox(height: 2),
+              Text(
+                label,
+                style: context.textTheme.labelSmall?.copyWith(
+                  color: selected ? selectedFg : unselectedFg,
+                  fontWeight: selected ? FontWeight.w600 : FontWeight.w500,
+                ),
+              ),
+            ],
+          ),
+        ),
+      ),
     );
   }
 }

package/templates/firebase/lib/i18n/en.i18n.json

@@ -175,7 +175,8 @@
             "title": "Subscriptions module",
             "description": "Manage subscriptions with premade paywalls",
             "action": "Continue",
-            "skip": "Skip"
+            "skip": "Skip",
+            "login": "Already have an account? Log in"
         },
         "feature_2": {
             "title": "Authentication module",
@@ -321,7 +322,10 @@
             "cancel": "Cancel"
         },
         "language_title": "Languages",
-        "theme_title": "Light/Dark mode",
+        "theme_title": "Theme",
+        "theme_option_system": "System",
+        "theme_option_light": "Light",
+        "theme_option_dark": "Dark",
         "haptic_feedback_title": "Haptic feedback",
         "section_preferences_label": "PREFERENCES",
         "section_security_label": "SECURITY",

package/templates/firebase/lib/i18n/es.i18n.json

@@ -175,7 +175,8 @@
             "title": "Módulo de suscripciones",
             "description": "Gestiona suscripciones con paywalls listos para usar",
             "action": "Continuar",
-            "skip": "Omitir"
+            "skip": "Omitir",
+            "login": "¿Ya tienes cuenta? Iniciar sesión"
         },
         "feature_2": {
             "title": "Módulo de autenticación",
@@ -321,7 +322,10 @@
             "cancel": "Cancelar"
         },
         "language_title": "Idiomas",
-        "theme_title": "Modo claro/oscuro",
+        "theme_title": "Tema",
+        "theme_option_system": "Sistema",
+        "theme_option_light": "Claro",
+        "theme_option_dark": "Oscuro",
         "haptic_feedback_title": "Feedback háptico",
         "section_preferences_label": "PREFERENCIAS",
         "section_security_label": "SEGURIDAD",

package/templates/firebase/lib/i18n/pt.i18n.json

@@ -175,7 +175,8 @@
             "title": "Módulo de assinaturas",
             "description": "Gerencie assinaturas com paywalls prontos para usar",
             "action": "Continuar",
-            "skip": "Pular"
+            "skip": "Pular",
+            "login": "Já tem conta? Entrar"
         },
         "feature_2": {
             "title": "Módulo de autenticação",
@@ -321,7 +322,10 @@
             "cancel": "Cancelar"
         },
         "language_title": "Idiomas",
-        "theme_title": "Modo claro/escuro",
+        "theme_title": "Tema",
+        "theme_option_system": "Sistema",
+        "theme_option_light": "Claro",
+        "theme_option_dark": "Escuro",
         "haptic_feedback_title": "Feedback háptico",
         "section_preferences_label": "PREFERÊNCIAS",
         "section_security_label": "SEGURANÇA",

package/templates/firebase/lib/main.dart

@@ -115,28 +115,47 @@ void run(SharedPreferences prefs) => runApp(
 //   mode: ThemeMode.dark,
 // ),
 // See ./docs/theme.md for more details
-class MyApp extends ConsumerWidget {
+class MyApp extends ConsumerStatefulWidget {
   final SharedPreferences sharedPreferences;
 
   const MyApp({super.key, required this.sharedPreferences});
 
+  @override
+  ConsumerState<MyApp> createState() => _MyAppState();
+}
+
+class _MyAppState extends ConsumerState<MyApp> {
+  late final AppTheme _appTheme;
+
+  @override
+  void initState() {
+    super.initState();
+    _appTheme = AppTheme.uniform(
+      sharedPreferences: widget.sharedPreferences,
+      themeFactory: const UniversalThemeFactory(),
+      lightColors: KasyColors.light(),
+      darkColors: KasyColors.dark(),
+      textTheme: KasyTextTheme.build(),
+      defaultMode: ThemeMode.system,
+    );
+  }
+
+  @override
+  void dispose() {
+    _appTheme.dispose();
+    super.dispose();
+  }
+
   // This widget is the root of your application.
   @override
-  Widget build(BuildContext context, WidgetRef ref) {
+  Widget build(BuildContext context) {
     ErrorWidget.builder = (FlutterErrorDetails details) {
       return AppErrorWidget(error: details);
     };
     final goRouter = ref.watch(goRouterProvider);
 
     return ThemeProvider(
-      notifier: AppTheme.uniform(
-        sharedPreferences: sharedPreferences,
-        themeFactory: const UniversalThemeFactory(),
-        lightColors: KasyColors.light(),
-        darkColors: KasyColors.dark(),
-        textTheme: KasyTextTheme.build(),
-        defaultMode: ThemeMode.light,
-      ),
+      notifier: _appTheme,
       child: Builder(
         builder: (context) {
           return WebDevicePreview.wrap(

package/templates/firebase/pubspec.yaml

@@ -134,16 +134,15 @@ flutter_native_splash:
   color: "#FFFFFF"
   color_dark: "#000000"
   fullscreen: true
-  preserve: true
   ios: true
   android: true
-  image: assets/images/splashscreen.png
-  image_dark: assets/images/splashscreen.png
+  image: assets/images/splash_logo_light.png
+  image_dark: assets/images/splash_logo_dark.png
   android_12:
     color: "#FFFFFF"
     color_dark: "#000000"
-    image: assets/images/splashscreen.png
-    image_dark: assets/images/splashscreen.png
+    image: assets/images/splash_logo_light.png
+    image_dark: assets/images/splash_logo_dark.png
 
   # To add assets to your application, add an assets section, like this:
   # assets:

package/templates/firebase/test/core/data/repositories/user_repository_test.dart

@@ -30,7 +30,7 @@ void main() {
     await tester.runAsync(() async {
       final userRepository = await init();
 
-      final file = await rootBundle.load('assets/images/splashscreen.png');
+      final file = await rootBundle.load('assets/images/splash_logo_light.png');
       final bytes = file.buffer.asUint8List();
       // if you want to create an XFile from bytes
       // final xfile = XFile.fromData(bytes);