reflex 0.6.0__py3-none-any.whl → 0.6.0a1__py3-none-any.whl

reflex/experimental/client_state.py

@@ -3,19 +3,18 @@
 from __future__ import annotations
 
 import dataclasses
-import re
 import sys
 from typing import Any, Callable, Union
 
 from reflex import constants
 from reflex.event import EventChain, EventHandler, EventSpec, call_script
+from reflex.ivars.base import ImmutableVar, LiteralVar
+from reflex.ivars.function import FunctionVar
 from reflex.utils.imports import ImportVar
 from reflex.vars import (
     VarData,
     get_unique_variable_name,
 )
-from reflex.vars.base import LiteralVar, Var
-from reflex.vars.function import FunctionVar
 
 NoValue = object()
 
@@ -42,7 +41,7 @@ def _client_state_ref(var_name: str) -> str:
     frozen=True,
     **{"slots": True} if sys.version_info >= (3, 10) else {},
 )
-class ClientStateVar(Var):
+class ClientStateVar(ImmutableVar):
     """A Var that exists on the client via useState."""
 
     # Track the names of the getters and setters
@@ -59,7 +58,7 @@ class ClientStateVar(Var):
             The hash of the var.
         """
         return hash(
-            (self._js_expr, str(self._var_type), self._getter_name, self._setter_name)
+            (self._var_name, str(self._var_type), self._getter_name, self._setter_name)
         )
 
     @classmethod
@@ -98,8 +97,10 @@ class ClientStateVar(Var):
             var_name = get_unique_variable_name()
         assert isinstance(var_name, str), "var_name must be a string."
         if default is NoValue:
-            default_var = Var(_js_expr="")
-        elif not isinstance(default, Var):
+            default_var = ImmutableVar.create_safe(
+                "", _var_is_local=False, _var_is_string=False
+            )
+        elif not isinstance(default, ImmutableVar):
             default_var = LiteralVar.create(default)
         else:
             default_var = default
@@ -115,7 +116,7 @@ class ClientStateVar(Var):
             hooks[f"{_client_state_ref(setter_name)} = {setter_name}"] = None
             imports.update(_refs_import)
         return cls(
-            _js_expr="",
+            _var_name="",
             _setter_name=setter_name,
             _getter_name=var_name,
             _global_ref=global_ref,
@@ -130,7 +131,7 @@ class ClientStateVar(Var):
         )
 
     @property
-    def value(self) -> Var:
+    def value(self) -> ImmutableVar:
         """Get a placeholder for the Var.
 
         This property can only be rendered on the frontend.
@@ -141,12 +142,10 @@ class ClientStateVar(Var):
             an accessor for the client state variable.
         """
         return (
-            Var(
-                _js_expr=(
-                    _client_state_ref(self._getter_name)
-                    if self._global_ref
-                    else self._getter_name
-                )
+            ImmutableVar.create_safe(
+                _client_state_ref(self._getter_name)
+                if self._global_ref
+                else self._getter_name
             )
             .to(self._var_type)
             ._replace(
@@ -156,7 +155,7 @@ class ClientStateVar(Var):
             )
         )
 
-    def set_value(self, value: Any = NoValue) -> Var:
+    def set_value(self, value: Any = NoValue) -> ImmutableVar:
         """Set the value of the client state variable.
 
         This property can only be attached to a frontend event trigger.
@@ -175,22 +174,22 @@ class ClientStateVar(Var):
             else self._setter_name
         )
         if value is not NoValue:
+            import re
+
             # This is a hack to make it work like an EventSpec taking an arg
             value_str = str(LiteralVar.create(value))
 
-            if value_str.startswith("_"):
-                # remove patterns of ["*"] from the value_str using regex
-                arg = re.sub(r"\[\".*\"\]", "", value_str)
-                setter = f"(({arg}) => {setter}({value_str}))"
-            else:
-                setter = f"(() => {setter}({value_str}))"
-        return Var(
-            _js_expr=setter,
+            # remove patterns of ["*"] from the value_str using regex
+            arg = re.sub(r"\[\".*\"\]", "", value_str)
+
+            setter = f"({arg}) => {setter}({str(value)})"
+        return ImmutableVar(
+            _var_name=setter,
             _var_data=VarData(imports=_refs_import if self._global_ref else {}),
         ).to(FunctionVar, EventChain)
 
     @property
-    def set(self) -> Var:
+    def set(self) -> ImmutableVar:
         """Set the value of the client state variable.
 
         This property can only be attached to a frontend event trigger.

reflex/experimental/hooks.py

@@ -2,16 +2,16 @@
 
 from __future__ import annotations
 
+from reflex.ivars.base import ImmutableVar
 from reflex.utils.imports import ImportVar
 from reflex.vars import VarData
-from reflex.vars.base import Var
 
 
 def _compose_react_imports(tags: list[str]) -> dict[str, list[ImportVar]]:
     return {"react": [ImportVar(tag=tag) for tag in tags]}
 
 
-def const(name, value) -> Var:
+def const(name, value) -> ImmutableVar:
     """Create a constant Var.
 
     Args:
@@ -22,11 +22,11 @@ def const(name, value) -> Var:
         The constant Var.
     """
     if isinstance(name, list):
-        return Var(_js_expr=f"const [{', '.join(name)}] = {value}")
-    return Var(_js_expr=f"const {name} = {value}")
+        return ImmutableVar.create_safe(f"const [{', '.join(name)}] = {value}")
+    return ImmutableVar.create_safe(f"const {name} = {value}")
 
 
-def useCallback(func, deps) -> Var:
+def useCallback(func, deps) -> ImmutableVar:
     """Create a useCallback hook with a function and dependencies.
 
     Args:
@@ -36,13 +36,13 @@ def useCallback(func, deps) -> Var:
     Returns:
         The useCallback hook.
     """
-    return Var(
-        _js_expr=f"useCallback({func}, {deps})" if deps else f"useCallback({func})",
+    return ImmutableVar.create_safe(
+        f"useCallback({func}, {deps})" if deps else f"useCallback({func})",
         _var_data=VarData(imports=_compose_react_imports(["useCallback"])),
     )
 
 
-def useContext(context) -> Var:
+def useContext(context) -> ImmutableVar:
     """Create a useContext hook with a context.
 
     Args:
@@ -51,13 +51,13 @@ def useContext(context) -> Var:
     Returns:
         The useContext hook.
     """
-    return Var(
-        _js_expr=f"useContext({context})",
+    return ImmutableVar.create_safe(
+        f"useContext({context})",
         _var_data=VarData(imports=_compose_react_imports(["useContext"])),
     )
 
 
-def useRef(default) -> Var:
+def useRef(default) -> ImmutableVar:
     """Create a useRef hook with a default value.
 
     Args:
@@ -66,13 +66,13 @@ def useRef(default) -> Var:
     Returns:
         The useRef hook.
     """
-    return Var(
-        _js_expr=f"useRef({default})",
+    return ImmutableVar.create_safe(
+        f"useRef({default})",
         _var_data=VarData(imports=_compose_react_imports(["useRef"])),
     )
 
 
-def useState(var_name, default=None) -> Var:
+def useState(var_name, default=None) -> ImmutableVar:
     """Create a useState hook with a variable name and setter name.
 
     Args:
@@ -84,8 +84,8 @@ def useState(var_name, default=None) -> Var:
     """
     return const(
         [var_name, f"set{var_name.capitalize()}"],
-        Var(
-            _js_expr=f"useState({default})",
+        ImmutableVar.create_safe(
+            f"useState({default})",
             _var_data=VarData(imports=_compose_react_imports(["useState"])),
         ),
     )

reflex/experimental/layout.py

@@ -14,9 +14,9 @@ from reflex.components.radix.themes.layout.container import Container
 from reflex.components.radix.themes.layout.stack import HStack
 from reflex.event import call_script
 from reflex.experimental import hooks
+from reflex.ivars.base import ImmutableVar
 from reflex.state import ComponentState
 from reflex.style import Style
-from reflex.vars.base import Var
 
 
 class Sidebar(Box, MemoizationLeaf):
@@ -55,7 +55,7 @@ class Sidebar(Box, MemoizationLeaf):
         open = (
             self.State.open  # type: ignore
             if self.State
-            else Var(_js_expr="open")
+            else ImmutableVar.create_safe("open")
         )
         sidebar.style["display"] = spacer.style["display"] = cond(open, "block", "none")
 
@@ -69,7 +69,7 @@ class Sidebar(Box, MemoizationLeaf):
             }
         )
 
-    def add_hooks(self) -> List[Var]:
+    def add_hooks(self) -> List[ImmutableVar]:
         """Get the hooks to render.
 
         Returns:
@@ -172,8 +172,8 @@ class SidebarTrigger(Fragment):
             open, toggle = sidebar.State.open, sidebar.State.toggle  # type: ignore
         else:
             open, toggle = (
-                Var(_js_expr="open"),
-                call_script(Var(_js_expr="setOpen(!open)")),
+                ImmutableVar.create_safe("open"),
+                call_script(ImmutableVar.create_safe("setOpen(!open)")),
             )
 
         trigger_props["left"] = cond(open, f"calc({sidebar_width} - 32px)", "0")