reflex 0.4.9a1__py3-none-any.whl → 0.5.0__py3-none-any.whl

reflex/components/core/foreach.py

@@ -2,16 +2,24 @@
 from __future__ import annotations
 
 import inspect
-from hashlib import md5
-from typing import Any, Callable, Iterable, Optional
+from typing import Any, Callable, Iterable
 
 from reflex.components.base.fragment import Fragment
 from reflex.components.component import Component
 from reflex.components.tags import IterTag
 from reflex.constants import MemoizationMode
+from reflex.utils import console
 from reflex.vars import Var
 
 
+class ForeachVarError(TypeError):
+    """Raised when the iterable type is Any."""
+
+
+class ForeachRenderError(TypeError):
+    """Raised when there is an error with the foreach render function."""
+
+
 class Foreach(Component):
     """A component that takes in an iterable and a render function and renders a list of components."""
 
@@ -23,68 +31,85 @@ class Foreach(Component):
     # A function from the render args to the component.
     render_fn: Callable = Fragment.create
 
-    # The theme if set.
-    theme: Optional[Component] = None
-
-    def _apply_theme(self, theme: Component):
-        """Apply the theme to this component.
-
-        Args:
-            theme: The theme to apply.
-        """
-        self.theme = theme
-
     @classmethod
-    def create(cls, iterable: Var[Iterable], render_fn: Callable, **props) -> Foreach:
+    def create(
+        cls,
+        iterable: Var[Iterable] | Iterable,
+        render_fn: Callable,
+        **props,
+    ) -> Foreach:
         """Create a foreach component.
 
         Args:
             iterable: The iterable to create components from.
             render_fn: A function from the render args to the component.
-            **props: The attributes to pass to each child component.
+            **props: The attributes to pass to each child component (deprecated).
 
         Returns:
             The foreach component.
 
         Raises:
-            TypeError: If the iterable is of type Any.
+            ForeachVarError: If the iterable is of type Any.
         """
-        iterable = Var.create(iterable)  # type: ignore
+        if props:
+            console.deprecate(
+                feature_name="Passing props to rx.foreach",
+                reason="it does not have the intended effect and may be confusing",
+                deprecation_version="0.5.0",
+                removal_version="0.6.0",
+            )
+        iterable = Var.create_safe(iterable)
         if iterable._var_type == Any:
-            raise TypeError(
-                f"Could not foreach over var of type Any. (If you are trying to foreach over a state var, add a type annotation to the var.)"
+            raise ForeachVarError(
+                f"Could not foreach over var `{iterable._var_full_name}` of type Any. "
+                "(If you are trying to foreach over a state var, add a type annotation to the var). "
+                "See https://reflex.dev/docs/library/layout/foreach/"
             )
         component = cls(
             iterable=iterable,
             render_fn=render_fn,
-            **props,
         )
-        # Keep a ref to a rendered component to determine correct imports.
-        component.children = [
-            component._render(props=dict(index_var_name="i")).render_component()
-        ]
+        # Keep a ref to a rendered component to determine correct imports/hooks/styles.
+        component.children = [component._render().render_component()]
         return component
 
-    def _render(self, props: dict[str, Any] | None = None) -> IterTag:
-        props = {} if props is None else props.copy()
+    def _render(self) -> IterTag:
+        props = {}
 
-        # Determine the arg var name based on the params accepted by render_fn.
         render_sig = inspect.signature(self.render_fn)
         params = list(render_sig.parameters.values())
+
+        # Validate the render function signature.
+        if len(params) == 0 or len(params) > 2:
+            raise ForeachRenderError(
+                "Expected 1 or 2 parameters in foreach render function, got "
+                f"{[p.name for p in params]}. See https://reflex.dev/docs/library/layout/foreach/"
+            )
+
         if len(params) >= 1:
-            props.setdefault("arg_var_name", params[0].name)
+            # Determine the arg var name based on the params accepted by render_fn.
+            props["arg_var_name"] = params[0].name
 
-        if len(params) >= 2:
+        if len(params) == 2:
             # Determine the index var name based on the params accepted by render_fn.
-            props.setdefault("index_var_name", params[1].name)
-        elif "index_var_name" not in props:
-            # Otherwise, use a deterministic index, based on the rendered code.
-            code_hash = md5(str(self.children[0].render()).encode("utf-8")).hexdigest()
-            props.setdefault("index_var_name", f"index_{code_hash}")
+            props["index_var_name"] = params[1].name
+        else:
+            # Otherwise, use a deterministic index, based on the render function bytecode.
+            code_hash = (
+                hash(self.render_fn.__code__)
+                .to_bytes(
+                    length=8,
+                    byteorder="big",
+                    signed=True,
+                )
+                .hex()
+            )
+            props["index_var_name"] = f"index_{code_hash}"
 
         return IterTag(
             iterable=self.iterable,
             render_fn=self.render_fn,
+            children=self.children,
             **props,
         )
 
@@ -95,23 +120,9 @@ class Foreach(Component):
             The dictionary for template of component.
         """
         tag = self._render()
-        component = tag.render_component()
-
-        # Apply the theme to the children.
-        if self.theme is not None:
-            component.apply_theme(self.theme)
 
         return dict(
-            tag.add_props(
-                **self.event_triggers,
-                key=self.key,
-                sx=self.style,
-                id=self.id,
-                class_name=self.class_name,
-            ).set(
-                children=[component.render()],
-                props=tag.format_props(),
-            ),
+            tag,
             iterable_state=tag.iterable._var_full_name,
             arg_name=tag.arg_var_name,
             arg_index=tag.get_index_var_arg(),

reflex/components/core/html.py

@@ -35,5 +35,11 @@ class Html(Div):
         else:
             props["dangerouslySetInnerHTML"] = {"__html": children[0]}
 
+        # Apply the default classname
+        given_class_name = props.pop("class_name", [])
+        if isinstance(given_class_name, str):
+            given_class_name = [given_class_name]
+        props["class_name"] = ["rx-Html", *given_class_name]
+
         # Create the component.
         return super().create(**props)

reflex/components/core/match.py

@@ -67,7 +67,7 @@ class Match(MemoizationLeaf):
         Raises:
             ValueError: If the condition is not provided.
         """
-        match_cond_var = Var.create(cond, _var_is_string=type(cond) is str)
+        match_cond_var = Var.create(cond, _var_is_string=isinstance(cond, str))
 
         if match_cond_var is None:
             raise ValueError("The condition must be set")
@@ -119,7 +119,7 @@ class Match(MemoizationLeaf):
         _var_data = case_element._var_data if isinstance(case_element, Style) else None  # type: ignore
         case_element = Var.create(
             case_element,
-            _var_is_string=type(case_element) is str or isinstance(case_element, Color),
+            _var_is_string=isinstance(case_element, (str, Color)),
         )
         if _var_data is not None:
             case_element._var_data = VarData.merge(case_element._var_data, _var_data)  # type: ignore
@@ -273,18 +273,3 @@ class Match(MemoizationLeaf):
             super()._get_imports(),
             getattr(self.cond._var_data, "imports", {}),
         )
-
-    def _apply_theme(self, theme: Component):
-        """Apply the theme to this component.
-
-        Args:
-            theme: The theme to apply.
-        """
-        # apply theme to return components.
-        for match_case in self.match_cases:
-            if isinstance(match_case[-1], Component):
-                match_case[-1].apply_theme(theme)
-
-        # apply theme to default component
-        if isinstance(self.default, Component):
-            self.default.apply_theme(theme)

reflex/components/core/upload.py

@@ -9,7 +9,7 @@ from typing import Any, Callable, ClassVar, Dict, List, Optional, Union
 from reflex import constants
 from reflex.components.chakra.forms.input import Input
 from reflex.components.chakra.layout.box import Box
-from reflex.components.component import Component, MemoizationLeaf
+from reflex.components.component import Component, ComponentNamespace, MemoizationLeaf
 from reflex.constants import Dirs
 from reflex.event import (
     CallableEventSpec,
@@ -219,6 +219,12 @@ class Upload(MemoizationLeaf):
         # Mark the Upload component as used in the app.
         cls.is_used = True
 
+        # Apply the default classname
+        given_class_name = props.pop("class_name", [])
+        if isinstance(given_class_name, str):
+            given_class_name = [given_class_name]
+        props["class_name"] = ["rx-Upload", *given_class_name]
+
         # get only upload component props
         supported_props = cls.get_props().union({"on_drop"})
         upload_props = {
@@ -299,3 +305,38 @@ class Upload(MemoizationLeaf):
         return {
             (5, "UploadFilesProvider"): UploadFilesProvider.create(),
         }
+
+
+class StyledUpload(Upload):
+    """The styled Upload Component."""
+
+    @classmethod
+    def create(cls, *children, **props) -> Component:
+        """Create the styled upload component.
+
+        Args:
+            *children: The children of the component.
+            **props: The properties of the component.
+
+        Returns:
+            The styled upload component.
+        """
+        # Set default props.
+        props.setdefault("border", "1px dashed var(--accent-12)")
+        props.setdefault("padding", "5em")
+        props.setdefault("textAlign", "center")
+
+        # Mark the Upload component as used in the app.
+        Upload.is_used = True
+
+        return super().create(
+            *children,
+            **props,
+        )
+
+
+class UploadNamespace(ComponentNamespace):
+    """Upload component namespace."""
+
+    root = Upload.create
+    __call__ = StyledUpload.create

reflex/components/core/upload.pyi

@@ -13,7 +13,7 @@ from typing import Any, Callable, ClassVar, Dict, List, Optional, Union
 from reflex import constants
 from reflex.components.chakra.forms.input import Input
 from reflex.components.chakra.layout.box import Box
-from reflex.components.component import Component, MemoizationLeaf
+from reflex.components.component import Component, ComponentNamespace, MemoizationLeaf
 from reflex.constants import Dirs
 from reflex.event import (
     CallableEventSpec,
@@ -219,3 +219,201 @@ class Upload(MemoizationLeaf):
         """
         ...
     def get_event_triggers(self) -> dict[str, Union[Var, Any]]: ...
+
+class StyledUpload(Upload):
+    @overload
+    @classmethod
+    def create(  # type: ignore
+        cls,
+        *children,
+        accept: Optional[
+            Union[Var[Optional[Dict[str, List]]], Optional[Dict[str, List]]]
+        ] = None,
+        disabled: Optional[Union[Var[bool], bool]] = None,
+        max_files: Optional[Union[Var[int], int]] = None,
+        max_size: Optional[Union[Var[int], int]] = None,
+        min_size: Optional[Union[Var[int], int]] = None,
+        multiple: Optional[Union[Var[bool], bool]] = None,
+        no_click: Optional[Union[Var[bool], bool]] = None,
+        no_drag: Optional[Union[Var[bool], bool]] = None,
+        no_keyboard: Optional[Union[Var[bool], bool]] = None,
+        style: Optional[Style] = None,
+        key: Optional[Any] = None,
+        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, function, BaseVar]
+        ] = None,
+        on_click: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_context_menu: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_double_click: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_drop: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_focus: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mount: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_down: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_enter: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_leave: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_move: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_out: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_over: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_up: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_scroll: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_unmount: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        **props
+    ) -> "StyledUpload":
+        """Create the styled upload component.
+
+        Args:
+            *children: The children of the component.
+            accept: The list of accepted file types. This should be a dictionary of MIME types as keys and array of file formats as  values.  supported MIME types: https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types
+            disabled: Whether the dropzone is disabled.
+            max_files: The maximum number of files that can be uploaded.
+            max_size: The maximum file size (bytes) that can be uploaded.
+            min_size: The minimum file size (bytes) that can be uploaded.
+            multiple: Whether to allow multiple files to be uploaded.
+            no_click: Whether to disable click to upload.
+            no_drag: Whether to disable drag and drop.
+            no_keyboard: Whether to disable using the space/enter keys to upload.
+            style: The style of the component.
+            key: A unique key for the component.
+            id: The id for 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 properties of the component.
+
+        Returns:
+            The styled upload component.
+        """
+        ...
+
+class UploadNamespace(ComponentNamespace):
+    root = Upload.create
+
+    @staticmethod
+    def __call__(
+        *children,
+        accept: Optional[
+            Union[Var[Optional[Dict[str, List]]], Optional[Dict[str, List]]]
+        ] = None,
+        disabled: Optional[Union[Var[bool], bool]] = None,
+        max_files: Optional[Union[Var[int], int]] = None,
+        max_size: Optional[Union[Var[int], int]] = None,
+        min_size: Optional[Union[Var[int], int]] = None,
+        multiple: Optional[Union[Var[bool], bool]] = None,
+        no_click: Optional[Union[Var[bool], bool]] = None,
+        no_drag: Optional[Union[Var[bool], bool]] = None,
+        no_keyboard: Optional[Union[Var[bool], bool]] = None,
+        style: Optional[Style] = None,
+        key: Optional[Any] = None,
+        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, function, BaseVar]
+        ] = None,
+        on_click: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_context_menu: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_double_click: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_drop: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_focus: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mount: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_down: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_enter: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_leave: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_move: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_out: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_over: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_mouse_up: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_scroll: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        on_unmount: Optional[
+            Union[EventHandler, EventSpec, list, function, BaseVar]
+        ] = None,
+        **props
+    ) -> "StyledUpload":
+        """Create the styled upload component.
+
+        Args:
+            *children: The children of the component.
+            accept: The list of accepted file types. This should be a dictionary of MIME types as keys and array of file formats as  values.  supported MIME types: https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types
+            disabled: Whether the dropzone is disabled.
+            max_files: The maximum number of files that can be uploaded.
+            max_size: The maximum file size (bytes) that can be uploaded.
+            min_size: The minimum file size (bytes) that can be uploaded.
+            multiple: Whether to allow multiple files to be uploaded.
+            no_click: Whether to disable click to upload.
+            no_drag: Whether to disable drag and drop.
+            no_keyboard: Whether to disable using the space/enter keys to upload.
+            style: The style of the component.
+            key: A unique key for the component.
+            id: The id for 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 properties of the component.
+
+        Returns:
+            The styled upload component.
+        """
+        ...

reflex/components/datadisplay/code.py

@@ -1,4 +1,6 @@
 """A code component."""
+from __future__ import annotations
+
 import re
 from typing import Dict, Literal, Optional, Union
 
@@ -7,6 +9,7 @@ from reflex.components.chakra.layout import Box
 from reflex.components.chakra.media import Icon
 from reflex.components.component import Component
 from reflex.components.core.cond import color_mode_cond
+from reflex.constants.colors import Color
 from reflex.event import set_clipboard
 from reflex.style import Style
 from reflex.utils import format, imports
@@ -373,7 +376,7 @@ class CodeBlock(Component):
     wrap_long_lines: Var[bool]
 
     # A custom style for the code block.
-    custom_style: Dict[str, str] = {}
+    custom_style: Dict[str, Union[str, Var, Color]] = {}
 
     # Props passed down to the code tag.
     code_tag_props: Var[Dict[str, str]]
@@ -490,8 +493,9 @@ class CodeBlock(Component):
         else:
             return code_block
 
-    def _add_style(self, style):
-        self.custom_style.update(style)  # type: ignore
+    def add_style(self) -> Style | None:
+        """Add style to the component."""
+        self.custom_style.update(self.style)
 
     def _render(self):
         out = super()._render()

reflex/components/datadisplay/code.pyi

@@ -14,6 +14,7 @@ from reflex.components.chakra.layout import Box
 from reflex.components.chakra.media import Icon
 from reflex.components.component import Component
 from reflex.components.core.cond import color_mode_cond
+from reflex.constants.colors import Color
 from reflex.event import set_clipboard
 from reflex.style import Style
 from reflex.utils import format, imports
@@ -1029,7 +1030,7 @@ class CodeBlock(Component):
         show_line_numbers: Optional[Union[Var[bool], bool]] = None,
         starting_line_number: Optional[Union[Var[int], int]] = None,
         wrap_long_lines: Optional[Union[Var[bool], bool]] = None,
-        custom_style: Optional[Dict[str, str]] = None,
+        custom_style: Optional[Dict[str, Union[str, Var, Color]]] = None,
         code_tag_props: Optional[Union[Var[Dict[str, str]], Dict[str, str]]] = None,
         style: Optional[Style] = None,
         key: Optional[Any] = None,
@@ -1110,5 +1111,6 @@ class CodeBlock(Component):
             The text component.
         """
         ...
+    def add_style(self) -> Style | None: ...
     @staticmethod
     def convert_theme_name(theme) -> str: ...

reflex/components/el/elements/forms.py

@@ -338,7 +338,7 @@ class Input(BaseHTML):
     use_map: Var[Union[str, int, bool]]
 
     # Value of the input
-    value: Var[Union[str, int, bool]]
+    value: Var[Union[str, int, float]]
 
     def get_event_triggers(self) -> Dict[str, Any]:
         """Get the event triggers that pass the component's value to the handler.

reflex/components/el/elements/forms.pyi

@@ -662,7 +662,7 @@ class Input(BaseHTML):
             Union[Var[Union[str, int, bool]], Union[str, int, bool]]
         ] = None,
         value: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
+            Union[Var[Union[str, int, float]], Union[str, int, float]]
         ] = None,
         access_key: Optional[
             Union[Var[Union[str, int, bool]], Union[str, int, bool]]

reflex/components/lucide/icon.py

@@ -1,7 +1,6 @@
 """Lucide Icon component."""
 
 from reflex.components.component import Component
-from reflex.style import Style
 from reflex.utils import console, format
 from reflex.vars import Var
 
@@ -45,24 +44,24 @@ class Icon(LucideIconComponent):
                     feature_name=f"icon {tag}",
                     reason=f"it was renamed upstream. Use {new_tag} instead.",
                     deprecation_version="0.4.6",
-                    removal_version="0.5.0",
+                    removal_version="0.6.0",
                 )
                 return new_tag
             return tag
 
         if children:
-            if len(children) == 1 and type(children[0]) == str:
+            if len(children) == 1 and isinstance(children[0], str):
                 props["tag"] = children[0]
                 children = []
             else:
                 raise AttributeError(
                     f"Passing multiple children to Icon component is not allowed: remove positional arguments {children[1:]} to fix"
                 )
-        if "tag" not in props.keys():
+        if "tag" not in props:
             raise AttributeError("Missing 'tag' keyword-argument for Icon")
 
         if (
-            type(props["tag"]) != str
+            not isinstance(props["tag"], str)
             or map_deprecated_icon_names_05(format.to_snake_case(props["tag"]))
             not in LUCIDE_ICON_LIST
         ):
@@ -73,16 +72,9 @@ class Icon(LucideIconComponent):
 
         props["tag"] = format.to_title_case(format.to_snake_case(props["tag"])) + "Icon"
         props["alias"] = f"Lucide{props['tag']}"
+        props.setdefault("color", f"var(--current-color)")
         return super().create(*children, **props)
 
-    def _apply_theme(self, theme: Component):
-        self.style = Style(
-            {
-                "color": f"var(--current-color)",
-                **self.style,
-            }
-        )
-
 
 RENAMED_ICONS_05 = {
     "activity_square": "square_activity",

reflex/components/lucide/icon.pyi

@@ -8,7 +8,6 @@ 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.style import Style
 from reflex.utils import console, format
 from reflex.vars import Var