TF-1301 Handle select font size while compose email

Signed-off-by: dab246 <tdvu@linagora.com> Signed-off-by: dab246 <tdvu@linagora.com> (cherry picked from commit 194ccd3a0cf1da161607daf2506bdf524daaf305)
2023-10-13 19:37:04 +07:00
parent 9419b600aa
commit ba651b3610
7 changed files with 240 additions and 173 deletions
@@ -1,7 +1,6 @@
 import 'package:core/presentation/resources/image_paths.dart';
 import 'package:core/presentation/utils/responsive_utils.dart';
 import 'package:core/presentation/views/responsive/responsive_widget.dart';
-import 'package:core/utils/app_logger.dart';
 import 'package:file_picker/file_picker.dart';
 import 'package:flutter/material.dart';
 import 'package:get/get.dart';
@@ -150,7 +149,6 @@ class ComposerView extends GetWidget<ComposerController> {
              ),
              Expanded(
                child: LayoutBuilder(builder: (context, constraints) {
-                  log('ComposerView::build:mobile:constraints: $constraints');
                  return Stack(
                    children: [
                      Padding(
@@ -175,6 +173,7 @@ class ComposerView extends GetWidget<ComposerController> {
                              base64Str: base64Str,
                            );
                          },
+                          onEditorTextSizeChanged: controller.richTextWebController.onEditorTextSizeChanged,
                          width: constraints.maxWidth,
                          height: constraints.maxHeight,
                        )),
@@ -330,7 +329,6 @@ class ComposerView extends GetWidget<ComposerController> {
                  color: ComposerStyle.backgroundEditorColor
                ),
                child: LayoutBuilder(builder: (context, constraints) {
-                  log('ComposerView::build:desktop:constraints: $constraints');
                  return Stack(
                    children: [
                      Column(
@@ -361,6 +359,7 @@ class ComposerView extends GetWidget<ComposerController> {
                                          base64Str: base64Str,
                                        );
                                      },
+                                      onEditorTextSizeChanged: controller.richTextWebController.onEditorTextSizeChanged,
                                      width: constraints.maxWidth,
                                      height: constraints.maxHeight,
                                    ),
@@ -551,7 +550,6 @@ class ComposerView extends GetWidget<ComposerController> {
                  color: ComposerStyle.backgroundEditorColor
                ),
                child: LayoutBuilder(builder: (context, constraints) {
-                  log('ComposerView::build:tablet:constraints: $constraints');
                  return Stack(
                    children: [
                      Column(
@@ -579,6 +577,7 @@ class ComposerView extends GetWidget<ComposerController> {
                                    base64Str: base64Str,
                                  );
                                },
+                                onEditorTextSizeChanged: controller.richTextWebController.onEditorTextSizeChanged,
                                width: constraints.maxWidth,
                                height: constraints.maxHeight,
                              )),
@@ -23,12 +23,16 @@ import 'package:tmail_ui_user/main/routes/route_navigation.dart';

 class RichTextWebController extends BaseRichTextController {

+  static const List<int> fontSizeList = [10, 12, 14, 15, 16, 18, 24, 36, 48, 64];
+  static const int fontSizeDefault = 16;
+
  final editorController = HtmlEditorController();

  final listTextStyleApply = RxList<RichTextStyleType>();
  final selectedTextColor = Colors.black.obs;
  final selectedTextBackgroundColor = Colors.white.obs;
  final selectedFontName = FontNameType.sansSerif.obs;
+  final selectedFontSize = RxInt(fontSizeDefault);
  final codeViewState = CodeViewState.disabled.obs;
  final selectedParagraph = ParagraphType.alignLeft.obs;
  final selectedOrderList = OrderListType.bulletedList.obs;
@@ -61,6 +65,10 @@ class RichTextWebController extends BaseRichTextController {
    _updateParagraph(settings);
  }

+  void onEditorTextSizeChanged(int? size) {
+    _updateFontSize(size);
+  }
+
  void _updateTextStyle(EditorSettings settings) {
    listTextStyleApply.clear();

@@ -92,11 +100,20 @@ class RichTextWebController extends BaseRichTextController {
    }
  }

+  void _updateFontSize(int? size) {
+    log('RichTextWebController::_updateFontSize():size: $size');
+    if (size != null && fontSizeList.contains(size)) {
+      selectedFontSize.value = size;
+    }
+  }
+
  void _updateTextColor(EditorSettings settings) {
+    log('RichTextWebController::_updateTextColor():foregroundColor: ${settings.foregroundColor}');
    selectedTextColor.value = settings.foregroundColor;
  }

  void _updateBackgroundTextColor(EditorSettings settings) {
+    log('RichTextWebController::_updateBackgroundTextColor():backgroundColor: ${settings.backgroundColor}');
    selectedTextBackgroundColor.value = settings.backgroundColor;
  }

@@ -199,6 +216,11 @@ class RichTextWebController extends BaseRichTextController {
      value: fontSelected.value);
  }

+  void applyNewFontSize(int? newSize) {
+    selectedFontSize.value = newSize ?? fontSizeDefault;
+    editorController.setFontSize(newSize ?? fontSizeDefault);
+  }
+
  bool get isMenuFontOpen => menuFontStatus.value == DropdownMenuFontStatus.open;

  bool get isMenuHeaderStyleOpen => menuHeaderStyleStatus.value == DropdownMenuFontStatus.open;
@@ -0,0 +1,9 @@
+
+import 'package:flutter/material.dart';
+
+class ToolbarRichTextBuilderStyle {
+  static const double itemHorizontalSpace = 8.0;
+  static const double itemVerticalSpace = 8.0;
+
+  static const EdgeInsetsGeometry padding = EdgeInsetsDirectional.only(start: 20, top: 8, bottom: 8);
+}
@@ -28,6 +28,7 @@ class WebEditorView extends StatelessWidget with EditorViewMixin {
  final OnEditorSettingsChange? onEditorSettings;
  final OnImageUploadSuccessAction? onImageUploadSuccessAction;
  final OnImageUploadFailureAction? onImageUploadFailureAction;
+  final OnEditorTextSizeChanged? onEditorTextSizeChanged;
  final double? width;
  final double? height;

@@ -45,6 +46,7 @@ class WebEditorView extends StatelessWidget with EditorViewMixin {
    this.onEditorSettings,
    this.onImageUploadSuccessAction,
    this.onImageUploadFailureAction,
+    this.onEditorTextSizeChanged,
    this.width,
    this.height,
  });
@@ -71,6 +73,7 @@ class WebEditorView extends StatelessWidget with EditorViewMixin {
          onEditorSettings: onEditorSettings,
          onImageUploadSuccessAction: onImageUploadSuccessAction,
          onImageUploadFailureAction: onImageUploadFailureAction,
+          onEditorTextSizeChanged: onEditorTextSizeChanged,
          width: width,
          height: height,
        );
@@ -94,6 +97,7 @@ class WebEditorView extends StatelessWidget with EditorViewMixin {
            onEditorSettings: onEditorSettings,
            onImageUploadSuccessAction: onImageUploadSuccessAction,
            onImageUploadFailureAction: onImageUploadFailureAction,
+            onEditorTextSizeChanged: onEditorTextSizeChanged,
            width: width,
            height: height,
          ),
@@ -119,6 +123,7 @@ class WebEditorView extends StatelessWidget with EditorViewMixin {
                onEditorSettings: onEditorSettings,
                onImageUploadSuccessAction: onImageUploadSuccessAction,
                onImageUploadFailureAction: onImageUploadFailureAction,
+                onEditorTextSizeChanged: onEditorTextSizeChanged,
                width: width,
                height: height,
              );
@@ -151,6 +156,7 @@ class WebEditorView extends StatelessWidget with EditorViewMixin {
              onEditorSettings: onEditorSettings,
              onImageUploadSuccessAction: onImageUploadSuccessAction,
              onImageUploadFailureAction: onImageUploadFailureAction,
+              onEditorTextSizeChanged: onEditorTextSizeChanged,
              width: width,
              height: height,
            );
@@ -179,6 +185,7 @@ class WebEditorView extends StatelessWidget with EditorViewMixin {
                onEditorSettings: onEditorSettings,
                onImageUploadSuccessAction: onImageUploadSuccessAction,
                onImageUploadFailureAction: onImageUploadFailureAction,
+                onEditorTextSizeChanged: onEditorTextSizeChanged,
                width: width,
                height: height,
              );
@@ -198,6 +205,7 @@ class WebEditorView extends StatelessWidget with EditorViewMixin {
          onEditorSettings: onEditorSettings,
          onImageUploadSuccessAction: onImageUploadSuccessAction,
          onImageUploadFailureAction: onImageUploadFailureAction,
+          onEditorTextSizeChanged: onEditorTextSizeChanged,
          width: width,
          height: height,
        );
@@ -1,6 +1,5 @@
 import 'package:core/presentation/extensions/color_extension.dart';
 import 'package:core/presentation/resources/image_paths.dart';
-import 'package:core/utils/app_logger.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_svg/flutter_svg.dart';
 import 'package:get/get.dart';
@@ -15,7 +14,9 @@ import 'package:tmail_ui_user/features/composer/presentation/model/header_style_
 import 'package:tmail_ui_user/features/composer/presentation/model/order_list_type.dart';
 import 'package:tmail_ui_user/features/composer/presentation/model/paragraph_type.dart';
 import 'package:tmail_ui_user/features/composer/presentation/model/rich_text_style_type.dart';
+import 'package:tmail_ui_user/features/composer/presentation/styles/web/toolbar_rich_text_builder_style.dart';
 import 'package:tmail_ui_user/features/composer/presentation/widgets/drop_down_menu_header_style_widget.dart';
+import 'package:tmail_ui_user/features/composer/presentation/widgets/web/dropdown_menu_font_size_widget.dart';

 class ToolbarRichTextWebBuilder extends StatelessWidget with RichTextButtonMixin {

@@ -43,187 +44,211 @@ class ToolbarRichTextWebBuilder extends StatelessWidget with RichTextButtonMixin

      return PointerInterceptor(
        child: Container(
-          padding: padding ?? const EdgeInsetsDirectional.only(start: 20, top: 8, bottom: 8),
+          padding: padding ?? ToolbarRichTextBuilderStyle.padding,
          decoration: decoration,
          width: double.infinity,
          child: Wrap(
-              crossAxisAlignment: WrapCrossAlignment.center,
-              runSpacing: 8,
-              children: [
-                if (extendedOption?.isNotEmpty == true)
-                  ...extendedOption!,
-                AbsorbPointer(
-                  absorbing: codeViewEnabled,
-                  child: DropDownMenuHeaderStyleWidget(
-                      icon: buildWrapIconStyleText(
-                          isSelected: richTextWebController.isMenuHeaderStyleOpen,
-                          icon: SvgPicture.asset(
-                            RichTextStyleType.headerStyle.getIcon(_imagePaths),
-                            colorFilter: AppColor.colorDefaultRichTextButton.withOpacity(opacity).asFilter(),
-                            fit: BoxFit.fill),
-                          padding: const EdgeInsets.symmetric(vertical: 5, horizontal: 5),
-                          tooltip: RichTextStyleType.headerStyle.getTooltipButton(context)
-                      ),
-                      items: HeaderStyleType.values,
-                      onMenuStateChange: (isOpen) {
-                        log('ComposerView::_buildToolbarRichTextWidget(): MenuHeaderStyleStatus: $isOpen');
-                        final newStatus = isOpen
-                            ? DropdownMenuFontStatus.open
-                            : DropdownMenuFontStatus.closed;
-                        richTextWebController.menuHeaderStyleStatus.value = newStatus;
-                      },
-                      onChanged: (newStyle) => richTextWebController.applyHeaderStyle(newStyle)),
-                ),
-                AbsorbPointer(
-                  absorbing: codeViewEnabled,
-                  child: Container(
-                      width: 130,
-                      padding: const EdgeInsets.only(left: 4.0, right: 4.0),
-                      child: DropDownButtonWidget<FontNameType>(
-                          items: FontNameType.values,
-                          itemSelected: richTextWebController.selectedFontName.value,
-                          onChanged: (newFont) => richTextWebController.applyNewFontStyle(newFont),
-                          onMenuStateChange: (isOpen) {
-                            log('ComposerView::_buildToolbarRichTextWidget(): MenuFontStatus: $isOpen');
-                            final newStatus = isOpen
-                                ? DropdownMenuFontStatus.open
-                                : DropdownMenuFontStatus.closed;
-                            richTextWebController.menuFontStatus.value = newStatus;
-                          },
-                          heightItem: 40,
-                          sizeIconChecked: 16,
-                          radiusButton: 8,
-                          opacity: opacity,
-                          dropdownWidth: 200,
-                          colorButton: richTextWebController.isMenuFontOpen
-                              ? AppColor.colorBackgroundWrapIconStyleCode
-                              : Colors.white,
-                          iconArrowDown: SvgPicture.asset(_imagePaths.icStyleArrowDown),
-                          tooltip: RichTextStyleType.fontName.getTooltipButton(context),
-                          supportSelectionIcon: true)),
-                ),
-                Padding(
-                  padding: const EdgeInsetsDirectional.only(end: 4.0),
-                  child: AbsorbPointer(
-                    absorbing: codeViewEnabled,
-                    child: buildWrapIconStyleText(
-                        icon: buildIconWithTooltip(
-                            path: RichTextStyleType.textColor.getIcon(_imagePaths),
-                            color: richTextWebController.selectedTextColor.value,
-                            tooltip: RichTextStyleType.textColor.getTooltipButton(context),
-                            opacity: opacity),
-                        onTap: () => richTextWebController.applyRichTextStyle(context, RichTextStyleType.textColor)),
+            crossAxisAlignment: WrapCrossAlignment.center,
+            runSpacing: ToolbarRichTextBuilderStyle.itemVerticalSpace,
+            spacing: ToolbarRichTextBuilderStyle.itemHorizontalSpace,
+            children: [
+              if (extendedOption?.isNotEmpty == true)
+                ...extendedOption!,
+              AbsorbPointer(
+                absorbing: codeViewEnabled,
+                child: DropDownMenuHeaderStyleWidget(
+                  icon: buildWrapIconStyleText(
+                    isSelected: richTextWebController.isMenuHeaderStyleOpen,
+                    icon: SvgPicture.asset(
+                      RichTextStyleType.headerStyle.getIcon(_imagePaths),
+                      colorFilter: AppColor.colorDefaultRichTextButton.withOpacity(opacity).asFilter(),
+                      fit: BoxFit.fill
+                    ),
+                    padding: const EdgeInsets.symmetric(vertical: 5, horizontal: 5),
+                    tooltip: RichTextStyleType.headerStyle.getTooltipButton(context)
                  ),
+                  items: HeaderStyleType.values,
+                  onMenuStateChange: (isOpen) {
+                    final newStatus = isOpen
+                      ? DropdownMenuFontStatus.open
+                      : DropdownMenuFontStatus.closed;
+                    richTextWebController.menuHeaderStyleStatus.value = newStatus;
+                  },
+                  onChanged: richTextWebController.applyHeaderStyle
                ),
-                Padding(
-                  padding: const EdgeInsetsDirectional.only(end: 4.0),
-                  child: AbsorbPointer(
-                    absorbing: codeViewEnabled,
-                    child: buildWrapIconStyleText(
-                        padding: const EdgeInsets.symmetric(vertical: 9, horizontal: 7),
-                        spacing: 3,
-                        icon: buildIconColorBackgroundText(
-                            iconData: RichTextStyleType.textBackgroundColor.getIconData(),
-                            colorSelected: richTextWebController.selectedTextBackgroundColor.value,
-                            tooltip: RichTextStyleType.textBackgroundColor.getTooltipButton(context),
-                            opacity: opacity),
-                        onTap: () => richTextWebController.applyRichTextStyle(context, RichTextStyleType.textBackgroundColor)),
+              ),
+              AbsorbPointer(
+                absorbing: codeViewEnabled,
+                child: DropdownMenuFontSizeWidget(
+                  onChanged: richTextWebController.applyNewFontSize,
+                  selectedFontSize: richTextWebController.selectedFontSize.value
+                ),
+              ),
+              AbsorbPointer(
+                absorbing: codeViewEnabled,
+                child: SizedBox(
+                  width: 130,
+                  child: DropDownButtonWidget<FontNameType>(
+                    items: FontNameType.values,
+                    itemSelected: richTextWebController.selectedFontName.value,
+                    onChanged: (newFont) => richTextWebController.applyNewFontStyle(newFont),
+                    onMenuStateChange: (isOpen) {
+                      final newStatus = isOpen
+                        ? DropdownMenuFontStatus.open
+                        : DropdownMenuFontStatus.closed;
+                      richTextWebController.menuFontStatus.value = newStatus;
+                    },
+                    heightItem: 40,
+                    sizeIconChecked: 16,
+                    radiusButton: 8,
+                    opacity: opacity,
+                    dropdownWidth: 200,
+                    colorButton: richTextWebController.isMenuFontOpen
+                      ? AppColor.colorBackgroundWrapIconStyleCode
+                      : Colors.white,
+                    iconArrowDown: SvgPicture.asset(_imagePaths.icStyleArrowDown),
+                    tooltip: RichTextStyleType.fontName.getTooltipButton(context),
+                    supportSelectionIcon: true
+                  )
+                ),
+              ),
+              AbsorbPointer(
+                absorbing: codeViewEnabled,
+                child: buildWrapIconStyleText(
+                  icon: buildIconWithTooltip(
+                    path: RichTextStyleType.textColor.getIcon(_imagePaths),
+                    color: richTextWebController.selectedTextColor.value,
+                    tooltip: RichTextStyleType.textColor.getTooltipButton(context),
+                    opacity: opacity
                  ),
+                  onTap: () => richTextWebController.applyRichTextStyle(
+                    context,
+                    RichTextStyleType.textColor
+                  )
                ),
-                Padding(
-                  padding: const EdgeInsetsDirectional.only(end: 4.0),
-                  child: buildWrapIconStyleText(
-                      hasDropdown: false,
-                      padding: const EdgeInsets.symmetric(vertical: 3, horizontal: 5),
-                      icon: Wrap(children: [
-                        AbsorbPointer(
-                          absorbing: codeViewEnabled,
-                          child: buildIconStyleText(
-                              path: RichTextStyleType.bold.getIcon(_imagePaths),
-                              isSelected: richTextWebController.isTextStyleTypeSelected(RichTextStyleType.bold),
-                              tooltip: RichTextStyleType.bold.getTooltipButton(context),
-                              opacity: opacity,
-                              onTap: () => richTextWebController.applyRichTextStyle(context, RichTextStyleType.bold)),
-                        ),
-                        AbsorbPointer(
-                          absorbing: codeViewEnabled,
-                          child: buildIconStyleText(
-                              path: RichTextStyleType.italic.getIcon(_imagePaths),
-                              isSelected: richTextWebController.isTextStyleTypeSelected(RichTextStyleType.italic),
-                              tooltip: RichTextStyleType.italic.getTooltipButton(context),
-                              opacity: opacity,
-                              onTap: () => richTextWebController.applyRichTextStyle(context, RichTextStyleType.italic)),
-                        ),
-                        AbsorbPointer(
-                          absorbing: codeViewEnabled,
-                          child: buildIconStyleText(
-                              path: RichTextStyleType.underline.getIcon(_imagePaths),
-                              isSelected: richTextWebController.isTextStyleTypeSelected(RichTextStyleType.underline),
-                              tooltip: RichTextStyleType.underline.getTooltipButton(context),
-                              opacity: opacity,
-                              onTap: () => richTextWebController.applyRichTextStyle(context, RichTextStyleType.underline)),
-                        ),
-                        AbsorbPointer(
-                          absorbing: codeViewEnabled,
-                          child: buildIconStyleText(
-                              path: RichTextStyleType.strikeThrough.getIcon(_imagePaths),
-                              isSelected: richTextWebController.isTextStyleTypeSelected(
-                                  RichTextStyleType.strikeThrough),
-                              tooltip: RichTextStyleType.strikeThrough.getTooltipButton(context),
-                              opacity: opacity,
-                              onTap: () => richTextWebController.applyRichTextStyle(context, RichTextStyleType.strikeThrough)),
-                        )
-                      ])),
+              ),
+              AbsorbPointer(
+                absorbing: codeViewEnabled,
+                child: buildWrapIconStyleText(
+                  padding: const EdgeInsets.symmetric(vertical: 9, horizontal: 7),
+                  spacing: 3,
+                  icon: buildIconColorBackgroundText(
+                    iconData: RichTextStyleType.textBackgroundColor.getIconData(),
+                    colorSelected: richTextWebController.selectedTextBackgroundColor.value,
+                    tooltip: RichTextStyleType.textBackgroundColor.getTooltipButton(context),
+                    opacity: opacity
+                  ),
+                  onTap: () => richTextWebController.applyRichTextStyle(
+                    context,
+                    RichTextStyleType.textBackgroundColor
+                  )
                ),
-                Padding(
-                  padding: const EdgeInsetsDirectional.only(end: 4.0),
-                  child: AbsorbPointer(
+              ),
+              buildWrapIconStyleText(
+                hasDropdown: false,
+                padding: const EdgeInsets.symmetric(vertical: 3, horizontal: 5),
+                icon: Wrap(children: [
+                  AbsorbPointer(
                    absorbing: codeViewEnabled,
-                    child: PopupMenuOverlayWidget(
-                      controller: richTextWebController.menuParagraphController,
-                      listButtonAction: ParagraphType.values
-                        .map((paragraph) => paragraph.buildButtonWidget(
-                            context,
-                            _imagePaths,
-                            (paragraph) => richTextWebController.applyParagraphType(paragraph)))
-                        .toList(),
-                      iconButton: buildWrapIconStyleText(
-                          padding: const EdgeInsets.symmetric(vertical: 5, horizontal: 5),
-                          spacing: 3,
-                          isSelected: richTextWebController.focusMenuParagraph.value,
-                          icon: buildIconWithTooltip(
-                            path: richTextWebController.selectedParagraph.value.getIcon(_imagePaths),
-                            color: AppColor.colorDefaultRichTextButton,
-                            opacity: opacity,
-                            tooltip: RichTextStyleType.paragraph.getTooltipButton(context))),
+                    child: buildIconStyleText(
+                      path: RichTextStyleType.bold.getIcon(_imagePaths),
+                      isSelected: richTextWebController.isTextStyleTypeSelected(RichTextStyleType.bold),
+                      tooltip: RichTextStyleType.bold.getTooltipButton(context),
+                      opacity: opacity,
+                      onTap: () => richTextWebController.applyRichTextStyle(
+                        context,
+                        RichTextStyleType.bold
+                      )
                    ),
                  ),
-                ),
-                Padding(
-                  padding: const EdgeInsetsDirectional.only(end: 4.0),
-                  child: AbsorbPointer(
+                  AbsorbPointer(
                    absorbing: codeViewEnabled,
-                    child: PopupMenuOverlayWidget(
-                      controller: richTextWebController.menuOrderListController,
-                      listButtonAction: OrderListType.values
-                        .map((orderType) => orderType.buildButtonWidget(
-                          context,
-                          _imagePaths,
-                          (orderType) => richTextWebController.applyOrderListType(orderType)))
-                        .toList(),
-                      iconButton: buildWrapIconStyleText(
-                        padding: const EdgeInsets.symmetric(vertical: 5, horizontal: 5),
-                        spacing: 3,
-                        isSelected: richTextWebController.focusMenuOrderList.value,
-                        icon: buildIconWithTooltip(
-                          path: richTextWebController.selectedOrderList.value.getIcon(_imagePaths),
-                          color: AppColor.colorDefaultRichTextButton,
-                          opacity: opacity,
-                          tooltip: RichTextStyleType.orderList.getTooltipButton(context))),
+                    child: buildIconStyleText(
+                      path: RichTextStyleType.italic.getIcon(_imagePaths),
+                      isSelected: richTextWebController.isTextStyleTypeSelected(RichTextStyleType.italic),
+                      tooltip: RichTextStyleType.italic.getTooltipButton(context),
+                      opacity: opacity,
+                      onTap: () => richTextWebController.applyRichTextStyle(
+                        context,
+                        RichTextStyleType.italic
+                      )
                    ),
                  ),
-                )
-              ]
+                  AbsorbPointer(
+                    absorbing: codeViewEnabled,
+                    child: buildIconStyleText(
+                      path: RichTextStyleType.underline.getIcon(_imagePaths),
+                      isSelected: richTextWebController.isTextStyleTypeSelected(RichTextStyleType.underline),
+                      tooltip: RichTextStyleType.underline.getTooltipButton(context),
+                      opacity: opacity,
+                      onTap: () => richTextWebController.applyRichTextStyle(
+                        context,
+                        RichTextStyleType.underline
+                      )
+                    ),
+                  ),
+                  AbsorbPointer(
+                    absorbing: codeViewEnabled,
+                    child: buildIconStyleText(
+                      path: RichTextStyleType.strikeThrough.getIcon(_imagePaths),
+                      isSelected: richTextWebController.isTextStyleTypeSelected(RichTextStyleType.strikeThrough),
+                      tooltip: RichTextStyleType.strikeThrough.getTooltipButton(context),
+                      opacity: opacity,
+                      onTap: () => richTextWebController.applyRichTextStyle(
+                        context,
+                        RichTextStyleType.strikeThrough
+                      )
+                    ),
+                  )
+                ])
+              ),
+              AbsorbPointer(
+                absorbing: codeViewEnabled,
+                child: PopupMenuOverlayWidget(
+                  controller: richTextWebController.menuParagraphController,
+                  listButtonAction: ParagraphType.values
+                    .map((paragraph) => paragraph.buildButtonWidget(
+                      context,
+                      _imagePaths,
+                      (paragraph) => richTextWebController.applyParagraphType(paragraph)))
+                    .toList(),
+                  iconButton: buildWrapIconStyleText(
+                    padding: const EdgeInsets.symmetric(vertical: 5, horizontal: 5),
+                    spacing: 3,
+                    isSelected: richTextWebController.focusMenuParagraph.value,
+                    icon: buildIconWithTooltip(
+                      path: richTextWebController.selectedParagraph.value.getIcon(_imagePaths),
+                      color: AppColor.colorDefaultRichTextButton,
+                      opacity: opacity,
+                      tooltip: RichTextStyleType.paragraph.getTooltipButton(context)
+                    )
+                  ),
+                ),
+              ),
+              AbsorbPointer(
+                absorbing: codeViewEnabled,
+                child: PopupMenuOverlayWidget(
+                  controller: richTextWebController.menuOrderListController,
+                  listButtonAction: OrderListType.values
+                    .map((orderType) => orderType.buildButtonWidget(
+                      context,
+                      _imagePaths,
+                      (orderType) => richTextWebController.applyOrderListType(orderType)))
+                    .toList(),
+                  iconButton: buildWrapIconStyleText(
+                    padding: const EdgeInsets.symmetric(vertical: 5, horizontal: 5),
+                    spacing: 3,
+                    isSelected: richTextWebController.focusMenuOrderList.value,
+                    icon: buildIconWithTooltip(
+                      path: richTextWebController.selectedOrderList.value.getIcon(_imagePaths),
+                      color: AppColor.colorDefaultRichTextButton,
+                      opacity: opacity,
+                      tooltip: RichTextStyleType.orderList.getTooltipButton(context)
+                    )
+                  ),
+                ),
+              )
+            ]
          ),
        ),
      );
@@ -10,6 +10,7 @@ typedef OnMouseDownEditorAction = Function(BuildContext context);
 typedef OnEditorSettingsChange = Function(EditorSettings settings);
 typedef OnImageUploadSuccessAction = Function(FileUpload fileUpload);
 typedef OnImageUploadFailureAction = Function(FileUpload? fileUpload, String? base64Str, UploadError error);
+typedef OnEditorTextSizeChanged = Function(int? size);

 class WebEditorWidget extends StatefulWidget {

@@ -24,6 +25,7 @@ class WebEditorWidget extends StatefulWidget {
  final OnEditorSettingsChange? onEditorSettings;
  final OnImageUploadSuccessAction? onImageUploadSuccessAction;
  final OnImageUploadFailureAction? onImageUploadFailureAction;
+  final OnEditorTextSizeChanged? onEditorTextSizeChanged;
  final double? width;
  final double? height;

@@ -40,6 +42,7 @@ class WebEditorWidget extends StatefulWidget {
    this.onEditorSettings,
    this.onImageUploadSuccessAction,
    this.onImageUploadFailureAction,
+    this.onEditorTextSizeChanged,
    this.width,
    this.height,
  });
@@ -111,6 +114,7 @@ class _WebEditorState extends State<WebEditorWidget> {
        onChangeCodeview: widget.onChangeContent,
        onImageUpload: widget.onImageUploadSuccessAction,
        onImageUploadError: widget.onImageUploadFailureAction,
+        onTextFontSizeChanged: widget.onEditorTextSizeChanged,
      ),
    );
  }
@@ -922,7 +922,7 @@ packages:
    description:
      path: "."
      ref: email_supported
-      resolved-ref: f9dc6f957500ea2978fe5212512326a5028aee27
+      resolved-ref: "96c199b233c5afde583295890ffbd880ea4c7d8c"
      url: "https://github.com/linagora/html-editor-enhanced.git"
    source: git
    version: "2.5.1"