Use old serializer system in LiteralVar

integration/test_dynamic_routes.py

@@ -23,7 +23,6 @@ def DynamicRoute():
 
     class DynamicState(rx.State):
         order: List[str] = []
-        page_id: str = ""
 
         def on_load(self):
             self.order.append(f"{self.router.page.path}-{self.page_id or 'no page id'}")
@@ -47,7 +46,7 @@ def index():
                 is_read_only=True,
                 id="token",
             ),
-            rc.input(value=DynamicState.page_id, is_read_only=True, id="page_id"),
+            rc.input(value=rx.State.page_id, is_read_only=True, id="page_id"),  # type: ignore
             rc.input(
                 value=DynamicState.router.page.raw_path,
                 is_read_only=True,
@@ -74,9 +73,9 @@ def redirect_page():
         return rx.fragment(rx.text("redirecting..."))
 
     app = rx.App(state=rx.State)
-    app.add_page(index)
     app.add_page(index, route="/page/[page_id]", on_load=DynamicState.on_load)  # type: ignore
     app.add_page(index, route="/static/x", on_load=DynamicState.on_load)  # type: ignore
+    app.add_page(index)
     app.add_custom_404_page(on_load=DynamicState.on_load)  # type: ignore
 
 

integration/test_tailwind.py

@@ -109,7 +109,7 @@ def test_tailwind_app(tailwind_app: AppHarness, tailwind_disabled: bool):
     assert len(paragraphs) == 3
     for p in paragraphs:
         assert tailwind_app.poll_for_content(p, exp_not_equal="") == PARAGRAPH_TEXT
-        assert p.value_of_css_property("font-family") == '"monospace"'
+        assert p.value_of_css_property("font-family") == "monospace"
         if tailwind_disabled:
             # expect default color, not "text-red-500" from tailwind utility class
             assert p.value_of_css_property("color") not in TEXT_RED_500_COLOR

reflex/.templates/jinja/web/pages/utils.js.jinja2

@@ -85,10 +85,10 @@
 {% macro render_match_tag(component) %}
 {
     (() => {
-        switch (JSON.stringify({{ component.cond._var_name_unwrapped }})) {
+        switch (JSON.stringify({{ component.cond._var_name }})) {
         {% for case in component.match_cases %}
             {% for condition in case[:-1] %}
-                case JSON.stringify({{ condition._var_name_unwrapped }}):
+                case JSON.stringify({{ condition._var_name }}):
             {% endfor %}
                 return {{ case[-1] }};
                 break;

reflex/.templates/jinja/web/utils/theme.js.jinja2

@@ -1 +1 @@
-export default {{ theme|json_dumps }}
+export default {{ theme }}

reflex/compiler/compiler.py

@@ -17,13 +17,12 @@
     StatefulComponent,
 )
 from reflex.config import get_config
-from reflex.ivars.base import LiteralVar
+from reflex.ivars.base import ImmutableVar, LiteralVar
 from reflex.state import BaseState
 from reflex.style import SYSTEM_COLOR_MODE
 from reflex.utils.exec import is_prod_mode
 from reflex.utils.imports import ImportVar
 from reflex.utils.prerequisites import get_web_dir
-from reflex.vars import Var
 
 
 def _compile_document_root(root: Component) -> str:
@@ -58,7 +57,7 @@ def _compile_app(app_root: Component) -> str:
     )
 
 
-def _compile_theme(theme: dict) -> str:
+def _compile_theme(theme: str) -> str:
     """Compile the theme.
 
     Args:
@@ -321,7 +320,7 @@ def _compile_tailwind(
 def compile_document_root(
     head_components: list[Component],
     html_lang: Optional[str] = None,
-    html_custom_attrs: Optional[Dict[str, Union[Var, str]]] = None,
+    html_custom_attrs: Optional[Dict[str, Union[ImmutableVar, str]]] = None,
 ) -> tuple[str, str]:
     """Compile the document root.
 
@@ -378,7 +377,7 @@ def compile_theme(style: ComponentStyle) -> tuple[str, str]:
     theme = utils.create_theme(style)
 
     # Compile the theme.
-    code = _compile_theme(theme)
+    code = _compile_theme(str(LiteralVar.create(theme)))
     return output_path, code
 
 

reflex/compiler/utils.py

@@ -7,6 +7,7 @@
 from typing import Any, Callable, Dict, Optional, Type, Union
 from urllib.parse import urlparse
 
+from reflex.ivars.base import ImmutableVar
 from reflex.utils.prerequisites import get_web_dir
 
 try:
@@ -32,7 +33,6 @@
 from reflex.style import Style
 from reflex.utils import console, format, imports, path_ops
 from reflex.utils.imports import ImportVar, ParsedImportDict
-from reflex.vars import Var
 
 # To re-export this function.
 merge_imports = imports.merge_imports
@@ -286,7 +286,7 @@ def compile_custom_component(
 def create_document_root(
     head_components: list[Component] | None = None,
     html_lang: Optional[str] = None,
-    html_custom_attrs: Optional[Dict[str, Union[Var, str]]] = None,
+    html_custom_attrs: Optional[Dict[str, Union[ImmutableVar, str]]] = None,
 ) -> Component:
     """Create the document root.
 

reflex/components/base/app_wrap.pyi

@@ -7,8 +7,8 @@ from typing import Any, Callable, Dict, Optional, Union, overload
 
 from reflex.components.base.fragment import Fragment
 from reflex.event import EventHandler, EventSpec
+from reflex.ivars.base import ImmutableVar
 from reflex.style import Style
-from reflex.vars import Var
 
 class AppWrap(Fragment):
     @overload
@@ -21,41 +21,51 @@ class AppWrap(Fragment):
         id: Optional[Any] = None,
         class_name: Optional[Any] = None,
         autofocus: Optional[bool] = None,
-        custom_attrs: Optional[Dict[str, Union[Var, str]]] = None,
-        on_blur: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
-        on_click: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
+        custom_attrs: Optional[Dict[str, Union[ImmutableVar, str]]] = None,
+        on_blur: Optional[
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
+        ] = None,
+        on_click: Optional[
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
+        ] = None,
         on_context_menu: Optional[
-            Union[EventHandler, EventSpec, list, Callable, Var]
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
         ] = None,
         on_double_click: Optional[
-            Union[EventHandler, EventSpec, list, Callable, Var]
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
+        ] = None,
+        on_focus: Optional[
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
+        ] = None,
+        on_mount: Optional[
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
         ] = None,
-        on_focus: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
-        on_mount: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
         on_mouse_down: Optional[
-            Union[EventHandler, EventSpec, list, Callable, Var]
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
         ] = None,
         on_mouse_enter: Optional[
-            Union[EventHandler, EventSpec, list, Callable, Var]
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
         ] = None,
         on_mouse_leave: Optional[
-            Union[EventHandler, EventSpec, list, Callable, Var]
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
         ] = None,
         on_mouse_move: Optional[
-            Union[EventHandler, EventSpec, list, Callable, Var]
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
         ] = None,
         on_mouse_out: Optional[
-            Union[EventHandler, EventSpec, list, Callable, Var]
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
         ] = None,
         on_mouse_over: Optional[
-            Union[EventHandler, EventSpec, list, Callable, Var]
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
         ] = None,
         on_mouse_up: Optional[
-            Union[EventHandler, EventSpec, list, Callable, Var]
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
+        ] = None,
+        on_scroll: Optional[
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
         ] = None,
-        on_scroll: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
         on_unmount: Optional[
-            Union[EventHandler, EventSpec, list, Callable, Var]
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
         ] = None,
         **props,
     ) -> "AppWrap":

reflex/components/base/bare.py

@@ -28,8 +28,6 @@ def create(cls, contents: Any) -> Component:
         """
         if isinstance(contents, ImmutableVar):
             return cls(contents=contents)
-        if isinstance(contents, Var):
-            contents = contents.to(str)
         else:
             contents = str(contents) if contents is not None else ""
         return cls(contents=contents)  # type: ignore
@@ -39,7 +37,7 @@ def _render(self) -> Tag:
             return Tagless(contents=f"{{{str(self.contents)}}}")
         return Tagless(contents=str(self.contents))
 
-    def _get_vars(self, include_children: bool = False) -> Iterator[Var]:
+    def _get_vars(self, include_children: bool = False) -> Iterator[ImmutableVar]:
         """Walk all Vars used in this component.
 
         Args:

reflex/components/base/body.pyi

@@ -7,8 +7,8 @@ from typing import Any, Callable, Dict, Optional, Union, overload
 
 from reflex.components.component import Component
 from reflex.event import EventHandler, EventSpec
+from reflex.ivars.base import ImmutableVar
 from reflex.style import Style
-from reflex.vars import Var
 
 class Body(Component):
     @overload
@@ -21,41 +21,51 @@ class Body(Component):
         id: Optional[Any] = None,
         class_name: Optional[Any] = None,
         autofocus: Optional[bool] = None,
-        custom_attrs: Optional[Dict[str, Union[Var, str]]] = None,
-        on_blur: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
-        on_click: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
+        custom_attrs: Optional[Dict[str, Union[ImmutableVar, str]]] = None,
+        on_blur: Optional[
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
+        ] = None,
+        on_click: Optional[
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
+        ] = None,
         on_context_menu: Optional[
-            Union[EventHandler, EventSpec, list, Callable, Var]
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
         ] = None,
         on_double_click: Optional[
-            Union[EventHandler, EventSpec, list, Callable, Var]
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
+        ] = None,
+        on_focus: Optional[
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
+        ] = None,
+        on_mount: Optional[
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
         ] = None,
-        on_focus: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
-        on_mount: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
         on_mouse_down: Optional[
-            Union[EventHandler, EventSpec, list, Callable, Var]
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
         ] = None,
         on_mouse_enter: Optional[
-            Union[EventHandler, EventSpec, list, Callable, Var]
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
         ] = None,
         on_mouse_leave: Optional[
-            Union[EventHandler, EventSpec, list, Callable, Var]
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
         ] = None,
         on_mouse_move: Optional[
-            Union[EventHandler, EventSpec, list, Callable, Var]
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
         ] = None,
         on_mouse_out: Optional[
-            Union[EventHandler, EventSpec, list, Callable, Var]
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
         ] = None,
         on_mouse_over: Optional[
-            Union[EventHandler, EventSpec, list, Callable, Var]
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
         ] = None,
         on_mouse_up: Optional[
-            Union[EventHandler, EventSpec, list, Callable, Var]
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
+        ] = None,
+        on_scroll: Optional[
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
         ] = None,
-        on_scroll: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
         on_unmount: Optional[
-            Union[EventHandler, EventSpec, list, Callable, Var]
+            Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
         ] = None,
         **props,
     ) -> "Body":