reflex 0.8.2a1__tar.gz → 0.8.3a2__tar.gz

{reflex-0.8.2a1 → reflex-0.8.3a2}/PKG-INFO

@@ -1,6 +1,6 @@
 Metadata-Version: 2.4
 Name: reflex
-Version: 0.8.2a1
+Version: 0.8.3a2
 Summary: Web apps in pure Python.
 Project-URL: homepage, https://reflex.dev
 Project-URL: repository, https://github.com/reflex-dev/reflex

{reflex-0.8.2a1 → reflex-0.8.3a2}/pyproject.toml

@@ -1,6 +1,6 @@
 [project]
 name = "reflex"
-version = "0.8.2a1"
+version = "0.8.3a2"
 description = "Web apps in pure Python."
 license.text = "Apache-2.0"
 authors = [
@@ -229,7 +229,7 @@ fail_fast = true
 
 [[tool.pre-commit.repos]]
 repo = "https://github.com/astral-sh/ruff-pre-commit"
-rev = "v0.12.2"
+rev = "v0.12.3"
 hooks = [
   { id = "ruff-format", args = [
     "reflex",
@@ -261,7 +261,7 @@ hooks = [
 
 [[tool.pre-commit.repos]]
 repo = "https://github.com/RobertCraigie/pyright-python"
-rev = "v1.1.402"
+rev = "v1.1.403"
 hooks = [{ id = "pyright", args = ["reflex", "tests"], language = "system" }]
 
 [[tool.pre-commit.repos]]
@@ -273,3 +273,6 @@ hooks = [{ id = "darglint", exclude = "^reflex/reflex.py" }]
 repo = "https://github.com/pre-commit/mirrors-prettier"
 rev = "f62a70a3a7114896b062de517d72829ea1c884b6"
 hooks = [{ id = "prettier", require_serial = true }]
+
+[tool.uv]
+required-version = ">=0.7.0"

{reflex-0.8.2a1 → reflex-0.8.3a2}/reflex/.templates/web/utils/state.js

@@ -993,7 +993,7 @@ export const useEventLoop = (
     window.onerror = function (msg, url, lineNo, columnNo, error) {
       addEvents([
         Event(`${exception_state_name}.handle_frontend_exception`, {
-          stack: error.stack,
+          info: error.name + ": " + error.message + "\n" + error.stack,
           component_stack: "",
         }),
       ]);
@@ -1005,7 +1005,12 @@ export const useEventLoop = (
     window.onunhandledrejection = function (event) {
       addEvents([
         Event(`${exception_state_name}.handle_frontend_exception`, {
-          stack: event.reason?.stack,
+          info:
+            event.reason?.name +
+            ": " +
+            event.reason?.message +
+            "\n" +
+            event.reason?.stack,
           component_stack: "",
         }),
       ]);

{reflex-0.8.2a1 → reflex-0.8.3a2}/reflex/__init__.py

@@ -249,6 +249,7 @@ COMPONENTS_CORE_MAPPING: dict = {
         "upload",
     ],
     "components.core.auto_scroll": ["auto_scroll"],
+    "components.core.window_events": ["window_event_listener"],
 }
 
 COMPONENTS_BASE_MAPPING: dict = {

{reflex-0.8.2a1 → reflex-0.8.3a2}/reflex/__init__.pyi

@@ -52,6 +52,7 @@ from .components.core.upload import (
     selected_files,
     upload,
 )
+from .components.core.window_events import window_event_listener
 from .components.datadisplay.code import code_block
 from .components.datadisplay.dataeditor import data_editor, data_editor_theme
 from .components.datadisplay.logo import logo
@@ -348,4 +349,5 @@ __all__ = [
     "video",
     "vstack",
     "window_alert",
+    "window_event_listener",
 ]

{reflex-0.8.2a1 → reflex-0.8.3a2}/reflex/app.py

@@ -400,6 +400,9 @@ class App(MiddlewareMixin, LifespanMixin):
     # The state class to use for the app.
     _state: type[BaseState] | None = None
 
+    # Whether to enable state for the app. If False, the app will not use state.
+    enable_state: bool = True
+
     # Class to manage many client states.
     _state_manager: StateManager | None = None
 
@@ -480,7 +483,8 @@ class App(MiddlewareMixin, LifespanMixin):
             if issubclass(clz, AppMixin):
                 clz._init_mixin(self)
 
-        self._setup_state()
+        if self.enable_state:
+            self._enable_state()
 
         # Set up the admin dash.
         self._setup_admin_dash()
@@ -495,7 +499,7 @@ class App(MiddlewareMixin, LifespanMixin):
         """Enable state for the app."""
         if not self._state:
             self._state = State
-            self._setup_state()
+        self._setup_state()
 
     def _setup_state(self) -> None:
         """Set up the state for the app.
@@ -847,14 +851,10 @@ class App(MiddlewareMixin, LifespanMixin):
             save_page: If True, the compiled page is saved to self._pages.
         """
         n_states_before = len(all_base_state_classes)
-        component, enable_state = compiler.compile_unevaluated_page(
-            route, self._unevaluated_pages[route], self._state, self.style, self.theme
+        component = compiler.compile_unevaluated_page(
+            route, self._unevaluated_pages[route], self.style, self.theme
         )
 
-        # Indicate that the app should use state.
-        if enable_state:
-            self._enable_state()
-
         # Indicate that evaluating this page creates one or more state classes.
         if len(all_base_state_classes) > n_states_before:
             self._stateful_pages[route] = None
@@ -1146,7 +1146,6 @@ class App(MiddlewareMixin, LifespanMixin):
                 for route in stateful_pages:
                     console.debug(f"BE Evaluating stateful page: {route}")
                     self._compile_page(route, save_page=False)
-                self._enable_state()
             self._add_optional_endpoints()
             return
 
@@ -1345,8 +1344,6 @@ class App(MiddlewareMixin, LifespanMixin):
         for route, component in zip(self._pages, page_components, strict=True):
             ExecutorSafeFunctions.COMPONENTS[route] = component
 
-        ExecutorSafeFunctions.STATE = self._state
-
         modify_files_tasks: list[tuple[str, str, Callable[[str], str]]] = []
 
         with console.timing("Compile to Javascript"), executor as executor:

{reflex-0.8.2a1 → reflex-0.8.3a2}/reflex/compiler/compiler.py

@@ -145,15 +145,11 @@ def _compile_contexts(state: type[BaseState] | None, theme: Component | None) ->
     )
 
 
-def _compile_page(
-    component: BaseComponent,
-    state: type[BaseState] | None,
-) -> str:
-    """Compile the component given the app state.
+def _compile_page(component: BaseComponent) -> str:
+    """Compile the component.
 
     Args:
         component: The component to compile.
-        state: The app state.
 
     Returns:
         The compiled component.
@@ -163,15 +159,12 @@ def _compile_page(
     imports = utils.compile_imports(imports)
 
     # Compile the code to render the component.
-    kwargs = {"state_name": state.get_name()} if state is not None else {}
-
     return templates.PAGE.render(
         imports=imports,
         dynamic_imports=component._get_all_dynamic_imports(),
         custom_codes=component._get_all_custom_code(),
         hooks=component._get_all_hooks(),
         render=component.render(),
-        **kwargs,
     )
 
 
@@ -556,15 +549,12 @@ def compile_contexts(
     return output_path, _compile_contexts(state, theme)
 
 
-def compile_page(
-    path: str, component: BaseComponent, state: type[BaseState] | None
-) -> tuple[str, str]:
+def compile_page(path: str, component: BaseComponent) -> tuple[str, str]:
     """Compile a single page.
 
     Args:
         path: The path to compile the page to.
         component: The component to compile.
-        state: The app state.
 
     Returns:
         The path and code of the compiled page.
@@ -573,7 +563,7 @@ def compile_page(
     output_path = utils.get_page_path(path)
 
     # Add the style to the component.
-    code = _compile_page(component, state)
+    code = _compile_page(component)
     return output_path, code
 
 
@@ -788,16 +778,14 @@ def into_component(component: Component | ComponentCallable) -> Component:
 def compile_unevaluated_page(
     route: str,
     page: UnevaluatedPage,
-    state: type[BaseState] | None = None,
     style: ComponentStyle | None = None,
     theme: Component | None = None,
-) -> tuple[Component, bool]:
+) -> Component:
     """Compiles an uncompiled page into a component and adds meta information.
 
     Args:
         route: The route of the page.
         page: The uncompiled page object.
-        state: The state of the app.
         style: The style of the page.
         theme: The theme of the page.
 
@@ -813,21 +801,6 @@ def compile_unevaluated_page(
 
         component._add_style_recursive(style or {}, theme)
 
-        enable_state = False
-        # Ensure state is enabled if this page uses state.
-        if state is None:
-            if page.on_load or component._has_stateful_event_triggers():
-                enable_state = True
-            else:
-                for var in component._get_vars(include_children=True):
-                    var_data = var._get_all_var_data()
-                    if not var_data:
-                        continue
-                    if not var_data.state:
-                        continue
-                    enable_state = True
-                    break
-
         from reflex.utils.format import make_default_page_title
 
         component = Fragment.create(component)
@@ -856,7 +829,7 @@ def compile_unevaluated_page(
             e.add_note(f"Happened while evaluating page {route!r}")
         raise
     else:
-        return component, enable_state
+        return component
 
 
 class ExecutorSafeFunctions:
@@ -886,7 +859,6 @@ class ExecutorSafeFunctions:
 
     COMPONENTS: dict[str, BaseComponent] = {}
     UNCOMPILED_PAGES: dict[str, UnevaluatedPage] = {}
-    STATE: type[BaseState] | None = None
 
     @classmethod
     def compile_page(cls, route: str) -> tuple[str, str]:
@@ -898,7 +870,7 @@ class ExecutorSafeFunctions:
         Returns:
             The path and code of the compiled page.
         """
-        return compile_page(route, cls.COMPONENTS[route], cls.STATE)
+        return compile_page(route, cls.COMPONENTS[route])
 
     @classmethod
     def compile_unevaluated_page(
@@ -917,10 +889,10 @@ class ExecutorSafeFunctions:
         Returns:
             The route, compiled component, and compiled page.
         """
-        component, enable_state = compile_unevaluated_page(
-            route, cls.UNCOMPILED_PAGES[route], cls.STATE, style, theme
+        component = compile_unevaluated_page(
+            route, cls.UNCOMPILED_PAGES[route], style, theme
         )
-        return route, component, compile_page(route, component, cls.STATE)
+        return route, component, compile_page(route, component)
 
     @classmethod
     def compile_theme(cls, style: ComponentStyle | None) -> tuple[str, str]:

{reflex-0.8.2a1 → reflex-0.8.3a2}/reflex/components/base/error_boundary.py

@@ -25,11 +25,14 @@ def on_error_spec(
         The arguments for the event handler.
     """
     return (
-        error.stack,
+        error.name.to(str) + ": " + error.message.to(str) + "\n" + error.stack.to(str),
         info.componentStack,
     )
 
 
+_ERROR_DISPLAY: str = r"""event_args.error.name + ': ' + event_args.error.message + '\n' + event_args.error.stack"""
+
+
 class ErrorBoundary(Component):
     """A React Error Boundary component that catches unhandled frontend exceptions."""
 
@@ -76,9 +79,7 @@ class ErrorBoundary(Component):
                                     div(
                                         div(
                                             pre(
-                                                Var(
-                                                    _js_expr="event_args.error.stack",
-                                                ),
+                                                Var(_js_expr=_ERROR_DISPLAY),
                                             ),
                                             padding="0.5rem",
                                             width="fit-content",
@@ -93,7 +94,7 @@ class ErrorBoundary(Component):
                                     button(
                                         "Copy",
                                         on_click=set_clipboard(
-                                            Var(_js_expr="event_args.error.stack"),
+                                            Var(_js_expr=_ERROR_DISPLAY)
                                         ),
                                         padding="0.35rem 0.75rem",
                                         margin="0.5rem",

{reflex-0.8.2a1 → reflex-0.8.3a2}/reflex/components/core/__init__.py

@@ -50,6 +50,7 @@ _SUBMOD_ATTRS: dict[str, list[str]] = {
         "selected_files",
     ],
     "auto_scroll": ["auto_scroll"],
+    "window_events": ["WindowEventListener", "window_event_listener"],
 }
 
 __getattr__, __dir__, __all__ = lazy_loader.attach(

{reflex-0.8.2a1 → reflex-0.8.3a2}/reflex/components/core/__init__.pyi

@@ -39,6 +39,7 @@ from .upload import (
     selected_files,
     upload,
 )
+from .window_events import WindowEventListener, window_event_listener
 
 __all__ = [
     "Clipboard",
@@ -52,6 +53,7 @@ __all__ = [
     "Helmet",
     "Html",
     "Match",
+    "WindowEventListener",
     "auto_scroll",
     "breakpoints",
     "cancel_upload",
@@ -79,4 +81,5 @@ __all__ = [
     "tablet_and_desktop",
     "tablet_only",
     "upload",
+    "window_event_listener",
 ]

reflex-0.8.3a2/reflex/components/core/window_events.py

@@ -0,0 +1,104 @@
+"""Window event listener component for Reflex."""
+
+import reflex as rx
+from reflex.components.base.fragment import Fragment
+from reflex.constants.compiler import Hooks
+from reflex.event import key_event, no_args_event_spec
+from reflex.vars.base import Var, VarData
+from reflex.vars.object import ObjectVar
+
+
+def _on_resize_spec() -> tuple[Var[int], Var[int]]:
+    """Args spec for the on_resize event trigger.
+
+    Returns:
+        A tuple containing window width and height variables.
+    """
+    return (Var("window.innerWidth"), Var("window.innerHeight"))
+
+
+def _on_scroll_spec() -> tuple[Var[float], Var[float]]:
+    """Args spec for the on_scroll event trigger.
+
+    Returns:
+        A tuple containing window scroll X and Y position variables.
+    """
+    return (Var("window.scrollX"), Var("window.scrollY"))
+
+
+def _on_visibility_change_spec() -> tuple[Var[bool]]:
+    """Args spec for the on_visibility_change event trigger.
+
+    Returns:
+        A tuple containing the document hidden state variable.
+    """
+    return (Var("document.hidden"),)
+
+
+def _on_storage_spec(e: ObjectVar) -> tuple[Var[str], Var[str], Var[str], Var[str]]:
+    """Args spec for the on_storage event trigger.
+
+    Args:
+        e: The storage event.
+
+    Returns:
+        A tuple containing key, old value, new value, and URL variables.
+    """
+    return (e.key.to(str), e.oldValue.to(str), e.newValue.to(str), e.url.to(str))
+
+
+class WindowEventListener(Fragment):
+    """A component that listens for window events."""
+
+    # Event handlers
+    on_resize: rx.EventHandler[_on_resize_spec]
+    on_scroll: rx.EventHandler[_on_scroll_spec]
+    on_focus: rx.EventHandler[no_args_event_spec]
+    on_blur: rx.EventHandler[no_args_event_spec]
+    on_visibility_change: rx.EventHandler[_on_visibility_change_spec]
+    on_before_unload: rx.EventHandler[no_args_event_spec]
+    on_key_down: rx.EventHandler[key_event]
+    on_popstate: rx.EventHandler[no_args_event_spec]
+    on_storage: rx.EventHandler[_on_storage_spec]
+
+    def _exclude_props(self) -> list[str]:
+        """Exclude event handler props from being passed to Fragment.
+
+        Returns:
+            List of prop names to exclude from the Fragment.
+        """
+        return [*super()._exclude_props(), *self.event_triggers.keys()]
+
+    def add_hooks(self) -> list[str | Var[str]]:
+        """Add hooks to register window event listeners.
+
+        Returns:
+            The hooks to add to the component.
+        """
+        hooks = []
+
+        for prop_name, event_trigger in self.event_triggers.items():
+            # Get JS event name: remove on_ prefix and underscores
+            event_name = prop_name.removeprefix("on_").replace("_", "")
+
+            hook_expr = f"""
+                    useEffect(() => {{
+                        if (typeof window === 'undefined') return;
+
+                        window.addEventListener('{event_name}', {event_trigger});
+                        return () => window.removeEventListener('{event_name}', {event_trigger});
+                    }}, []);
+                """
+
+            hooks.append(
+                Var(
+                    hook_expr,
+                    _var_type="str",
+                    _var_data=VarData(position=Hooks.HookPosition.POST_TRIGGER),
+                )
+            )
+
+        return hooks
+
+
+window_event_listener = WindowEventListener.create

reflex-0.8.3a2/reflex/components/core/window_events.pyi

@@ -0,0 +1,84 @@
+"""Stub file for reflex/components/core/window_events.py"""
+
+# ------------------- DO NOT EDIT ----------------------
+# This file was generated by `reflex/utils/pyi_generator.py`!
+# ------------------------------------------------------
+from collections.abc import Mapping, Sequence
+from typing import Any
+
+from reflex.components.base.fragment import Fragment
+from reflex.components.core.breakpoints import Breakpoints
+from reflex.event import EventType, KeyInputInfo, PointerEventInfo
+from reflex.vars.base import Var
+
+class WindowEventListener(Fragment):
+    def add_hooks(self) -> list[str | Var[str]]: ...
+    @classmethod
+    def create(
+        cls,
+        *children,
+        style: Sequence[Mapping[str, Any]]
+        | Mapping[str, Any]
+        | Var[Mapping[str, Any]]
+        | Breakpoints
+        | None = None,
+        key: Any | None = None,
+        id: Any | None = None,
+        ref: Var | None = None,
+        class_name: Any | None = None,
+        autofocus: bool | None = None,
+        custom_attrs: dict[str, Var | Any] | None = None,
+        on_before_unload: EventType[()] | None = None,
+        on_blur: EventType[()] | None = None,
+        on_click: EventType[()] | EventType[PointerEventInfo] | None = None,
+        on_context_menu: EventType[()] | EventType[PointerEventInfo] | None = None,
+        on_double_click: EventType[()] | EventType[PointerEventInfo] | None = None,
+        on_focus: EventType[()] | None = None,
+        on_key_down: EventType[()]
+        | EventType[str]
+        | EventType[str, KeyInputInfo]
+        | None = None,
+        on_mount: EventType[()] | None = None,
+        on_mouse_down: EventType[()] | None = None,
+        on_mouse_enter: EventType[()] | None = None,
+        on_mouse_leave: EventType[()] | None = None,
+        on_mouse_move: EventType[()] | None = None,
+        on_mouse_out: EventType[()] | None = None,
+        on_mouse_over: EventType[()] | None = None,
+        on_mouse_up: EventType[()] | None = None,
+        on_popstate: EventType[()] | None = None,
+        on_resize: EventType[()] | EventType[int] | EventType[int, int] | None = None,
+        on_scroll: EventType[()]
+        | EventType[float]
+        | EventType[float, float]
+        | None = None,
+        on_scroll_end: EventType[()] | None = None,
+        on_storage: EventType[()]
+        | EventType[str]
+        | EventType[str, str]
+        | EventType[str, str, str]
+        | EventType[str, str, str, str]
+        | None = None,
+        on_unmount: EventType[()] | None = None,
+        on_visibility_change: EventType[()] | EventType[bool] | None = None,
+        **props,
+    ) -> WindowEventListener:
+        """Create the component.
+
+        Args:
+            *children: The children of the component.
+            on_resize: Event handlers
+            style: The style of the component.
+            key: A unique key for the component.
+            id: The id for the component.
+            ref: The Var to pass as the ref to the component.
+            class_name: The class name for the component.
+            autofocus: Whether the component should take the focus once the page is loaded
+            custom_attrs: custom attribute
+            **props: The props of the component.
+
+        Returns:
+            The component.
+        """
+
+window_event_listener = WindowEventListener.create

{reflex-0.8.2a1 → reflex-0.8.3a2}/reflex/components/el/__init__.pyi

@@ -239,6 +239,7 @@ from .elements.typography import (
     Dl,
     Dt,
     Figcaption,
+    Figure,
     Hr,
     Ins,
     Li,
@@ -253,6 +254,7 @@ from .elements.typography import (
     dl,
     dt,
     figcaption,
+    figure,
     hr,
     ins,
     li,
@@ -307,6 +309,7 @@ __all__ = [
     "Embed",
     "Fieldset",
     "Figcaption",
+    "Figure",
     "Footer",
     "Form",
     "G",
@@ -424,6 +427,7 @@ __all__ = [
     "embed",
     "fieldset",
     "figcaption",
+    "figure",
     "footer",
     "form",
     "g",

{reflex-0.8.2a1 → reflex-0.8.3a2}/reflex/components/el/elements/__init__.py

@@ -125,6 +125,7 @@ _MAPPING = {
         "dl",
         "dt",
         "figcaption",
+        "figure",
         "hr",
         "ol",
         "li",

{reflex-0.8.2a1 → reflex-0.8.3a2}/reflex/components/el/elements/__init__.pyi

@@ -237,6 +237,7 @@ from .typography import (
     Dl,
     Dt,
     Figcaption,
+    Figure,
     Hr,
     Ins,
     Li,
@@ -251,6 +252,7 @@ from .typography import (
     dl,
     dt,
     figcaption,
+    figure,
     hr,
     ins,
     li,
@@ -374,6 +376,7 @@ _MAPPING = {
         "dl",
         "dt",
         "figcaption",
+        "figure",
         "hr",
         "ol",
         "li",
@@ -443,6 +446,7 @@ __all__ = [
     "Embed",
     "Fieldset",
     "Figcaption",
+    "Figure",
     "Footer",
     "Form",
     "G",
@@ -559,6 +563,7 @@ __all__ = [
     "embed",
     "fieldset",
     "figcaption",
+    "figure",
     "footer",
     "form",
     "g",

{reflex-0.8.2a1 → reflex-0.8.3a2}/reflex/components/el/elements/forms.py

@@ -466,11 +466,13 @@ class Input(BaseInput):
         if cls is Input:
             input_type = props.get("type")
 
-            if input_type == "checkbox":
+            if isinstance(input_type, str) and input_type == "checkbox":
                 # Checkbox inputs should use the CheckboxInput class
                 return CheckboxInput.create(*children, **props)
 
-            if input_type == "number" or input_type == "range":
+            if isinstance(input_type, str) and (
+                input_type == "number" or input_type == "range"
+            ):
                 # Number inputs should use the ValueNumberInput class
                 return ValueNumberInput.create(*children, **props)
 

{reflex-0.8.2a1 → reflex-0.8.3a2}/reflex/components/el/elements/typography.py

@@ -46,6 +46,12 @@ class Figcaption(BaseHTML):
     tag = "figcaption"
 
 
+class Figure(BaseHTML):
+    """Display the figure element."""
+
+    tag = "figure"
+
+
 class Hr(BaseHTML):
     """Display the hr element."""
 
@@ -132,6 +138,7 @@ div = Div.create
 dl = Dl.create
 dt = Dt.create
 figcaption = Figcaption.create
+figure = Figure.create
 hr = Hr.create
 li = Li.create
 ol = Ol.create