From b7dabb1e4264575cea23167b885cde577aa342d3 Mon Sep 17 00:00:00 2001 From: Khaleel Al-Adhami Date: Fri, 30 May 2025 20:33:54 -0700 Subject: [PATCH] remove experimental layout and clean up old experiments --- pyi_hashes.json | 3 +- reflex/experimental/__init__.py | 30 ---- reflex/experimental/layout.py | 254 -------------------------------- 3 files changed, 1 insertion(+), 286 deletions(-) delete mode 100644 reflex/experimental/layout.py diff --git a/pyi_hashes.json b/pyi_hashes.json index e4ed2697cdf..2548b3a9ed7 100644 --- a/pyi_hashes.json +++ b/pyi_hashes.json @@ -121,6 +121,5 @@ "reflex/components/recharts/polar.pyi": "77ca6e0d992f5d5c0479de73db4f71ba", "reflex/components/recharts/recharts.pyi": "bbaec232c2da035b31b5d0e3888f4801", "reflex/components/sonner/toast.pyi": "6dc6d5d05d9a8d7d364c0326fb2e6503", - "reflex/components/suneditor/editor.pyi": "0a6dcab61cc2d750488601e3808080d9", - "reflex/experimental/layout.pyi": "fb4c52b954431d9a927fbdd612b562eb" + "reflex/components/suneditor/editor.pyi": "0a6dcab61cc2d750488601e3808080d9" } diff --git a/reflex/experimental/__init__.py b/reflex/experimental/__init__.py index c755bd50300..2734da19112 100644 --- a/reflex/experimental/__init__.py +++ b/reflex/experimental/__init__.py @@ -3,15 +3,11 @@ from types import SimpleNamespace from reflex.components.datadisplay.shiki_code_block import code_block as code_block -from reflex.components.props import PropsBase -from reflex.components.radix.themes.components.progress import progress as progress -from reflex.components.sonner.toast import toast as toast from reflex.utils.console import warn from reflex.utils.misc import run_in_thread from . import hooks as hooks from .client_state import ClientStateVar as ClientStateVar -from .layout import layout as layout class ExperimentalNamespace(SimpleNamespace): @@ -32,30 +28,6 @@ def __getattribute__(self, item: str): ) return super().__getattribute__(item) - @property - def toast(self): - """Temporary property returning the toast namespace. - - Remove this property when toast is fully promoted. - - Returns: - The toast namespace. - """ - self.register_component_warning("toast") - return toast - - @property - def progress(self): - """Temporary property returning the progress component. - - Remove this property when progress is fully promoted. - - Returns: - The progress component. - """ - self.register_component_warning("progress") - return progress - @property def run_in_thread(self): """Temporary property returning the run_in_thread helper function. @@ -85,7 +57,5 @@ def register_component_warning(component_name: str): _x = ExperimentalNamespace( client_state=ClientStateVar.create, hooks=hooks, - layout=layout, - PropsBase=PropsBase, code_block=code_block, ) diff --git a/reflex/experimental/layout.py b/reflex/experimental/layout.py deleted file mode 100644 index 62540b5028f..00000000000 --- a/reflex/experimental/layout.py +++ /dev/null @@ -1,254 +0,0 @@ -"""To experiment with layout component, move them to reflex/components later.""" - -from __future__ import annotations - -from typing import Any - -from reflex import color, cond -from reflex.components.base.fragment import Fragment -from reflex.components.component import Component, ComponentNamespace, MemoizationLeaf -from reflex.components.radix.primitives.drawer import DrawerRoot, drawer -from reflex.components.radix.themes.components.icon_button import IconButton -from reflex.components.radix.themes.layout.box import Box -from reflex.components.radix.themes.layout.container import Container -from reflex.components.radix.themes.layout.stack import HStack -from reflex.constants.compiler import MemoizationMode -from reflex.event import run_script -from reflex.experimental import hooks -from reflex.state import ComponentState -from reflex.style import Style -from reflex.vars.base import Var - - -class Sidebar(Box, MemoizationLeaf): - """A component that renders the sidebar.""" - - @classmethod - def create(cls, *children, **props): - """Create the sidebar component. - - Args: - children: The children components. - props: The properties of the sidebar. - - Returns: - The sidebar component. - """ - return super().create( - Box.create(*children, **props), # sidebar for content - Box.create(width=props.get("width")), # spacer for layout - ) - - def add_style(self) -> dict[str, Any] | None: - """Add style to the component. - - Returns: - The style of the component. - """ - sidebar: Component = self.children[-2] # pyright: ignore [reportAssignmentType] - spacer: Component = self.children[-1] # pyright: ignore [reportAssignmentType] - open = ( - self.State.open # pyright: ignore [reportAttributeAccessIssue] - if self.State - else Var(_js_expr="open") - ) - sidebar.style["display"] = spacer.style["display"] = cond(open, "block", "none") - - return Style( - { - "position": "fixed", - "border_right": f"1px solid {color('accent', 12)}", - "background_color": color("accent", 1), - "width": "20vw", - "height": "100vh", - } - ) - - def add_hooks(self) -> list[Var]: - """Get the hooks to render. - - Returns: - The hooks for the sidebar. - """ - return [hooks.useState("open", "true")] if not self.State else [] - - -class StatefulSidebar(ComponentState): - """Bind a state to a sidebar component.""" - - open: bool = True - - def toggle(self): - """Toggle the sidebar.""" - self.open = not self.open - - @classmethod - def get_component(cls, *children, **props): - """Get the stateful sidebar component. - - Args: - children: The children components. - props: The properties of the sidebar. - - Returns: - The stateful sidebar component. - """ - return Sidebar.create(*children, **props) - - -class DrawerSidebar(DrawerRoot): - """A component that renders a drawer sidebar.""" - - @classmethod - def create(cls, *children, **props): - """Create the sidebar component. - - Args: - children: The children components. - props: The properties of the sidebar. - - Returns: - The drawer sidebar component. - """ - direction = props.pop("direction", "left") - props.setdefault("border_right", f"1px solid {color('accent', 12)}") - props.setdefault("background_color", color("accent", 1)) - props.setdefault("width", "20vw") - props.setdefault("height", "100vh") - return super().create( - drawer.trigger( - IconButton.create( - "arrow-right-from-line", - background_color="transparent", - ), - position="absolute", - top="15", - left="15", - ), - drawer.portal( - drawer.content( - *children, - **props, - ) - ), - direction=direction, - ) - - -sidebar_trigger_style = { - "position": "fixed", - "z_index": "15", - "color": color("accent", 12), - "background_color": "transparent", - "padding": "0", -} - - -class SidebarTrigger(Fragment): - """A component that renders the sidebar trigger.""" - - _memoization_mode = MemoizationMode(recursive=False) - - @classmethod - def create(cls, sidebar: Component, **props): - """Create the sidebar trigger component. - - Args: - sidebar: The sidebar component. - props: The properties of the sidebar trigger. - - Returns: - The sidebar trigger component. - """ - trigger_props = {**props, **sidebar_trigger_style} - - inner_sidebar: Component = sidebar.children[0] # pyright: ignore [reportAssignmentType] - sidebar_width = inner_sidebar.style.get("width") - - if sidebar.State: - open, toggle = sidebar.State.open, sidebar.State.toggle # pyright: ignore [reportAttributeAccessIssue] - else: - open, toggle = ( - Var(_js_expr="open"), - run_script("setOpen(!open)"), - ) - - trigger_props["left"] = cond(open, f"calc({sidebar_width} - 32px)", "0") - - trigger = cond( - open, - IconButton.create( - "arrow-left-from-line", - on_click=toggle, - **trigger_props, - ), - IconButton.create( - "arrow-right-from-line", - on_click=toggle, - **trigger_props, - ), - ) - return super().create(trigger) - - -class Layout(Box): - """A component that renders the layout.""" - - @classmethod - def create( - cls, - *content: Component, - sidebar: Component | None = None, - **props, - ): - """Create the layout component. - - Args: - content: The content component. - sidebar: The sidebar component. - props: The properties of the layout. - - Returns: - The layout component. - """ - layout_root = HStack.create - - if sidebar is None: - return Container.create(*content, **props) - - if isinstance(sidebar, DrawerSidebar): - return super().create( - sidebar, - Container.create(*content, height="100%"), - **props, - width="100vw", - min_height="100vh", - ) - - if not isinstance(sidebar, Sidebar): - sidebar = Sidebar.create(sidebar) - - # Add the sidebar trigger to the sidebar as first child to not mess up the rendering. - sidebar.children.insert(0, SidebarTrigger.create(sidebar)) - - return super().create( - layout_root( - sidebar, - Container.create(*content, height="100%"), - **props, - width="100vw", - min_height="100vh", - ) - ) - - -class LayoutNamespace(ComponentNamespace): - """Namespace for layout components.""" - - drawer_sidebar = staticmethod(DrawerSidebar.create) - stateful_sidebar = staticmethod(StatefulSidebar.create) - sidebar = staticmethod(Sidebar.create) - __call__ = staticmethod(Layout.create) - - -layout = LayoutNamespace()