Merge pull request #1725 from thetableman/NameElement

Update ui.icon to have updatable name

nicegui/elements/icon.py

@@ -1,9 +1,10 @@
 from typing import Optional
 
 from .mixins.color_elements import TextColorElement
+from .mixins.name_element import NameElement
 
 
-class Icon(TextColorElement):
+class Icon(NameElement, TextColorElement):
 
     def __init__(self,
                  name: str,
@@ -21,8 +22,7 @@ def __init__(self,
         :param size: size in CSS units, including unit name or standard size name (xs|sm|md|lg|xl), examples: 16px, 2rem
         :param color: icon color (either a Quasar, Tailwind, or CSS color or `None`, default: `None`)
         """
-        super().__init__(tag='q-icon', text_color=color)
-        self._props['name'] = name
+        super().__init__(tag='q-icon', name=name, text_color=color)
 
         if size:
             self._props['size'] = size

nicegui/elements/mixins/name_element.py

@@ -0,0 +1,80 @@
+from typing import Any, Callable
+
+from typing_extensions import Self
+
+from ...binding import BindableProperty, bind, bind_from, bind_to
+from ...element import Element
+
+
+class NameElement(Element):
+    name = BindableProperty(on_change=lambda sender, name: sender.on_name_change(name))
+
+    def __init__(self, *, name: str, **kwargs: Any) -> None:
+        super().__init__(**kwargs)
+        self.name = name
+        self._props['name'] = name
+
+    def bind_name_to(self,
+                     target_object: Any,
+                     target_name: str = 'name',
+                     forward: Callable[..., Any] = lambda x: x,
+                     ) -> Self:
+        """Bind the name of this element to the target object's target_name property.
+
+        The binding works one way only, from this element to the target.
+
+        :param target_object: The object to bind to.
+        :param target_name: The name of the property to bind to.
+        :param forward: A function to apply to the value before applying it to the target.
+        """
+        bind_to(self, 'name', target_object, target_name, forward)
+        return self
+
+    def bind_name_from(self,
+                       target_object: Any,
+                       target_name: str = 'name',
+                       backward: Callable[..., Any] = lambda x: x,
+                       ) -> Self:
+        """Bind the name of this element from the target object's target_name property.
+
+        The binding works one way only, from the target to this element.
+
+        :param target_object: The object to bind from.
+        :param target_name: The name of the property to bind from.
+        :param backward: A function to apply to the value before applying it to this element.
+        """
+        bind_from(self, 'name', target_object, target_name, backward)
+        return self
+
+    def bind_name(self,
+                  target_object: Any,
+                  target_name: str = 'name', *,
+                  forward: Callable[..., Any] = lambda x: x,
+                  backward: Callable[..., Any] = lambda x: x,
+                  ) -> Self:
+        """Bind the name of this element to the target object's target_name property.
+
+        The binding works both ways, from this element to the target and from the target to this element.
+
+        :param target_object: The object to bind to.
+        :param target_name: The name of the property to bind to.
+        :param forward: A function to apply to the value before applying it to the target.
+        :param backward: A function to apply to the value before applying it to this element.
+        """
+        bind(self, 'name', target_object, target_name, forward=forward, backward=backward)
+        return self
+
+    def set_name(self, name: str) -> None:
+        """Set the name of this element.
+
+        :param name: The new name.
+        """
+        self.name = name
+
+    def on_name_change(self, name: str) -> None:
+        """Called when the name of this element changes.
+
+        :param name: The new name.
+        """
+        self._props['name'] = name
+        self.update()