Fix expanded text field (#680)

* Fix expanded text field

* Fix lychee

* Prepare Forui for review

---------

Co-authored-by: Pante <Pante@users.noreply.github.com>

Author: Pante

forui/CHANGELOG.md

@@ -20,6 +20,11 @@ We've added support for animated theme transitions. This should make transitions
 * Add `FWidgetStateMap.lerpWhere(...)`.
 
 
+## Others
+* Add `FLabel.expands`.
+* Fix `FTextField.expands` causing a render error.
+
+
 ## 0.15.1
 * Fix CLI generating incorrect icon mappings.
 * Fix CLI generating theme that references private constant.

forui/lib/src/theme/colors.dart

@@ -155,9 +155,9 @@ final class FColors with Diagnosticable {
     this.hoverLighten = 0.075,
     this.hoverDarken = 0.05,
     this.disabledOpacity = 0.5,
-  }) : assert(0.0 <= hoverLighten && hoverLighten <= 1.0, 'The hoverLighten must be between 0 and 1.'),
-       assert(0.0 <= hoverDarken && hoverDarken <= 1.0, 'The hoverDarken must be between 0 and 1.'),
-       assert(0 <= disabledOpacity && disabledOpacity <= 1, 'The disabledOpacity must be between 0 and 1.');
+  }) : assert(0.0 <= hoverLighten && hoverLighten <= 1.0, 'hoverLighten must be between 0 and 1.'),
+       assert(0.0 <= hoverDarken && hoverDarken <= 1.0, 'hoverDarken must be between 0 and 1.'),
+       assert(0 <= disabledOpacity && disabledOpacity <= 1, 'disabledOpacity must be between 0 and 1.');
 
   /// Creates a linear interpolation between two [FColors] using the given factor [t].
   factory FColors.lerp(FColors a, FColors b, double t) => FColors(

forui/lib/src/widgets/label.dart

@@ -56,6 +56,12 @@ class FLabel extends StatelessWidget {
   /// The axis that determines the layout direction.
   final Axis axis;
 
+  /// Whether the child should expand to fill the available space. Defaults to false.
+  ///
+  /// ## Contract
+  /// Only applicable when [axis] is [Axis.vertical].
+  final bool expands;
+
   /// The label's states.
   final Set<WidgetState> states;
 
@@ -70,9 +76,10 @@ class FLabel extends StatelessWidget {
     this.label,
     this.description,
     this.error,
+    this.expands = false,
     this.states = const {},
     super.key,
-  });
+  }) : assert(axis == Axis.vertical || !expands, 'expands can only be true when axis is vertical');
 
   @override
   Widget build(BuildContext context) {
@@ -100,6 +107,7 @@ class FLabel extends StatelessWidget {
         label: label,
         description: description,
         error: error,
+        expands: expands,
         states: states,
         child: child,
       ),
@@ -111,6 +119,7 @@ class FLabel extends StatelessWidget {
     super.debugFillProperties(properties);
     properties
       ..add(EnumProperty('axis', axis))
+      ..add(FlagProperty('expands', value: expands, ifTrue: 'expands'))
       ..add(IterableProperty('states', states));
   }
 }
@@ -206,6 +215,7 @@ class _FVerticalLabel extends StatelessWidget {
   final Widget? label;
   final Widget? description;
   final Widget? error;
+  final bool expands;
   final Set<WidgetState> states;
   final Widget child;
 
@@ -214,6 +224,7 @@ class _FVerticalLabel extends StatelessWidget {
     required this.label,
     required this.description,
     required this.error,
+    required this.expands,
     required this.states,
     required this.child,
   });
@@ -232,7 +243,12 @@ class _FVerticalLabel extends StatelessWidget {
             child: label!,
           ),
         ),
-      Padding(padding: style.childPadding, child: child),
+      if (expands)
+        Expanded(
+          child: Padding(padding: style.childPadding, child: child),
+        )
+      else
+        Padding(padding: style.childPadding, child: child),
       if (description != null)
         Padding(
           padding: style.descriptionPadding,
@@ -259,6 +275,7 @@ class _FVerticalLabel extends StatelessWidget {
     super.debugFillProperties(properties);
     properties
       ..add(StringProperty('style', style.toString()))
+      ..add(FlagProperty('expands', value: expands, ifTrue: 'expands'))
       ..add(IterableProperty('states', states));
   }
 }

forui/lib/src/widgets/text_field/text_field.dart

@@ -1188,6 +1188,7 @@ class _State extends State<FTextField> {
       // Error should never be null as doing so causes the widget tree to change. This causes overlays attached to
       // the textfield to fail as it is not smart enough to track the new location of the textfield in the widget tree.
       error: widget.error ?? const SizedBox(),
+      expands: widget.expands,
       child: widget.builder(context, style, states, textfield),
     );
 

forui/test/src/widgets/label/label_test.dart

@@ -6,6 +6,24 @@ import 'package:forui/forui.dart';
 import '../../test_scaffold.dart';
 
 void main() {
+  testWidgets('vertical and expands', (tester) async {
+    expect(
+      () => TestScaffold(
+        child: const FLabel(axis: Axis.vertical, expands: true, child: Text('Child')),
+      ),
+      returnsNormally,
+    );
+  });
+
+  testWidgets('horizontal and expands', (tester) async {
+    expect(
+      () => TestScaffold(
+        child: FLabel(axis: Axis.horizontal, expands: true, child: const Text('Child')),
+      ),
+      throwsAssertionError,
+    );
+  });
+
   testWidgets('renders child only when label, description, and error are null', (tester) async {
     await tester.pumpWidget(
       TestScaffold(

forui/test/src/widgets/text_field/text_field_test.dart

@@ -123,6 +123,12 @@ void main() {
     });
   });
 
+  testWidgets('expands', (tester) async {
+    await tester.pumpWidget(TestScaffold.app(child: const FTextField(maxLines: null, expands: true)));
+
+    expect(tester.takeException(), null);
+  });
+
   testWidgets('height does not change due to visual density on different platforms', (tester) async {
     debugDefaultTargetPlatformOverride = TargetPlatform.macOS;
     await tester.pumpWidget(TestScaffold.app(theme: FThemes.zinc.light, child: const FTextField()));

lychee.toml

@@ -14,5 +14,6 @@ exclude_path = [
 ]
 
 exclude = [
-    "https://ux.stackexchange.com/questions/105024/why-dont-button-html-elements-have-a-css-cursor-pointer-by-default"
+    "https://ux.stackexchange.com/questions/105024/why-dont-button-html-elements-have-a-css-cursor-pointer-by-default",
+    "https://lucide.dev/icons/"
 ]