Radix Components Valid children/parents (#2495)

reflex/components/radix/primitives/accordion.py

@@ -2,7 +2,7 @@
 
 from __future__ import annotations
 
-from typing import Any, Dict, Literal
+from typing import Any, Dict, List, Literal
 
 from reflex.components.component import Component
 from reflex.components.core import cond, match
@@ -416,6 +416,8 @@ class AccordionRoot(AccordionComponent):
     # The var_data associated with the component.
     _var_data: VarData = VarData()  # type: ignore
 
+    _valid_children: List[str] = ["AccordionItem"]
+
     @classmethod
     def create(cls, *children, **props) -> Component:
         """Create the Accordion root component.
@@ -506,6 +508,14 @@ class AccordionItem(AccordionComponent):
     # When true, prevents the user from interacting with the item.
     disabled: Var[bool]
 
+    _valid_children: List[str] = [
+        "AccordionHeader",
+        "AccordionTrigger",
+        "AccordionContent",
+    ]
+
+    _valid_parents: List[str] = ["AccordionRoot"]
+
     def _apply_theme(self, theme: Component):
         self.style = Style(
             {

reflex/components/radix/primitives/accordion.pyi

@@ -7,7 +7,7 @@ from typing import Any, Dict, Literal, Optional, Union, overload
 from reflex.vars import Var, BaseVar, ComputedVar
 from reflex.event import EventChain, EventHandler, EventSpec
 from reflex.style import Style
-from typing import Any, Dict, Literal
+from typing import Any, Dict, List, Literal
 from reflex.components.component import Component
 from reflex.components.core import cond, match
 from reflex.components.lucide.icon import Icon

reflex/components/radix/themes/components/contextmenu.py

@@ -1,5 +1,5 @@
 """Interactive components provided by @radix-ui/themes."""
-from typing import Any, Dict, Literal
+from typing import Any, Dict, List, Literal
 
 from reflex.constants import EventTriggers
 from reflex.vars import Var
@@ -18,6 +18,8 @@ class ContextMenuRoot(RadixThemesComponent):
     # The modality of the context menu. When set to true, interaction with outside elements will be disabled and only menu content will be visible to screen readers.
     modal: Var[bool]
 
+    _invalid_children: List[str] = ["ContextMenuItem"]
+
     def get_event_triggers(self) -> Dict[str, Any]:
         """Get the events triggers signatures for the component.
 
@@ -38,6 +40,10 @@ class ContextMenuTrigger(RadixThemesComponent):
     # Whether the trigger is disabled
     disabled: Var[bool]
 
+    _valid_parents: List[str] = ["ContextMenuRoot"]
+
+    _invalid_children: List[str] = ["ContextMenuContent"]
+
 
 class ContextMenuContent(RadixThemesComponent):
     """Trigger an action or event, such as submitting a form or displaying a dialog."""
@@ -59,7 +65,7 @@ class ContextMenuContent(RadixThemesComponent):
     # The vertical distance in pixels from the anchor.
     align_offset: Var[int]
 
-    # When true, overrides the side andalign preferences to prevent collisions with boundary edges.
+    # When true, overrides the side and aligns preferences to prevent collisions with boundary edges.
     avoid_collisions: Var[bool]
 
     def get_event_triggers(self) -> Dict[str, Any]:
@@ -92,6 +98,8 @@ class ContextMenuSubTrigger(RadixThemesComponent):
     # Whether the trigger is disabled
     disabled: Var[bool]
 
+    _valid_parents: List[str] = ["ContextMenuContent", "ContextMenuSub"]
+
 
 class ContextMenuSubContent(RadixThemesComponent):
     """Trigger an action or event, such as submitting a form or displaying a dialog."""
@@ -101,6 +109,8 @@ class ContextMenuSubContent(RadixThemesComponent):
     # When true, keyboard navigation will loop from last item to first, and vice versa.
     loop: Var[bool]
 
+    _valid_parents: List[str] = ["ContextMenuSub"]
+
     def get_event_triggers(self) -> Dict[str, Any]:
         """Get the events triggers signatures for the component.
 
@@ -127,6 +137,8 @@ class ContextMenuItem(RadixThemesComponent):
     # Shortcut to render a menu item as a link
     shortcut: Var[str]
 
+    _valid_parents: List[str] = ["ContextMenuContent", "ContextMenuSubContent"]
+
 
 class ContextMenuSeparator(RadixThemesComponent):
     """Trigger an action or event, such as submitting a form or displaying a dialog."""

reflex/components/radix/themes/components/contextmenu.pyi

@@ -7,7 +7,7 @@ from typing import Any, Dict, Literal, Optional, Union, overload
 from reflex.vars import Var, BaseVar, ComputedVar
 from reflex.event import EventChain, EventHandler, EventSpec
 from reflex.style import Style
-from typing import Any, Dict, Literal
+from typing import Any, Dict, List, Literal
 from reflex.constants import EventTriggers
 from reflex.vars import Var
 from ..base import LiteralAccentColor, RadixThemesComponent
@@ -471,7 +471,7 @@ class ContextMenuContent(RadixThemesComponent):
             variant: Variant of button: "solid" | "soft" | "outline" | "ghost"
             high_contrast: Whether to render the button with higher contrast color against background
             align_offset: The vertical distance in pixels from the anchor.
-            avoid_collisions: When true, overrides the side andalign preferences to prevent collisions with boundary edges.
+            avoid_collisions: When true, overrides the side and aligns preferences to prevent collisions with boundary edges.
             style: The style of the component.
             key: A unique key for the component.
             id: The id for the component.

reflex/components/radix/themes/components/dropdownmenu.py

@@ -1,5 +1,5 @@
 """Interactive components provided by @radix-ui/themes."""
-from typing import Any, Dict, Literal, Union
+from typing import Any, Dict, List, Literal, Union
 
 from reflex.constants import EventTriggers
 from reflex.vars import Var
@@ -43,6 +43,8 @@ class DropdownMenuRoot(RadixThemesComponent):
     # The reading direction of submenus when applicable. If omitted, inherits globally from DirectionProvider or assumes LTR (left-to-right) reading mode.
     dir: Var[LiteralDirType]
 
+    _invalid_children: List[str] = ["DropdownMenuItem"]
+
     def get_event_triggers(self) -> Dict[str, Any]:
         """Get the events triggers signatures for the component.
 
@@ -63,6 +65,10 @@ class DropdownMenuTrigger(RadixThemesComponent):
     # Change the default rendered element for the one passed as a child, merging their props and behavior. Defaults to False.
     as_child: Var[bool]
 
+    _valid_parents: List[str] = ["DropdownMenuRoot"]
+
+    _invalid_children: List[str] = ["DropdownMenuContent"]
+
 
 class DropdownMenuContent(RadixThemesComponent):
     """The Dropdown Menu Content component that pops out when the dropdown menu is open."""
@@ -147,6 +153,8 @@ class DropdownMenuSubTrigger(RadixThemesComponent):
     # Optional text used for typeahead purposes. By default the typeahead behavior will use the .textContent of the item. Use this when the content is complex, or you have non-textual content inside.
     text_value: Var[str]
 
+    _valid_parents: List[str] = ["DropdownMenuContent", "DropdownMenuSub"]
+
 
 class DropdownMenuSub(RadixThemesComponent):
     """Contains all the parts of a submenu."""
@@ -218,6 +226,8 @@ class DropdownMenuSubContent(RadixThemesComponent):
     # Whether to hide the content when the trigger becomes fully occluded. Defaults to False.
     hide_when_detached: Var[bool]
 
+    _valid_parents: List[str] = ["DropdownMenuSub"]
+
     def get_event_triggers(self) -> Dict[str, Any]:
         """Get the events triggers signatures for the component.
 
@@ -253,6 +263,8 @@ class DropdownMenuItem(RadixThemesComponent):
     # Optional text used for typeahead purposes. By default the typeahead behavior will use the .textContent of the item. Use this when the content is complex, or you have non-textual content inside.
     text_value: Var[str]
 
+    _valid_parents: List[str] = ["DropdownMenuContent", "DropdownMenuSubContent"]
+
     def get_event_triggers(self) -> Dict[str, Any]:
         """Get the events triggers signatures for the component.
 

reflex/components/radix/themes/components/dropdownmenu.pyi

@@ -7,7 +7,7 @@ from typing import Any, Dict, Literal, Optional, Union, overload
 from reflex.vars import Var, BaseVar, ComputedVar
 from reflex.event import EventChain, EventHandler, EventSpec
 from reflex.style import Style
-from typing import Any, Dict, Literal, Union
+from typing import Any, Dict, List, Literal, Union
 from reflex.constants import EventTriggers
 from reflex.vars import Var
 from ..base import LiteralAccentColor, RadixThemesComponent

reflex/components/radix/themes/components/select.py

@@ -77,6 +77,8 @@ class SelectTrigger(RadixThemesComponent):
     # The placeholder of the select trigger
     placeholder: Var[str]
 
+    _valid_parents: List[str] = ["SelectRoot"]
+
 
 class SelectContent(RadixThemesComponent):
     """The component that pops out when the select is open."""
@@ -126,6 +128,8 @@ class SelectGroup(RadixThemesComponent):
 
     tag = "Select.Group"
 
+    _valid_parents: List[str] = ["SelectContent"]
+
 
 class SelectItem(RadixThemesComponent):
     """The component that contains the select items."""
@@ -138,12 +142,16 @@ class SelectItem(RadixThemesComponent):
     # Whether the select item is disabled
     disabled: Var[bool]
 
+    _valid_parents: List[str] = ["SelectGroup", "SelectContent"]
+
 
 class SelectLabel(RadixThemesComponent):
     """Used to render the label of a group, it isn't focusable using arrow keys."""
 
     tag = "Select.Label"
 
+    _valid_parents: List[str] = ["SelectGroup"]
+
 
 class SelectSeparator(RadixThemesComponent):
     """Used to visually separate items in the Select."""

reflex/components/radix/themes/components/table.py

@@ -1,5 +1,5 @@
 """Interactive components provided by @radix-ui/themes."""
-from typing import Literal, Union
+from typing import List, Literal, Union
 
 from reflex import el
 from reflex.vars import Var
@@ -26,6 +26,10 @@ class TableHeader(el.Thead, RadixThemesComponent):
 
     tag = "Table.Header"
 
+    _invalid_children: List[str] = ["TableBody"]
+
+    _valid_parents: List[str] = ["TableRoot"]
+
 
 class TableRow(el.Tr, RadixThemesComponent):
     """A row containing table cells."""
@@ -35,6 +39,8 @@ class TableRow(el.Tr, RadixThemesComponent):
     # The alignment of the row
     align: Var[Literal["start", "center", "end", "baseline"]]
 
+    _invalid_children: List[str] = ["TableBody", "TableHeader", "TableRow"]
+
 
 class TableColumnHeaderCell(el.Th, RadixThemesComponent):
     """A table cell that is semantically treated as a column header."""
@@ -47,12 +53,30 @@ class TableColumnHeaderCell(el.Th, RadixThemesComponent):
     # width of the column
     width: Var[Union[str, int]]
 
+    _invalid_children: List[str] = [
+        "TableBody",
+        "TableHeader",
+        "TableRow",
+        "TableCell",
+        "TableColumnHeaderCell",
+        "TableRowHeaderCell",
+    ]
+
 
 class TableBody(el.Tbody, RadixThemesComponent):
     """The body of the table contains the data rows."""
 
     tag = "Table.Body"
 
+    _invalid_children: List[str] = [
+        "TableHeader",
+        "TableRowHeaderCell",
+        "TableColumnHeaderCell",
+        "TableCell",
+    ]
+
+    _valid_parents: List[str] = ["TableRoot"]
+
 
 class TableCell(el.Td, RadixThemesComponent):
     """A cell containing data."""
@@ -65,6 +89,14 @@ class TableCell(el.Td, RadixThemesComponent):
     # width of the column
     width: Var[Union[str, int]]
 
+    _invalid_children: List[str] = [
+        "TableBody",
+        "TableHeader",
+        "TableRowHeaderCell",
+        "TableColumnHeaderCell",
+        "TableCell",
+    ]
+
 
 class TableRowHeaderCell(el.Th, RadixThemesComponent):
     """A table cell that is semantically treated as a row header."""
@@ -76,3 +108,12 @@ class TableRowHeaderCell(el.Th, RadixThemesComponent):
 
     # width of the column
     width: Var[Union[str, int]]
+
+    _invalid_children: List[str] = [
+        "TableBody",
+        "TableHeader",
+        "TableRow",
+        "TableCell",
+        "TableColumnHeaderCell",
+        "TableRowHeaderCell",
+    ]

reflex/components/radix/themes/components/table.pyi

@@ -7,7 +7,7 @@ from typing import Any, Dict, Literal, Optional, Union, overload
 from reflex.vars import Var, BaseVar, ComputedVar
 from reflex.event import EventChain, EventHandler, EventSpec
 from reflex.style import Style
-from typing import Literal, Union
+from typing import List, Literal, Union
 from reflex import el
 from reflex.vars import Var
 from ..base import RadixThemesComponent

reflex/components/radix/themes/components/tabs.py

@@ -1,5 +1,5 @@
 """Interactive components provided by @radix-ui/themes."""
-from typing import Any, Dict, Literal
+from typing import Any, Dict, List, Literal
 
 from reflex.constants import EventTriggers
 from reflex.vars import Var
@@ -58,6 +58,8 @@ class TabsTrigger(RadixThemesComponent):
     # Whether the tab is disabled
     disabled: Var[bool]
 
+    _valid_parents: List[str] = ["TabsList"]
+
 
 class TabsContent(RadixThemesComponent):
     """Trigger an action or event, such as submitting a form or displaying a dialog."""

reflex/components/radix/themes/components/tabs.pyi

@@ -7,7 +7,7 @@ from typing import Any, Dict, Literal, Optional, Union, overload
 from reflex.vars import Var, BaseVar, ComputedVar
 from reflex.event import EventChain, EventHandler, EventSpec
 from reflex.style import Style
-from typing import Any, Dict, Literal
+from typing import Any, Dict, List, Literal
 from reflex.constants import EventTriggers
 from reflex.vars import Var
 from ..base import RadixThemesComponent