Add samples for form textfield

forui/build.yaml

@@ -3,10 +3,6 @@
 targets:
   $default:
     builders:
-      stevia_runner:steviaAssetGenerator:
-        generate_for:
-          - assets/**
-
       mockito:mockBuilder:
         generate_for:
           - test/**.dart

forui/example/lib/main.dart

@@ -31,56 +31,43 @@ class ExampleWidget extends StatefulWidget {
 }
 
 class _ExampleWidgetState extends State<ExampleWidget> {
+  final GlobalKey<FormState> _formKey = GlobalKey<FormState>();
+
   @override
   void initState() {
     super.initState();
   }
 
   @override
   Widget build(BuildContext context) => Padding(
-        padding: const EdgeInsets.all(8.0),
-        child: Column(
-          mainAxisSize: MainAxisSize.min,
-          crossAxisAlignment: CrossAxisAlignment.start,
-          children: [
-            const SizedBox(height: 10),
-            Expanded(
-              child: FTabs(
-                tabs: [
-                  FTabEntry(
-                    label: 'Account',
-                    content: FCard(
-                      title: 'Account',
-                      subtitle: 'Make changes to your account here. Click save when you are done.',
-                      child: Column(
-                        children: [
-                          Container(
-                            color: Colors.red,
-                            height: 100,
-                          ),
-                        ],
-                      ),
-                    ),
-                  ),
-                  FTabEntry(
-                    label: 'Password',
-                    content: FCard(
-                      title: 'Password',
-                      subtitle: 'Change your password here. After saving, you will be logged out.',
-                      child: Column(
-                        children: [
-                          Container(
-                            color: Colors.blue,
-                            height: 100,
-                          )
-                        ],
-                      ),
-                    ),
-                  ),
-                ],
-              ),
+    padding: const EdgeInsets.all(8.0),
+    child: Form(
+      key: _formKey,
+      child: Column(
+        children: [
+          FTextField.email(
+            label: const Text('Email'),
+            hint: '[email protected]',
+            help: const Text(''),
+            validator: (value) => (value?.contains('@') ?? false) ? null : 'Please enter a valid email.',
+          ),
+          const SizedBox(height: 4),
+          FTextField.password(
+            label: const Text('Password'),
+            hint: '',
+            help: const Text(''),
+            validator: (value) => (value?.length ?? 0) >= 8 ? null : 'Password must be at least 8 characters long.',
+          ),
+          const SizedBox(height: 4),
+          Padding(
+            padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 30),
+            child: FButton(
+              rawLabel: const Text('Login'),
+              onPress: () => _formKey.currentState!.validate(),
             ),
-          ],
-        ),
-      );
+          )
+        ],
+      ),
+    )
+  );
 }

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

@@ -268,7 +268,7 @@ final class FTextField extends StatelessWidget {
   /// Whitespace characters (e.g. newline, space, tab) are included in the character count.
   ///
   /// If [maxLengthEnforcement] is [MaxLengthEnforcement.none], then more than [maxLength] characters may be entered,
-  /// but the error counter and divider will switch to the [style]'s [FTextFieldStyle.error] when the limit is exceeded.
+  /// but the error counter and divider will switch to the [style]'s [FTextFieldStyle.errorStyle] when the limit is exceeded.
   final int? maxLength;
 
   /// Determines how the [maxLength] limit should be enforced.
@@ -731,9 +731,9 @@ final class FTextField extends StatelessWidget {
     final theme = context.theme;
     final style = this.style ?? theme.textFieldStyle;
     final stateStyle = switch (this) {
-      _ when !enabled => style.disabled,
-      _ when error != null => style.error,
-      _ => style.enabled,
+      _ when !enabled => style.disabledStyle,
+      _ when error != null => style.errorStyle,
+      _ => style.enabledStyle,
     };
 
     final textFormField = MergeSemantics(
@@ -765,7 +765,6 @@ final class FTextField extends StatelessWidget {
               ),
               child: _Field(
                 parent: this,
-                initialDecoration: _decoration(style, stateStyle),
                 style: style,
                 stateStyle: stateStyle,
                 key: key,
@@ -790,57 +789,6 @@ final class FTextField extends StatelessWidget {
         : textFormField;
   }
 
-  InputDecoration _decoration(
-    FTextFieldStyle style,
-    FTextFieldStateStyle current,
-  ) => InputDecoration(
-    suffixIcon: suffix,
-    // See https://stackoverflow.com/questions/70771410/flutter-how-can-i-remove-the-content-padding-for-error-in-textformfield
-    prefix: Padding(padding: EdgeInsets.only(left: style.contentPadding.left)),
-    contentPadding: style.contentPadding.copyWith(left: 0),
-    hintText: hint,
-    hintStyle: current.hintTextStyle,
-    helper: help == null ? null : DefaultTextStyle.merge(style: current.footerTextStyle, child: help!),
-    helperStyle: current.footerTextStyle,
-    error: error == null ? null : DefaultTextStyle.merge(style: current.footerTextStyle, child: error!),
-    errorStyle: current.footerTextStyle,
-    disabledBorder: OutlineInputBorder(
-      borderSide: BorderSide(
-        color: style.disabled.unfocused.color,
-        width: style.disabled.unfocused.width,
-      ),
-      borderRadius: style.disabled.unfocused.radius,
-    ),
-    enabledBorder: OutlineInputBorder(
-      borderSide: BorderSide(
-        color: style.enabled.unfocused.color,
-        width: style.enabled.unfocused.width,
-      ),
-      borderRadius: style.enabled.unfocused.radius,
-    ),
-    focusedBorder: OutlineInputBorder(
-      borderSide: BorderSide(
-        color: style.enabled.focused.color,
-        width: style.enabled.focused.width,
-      ),
-      borderRadius: current.focused.radius,
-    ),
-    errorBorder: OutlineInputBorder(
-      borderSide: BorderSide(
-        color: style.error.unfocused.color,
-        width: style.error.unfocused.width,
-      ),
-      borderRadius: style.error.unfocused.radius,
-    ),
-    focusedErrorBorder: OutlineInputBorder(
-      borderSide: BorderSide(
-        color: style.error.focused.color,
-        width: style.error.focused.width,
-      ),
-      borderRadius: style.error.focused.radius,
-    ),
-  );
-
   @override
   void debugFillProperties(DiagnosticPropertiesBuilder properties) {
     super.debugFillProperties(properties);