Radix 3.0 (#3159)

README.md

@@ -123,7 +123,7 @@ def index():
             rx.button("Generate Image", on_click=State.get_image, width="25em"),
             rx.cond(
                 State.processing,
-                rx.chakra.circular_progress(is_indeterminate=True),
+                rx.spinner(),
                 rx.cond(
                     State.complete,
                     rx.image(src=State.image_url, width="20em"),

integration/test_navigation.py

@@ -7,7 +7,7 @@ from selenium.webdriver.common.by import By
 
 from reflex.testing import AppHarness
 
-from .utils import poll_for_navigation
+from .utils import SessionStorage, poll_for_navigation
 
 
 def NavigationApp():
@@ -66,6 +66,10 @@ async def test_navigation_app(navigation_app: AppHarness):
     assert navigation_app.app_instance is not None, "app is not running"
     driver = navigation_app.frontend()
 
+    ss = SessionStorage(driver)
+    token = AppHarness._poll_for(lambda: ss.get("token") is not None)
+    assert token is not None
+
     internal_link = driver.find_element(By.ID, "internal")
 
     with poll_for_navigation(driver):

reflex/.templates/web/utils/state.js

@@ -691,8 +691,8 @@ export const getRefValue = (ref) => {
   if (ref.current.type == "checkbox") {
     return ref.current.checked; // chakra
   } else if (
-    ref.current.className?.includes("rt-CheckboxButton") ||
-    ref.current.className?.includes("rt-SwitchButton")
+    ref.current.className?.includes("rt-CheckboxRoot") ||
+    ref.current.className?.includes("rt-SwitchRoot")
   ) {
     return ref.current.ariaChecked == "true"; // radix
   } else if (ref.current.className?.includes("rt-SliderRoot")) {

reflex/__init__.py

@@ -81,6 +81,7 @@ _ALL_COMPONENTS = [
     "select",
     "slider",
     "spacer",
+    "spinner",
     "stack",
     "switch",
     "table",

reflex/__init__.pyi

@@ -69,6 +69,7 @@ from reflex.components import section as section
 from reflex.components import select as select
 from reflex.components import slider as slider
 from reflex.components import spacer as spacer
+from reflex.components import spinner as spinner
 from reflex.components import stack as stack
 from reflex.components import switch as switch
 from reflex.components import table as table

reflex/components/radix/primitives/form.py

@@ -6,7 +6,7 @@ from typing import Any, Dict, Literal
 
 from reflex.components.component import Component, ComponentNamespace
 from reflex.components.el.elements.forms import Form as HTMLForm
-from reflex.components.radix.themes.components.text_field import TextFieldInput
+from reflex.components.radix.themes.components.text_field import TextFieldRoot
 from reflex.constants.event import EventTriggers
 from reflex.vars import Var
 
@@ -108,9 +108,9 @@ class FormControl(FormComponent):
                 f"FormControl can only have at most one child, got {len(children)} children"
             )
         for child in children:
-            if not isinstance(child, TextFieldInput):
+            if not isinstance(child, TextFieldRoot):
                 raise TypeError(
-                    "Only Radix TextFieldInput is allowed as child of FormControl"
+                    "Only Radix TextFieldRoot is allowed as child of FormControl"
                 )
         return super().create(*children, **props)
 

reflex/components/radix/primitives/form.pyi

@@ -10,7 +10,7 @@ from reflex.style import Style
 from typing import Any, Dict, Literal
 from reflex.components.component import Component, ComponentNamespace
 from reflex.components.el.elements.forms import Form as HTMLForm
-from reflex.components.radix.themes.components.text_field import TextFieldInput
+from reflex.components.radix.themes.components.text_field import TextFieldRoot
 from reflex.constants.event import EventTriggers
 from reflex.vars import Var
 from .base import RadixPrimitiveComponentWithClassName

reflex/components/radix/themes/base.py

@@ -73,10 +73,17 @@ class CommonMarginProps(Component):
     ml: Var[LiteralSpacing]
 
 
+class RadixLoadingProp(Component):
+    """Base class for components that can be in a loading state."""
+
+    # If set, show an rx.spinner instead of the component children.
+    loading: Var[bool]
+
+
 class RadixThemesComponent(Component):
     """Base class for all @radix-ui/themes components."""
 
-    library = "@radix-ui/themes@^2.0.0"
+    library = "@radix-ui/themes@^3.0.0"
 
     # "Fake" prop color_scheme is used to avoid shadowing CSS prop "color".
     _rename_props: Dict[str, str] = {"colorScheme": "color"}

reflex/components/radix/themes/base.pyi

@@ -176,6 +176,84 @@ class CommonMarginProps(Component):
         """
         ...
 
+class RadixLoadingProp(Component):
+    @overload
+    @classmethod
+    def create(  # type: ignore
+        cls,
+        *children,
+        loading: 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_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
+    ) -> "RadixLoadingProp":
+        """Create the component.
+
+        Args:
+            *children: The children of the component.
+            loading: If set, show an rx.spinner instead of the component children.
+            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 props of the component.
+
+        Returns:
+            The component.
+        """
+        ...
+
 class RadixThemesComponent(Component):
     @overload
     @classmethod

reflex/components/radix/themes/color_mode.pyi

@@ -417,6 +417,7 @@ class ColorModeButton(Button):
         title: Optional[
             Union[Var[Union[str, int, bool]], Union[str, int, bool]]
         ] = None,
+        loading: Optional[Union[Var[bool], bool]] = None,
         style: Optional[Style] = None,
         key: Optional[Any] = None,
         id: Optional[Any] = None,
@@ -507,6 +508,7 @@ class ColorModeButton(Button):
             spell_check: Defines whether the element may be checked for spelling errors.
             tab_index: Defines the position of the current element in the tabbing order.
             title: Defines a tooltip for the element.
+            loading: If set, show an rx.spinner instead of the component children.
             style: The style of the component.
             key: A unique key for the component.
             id: The id for the component.

reflex/components/radix/themes/components/__init__.py

@@ -8,7 +8,10 @@ from .button import button as button
 from .callout import callout as callout
 from .card import card as card
 from .checkbox import checkbox as checkbox
+from .checkbox_cards import checkbox_cards as checkbox_cards
+from .checkbox_group import checkbox_group as checkbox_group
 from .context_menu import context_menu as context_menu
+from .data_list import data_list as data_list
 from .dialog import dialog as dialog
 from .dropdown_menu import dropdown_menu as dropdown_menu
 from .dropdown_menu import menu as menu
@@ -16,13 +19,18 @@ from .hover_card import hover_card as hover_card
 from .icon_button import icon_button as icon_button
 from .inset import inset as inset
 from .popover import popover as popover
+from .progress import progress as progress
+from .radio_cards import radio_cards as radio_cards
 from .radio_group import radio as radio
 from .radio_group import radio_group as radio_group
 from .scroll_area import scroll_area as scroll_area
+from .segmented_control import segmented_control as segmented_control
 from .select import select as select
 from .separator import divider as divider
 from .separator import separator as separator
+from .skeleton import skeleton as skeleton
 from .slider import slider as slider
+from .spinner import spinner as spinner
 from .switch import switch as switch
 from .table import table as table
 from .tabs import tabs as tabs
@@ -41,7 +49,10 @@ __all__ = [
     "callout",
     "card",
     "checkbox",
+    "checkbox_cards",
+    "checkbox_group",
     "context_menu",
+    "data_list",
     "dialog",
     "divider",
     "dropdown_menu",
@@ -51,12 +62,17 @@ __all__ = [
     "inset",
     "menu",
     "popover",
+    "progress",
     "radio",
+    "radio_cards",
     "radio_group",
     "scroll_area",
+    "segmented_control",
     "select",
     "separator",
+    "skeleton",
     "slider",
+    "spinner",
     "switch",
     "table",
     "tabs",

reflex/components/radix/themes/components/badge.py

@@ -1,4 +1,5 @@
 """Interactive components provided by @radix-ui/themes."""
+
 from typing import Literal
 
 from reflex import el
@@ -20,7 +21,7 @@ class Badge(el.Span, RadixThemesComponent):
     variant: Var[Literal["solid", "soft", "surface", "outline"]]
 
     # The size of the badge
-    size: Var[Literal["1", "2"]]
+    size: Var[Literal["1", "2", "3"]]
 
     # Color theme of the badge
     color_scheme: Var[LiteralAccentColor]

reflex/components/radix/themes/components/badge.pyi

@@ -24,7 +24,9 @@ class Badge(el.Span, RadixThemesComponent):
                 Literal["solid", "soft", "surface", "outline"],
             ]
         ] = None,
-        size: Optional[Union[Var[Literal["1", "2"]], Literal["1", "2"]]] = None,
+        size: Optional[
+            Union[Var[Literal["1", "2", "3"]], Literal["1", "2", "3"]]
+        ] = None,
         color_scheme: Optional[
             Union[
                 Var[

reflex/components/radix/themes/components/button.py

@@ -1,4 +1,5 @@
 """Interactive components provided by @radix-ui/themes."""
+
 from typing import Literal
 
 from reflex import el
@@ -8,13 +9,14 @@ from ..base import (
     LiteralAccentColor,
     LiteralRadius,
     LiteralVariant,
+    RadixLoadingProp,
     RadixThemesComponent,
 )
 
 LiteralButtonSize = Literal["1", "2", "3", "4"]
 
 
-class Button(el.Button, RadixThemesComponent):
+class Button(el.Button, RadixLoadingProp, RadixThemesComponent):
     """Trigger an action or event, such as submitting a form or displaying a dialog."""
 
     tag = "Button"

reflex/components/radix/themes/components/button.pyi

@@ -14,12 +14,13 @@ from ..base import (
     LiteralAccentColor,
     LiteralRadius,
     LiteralVariant,
+    RadixLoadingProp,
     RadixThemesComponent,
 )
 
 LiteralButtonSize = Literal["1", "2", "3", "4"]
 
-class Button(el.Button, RadixThemesComponent):
+class Button(el.Button, RadixLoadingProp, RadixThemesComponent):
     @overload
     @classmethod
     def create(  # type: ignore
@@ -169,6 +170,7 @@ class Button(el.Button, RadixThemesComponent):
         title: Optional[
             Union[Var[Union[str, int, bool]], Union[str, int, bool]]
         ] = None,
+        loading: Optional[Union[Var[bool], bool]] = None,
         style: Optional[Style] = None,
         key: Optional[Any] = None,
         id: Optional[Any] = None,
@@ -262,6 +264,7 @@ class Button(el.Button, RadixThemesComponent):
             spell_check: Defines whether the element may be checked for spelling errors.
             tab_index: Defines the position of the current element in the tabbing order.
             title: Defines a tooltip for the element.
+            loading: If set, show an rx.spinner instead of the component children.
             style: The style of the component.
             key: A unique key for the component.
             id: The id for the component.

reflex/components/radix/themes/components/checkbox_cards.py

@@ -0,0 +1,48 @@
+"""Components for the Radix CheckboxCards component."""
+
+from types import SimpleNamespace
+from typing import Literal, Union
+
+from reflex.vars import Var
+
+from ..base import LiteralAccentColor, RadixThemesComponent
+
+
+class CheckboxCardsRoot(RadixThemesComponent):
+    """Root element for a CheckboxCards component."""
+
+    tag = "CheckboxCards.Root"
+
+    # The size of the checkbox cards: "1" | "2" | "3"
+    size: Var[Literal["1", "2", "3"]]
+
+    # Variant of button: "classic" | "surface" | "soft"
+    variant: Var[Literal["classic", "surface"]]
+
+    # Override theme color for button
+    color_scheme: Var[LiteralAccentColor]
+
+    # Uses a higher contrast color for the component.
+    high_contrast: Var[bool]
+
+    # The number of columns:
+    columns: Var[Union[str, Literal["1", "2", "3", "4", "5", "6", "7", "8", "9"]]]
+
+    # The gap between the checkbox cards:
+    gap: Var[Union[str, Literal["1", "2", "3", "4", "5", "6", "7", "8", "9"]]]
+
+
+class CheckboxCardsItem(RadixThemesComponent):
+    """An item in the CheckboxCards component."""
+
+    tag = "CheckboxCards.Item"
+
+
+class CheckboxCards(SimpleNamespace):
+    """CheckboxCards components namespace."""
+
+    root = staticmethod(CheckboxCardsRoot.create)
+    item = staticmethod(CheckboxCardsItem.create)
+
+
+checkbox_cards = CheckboxCards()

reflex/components/radix/themes/components/checkbox_cards.pyi

@@ -0,0 +1,264 @@
+"""Stub file for reflex/components/radix/themes/components/checkbox_cards.py"""
+# ------------------- DO NOT EDIT ----------------------
+# This file was generated by `reflex/utils/pyi_generator.py`!
+# ------------------------------------------------------
+
+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 types import SimpleNamespace
+from typing import Literal, Union
+from reflex.vars import Var
+from ..base import LiteralAccentColor, RadixThemesComponent
+
+class CheckboxCardsRoot(RadixThemesComponent):
+    @overload
+    @classmethod
+    def create(  # type: ignore
+        cls,
+        *children,
+        size: Optional[
+            Union[Var[Literal["1", "2", "3"]], Literal["1", "2", "3"]]
+        ] = None,
+        variant: Optional[
+            Union[Var[Literal["classic", "surface"]], Literal["classic", "surface"]]
+        ] = None,
+        color_scheme: Optional[
+            Union[
+                Var[
+                    Literal[
+                        "tomato",
+                        "red",
+                        "ruby",
+                        "crimson",
+                        "pink",
+                        "plum",
+                        "purple",
+                        "violet",
+                        "iris",
+                        "indigo",
+                        "blue",
+                        "cyan",
+                        "teal",
+                        "jade",
+                        "green",
+                        "grass",
+                        "brown",
+                        "orange",
+                        "sky",
+                        "mint",
+                        "lime",
+                        "yellow",
+                        "amber",
+                        "gold",
+                        "bronze",
+                        "gray",
+                    ]
+                ],
+                Literal[
+                    "tomato",
+                    "red",
+                    "ruby",
+                    "crimson",
+                    "pink",
+                    "plum",
+                    "purple",
+                    "violet",
+                    "iris",
+                    "indigo",
+                    "blue",
+                    "cyan",
+                    "teal",
+                    "jade",
+                    "green",
+                    "grass",
+                    "brown",
+                    "orange",
+                    "sky",
+                    "mint",
+                    "lime",
+                    "yellow",
+                    "amber",
+                    "gold",
+                    "bronze",
+                    "gray",
+                ],
+            ]
+        ] = None,
+        high_contrast: Optional[Union[Var[bool], bool]] = None,
+        columns: Optional[
+            Union[
+                Var[Union[str, Literal["1", "2", "3", "4", "5", "6", "7", "8", "9"]]],
+                Union[str, Literal["1", "2", "3", "4", "5", "6", "7", "8", "9"]],
+            ]
+        ] = None,
+        gap: Optional[
+            Union[
+                Var[Union[str, Literal["1", "2", "3", "4", "5", "6", "7", "8", "9"]]],
+                Union[str, Literal["1", "2", "3", "4", "5", "6", "7", "8", "9"]],
+            ]
+        ] = 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_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
+    ) -> "CheckboxCardsRoot":
+        """Create a new component instance.
+
+        Will prepend "RadixThemes" to the component tag to avoid conflicts with
+        other UI libraries for common names, like Text and Button.
+
+        Args:
+            *children: Child components.
+            size: The size of the checkbox cards: "1" | "2" | "3"
+            variant: Variant of button: "classic" | "surface" | "soft"
+            color_scheme: Override theme color for button
+            high_contrast: Uses a higher contrast color for the component.
+            columns: The number of columns:
+            gap: The gap between the checkbox cards:
+            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: Component properties.
+
+        Returns:
+            A new component instance.
+        """
+        ...
+
+class CheckboxCardsItem(RadixThemesComponent):
+    @overload
+    @classmethod
+    def create(  # type: ignore
+        cls,
+        *children,
+        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_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
+    ) -> "CheckboxCardsItem":
+        """Create a new component instance.
+
+        Will prepend "RadixThemes" to the component tag to avoid conflicts with
+        other UI libraries for common names, like Text and Button.
+
+        Args:
+            *children: Child components.
+            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: Component properties.
+
+        Returns:
+            A new component instance.
+        """
+        ...
+
+class CheckboxCards(SimpleNamespace):
+    root = staticmethod(CheckboxCardsRoot.create)
+    item = staticmethod(CheckboxCardsItem.create)
+
+checkbox_cards = CheckboxCards()

reflex/components/radix/themes/components/checkbox_group.py

@@ -0,0 +1,42 @@
+"""Components for the CheckboxGroup component of Radix Themes."""
+
+from types import SimpleNamespace
+from typing import Literal
+
+from reflex.vars import Var
+
+from ..base import LiteralAccentColor, RadixThemesComponent
+
+
+class CheckboxGroupRoot(RadixThemesComponent):
+    """Root element for a CheckboxGroup component."""
+
+    tag = "CheckboxGroup"
+
+    #
+    size: Var[Literal["1", "2", "3"]]
+
+    # Variant of button: "classic" | "surface" | "soft"
+    variant: Var[Literal["classic", "surface", "soft"]]
+
+    # Override theme color for button
+    color_scheme: Var[LiteralAccentColor]
+
+    # Uses a higher contrast color for the component.
+    high_contrast: Var[bool]
+
+
+class CheckboxGroupItem(RadixThemesComponent):
+    """An item in the CheckboxGroup component."""
+
+    tag = "CheckboxGroup.Item"
+
+
+class CheckboxGroup(SimpleNamespace):
+    """CheckboxGroup components namespace."""
+
+    root = staticmethod(CheckboxGroupRoot.create)
+    item = staticmethod(CheckboxGroupItem.create)
+
+
+checkbox_group = CheckboxGroup()

reflex/components/radix/themes/components/checkbox_group.pyi

@@ -0,0 +1,253 @@
+"""Stub file for reflex/components/radix/themes/components/checkbox_group.py"""
+# ------------------- DO NOT EDIT ----------------------
+# This file was generated by `reflex/utils/pyi_generator.py`!
+# ------------------------------------------------------
+
+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 types import SimpleNamespace
+from typing import Literal
+from reflex.vars import Var
+from ..base import LiteralAccentColor, RadixThemesComponent
+
+class CheckboxGroupRoot(RadixThemesComponent):
+    @overload
+    @classmethod
+    def create(  # type: ignore
+        cls,
+        *children,
+        size: Optional[
+            Union[Var[Literal["1", "2", "3"]], Literal["1", "2", "3"]]
+        ] = None,
+        variant: Optional[
+            Union[
+                Var[Literal["classic", "surface", "soft"]],
+                Literal["classic", "surface", "soft"],
+            ]
+        ] = None,
+        color_scheme: Optional[
+            Union[
+                Var[
+                    Literal[
+                        "tomato",
+                        "red",
+                        "ruby",
+                        "crimson",
+                        "pink",
+                        "plum",
+                        "purple",
+                        "violet",
+                        "iris",
+                        "indigo",
+                        "blue",
+                        "cyan",
+                        "teal",
+                        "jade",
+                        "green",
+                        "grass",
+                        "brown",
+                        "orange",
+                        "sky",
+                        "mint",
+                        "lime",
+                        "yellow",
+                        "amber",
+                        "gold",
+                        "bronze",
+                        "gray",
+                    ]
+                ],
+                Literal[
+                    "tomato",
+                    "red",
+                    "ruby",
+                    "crimson",
+                    "pink",
+                    "plum",
+                    "purple",
+                    "violet",
+                    "iris",
+                    "indigo",
+                    "blue",
+                    "cyan",
+                    "teal",
+                    "jade",
+                    "green",
+                    "grass",
+                    "brown",
+                    "orange",
+                    "sky",
+                    "mint",
+                    "lime",
+                    "yellow",
+                    "amber",
+                    "gold",
+                    "bronze",
+                    "gray",
+                ],
+            ]
+        ] = None,
+        high_contrast: 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_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
+    ) -> "CheckboxGroupRoot":
+        """Create a new component instance.
+
+        Will prepend "RadixThemes" to the component tag to avoid conflicts with
+        other UI libraries for common names, like Text and Button.
+
+        Args:
+            *children: Child components.
+            size:
+            variant: Variant of button: "classic" | "surface" | "soft"
+            color_scheme: Override theme color for button
+            high_contrast: Uses a higher contrast color for the component.
+            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: Component properties.
+
+        Returns:
+            A new component instance.
+        """
+        ...
+
+class CheckboxGroupItem(RadixThemesComponent):
+    @overload
+    @classmethod
+    def create(  # type: ignore
+        cls,
+        *children,
+        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_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
+    ) -> "CheckboxGroupItem":
+        """Create a new component instance.
+
+        Will prepend "RadixThemes" to the component tag to avoid conflicts with
+        other UI libraries for common names, like Text and Button.
+
+        Args:
+            *children: Child components.
+            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: Component properties.
+
+        Returns:
+            A new component instance.
+        """
+        ...
+
+class CheckboxGroup(SimpleNamespace):
+    root = staticmethod(CheckboxGroupRoot.create)
+    item = staticmethod(CheckboxGroupItem.create)
+
+checkbox_group = CheckboxGroup()

reflex/components/radix/themes/components/data_list.py

@@ -0,0 +1,63 @@
+"""Components for the DataList component of Radix Themes."""
+
+from types import SimpleNamespace
+from typing import Literal
+
+from reflex.vars import Var
+
+from ..base import LiteralAccentColor, RadixThemesComponent
+
+
+class DataListRoot(RadixThemesComponent):
+    """Root element for a DataList component."""
+
+    tag = "DataList.Root"
+
+    # The orientation of the data list item: "horizontal" | "vertical"
+    orientation: Var[Literal["horizontal", "vertical"]]
+
+    # The size of the data list item: "1" | "2" | "3"
+    size: Var[Literal["1", "2", "3"]]
+
+    # Trims the leading whitespace from the start or end of the text.
+    trim: Var[Literal["normal", "start", "end", "both"]]
+
+
+class DataListItem(RadixThemesComponent):
+    """An item in the DataList component."""
+
+    tag = "DataList.Item"
+
+    align: Var[Literal["start", "center", "end", "baseline", "stretch"]]
+
+
+class DataListLabel(RadixThemesComponent):
+    """A label in the DataList component."""
+
+    tag = "DataList.Label"
+
+    width: Var[str]
+
+    min_width: Var[str]
+
+    max_width: Var[str]
+
+    color_scheme: Var[LiteralAccentColor]
+
+
+class DataListValue(RadixThemesComponent):
+    """A value in the DataList component."""
+
+    tag = "DataList.Value"
+
+
+class DataList(SimpleNamespace):
+    """DataList components namespace."""
+
+    root = staticmethod(DataListRoot.create)
+    item = staticmethod(DataListItem.create)
+    label = staticmethod(DataListLabel.create)
+    value = staticmethod(DataListValue.create)
+
+
+data_list = DataList()

reflex/components/radix/themes/components/data_list.pyi

@@ -0,0 +1,426 @@
+"""Stub file for reflex/components/radix/themes/components/data_list.py"""
+# ------------------- DO NOT EDIT ----------------------
+# This file was generated by `reflex/utils/pyi_generator.py`!
+# ------------------------------------------------------
+
+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 types import SimpleNamespace
+from typing import Literal
+from reflex.vars import Var
+from ..base import LiteralAccentColor, RadixThemesComponent
+
+class DataListRoot(RadixThemesComponent):
+    @overload
+    @classmethod
+    def create(  # type: ignore
+        cls,
+        *children,
+        orientation: Optional[
+            Union[
+                Var[Literal["horizontal", "vertical"]],
+                Literal["horizontal", "vertical"],
+            ]
+        ] = None,
+        size: Optional[
+            Union[Var[Literal["1", "2", "3"]], Literal["1", "2", "3"]]
+        ] = None,
+        trim: Optional[
+            Union[
+                Var[Literal["normal", "start", "end", "both"]],
+                Literal["normal", "start", "end", "both"],
+            ]
+        ] = 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_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
+    ) -> "DataListRoot":
+        """Create a new component instance.
+
+        Will prepend "RadixThemes" to the component tag to avoid conflicts with
+        other UI libraries for common names, like Text and Button.
+
+        Args:
+            *children: Child components.
+            orientation: The orientation of the data list item: "horizontal" | "vertical"
+            size: The size of the data list item: "1" | "2" | "3"
+            trim: Trims the leading whitespace from the start or end of the text.
+            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: Component properties.
+
+        Returns:
+            A new component instance.
+        """
+        ...
+
+class DataListItem(RadixThemesComponent):
+    @overload
+    @classmethod
+    def create(  # type: ignore
+        cls,
+        *children,
+        align: Optional[
+            Union[
+                Var[Literal["start", "center", "end", "baseline", "stretch"]],
+                Literal["start", "center", "end", "baseline", "stretch"],
+            ]
+        ] = 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_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
+    ) -> "DataListItem":
+        """Create a new component instance.
+
+        Will prepend "RadixThemes" to the component tag to avoid conflicts with
+        other UI libraries for common names, like Text and Button.
+
+        Args:
+            *children: Child components.
+            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: Component properties.
+
+        Returns:
+            A new component instance.
+        """
+        ...
+
+class DataListLabel(RadixThemesComponent):
+    @overload
+    @classmethod
+    def create(  # type: ignore
+        cls,
+        *children,
+        width: Optional[Union[Var[str], str]] = None,
+        min_width: Optional[Union[Var[str], str]] = None,
+        max_width: Optional[Union[Var[str], str]] = None,
+        color_scheme: Optional[
+            Union[
+                Var[
+                    Literal[
+                        "tomato",
+                        "red",
+                        "ruby",
+                        "crimson",
+                        "pink",
+                        "plum",
+                        "purple",
+                        "violet",
+                        "iris",
+                        "indigo",
+                        "blue",
+                        "cyan",
+                        "teal",
+                        "jade",
+                        "green",
+                        "grass",
+                        "brown",
+                        "orange",
+                        "sky",
+                        "mint",
+                        "lime",
+                        "yellow",
+                        "amber",
+                        "gold",
+                        "bronze",
+                        "gray",
+                    ]
+                ],
+                Literal[
+                    "tomato",
+                    "red",
+                    "ruby",
+                    "crimson",
+                    "pink",
+                    "plum",
+                    "purple",
+                    "violet",
+                    "iris",
+                    "indigo",
+                    "blue",
+                    "cyan",
+                    "teal",
+                    "jade",
+                    "green",
+                    "grass",
+                    "brown",
+                    "orange",
+                    "sky",
+                    "mint",
+                    "lime",
+                    "yellow",
+                    "amber",
+                    "gold",
+                    "bronze",
+                    "gray",
+                ],
+            ]
+        ] = 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_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
+    ) -> "DataListLabel":
+        """Create a new component instance.
+
+        Will prepend "RadixThemes" to the component tag to avoid conflicts with
+        other UI libraries for common names, like Text and Button.
+
+        Args:
+            *children: Child components.
+            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: Component properties.
+
+        Returns:
+            A new component instance.
+        """
+        ...
+
+class DataListValue(RadixThemesComponent):
+    @overload
+    @classmethod
+    def create(  # type: ignore
+        cls,
+        *children,
+        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_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
+    ) -> "DataListValue":
+        """Create a new component instance.
+
+        Will prepend "RadixThemes" to the component tag to avoid conflicts with
+        other UI libraries for common names, like Text and Button.
+
+        Args:
+            *children: Child components.
+            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: Component properties.
+
+        Returns:
+            A new component instance.
+        """
+        ...
+
+class DataList(SimpleNamespace):
+    root = staticmethod(DataListRoot.create)
+    item = staticmethod(DataListItem.create)
+    label = staticmethod(DataListLabel.create)
+    value = staticmethod(DataListValue.create)
+
+data_list = DataList()

reflex/components/radix/themes/components/icon_button.py

@@ -13,13 +13,14 @@ from ..base import (
     LiteralAccentColor,
     LiteralRadius,
     LiteralVariant,
+    RadixLoadingProp,
     RadixThemesComponent,
 )
 
 LiteralButtonSize = Literal["1", "2", "3", "4"]
 
 
-class IconButton(el.Button, RadixThemesComponent):
+class IconButton(el.Button, RadixLoadingProp, RadixThemesComponent):
     """A button designed specifically for usage with a single icon."""
 
     tag = "IconButton"

reflex/components/radix/themes/components/icon_button.pyi

@@ -18,12 +18,13 @@ from ..base import (
     LiteralAccentColor,
     LiteralRadius,
     LiteralVariant,
+    RadixLoadingProp,
     RadixThemesComponent,
 )
 
 LiteralButtonSize = Literal["1", "2", "3", "4"]
 
-class IconButton(el.Button, RadixThemesComponent):
+class IconButton(el.Button, RadixLoadingProp, RadixThemesComponent):
     @overload
     @classmethod
     def create(  # type: ignore
@@ -173,6 +174,7 @@ class IconButton(el.Button, RadixThemesComponent):
         title: Optional[
             Union[Var[Union[str, int, bool]], Union[str, int, bool]]
         ] = None,
+        loading: Optional[Union[Var[bool], bool]] = None,
         style: Optional[Style] = None,
         key: Optional[Any] = None,
         id: Optional[Any] = None,
@@ -263,6 +265,7 @@ class IconButton(el.Button, RadixThemesComponent):
             spell_check: Defines whether the element may be checked for spelling errors.
             tab_index: Defines the position of the current element in the tabbing order.
             title: Defines a tooltip for the element.
+            loading: If set, show an rx.spinner instead of the component children.
             style: The style of the component.
             key: A unique key for the component.
             id: The id for the component.

reflex/components/radix/themes/components/progress.py

@@ -0,0 +1,37 @@
+"""Progress from Radix Themes."""
+
+from typing import Literal
+
+from reflex.vars import Var
+
+from ..base import LiteralAccentColor, RadixThemesComponent
+
+
+class Progress(RadixThemesComponent):
+    """A progress bar component."""
+
+    tag = "Progress"
+
+    # The value of the progress bar: "0" to "100"
+    value: Var[int]
+
+    # The size of the progress bar: "1" | "2" | "3"
+    size: Var[Literal["1", "2", "3"]]
+
+    # The variant of the progress bar: "classic" | "surface" | "soft"
+    variant: Var[Literal["classic", "surface", "soft"]]
+
+    # The color theme of the progress bar
+    color_scheme: Var[LiteralAccentColor]
+
+    # Whether to render the progress bar with higher contrast color against background
+    high_contrast: Var[bool]
+
+    # Override theme radius for progress bar: "none" | "small" | "medium" | "large" | "full"
+    radius: Var[Literal["none", "small", "medium", "large", "full"]]
+
+    # The duration of the progress bar animation. Once the duration times out, the progress bar will start an indeterminate animation.
+    duration: Var[str]
+
+
+progress = Progress.create

reflex/components/radix/themes/components/progress.pyi

@@ -0,0 +1,180 @@
+"""Stub file for reflex/components/radix/themes/components/progress.py"""
+# ------------------- DO NOT EDIT ----------------------
+# This file was generated by `reflex/utils/pyi_generator.py`!
+# ------------------------------------------------------
+
+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 typing import Literal
+from reflex.vars import Var
+from ..base import LiteralAccentColor, RadixThemesComponent
+
+class Progress(RadixThemesComponent):
+    @overload
+    @classmethod
+    def create(  # type: ignore
+        cls,
+        *children,
+        value: Optional[Union[Var[int], int]] = None,
+        size: Optional[
+            Union[Var[Literal["1", "2", "3"]], Literal["1", "2", "3"]]
+        ] = None,
+        variant: Optional[
+            Union[
+                Var[Literal["classic", "surface", "soft"]],
+                Literal["classic", "surface", "soft"],
+            ]
+        ] = None,
+        color_scheme: Optional[
+            Union[
+                Var[
+                    Literal[
+                        "tomato",
+                        "red",
+                        "ruby",
+                        "crimson",
+                        "pink",
+                        "plum",
+                        "purple",
+                        "violet",
+                        "iris",
+                        "indigo",
+                        "blue",
+                        "cyan",
+                        "teal",
+                        "jade",
+                        "green",
+                        "grass",
+                        "brown",
+                        "orange",
+                        "sky",
+                        "mint",
+                        "lime",
+                        "yellow",
+                        "amber",
+                        "gold",
+                        "bronze",
+                        "gray",
+                    ]
+                ],
+                Literal[
+                    "tomato",
+                    "red",
+                    "ruby",
+                    "crimson",
+                    "pink",
+                    "plum",
+                    "purple",
+                    "violet",
+                    "iris",
+                    "indigo",
+                    "blue",
+                    "cyan",
+                    "teal",
+                    "jade",
+                    "green",
+                    "grass",
+                    "brown",
+                    "orange",
+                    "sky",
+                    "mint",
+                    "lime",
+                    "yellow",
+                    "amber",
+                    "gold",
+                    "bronze",
+                    "gray",
+                ],
+            ]
+        ] = None,
+        high_contrast: Optional[Union[Var[bool], bool]] = None,
+        radius: Optional[
+            Union[
+                Var[Literal["none", "small", "medium", "large", "full"]],
+                Literal["none", "small", "medium", "large", "full"],
+            ]
+        ] = None,
+        duration: Optional[Union[Var[str], str]] = 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_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
+    ) -> "Progress":
+        """Create a new component instance.
+
+        Will prepend "RadixThemes" to the component tag to avoid conflicts with
+        other UI libraries for common names, like Text and Button.
+
+        Args:
+            *children: Child components.
+            value: The value of the progress bar: "0" to "100"
+            size: The size of the progress bar: "1" | "2" | "3"
+            variant: The variant of the progress bar: "classic" | "surface" | "soft"
+            color_scheme: The color theme of the progress bar
+            high_contrast: Whether to render the progress bar with higher contrast color against background
+            radius: Override theme radius for progress bar: "none" | "small" | "medium" | "large" | "full"
+            duration: The duration of the progress bar animation. Once the duration times out, the progress bar will start an indeterminate animation.
+            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: Component properties.
+
+        Returns:
+            A new component instance.
+        """
+        ...
+
+progress = Progress.create

reflex/components/radix/themes/components/radio.py

@@ -0,0 +1,31 @@
+"""Radio component from Radix Themes."""
+
+from typing import Literal
+
+from reflex.vars import Var
+
+from ..base import LiteralAccentColor, RadixThemesComponent
+
+
+class Radio(RadixThemesComponent):
+    """A radio component."""
+
+    tag = "Radio"
+
+    # The size of the radio: "1" | "2" | "3"
+    size: Var[Literal["1", "2", "3"]]
+
+    # Variant of button: "classic" | "surface" | "soft"
+    variant: Var[Literal["classic", "surface", "soft"]]
+
+    # Override theme color for button
+    color_scheme: Var[LiteralAccentColor]
+
+    # Uses a higher contrast color for the component.
+    high_contrast: Var[bool]
+
+    # Change the default rendered element for the one passed as a child, merging their props and behavior.
+    as_child = Var[bool]
+
+
+radio = Radio.create

reflex/components/radix/themes/components/radio.pyi

@@ -0,0 +1,169 @@
+"""Stub file for reflex/components/radix/themes/components/radio.py"""
+# ------------------- DO NOT EDIT ----------------------
+# This file was generated by `reflex/utils/pyi_generator.py`!
+# ------------------------------------------------------
+
+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 typing import Literal
+from reflex.vars import Var
+from ..base import LiteralAccentColor, RadixThemesComponent
+
+class Radio(RadixThemesComponent):
+    @overload
+    @classmethod
+    def create(  # type: ignore
+        cls,
+        *children,
+        size: Optional[
+            Union[Var[Literal["1", "2", "3"]], Literal["1", "2", "3"]]
+        ] = None,
+        variant: Optional[
+            Union[
+                Var[Literal["classic", "surface", "soft"]],
+                Literal["classic", "surface", "soft"],
+            ]
+        ] = None,
+        color_scheme: Optional[
+            Union[
+                Var[
+                    Literal[
+                        "tomato",
+                        "red",
+                        "ruby",
+                        "crimson",
+                        "pink",
+                        "plum",
+                        "purple",
+                        "violet",
+                        "iris",
+                        "indigo",
+                        "blue",
+                        "cyan",
+                        "teal",
+                        "jade",
+                        "green",
+                        "grass",
+                        "brown",
+                        "orange",
+                        "sky",
+                        "mint",
+                        "lime",
+                        "yellow",
+                        "amber",
+                        "gold",
+                        "bronze",
+                        "gray",
+                    ]
+                ],
+                Literal[
+                    "tomato",
+                    "red",
+                    "ruby",
+                    "crimson",
+                    "pink",
+                    "plum",
+                    "purple",
+                    "violet",
+                    "iris",
+                    "indigo",
+                    "blue",
+                    "cyan",
+                    "teal",
+                    "jade",
+                    "green",
+                    "grass",
+                    "brown",
+                    "orange",
+                    "sky",
+                    "mint",
+                    "lime",
+                    "yellow",
+                    "amber",
+                    "gold",
+                    "bronze",
+                    "gray",
+                ],
+            ]
+        ] = None,
+        high_contrast: 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_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
+    ) -> "Radio":
+        """Create a new component instance.
+
+        Will prepend "RadixThemes" to the component tag to avoid conflicts with
+        other UI libraries for common names, like Text and Button.
+
+        Args:
+            *children: Child components.
+            size: The size of the radio: "1" | "2" | "3"
+            variant: Variant of button: "classic" | "surface" | "soft"
+            color_scheme: Override theme color for button
+            high_contrast: Uses a higher contrast color for the component.
+            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: Component properties.
+
+        Returns:
+            A new component instance.
+        """
+        ...
+
+radio = Radio.create

reflex/components/radix/themes/components/radio_cards.py

@@ -0,0 +1,48 @@
+"""Radio component from Radix Themes."""
+
+from types import SimpleNamespace
+from typing import Literal, Union
+
+from reflex.vars import Var
+
+from ..base import LiteralAccentColor, RadixThemesComponent
+
+
+class RadioCardsRoot(RadixThemesComponent):
+    """Root element for RadioCards component."""
+
+    tag = "RadioCards.Root"
+
+    # The size of the checkbox cards: "1" | "2" | "3"
+    size: Var[Literal["1", "2", "3"]]
+
+    # Variant of button: "classic" | "surface" | "soft"
+    variant: Var[Literal["classic", "surface"]]
+
+    # Override theme color for button
+    color_scheme: Var[LiteralAccentColor]
+
+    # Uses a higher contrast color for the component.
+    high_contrast: Var[bool]
+
+    # The number of columns:
+    columns: Var[Union[str, Literal["1", "2", "3", "4", "5", "6", "7", "8", "9"]]]
+
+    # The gap between the checkbox cards:
+    gap: Var[Union[str, Literal["1", "2", "3", "4", "5", "6", "7", "8", "9"]]]
+
+
+class RadioCardsItem(RadixThemesComponent):
+    """Item element for RadioCards component."""
+
+    tag = "RadioCards.Item"
+
+
+class RadioCards(SimpleNamespace):
+    """RadioCards components namespace."""
+
+    root = staticmethod(RadioCardsRoot.create)
+    item = staticmethod(RadioCardsItem.create)
+
+
+radio_cards = RadioCards()

reflex/components/radix/themes/components/radio_cards.pyi

@@ -0,0 +1,264 @@
+"""Stub file for reflex/components/radix/themes/components/radio_cards.py"""
+# ------------------- DO NOT EDIT ----------------------
+# This file was generated by `reflex/utils/pyi_generator.py`!
+# ------------------------------------------------------
+
+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 types import SimpleNamespace
+from typing import Literal, Union
+from reflex.vars import Var
+from ..base import LiteralAccentColor, RadixThemesComponent
+
+class RadioCardsRoot(RadixThemesComponent):
+    @overload
+    @classmethod
+    def create(  # type: ignore
+        cls,
+        *children,
+        size: Optional[
+            Union[Var[Literal["1", "2", "3"]], Literal["1", "2", "3"]]
+        ] = None,
+        variant: Optional[
+            Union[Var[Literal["classic", "surface"]], Literal["classic", "surface"]]
+        ] = None,
+        color_scheme: Optional[
+            Union[
+                Var[
+                    Literal[
+                        "tomato",
+                        "red",
+                        "ruby",
+                        "crimson",
+                        "pink",
+                        "plum",
+                        "purple",
+                        "violet",
+                        "iris",
+                        "indigo",
+                        "blue",
+                        "cyan",
+                        "teal",
+                        "jade",
+                        "green",
+                        "grass",
+                        "brown",
+                        "orange",
+                        "sky",
+                        "mint",
+                        "lime",
+                        "yellow",
+                        "amber",
+                        "gold",
+                        "bronze",
+                        "gray",
+                    ]
+                ],
+                Literal[
+                    "tomato",
+                    "red",
+                    "ruby",
+                    "crimson",
+                    "pink",
+                    "plum",
+                    "purple",
+                    "violet",
+                    "iris",
+                    "indigo",
+                    "blue",
+                    "cyan",
+                    "teal",
+                    "jade",
+                    "green",
+                    "grass",
+                    "brown",
+                    "orange",
+                    "sky",
+                    "mint",
+                    "lime",
+                    "yellow",
+                    "amber",
+                    "gold",
+                    "bronze",
+                    "gray",
+                ],
+            ]
+        ] = None,
+        high_contrast: Optional[Union[Var[bool], bool]] = None,
+        columns: Optional[
+            Union[
+                Var[Union[str, Literal["1", "2", "3", "4", "5", "6", "7", "8", "9"]]],
+                Union[str, Literal["1", "2", "3", "4", "5", "6", "7", "8", "9"]],
+            ]
+        ] = None,
+        gap: Optional[
+            Union[
+                Var[Union[str, Literal["1", "2", "3", "4", "5", "6", "7", "8", "9"]]],
+                Union[str, Literal["1", "2", "3", "4", "5", "6", "7", "8", "9"]],
+            ]
+        ] = 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_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
+    ) -> "RadioCardsRoot":
+        """Create a new component instance.
+
+        Will prepend "RadixThemes" to the component tag to avoid conflicts with
+        other UI libraries for common names, like Text and Button.
+
+        Args:
+            *children: Child components.
+            size: The size of the checkbox cards: "1" | "2" | "3"
+            variant: Variant of button: "classic" | "surface" | "soft"
+            color_scheme: Override theme color for button
+            high_contrast: Uses a higher contrast color for the component.
+            columns: The number of columns:
+            gap: The gap between the checkbox cards:
+            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: Component properties.
+
+        Returns:
+            A new component instance.
+        """
+        ...
+
+class RadioCardsItem(RadixThemesComponent):
+    @overload
+    @classmethod
+    def create(  # type: ignore
+        cls,
+        *children,
+        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_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
+    ) -> "RadioCardsItem":
+        """Create a new component instance.
+
+        Will prepend "RadixThemes" to the component tag to avoid conflicts with
+        other UI libraries for common names, like Text and Button.
+
+        Args:
+            *children: Child components.
+            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: Component properties.
+
+        Returns:
+            A new component instance.
+        """
+        ...
+
+class RadioCards(SimpleNamespace):
+    root = staticmethod(RadioCardsRoot.create)
+    item = staticmethod(RadioCardsItem.create)
+
+radio_cards = RadioCards()

reflex/components/radix/themes/components/segmented_control.py

@@ -0,0 +1,48 @@
+"""SegmentedControl from Radix Themes."""
+
+from types import SimpleNamespace
+from typing import Literal
+
+from reflex.vars import Var
+
+from ..base import LiteralAccentColor, RadixThemesComponent
+
+
+class SegmentedControlRoot(RadixThemesComponent):
+    """Root element for a SegmentedControl component."""
+
+    tag = "SegmentedControl"
+
+    # The size of the segmented control: "1" | "2" | "3"
+    size: Var[Literal["1", "2", "3"]]
+
+    # Variant of button: "classic" | "surface" | "soft"
+    variant: Var[Literal["classic", "surface", "soft"]]
+
+    # Override theme color for button
+    color_scheme: Var[LiteralAccentColor]
+
+    # The radius of the segmented control: "none" | "small" | "medium" | "large" | "full"
+    radius: Var[Literal["none", "small", "medium", "large", "full"]]
+
+    # The default value of the segmented control.
+    default_value: Var[str]
+
+
+class SegmentedControlItem(RadixThemesComponent):
+    """An item in the SegmentedControl component."""
+
+    tag = "SegmentedControl.Item"
+
+    # The value of the item.
+    value: Var[str]
+
+
+class SegmentedControl(SimpleNamespace):
+    """SegmentedControl components namespace."""
+
+    root = staticmethod(SegmentedControlRoot.create)
+    item = staticmethod(SegmentedControlItem.create)
+
+
+segmented_control = SegmentedControl()

reflex/components/radix/themes/components/segmented_control.pyi

@@ -0,0 +1,262 @@
+"""Stub file for reflex/components/radix/themes/components/segmented_control.py"""
+# ------------------- DO NOT EDIT ----------------------
+# This file was generated by `reflex/utils/pyi_generator.py`!
+# ------------------------------------------------------
+
+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 types import SimpleNamespace
+from typing import Literal
+from reflex.vars import Var
+from ..base import LiteralAccentColor, RadixThemesComponent
+
+class SegmentedControlRoot(RadixThemesComponent):
+    @overload
+    @classmethod
+    def create(  # type: ignore
+        cls,
+        *children,
+        size: Optional[
+            Union[Var[Literal["1", "2", "3"]], Literal["1", "2", "3"]]
+        ] = None,
+        variant: Optional[
+            Union[
+                Var[Literal["classic", "surface", "soft"]],
+                Literal["classic", "surface", "soft"],
+            ]
+        ] = None,
+        color_scheme: Optional[
+            Union[
+                Var[
+                    Literal[
+                        "tomato",
+                        "red",
+                        "ruby",
+                        "crimson",
+                        "pink",
+                        "plum",
+                        "purple",
+                        "violet",
+                        "iris",
+                        "indigo",
+                        "blue",
+                        "cyan",
+                        "teal",
+                        "jade",
+                        "green",
+                        "grass",
+                        "brown",
+                        "orange",
+                        "sky",
+                        "mint",
+                        "lime",
+                        "yellow",
+                        "amber",
+                        "gold",
+                        "bronze",
+                        "gray",
+                    ]
+                ],
+                Literal[
+                    "tomato",
+                    "red",
+                    "ruby",
+                    "crimson",
+                    "pink",
+                    "plum",
+                    "purple",
+                    "violet",
+                    "iris",
+                    "indigo",
+                    "blue",
+                    "cyan",
+                    "teal",
+                    "jade",
+                    "green",
+                    "grass",
+                    "brown",
+                    "orange",
+                    "sky",
+                    "mint",
+                    "lime",
+                    "yellow",
+                    "amber",
+                    "gold",
+                    "bronze",
+                    "gray",
+                ],
+            ]
+        ] = None,
+        radius: Optional[
+            Union[
+                Var[Literal["none", "small", "medium", "large", "full"]],
+                Literal["none", "small", "medium", "large", "full"],
+            ]
+        ] = None,
+        default_value: Optional[Union[Var[str], str]] = 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_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
+    ) -> "SegmentedControlRoot":
+        """Create a new component instance.
+
+        Will prepend "RadixThemes" to the component tag to avoid conflicts with
+        other UI libraries for common names, like Text and Button.
+
+        Args:
+            *children: Child components.
+            size: The size of the segmented control: "1" | "2" | "3"
+            variant: Variant of button: "classic" | "surface" | "soft"
+            color_scheme: Override theme color for button
+            radius: The radius of the segmented control: "none" | "small" | "medium" | "large" | "full"
+            default_value: The default value of the segmented control.
+            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: Component properties.
+
+        Returns:
+            A new component instance.
+        """
+        ...
+
+class SegmentedControlItem(RadixThemesComponent):
+    @overload
+    @classmethod
+    def create(  # type: ignore
+        cls,
+        *children,
+        value: Optional[Union[Var[str], str]] = 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_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
+    ) -> "SegmentedControlItem":
+        """Create a new component instance.
+
+        Will prepend "RadixThemes" to the component tag to avoid conflicts with
+        other UI libraries for common names, like Text and Button.
+
+        Args:
+            *children: Child components.
+            value: The value of the item.
+            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: Component properties.
+
+        Returns:
+            A new component instance.
+        """
+        ...
+
+class SegmentedControl(SimpleNamespace):
+    root = staticmethod(SegmentedControlRoot.create)
+    item = staticmethod(SegmentedControlItem.create)
+
+segmented_control = SegmentedControl()

reflex/components/radix/themes/components/skeleton.py

@@ -0,0 +1,32 @@
+"""Skeleton theme from Radix components."""
+
+from reflex.vars import Var
+
+from ..base import RadixLoadingProp, RadixThemesComponent
+
+
+class Skeleton(RadixLoadingProp, RadixThemesComponent):
+    """Skeleton component."""
+
+    tag = "Skeleton"
+
+    # The width of the skeleton
+    width: Var[str]
+
+    # The minimum width of the skeleton
+    min_width: Var[str]
+
+    # The maximum width of the skeleton
+    max_width: Var[str]
+
+    # The height of the skeleton
+    height: Var[str]
+
+    # The minimum height of the skeleton
+    min_height: Var[str]
+
+    # The maximum height of the skeleton
+    max_height: Var[str]
+
+
+skeleton = Skeleton.create

reflex/components/radix/themes/components/skeleton.pyi

@@ -0,0 +1,106 @@
+"""Stub file for reflex/components/radix/themes/components/skeleton.py"""
+# ------------------- DO NOT EDIT ----------------------
+# This file was generated by `reflex/utils/pyi_generator.py`!
+# ------------------------------------------------------
+
+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.vars import Var
+from ..base import RadixLoadingProp, RadixThemesComponent
+
+class Skeleton(RadixLoadingProp, RadixThemesComponent):
+    @overload
+    @classmethod
+    def create(  # type: ignore
+        cls,
+        *children,
+        width: Optional[Union[Var[str], str]] = None,
+        min_width: Optional[Union[Var[str], str]] = None,
+        max_width: Optional[Union[Var[str], str]] = None,
+        height: Optional[Union[Var[str], str]] = None,
+        min_height: Optional[Union[Var[str], str]] = None,
+        max_height: Optional[Union[Var[str], str]] = None,
+        loading: 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_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
+    ) -> "Skeleton":
+        """Create a new component instance.
+
+        Will prepend "RadixThemes" to the component tag to avoid conflicts with
+        other UI libraries for common names, like Text and Button.
+
+        Args:
+            *children: Child components.
+            width: The width of the skeleton
+            min_width: The minimum width of the skeleton
+            max_width: The maximum width of the skeleton
+            height: The height of the skeleton
+            min_height: The minimum height of the skeleton
+            max_height: The maximum height of the skeleton
+            loading: If set, show an rx.spinner instead of the component children.
+            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: Component properties.
+
+        Returns:
+            A new component instance.
+        """
+        ...
+
+skeleton = Skeleton.create

reflex/components/radix/themes/components/spinner.py

@@ -0,0 +1,26 @@
+"""Radix Spinner Component."""
+
+from typing import Literal
+
+from reflex.vars import Var
+
+from ..base import (
+    RadixLoadingProp,
+    RadixThemesComponent,
+)
+
+LiteralSpinnerSize = Literal["1", "2", "3"]
+
+
+class Spinner(RadixLoadingProp, RadixThemesComponent):
+    """A spinner component."""
+
+    tag = "Spinner"
+
+    is_default = False
+
+    # The size of the spinner.
+    size: Var[LiteralSpinnerSize]
+
+
+spinner = Spinner.create

reflex/components/radix/themes/components/spinner.pyi

@@ -0,0 +1,101 @@
+"""Stub file for reflex/components/radix/themes/components/spinner.py"""
+# ------------------- DO NOT EDIT ----------------------
+# This file was generated by `reflex/utils/pyi_generator.py`!
+# ------------------------------------------------------
+
+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 typing import Literal
+from reflex.vars import Var
+from ..base import RadixLoadingProp, RadixThemesComponent
+
+LiteralSpinnerSize = Literal["1", "2", "3"]
+
+class Spinner(RadixLoadingProp, RadixThemesComponent):
+    @overload
+    @classmethod
+    def create(  # type: ignore
+        cls,
+        *children,
+        size: Optional[
+            Union[Var[Literal["1", "2", "3"]], Literal["1", "2", "3"]]
+        ] = None,
+        loading: 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_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
+    ) -> "Spinner":
+        """Create a new component instance.
+
+        Will prepend "RadixThemes" to the component tag to avoid conflicts with
+        other UI libraries for common names, like Text and Button.
+
+        Args:
+            *children: Child components.
+            size: The size of the spinner.
+            loading: If set, show an rx.spinner instead of the component children.
+            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: Component properties.
+
+        Returns:
+            A new component instance.
+        """
+        ...
+
+spinner = Spinner.create

reflex/components/radix/themes/components/text_field.py

@@ -35,68 +35,6 @@ class TextFieldRoot(el.Div, RadixThemesComponent):
     # Override theme radius for text field: "none" | "small" | "medium" | "large" | "full"
     radius: Var[LiteralRadius]
 
-
-class TextFieldInput(el.Input, TextFieldRoot):
-    """The input part of a TextField, may be used by itself."""
-
-    tag = "TextField.Input"
-
-    @classmethod
-    def create(cls, *children, **props) -> Component:
-        """Create an Input component.
-
-        Args:
-            *children: The children of the component.
-            **props: The properties of the component.
-
-        Returns:
-            The component.
-        """
-        if props.get("value") is not None and props.get("on_change"):
-            # create a debounced input if the user requests full control to avoid typing jank
-            return DebounceInput.create(super().create(*children, **props))
-        return super().create(*children, **props)
-
-    def get_event_triggers(self) -> Dict[str, Any]:
-        """Get the event triggers that pass the component's value to the handler.
-
-        Returns:
-            A dict mapping the event trigger to the var that is passed to the handler.
-        """
-        return {
-            **super().get_event_triggers(),
-            EventTriggers.ON_CHANGE: lambda e0: [e0.target.value],
-            EventTriggers.ON_FOCUS: lambda e0: [e0.target.value],
-            EventTriggers.ON_BLUR: lambda e0: [e0.target.value],
-            EventTriggers.ON_KEY_DOWN: lambda e0: [e0.key],
-            EventTriggers.ON_KEY_UP: lambda e0: [e0.key],
-        }
-
-
-class TextFieldSlot(RadixThemesComponent):
-    """Contains icons or buttons associated with an Input."""
-
-    tag = "TextField.Slot"
-
-    # Override theme color for text field slot
-    color_scheme: Var[LiteralAccentColor]
-
-
-class Input(RadixThemesComponent):
-    """High level wrapper for the Input component."""
-
-    # Text field size "1" - "3"
-    size: Var[LiteralTextFieldSize]
-
-    # Variant of text field: "classic" | "surface" | "soft"
-    variant: Var[LiteralTextFieldVariant]
-
-    # Override theme color for text field
-    color_scheme: Var[LiteralAccentColor]
-
-    # Override theme radius for text field: "none" | "small" | "medium" | "large" | "full"
-    radius: Var[LiteralRadius]
-
     # Whether the input should have autocomplete enabled
     auto_complete: Var[bool]
 
@@ -107,10 +45,10 @@ class Input(RadixThemesComponent):
     disabled: Var[bool]
 
     # Specifies the maximum number of characters allowed in the input
-    max_length: Var[str]
+    max_length: Var[int]
 
     # Specifies the minimum number of characters required in the input
-    min_length: Var[str]
+    min_length: Var[int]
 
     # Name of the input, used when sending form data
     name: Var[str]
@@ -131,16 +69,20 @@ class Input(RadixThemesComponent):
     value: Var[Union[str, int, float]]
 
     @classmethod
-    def create(cls, **props):
+    def create(cls, *children, **props) -> Component:
         """Create an Input component.
 
         Args:
+            *children: The children of the component.
             **props: The properties of the component.
 
         Returns:
             The component.
         """
-        return TextFieldInput.create(**props)
+        if props.get("value") is not None and props.get("on_change"):
+            # create a debounced input if the user requests full control to avoid typing jank
+            return DebounceInput.create(super().create(*children, **props))
+        return super().create(*children, **props)
 
     def get_event_triggers(self) -> Dict[str, Any]:
         """Get the event triggers that pass the component's value to the handler.
@@ -158,13 +100,21 @@ class Input(RadixThemesComponent):
         }
 
 
+class TextFieldSlot(RadixThemesComponent):
+    """Contains icons or buttons associated with an Input."""
+
+    tag = "TextField.Slot"
+
+    # Override theme color for text field slot
+    color_scheme: Var[LiteralAccentColor]
+
+
 class TextField(ComponentNamespace):
     """TextField components namespace."""
 
     root = staticmethod(TextFieldRoot.create)
-    input = staticmethod(TextFieldInput.create)
     slot = staticmethod(TextFieldSlot.create)
-    __call__ = staticmethod(Input.create)
+    __call__ = staticmethod(TextFieldRoot.create)
 
 
 text_field = TextField()

reflex/components/radix/themes/components/text_field.pyi

@@ -101,294 +101,19 @@ class TextFieldRoot(el.Div, RadixThemesComponent):
                 Literal["none", "small", "medium", "large", "full"],
             ]
         ] = None,
-        access_key: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        auto_capitalize: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        content_editable: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        context_menu: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        dir: Optional[Union[Var[Union[str, int, bool]], Union[str, int, bool]]] = None,
-        draggable: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        enter_key_hint: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        hidden: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        input_mode: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        item_prop: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        lang: Optional[Union[Var[Union[str, int, bool]], Union[str, int, bool]]] = None,
-        role: Optional[Union[Var[Union[str, int, bool]], Union[str, int, bool]]] = None,
-        slot: Optional[Union[Var[Union[str, int, bool]], Union[str, int, bool]]] = None,
-        spell_check: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        tab_index: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        title: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, 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_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
-    ) -> "TextFieldRoot":
-        """Create a new component instance.
-
-        Will prepend "RadixThemes" to the component tag to avoid conflicts with
-        other UI libraries for common names, like Text and Button.
-
-        Args:
-            *children: Child components.
-            size: Text field size "1" - "3"
-            variant: Variant of text field: "classic" | "surface" | "soft"
-            color_scheme: Override theme color for text field
-            radius: Override theme radius for text field: "none" | "small" | "medium" | "large" | "full"
-            access_key:  Provides a hint for generating a keyboard shortcut for the current element.
-            auto_capitalize: Controls whether and how text input is automatically capitalized as it is entered/edited by the user.
-            content_editable: Indicates whether the element's content is editable.
-            context_menu: Defines the ID of a <menu> element which will serve as the element's context menu.
-            dir: Defines the text direction. Allowed values are ltr (Left-To-Right) or rtl (Right-To-Left)
-            draggable: Defines whether the element can be dragged.
-            enter_key_hint: Hints what media types the media element is able to play.
-            hidden: Defines whether the element is hidden.
-            input_mode: Defines the type of the element.
-            item_prop: Defines the name of the element for metadata purposes.
-            lang: Defines the language used in the element.
-            role: Defines the role of the element.
-            slot: Assigns a slot in a shadow DOM shadow tree to an element.
-            spell_check: Defines whether the element may be checked for spelling errors.
-            tab_index: Defines the position of the current element in the tabbing order.
-            title: Defines a tooltip for the element.
-            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: Component properties.
-
-        Returns:
-            A new component instance.
-        """
-        ...
-
-class TextFieldInput(el.Input, TextFieldRoot):
-    @overload
-    @classmethod
-    def create(  # type: ignore
-        cls,
-        *children,
-        accept: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        alt: Optional[Union[Var[Union[str, int, bool]], Union[str, int, bool]]] = None,
-        auto_complete: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        auto_focus: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        capture: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        checked: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        default_checked: Optional[Union[Var[bool], bool]] = None,
+        auto_complete: Optional[Union[Var[bool], bool]] = None,
         default_value: Optional[Union[Var[str], str]] = None,
-        dirname: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        disabled: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        form: Optional[Union[Var[Union[str, int, bool]], Union[str, int, bool]]] = None,
-        form_action: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        form_enc_type: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        form_method: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        form_no_validate: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        form_target: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        list: Optional[Union[Var[Union[str, int, bool]], Union[str, int, bool]]] = None,
-        max: Optional[Union[Var[Union[str, int, bool]], Union[str, int, bool]]] = None,
-        max_length: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        min_length: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        min: Optional[Union[Var[Union[str, int, bool]], Union[str, int, bool]]] = None,
-        multiple: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        name: Optional[Union[Var[Union[str, int, bool]], Union[str, int, bool]]] = None,
-        pattern: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        placeholder: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        read_only: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        required: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
-        size: Optional[Union[Var[Union[str, int, bool]], Union[str, int, bool]]] = None,
-        src: Optional[Union[Var[Union[str, int, bool]], Union[str, int, bool]]] = None,
-        step: Optional[Union[Var[Union[str, int, bool]], Union[str, int, bool]]] = None,
-        type: Optional[Union[Var[Union[str, int, bool]], Union[str, int, bool]]] = None,
-        use_map: Optional[
-            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
-        ] = None,
+        disabled: Optional[Union[Var[bool], bool]] = None,
+        max_length: Optional[Union[Var[int], int]] = None,
+        min_length: Optional[Union[Var[int], int]] = None,
+        name: Optional[Union[Var[str], str]] = None,
+        placeholder: Optional[Union[Var[str], str]] = None,
+        read_only: Optional[Union[Var[bool], bool]] = None,
+        required: Optional[Union[Var[bool], bool]] = None,
+        type: Optional[Union[Var[str], str]] = None,
         value: Optional[
             Union[Var[Union[str, int, float]], Union[str, int, float]]
         ] = None,
-        variant: Optional[
-            Union[
-                Var[Literal["classic", "surface", "soft"]],
-                Literal["classic", "surface", "soft"],
-            ]
-        ] = None,
-        color_scheme: Optional[
-            Union[
-                Var[
-                    Literal[
-                        "tomato",
-                        "red",
-                        "ruby",
-                        "crimson",
-                        "pink",
-                        "plum",
-                        "purple",
-                        "violet",
-                        "iris",
-                        "indigo",
-                        "blue",
-                        "cyan",
-                        "teal",
-                        "jade",
-                        "green",
-                        "grass",
-                        "brown",
-                        "orange",
-                        "sky",
-                        "mint",
-                        "lime",
-                        "yellow",
-                        "amber",
-                        "gold",
-                        "bronze",
-                        "gray",
-                    ]
-                ],
-                Literal[
-                    "tomato",
-                    "red",
-                    "ruby",
-                    "crimson",
-                    "pink",
-                    "plum",
-                    "purple",
-                    "violet",
-                    "iris",
-                    "indigo",
-                    "blue",
-                    "cyan",
-                    "teal",
-                    "jade",
-                    "green",
-                    "grass",
-                    "brown",
-                    "orange",
-                    "sky",
-                    "mint",
-                    "lime",
-                    "yellow",
-                    "amber",
-                    "gold",
-                    "bronze",
-                    "gray",
-                ],
-            ]
-        ] = None,
-        radius: Optional[
-            Union[
-                Var[Literal["none", "small", "medium", "large", "full"]],
-                Literal["none", "small", "medium", "large", "full"],
-            ]
-        ] = None,
         access_key: Optional[
             Union[Var[Union[str, int, bool]], Union[str, int, bool]]
         ] = None,
@@ -490,47 +215,26 @@ class TextFieldInput(el.Input, TextFieldRoot):
             Union[EventHandler, EventSpec, list, function, BaseVar]
         ] = None,
         **props
-    ) -> "TextFieldInput":
+    ) -> "TextFieldRoot":
         """Create an Input component.
 
         Args:
             *children: The children of the component.
-            accept: Accepted types of files when the input is file type
-            alt: Alternate text for input type="image"
+            size: Text field size "1" - "3"
+            variant: Variant of text field: "classic" | "surface" | "soft"
+            color_scheme: Override theme color for text field
+            radius: Override theme radius for text field: "none" | "small" | "medium" | "large" | "full"
             auto_complete: Whether the input should have autocomplete enabled
-            auto_focus: Automatically focuses the input when the page loads
-            capture: Captures media from the user (camera or microphone)
-            checked: Indicates whether the input is checked (for checkboxes and radio buttons)
-            default_checked: The initial value (for checkboxes and radio buttons)
-            default_value: The initial value for a text field
-            dirname: Name part of the input to submit in 'dir' and 'name' pair when form is submitted
+            default_value: The value of the input when initially rendered.
             disabled: Disables the input
-            form: Associates the input with a form (by id)
-            form_action: URL to send the form data to (for type="submit" buttons)
-            form_enc_type: How the form data should be encoded when submitting to the server (for type="submit" buttons)
-            form_method: HTTP method to use for sending form data (for type="submit" buttons)
-            form_no_validate: Bypasses form validation when submitting (for type="submit" buttons)
-            form_target: Specifies where to display the response after submitting the form (for type="submit" buttons)
-            list: References a datalist for suggested options
-            max: Specifies the maximum value for the input
             max_length: Specifies the maximum number of characters allowed in the input
             min_length: Specifies the minimum number of characters required in the input
-            min: Specifies the minimum value for the input
-            multiple: Indicates whether multiple values can be entered in an input of the type email or file
             name: Name of the input, used when sending form data
-            pattern: Regex pattern the input's value must match to be valid
             placeholder: Placeholder text in the input
             read_only: Indicates whether the input is read-only
             required: Indicates that the input is required
-            size: Text field size "1" - "3"
-            src: URL for image inputs
-            step: Specifies the legal number intervals for an input
             type: Specifies the type of input
-            use_map: Name of the image map used with the input
             value: Value of the input
-            variant: Variant of text field: "classic" | "surface" | "soft"
-            color_scheme: Override theme color for text field
-            radius: Override theme radius for text field: "none" | "small" | "medium" | "large" | "full"
             access_key:  Provides a hint for generating a keyboard shortcut for the current element.
             auto_capitalize: Controls whether and how text input is automatically capitalized as it is entered/edited by the user.
             content_editable: Indicates whether the element's content is editable.
@@ -703,11 +407,12 @@ class TextFieldSlot(RadixThemesComponent):
         """
         ...
 
-class Input(RadixThemesComponent):
-    @overload
-    @classmethod
-    def create(  # type: ignore
-        cls,
+class TextField(ComponentNamespace):
+    root = staticmethod(TextFieldRoot.create)
+    slot = staticmethod(TextFieldSlot.create)
+
+    @staticmethod
+    def __call__(
         *children,
         size: Optional[
             Union[Var[Literal["1", "2", "3"]], Literal["1", "2", "3"]]
@@ -789,8 +494,8 @@ class Input(RadixThemesComponent):
         auto_complete: Optional[Union[Var[bool], bool]] = None,
         default_value: Optional[Union[Var[str], str]] = None,
         disabled: Optional[Union[Var[bool], bool]] = None,
-        max_length: Optional[Union[Var[str], str]] = None,
-        min_length: Optional[Union[Var[str], str]] = None,
+        max_length: Optional[Union[Var[int], int]] = None,
+        min_length: Optional[Union[Var[int], int]] = None,
         name: Optional[Union[Var[str], str]] = None,
         placeholder: Optional[Union[Var[str], str]] = None,
         read_only: Optional[Union[Var[bool], bool]] = None,
@@ -799,197 +504,45 @@ class Input(RadixThemesComponent):
         value: Optional[
             Union[Var[Union[str, int, float]], Union[str, int, float]]
         ] = 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_change: 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_focus: Optional[
-            Union[EventHandler, EventSpec, list, function, BaseVar]
-        ] = None,
-        on_key_down: Optional[
-            Union[EventHandler, EventSpec, list, function, BaseVar]
-        ] = None,
-        on_key_up: 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]
+        access_key: Optional[
+            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
         ] = None,
-        on_mouse_move: Optional[
-            Union[EventHandler, EventSpec, list, function, BaseVar]
+        auto_capitalize: Optional[
+            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
         ] = None,
-        on_mouse_out: Optional[
-            Union[EventHandler, EventSpec, list, function, BaseVar]
+        content_editable: Optional[
+            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
         ] = None,
-        on_mouse_over: Optional[
-            Union[EventHandler, EventSpec, list, function, BaseVar]
+        context_menu: Optional[
+            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
         ] = None,
-        on_mouse_up: Optional[
-            Union[EventHandler, EventSpec, list, function, BaseVar]
+        dir: Optional[Union[Var[Union[str, int, bool]], Union[str, int, bool]]] = None,
+        draggable: Optional[
+            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
         ] = None,
-        on_scroll: Optional[
-            Union[EventHandler, EventSpec, list, function, BaseVar]
+        enter_key_hint: Optional[
+            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
         ] = None,
-        on_unmount: Optional[
-            Union[EventHandler, EventSpec, list, function, BaseVar]
+        hidden: Optional[
+            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
         ] = None,
-        **props
-    ) -> "Input":
-        """Create an Input component.
-
-        Args:
-            size: Text field size "1" - "3"
-            variant: Variant of text field: "classic" | "surface" | "soft"
-            color_scheme: Override theme color for text field
-            radius: Override theme radius for text field: "none" | "small" | "medium" | "large" | "full"
-            auto_complete: Whether the input should have autocomplete enabled
-            default_value: The value of the input when initially rendered.
-            disabled: Disables the input
-            max_length: Specifies the maximum number of characters allowed in the input
-            min_length: Specifies the minimum number of characters required in the input
-            name: Name of the input, used when sending form data
-            placeholder: Placeholder text in the input
-            read_only: Indicates whether the input is read-only
-            required: Indicates that the input is required
-            type: Specifies the type of input
-            value: Value of the input
-            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 component.
-        """
-        ...
-    def get_event_triggers(self) -> Dict[str, Any]: ...
-
-class TextField(ComponentNamespace):
-    root = staticmethod(TextFieldRoot.create)
-    input = staticmethod(TextFieldInput.create)
-    slot = staticmethod(TextFieldSlot.create)
-
-    @staticmethod
-    def __call__(
-        *children,
-        size: Optional[
-            Union[Var[Literal["1", "2", "3"]], Literal["1", "2", "3"]]
+        input_mode: Optional[
+            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
         ] = None,
-        variant: Optional[
-            Union[
-                Var[Literal["classic", "surface", "soft"]],
-                Literal["classic", "surface", "soft"],
-            ]
+        item_prop: Optional[
+            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
         ] = None,
-        color_scheme: Optional[
-            Union[
-                Var[
-                    Literal[
-                        "tomato",
-                        "red",
-                        "ruby",
-                        "crimson",
-                        "pink",
-                        "plum",
-                        "purple",
-                        "violet",
-                        "iris",
-                        "indigo",
-                        "blue",
-                        "cyan",
-                        "teal",
-                        "jade",
-                        "green",
-                        "grass",
-                        "brown",
-                        "orange",
-                        "sky",
-                        "mint",
-                        "lime",
-                        "yellow",
-                        "amber",
-                        "gold",
-                        "bronze",
-                        "gray",
-                    ]
-                ],
-                Literal[
-                    "tomato",
-                    "red",
-                    "ruby",
-                    "crimson",
-                    "pink",
-                    "plum",
-                    "purple",
-                    "violet",
-                    "iris",
-                    "indigo",
-                    "blue",
-                    "cyan",
-                    "teal",
-                    "jade",
-                    "green",
-                    "grass",
-                    "brown",
-                    "orange",
-                    "sky",
-                    "mint",
-                    "lime",
-                    "yellow",
-                    "amber",
-                    "gold",
-                    "bronze",
-                    "gray",
-                ],
-            ]
+        lang: Optional[Union[Var[Union[str, int, bool]], Union[str, int, bool]]] = None,
+        role: Optional[Union[Var[Union[str, int, bool]], Union[str, int, bool]]] = None,
+        slot: Optional[Union[Var[Union[str, int, bool]], Union[str, int, bool]]] = None,
+        spell_check: Optional[
+            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
         ] = None,
-        radius: Optional[
-            Union[
-                Var[Literal["none", "small", "medium", "large", "full"]],
-                Literal["none", "small", "medium", "large", "full"],
-            ]
+        tab_index: Optional[
+            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
         ] = None,
-        auto_complete: Optional[Union[Var[bool], bool]] = None,
-        default_value: Optional[Union[Var[str], str]] = None,
-        disabled: Optional[Union[Var[bool], bool]] = None,
-        max_length: Optional[Union[Var[str], str]] = None,
-        min_length: Optional[Union[Var[str], str]] = None,
-        name: Optional[Union[Var[str], str]] = None,
-        placeholder: Optional[Union[Var[str], str]] = None,
-        read_only: Optional[Union[Var[bool], bool]] = None,
-        required: Optional[Union[Var[bool], bool]] = None,
-        type: Optional[Union[Var[str], str]] = None,
-        value: Optional[
-            Union[Var[Union[str, int, float]], Union[str, int, float]]
+        title: Optional[
+            Union[Var[Union[str, int, bool]], Union[str, int, bool]]
         ] = None,
         style: Optional[Style] = None,
         key: Optional[Any] = None,
@@ -1052,10 +605,11 @@ class TextField(ComponentNamespace):
             Union[EventHandler, EventSpec, list, function, BaseVar]
         ] = None,
         **props
-    ) -> "Input":
+    ) -> "TextFieldRoot":
         """Create an Input component.
 
         Args:
+            *children: The children of the component.
             size: Text field size "1" - "3"
             variant: Variant of text field: "classic" | "surface" | "soft"
             color_scheme: Override theme color for text field
@@ -1071,6 +625,22 @@ class TextField(ComponentNamespace):
             required: Indicates that the input is required
             type: Specifies the type of input
             value: Value of the input
+            access_key:  Provides a hint for generating a keyboard shortcut for the current element.
+            auto_capitalize: Controls whether and how text input is automatically capitalized as it is entered/edited by the user.
+            content_editable: Indicates whether the element's content is editable.
+            context_menu: Defines the ID of a <menu> element which will serve as the element's context menu.
+            dir: Defines the text direction. Allowed values are ltr (Left-To-Right) or rtl (Right-To-Left)
+            draggable: Defines whether the element can be dragged.
+            enter_key_hint: Hints what media types the media element is able to play.
+            hidden: Defines whether the element is hidden.
+            input_mode: Defines the type of the element.
+            item_prop: Defines the name of the element for metadata purposes.
+            lang: Defines the language used in the element.
+            role: Defines the role of the element.
+            slot: Assigns a slot in a shadow DOM shadow tree to an element.
+            spell_check: Defines whether the element may be checked for spelling errors.
+            tab_index: Defines the position of the current element in the tabbing order.
+            title: Defines a tooltip for the element.
             style: The style of the component.
             key: A unique key for the component.
             id: The id for the component.

reflex/components/radix/themes/layout/base.py

@@ -43,7 +43,7 @@ class LayoutComponent(CommonMarginProps, RadixThemesComponent):
     pl: Var[LiteralSpacing]
 
     # Whether the element will take up the smallest possible space: "0" | "1"
-    shrink: Var[LiteralBoolNumber]
+    flex_shrink: Var[LiteralBoolNumber]
 
     # Whether the element will take up the largest possible space: "0" | "1"
-    grow: Var[LiteralBoolNumber]
+    flex_grow: Var[LiteralBoolNumber]

reflex/components/radix/themes/layout/base.pyi

@@ -61,8 +61,8 @@ class LayoutComponent(CommonMarginProps, RadixThemesComponent):
                 Literal["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"],
             ]
         ] = None,
-        shrink: Optional[Union[Var[Literal["0", "1"]], Literal["0", "1"]]] = None,
-        grow: Optional[Union[Var[Literal["0", "1"]], Literal["0", "1"]]] = None,
+        flex_shrink: Optional[Union[Var[Literal["0", "1"]], Literal["0", "1"]]] = None,
+        flex_grow: Optional[Union[Var[Literal["0", "1"]], Literal["0", "1"]]] = None,
         m: Optional[
             Union[
                 Var[Literal["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"]],
@@ -172,8 +172,8 @@ class LayoutComponent(CommonMarginProps, RadixThemesComponent):
             pr: Padding right: "0" - "9"
             pb: Padding bottom: "0" - "9"
             pl: Padding left: "0" - "9"
-            shrink: Whether the element will take up the smallest possible space: "0" | "1"
-            grow: Whether the element will take up the largest possible space: "0" | "1"
+            flex_shrink: Whether the element will take up the smallest possible space: "0" | "1"
+            flex_grow: Whether the element will take up the largest possible space: "0" | "1"
             m: Margin: "0" - "9"
             mx: Margin horizontal: "0" - "9"
             my: Margin vertical: "0" - "9"

tests/components/core/test_banner.py

@@ -20,7 +20,7 @@ def test_connection_banner():
         "react",
         "/utils/context",
         "/utils/state",
-        "@radix-ui/themes@^2.0.0",
+        "@radix-ui/themes@^3.0.0",
         "/env.json",
     ]
 
@@ -36,7 +36,7 @@ def test_connection_modal():
         "react",
         "/utils/context",
         "/utils/state",
-        "@radix-ui/themes@^2.0.0",
+        "@radix-ui/themes@^3.0.0",
         "/env.json",
     ]