eduvia/workavia-mail-front
11
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

TF-3763 Update background color, padding, border for advanced search input field

Browse Source 
Signed-off-by: dab246 <tdvu@linagora.com>
This commit is contained in:
dab246
2025-06-13 04:17:39 +07:00
committed by Dat H. Pham
parent ca11a9d8f1
commit 061f5d232c
11 changed files with 262 additions and 234 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/features/mailbox_dashboard/presentation/styles/advanced_search_input_form_style.dart
+7 -1
View File
@@ -6,4 +6,10 @@ class AdvancedSearchInputFormStyle {
static TextStyle inputTextStyle = ThemeUtils.textStyleBodyBody3(
color: AppColor.m3SurfaceBackground,
);
}
static const double inputFieldBorderRadius = 10;
static const double inputFieldBorderWidth = 1;
static const Color inputFieldBorderColor = AppColor.m3Neutral90;
static const Color inputFieldBackgroundColor = Colors.white;
}
lib/features/mailbox_dashboard/presentation/styles/sort_by_drop_down_style.dart
+1 -4
View File
@@ -5,7 +5,6 @@ class SortByDropdownStyle {
static const int dropdownElevation = 4;
static const double height = 44;
static const double buttonBorderWidth = 0.5;
static const double dropdownMaxHeight = 332;
static const double scrollbarThickness = 6;
static const double checkedIconSize = 20;
@@ -17,13 +16,11 @@ class SortByDropdownStyle {
color: Colors.white
);
static const EdgeInsetsDirectional buttonPadding = EdgeInsetsDirectional.only(start: 12, end: 10);
static const EdgeInsetsDirectional buttonPadding = EdgeInsetsDirectional.only(start: 12, end: 8);
static const MenuItemStyleData menuItemStyleData = MenuItemStyleData(
height: height,
padding: EdgeInsets.symmetric(horizontal: 12),
);
static const BorderRadius buttonBorderRadius = BorderRadius.all(Radius.circular(10));
static const Radius dropdownScrollbarRadius = Radius.circular(40);
}
lib/features/mailbox_dashboard/presentation/styles/text_field_autocomplete_email_address_web_style.dart
+4 -12
View File
@@ -2,17 +2,15 @@ import 'package:core/presentation/extensions/color_extension.dart';
import 'package:core/presentation/utils/theme_utils.dart';
import 'package:flutter/material.dart';
import 'package:tmail_ui_user/features/composer/presentation/styles/composer_style.dart';
import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/styles/advanced_search_input_form_style.dart';
class TextFieldAutoCompleteEmailAddressWebStyles {
static const EdgeInsetsGeometry padding = EdgeInsets.symmetric(vertical: 8);
static const EdgeInsetsGeometry textInputContentPadding = EdgeInsetsDirectional.only(top: 16, bottom: 16, start: 12);
static const EdgeInsetsGeometry textInputContentPadding = EdgeInsetsDirectional.only(top: 16, bottom: 16, start: 12, end: 8);
static const EdgeInsetsGeometry textInputContentPaddingWithSomeTag = EdgeInsetsDirectional.symmetric(vertical: 16);
static const EdgeInsets tagEditorPadding = EdgeInsets.symmetric(horizontal: 12);
static const double borderRadius = 10.0;
static const double suggestionBoxRadius = 20.0;
static const double borderWidth = 1.0;
static const double minTextFieldWidth = 40.0;
static const double suggestionBoxElevation = 20.0;
@@ -20,27 +18,21 @@ class TextFieldAutoCompleteEmailAddressWebStyles {
static const double suggestionBoxItemHeight = ComposerStyle.suggestionItemHeight;
static const double fieldTitleWidth = 112.0;
static const double space = 8.0;
static const double space = 12.0;
static const InputBorder textInputBorder = OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(10)),
borderRadius: BorderRadius.all(Radius.circular(AdvancedSearchInputFormStyle.inputFieldBorderRadius)),
borderSide: BorderSide.none,
);
static const Color textInputFillColor = Colors.white;
static const Color focusedBorderColor = AppColor.primaryColor;
static const Color enableBorderColor = AppColor.colorInputBorderCreateMailbox;
static const Color suggestionBoxBackgroundColor = Colors.white;
static const Color cursorColor = AppColor.primaryColor;
static TextStyle textInputHintStyle = ThemeUtils.textStyleBodyBody3(
color: AppColor.m3Tertiary,
);
static const TextStyle textInputTextStyle = TextStyle(
fontSize: 16,
color: Colors.black,
fontWeight: FontWeight.w500,
);
static const Duration debounceDuration = Duration(milliseconds: 150);
}
lib/features/mailbox_dashboard/presentation/widgets/advanced_search/advanced_search_filter_form_bottom_view.dart
+12 -15
View File
@@ -21,21 +21,18 @@ class AdvancedSearchFilterFormBottomView extends GetWidget<AdvancedFilterControl
@override
Widget build(BuildContext context) {
return Padding(
padding: EdgeInsets.only(top: !controller.responsiveUtils.isWebDesktop(context) ? 8 : 20),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Transform(
transform: Matrix4.translationValues(-8.0, 0.0, 0.0),
child: _buildCheckboxHasAttachment(
context,
currentFocusNode: focusManager.attachmentCheckboxFocusNode,
nextFocusNode: focusManager.searchButtonFocusNode),
),
_buildListButton(context, controller.responsiveUtils),
],
),
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Transform(
transform: Matrix4.translationValues(-8.0, 0.0, 0.0),
child: _buildCheckboxHasAttachment(
context,
currentFocusNode: focusManager.attachmentCheckboxFocusNode,
nextFocusNode: focusManager.searchButtonFocusNode),
),
_buildListButton(context, controller.responsiveUtils),
],
);
}
lib/features/mailbox_dashboard/presentation/widgets/advanced_search/advanced_search_filter_overlay.dart
+2 -3
View File
@@ -17,8 +17,7 @@ class AdvancedSearchFilterOverlay extends StatelessWidget {
constraints: BoxConstraints(
maxHeight: _getHeightOverlay(context),
),
margin: const EdgeInsetsDirectional.only(top: 4, bottom: 16),
padding: const EdgeInsets.symmetric(horizontal: 8),
margin: const EdgeInsetsDirectional.only(top: 2, bottom: 16),
decoration: const BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.all(Radius.circular(16)),
@@ -34,7 +33,7 @@ class AdvancedSearchFilterOverlay extends StatelessWidget {
]
),
child: SingleChildScrollView(
padding: const EdgeInsets.symmetric(vertical: 16, horizontal: 24),
padding: const EdgeInsets.symmetric(vertical: 24, horizontal: 32),
child: AdvancedSearchInputForm(),
),
),
lib/features/mailbox_dashboard/presentation/widgets/advanced_search/advanced_search_input_form.dart
+65 -40
View File
@@ -45,6 +45,7 @@ class AdvancedSearchInputForm extends GetWidget<AdvancedFilterController>
onSearchAction: controller.onSearchAction,
onRemoveDraggableEmailAddressAction: controller.removeDraggableEmailAddress,
)),
const SizedBox(height: 12),
Obx(() => TextFieldAutocompleteEmailAddressWeb(
field: AdvancedSearchFilterField.to,
listEmailAddress: controller.listToEmailAddress,
@@ -62,6 +63,7 @@ class AdvancedSearchInputForm extends GetWidget<AdvancedFilterController>
onSearchAction: controller.onSearchAction,
onRemoveDraggableEmailAddressAction: controller.removeDraggableEmailAddress,
)),
const SizedBox(height: 12),
_buildFilterField(
textEditingController: controller.subjectFilterInputController,
context: context,
@@ -73,6 +75,7 @@ class AdvancedSearchInputForm extends GetWidget<AdvancedFilterController>
value
),
),
const SizedBox(height: 12),
_buildFilterField(
textEditingController: controller.hasKeyWordFilterInputController,
context: context,
@@ -84,6 +87,7 @@ class AdvancedSearchInputForm extends GetWidget<AdvancedFilterController>
value
),
),
const SizedBox(height: 12),
_buildFilterField(
textEditingController: controller.notKeyWordFilterInputController,
context: context,
@@ -95,6 +99,7 @@ class AdvancedSearchInputForm extends GetWidget<AdvancedFilterController>
value
),
),
const SizedBox(height: 12),
_buildFilterField(
textEditingController: controller.mailBoxFilterInputController,
context: context,
@@ -105,6 +110,7 @@ class AdvancedSearchInputForm extends GetWidget<AdvancedFilterController>
mouseCursor: SystemMouseCursors.click,
onTap: () => controller.selectedMailBox(context)
),
const SizedBox(height: 12),
Row(children: [
Expanded(child: _buildFilterField(
context: context,
@@ -117,21 +123,37 @@ class AdvancedSearchInputForm extends GetWidget<AdvancedFilterController>
);
},
)),
const SizedBox(width: 10),
buildIconWeb(
icon: SvgPicture.asset(
controller.imagePaths.icCalendarSB,
width: 24,
height: 24,
fit: BoxFit.fill),
tooltip: AppLocalizations.of(context).selectDate,
iconPadding: EdgeInsets.zero,
onTap: () => controller.selectDateRange(context)),
const SizedBox(width: 8),
Container(
decoration: BoxDecoration(
border: Border.all(
color: AdvancedSearchInputFormStyle.inputFieldBorderColor,
width: AdvancedSearchInputFormStyle.inputFieldBorderWidth,
),
borderRadius: const BorderRadius.all(
Radius.circular(
AdvancedSearchInputFormStyle.inputFieldBorderRadius,
),
),
),
height: 44,
width: 44,
child: TMailButtonWidget.fromIcon(
icon: controller.imagePaths.icCalendarSB,
iconSize: 22,
iconColor: AppColor.steelGray400,
backgroundColor: Colors.transparent,
tooltipMessage: AppLocalizations.of(context).selectDate,
onTapActionCallback: () => controller.selectDateRange(context),
),
),
]),
const SizedBox(height: 12),
_buildFilterField(
context: context,
advancedSearchFilterField: AdvancedSearchFilterField.sortBy
),
const SizedBox(height: 24),
AdvancedSearchFilterFormBottomView(focusManager: controller.focusManager)
],
),
@@ -165,13 +187,15 @@ class AdvancedSearchInputForm extends GetWidget<AdvancedFilterController>
}) {
final child = [
SizedBox(
width: controller.responsiveUtils.isMobile(context) || controller.responsiveUtils.landscapeTabletSupported(context)
? null : 112,
width: _isVerticalArrange(context) ? null : 112,
child: LabelAdvancedSearchFieldWidget(
name: advancedSearchFilterField.getTitle(context),
),
),
const Padding(padding: EdgeInsets.all(4)),
if (_isVerticalArrange(context))
const SizedBox(height: 12)
else
const SizedBox(width: 12),
if (controller.responsiveUtils.isMobile(context))
_buildTextField(
isSelectFormList: isSelectFormList,
@@ -226,19 +250,20 @@ class AdvancedSearchInputForm extends GetWidget<AdvancedFilterController>
),
)
];
return Padding(
padding: const EdgeInsets.symmetric(vertical: 8),
child: controller.responsiveUtils.isMobile(context) || controller.responsiveUtils.landscapeTabletSupported(context)
? Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: child,
)
: SizedBox(height: 44, child: Row(children: child)),
);
return _isVerticalArrange(context)
? Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: child,
)
: SizedBox(height: 44, child: Row(children: child));
}
bool _isVerticalArrange(BuildContext context) =>
controller.responsiveUtils.isMobile(context) ||
controller.responsiveUtils.landscapeTabletSupported(context);
Widget _buildTextFieldFilterForWeb({
required BuildContext context,
required AdvancedSearchFilterField advancedSearchFilterField,
@@ -318,32 +343,32 @@ class AdvancedSearchInputForm extends GetWidget<AdvancedFilterController>
onTextChange: onTextChange,
decoration: InputDecoration(
filled: true,
fillColor: isSelectFormList ? AppColor.colorItemSelected : Colors.white,
contentPadding: const EdgeInsetsDirectional.symmetric(horizontal: 12),
enabledBorder: OutlineInputBorder(
borderRadius: const BorderRadius.all(
Radius.circular(10),
fillColor: AdvancedSearchInputFormStyle.inputFieldBackgroundColor,
contentPadding: const EdgeInsetsDirectional.only(start: 12, end: 8),
enabledBorder: const OutlineInputBorder(
borderRadius: BorderRadius.all(
Radius.circular(AdvancedSearchInputFormStyle.inputFieldBorderRadius),
),
borderSide: BorderSide(
width: isSelectFormList ? 0.5 : 1,
color: AppColor.colorInputBorderCreateMailbox,
width: AdvancedSearchInputFormStyle.inputFieldBorderWidth,
color: AdvancedSearchInputFormStyle.inputFieldBorderColor,
),
),
border: OutlineInputBorder(
borderRadius: const BorderRadius.all(
Radius.circular(10),
border: const OutlineInputBorder(
borderRadius: BorderRadius.all(
Radius.circular(AdvancedSearchInputFormStyle.inputFieldBorderRadius),
),
borderSide: BorderSide(
width: isSelectFormList ? 0.5 : 1,
color: AppColor.colorInputBorderCreateMailbox,
width: AdvancedSearchInputFormStyle.inputFieldBorderWidth,
color: AdvancedSearchInputFormStyle.inputFieldBorderColor,
),
),
focusedBorder: OutlineInputBorder(
borderRadius: const BorderRadius.all(
Radius.circular(10),
focusedBorder: const OutlineInputBorder(
borderRadius: BorderRadius.all(
Radius.circular(AdvancedSearchInputFormStyle.inputFieldBorderRadius),
),
borderSide: BorderSide(
width: isSelectFormList ? 0.5 : 1,
width: AdvancedSearchInputFormStyle.inputFieldBorderWidth,
color: AppColor.primaryColor,
),
),
lib/features/mailbox_dashboard/presentation/widgets/advanced_search/date_drop_down_button.dart
+17 -12
View File
@@ -1,4 +1,3 @@
import 'package:core/presentation/extensions/color_extension.dart';
import 'package:core/presentation/resources/image_paths.dart';
import 'package:core/presentation/utils/style_utils.dart';
import 'package:dropdown_button2/dropdown_button2.dart';
@@ -38,14 +37,16 @@ class DateDropDownButton extends StatelessWidget {
customButton: Container(
height: 44,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
border: Border.all(
color: AppColor.colorInputBorderCreateMailbox,
width: 0.5,
borderRadius: const BorderRadius.all(
Radius.circular(AdvancedSearchInputFormStyle.inputFieldBorderRadius),
),
color: AppColor.colorInputBackgroundCreateMailbox
border: Border.all(
color: AdvancedSearchInputFormStyle.inputFieldBorderColor,
width: AdvancedSearchInputFormStyle.inputFieldBorderWidth,
),
color: AdvancedSearchInputFormStyle.inputFieldBackgroundColor,
),
padding: const EdgeInsets.only(left: 12, right: 10),
padding: const EdgeInsetsDirectional.only(start: 12, end: 8),
child: Row(children: [
Expanded(child: Text(
receiveTimeSelected?.getTitle(context, startDate: startDate, endDate: endDate) ?? '',
@@ -64,13 +65,17 @@ class DateDropDownButton extends StatelessWidget {
},
buttonStyleData: ButtonStyleData(
height: 44,
padding: const EdgeInsets.symmetric(horizontal: 12),
padding: const EdgeInsetsDirectional.only(start: 12, end: 8),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
borderRadius: const BorderRadius.all(
Radius.circular(AdvancedSearchInputFormStyle.inputFieldBorderRadius),
),
border: Border.all(
color: AppColor.colorInputBorderCreateMailbox,
width: 1),
color: AppColor.colorInputBackgroundCreateMailbox)
color: AdvancedSearchInputFormStyle.inputFieldBorderColor,
width: AdvancedSearchInputFormStyle.inputFieldBorderWidth,
),
color: AdvancedSearchInputFormStyle.inputFieldBackgroundColor,
)
),
dropdownStyleData: DropdownStyleData(
maxHeight: 200,
lib/features/mailbox_dashboard/presentation/widgets/advanced_search/sort_by_drop_down_button.dart
+14 -11
View File
@@ -1,4 +1,3 @@
import 'package:core/presentation/extensions/color_extension.dart';
import 'package:core/presentation/resources/image_paths.dart';
import 'package:core/presentation/utils/style_utils.dart';
import 'package:dropdown_button2/dropdown_button2.dart';
@@ -64,12 +63,14 @@ class SortByDropDownButton extends StatelessWidget {
customButton: Container(
height: SortByDropdownStyle.height,
decoration: BoxDecoration(
borderRadius: SortByDropdownStyle.buttonBorderRadius,
border: Border.all(
color: AppColor.colorInputBorderCreateMailbox,
width: SortByDropdownStyle.buttonBorderWidth,
borderRadius: const BorderRadius.all(
Radius.circular(AdvancedSearchInputFormStyle.inputFieldBorderRadius),
),
color: AppColor.colorInputBackgroundCreateMailbox
border: Border.all(
color: AdvancedSearchInputFormStyle.inputFieldBorderColor,
width: AdvancedSearchInputFormStyle.inputFieldBorderWidth,
),
color: AdvancedSearchInputFormStyle.inputFieldBackgroundColor,
),
padding: SortByDropdownStyle.buttonPadding,
child: Row(
@@ -92,12 +93,14 @@ class SortByDropDownButton extends StatelessWidget {
height: SortByDropdownStyle.height,
padding: SortByDropdownStyle.buttonPadding,
decoration: BoxDecoration(
borderRadius: SortByDropdownStyle.buttonBorderRadius,
border: Border.all(
color: AppColor.colorInputBorderCreateMailbox,
width: SortByDropdownStyle.buttonBorderWidth,
borderRadius: const BorderRadius.all(
Radius.circular(AdvancedSearchInputFormStyle.inputFieldBorderRadius),
),
color: AppColor.colorInputBackgroundCreateMailbox
border: Border.all(
color: AdvancedSearchInputFormStyle.inputFieldBorderColor,
width: AdvancedSearchInputFormStyle.inputFieldBorderWidth,
),
color: AdvancedSearchInputFormStyle.inputFieldBackgroundColor,
)
),
dropdownStyleData: DropdownStyleData(
lib/features/mailbox_dashboard/presentation/widgets/advanced_search/text_field_autocomplete_email_address_web.dart
+130 -134
View File
@@ -99,143 +99,139 @@ class _TextFieldAutocompleteEmailAddressWebState extends State<TextFieldAutocomp
@override
Widget build(BuildContext context) {
return Padding(
padding: TextFieldAutoCompleteEmailAddressWebStyles.padding,
child: LayoutBuilder(
builder: ((context, constraints) {
return Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
SizedBox(
width: TextFieldAutoCompleteEmailAddressWebStyles.fieldTitleWidth,
child: LabelAdvancedSearchFieldWidget(
name: widget.field.getTitle(context),
),
return LayoutBuilder(
builder: ((context, constraints) {
return Row(
children: [
SizedBox(
width: TextFieldAutoCompleteEmailAddressWebStyles.fieldTitleWidth,
child: LabelAdvancedSearchFieldWidget(
name: widget.field.getTitle(context),
),
const SizedBox(width: TextFieldAutoCompleteEmailAddressWebStyles.space),
Expanded(
child: StatefulBuilder(
builder: ((context, setState) {
return DragTarget<DraggableEmailAddress>(
onAcceptWithDetails: (draggableEmailAddress) =>
_handleAcceptDraggableEmailAddressAction(
draggableEmailAddress.data,
setState
),
onLeave: (draggableEmailAddress) {
if (_isDragging) {
setState(() => _isDragging = false);
}
},
onMove: (details) {
if (!_isDragging) {
setState(() => _isDragging = true);
}
},
builder: (_, __, ___) {
return TagEditor<SuggestionEmailAddress>(
key: widget.keyTagEditor,
length: _collapsedListEmailAddress.length,
controller: widget.controller,
focusNodeKeyboard: widget.focusNode,
keyboardType: TextInputType.emailAddress,
textInputAction: TextInputAction.done,
cursorColor: TextFieldAutoCompleteEmailAddressWebStyles.cursorColor,
debounceDuration: TextFieldAutoCompleteEmailAddressWebStyles.debounceDuration,
inputDecoration: InputDecoration(
filled: true,
fillColor: TextFieldAutoCompleteEmailAddressWebStyles.textInputFillColor,
border: TextFieldAutoCompleteEmailAddressWebStyles.textInputBorder,
hintText: widget.field.getHintText(context),
hintStyle: TextFieldAutoCompleteEmailAddressWebStyles.textInputHintStyle,
isDense: true,
contentPadding: _currentListEmailAddress.isNotEmpty
? TextFieldAutoCompleteEmailAddressWebStyles.textInputContentPaddingWithSomeTag
: TextFieldAutoCompleteEmailAddressWebStyles.textInputContentPadding
),
padding: _currentListEmailAddress.isNotEmpty
? TextFieldAutoCompleteEmailAddressWebStyles.tagEditorPadding
: EdgeInsets.zero,
borderRadius: TextFieldAutoCompleteEmailAddressWebStyles.borderRadius,
borderSize: TextFieldAutoCompleteEmailAddressWebStyles.borderWidth,
focusedBorderColor: TextFieldAutoCompleteEmailAddressWebStyles.focusedBorderColor,
enableBorder: true,
enableBorderColor: _isDragging
? AppColor.primaryColor
: AppColor.colorInputBorderCreateMailbox,
minTextFieldWidth: TextFieldAutoCompleteEmailAddressWebStyles.minTextFieldWidth,
resetTextOnSubmitted: true,
autoScrollToInput: false,
suggestionsBoxElevation: TextFieldAutoCompleteEmailAddressWebStyles.suggestionBoxElevation,
suggestionsBoxBackgroundColor: TextFieldAutoCompleteEmailAddressWebStyles.suggestionBoxBackgroundColor,
suggestionsBoxRadius: TextFieldAutoCompleteEmailAddressWebStyles.suggestionBoxRadius,
suggestionsBoxMaxHeight: TextFieldAutoCompleteEmailAddressWebStyles.suggestionBoxMaxHeight,
suggestionItemHeight: TextFieldAutoCompleteEmailAddressWebStyles.suggestionBoxItemHeight,
suggestionBoxWidth: _getSuggestionBoxWidth(constraints.maxWidth),
textStyle: AdvancedSearchInputFormStyle.inputTextStyle,
onFocusTagAction: (focused) => _handleFocusTagAction.call(focused, setState),
onDeleteTagAction: () => _handleDeleteLatestTagAction.call(setState),
onSelectOptionAction: (item) => _handleSelectOptionAction.call(item, setState),
onSubmitted: (value) => _handleSubmitTagAction.call(value, setState),
tagBuilder: (context, index) {
final currentEmailAddress = _currentListEmailAddress.elementAt(index);
final isLatestEmail = currentEmailAddress == _currentListEmailAddress.last;
return AutoCompleteTagItemWidgetWeb(
field: widget.field,
currentEmailAddress: currentEmailAddress,
currentListEmailAddress: _currentListEmailAddress,
collapsedListEmailAddress: _collapsedListEmailAddress,
isLatestEmail: isLatestEmail,
isCollapsed: _isCollapse,
isLatestTagFocused: _lastTagFocused,
onDeleteTagAction: (emailAddress) => _handleDeleteTagAction.call(emailAddress, setState),
onShowFullAction: widget.onShowFullListEmailAddressAction,
);
},
onTagChanged: (tag) => _handleOnTagChangeAction.call(tag, setState),
findSuggestions: (queryString) => _findSuggestions(
queryString,
limit: AppConfig.defaultLimitAutocomplete,
),
isLoadMoreOnlyOnce: true,
isLoadMoreReplaceAllOld: false,
loadMoreSuggestions: _findSuggestions,
suggestionBuilder: (context, tagEditorState, suggestionEmailAddress, index, length, highlight, suggestionValid) {
return RecipientSuggestionItemWidget(
imagePaths: _imagePaths,
suggestionState: suggestionEmailAddress.state,
emailAddress: suggestionEmailAddress.emailAddress,
suggestionValid: suggestionValid,
highlight: highlight,
onSelectedAction: (emailAddress) {
setState(() => _currentListEmailAddress.add(emailAddress));
_updateListEmailAddressAction();
tagEditorState.resetTextField();
tagEditorState.closeSuggestionBox();
},
);
},
onHandleKeyEventAction: (event) {
if (event is KeyDownEvent) {
switch (event.logicalKey) {
case LogicalKeyboardKey.tab:
widget.nextFocusNode?.requestFocus();
break;
default:
break;
}
}
},
);
),
const SizedBox(width: TextFieldAutoCompleteEmailAddressWebStyles.space),
Expanded(
child: StatefulBuilder(
builder: ((context, setState) {
return DragTarget<DraggableEmailAddress>(
onAcceptWithDetails: (draggableEmailAddress) =>
_handleAcceptDraggableEmailAddressAction(
draggableEmailAddress.data,
setState
),
onLeave: (draggableEmailAddress) {
if (_isDragging) {
setState(() => _isDragging = false);
}
);
})
),
},
onMove: (details) {
if (!_isDragging) {
setState(() => _isDragging = true);
}
},
builder: (_, __, ___) {
return TagEditor<SuggestionEmailAddress>(
key: widget.keyTagEditor,
length: _collapsedListEmailAddress.length,
controller: widget.controller,
focusNodeKeyboard: widget.focusNode,
keyboardType: TextInputType.emailAddress,
textInputAction: TextInputAction.done,
cursorColor: TextFieldAutoCompleteEmailAddressWebStyles.cursorColor,
debounceDuration: TextFieldAutoCompleteEmailAddressWebStyles.debounceDuration,
inputDecoration: InputDecoration(
filled: true,
fillColor: TextFieldAutoCompleteEmailAddressWebStyles.textInputFillColor,
border: TextFieldAutoCompleteEmailAddressWebStyles.textInputBorder,
hintText: widget.field.getHintText(context),
hintStyle: TextFieldAutoCompleteEmailAddressWebStyles.textInputHintStyle,
isDense: true,
contentPadding: _currentListEmailAddress.isNotEmpty
? TextFieldAutoCompleteEmailAddressWebStyles.textInputContentPaddingWithSomeTag
: TextFieldAutoCompleteEmailAddressWebStyles.textInputContentPadding
),
padding: _currentListEmailAddress.isNotEmpty
? TextFieldAutoCompleteEmailAddressWebStyles.tagEditorPadding
: EdgeInsets.zero,
borderRadius: AdvancedSearchInputFormStyle.inputFieldBorderRadius,
borderSize: AdvancedSearchInputFormStyle.inputFieldBorderWidth,
focusedBorderColor: TextFieldAutoCompleteEmailAddressWebStyles.focusedBorderColor,
enableBorder: true,
enableBorderColor: _isDragging
? AppColor.primaryColor
: AdvancedSearchInputFormStyle.inputFieldBorderColor,
minTextFieldWidth: TextFieldAutoCompleteEmailAddressWebStyles.minTextFieldWidth,
resetTextOnSubmitted: true,
autoScrollToInput: false,
suggestionsBoxElevation: TextFieldAutoCompleteEmailAddressWebStyles.suggestionBoxElevation,
suggestionsBoxBackgroundColor: TextFieldAutoCompleteEmailAddressWebStyles.suggestionBoxBackgroundColor,
suggestionsBoxRadius: TextFieldAutoCompleteEmailAddressWebStyles.suggestionBoxRadius,
suggestionsBoxMaxHeight: TextFieldAutoCompleteEmailAddressWebStyles.suggestionBoxMaxHeight,
suggestionItemHeight: TextFieldAutoCompleteEmailAddressWebStyles.suggestionBoxItemHeight,
suggestionBoxWidth: _getSuggestionBoxWidth(constraints.maxWidth),
textStyle: AdvancedSearchInputFormStyle.inputTextStyle,
onFocusTagAction: (focused) => _handleFocusTagAction.call(focused, setState),
onDeleteTagAction: () => _handleDeleteLatestTagAction.call(setState),
onSelectOptionAction: (item) => _handleSelectOptionAction.call(item, setState),
onSubmitted: (value) => _handleSubmitTagAction.call(value, setState),
tagBuilder: (context, index) {
final currentEmailAddress = _currentListEmailAddress.elementAt(index);
final isLatestEmail = currentEmailAddress == _currentListEmailAddress.last;
return AutoCompleteTagItemWidgetWeb(
field: widget.field,
currentEmailAddress: currentEmailAddress,
currentListEmailAddress: _currentListEmailAddress,
collapsedListEmailAddress: _collapsedListEmailAddress,
isLatestEmail: isLatestEmail,
isCollapsed: _isCollapse,
isLatestTagFocused: _lastTagFocused,
onDeleteTagAction: (emailAddress) => _handleDeleteTagAction.call(emailAddress, setState),
onShowFullAction: widget.onShowFullListEmailAddressAction,
);
},
onTagChanged: (tag) => _handleOnTagChangeAction.call(tag, setState),
findSuggestions: (queryString) => _findSuggestions(
queryString,
limit: AppConfig.defaultLimitAutocomplete,
),
isLoadMoreOnlyOnce: true,
isLoadMoreReplaceAllOld: false,
loadMoreSuggestions: _findSuggestions,
suggestionBuilder: (context, tagEditorState, suggestionEmailAddress, index, length, highlight, suggestionValid) {
return RecipientSuggestionItemWidget(
imagePaths: _imagePaths,
suggestionState: suggestionEmailAddress.state,
emailAddress: suggestionEmailAddress.emailAddress,
suggestionValid: suggestionValid,
highlight: highlight,
onSelectedAction: (emailAddress) {
setState(() => _currentListEmailAddress.add(emailAddress));
_updateListEmailAddressAction();
tagEditorState.resetTextField();
tagEditorState.closeSuggestionBox();
},
);
},
onHandleKeyEventAction: (event) {
if (event is KeyDownEvent) {
switch (event.logicalKey) {
case LogicalKeyboardKey.tab:
widget.nextFocusNode?.requestFocus();
break;
default:
break;
}
}
},
);
}
);
})
),
],
);
})
),
),
],
);
})
);
}
lib/features/mailbox_dashboard/presentation/widgets/navigation_bar/navigation_bar_widget.dart
+6 -1
View File
@@ -1,3 +1,5 @@
import 'dart:math';
import 'package:core/presentation/extensions/color_extension.dart';
import 'package:core/presentation/resources/image_paths.dart';
import 'package:core/presentation/utils/responsive_utils.dart';
@@ -61,7 +63,10 @@ class NavigationBarWidget extends StatelessWidget {
return Row(
children: [
SizedBox(
width: constraint.maxWidth / 2,
width: min(
max(constraint.maxWidth / 2, 576),
constraint.maxWidth,
),
height: 52,
child: searchForm
),
lib/features/mailbox_dashboard/presentation/widgets/search_input_form_widget.dart
+4 -1
View File
@@ -2,6 +2,7 @@
import 'package:core/presentation/extensions/color_extension.dart';
import 'package:core/presentation/resources/image_paths.dart';
import 'package:core/presentation/utils/responsive_utils.dart';
import 'package:core/presentation/utils/theme_utils.dart';
import 'package:core/presentation/views/button/icon_button_web.dart';
import 'package:core/presentation/views/button/tmail_button_widget.dart';
import 'package:core/presentation/views/quick_search/quick_search_input_form.dart';
@@ -248,7 +249,9 @@ class SearchInputFormWidget extends StatelessWidget with AppLoaderMixin {
enabledBorder: InputBorder.none,
contentPadding: EdgeInsets.zero,
hintText: AppLocalizations.of(context).search_emails,
hintStyle: const TextStyle(color: AppColor.colorHintSearchBar, fontSize: 16.0),
hintStyle: ThemeUtils.textStyleBodyBody2(
color: AppColor.steelGray400,
),
labelStyle: const TextStyle(color: Colors.black, fontSize: 16.0)
),
leftButton: Padding(