reflex 0.3.5a1__tar.gz → 0.3.5a3__tar.gz

{reflex-0.3.5a1 → reflex-0.3.5a3}/PKG-INFO

@@ -1,6 +1,6 @@
 Metadata-Version: 2.1
 Name: reflex
-Version: 0.3.5a1
+Version: 0.3.5a3
 Summary: Web apps in pure Python.
 Home-page: https://reflex.dev
 License: Apache-2.0

{reflex-0.3.5a1 → reflex-0.3.5a3}/pyproject.toml

@@ -1,6 +1,6 @@
 [tool.poetry]
 name = "reflex"
-version = "0.3.5a1"
+version = "0.3.5a3"
 description = "Web apps in pure Python."
 license = "Apache-2.0"
 authors = [

{reflex-0.3.5a1 → reflex-0.3.5a3}/reflex/.templates/jinja/web/pages/custom_component.js.jinja2

@@ -22,6 +22,9 @@ export const {{component.name}} = memo(({ {{-component.props|join(", ")-}} }) =>
 
     }
 {% endif %}
+    {% for hook in component.hooks %}
+    {{ hook }}
+    {% endfor %}
     return(
         {{utils.render(component.render)}}
       )

{reflex-0.3.5a1 → reflex-0.3.5a3}/reflex/.templates/jinja/web/utils/context.js.jinja2

@@ -23,10 +23,15 @@ export const clientStorage = {}
 {% endif %}
 
 {% if state_name %}
+export const onLoadInternalEvent = () => [Event('{{state_name}}.{{const.on_load_internal}}')]
+
 export const initialEvents = () => [
     Event('{{state_name}}.{{const.hydrate}}', hydrateClientStorage(clientStorage)),
+    ...onLoadInternalEvent()
 ]
 {% else %}
+export const onLoadInternalEvent = () => []
+
 export const initialEvents = () => []
 {% endif %}
 

{reflex-0.3.5a1 → reflex-0.3.5a3}/reflex/.templates/web/utils/state.js

@@ -6,7 +6,7 @@ import env from "env.json";
 import Cookies from "universal-cookie";
 import { useEffect, useReducer, useRef, useState } from "react";
 import Router, { useRouter } from "next/router";
-import { initialEvents, initialState } from "utils/context.js"
+import { initialEvents, initialState, onLoadInternalEvent } from "utils/context.js"
 
 // Endpoint URLs.
 const EVENTURL = env.EVENT
@@ -529,10 +529,15 @@ export const useEventLoop = (
   }
 
   const sentHydrate = useRef(false);  // Avoid double-hydrate due to React strict-mode
-  // initial state hydrate
   useEffect(() => {
     if (router.isReady && !sentHydrate.current) {
-      addEvents(initial_events())
+    const events = initial_events()
+      addEvents(events.map((e) => (
+        {
+          ...e,
+          router_data: (({ pathname, query, asPath }) => ({ pathname, query, asPath }))(router)
+        }
+      )))
       sentHydrate.current = true
     }
   }, [router.isReady])
@@ -560,7 +565,7 @@ export const useEventLoop = (
 
   // Route after the initial page hydration.
   useEffect(() => {
-    const change_complete = () => addEvents(initial_events())
+    const change_complete = () => addEvents(onLoadInternalEvent())
     router.events.on('routeChangeComplete', change_complete)
     return () => {
       router.events.off('routeChangeComplete', change_complete)

{reflex-0.3.5a1 → reflex-0.3.5a3}/reflex/app.py

@@ -161,11 +161,12 @@ class App(Base):
                     "rx.BaseState cannot be subclassed multiple times. use rx.State instead"
                 )
 
-            # verify that provided state is valid
-            if self.state and self.state is not State:
-                console.warn(
-                    f"Using substate ({self.state.__name__}) as root state in `rx.App` is currently not supported."
-                    f" Defaulting to root state: ({State.__name__})"
+            if "state" in kwargs:
+                console.deprecate(
+                    feature_name="`state` argument for App()",
+                    reason="due to all `rx.State` subclasses being inferred.",
+                    deprecation_version="0.3.5",
+                    removal_version="0.4.0",
                 )
             self.state = State
         # Get the config

{reflex-0.3.5a1 → reflex-0.3.5a3}/reflex/app.pyi

@@ -125,7 +125,7 @@ class App(Base):
         self, state: State, event: Event
     ) -> asyncio.Task | None: ...
 
-async def process(
+def process(
     app: App, event: Event, sid: str, headers: Dict, client_ip: str
 ) -> AsyncIterator[StateUpdate]: ...
 async def ping() -> str: ...

{reflex-0.3.5a1 → reflex-0.3.5a3}/reflex/compiler/templates.py

@@ -40,6 +40,7 @@ class ReflexJinjaEnvironment(Environment):
             "toggle_color_mode": constants.ColorMode.TOGGLE,
             "use_color_mode": constants.ColorMode.USE,
             "hydrate": constants.CompileVars.HYDRATE,
+            "on_load_internal": constants.CompileVars.ON_LOAD_INTERNAL,
         }
 
 

{reflex-0.3.5a1 → reflex-0.3.5a3}/reflex/compiler/utils.py

@@ -254,6 +254,7 @@ def compile_custom_component(
             "name": component.tag,
             "props": props,
             "render": render.render(),
+            "hooks": render.get_hooks(),
             "custom_code": render.get_custom_code(),
         },
         imports,

{reflex-0.3.5a1 → reflex-0.3.5a3}/reflex/components/base/head.py

@@ -1,6 +1,6 @@
 """The head component."""
 
-from reflex.components.component import Component
+from reflex.components.component import Component, MemoizationLeaf
 
 
 class NextHeadLib(Component):
@@ -9,7 +9,7 @@ class NextHeadLib(Component):
     library = "next/head"
 
 
-class Head(NextHeadLib):
+class Head(NextHeadLib, MemoizationLeaf):
     """Head Component."""
 
     tag = "NextHead"

{reflex-0.3.5a1 → reflex-0.3.5a3}/reflex/components/base/head.pyi

@@ -7,7 +7,7 @@ from typing import Any, Dict, Literal, Optional, Union, overload
 from reflex.vars import Var, BaseVar, ComputedVar
 from reflex.event import EventChain, EventHandler, EventSpec
 from reflex.style import Style
-from reflex.components.component import Component
+from reflex.components.component import Component, MemoizationLeaf
 
 class NextHeadLib(Component):
     @overload
@@ -88,7 +88,7 @@ class NextHeadLib(Component):
         """
         ...
 
-class Head(NextHeadLib):
+class Head(NextHeadLib, MemoizationLeaf):
     @overload
     @classmethod
     def create(  # type: ignore
@@ -147,7 +147,7 @@ class Head(NextHeadLib):
         ] = None,
         **props
     ) -> "Head":
-        """Create the component.
+        """Create a new memoization leaf component.
 
         Args:
             *children: The children of the component.
@@ -160,9 +160,6 @@ class Head(NextHeadLib):
             **props: The props of the component.
 
         Returns:
-            The component.
-
-        Raises:
-            TypeError: If an invalid child is passed.
+            The memoization leaf
         """
         ...

{reflex-0.3.5a1 → reflex-0.3.5a3}/reflex/components/component.py

@@ -23,7 +23,15 @@ from typing import (
 from reflex.base import Base
 from reflex.compiler.templates import STATEFUL_COMPONENT
 from reflex.components.tags import Tag
-from reflex.constants import Dirs, EventTriggers, Hooks, Imports, PageNames
+from reflex.constants import (
+    Dirs,
+    EventTriggers,
+    Hooks,
+    Imports,
+    MemoizationDisposition,
+    MemoizationMode,
+    PageNames,
+)
 from reflex.event import (
     EventChain,
     EventHandler,
@@ -150,6 +158,9 @@ class Component(BaseComponent, ABC):
     # custom attribute
     custom_attrs: Dict[str, Union[Var, str]] = {}
 
+    # When to memoize this component and its children.
+    _memoization_mode: MemoizationMode = MemoizationMode()
+
     @classmethod
     def __init_subclass__(cls, **kwargs):
         """Set default properties.
@@ -1353,20 +1364,29 @@ class StatefulComponent(BaseComponent):
         """
         from reflex.components.layout.foreach import Foreach
 
+        if component._memoization_mode.disposition == MemoizationDisposition.NEVER:
+            # Never memoize this component.
+            return None
+
         if component.tag is None:
             # Only memoize components with a tag.
             return None
 
         # If _var_data is found in this component, it is a candidate for auto-memoization.
-        has_var_data = False
+        should_memoize = False
 
-        # Determine if any Vars have associated data.
-        for prop_var in component._get_vars():
-            if prop_var._var_data:
-                has_var_data = True
-                break
+        # If the component requests to be memoized, then ignore other checks.
+        if component._memoization_mode.disposition == MemoizationDisposition.ALWAYS:
+            should_memoize = True
 
-        if not has_var_data:
+        if not should_memoize:
+            # Determine if any Vars have associated data.
+            for prop_var in component._get_vars():
+                if prop_var._var_data:
+                    should_memoize = True
+                    break
+
+        if not should_memoize:
             # Check for special-cases in child components.
             for child in component.children:
                 # Skip BaseComponent and StatefulComponent children.
@@ -1374,14 +1394,14 @@ class StatefulComponent(BaseComponent):
                     continue
                 # Always consider Foreach something that must be memoized by the parent.
                 if isinstance(child, Foreach):
-                    has_var_data = True
+                    should_memoize = True
                     break
                 child = cls._child_var(child)
                 if isinstance(child, Var) and child._var_data:
-                    has_var_data = True
+                    should_memoize = True
                     break
 
-        if has_var_data or component.event_triggers:
+        if should_memoize or component.event_triggers:
             # Render the component to determine tag+hash based on component code.
             tag_name = cls._get_tag_name(component)
             if tag_name is None:
@@ -1643,15 +1663,46 @@ class StatefulComponent(BaseComponent):
         Returns:
             The memoized component tree.
         """
-        from reflex.components.layout.foreach import Foreach
-
-        # Foreach must be memoized as a single component to retain index Var context.
-        if not isinstance(component, Foreach):
-            component.children = [
-                cls.compile_from(child) for child in component.children
-            ]
         if isinstance(component, Component):
+            if component._memoization_mode.recursive:
+                # Recursively memoize stateful children (default).
+                component.children = [
+                    cls.compile_from(child) for child in component.children
+                ]
+            # Memoize this component if it depends on state.
             stateful_component = cls.create(component)
             if stateful_component is not None:
                 return stateful_component
         return component
+
+
+class MemoizationLeaf(Component):
+    """A component that does not separately memoize its children.
+
+    Any component which depends on finding the exact names of children
+    components within it, should be a memoization leaf so the compiler
+    does not replace the provided child tags with memoized tags.
+
+    During creation, a memoization leaf will mark itself as wanting to be
+    memoized if any of its children return any hooks.
+    """
+
+    _memoization_mode = MemoizationMode(recursive=False)
+
+    @classmethod
+    def create(cls, *children, **props) -> Component:
+        """Create a new memoization leaf component.
+
+        Args:
+            *children: The children of the component.
+            **props: The props of the component.
+
+        Returns:
+            The memoization leaf
+        """
+        comp = super().create(*children, **props)
+        if comp.get_hooks():
+            comp._memoization_mode = cls._memoization_mode.copy(
+                update={"disposition": MemoizationDisposition.ALWAYS}
+            )
+        return comp

{reflex-0.3.5a1 → reflex-0.3.5a3}/reflex/components/forms/input.py

@@ -9,7 +9,7 @@ from reflex.components.libs.chakra import (
     LiteralButtonSize,
     LiteralInputVariant,
 )
-from reflex.constants import EventTriggers
+from reflex.constants import EventTriggers, MemoizationMode
 from reflex.utils import imports
 from reflex.vars import Var
 
@@ -107,6 +107,8 @@ class InputGroup(ChakraComponent):
 
     tag = "InputGroup"
 
+    _memoization_mode = MemoizationMode(recursive=False)
+
 
 class InputLeftAddon(ChakraComponent):
     """The InputLeftAddon component is a component that is used to add an addon to the left of an input."""

{reflex-0.3.5a1 → reflex-0.3.5a3}/reflex/components/forms/input.pyi

@@ -15,7 +15,7 @@ from reflex.components.libs.chakra import (
     LiteralButtonSize,
     LiteralInputVariant,
 )
-from reflex.constants import EventTriggers
+from reflex.constants import EventTriggers, MemoizationMode
 from reflex.utils import imports
 from reflex.vars import Var
 

{reflex-0.3.5a1 → reflex-0.3.5a3}/reflex/components/graphing/recharts/charts.pyi

@@ -770,7 +770,7 @@ class FunnelChart(RechartsCharts):
         ] = None,
         **props
     ) -> "FunnelChart":
-        """Create the component.
+        """Create a new memoization leaf component.
 
         Args:
             *children: The children of the component.
@@ -791,10 +791,7 @@ class FunnelChart(RechartsCharts):
             **props: The props of the component.
 
         Returns:
-            The component.
-
-        Raises:
-            TypeError: If an invalid child is passed.
+            The memoization leaf
         """
         ...
 

{reflex-0.3.5a1 → reflex-0.3.5a3}/reflex/components/graphing/recharts/general.py

@@ -3,6 +3,7 @@ from __future__ import annotations
 
 from typing import Any, Dict, List, Union
 
+from reflex.components.component import MemoizationLeaf
 from reflex.constants import EventTriggers
 from reflex.vars import Var
 
@@ -16,7 +17,7 @@ from .recharts import (
 )
 
 
-class ResponsiveContainer(Recharts):
+class ResponsiveContainer(Recharts, MemoizationLeaf):
     """A base class for responsive containers in Recharts."""
 
     tag = "ResponsiveContainer"

{reflex-0.3.5a1 → reflex-0.3.5a3}/reflex/components/graphing/recharts/general.pyi

@@ -8,6 +8,7 @@ from reflex.vars import Var, BaseVar, ComputedVar
 from reflex.event import EventChain, EventHandler, EventSpec
 from reflex.style import Style
 from typing import Any, Dict, List, Union
+from reflex.components.component import MemoizationLeaf
 from reflex.constants import EventTriggers
 from reflex.vars import Var
 from .recharts import (
@@ -19,7 +20,7 @@ from .recharts import (
     Recharts,
 )
 
-class ResponsiveContainer(Recharts):
+class ResponsiveContainer(Recharts, MemoizationLeaf):
     @overload
     @classmethod
     def create(  # type: ignore
@@ -84,7 +85,7 @@ class ResponsiveContainer(Recharts):
         ] = None,
         **props
     ) -> "ResponsiveContainer":
-        """Create the component.
+        """Create a new memoization leaf component.
 
         Args:
             *children: The children of the component.
@@ -103,10 +104,7 @@ class ResponsiveContainer(Recharts):
             **props: The props of the component.
 
         Returns:
-            The component.
-
-        Raises:
-            TypeError: If an invalid child is passed.
+            The memoization leaf
         """
         ...
 

{reflex-0.3.5a1 → reflex-0.3.5a3}/reflex/components/graphing/recharts/recharts.py

@@ -1,17 +1,17 @@
 """A component that wraps a recharts lib."""
 from typing import Literal
 
-from reflex.components.component import Component, NoSSRComponent
+from reflex.components.component import Component, MemoizationLeaf, NoSSRComponent
 
 
 class Recharts(Component):
-    """A component that wraps a victory lib."""
+    """A component that wraps a recharts lib."""
 
     library = "recharts@2.8.0"
 
 
-class RechartsCharts(NoSSRComponent):
-    """A component that wraps a victory lib."""
+class RechartsCharts(NoSSRComponent, MemoizationLeaf):
+    """A component that wraps a recharts lib."""
 
     library = "recharts@2.8.0"
 

{reflex-0.3.5a1 → reflex-0.3.5a3}/reflex/components/graphing/recharts/recharts.pyi

@@ -8,7 +8,7 @@ from reflex.vars import Var, BaseVar, ComputedVar
 from reflex.event import EventChain, EventHandler, EventSpec
 from reflex.style import Style
 from typing import Literal
-from reflex.components.component import Component, NoSSRComponent
+from reflex.components.component import Component, MemoizationLeaf, NoSSRComponent
 
 class Recharts(Component):
     @overload
@@ -89,7 +89,7 @@ class Recharts(Component):
         """
         ...
 
-class RechartsCharts(NoSSRComponent):
+class RechartsCharts(NoSSRComponent, MemoizationLeaf):
     @overload
     @classmethod
     def create(  # type: ignore
@@ -148,7 +148,7 @@ class RechartsCharts(NoSSRComponent):
         ] = None,
         **props
     ) -> "RechartsCharts":
-        """Create the component.
+        """Create a new memoization leaf component.
 
         Args:
             *children: The children of the component.
@@ -161,10 +161,7 @@ class RechartsCharts(NoSSRComponent):
             **props: The props of the component.
 
         Returns:
-            The component.
-
-        Raises:
-            TypeError: If an invalid child is passed.
+            The memoization leaf
         """
         ...
 

{reflex-0.3.5a1 → reflex-0.3.5a3}/reflex/components/layout/cond.py

@@ -3,7 +3,7 @@ from __future__ import annotations
 
 from typing import Any, Dict, Optional, overload
 
-from reflex.components.component import BaseComponent, Component
+from reflex.components.component import BaseComponent, Component, MemoizationLeaf
 from reflex.components.layout.fragment import Fragment
 from reflex.components.tags import CondTag, Tag
 from reflex.constants import Dirs
@@ -15,7 +15,7 @@ _IS_TRUE_IMPORT = {
 }
 
 
-class Cond(Component):
+class Cond(MemoizationLeaf):
     """Render one of two components based on a condition."""
 
     # The cond to determine which component to render.

{reflex-0.3.5a1 → reflex-0.3.5a3}/reflex/components/layout/foreach.py

@@ -8,12 +8,15 @@ from typing import Any, Callable, Iterable
 from reflex.components.component import Component
 from reflex.components.layout.fragment import Fragment
 from reflex.components.tags import IterTag
+from reflex.constants import MemoizationMode
 from reflex.vars import Var
 
 
 class Foreach(Component):
     """A component that takes in an iterable and a render function and renders a list of components."""
 
+    _memoization_mode = MemoizationMode(recursive=False)
+
     # The iterable to create components from.
     iterable: Var[Iterable]
 

{reflex-0.3.5a1 → reflex-0.3.5a3}/reflex/components/media/icon.py

@@ -1,11 +1,11 @@
 """An icon component."""
 from typing import List
 
-from reflex.components.component import Component
+from reflex.components.libs.chakra import ChakraComponent
 from reflex.utils import format
 
 
-class ChakraIconComponent(Component):
+class ChakraIconComponent(ChakraComponent):
     """A component that wraps a Chakra icon component."""
 
     library = "@chakra-ui/icons@2.0.19"

{reflex-0.3.5a1 → reflex-0.3.5a3}/reflex/components/media/icon.pyi

@@ -8,10 +8,10 @@ from reflex.vars import Var, BaseVar, ComputedVar
 from reflex.event import EventChain, EventHandler, EventSpec
 from reflex.style import Style
 from typing import List
-from reflex.components.component import Component
+from reflex.components.libs.chakra import ChakraComponent
 from reflex.utils import format
 
-class ChakraIconComponent(Component):
+class ChakraIconComponent(ChakraComponent):
     @overload
     @classmethod
     def create(  # type: ignore

{reflex-0.3.5a1 → reflex-0.3.5a3}/reflex/components/typography/markdown.py

@@ -3,6 +3,7 @@
 from __future__ import annotations
 
 import textwrap
+from functools import lru_cache
 from hashlib import md5
 from typing import Any, Callable, Dict, Union
 
@@ -35,6 +36,7 @@ _REHYPE_PLUGINS = Var.create_safe([_REHYPE_KATEX, _REHYPE_RAW])
 
 
 # Component Mapping
+@lru_cache
 def get_base_component_map() -> dict[str, Callable]:
     """Get the base component map.
 
@@ -89,6 +91,9 @@ class Markdown(Component):
     # Custom styles for the markdown (deprecated in v0.2.9).
     custom_styles: Dict[str, Any] = {}
 
+    # The hash of the component map, generated at create() time.
+    component_map_hash: str = ""
+
     @classmethod
     def create(cls, *children, **props) -> Component:
         """Create a markdown component.
@@ -124,7 +129,12 @@ class Markdown(Component):
             src = textwrap.dedent(src)
 
         # Create the component.
-        return super().create(src, component_map=component_map, **props)
+        return super().create(
+            src,
+            component_map=component_map,
+            component_map_hash=cls._component_map_hash(component_map),
+            **props,
+        )
 
     def get_custom_components(
         self, seen: set[str] | None = None
@@ -264,11 +274,15 @@ class Markdown(Component):
 
         return components
 
-    def _component_map_hash(self) -> str:
-        return md5(str(self.component_map).encode()).hexdigest()
+    @staticmethod
+    def _component_map_hash(component_map) -> str:
+        inp = str(
+            {tag: component(_MOCK_ARG) for tag, component in component_map.items()}
+        ).encode()
+        return md5(inp).hexdigest()
 
     def _get_component_map_name(self) -> str:
-        return f"ComponentMap_{self._component_map_hash()}"
+        return f"ComponentMap_{self.component_map_hash}"
 
     def _get_custom_code(self) -> str | None:
         hooks = set()
@@ -292,7 +306,7 @@ class Markdown(Component):
                 remark_plugins=_REMARK_PLUGINS,
                 rehype_plugins=_REHYPE_PLUGINS,
             )
-            .remove_props("componentMap")
+            .remove_props("componentMap", "componentMapHash")
         )
         tag.special_props.add(
             Var.create_safe(

{reflex-0.3.5a1 → reflex-0.3.5a3}/reflex/components/typography/markdown.pyi

@@ -8,6 +8,7 @@ from reflex.vars import Var, BaseVar, ComputedVar
 from reflex.event import EventChain, EventHandler, EventSpec
 from reflex.style import Style
 import textwrap
+from functools import lru_cache
 from hashlib import md5
 from typing import Any, Callable, Dict, Union
 from reflex.compiler import utils
@@ -32,6 +33,7 @@ _REHYPE_KATEX = Var.create_safe("rehypeKatex", _var_is_local=False)
 _REHYPE_RAW = Var.create_safe("rehypeRaw", _var_is_local=False)
 _REHYPE_PLUGINS = Var.create_safe([_REHYPE_KATEX, _REHYPE_RAW])
 
+@lru_cache
 def get_base_component_map() -> dict[str, Callable]: ...
 
 class Markdown(Component):
@@ -42,6 +44,7 @@ class Markdown(Component):
         *children,
         component_map: Optional[Dict[str, Any]] = None,
         custom_styles: Optional[Dict[str, Any]] = None,
+        component_map_hash: Optional[str] = None,
         style: Optional[Style] = None,
         key: Optional[Any] = None,
         id: Optional[Any] = None,
@@ -101,6 +104,7 @@ class Markdown(Component):
             *children: The children of the component.
             component_map: The component map from a tag to a lambda that creates a component.
             custom_styles: Custom styles for the markdown (deprecated in v0.2.9).
+            component_map_hash: The hash of the component map, generated at create() time.
             style: The style of the component.
             key: A unique key for the component.
             id: The id for the component.