v6.10.0

CHANGELOG.md

@@ -1,3 +1,12 @@
+## [6.10.0] - 2024-12-16
+
+* New `NyTextStyle` class
+* New `NyColor` class
+* Update form picker, form chips and checkbox to support light and dark colors better
+* New `NyColor.resolveColor` method
+* Remove `Nylo.package` method
+* New `getAuthKey()` method
+
 ## [6.9.1] - 2024-12-13
 
 * Update `delete` request to support optional parameters

lib/helpers/ny_color.dart

@@ -0,0 +1,46 @@
+import 'package:flutter/material.dart';
+import 'package:theme_provider/theme_provider.dart';
+
+import '/themes/base_theme_config.dart';
+import '/helpers/extensions.dart';
+import 'helper.dart';
+
+/// Helper to find correct color from the [context].
+class NyColor {
+  final Color? light;
+  final Color? dark;
+
+  NyColor({this.light, this.dark});
+
+  /// Get the color based on the device mode
+  Color? toColor(BuildContext context) {
+    return resolveColor(context, light: light, dark: dark);
+  }
+
+  /// Get the color based on the device mode
+  static Color? resolveColor(BuildContext context,
+      {Color? light, Color? dark}) {
+    bool isDarkModeEnabled = false;
+    ThemeController themeController = ThemeProvider.controllerOf(context);
+
+    if (themeController.currentThemeId == getEnv('DARK_THEME_ID')) {
+      isDarkModeEnabled = true;
+    }
+
+    if ((themeController.theme.options as NyThemeOptions).meta is Map &&
+        (themeController.theme.options as NyThemeOptions).meta['type'] ==
+            NyThemeType.dark) {
+      isDarkModeEnabled = true;
+    }
+
+    if (context.isDeviceInDarkMode) {
+      isDarkModeEnabled = true;
+    }
+
+    if (isDarkModeEnabled) {
+      return dark;
+    }
+
+    return light;
+  }
+}

lib/helpers/ny_text_style.dart

@@ -0,0 +1,91 @@
+import 'package:flutter/material.dart';
+import 'package:nylo_support/helpers/ny_color.dart';
+
+/// Helper to define text styles
+class NyTextStyle {
+  final bool inherit;
+  final NyColor? color;
+  final NyColor? backgroundColor;
+  final double? fontSize;
+  final FontWeight? fontWeight;
+  final FontStyle? fontStyle;
+  final double? letterSpacing;
+  final double? wordSpacing;
+  final TextBaseline? textBaseline;
+  final double? height;
+  final TextLeadingDistribution? leadingDistribution;
+  final Locale? locale;
+  final Paint? foreground;
+  final Paint? background;
+  final List<Shadow>? shadows;
+  final List<FontFeature>? fontFeatures;
+  final List<FontVariation>? fontVariations;
+  final TextDecoration? decoration;
+  final NyColor? decorationColor;
+  final TextDecorationStyle? decorationStyle;
+  final double? decorationThickness;
+  final String? debugLabel;
+  final TextOverflow? overflow;
+  final String? fontFamily;
+  final List<String>? fontFamilyFallback;
+  final String? package;
+
+  NyTextStyle(
+      {this.inherit = true,
+      this.color,
+      this.backgroundColor,
+      this.fontSize,
+      this.fontWeight,
+      this.fontStyle,
+      this.letterSpacing,
+      this.wordSpacing,
+      this.textBaseline,
+      this.height,
+      this.leadingDistribution,
+      this.locale,
+      this.foreground,
+      this.background,
+      this.shadows,
+      this.fontFeatures,
+      this.fontVariations,
+      this.decoration,
+      this.decorationColor,
+      this.decorationStyle,
+      this.decorationThickness,
+      this.debugLabel,
+      this.fontFamily,
+      this.fontFamilyFallback,
+      this.package,
+      this.overflow});
+
+  TextStyle toTextStyle(BuildContext context) {
+    return TextStyle(
+      inherit: inherit,
+      color: color?.toColor(context),
+      backgroundColor: backgroundColor?.toColor(context),
+      fontSize: fontSize,
+      fontWeight: fontWeight,
+      fontStyle: fontStyle,
+      letterSpacing: letterSpacing,
+      wordSpacing: wordSpacing,
+      textBaseline: textBaseline,
+      height: height,
+      leadingDistribution: leadingDistribution,
+      locale: locale,
+      foreground: foreground,
+      background: background,
+      shadows: shadows,
+      fontFeatures: fontFeatures,
+      fontVariations: fontVariations,
+      decoration: decoration,
+      decorationColor: decorationColor?.toColor(context),
+      decorationStyle: decorationStyle,
+      decorationThickness: decorationThickness,
+      debugLabel: debugLabel,
+      fontFamily: fontFamily,
+      fontFamilyFallback: fontFamilyFallback,
+      package: package,
+      overflow: overflow,
+    );
+  }
+}

lib/nylo.dart

@@ -550,14 +550,7 @@ class Nylo {
     return nyloApp;
   }
 
-  /// Initialize package
-  static Nylo package() {
-    dotenv.testLoad();
-    Nylo nyloApp = Nylo();
-    Backpack.instance.save("nylo", nyloApp);
-    return nyloApp;
-  }
-
+  /// Initialize local notifications
   initializeLocalNotifications() async {
     return await _localNotifications?.initialize(
       _initializationSettings!,
@@ -805,6 +798,11 @@ class Nylo {
     return instance.authStorageKey!;
   }
 
+  /// Get the auth key
+  String? getAuthKey() {
+    return authStorageKey;
+  }
+
   /// Add an auth key to the Nylo instance
   addAuthKey(String key) {
     authStorageKey = key;

lib/widgets/fields/field_base_state.dart

@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:nylo_support/helpers/extensions.dart';
 import 'package:theme_provider/theme_provider.dart';
+import '../../helpers/ny_color.dart';
 import '/helpers/helper.dart';
 import '/themes/base_theme_config.dart';
 import '/widgets/ny_form.dart';
@@ -31,6 +32,9 @@ abstract class FieldBaseState<T extends StatefulWidget> extends State<T> {
       return null;
     }
     Color? thumbColorMetaData = color(light: colorMetaData, dark: Colors.black);
+    if (thumbColorMetaData == null) {
+      return null;
+    }
     return WidgetStateProperty.all(thumbColorMetaData);
   }
 
@@ -81,29 +85,8 @@ abstract class FieldBaseState<T extends StatefulWidget> extends State<T> {
   }
 
   /// Get the color based on the device mode
-  Color color({Color? light, Color? dark}) {
-    bool isDarkModeEnabled = false;
-    ThemeController themeController = ThemeProvider.controllerOf(context);
-
-    if (themeController.currentThemeId == getEnv('DARK_THEME_ID')) {
-      isDarkModeEnabled = true;
-    }
-
-    if ((themeController.theme.options as NyThemeOptions).meta is Map &&
-        (themeController.theme.options as NyThemeOptions).meta['type'] ==
-            NyThemeType.dark) {
-      isDarkModeEnabled = true;
-    }
-
-    if (context.isDeviceInDarkMode) {
-      isDarkModeEnabled = true;
-    }
-
-    if (isDarkModeEnabled) {
-      return dark ?? Colors.black38;
-    }
-
-    return light ?? Colors.grey.shade100;
+  Color? color({Color? light, Color? dark}) {
+    return NyColor.resolveColor(context, light: light, dark: dark);
   }
 
   /// When the theme is in [light] mode, return [light] function, else return [dark] function

lib/widgets/fields/form_checkbox.dart

@@ -177,7 +177,9 @@ class _NyFormCheckboxState extends FieldBaseState<NyFormCheckbox> {
       side: whenTheme(
           light: () => getFieldMeta('side', null),
           dark: () => BorderSide(
-              width: 2, color: color(light: Colors.black, dark: Colors.white))),
+              width: 2,
+              color: color(light: Colors.black, dark: Colors.white) ??
+                  const Color(0xFF000000))),
       isError: getFieldMeta('isError', false),
       enabled: getFieldMeta('enabled', null),
       tileColor: getFieldMeta('tileColor', null),

lib/widgets/fields/form_chips.dart

@@ -106,9 +106,11 @@ class _NyFormChipState extends FieldBaseState<NyFormChip> {
               selectedShadowColor: Colors.transparent,
               color: WidgetStateColor.resolveWith((_) {
                 return color(
-                    light:
-                        isSelected ? getSelectedColor() : getBackgroundColor(),
-                    dark: surfaceColorDark);
+                        light: isSelected
+                            ? getSelectedColor()
+                            : getBackgroundColor(),
+                        dark: surfaceColorDark) ??
+                    const Color(0xFF000000);
               }),
               onSelected: (bool selected) {
                 setState(() {
@@ -134,7 +136,7 @@ class _NyFormChipState extends FieldBaseState<NyFormChip> {
   Color getBackgroundColor() => getFieldMeta("backgroundColor", Colors.white);
 
   /// Get the selected color from the field
-  Color getSelectedColor() => getFieldMeta(
+  Color? getSelectedColor() => getFieldMeta(
       "selectedColor", color(light: Colors.black, dark: Colors.white));
 
   /// Get the borderRadius from the field

lib/widgets/fields/form_picker.dart

@@ -1,4 +1,7 @@
 import 'package:flutter/material.dart';
+import 'package:nylo_support/helpers/ny_color.dart';
+import 'package:nylo_support/helpers/ny_text_style.dart';
+import 'package:nylo_support/widgets/styles/bottom_modal_sheet_style.dart';
 import '/helpers/extensions.dart';
 import '/localization/app_localization.dart';
 import '/widgets/fields/field_base_state.dart';
@@ -8,14 +11,16 @@ import 'package:recase/recase.dart';
 /// A [NyFormPicker] widget for Form Fields
 class NyFormPicker extends StatefulWidget {
   /// Creates a [NyFormPicker] widget
-  NyFormPicker(
-      {super.key,
-      required String name,
-      required List<String> options,
-      String? selectedValue,
-      this.onChanged})
-      : field = Field(name, value: selectedValue)
-          ..cast = FormCast.picker(options: options);
+  NyFormPicker({
+    super.key,
+    required String name,
+    required List<String> options,
+    String? selectedValue,
+    BottomModalSheetStyle? bottomModalSheetStyle,
+    this.onChanged,
+  }) : field = Field(name, value: selectedValue)
+          ..cast = FormCast.picker(
+              options: options, bottomModalSheetStyle: bottomModalSheetStyle);
 
   /// Creates a [NyFormPicker] widget from a [Field]
   const NyFormPicker.fromField(this.field, this.onChanged, {super.key});
@@ -153,14 +158,56 @@ class _NyFormPickerState extends FieldBaseState<NyFormPicker> {
     return List<String>.from(widget.field.cast.metaData!["options"]);
   }
 
+  // Get the color from the field meta
+  Color? findColorFromMeta(String name, {Color? defaultColor}) {
+    if (getFieldMeta<NyColor?>(name, null) != null) {
+      NyColor nyColor = getFieldMeta<NyColor?>(name, null)!;
+      return color(light: nyColor.light, dark: nyColor.dark);
+    }
+    return defaultColor;
+  }
+
+  // Get the color from the field meta
+  TextStyle? findTextStyleFromMeta(String name,
+      {NyTextStyle? defaultTextStyle}) {
+    if (getFieldMeta<NyTextStyle?>(name, null) != null) {
+      NyTextStyle textStyle = getFieldMeta<NyTextStyle?>(name, null)!;
+      return textStyle.toTextStyle(context);
+    }
+    return defaultTextStyle?.toTextStyle(context);
+  }
+
   /// Select a value from the list of options
   _selectValue(BuildContext context) {
     // get the list of values
     List<String> values = getOptions();
 
+    // colors
+    Color? backgroundColor = findColorFromMeta('bm_backgroundColor');
+    Color? barrierColor =
+        findColorFromMeta('bm_barrierColor', defaultColor: null);
+
+    // text styles
+    TextStyle? titleTextStyle = findTextStyleFromMeta('bm_titleTextStyle',
+        defaultTextStyle: NyTextStyle(
+            fontWeight: FontWeight.bold,
+            color: NyColor(light: Colors.black, dark: Colors.white)));
+    TextStyle? itemStyle = findTextStyleFromMeta('bm_itemStyle',
+        defaultTextStyle: NyTextStyle(
+            color: NyColor(light: Colors.black87, dark: Colors.white),
+            fontWeight: FontWeight.bold,
+            fontSize: 14));
+    TextStyle? clearButtonStyle = findTextStyleFromMeta('bm_clearButtonStyle',
+        defaultTextStyle: NyTextStyle(
+            fontSize: 13, color: NyColor(light: Colors.red, dark: Colors.red)));
+
     // show modal bottom sheet
     showModalBottomSheet<void>(
       context: context,
+      backgroundColor: backgroundColor,
+      barrierColor: barrierColor,
+      useRootNavigator: getFieldMeta('bm_useRootNavigator', false),
+      routeSettings: getFieldMeta('bm_routeSettings', null),
       builder: (BuildContext context) {
         return SafeArea(
           child: Container(
@@ -169,7 +216,7 @@ class _NyFormPickerState extends FieldBaseState<NyFormPicker> {
             decoration: BoxDecoration(
               borderRadius: const BorderRadius.only(
                   topLeft: Radius.circular(20), topRight: Radius.circular(20)),
-              color: color(light: Colors.white, dark: surfaceColorDark),
+              color: backgroundColor,
             ),
             padding: const EdgeInsets.symmetric(vertical: 20, horizontal: 20),
             child: Column(
@@ -183,14 +230,11 @@ class _NyFormPickerState extends FieldBaseState<NyFormPicker> {
                     Text(
                       widget.field.name.tr(),
                       textAlign: TextAlign.center,
-                      style: TextStyle(
-                          fontWeight: FontWeight.bold,
-                          color:
-                              color(light: Colors.black, dark: Colors.white)),
+                      style: titleTextStyle,
                     ).paddingOnly(top: 10),
                     Text(
                       "Clear".tr(),
-                      style: const TextStyle(fontSize: 13, color: Colors.red),
+                      style: clearButtonStyle,
                     ).onTap(() {
                       setState(() {
                         currentValue = null;
@@ -210,12 +254,7 @@ class _NyFormPickerState extends FieldBaseState<NyFormPicker> {
                           return ListTile(
                             title: Text(
                               item,
-                              style: TextStyle(
-                                  color: color(
-                                      light: Colors.black87,
-                                      dark: Colors.white),
-                                  fontWeight: FontWeight.bold,
-                                  fontSize: 14),
+                              style: itemStyle,
                             ),
                             onTap: () {
                               if (widget.onChanged != null) {