reactive_input_decorator 0.0.6

artflutter · Nov 5, 2024 · e67f2b2 · e67f2b2
1 parent 1c86e72
commit e67f2b2
Show file tree

Hide file tree

Showing 5 changed files with 60 additions and 7 deletions.
diff --git a/packages/reactive_input_decorator/CHANGELOG.md b/packages/reactive_input_decorator/CHANGELOG.md
@@ -1,3 +1,8 @@
+## 0.0.6
+
+* `errorBuilder`
+* `markAsTouched`
+
 ## 0.0.5
 
 * export `ReactiveInputDecoratorStack`

diff --git a/packages/reactive_input_decorator/example/pubspec.lock b/packages/reactive_input_decorator/example/pubspec.lock
@@ -161,7 +161,7 @@ packages:
       path: ".."
       relative: true
     source: path
-    version: "0.0.4"
+    version: "0.0.6"
   sky_engine:
     dependency: transitive
     description: flutter

diff --git a/packages/reactive_input_decorator/lib/src/reactive_input_decorator.dart b/packages/reactive_input_decorator/lib/src/reactive_input_decorator.dart
@@ -1,8 +1,19 @@
 import 'package:flutter/material.dart';
 import 'package:reactive_forms/reactive_forms.dart';
 
+enum MarkAsTouched {
+  none,
+  pointerUp,
+  pointerDown;
+}
+
 const decorationInvisible = InputDecoration(
   border: InputBorder.none,
+  enabledBorder: InputBorder.none,
+  errorBorder: InputBorder.none,
+  focusedBorder: InputBorder.none,
+  focusedErrorBorder: InputBorder.none,
+  disabledBorder: InputBorder.none,
   contentPadding: EdgeInsets.fromLTRB(0, 0, 0, 0),
   isDense: true,
   isCollapsed: true,
@@ -94,19 +105,37 @@ class ReactiveInputDecorator extends ReactiveFormField<dynamic, dynamic> {
     TextStyle? baseStyle,
     TextAlign? textAlign,
     TextAlignVertical? textAlignVertical,
+    Widget Function(BuildContext context, String error)? errorBuilder,
+    MarkAsTouched markAsTouched = MarkAsTouched.pointerDown,
   }) : super(
           builder: (field) {
             final effectiveDecoration = (decoration ?? const InputDecoration())
                 .applyDefaults(Theme.of(field.context).inputDecorationTheme);
 
+            final errorText = field.errorText;
+
             return IgnorePointer(
               ignoring: !field.control.enabled,
               child: Listener(
-                onPointerDown: (_) => field.control.markAsTouched(),
+                onPointerDown: markAsTouched == MarkAsTouched.pointerDown ? (_) => field.control.markAsTouched() : null,
+                onPointerUp: markAsTouched == MarkAsTouched.pointerUp ? (_) => field.control.markAsTouched() : null,
                 child: InputDecorator(
                   decoration: effectiveDecoration.copyWith(
-                    errorText: field.errorText,
+                    errorText: errorBuilder == null ? field.errorText : null,
                     enabled: field.control.enabled,
+                      error: errorBuilder != null && errorText != null
+                          ? DefaultTextStyle(
+                        style: Theme.of(field.context)
+                            .textTheme
+                            .bodySmall
+                            ?.copyWith(
+                          color:
+                          Theme.of(field.context).colorScheme.error,
+                        ) ??
+                            const TextStyle(),
+                        child: errorBuilder.call(field.context, errorText),
+                      )
+                          : null
                   ),
                   expands: expands,
                   baseStyle: baseStyle,

diff --git a/packages/reactive_input_decorator/lib/src/reactive_input_decorator_stack.dart b/packages/reactive_input_decorator/lib/src/reactive_input_decorator_stack.dart
@@ -1,5 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:reactive_forms/reactive_forms.dart';
+import 'package:reactive_input_decorator/reactive_input_decorator.dart';
 
 /// A [ReactiveInputDecorator] that contains a [InputDecorator].
 ///
@@ -88,21 +89,39 @@ class ReactiveInputDecoratorStack extends ReactiveFormField<dynamic, dynamic> {
     TextStyle? baseStyle,
     TextAlign? textAlign,
     TextAlignVertical? textAlignVertical,
+    Widget Function(BuildContext context, String error)? errorBuilder,
+    MarkAsTouched markAsTouched = MarkAsTouched.pointerDown,
   }) : super(
           builder: (field) {
             final effectiveDecoration = (decoration ?? const InputDecoration())
                 .applyDefaults(Theme.of(field.context).inputDecorationTheme);
 
+            final errorText = field.errorText;
+
             return IgnorePointer(
               ignoring: !field.control.enabled,
               child: Listener(
-                onPointerDown: (_) => field.control.markAsTouched(),
+                onPointerDown: markAsTouched == MarkAsTouched.pointerDown ? (_) => field.control.markAsTouched() : null,
+                onPointerUp: markAsTouched == MarkAsTouched.pointerUp ? (_) => field.control.markAsTouched() : null,
                 child: Stack(
                   children: [
                     InputDecorator(
                       decoration: effectiveDecoration.copyWith(
-                        errorText: field.errorText,
-                        enabled: field.control.enabled,
+                          errorText: errorBuilder == null ? field.errorText : null,
+                          enabled: field.control.enabled,
+                          error: errorBuilder != null && errorText != null
+                              ? DefaultTextStyle(
+                            style: Theme.of(field.context)
+                                .textTheme
+                                .bodySmall
+                                ?.copyWith(
+                              color:
+                              Theme.of(field.context).colorScheme.error,
+                            ) ??
+                                const TextStyle(),
+                            child: errorBuilder.call(field.context, errorText),
+                          )
+                              : null
                       ),
                       expands: expands,
                       baseStyle: baseStyle,

diff --git a/packages/reactive_input_decorator/pubspec.yaml b/packages/reactive_input_decorator/pubspec.yaml
@@ -1,6 +1,6 @@
 name: reactive_input_decorator
 description: Wrapper around input_decorator to use with reactive_forms.
-version: 0.0.5
+version: 0.0.6
 repository: https://github.com/artflutter/reactive_forms_widgets/tree/master/packages/reactive_input_decorator
 issue_tracker: https://github.com/artflutter/reactive_forms_widgets/issues