code review, refactoring, documentation

nicegui/elements/input.py

@@ -17,7 +17,8 @@ class Input(ValidationElement, DisableableElement, component='input.js'):
                  password_toggle_button: bool = False,
                  on_change: Optional[Callable[..., Any]] = None,
                  autocomplete: Optional[List[str]] = None,
-                 validation: Optional[Union[Callable[..., Optional[str]], Dict[str, Callable[..., bool]]]] = None) -> None:
+                 validation: Optional[Union[Callable[..., Optional[str]], Dict[str, Callable[..., bool]]]] = None,
+                 ) -> None:
         """Text Input
 
         This element is based on Quasar's `QInput <https://quasar.dev/vue-components/input>`_ component.
@@ -26,8 +27,10 @@ class Input(ValidationElement, DisableableElement, component='input.js'):
         If you want to wait until the user confirms the input, you can register a custom event callback, e.g.
         `ui.input(...).on('keydown.enter', ...)` or `ui.input(...).on('blur', ...)`.
 
-        You can use the `validation` parameter to define a dictionary of validation rules.
+        You can use the `validation` parameter to define a dictionary of validation rules,
+        e.g. ``{'Too long!': lambda value: len(value) < 3}``.
         The key of the first rule that fails will be displayed as an error message.
+        Alternatively, you can pass a callable that returns an optional error message.
 
         Note about styling the input:
         Quasar's `QInput` component is a wrapper around a native `input` element.
@@ -42,7 +45,7 @@ class Input(ValidationElement, DisableableElement, component='input.js'):
         :param password_toggle_button: whether to show a button to toggle the password visibility (default: False)
         :param on_change: callback to execute when the value changes
         :param autocomplete: optional list of strings for autocompletion
-        :param validation: dictionary of validation rules, e.g. ``{'Too long!': lambda value: len(value) < 3}``
+        :param validation: dictionary of validation rules or a callable that returns an optional error message
         """
         super().__init__(value=value, on_value_change=on_change, validation=validation)
         if label is not None:

nicegui/elements/mixins/validation_element.py

@@ -21,17 +21,12 @@ class ValidationElement(ValueElement):
 
         :param error: The optional error message
         """
-        if error is None:
-            self.props(remove='error')
-        else:
-            self._props['error-message'] = error
-            self.props('error')
-            error_message_changed = self._error != error
-            if error_message_changed:
-                self.update()
+        if self._error == error:
+            return
         self._error = error
-        
-                
+        self._props['error'] = error is not None
+        self._props['error-message'] = error
+        self.update()
 
     def validate(self) -> bool:
         """Validate the current value and set the error message if necessary.

nicegui/elements/number.py

@@ -26,8 +26,10 @@ class Number(ValidationElement, DisableableElement):
 
         This element is based on Quasar's `QInput <https://quasar.dev/vue-components/input>`_ component.
 
-        You can use the `validation` parameter to define a dictionary of validation rules.
+        You can use the `validation` parameter to define a dictionary of validation rules,
+        e.g. ``{'Too small!': lambda value: value < 3}``.
         The key of the first rule that fails will be displayed as an error message.
+        Alternatively, you can pass a callable that returns an optional error message.
 
         :param label: displayed name for the number input
         :param placeholder: text to show if no value is entered
@@ -40,7 +42,7 @@ class Number(ValidationElement, DisableableElement):
         :param suffix: a suffix to append to the displayed value
         :param format: a string like "%.2f" to format the displayed value
         :param on_change: callback to execute when the value changes
-        :param validation: dictionary of validation rules, e.g. ``{'Too large!': lambda value: value < 3}``
+        :param validation: dictionary of validation rules or a callable that returns an optional error message
         """
         self.format = format
         super().__init__(tag='q-input', value=value, on_value_change=on_change, validation=validation)

nicegui/elements/textarea.py

@@ -1,4 +1,4 @@
-from typing import Any, Callable, Dict, Optional
+from typing import Any, Callable, Dict, Optional, Union
 
 from .input import Input
 
@@ -10,21 +10,23 @@ class Textarea(Input, component='input.js'):
                  placeholder: Optional[str] = None,
                  value: str = '',
                  on_change: Optional[Callable[..., Any]] = None,
-                 validation: Optional[Dict[str, Callable[..., bool]]] = None,
+                 validation: Optional[Union[Callable[..., Optional[str]], Dict[str, Callable[..., bool]]]] = None,
                  ) -> None:
         """Textarea
 
         This element is based on Quasar's `QInput <https://quasar.dev/vue-components/input>`_ component.
         The ``type`` is set to ``textarea`` to create a multi-line text input.
 
-        You can use the `validation` parameter to define a dictionary of validation rules.
+        You can use the `validation` parameter to define a dictionary of validation rules,
+        e.g. ``{'Too long!': lambda value: len(value) < 3}``.
         The key of the first rule that fails will be displayed as an error message.
+        Alternatively, you can pass a callable that returns an optional error message.
 
         :param label: displayed name for the textarea
         :param placeholder: text to show if no value is entered
         :param value: the initial value of the field
         :param on_change: callback to execute when the value changes
-        :param validation: dictionary of validation rules, e.g. ``{'Too long!': lambda value: len(value) < 3}``
+        :param validation: dictionary of validation rules or a callable that returns an optional error message
         """
         super().__init__(label, placeholder=placeholder, value=value, on_change=on_change, validation=validation)
         self._props['type'] = 'textarea'