reflex 0.5.2a1__tar.gz → 0.5.3__tar.gz

{reflex-0.5.2a1 → reflex-0.5.3}/PKG-INFO

@@ -1,6 +1,6 @@
 Metadata-Version: 2.1
 Name: reflex
-Version: 0.5.2a1
+Version: 0.5.3
 Summary: Web apps in pure Python.
 Home-page: https://reflex.dev
 License: Apache-2.0
@@ -25,6 +25,7 @@ Requires-Dist: fastapi (>=0.96.0,<1.0)
 Requires-Dist: gunicorn (>=20.1.0,<23.0)
 Requires-Dist: httpx (>=0.25.1,<1.0)
 Requires-Dist: jinja2 (>=3.1.2,<4.0)
+Requires-Dist: lazy_loader (>=0.4)
 Requires-Dist: packaging (>=23.1,<25.0)
 Requires-Dist: platformdirs (>=3.10.0,<5.0)
 Requires-Dist: psutil (>=5.9.4,<6.0)

{reflex-0.5.2a1 → reflex-0.5.3}/pyproject.toml

@@ -1,6 +1,6 @@
 [tool.poetry]
 name = "reflex"
-version = "0.5.2a1"
+version = "0.5.3"
 description = "Web apps in pure Python."
 license = "Apache-2.0"
 authors = [
@@ -63,6 +63,7 @@ setuptools = ">=69.1.1,<70.0"
 httpx = ">=0.25.1,<1.0"
 twine = ">=4.0.0,<6.0"
 tomlkit = ">=0.12.4,<1.0"
+lazy_loader = ">=0.4"
 
 [tool.poetry.group.dev.dependencies]
 pytest = ">=7.1.2,<8.0"

{reflex-0.5.2a1 → reflex-0.5.3}/reflex/.templates/web/postcss.config.js

@@ -1,5 +1,6 @@
 module.exports = {
   plugins: {
+    "postcss-import": {},
     tailwindcss: {},
     autoprefixer: {},
   },

reflex-0.5.3/reflex/.templates/web/styles/tailwind.css

@@ -0,0 +1,6 @@
+@import "tailwindcss/base";
+
+@import "@radix-ui/themes/styles.css";
+
+@tailwind components;
+@tailwind utilities;

reflex-0.5.3/reflex/__init__.py

@@ -0,0 +1,332 @@
+"""Import all classes and functions the end user will need to make an app.
+
+Anything imported here will be available in the default Reflex import as `rx.*`.
+
+Dynamic Imports
+---------------
+Reflex utilizes dynamic imports, or lazy loading, to reduce startup/import times.
+With this approach, imports are delayed until they are actually needed. We use
+the `lazy_loader` library(https://github.com/scientific-python/lazy_loader) to achieve this.
+
+How it works
+--------------
+`lazy_loader.attach` takes two optional arguments: `submodules` and `submod_attrs`.
+- `submodules` typically points to directories or files to be accessed.
+- `submod_attrs` defines a mapping of directory or file names as keys with a list
+  of attributes or modules to access.
+
+Example directory structure:
+
+reflex/
+    |_ components/
+            |_ radix/
+                |_ themes/
+                    |_ components/
+                        |_ box.py
+
+To add `box` under the `rx` namespace (`rx.box`), add the relative path to `submod_attrs` in
+`reflex/__init__.py` (this file):
+
+```python
+lazy_loader.attach(
+    submodules={"components"},
+    submod_attrs={
+        "components.radix.themes.components.box": ["box"]
+    }
+)
+```
+
+This implies that `box` will be imported from `reflex/components/radix/themes/components/box.py`.
+
+To add box under the `rx.radix` namespace (`rx.radix.box`), add the relative path to the
+submod_attrs argument in `reflex/components/radix/__init__.py`:
+
+```python
+lazy_loader.attach(
+    submodules = {"themes"},
+    submod_attrs = {
+        "themes.components.box": ["box"]
+    }
+)
+```
+
+Note: It is important to specify the immediate submodules of a directory in the submodules
+argument to ensure they are registered at runtime. For example, 'components' for reflex,
+'radix' for components, 'themes' for radix, etc.
+
+
+Pyi_generator
+--------------
+To generate `.pyi` files for `__init__.py` files, we read the `_SUBMODULES` and `_SUBMOD_ATTRS`
+attributes to generate the import statements. It is highly recommended to define these with
+the provided annotations to facilitate their generation.
+
+
+Aliases
+------------
+This is a special case to specify an alias for a component.
+As an example, we use this typically for `rx.list` where defining `list` attribute in the list.py
+overshadows python's list object which messes up the pyi generation for `list.pyi`. As a result, aliases
+should be used for similar cases like this. Note that this logic is employed to fix the pyi generation and alias
+should still be defined or accessible. Check out the __getattr__ logic in `reflex/components/radix/themes/layouts/list.py`
+
+```python
+lazy_loader.attach(
+    submodules={"components"},
+    submod_attrs={
+        "components.radix.themes.layouts": [("list_ns", "list")]
+    }
+)
+```
+
+In the example above, you will be able to do `rx.list`
+"""
+
+from __future__ import annotations
+
+from reflex.utils import lazy_loader
+
+# import this here explicitly to avoid returning the page module since page attr has the
+# same name as page module(page.py)
+from .page import page as page
+
+RADIX_THEMES_MAPPING: dict = {
+    "components.radix.themes.base": ["color_mode", "theme", "theme_panel"],
+    "components.radix.themes.color_mode": ["color_mode"],
+}
+RADIX_THEMES_COMPONENTS_MAPPING: dict = {
+    **{
+        f"components.radix.themes.components.{mod}": [mod]
+        for mod in [
+            "alert_dialog",
+            "aspect_ratio",
+            "avatar",
+            "badge",
+            "button",
+            "callout",
+            "card",
+            "checkbox",
+            "context_menu",
+            "data_list",
+            "dialog",
+            "hover_card",
+            "icon_button",
+            "input",
+            "inset",
+            "popover",
+            "scroll_area",
+            "select",
+            "skeleton",
+            "slider",
+            "spinner",
+            "switch",
+            "table",
+            "tabs",
+            "text_area",
+            "tooltip",
+            "segmented_control",
+            "radio_cards",
+            "checkbox_cards",
+            "checkbox_group",
+        ]
+    },
+    "components.radix.themes.components.text_field": ["text_field", "input"],
+    "components.radix.themes.components.radio_group": ["radio", "radio_group"],
+    "components.radix.themes.components.dropdown_menu": ["menu", "dropdown_menu"],
+    "components.radix.themes.components.separator": ["divider", "separator"],
+}
+
+RADIX_THEMES_LAYOUT_MAPPING: dict = {
+    "components.radix.themes.layout.box": [
+        "box",
+    ],
+    "components.radix.themes.layout.center": [
+        "center",
+    ],
+    "components.radix.themes.layout.container": [
+        "container",
+    ],
+    "components.radix.themes.layout.flex": [
+        "flex",
+    ],
+    "components.radix.themes.layout.grid": [
+        "grid",
+    ],
+    "components.radix.themes.layout.section": [
+        "section",
+    ],
+    "components.radix.themes.layout.spacer": [
+        "spacer",
+    ],
+    "components.radix.themes.layout.stack": [
+        "stack",
+        "hstack",
+        "vstack",
+    ],
+    "components.radix.themes.layout.list": [
+        ("list_ns", "list"),
+        "list_item",
+        "ordered_list",
+        "unordered_list",
+    ],
+}
+
+RADIX_THEMES_TYPOGRAPHY_MAPPING: dict = {
+    "components.radix.themes.typography.blockquote": [
+        "blockquote",
+    ],
+    "components.radix.themes.typography.code": [
+        "code",
+    ],
+    "components.radix.themes.typography.heading": [
+        "heading",
+    ],
+    "components.radix.themes.typography.link": [
+        "link",
+    ],
+    "components.radix.themes.typography.text": [
+        "text",
+    ],
+}
+
+RADIX_PRIMITIVES_MAPPING: dict = {
+    "components.radix.primitives.accordion": [
+        "accordion",
+    ],
+    "components.radix.primitives.drawer": [
+        "drawer",
+    ],
+    "components.radix.primitives.form": [
+        "form",
+    ],
+    "components.radix.primitives.progress": ["progress"],
+}
+
+COMPONENTS_CORE_MAPPING: dict = {
+    "components.core.banner": [
+        "connection_banner",
+        "connection_modal",
+    ],
+    "components.core.cond": ["cond", "color_mode_cond"],
+    "components.core.foreach": ["foreach"],
+    "components.core.debounce": ["debounce_input"],
+    "components.core.html": ["html"],
+    "components.core.match": ["match"],
+    "components.core.colors": ["color"],
+    "components.core.responsive": [
+        "desktop_only",
+        "mobile_and_tablet",
+        "mobile_only",
+        "tablet_and_desktop",
+        "tablet_only",
+    ],
+    "components.core.upload": [
+        "cancel_upload",
+        "clear_selected_files",
+        "get_upload_dir",
+        "get_upload_url",
+        "selected_files",
+        "upload",
+    ],
+}
+
+COMPONENTS_BASE_MAPPING: dict = {
+    "components.base.fragment": ["fragment", "Fragment"],
+    "components.base.script": ["script", "Script"],
+}
+
+RADIX_MAPPING: dict = {
+    **RADIX_THEMES_MAPPING,
+    **RADIX_THEMES_COMPONENTS_MAPPING,
+    **RADIX_THEMES_TYPOGRAPHY_MAPPING,
+    **RADIX_THEMES_LAYOUT_MAPPING,
+    **RADIX_PRIMITIVES_MAPPING,
+}
+
+_MAPPING: dict = {
+    "experimental": ["_x"],
+    "admin": ["AdminDash"],
+    "app": ["App", "UploadFile"],
+    "base": ["Base"],
+    "components.component": ["Component", "NoSSRComponent", "memo"],
+    "components.el.elements.media": ["image"],
+    "components.lucide": ["icon"],
+    **COMPONENTS_BASE_MAPPING,
+    "components.suneditor": [
+        "editor",
+        "EditorButtonList",
+        "EditorOptions",
+    ],
+    "components": ["el", "chakra", "radix", "lucide", "recharts", "next"],
+    "components.markdown": ["markdown"],
+    **RADIX_MAPPING,
+    "components.plotly": ["plotly"],
+    "components.react_player": ["audio", "video"],
+    **COMPONENTS_CORE_MAPPING,
+    "components.datadisplay.code": [
+        "code_block",
+    ],
+    "components.datadisplay.dataeditor": [
+        "data_editor",
+        "data_editor_theme",
+    ],
+    "components.datadisplay.logo": ["logo"],
+    "components.gridjs": ["data_table"],
+    "components.moment": ["MomentDelta", "moment"],
+    "config": ["Config", "DBConfig"],
+    "constants": ["Env"],
+    "event": [
+        "EventChain",
+        "EventHandler",
+        "background",
+        "call_script",
+        "clear_local_storage",
+        "console_log",
+        "download",
+        "prevent_default",
+        "redirect",
+        "remove_cookie",
+        "remove_local_storage",
+        "set_clipboard",
+        "set_focus",
+        "scroll_to",
+        "set_value",
+        "stop_propagation",
+        "upload_files",
+        "window_alert",
+    ],
+    "middleware": ["middleware", "Middleware"],
+    "model": ["session", "Model"],
+    "state": [
+        "var",
+        "Cookie",
+        "LocalStorage",
+        "ComponentState",
+        "State",
+    ],
+    "style": ["Style", "toggle_color_mode"],
+    "utils.imports": ["ImportVar"],
+    "utils.serializers": ["serializer"],
+    "vars": ["cached_var", "Var"],
+}
+
+_SUBMODULES: set[str] = {
+    "components",
+    "event",
+    "app",
+    "style",
+    "admin",
+    "base",
+    "model",
+    "testing",
+    "utils",
+    "vars",
+    "config",
+    "compiler",
+}
+_SUBMOD_ATTRS: dict = _MAPPING
+__getattr__, __dir__, __all__ = lazy_loader.attach(
+    __name__,
+    submodules=_SUBMODULES,
+    submod_attrs=_SUBMOD_ATTRS,
+)

reflex-0.5.3/reflex/__init__.pyi

@@ -0,0 +1,196 @@
+"""Stub file for reflex/__init__.py"""
+# ------------------- DO NOT EDIT ----------------------
+# This file was generated by `reflex/utils/pyi_generator.py`!
+# ------------------------------------------------------
+
+from . import admin as admin
+from . import app as app
+from . import base as base
+from . import compiler as compiler
+from . import components as components
+from . import config as config
+from . import event as event
+from . import model as model
+from . import style as style
+from . import testing as testing
+from . import utils as utils
+from . import vars as vars
+
+from .experimental import _x as _x
+from .admin import AdminDash as AdminDash
+from .app import App as App
+from .app import UploadFile as UploadFile
+from .base import Base as Base
+from .components.component import Component as Component
+from .components.component import NoSSRComponent as NoSSRComponent
+from .components.component import memo as memo
+from .components.el.elements.media import image as image
+from .components.lucide import icon as icon
+from .components.base.fragment import fragment as fragment
+from .components.base.fragment import Fragment as Fragment
+from .components.base.script import script as script
+from .components.base.script import Script as Script
+from .components.suneditor import editor as editor
+from .components.suneditor import EditorButtonList as EditorButtonList
+from .components.suneditor import EditorOptions as EditorOptions
+from .components import el as el
+from .components import chakra as chakra
+from .components import radix as radix
+from .components import lucide as lucide
+from .components import recharts as recharts
+from .components import next as next
+from .components.markdown import markdown as markdown
+from .components.radix.themes.color_mode import color_mode as color_mode
+from .components.radix.themes.base import theme as theme
+from .components.radix.themes.base import theme_panel as theme_panel
+from .components.radix.themes.components.alert_dialog import (
+    alert_dialog as alert_dialog,
+)
+from .components.radix.themes.components.aspect_ratio import (
+    aspect_ratio as aspect_ratio,
+)
+from .components.radix.themes.components.avatar import avatar as avatar
+from .components.radix.themes.components.badge import badge as badge
+from .components.radix.themes.components.button import button as button
+from .components.radix.themes.components.callout import callout as callout
+from .components.radix.themes.components.card import card as card
+from .components.radix.themes.components.checkbox import checkbox as checkbox
+from .components.radix.themes.components.context_menu import (
+    context_menu as context_menu,
+)
+from .components.radix.themes.components.data_list import data_list as data_list
+from .components.radix.themes.components.dialog import dialog as dialog
+from .components.radix.themes.components.hover_card import hover_card as hover_card
+from .components.radix.themes.components.icon_button import icon_button as icon_button
+from .components.radix.themes.components.text_field import input as input
+from .components.radix.themes.components.inset import inset as inset
+from .components.radix.themes.components.popover import popover as popover
+from .components.radix.themes.components.scroll_area import scroll_area as scroll_area
+from .components.radix.themes.components.select import select as select
+from .components.radix.themes.components.skeleton import skeleton as skeleton
+from .components.radix.themes.components.slider import slider as slider
+from .components.radix.themes.components.spinner import spinner as spinner
+from .components.radix.themes.components.switch import switch as switch
+from .components.radix.themes.components.table import table as table
+from .components.radix.themes.components.tabs import tabs as tabs
+from .components.radix.themes.components.text_area import text_area as text_area
+from .components.radix.themes.components.tooltip import tooltip as tooltip
+from .components.radix.themes.components.segmented_control import (
+    segmented_control as segmented_control,
+)
+from .components.radix.themes.components.radio_cards import radio_cards as radio_cards
+from .components.radix.themes.components.checkbox_cards import (
+    checkbox_cards as checkbox_cards,
+)
+from .components.radix.themes.components.checkbox_group import (
+    checkbox_group as checkbox_group,
+)
+from .components.radix.themes.components.text_field import text_field as text_field
+from .components.radix.themes.components.radio_group import radio as radio
+from .components.radix.themes.components.radio_group import radio_group as radio_group
+from .components.radix.themes.components.dropdown_menu import menu as menu
+from .components.radix.themes.components.dropdown_menu import (
+    dropdown_menu as dropdown_menu,
+)
+from .components.radix.themes.components.separator import divider as divider
+from .components.radix.themes.components.separator import separator as separator
+from .components.radix.themes.typography.blockquote import blockquote as blockquote
+from .components.radix.themes.typography.code import code as code
+from .components.radix.themes.typography.heading import heading as heading
+from .components.radix.themes.typography.link import link as link
+from .components.radix.themes.typography.text import text as text
+from .components.radix.themes.layout.box import box as box
+from .components.radix.themes.layout.center import center as center
+from .components.radix.themes.layout.container import container as container
+from .components.radix.themes.layout.flex import flex as flex
+from .components.radix.themes.layout.grid import grid as grid
+from .components.radix.themes.layout.section import section as section
+from .components.radix.themes.layout.spacer import spacer as spacer
+from .components.radix.themes.layout.stack import stack as stack
+from .components.radix.themes.layout.stack import hstack as hstack
+from .components.radix.themes.layout.stack import vstack as vstack
+from .components.radix.themes.layout.list import list_ns as list
+from .components.radix.themes.layout.list import list_item as list_item
+from .components.radix.themes.layout.list import ordered_list as ordered_list
+from .components.radix.themes.layout.list import unordered_list as unordered_list
+from .components.radix.primitives.accordion import accordion as accordion
+from .components.radix.primitives.drawer import drawer as drawer
+from .components.radix.primitives.form import form as form
+from .components.radix.primitives.progress import progress as progress
+from .components.plotly import plotly as plotly
+from .components.react_player import audio as audio
+from .components.react_player import video as video
+from .components.core.banner import connection_banner as connection_banner
+from .components.core.banner import connection_modal as connection_modal
+from .components.core.cond import cond as cond
+from .components.core.cond import color_mode_cond as color_mode_cond
+from .components.core.foreach import foreach as foreach
+from .components.core.debounce import debounce_input as debounce_input
+from .components.core.html import html as html
+from .components.core.match import match as match
+from .components.core.colors import color as color
+from .components.core.responsive import desktop_only as desktop_only
+from .components.core.responsive import mobile_and_tablet as mobile_and_tablet
+from .components.core.responsive import mobile_only as mobile_only
+from .components.core.responsive import tablet_and_desktop as tablet_and_desktop
+from .components.core.responsive import tablet_only as tablet_only
+from .components.core.upload import cancel_upload as cancel_upload
+from .components.core.upload import clear_selected_files as clear_selected_files
+from .components.core.upload import get_upload_dir as get_upload_dir
+from .components.core.upload import get_upload_url as get_upload_url
+from .components.core.upload import selected_files as selected_files
+from .components.core.upload import upload as upload
+from .components.datadisplay.code import code_block as code_block
+from .components.datadisplay.dataeditor import data_editor as data_editor
+from .components.datadisplay.dataeditor import data_editor_theme as data_editor_theme
+from .components.datadisplay.logo import logo as logo
+from .components.gridjs import data_table as data_table
+from .components.moment import MomentDelta as MomentDelta
+from .components.moment import moment as moment
+from .config import Config as Config
+from .config import DBConfig as DBConfig
+from .constants import Env as Env
+from .event import EventChain as EventChain
+from .event import EventHandler as EventHandler
+from .event import background as background
+from .event import call_script as call_script
+from .event import clear_local_storage as clear_local_storage
+from .event import console_log as console_log
+from .event import download as download
+from .event import prevent_default as prevent_default
+from .event import redirect as redirect
+from .event import remove_cookie as remove_cookie
+from .event import remove_local_storage as remove_local_storage
+from .event import set_clipboard as set_clipboard
+from .event import set_focus as set_focus
+from .event import scroll_to as scroll_to
+from .event import set_value as set_value
+from .event import stop_propagation as stop_propagation
+from .event import upload_files as upload_files
+from .event import window_alert as window_alert
+from .middleware import middleware as middleware
+from .middleware import Middleware as Middleware
+from .model import session as session
+from .model import Model as Model
+from .state import var as var
+from .state import Cookie as Cookie
+from .state import LocalStorage as LocalStorage
+from .state import ComponentState as ComponentState
+from .state import State as State
+from .style import Style as Style
+from .style import toggle_color_mode as toggle_color_mode
+from .utils.imports import ImportVar as ImportVar
+from .utils.serializers import serializer as serializer
+from .vars import cached_var as cached_var
+from .vars import Var as Var
+from reflex.utils import lazy_loader
+from .page import page as page
+
+RADIX_THEMES_MAPPING: dict
+RADIX_THEMES_COMPONENTS_MAPPING: dict
+RADIX_THEMES_LAYOUT_MAPPING: dict
+RADIX_THEMES_TYPOGRAPHY_MAPPING: dict
+RADIX_PRIMITIVES_MAPPING: dict
+COMPONENTS_CORE_MAPPING: dict
+COMPONENTS_BASE_MAPPING: dict
+RADIX_MAPPING: dict

{reflex-0.5.2a1 → reflex-0.5.3}/reflex/app.py

@@ -50,7 +50,7 @@ from reflex.components.component import (
     ComponentStyle,
     evaluate_style_namespaces,
 )
-from reflex.components.core import connection_pulser, connection_toaster
+from reflex.components.core.banner import connection_pulser, connection_toaster
 from reflex.components.core.client_side_routing import (
     Default404Page,
     wait_for_client_redirect,
@@ -1302,6 +1302,12 @@ class EventNamespace(AsyncNamespace):
     # The application object.
     app: App
 
+    # Keep a mapping between socket ID and client token.
+    token_to_sid: dict[str, str] = {}
+
+    # Keep a mapping between client token and socket ID.
+    sid_to_token: dict[str, str] = {}
+
     def __init__(self, namespace: str, app: App):
         """Initialize the event namespace.
 
@@ -1327,7 +1333,9 @@ class EventNamespace(AsyncNamespace):
         Args:
             sid: The Socket.IO session id.
         """
-        pass
+        disconnect_token = self.sid_to_token.pop(sid, None)
+        if disconnect_token:
+            self.token_to_sid.pop(disconnect_token, None)
 
     async def emit_update(self, update: StateUpdate, sid: str) -> None:
         """Emit an update to the client.
@@ -1351,6 +1359,9 @@ class EventNamespace(AsyncNamespace):
         # Get the event.
         event = Event.parse_raw(data)
 
+        self.token_to_sid[event.token] = sid
+        self.sid_to_token[sid] = event.token
+
         # Get the event environment.
         assert self.app.sio is not None
         environ = self.app.sio.get_environ(sid, self.namespace)

{reflex-0.5.2a1 → reflex-0.5.3}/reflex/compiler/compiler.py

@@ -169,7 +169,7 @@ def _compile_root_stylesheet(stylesheets: list[str]) -> str:
                 raise FileNotFoundError(
                     f"The stylesheet file {stylesheet_full_path} does not exist."
                 )
-            stylesheet = f"@/{stylesheet.strip('/')}"
+            stylesheet = f"../{constants.Dirs.PUBLIC}/{stylesheet.strip('/')}"
         sheets.append(stylesheet) if stylesheet not in sheets else None
     return templates.STYLE.render(stylesheets=sheets)
 

reflex-0.5.3/reflex/components/__init__.py

@@ -0,0 +1,35 @@
+"""Import all the components."""
+from __future__ import annotations
+
+from reflex.utils import lazy_loader
+
+_SUBMODULES: set[str] = {
+    "lucide",
+    "core",
+    "datadisplay",
+    "gridjs",
+    "markdown",
+    "moment",
+    "plotly",
+    "radix",
+    "react_player",
+    "sonner",
+    "suneditor",
+    "chakra",
+    "el",
+    "base",
+    "recharts",
+}
+
+_SUBMOD_ATTRS: dict[str, list[str]] = {
+    "component": [
+        "Component",
+        "NoSSRComponent",
+    ],
+    "next": ["NextLink", "next_link"],
+}
+__getattr__, __dir__, __all__ = lazy_loader.attach(
+    __name__,
+    submodules=_SUBMODULES,
+    submod_attrs=_SUBMOD_ATTRS,
+)

reflex-0.5.3/reflex/components/__init__.pyi

@@ -0,0 +1,26 @@
+"""Stub file for reflex/components/__init__.py"""
+# ------------------- DO NOT EDIT ----------------------
+# This file was generated by `reflex/utils/pyi_generator.py`!
+# ------------------------------------------------------
+
+from . import base as base
+from . import chakra as chakra
+from . import core as core
+from . import datadisplay as datadisplay
+from . import el as el
+from . import gridjs as gridjs
+from . import lucide as lucide
+from . import markdown as markdown
+from . import moment as moment
+from . import plotly as plotly
+from . import radix as radix
+from . import react_player as react_player
+from . import recharts as recharts
+from . import sonner as sonner
+from . import suneditor as suneditor
+
+from .component import Component as Component
+from .component import NoSSRComponent as NoSSRComponent
+from .next import NextLink as NextLink
+from .next import next_link as next_link
+from reflex.utils import lazy_loader