laipeng/reflex
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Expose color_scheme on TabsTrigger (#3112)

Browse Source
This commit is contained in:
Masen Furer 2024-05-06 18:36:44 -07:00 committed by GitHub
parent 185ec31a71
commit aa8858b113
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 95 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
reflex/components/radix/themes/components/tabs.py
View File

@ -1,11 +1,14 @@
"""Interactive components provided by @radix-ui/themes."""
from __future__ import annotations
from typing import Any, Dict, List, Literal
from reflex.components.component import ComponentNamespace
from reflex.components.component import Component, ComponentNamespace
from reflex.constants import EventTriggers
from reflex.vars import Var
from ..base import (
LiteralAccentColor,
RadixThemesComponent,
)
@ -59,8 +62,30 @@ class TabsTrigger(RadixThemesComponent):
# Whether the tab is disabled
disabled: Var[bool]
# The color of the line under the tab when active.
color_scheme: Var[LiteralAccentColor]
_valid_parents: List[str] = ["TabsList"]
@classmethod
def create(self, *children, **props) -> Component:
"""Create a TabsTrigger component.
Args:
*children: The children of the component.
**props: The properties of the component.
Returns:
The TabsTrigger Component.
"""
if "color_scheme" in props:
custom_attrs = props.setdefault("custom_attrs", {})
custom_attrs["data-accent-color"] = props["color_scheme"]
return super().create(*children, **props)
def _exclude_props(self) -> list[str]:
return ["color_scheme"]
class TabsContent(RadixThemesComponent):
"""Contains the content associated with each trigger."""

78
reflex/components/radix/themes/components/tabs.pyi
View File

@ -8,10 +8,10 @@ from reflex.vars import Var, BaseVar, ComputedVar
from reflex.event import EventChain, EventHandler, EventSpec
from reflex.style import Style
from typing import Any, Dict, List, Literal
from reflex.components.component import ComponentNamespace
from reflex.components.component import Component, ComponentNamespace
from reflex.constants import EventTriggers
from reflex.vars import Var
from ..base import RadixThemesComponent
from ..base import LiteralAccentColor, RadixThemesComponent
class TabsRoot(RadixThemesComponent):
def get_event_triggers(self) -> Dict[str, Any]: ...
@ -196,6 +196,68 @@ class TabsTrigger(RadixThemesComponent):
*children,
value: Optional[Union[Var[str], str]] = None,
disabled: Optional[Union[Var[bool], 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",
],
]
] = None,
style: Optional[Style] = None,
key: Optional[Any] = None,
id: Optional[Any] = None,
@ -249,25 +311,23 @@ class TabsTrigger(RadixThemesComponent):
] = None,
**props
) -> "TabsTrigger":
"""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.
"""Create a TabsTrigger component.
Args:
*children: Child components.
*children: The children of the component.
value: The value of the tab. Must be unique for each tab.
disabled: Whether the tab is disabled
color_scheme: The color of the line under the tab when active.
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.
**props: The properties of the component.
Returns:
A new component instance.
The TabsTrigger Component.
"""
...