Fix FTextField applying different padding across platforms & popover dismissal behavior in date/time fields (#620)

* Change default select alignment

* Fix `FTextField` applying different padding on mobile & desktop.

* Improves popover dismissal behavior in date/time fields

* Prepare Forui for review

* Fix typos

* Fix failing test

* Update windows-latest goldens

---------

Co-authored-by: Pante <[email protected]>

Author: Pante

forui/CHANGELOG.md

@@ -51,7 +51,7 @@ class _CalendarDateField extends FDateField implements FDateFieldCalendarPropert
     this.spacing = const FPortalSpacing(4),
     this.shift = FPortalShift.flip,
     this.offset = Offset.zero,
-    this.hideOnTapOutside = FHidePopoverRegion.anywhere,
+    this.hideOnTapOutside = FHidePopoverRegion.excludeTarget,
     this.dayBuilder = FCalendar.defaultDayBuilder,
     this.start,
     this.end,

forui/README.md

@@ -21,6 +21,11 @@ class FDateFieldCalendarProperties with Diagnosticable {
   final Offset offset;
 
   /// {@macro forui.widgets.FPopover.hideOnTapOutside}
+  ///
+  /// Defaults to [FHidePopoverRegion.excludeTarget].
+  ///
+  /// Setting [hideOnTapOutside] to [FHidePopoverRegion.anywhere] may result in the calendar disappearing and reappearing
+  /// when pressing and holding the input field, due to the popover being hidden and then immediately shown again.
   final FHidePopoverRegion hideOnTapOutside;
 
   /// Customizes the appearance of calendar days.

forui/bin/commands/style/style.dart

@@ -350,7 +350,7 @@ abstract class FDateField extends StatefulWidget {
   /// The [offset] property controls the offset of the picker popover. Defaults to [Offset.zero].
   ///
   /// [hideOnTapOutside] controls the region that can be tapped to hide the popover. Defaults to
-  /// [FHidePopoverRegion.anywhere].
+  /// [FHidePopoverRegion.excludeTarget].
   ///
   /// See also:
   /// * [FDateField] - Creates a date field with both input field and calendar.

forui/lib/src/widgets/date_field/calendar/calendar_date_field.dart

@@ -59,7 +59,7 @@ class FSelectController<T> extends FValueNotifier<T?> {
     required TickerProvider vsync,
     T? value,
     this.toggleable = false,
-    Duration popoverAnimationDuration = const Duration(milliseconds: 50),
+    Duration popoverAnimationDuration = const Duration(milliseconds: 100),
   }) : popover = FPopoverController(vsync: vsync, animationDuration: popoverAnimationDuration),
        super(value);
 

forui/lib/src/widgets/date_field/calendar/properties.dart

@@ -145,10 +145,10 @@ abstract class FSelect<T> extends StatefulWidget with FFormFieldProperties<T> {
   /// True if a clear button should be shown. Defaults to false.
   final bool clearable;
 
-  /// The alignment point on the popover. Defaults to [Alignment.topLeft].
+  /// The alignment point on the popover. Defaults to [AlignmentDirectional.topStart].
   final AlignmentGeometry anchor;
 
-  /// The alignment point on the select's field. Defaults to [Alignment.bottomLeft].
+  /// The alignment point on the select's field. Defaults to [AlignmentDirectional.bottomStart].
   final AlignmentGeometry fieldAnchor;
 
   /// The constraints to apply to the popover. Defaults to `const FAutoWidthPortalConstraints(maxHeight: 300)`.
@@ -266,8 +266,8 @@ abstract class FSelect<T> extends StatefulWidget with FFormFieldProperties<T> {
     MouseCursor mouseCursor = SystemMouseCursors.click,
     bool canRequestFocus = true,
     bool clearable = false,
-    AlignmentGeometry anchor = Alignment.topLeft,
-    AlignmentGeometry fieldAnchor = Alignment.bottomLeft,
+    AlignmentGeometry anchor = AlignmentDirectional.topStart,
+    AlignmentGeometry fieldAnchor = AlignmentDirectional.bottomStart,
     FPortalConstraints popoverConstraints = const FAutoWidthPortalConstraints(maxHeight: 300),
     FPortalSpacing spacing = const FPortalSpacing(4),
     Offset Function(Size, FPortalChildBox, FPortalBox) shift = FPortalShift.flip,
@@ -428,8 +428,8 @@ abstract class FSelect<T> extends StatefulWidget with FFormFieldProperties<T> {
     MouseCursor mouseCursor = SystemMouseCursors.click,
     bool canRequestFocus = true,
     bool clearable = false,
-    AlignmentGeometry anchor = Alignment.topLeft,
-    AlignmentGeometry fieldAnchor = Alignment.bottomLeft,
+    AlignmentGeometry anchor = AlignmentDirectional.topStart,
+    AlignmentGeometry fieldAnchor = AlignmentDirectional.bottomStart,
     FPortalConstraints popoverConstraints = const FAutoWidthPortalConstraints(maxHeight: 300),
     FPortalSpacing spacing = const FPortalSpacing(4),
     Offset Function(Size, FPortalChildBox, FPortalBox) shift = FPortalShift.flip,
@@ -525,8 +525,8 @@ abstract class FSelect<T> extends StatefulWidget with FFormFieldProperties<T> {
     this.mouseCursor = SystemMouseCursors.click,
     this.canRequestFocus = true,
     this.clearable = false,
-    this.anchor = Alignment.topLeft,
-    this.fieldAnchor = Alignment.bottomLeft,
+    this.anchor = AlignmentDirectional.topStart,
+    this.fieldAnchor = AlignmentDirectional.bottomStart,
     this.popoverConstraints = const FAutoWidthPortalConstraints(maxHeight: 300),
     this.spacing = const FPortalSpacing(4),
     this.shift = FPortalShift.flip,