ex4nicegui 0.8.0__py3-none-any.whl → 0.8.2__py3-none-any.whl

ex4nicegui/reactive/EChartsComponent/ECharts.js

@@ -56,7 +56,8 @@ export default {
   template: "<div></div>",
   async mounted() {
     await new Promise((resolve) => setTimeout(resolve, 0)); // wait for Tailwind classes to be applied
-    this.chart = echarts.init(this.$el, this.theme);
+
+    this.chart = echarts.init(this.$el, this.theme, this.initOptions);
     this.resizeObs = new ResizeObserver(this.chart.resize)
 
     // Prevent interruption of chart animations due to resize operations.
@@ -84,6 +85,11 @@ export default {
       }
     });
 
+    if (this.eventTasks) {
+      for (const [eventName, query] of Object.entries(this.eventTasks)) {
+        this.echarts_on(eventName, query);
+      }
+    }
   },
   beforeDestroy() {
     this.chart.dispose();
@@ -116,6 +122,8 @@ export default {
   props: {
     options: Object | undefined,
     theme: String | Object | undefined,
+    initOptions: Object | undefined,
     code: String | undefined,
+    eventTasks: Object | undefined,
   },
 };

ex4nicegui/reactive/EChartsComponent/ECharts.py

@@ -16,7 +16,6 @@ import nicegui
 from .types import (
     _T_event_name,
 )
-from ex4nicegui.reactive.deferredTask import DeferredTask
 from .utils import get_bound_event_args, create_event_handler_args
 
 NG_ROOT = Path(nicegui.__file__).parent / "elements"
@@ -28,9 +27,9 @@ class echarts(Element, component="ECharts.js", dependencies=libraries):  # type:
         self,
         options: Optional[dict] = None,
         code: Optional[str] = None,
+        init_options: Optional[dict] = None,
     ) -> None:
         super().__init__()
-        self.__deferred_task = DeferredTask()
 
         if (options is None) and (bool(code) is False):
             raise ValueError("At least one of options and code must be valid.")
@@ -45,6 +44,8 @@ class echarts(Element, component="ECharts.js", dependencies=libraries):  # type:
 
         self._props["options"] = options
         self._props["code"] = code
+        self._props["initOptions"] = init_options
+        self._props["eventTasks"] = {}
 
     def update_chart(
         self,
@@ -107,9 +108,7 @@ class echarts(Element, component="ECharts.js", dependencies=libraries):  # type:
         ui_event_name = f"chart:{event_name}"
         super().on(ui_event_name, org_handler, args=get_bound_event_args(event_name))
 
-        @self.__deferred_task.register
-        def _():
-            self.run_method("echarts_on", ui_event_name, query)
+        self._props["eventTasks"][ui_event_name] = query
 
     def run_chart_method(
         self, name: str, *args, timeout: float = 1

ex4nicegui/reactive/__init__.py

@@ -70,7 +70,7 @@ from .mermaid.mermaid import Mermaid as mermaid
 from .officials.dialog import DialogBindableUi as dialog
 from .vfor import vfor, VforStore
 from .vmodel import vmodel
-from .view_model import ViewModel, var, cached_var
+from .view_model import ViewModel, var, cached_var, list_var
 
 pagination = q_pagination
 
@@ -97,6 +97,7 @@ __all__ = [
     "ViewModel",
     "var",
     "cached_var",
+    "list_var",
     "html",
     "aggrid",
     "button",

ex4nicegui/reactive/base.py

@@ -48,6 +48,8 @@ _T_bind_classes_type = Union[
     _T_bind_classes_type_ref_dict,
     _T_bind_classes_type_single,
     _T_bind_classes_type_array,
+    Dict[str, TMaybeRef[bool]],
+    List[str],
 ]
 
 
@@ -150,6 +152,56 @@ class BindableUi(Generic[TWidget]):
         """
         return self.element.remove(element)
 
+    @overload
+    def bind_props(self, props: Dict[str, TMaybeRef[Any]]) -> Self: ...
+
+    @overload
+    def bind_props(self, props: TMaybeRef[str]) -> Self: ...
+
+    def bind_props(self, props: Union[Dict[str, TMaybeRef[Any]], TMaybeRef[str]]):
+        """data binding is manipulating an element's props
+
+        Args:
+            props (Union[Dict[str, TMaybeRef[Any]], TMaybeRef[str]]): dict of prop name and ref value
+
+        ## usage
+
+        .. code-block:: python
+            outlined = to_ref(True)
+            size = to_ref("xs")
+
+            def props_str():
+                return f'{"flat" if flat.value else ""} {"size=" + size.value}'
+
+            rxui.button("click me").bind_props(props_str)
+            rxui.button("click me").bind_props({
+                "outlined": outlined,
+                "size": size,
+            })
+
+        """
+        if isinstance(props, dict):
+
+            def props_str():
+                props_dict = (
+                    f"""{name if isinstance(raw_value,bool) else f"{name}='{raw_value}'"}"""
+                    for name, value in props.items()
+                    if (raw_value := to_value(value))
+                )
+
+                return " ".join(props_dict)
+
+            self._bind_props_for_str_fn(props_str)
+        else:
+            self._bind_props_for_str_fn(props)
+
+        return self
+
+    def _bind_props_for_str_fn(self, props_str: TMaybeRef[str]):
+        @self._ui_signal_on(props_str, onchanges=False, deep=False)
+        def _(state: WatchedState):
+            self.props(add=state.current, remove=state.previous)
+
     def bind_prop(self, prop: str, value: TGetterOrReadonlyRef[Any]):
         """data binding is manipulating an element's property
 
@@ -179,7 +231,7 @@ class BindableUi(Generic[TWidget]):
 
         return self
 
-    def bind_visible(self, value: TGetterOrReadonlyRef[bool]):
+    def bind_visible(self, value: TMaybeRef[bool]):
         @self._ui_effect
         def _():
             element = cast(ui.element, self.element)
@@ -187,7 +239,7 @@ class BindableUi(Generic[TWidget]):
 
         return self
 
-    def bind_not_visible(self, value: TGetterOrReadonlyRef[bool]):
+    def bind_not_visible(self, value: TMaybeRef[bool]):
         return self.bind_visible(lambda: not to_value(value))
 
     def on(
@@ -216,26 +268,28 @@ class BindableUi(Generic[TWidget]):
         cast(ui.element, self.element).clear()
 
     @overload
-    def bind_classes(self, classes: Dict[str, TGetterOrReadonlyRef[bool]]) -> Self:
-        ...
+    def bind_classes(self, classes: Dict[str, TGetterOrReadonlyRef[bool]]) -> Self: ...
+
+    @overload
+    def bind_classes(self, classes: Dict[str, TMaybeRef[bool]]) -> Self: ...
 
     @overload
-    def bind_classes(self, classes: TGetterOrReadonlyRef[Dict[str, bool]]) -> Self:
-        ...
+    def bind_classes(self, classes: TGetterOrReadonlyRef[Dict[str, bool]]) -> Self: ...
 
     @overload
-    def bind_classes(self, classes: List[TGetterOrReadonlyRef[str]]) -> Self:
-        ...
+    def bind_classes(self, classes: List[TGetterOrReadonlyRef[str]]) -> Self: ...
 
     @overload
-    def bind_classes(self, classes: TGetterOrReadonlyRef[str]) -> Self:
-        ...
+    def bind_classes(self, classes: List[str]) -> Self: ...
+
+    @overload
+    def bind_classes(self, classes: TGetterOrReadonlyRef[str]) -> Self: ...
 
     def bind_classes(self, classes: _T_bind_classes_type) -> Self:
         """data binding is manipulating an element's class list
 
-        @see - https://github.com/CrystalWindSnake/ex4nicegui/blob/main/README.en.md#bind-class-names
-        @中文文档 - https://gitee.com/carson_add/ex4nicegui/tree/main/#%E7%BB%91%E5%AE%9A%E7%B1%BB%E5%90%8D
+        @see - https://github.com/CrystalWindSnake/ex4nicegui/blob/main/README.en.md#bind_classes
+        @中文文档 - https://gitee.com/carson_add/ex4nicegui/tree/main/#bind_classes
 
         Args:
             classes (_T_bind_classes_type): dict of refs | ref to dict | str ref | list of refs
@@ -271,52 +325,51 @@ class BindableUi(Generic[TWidget]):
 
         """
         if isinstance(classes, dict):
-            for name, ref_obj in classes.items():
-
-                @self._ui_effect
-                def _(name=name, ref_obj=ref_obj):
-                    if to_value(ref_obj):
-                        self.classes(add=name)
-                    else:
-                        self.classes(remove=name)
+            self._bind_classes_for_str_fn(
+                lambda: " ".join(
+                    name for name, value in classes.items() if to_value(value)
+                )
+            )
 
+        elif isinstance(classes, list):
+            self._bind_classes_for_str_fn(
+                lambda: " ".join(to_value(c) for c in classes)
+            )
         elif is_ref(classes) or isinstance(classes, Callable):
             ref_obj = to_value(classes)  # type: ignore
 
             if isinstance(ref_obj, dict):
 
-                @self._ui_effect
-                def _():
-                    for name, value in cast(Dict, to_value(classes)).items():  # type: ignore
-                        if value:
-                            self.classes(add=name)
-                        else:
-                            self.classes(remove=name)
-            else:
-                self._bind_single_class(cast(_T_bind_classes_type_single, classes))
+                def classes_str():
+                    return " ".join(
+                        name
+                        for name, value in to_value(classes).items()  # type: ignore
+                        if to_value(value)
+                    )
 
-        elif isinstance(classes, list):
-            for ref_name in classes:
-                self._bind_single_class(ref_name)
+                self._bind_classes_for_str_fn(classes_str)
+
+            else:
+                self._bind_classes_for_str_fn(classes)  # type: ignore
 
         return self
 
-    def _bind_single_class(self, class_name: _T_bind_classes_type_single):
-        if is_ref(class_name) or isinstance(class_name, Callable):
+    def _bind_classes_for_str_fn(self, classes_str: TGetterOrReadonlyRef[str]):
+        @self._ui_signal_on(classes_str, onchanges=False, deep=False)
+        def _(state: WatchedState):
+            self.classes(add=state.current, remove=state.previous)
 
-            @on(class_name)
-            def _(state: WatchedState):
-                self.classes(add=state.current, remove=state.previous)
-        else:
-            self.classes(class_name)  # type: ignore
+    @overload
+    def bind_style(self, style: TMaybeRef[str]) -> Self: ...
 
-        return self
+    @overload
+    def bind_style(self, style: Dict[str, TMaybeRef[Any]]) -> Self: ...
 
-    def bind_style(self, style: Dict[str, TGetterOrReadonlyRef[Any]]):
+    def bind_style(self, style: Union[TMaybeRef[str], Dict[str, TMaybeRef[Any]]]):
         """data binding is manipulating an element's style
 
-        @see - https://github.com/CrystalWindSnake/ex4nicegui/blob/main/README.en.md#bind-style
-        @中文文档 - https://gitee.com/carson_add/ex4nicegui/tree/main/#bind-style
+        @see - https://github.com/CrystalWindSnake/ex4nicegui/blob/main/README.en.md#bind_style
+        @中文文档 - https://gitee.com/carson_add/ex4nicegui/tree/main/#bind_style
 
         Args:
             style (Dict[str, Union[ReadonlyRef[str], Ref[str]]]): dict of style name and ref value
@@ -337,16 +390,21 @@ class BindableUi(Generic[TWidget]):
 
         """
         if isinstance(style, dict):
-            for name, ref_obj in style.items():
-                if is_ref(ref_obj) or isinstance(ref_obj, Callable):
-
-                    @self._ui_effect
-                    def _(name=name, ref_obj=ref_obj):
-                        self.element._style[name] = str(to_value(ref_obj))
-                        self.element.update()
+            self._bind_style_for_str_fn(
+                lambda: ";".join(
+                    f"{name}:{to_value(value)}" for name, value in style.items()
+                )
+            )
+        else:
+            self._bind_style_for_str_fn(style)
 
         return self
 
+    def _bind_style_for_str_fn(self, style_str: TMaybeRef[str]):
+        @self._ui_signal_on(style_str, onchanges=False, deep=False)
+        def _(state: WatchedState):
+            self.style(add=state.current, remove=state.previous)
+
     def scoped_style(self, selector: str, style: Union[str, Path]):
         """add scoped style to the element
 

ex4nicegui/reactive/mixins/backgroundColor.py

@@ -5,10 +5,7 @@ from typing import (
 )
 
 import signe
-from ex4nicegui.utils.signals import (
-    TGetterOrReadonlyRef,
-    WatchedState,
-)
+from ex4nicegui.utils.signals import WatchedState, TMaybeRef
 from nicegui import ui
 from ex4nicegui.reactive.systems import color_system
 
@@ -17,10 +14,9 @@ class BackgroundColorableMixin(Protocol):
     _ui_signal_on: Callable[[Callable[..., Any]], signe.Effect[None]]
 
     @property
-    def element(self) -> ui.element:
-        ...
+    def element(self) -> ui.element: ...
 
-    def _bind_background_color(self, value: TGetterOrReadonlyRef[str]):
+    def _bind_background_color(self, value: TMaybeRef[str]):
         @self._ui_signal_on(value, onchanges=False)  # type: ignore
         def _(state: WatchedState):
             if state.previous is not None:
@@ -30,7 +26,7 @@ class BackgroundColorableMixin(Protocol):
 
             self.element.update()
 
-    def bind_color(self, color: TGetterOrReadonlyRef[str]):
+    def bind_color(self, color: TMaybeRef[str]):
         """bind color to the element
 
         Args:

ex4nicegui/reactive/mixins/disableable.py

@@ -8,10 +8,7 @@ from typing import (
 )
 
 import signe
-from ex4nicegui.utils.signals import (
-    TGetterOrReadonlyRef,
-    to_value,
-)
+from ex4nicegui.utils.signals import to_value, TMaybeRef
 from nicegui.elements.mixins.disableable_element import DisableableElement
 
 
@@ -22,10 +19,9 @@ class DisableableMixin(Protocol):
     _ui_effect: Callable[[Callable[..., Any]], signe.Effect[None]]
 
     @property
-    def element(self) -> DisableableElement:
-        ...
+    def element(self) -> DisableableElement: ...
 
-    def bind_enabled(self, value: TGetterOrReadonlyRef[bool]):
+    def bind_enabled(self, value: TMaybeRef[bool]):
         @self._ui_effect
         def _():
             raw_value = to_value(value)
@@ -34,7 +30,7 @@ class DisableableMixin(Protocol):
 
         return self
 
-    def bind_disable(self, value: TGetterOrReadonlyRef[bool]):
+    def bind_disable(self, value: TMaybeRef[bool]):
         @self._ui_effect
         def _():
             raw_value = not to_value(value)

ex4nicegui/reactive/mixins/textColor.py

@@ -9,6 +9,7 @@ import signe
 from ex4nicegui.utils.signals import (
     TGetterOrReadonlyRef,
     WatchedState,
+    TMaybeRef,
 )
 from nicegui import ui
 from ex4nicegui.reactive.systems import color_system
@@ -18,10 +19,9 @@ class TextColorableMixin(Protocol):
     _ui_signal_on: Callable[[Callable[[TGetterOrReadonlyRef[str]], Any]], signe.Effect]
 
     @property
-    def element(self) -> ui.element:
-        ...
+    def element(self) -> ui.element: ...
 
-    def _bind_text_color(self, color: TGetterOrReadonlyRef[str]):
+    def _bind_text_color(self, color: TMaybeRef[str]):
         @self._ui_signal_on(color, onchanges=False)  # type: ignore
         def _(state: WatchedState):
             if state.previous is not None:
@@ -31,7 +31,7 @@ class TextColorableMixin(Protocol):
 
             self.element.update()
 
-    def bind_color(self, color: TGetterOrReadonlyRef[str]):
+    def bind_color(self, color: TMaybeRef[str]):
         """bind text color to the element
 
         Args:
@@ -46,16 +46,14 @@ class HtmlTextColorableMixin(Protocol):
     _ui_signal_on: Callable[[Callable[[TGetterOrReadonlyRef[str]], Any]], signe.Effect]
 
     @property
-    def element(self) -> ui.element:
-        ...
+    def element(self) -> ui.element: ...
 
-    def bind_style(self, style: Dict[str, TGetterOrReadonlyRef[Any]]):
-        ...
+    def bind_style(self, style: Dict[str, TMaybeRef[Any]]): ...
 
-    def _bind_text_color(self, value: TGetterOrReadonlyRef[str]):
+    def _bind_text_color(self, value: TMaybeRef[str]):
         return self.bind_style({"color": value})
 
-    def bind_color(self, color: TGetterOrReadonlyRef[str]):
+    def bind_color(self, color: TMaybeRef[str]):
         """bind text color to the element
 
         Args:

ex4nicegui/reactive/officials/checkbox.py

@@ -35,7 +35,6 @@ class CheckboxBindableUi(
         )
 
         value_kws = pc.get_values_kws()
-
         element = ui.checkbox(**value_kws)
         super().__init__(element)  # type: ignore
 

ex4nicegui/reactive/officials/echarts.py

@@ -27,9 +27,23 @@ class EChartsBindableUi(BindableUi[echarts]):
         options: Optional[TMaybeRef[Dict]] = None,
         not_merge: TMaybeRef[Union[bool, None]] = None,
         code: Optional[str] = None,
+        init_options: Optional[Dict] = None,
     ) -> None:
+        """Create a new ECharts instance.
+
+        @see - https://github.com/CrystalWindSnake/ex4nicegui/blob/main/README.en.md#rxuiecharts
+        @中文文档 - https://gitee.com/carson_add/ex4nicegui#rxuiecharts
+
+        Args:
+            options (Optional[TMaybeRef[Dict]], optional): echart options. Defaults to None.
+            not_merge (TMaybeRef[Union[bool, None]], optional): merge options when chart update. Defaults to None.
+            code (Optional[str], optional): javascript code to initialize echart. Defaults to None.
+            init_options (Optional[Dict], optional): echart initialization options. Defaults to None.
+        """
         pc = ParameterClassifier(
-            locals(), maybeRefs=["options", "code"], exclude=["not_merge"]
+            locals(),
+            maybeRefs=["options", "code", "init_options"],
+            exclude=["not_merge"],
         )
 
         value_kws = pc.get_values_kws()

ex4nicegui/reactive/officials/input.py

@@ -90,7 +90,7 @@ class LazyInputBindableUi(InputBindableUi):
         password_toggle_button: TMaybeRef[bool] = False,
         on_change: Optional[Callable[..., Any]] = None,
         autocomplete: Optional[TMaybeRef[List[str]]] = None,
-        validation: Dict[str, Callable[..., bool]] = {},
+        validation: Optional[Dict[str, Callable[..., bool]]] = None,
     ) -> None:
         org_value = value
         is_setter_value = is_setter_ref(value)

ex4nicegui/reactive/officials/textarea.py

@@ -27,7 +27,7 @@ class TextareaBindableUi(BindableUi[ui.textarea], ValueElementMixin[str]):
         placeholder: Optional[TMaybeRef[str]] = None,
         value: TMaybeRef[str] = "",
         on_change: Optional[Callable[..., Any]] = None,
-        validation: Dict[str, Callable[..., bool]] = {},
+        validation: Optional[Dict[str, Callable[..., bool]]] = None,
     ) -> None:
         pc = ParameterClassifier(
             locals(),
@@ -68,7 +68,7 @@ class LazyTextareaBindableUi(TextareaBindableUi):
         placeholder: Optional[TMaybeRef[str]] = None,
         value: TMaybeRef[str] = "",
         on_change: Optional[Callable[..., Any]] = None,
-        validation: Dict[str, Callable[..., bool]] = {},
+        validation: Optional[Dict[str, Callable[..., bool]]] = None,
     ) -> None:
         org_value = value
         is_setter_value = is_setter_ref(value)

ex4nicegui/reactive/services/reactive_service.py

@@ -15,6 +15,7 @@ from ex4nicegui.reactive.systems.reactive_system import (
     convert_kws_ref2value,
     inject_method,
 )
+from ex4nicegui.utils.proxy import is_base_type_proxy
 
 
 class ParameterClassifier:
@@ -34,7 +35,7 @@ class ParameterClassifier:
             exclude.append(extend_kws)
 
         self._args: Dict[str, Any] = {
-            k: v
+            k: v._ref if is_base_type_proxy(v) else v
             for k, v in args.items()
             if k != "self" and k[0] != "_" and (k not in exclude)
         }

ex4nicegui/reactive/vfor.py

@@ -28,6 +28,8 @@ from dataclasses import dataclass
 from signe.core.scope import Scope
 from ex4nicegui.reactive.systems.object_system import get_attribute
 from ex4nicegui.reactive.empty import Empty
+from ex4nicegui.utils.proxy import to_ref_if_base_type_proxy
+
 
 _T = TypeVar("_T")
 _T_data = Union[List[Any], TGetterOrReadonlyRef[List[Any]], RefWrapper]
@@ -178,6 +180,8 @@ class vfor(Generic[_T]):
         *,
         key: Optional[Union[str, Callable[[int, Any], Any]]] = None,
     ) -> None:
+        data = to_ref_if_base_type_proxy(data)
+
         self._data = to_ref_wrapper(lambda: data) if is_reactive(data) else data
         self._get_key = vfor.index_key
         self._transition_props = {}