TF-1714 Change ButtonBuilder to TMailButton widget

(cherry picked from commit fd536ff648370a60ef89d4428fedd949a3e62ae7)

core/lib/core.dart

@@ -52,7 +52,6 @@ export 'presentation/views/text/rich_text_builder.dart';
 export 'presentation/views/text/text_overflow_builder.dart';
 export 'presentation/views/responsive/responsive_widget.dart';
 export 'presentation/views/list/tree_view.dart';
-export 'presentation/views/button/button_builder.dart';
 export 'presentation/views/button/icon_button_web.dart';
 export 'presentation/views/button/tmail_button_widget.dart';
 export 'presentation/views/image/avatar_builder.dart';

core/lib/presentation/extensions/color_extension.dart

@@ -200,6 +200,7 @@ extension AppColor on Color {
   static const colorMailto = Color(0xFFB3B3B3);
   static const colorEventDescriptionBackground = Color(0x05000000);
   static const colorLabelQuotas = Color(0xFF818C99);
+  static const colorLabelCancelButton = Color(0xFFAEB7C2);
 
   static const mapGradientColor = [
     [Color(0xFF21D4FD), Color(0xFFB721FF)],

core/lib/presentation/views/button/button_builder.dart

@@ -1,187 +0,0 @@
-
-import 'package:core/core.dart';
-import 'package:flutter/material.dart';
-import 'package:flutter_svg/flutter_svg.dart';
-
-typedef OnPressActionClick = void Function();
-typedef OnPressActionWithPositionClick = void Function(RelativeRect? position);
-
-class ButtonBuilder {
-  OnPressActionClick? _onPressActionClick;
-  OnPressActionWithPositionClick? _onPressActionWithPositionClick;
-
-  BuildContext? _context;
-  final String? _icon;
-  String? _text;
-  double? _size;
-  EdgeInsets? _paddingIcon;
-  bool? _isVertical;
-  Key? _key;
-  Color? _iconColor;
-  TextStyle? _textStyle;
-  BoxDecoration? _decoration;
-  Widget? _iconAction;
-  double? _radiusSplash;
-  double? _maxWidth;
-  EdgeInsets? _padding;
-  EdgeInsets? _margin;
-  String? _tooltip;
-  BoxConstraints? _constraints;
-
-  void key(Key key) {
-    _key = key;
-  }
-
-  void context(BuildContext context) {
-    _context = context;
-  }
-
-  void size(double? size) {
-    _size = size;
-  }
-
-  void maxWidth(double? size) {
-    _maxWidth = size;
-  }
-
-  void iconColor(Color color) {
-    _iconColor = color;
-  }
-
-  void decoration(BoxDecoration decoration) {
-    _decoration = decoration;
-  }
-
-  void addIconAction(Widget icon) {
-    _iconAction = icon;
-  }
-
-  void radiusSplash(double? radius) {
-    _radiusSplash = radius;
-  }
-
-  void padding(EdgeInsets? padding) {
-    _padding = padding;
-  }
-
-  void margin(EdgeInsets? margin) {
-    _margin = margin;
-  }
-
-  void textStyle(TextStyle style) {
-    _textStyle = style;
-  }
-
-  void paddingIcon(EdgeInsets paddingIcon) {
-    _paddingIcon = paddingIcon;
-  }
-
-  void text(String? text, {required bool isVertical}) {
-    _text = text;
-    _isVertical = isVertical;
-  }
-
-  void tooltip(String? message) {
-    _tooltip = message;
-  }
-
-  void addBoxConstraints(BoxConstraints? constraints) {
-    _constraints = constraints;
-  }
-
-  ButtonBuilder(this._icon);
-
-  void onPressActionClick(OnPressActionClick onPressActionClick) {
-    _onPressActionClick = onPressActionClick;
-  }
-
-  void addOnPressActionWithPositionClick(OnPressActionWithPositionClick onPressActionClick) {
-    _onPressActionWithPositionClick = onPressActionClick;
-  }
-
-  Widget build() {
-    return Padding(
-      padding: _margin ?? EdgeInsets.zero,
-      child: Material(
-        color: Colors.transparent,
-        child: InkWell(
-          onTap: _onPressActionClick,
-          onTapDown: (detail) {
-            if (_onPressActionWithPositionClick != null && _context != null) {
-              final screenSize = MediaQuery.of(_context!).size;
-              final offset = detail.globalPosition;
-              final position = RelativeRect.fromLTRB(
-                offset.dx,
-                offset.dy,
-                screenSize.width - offset.dx,
-                screenSize.height - offset.dy,
-              );
-              _onPressActionWithPositionClick?.call(position);
-            }
-          },
-          borderRadius: BorderRadius.circular(_radiusSplash ?? 20),
-          child: Tooltip(
-            message: _tooltip ?? '',
-            child: Container(
-              key: _key,
-              alignment: Alignment.center,
-              color: _decoration == null ? Colors.transparent : null,
-              decoration: _decoration,
-              width: _maxWidth,
-              constraints: _constraints,
-              padding: _padding ?? EdgeInsets.zero,
-              child: _buildBody()
-            ),
-          )
-        ),
-      ),
-    );
-  }
-
-  Widget _buildBody() {
-    if (_text != null) {
-      return _isVertical!
-        ? Column(
-            mainAxisSize: MainAxisSize.min,
-            mainAxisAlignment: MainAxisAlignment.center,
-            children: [
-              _buildIcon(),
-              _buildText(),
-              if (_iconAction != null) _iconAction!
-            ])
-        : Row(
-            mainAxisSize: MainAxisSize.min,
-            mainAxisAlignment: MainAxisAlignment.center,
-            children: [
-              _buildIcon(),
-              _buildText(),
-              if (_iconAction != null) _iconAction!
-            ]);
-    } else {
-      return _buildIcon();
-    }
-  }
-
-  Widget _buildIcon() => Padding(
-    padding: _paddingIcon ?? const EdgeInsets.all(10),
-    child: SvgPicture.asset(
-      _icon ?? '',
-      width: _size ?? 24,
-      height: _size ?? 24,
-      fit: BoxFit.fill,
-      colorFilter: _iconColor.asFilter()
-    ));
-
-  Widget _buildText() {
-    return Text(
-      _text ?? '',
-      maxLines: 1,
-      softWrap: CommonTextStyle.defaultSoftWrap,
-      overflow: CommonTextStyle.defaultTextOverFlow,
-      style: _textStyle ?? const TextStyle(
-        fontSize: 12,
-        color: AppColor.colorTextButton
-      ),
-    );
-  }
-}

core/lib/presentation/views/button/icon_button_web.dart

@@ -99,32 +99,6 @@ Widget buildIconWebHasPosition(BuildContext context, {
   );
 }
 
-Widget buildTextCircleButton(String text, {
-  TextStyle? textStyle,
-  IconWebCallback? onTap,
-}) {
-  return Material(
-      shape: const CircleBorder(),
-      color: Colors.transparent,
-      child: TextButton(
-          style: ButtonStyle(
-              overlayColor: MaterialStateProperty.resolveWith<Color>((Set<MaterialState> states) => AppColor.colorFocusButton),
-              shape: MaterialStateProperty.all(const CircleBorder()),
-              padding: MaterialStateProperty.resolveWith<EdgeInsets>((Set<MaterialState> states) => EdgeInsets.zero),
-              elevation: MaterialStateProperty.resolveWith<double>((Set<MaterialState> states) => 0)),
-          onPressed: () => onTap?.call(),
-          child: Text(
-            text,
-            style: textStyle ?? const TextStyle(
-              fontWeight: FontWeight.normal,
-              fontSize: 15,
-              color: AppColor.lineItemListColor
-            )
-          )
-      )
-  );
-}
-
 Widget buildTextIcon(String text, {
   TextStyle? textStyle,
   EdgeInsetsGeometry? padding,

core/lib/presentation/views/button/tmail_button_widget.dart

@@ -14,15 +14,24 @@ class TMailButtonWidget extends StatelessWidget {
   final double? width;
   final double maxWidth;
   final double maxHeight;
+  final double minWidth;
   final String? tooltipMessage;
   final Color? backgroundColor;
   final EdgeInsetsGeometry? padding;
+  final EdgeInsetsGeometry? margin;
   final String text;
   final String? icon;
   final bool verticalDirection;
-  final double iconSize;
+  final double? iconSize;
+  final double iconSpace;
   final Color? iconColor;
   final TextStyle? textStyle;
+  final String? trailingIcon;
+  final double? trailingIconSize;
+  final Color? trailingIconColor;
+  final List<BoxShadow>? boxShadow;
+  final TextAlign? textAlign;
+  final bool flexibleText;
 
   const TMailButtonWidget({
     super.key,
@@ -33,14 +42,23 @@ class TMailButtonWidget extends StatelessWidget {
     this.width,
     this.maxWidth = double.infinity,
     this.maxHeight = double.infinity,
+    this.minWidth = 0,
     this.tooltipMessage,
     this.backgroundColor,
     this.padding,
     this.verticalDirection = false,
     this.icon,
-    this.iconSize = 24,
+    this.iconSize,
     this.iconColor,
     this.textStyle,
+    this.iconSpace = 8,
+    this.trailingIcon,
+    this.trailingIconSize,
+    this.trailingIconColor,
+    this.boxShadow,
+    this.margin,
+    this.textAlign,
+    this.flexibleText = false,
   });
 
   factory TMailButtonWidget.fromIcon({
@@ -52,14 +70,23 @@ class TMailButtonWidget extends StatelessWidget {
     double? width,
     double maxWidth = double.infinity,
     double maxHeight = double.infinity,
+    double minWidth = 0,
     String? tooltipMessage,
     Color? backgroundColor,
     EdgeInsetsGeometry? padding,
     String text = '',
     bool verticalDirection = false,
-    double iconSize = 24,
+    double? iconSize,
     Color? iconColor,
     TextStyle? textStyle,
+    double iconSpace = 8,
+    String? trailingIcon,
+    double? trailingIconSize,
+    Color? trailingIconColor,
+    List<BoxShadow>? boxShadow,
+    EdgeInsetsGeometry? margin,
+    TextAlign? textAlign,
+    bool flexibleText = false,
   }) {
     return TMailButtonWidget(
       key: key,
@@ -70,6 +97,7 @@ class TMailButtonWidget extends StatelessWidget {
       width: width,
       maxWidth : maxWidth,
       maxHeight: maxHeight,
+      minWidth: minWidth,
       tooltipMessage: tooltipMessage,
       backgroundColor: backgroundColor,
       padding: padding,
@@ -78,6 +106,14 @@ class TMailButtonWidget extends StatelessWidget {
       iconSize: iconSize,
       iconColor: iconColor,
       textStyle: textStyle,
+      iconSpace: iconSpace,
+      trailingIcon: trailingIcon,
+      trailingIconSize: trailingIconSize,
+      trailingIconColor: trailingIconColor,
+      boxShadow: boxShadow,
+      margin: margin,
+      textAlign: textAlign,
+      flexibleText: flexibleText,
     );
   }
 
@@ -88,7 +124,6 @@ class TMailButtonWidget extends StatelessWidget {
     if (icon != null && text.isNotEmpty) {
       if (verticalDirection) {
         childWidget = Column(
-          mainAxisSize: MainAxisSize.min,
           children: [
             SvgPicture.asset(
               icon!,
@@ -97,18 +132,31 @@ class TMailButtonWidget extends StatelessWidget {
               fit: BoxFit.fill,
               colorFilter: iconColor?.asFilter()
             ),
+            SizedBox(height: iconSpace),
             Text(
               text,
+              textAlign: textAlign,
               style: textStyle ?? const TextStyle(
                 fontSize: 12,
                 color: AppColor.colorTextButtonHeaderThread
               ),
             ),
+            if (trailingIcon != null)
+              Padding(
+                padding: EdgeInsetsDirectional.only(top: iconSpace),
+                child: SvgPicture.asset(
+                  trailingIcon!,
+                  width: trailingIconSize,
+                  height: trailingIconSize,
+                  fit: BoxFit.fill,
+                  colorFilter: trailingIconColor?.asFilter()
+                ),
+              ),
           ]
         );
       } else {
         childWidget = Row(
-          mainAxisSize: MainAxisSize.min,
+          mainAxisAlignment: MainAxisAlignment.center,
           children: [
             SvgPicture.asset(
               icon!,
@@ -117,13 +165,38 @@ class TMailButtonWidget extends StatelessWidget {
               fit: BoxFit.fill,
               colorFilter: iconColor?.asFilter()
             ),
-            Text(
-              text,
-              style: textStyle ?? const TextStyle(
-                fontSize: 12,
-                color: AppColor.colorTextButtonHeaderThread
+            SizedBox(width: iconSpace),
+            if (flexibleText)
+              Flexible(
+                child: Text(
+                  text,
+                  textAlign: textAlign,
+                  style: textStyle ?? const TextStyle(
+                    fontSize: 12,
+                    color: AppColor.colorTextButtonHeaderThread
+                  ),
+                ),
+              )
+            else
+              Text(
+                text,
+                textAlign: textAlign,
+                style: textStyle ?? const TextStyle(
+                  fontSize: 12,
+                  color: AppColor.colorTextButtonHeaderThread
+                ),
+              ),
+            if (trailingIcon != null)
+              Padding(
+                padding: EdgeInsetsDirectional.only(start: iconSpace),
+                child: SvgPicture.asset(
+                  trailingIcon!,
+                  width: trailingIconSize,
+                  height: trailingIconSize,
+                  fit: BoxFit.fill,
+                  colorFilter: trailingIconColor?.asFilter()
+                ),
               ),
-            ),
           ]
         );
       }
@@ -138,6 +211,7 @@ class TMailButtonWidget extends StatelessWidget {
     } else {
       childWidget = Text(
         text,
+        textAlign: textAlign,
         style: textStyle ?? const TextStyle(
           fontSize: 12,
           color: AppColor.colorTextButtonHeaderThread
@@ -152,9 +226,12 @@ class TMailButtonWidget extends StatelessWidget {
       width: width,
       maxWidth: maxWidth,
       maxHeight: maxHeight,
+      minWidth: minWidth,
       tooltipMessage: tooltipMessage,
       backgroundColor: backgroundColor,
       padding: padding,
+      margin: margin,
+      boxShadow: boxShadow,
       child: childWidget,
     );
   }

core/lib/presentation/views/container/tmail_container_widget.dart

@@ -13,9 +13,12 @@ class TMailContainerWidget extends StatelessWidget {
   final double? width;
   final double maxWidth;
   final double maxHeight;
+  final double minWidth;
   final String? tooltipMessage;
   final Color? backgroundColor;
   final EdgeInsetsGeometry? padding;
+  final EdgeInsetsGeometry? margin;
+  final List<BoxShadow>? boxShadow;
 
   const TMailContainerWidget({
     super.key,
@@ -26,14 +29,17 @@ class TMailContainerWidget extends StatelessWidget {
     this.width,
     this.maxWidth = double.infinity,
     this.maxHeight = double.infinity,
+    this.minWidth = 0,
     this.tooltipMessage,
     this.backgroundColor,
     this.padding,
+    this.boxShadow,
+    this.margin,
   });
 
   @override
   Widget build(BuildContext context) {
-    return Material(
+    final materialChild = Material(
       color: Colors.transparent,
       child: InkWell(
         onTap: onTapActionCallback,
@@ -59,9 +65,14 @@ class TMailContainerWidget extends StatelessWidget {
                 decoration: BoxDecoration(
                   color: backgroundColor ?? AppColor.colorButtonHeaderThread,
                   borderRadius: BorderRadius.all(Radius.circular(borderRadius)),
+                  boxShadow: boxShadow
                 ),
                 width: width,
-                constraints: BoxConstraints(maxWidth: maxWidth, maxHeight: maxHeight),
+                constraints: BoxConstraints(
+                  maxWidth: maxWidth,
+                  maxHeight: maxHeight,
+                  minWidth: minWidth
+                ),
                 padding: padding ?? const EdgeInsetsDirectional.all(8),
                 child: child
               )
@@ -71,13 +82,24 @@ class TMailContainerWidget extends StatelessWidget {
               decoration: BoxDecoration(
                 color: backgroundColor ?? AppColor.colorButtonHeaderThread,
                 borderRadius: BorderRadius.all(Radius.circular(borderRadius)),
+                boxShadow: boxShadow
               ),
               width: width,
-              constraints: BoxConstraints(maxWidth: maxWidth, maxHeight: maxHeight),
+              constraints: BoxConstraints(
+                maxWidth: maxWidth,
+                maxHeight: maxHeight,
+                minWidth: minWidth
+              ),
               padding: padding ?? const EdgeInsetsDirectional.all(8),
               child: child
             )
       ),
     );
+
+    if (margin != null) {
+      return Padding(padding: margin!, child: materialChild);
+    } else {
+      return materialChild;
+    }
   }
 }