fix: a lot of new features

CHANGELOG.md

@@ -1,3 +1,31 @@
+# 0.0.32
+
+## Breaking
+
+- ImpaktfullDialog `isPrimaryDange` => `primaryButtonType = ImpaktfullDialogPrimaryButtonType.danger`
+
+## Feat
+
+- TextStyleExtension added `withOpacity()` method to override the color opacity
+- ImpaktfullButton now has an `onAccent` property to flag a secondary button that it is shown on an accent color
+- ImpaktfullCheckbox now has the option to override the colors
+- ImpaktfullSwitch now has the option to override the colors
+- ImpaktfullDialog added `padding` & `margin`
+- ImpaktfullListItem added `padding`
+- ImpaktfullSimpleListItem added `padding` & `spacing`
+- ImpaktfullSwitchListItem added `padding` & `spacing`
+- ImpaktfullListView.child added to have a listview with a child instead of children
+- ImpaktfullLoadingIndicator added `custom` constructor where we can pass an `asset` (lottie file asset path)
+- ImpaktfullNavBar added option to mark a navbar as `isFullScreen`
+- ImpaktfullNavBar title nullable to hide the title
+- ImpaktfullScreen added option to mark a navbar as `isFullScreen`
+- ImpaktfullScreen title nullable to hide the title
+- ImpaktfullSeparatedColumn added 2 options: `showFirstSeparator` & `showLastSeparator` to control the visibility of the separators for the first & last item
+
+## Fix
+
+- ImpaktfullNavBarAction use correct color for the icon
+
 # 0.0.31
 
 ## Feat

example/pubspec.lock

@@ -147,7 +147,7 @@ packages:
       path: ".."
       relative: true
     source: path
-    version: "0.0.30"
+    version: "0.0.31"
   integration_test:
     dependency: "direct dev"
     description: flutter

lib/impaktfull_ui.dart

@@ -38,6 +38,7 @@ export 'src/components/time_picker/impaktfull_time_picker.dart';
 export 'src/components/touch_feedback/impaktfull_touch_feedback.dart';
 export 'src/theme/impaktfull_theme_localizer.dart';
 export 'src/theme/impaktfull_theme.dart';
+export 'src/util/extensions/text_style_extensions.dart';
 export 'src/impaktfull_app.dart';
 export 'package:flutter/material.dart';
 export 'package:snacky/snacky.dart';

lib/src/components/button/impaktfull_button.dart

@@ -17,18 +17,21 @@ class ImpaktfullButton extends StatefulWidget {
   final VoidCallback? onTap;
   final AsyncCallback? onAsyncTap;
   final _ButtonType _type;
+  final bool onAccent;
 
   const ImpaktfullButton.primary({
     required this.label,
     this.onTap,
     this.onAsyncTap,
     super.key,
-  }) : _type = _ButtonType.primary;
+  })  : _type = _ButtonType.primary,
+        onAccent = false;
 
   const ImpaktfullButton.secondary({
     required this.label,
     this.onTap,
     this.onAsyncTap,
+    this.onAccent = false,
     super.key,
   }) : _type = _ButtonType.secondary;
 
@@ -37,14 +40,16 @@ class ImpaktfullButton extends StatefulWidget {
     this.onTap,
     this.onAsyncTap,
     super.key,
-  }) : _type = _ButtonType.accent;
+  })  : _type = _ButtonType.accent,
+        onAccent = false;
 
   const ImpaktfullButton.danger({
     required this.label,
     this.onTap,
     this.onAsyncTap,
     super.key,
-  }) : _type = _ButtonType.danger;
+  })  : _type = _ButtonType.danger,
+        onAccent = false;
 
   @override
   State<ImpaktfullButton> createState() => _ImpaktfullButtonState();
@@ -116,6 +121,7 @@ class _ImpaktfullButtonState extends State<ImpaktfullButton> {
   }
 
   ImpaktfullTextStyleTheme _getTextStyle(ImpaktfullTheme theme) {
+    if (widget.onAccent) return theme.textStyles.onAccent1;
     switch (widget._type) {
       case _ButtonType.primary:
         return theme.textStyles.onPrimary;

lib/src/components/checkbox/impaktfull_checkbox.dart

@@ -3,10 +3,18 @@ import 'package:impaktfull_ui/impaktfull_ui.dart';
 class ImpaktfullCheckBox extends StatelessWidget {
   final bool value;
   final ValueChanged<bool> onChanged;
+  final Color? activeColor;
+  final Color? inactiveColor;
+  final Color? checkMarkColor;
+  final Color? backgroundColor;
 
   const ImpaktfullCheckBox({
     required this.value,
     required this.onChanged,
+    this.activeColor,
+    this.inactiveColor,
+    this.checkMarkColor,
+    this.backgroundColor,
     super.key,
   });
 
@@ -18,7 +26,7 @@ class ImpaktfullCheckBox extends StatelessWidget {
           onTap: () => onChanged(!value),
           borderRadius:
               BorderRadius.circular(theme.dimens.switchThumbBorderRadius),
-          color: theme.colors.card,
+          color: backgroundColor ?? theme.colors.card,
           child: SizedBox(
             width: 24,
             height: 24,
@@ -30,7 +38,8 @@ class ImpaktfullCheckBox extends StatelessWidget {
                       borderRadius: BorderRadius.circular(
                           theme.dimens.switchThumbBorderRadius),
                       border: Border.all(
-                        color: theme.colors.accent1TurnedOffState,
+                        color:
+                            inactiveColor ?? theme.colors.accent1TurnedOffState,
                         width: theme.dimens.borderWidth,
                       ),
                     ),
@@ -45,9 +54,9 @@ class ImpaktfullCheckBox extends StatelessWidget {
                       decoration: BoxDecoration(
                         borderRadius: BorderRadius.circular(
                             theme.dimens.switchThumbBorderRadius),
-                        color: theme.colors.accent1,
+                        color: activeColor ?? theme.colors.accent1,
                         border: Border.all(
-                          color: theme.colors.accent1,
+                          color: activeColor ?? theme.colors.accent1,
                           width: theme.dimens.borderWidth,
                         ),
                       ),
@@ -62,7 +71,7 @@ class ImpaktfullCheckBox extends StatelessWidget {
                     child: Center(
                       child: ImpaktfullSvgIcon(
                         asset: theme.assets.icons.check,
-                        color: theme.colors.onAccent1,
+                        color: checkMarkColor ?? theme.colors.onAccent1,
                         size: 20,
                       ),
                     ),

lib/src/components/dialog/impaktfull_dialog.dart

@@ -6,9 +6,11 @@ class ImpaktfullDialog extends StatelessWidget {
   final Widget? child;
   final String? secondaryLabel;
   final String? primaryLabel;
-  final bool isPrimaryDanger;
+  final ImpaktfullDialogPrimaryButtonType primaryButtonType;
   final VoidCallback? onSecondaryTapped;
   final VoidCallback? onPrimaryTapped;
+  final EdgeInsetsGeometry? margin;
+  final EdgeInsetsGeometry? padding;
 
   const ImpaktfullDialog({
     this.title,
@@ -18,7 +20,9 @@ class ImpaktfullDialog extends StatelessWidget {
     this.onSecondaryTapped,
     this.primaryLabel,
     this.onPrimaryTapped,
-    this.isPrimaryDanger = false,
+    this.primaryButtonType = ImpaktfullDialogPrimaryButtonType.primary,
+    this.margin = const EdgeInsets.all(8),
+    this.padding = const EdgeInsets.all(16),
     super.key,
   }) : assert(child != null || title != null || body != null);
 
@@ -30,8 +34,8 @@ class ImpaktfullDialog extends StatelessWidget {
           type: MaterialType.transparency,
           child: Container(
             constraints: const BoxConstraints(maxWidth: 500),
-            margin: const EdgeInsets.all(8),
-            padding: const EdgeInsets.all(16),
+            margin: margin,
+            padding: padding,
             decoration: BoxDecoration(
               color: theme.colors.card,
               borderRadius:
@@ -68,23 +72,38 @@ class ImpaktfullDialog extends StatelessWidget {
                           ),
                         ),
                       ],
-                      if (onPrimaryTapped != null && !isPrimaryDanger) ...[
-                        Expanded(
-                          child: ImpaktfullButton.primary(
-                            label: primaryLabel ??
-                                theme.localizations.current.generalLabelAccept,
-                            onTap: onPrimaryTapped,
+                      if (onPrimaryTapped != null) ...[
+                        if (primaryButtonType ==
+                            ImpaktfullDialogPrimaryButtonType.primary) ...[
+                          Expanded(
+                            child: ImpaktfullButton.primary(
+                              label: primaryLabel ??
+                                  theme
+                                      .localizations.current.generalLabelAccept,
+                              onTap: onPrimaryTapped,
+                            ),
                           ),
-                        ),
-                      ],
-                      if (onPrimaryTapped != null && isPrimaryDanger) ...[
-                        Expanded(
-                          child: ImpaktfullButton.danger(
-                            label: primaryLabel ??
-                                theme.localizations.current.generalLabelAccept,
-                            onTap: onPrimaryTapped,
+                        ] else if (primaryButtonType ==
+                            ImpaktfullDialogPrimaryButtonType.accent) ...[
+                          Expanded(
+                            child: ImpaktfullButton.accent(
+                              label: primaryLabel ??
+                                  theme
+                                      .localizations.current.generalLabelAccept,
+                              onTap: onPrimaryTapped,
+                            ),
                           ),
-                        ),
+                        ] else if (primaryButtonType ==
+                            ImpaktfullDialogPrimaryButtonType.danger) ...[
+                          Expanded(
+                            child: ImpaktfullButton.danger(
+                              label: primaryLabel ??
+                                  theme
+                                      .localizations.current.generalLabelAccept,
+                              onTap: onPrimaryTapped,
+                            ),
+                          ),
+                        ],
                       ],
                     ],
                   ),
@@ -97,3 +116,9 @@ class ImpaktfullDialog extends StatelessWidget {
     );
   }
 }
+
+enum ImpaktfullDialogPrimaryButtonType {
+  primary,
+  accent,
+  danger,
+}

lib/src/components/list_item/impaktfull_list_item.dart

@@ -14,13 +14,18 @@ class ImpaktfullListItem extends StatefulWidget {
   final VoidCallback? onTap;
   final AsyncCallback? onAsyncTap;
   final bool danger;
+  final EdgeInsetsGeometry padding;
 
   const ImpaktfullListItem({
     required this.title,
     this.leadingAsset,
     this.onTap,
     this.onAsyncTap,
     this.subTitle,
+    this.padding = const EdgeInsets.symmetric(
+      horizontal: 16,
+      vertical: 12,
+    ),
     super.key,
   }) : danger = false;
 
@@ -30,6 +35,10 @@ class ImpaktfullListItem extends StatefulWidget {
     this.onTap,
     this.onAsyncTap,
     this.subTitle,
+    this.padding = const EdgeInsets.symmetric(
+      horizontal: 16,
+      vertical: 12,
+    ),
     super.key,
   }) : danger = true;
 
@@ -47,6 +56,7 @@ class _ImpaktfullListItemState extends State<ImpaktfullListItem> {
         title: widget.title,
         subTitle: widget.subTitle,
         danger: widget.danger,
+        padding: widget.padding,
         onTap:
             widget.onAsyncTap == null && widget.onTap == null ? null : _onTap,
         leadingWidget: widget.leadingAsset == null

lib/src/components/list_item/impaktfull_simple_list_item.dart

@@ -12,6 +12,8 @@ class ImpaktfullSimpleListItem extends StatelessWidget {
   final Widget? trailingWidget;
   final VoidCallback? onTap;
   final bool danger;
+  final EdgeInsetsGeometry padding;
+  final double spacing;
 
   const ImpaktfullSimpleListItem({
     required this.title,
@@ -20,6 +22,11 @@ class ImpaktfullSimpleListItem extends StatelessWidget {
     this.leadingWidget,
     this.trailingWidget,
     this.danger = false,
+    this.padding = const EdgeInsets.symmetric(
+      horizontal: 16,
+      vertical: 12,
+    ),
+    this.spacing = 8,
     super.key,
   }) : centerWidget = null;
 
@@ -28,6 +35,11 @@ class ImpaktfullSimpleListItem extends StatelessWidget {
     this.onTap,
     this.leadingWidget,
     this.trailingWidget,
+    this.padding = const EdgeInsets.symmetric(
+      horizontal: 16,
+      vertical: 12,
+    ),
+    this.spacing = 8,
     super.key,
   })  : title = '',
         subTitle = null,
@@ -40,13 +52,10 @@ class ImpaktfullSimpleListItem extends StatelessWidget {
         onTap: onTap,
         color: theme.colors.card,
         child: Padding(
-          padding: const EdgeInsets.symmetric(
-            horizontal: 16,
-            vertical: 12,
-          ),
+          padding: padding,
           child: ImpaktfullAutoLayout.horizontal(
             crossAxisAlignment: CrossAxisAlignment.center,
-            spacing: 8,
+            spacing: spacing,
             children: [
               if (leadingWidget != null) ...[
                 leadingWidget!,
@@ -70,7 +79,9 @@ class ImpaktfullSimpleListItem extends StatelessWidget {
                   ),
                 ),
               ] else ...[
-                centerWidget!,
+                Expanded(
+                  child: centerWidget!,
+                ),
               ],
               if (trailingWidget != null) ...[
                 trailingWidget!,

lib/src/components/list_item/impaktfull_switch_list_item.dart

@@ -10,13 +10,20 @@ class ImpaktfullSwitchListItem extends StatelessWidget {
   final String? leadingAsset;
   final bool value;
   final ValueChanged<bool>? onChanged;
+  final EdgeInsetsGeometry padding;
+  final double spacing;
 
   const ImpaktfullSwitchListItem({
     required this.title,
     required this.value,
     this.onChanged,
     this.subTitle,
     this.leadingAsset,
+    this.padding = const EdgeInsets.symmetric(
+      horizontal: 16,
+      vertical: 12,
+    ),
+    this.spacing = 8,
     super.key,
   });
 
@@ -28,6 +35,8 @@ class ImpaktfullSwitchListItem extends StatelessWidget {
         child: ImpaktfullSimpleListItem(
           title: title,
           subTitle: subTitle,
+          spacing: spacing,
+          padding: padding,
           onTap: () => onChanged?.call(!value),
           leadingWidget: leadingAsset == null
               ? null