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

high level api for checkbox (#2406)

Browse Source
This commit is contained in:
Tom Gotsman 2024-01-18 15:58:02 -08:00 committed by GitHub
parent 2abecbdb9c
commit 035fc8e15a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 264 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
reflex/components/markdown/markdown.py
View File

@ -41,6 +41,7 @@ _REHYPE_PLUGINS = Var.create_safe([_REHYPE_KATEX, _REHYPE_RAW])
# These tags do NOT get props passed to them
NO_PROPS_TAGS = ("ul", "ol", "li")
# Component Mapping
@lru_cache
def get_base_component_map() -> dict[str, Callable]:

3
reflex/components/radix/themes/components/__init__.py
View File

@ -15,7 +15,7 @@ from .badge import Badge
from .button import Button
from .callout import CalloutIcon, CalloutRoot, CalloutText
from .card import Card
from .checkbox import Checkbox
from .checkbox import Checkbox, HighLevelCheckbox
from .contextmenu import (
ContextMenuContent,
ContextMenuItem,
@ -108,6 +108,7 @@ card = Card.create
# Checkbox
checkbox = Checkbox.create
checkbox_hl = HighLevelCheckbox.create
# Context Menu
contextmenu_root = ContextMenuRoot.create

41
reflex/components/radix/themes/components/checkbox.py
View File

@ -1,12 +1,15 @@
"""Interactive components provided by @radix-ui/themes."""
from typing import Any, Dict, Literal
from reflex.components.component import Component
from reflex.components.radix.themes.layout.flex import Flex
from reflex.components.radix.themes.typography.text import Text
from reflex.vars import Var
from ..base import (
CommonMarginProps,
LiteralAccentColor,
LiteralRadius,
LiteralSize,
LiteralVariant,
RadixThemesComponent,
)
@ -34,9 +37,6 @@ class Checkbox(CommonMarginProps, RadixThemesComponent):
# Whether to render the button with higher contrast color against background
high_contrast: Var[bool]
# Override theme radius for button: "none" | "small" | "medium" | "large" | "full"
radius: Var[LiteralRadius]
# Whether the checkbox is checked by default
default_checked: Var[bool]
@ -65,3 +65,36 @@ class Checkbox(CommonMarginProps, RadixThemesComponent):
**super().get_event_triggers(),
"on_checked_change": lambda e0: [e0],
}
class HighLevelCheckbox(Checkbox):
"""A checkbox component with a label."""
@classmethod
def create(
cls,
text: str = "",
gap: Var[LiteralSize] = Var.create_safe("2"),
size: Var[LiteralCheckboxSize] = Var.create_safe("2"),
**props
) -> Component:
"""Create a checkbox with a label.
Args:
text: The text of the label.
gap: The gap between the checkbox and the label.
size: The size of the checkbox.
**props: Additional properties to apply to the checkbox item.
Returns:
The checkbox component with a label.
"""
return Text.create(
Flex.create(
Checkbox.create(size=size, **props),
text,
gap=gap,
),
as_="label",
size=size,
)

232
reflex/components/radix/themes/components/checkbox.pyi
View File

@ -8,11 +8,14 @@ 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 reflex.components.component import Component
from reflex.components.radix.themes.layout.flex import Flex
from reflex.components.radix.themes.typography.text import Text
from reflex.vars import Var
from ..base import (
CommonMarginProps,
LiteralAccentColor,
LiteralRadius,
LiteralSize,
LiteralVariant,
RadixThemesComponent,
)
@ -100,12 +103,6 @@ class Checkbox(CommonMarginProps, RadixThemesComponent):
]
] = 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,
default_checked: Optional[Union[Var[bool], bool]] = None,
checked: Optional[Union[Var[bool], bool]] = None,
disabled: Optional[Union[Var[bool], bool]] = None,
@ -223,7 +220,6 @@ class Checkbox(CommonMarginProps, RadixThemesComponent):
size: Button size "1" - "3"
variant: Variant of button: "solid" | "soft" | "outline" | "ghost"
high_contrast: Whether to render the button with higher contrast color against background
radius: Override theme radius for button: "none" | "small" | "medium" | "large" | "full"
default_checked: Whether the checkbox is checked by default
checked: Whether the checkbox is checked
disabled: Whether the checkbox is disabled
@ -249,3 +245,223 @@ class Checkbox(CommonMarginProps, RadixThemesComponent):
A new component instance.
"""
...
class HighLevelCheckbox(Checkbox):
@overload
@classmethod
def create( # type: ignore
cls,
*children,
as_child: Optional[Union[Var[bool], bool]] = None,
size: Optional[
Union[Var[Literal["1", "2", "3"]], Literal["1", "2", "3"]]
] = None,
variant: Optional[
Union[
Var[Literal["classic", "solid", "soft", "surface", "outline", "ghost"]],
Literal["classic", "solid", "soft", "surface", "outline", "ghost"],
]
] = None,
color: 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,
default_checked: Optional[Union[Var[bool], bool]] = None,
checked: Optional[Union[Var[bool], bool]] = None,
disabled: Optional[Union[Var[bool], bool]] = None,
required: Optional[Union[Var[bool], bool]] = None,
name: Optional[Union[Var[str], str]] = None,
value: Optional[Union[Var[str], str]] = None,
m: Optional[
Union[
Var[Literal["1", "2", "3", "4", "5", "6", "7", "8", "9"]],
Literal["1", "2", "3", "4", "5", "6", "7", "8", "9"],
]
] = None,
mx: Optional[
Union[
Var[Literal["1", "2", "3", "4", "5", "6", "7", "8", "9"]],
Literal["1", "2", "3", "4", "5", "6", "7", "8", "9"],
]
] = None,
my: Optional[
Union[
Var[Literal["1", "2", "3", "4", "5", "6", "7", "8", "9"]],
Literal["1", "2", "3", "4", "5", "6", "7", "8", "9"],
]
] = None,
mt: Optional[
Union[
Var[Literal["1", "2", "3", "4", "5", "6", "7", "8", "9"]],
Literal["1", "2", "3", "4", "5", "6", "7", "8", "9"],
]
] = None,
mr: Optional[
Union[
Var[Literal["1", "2", "3", "4", "5", "6", "7", "8", "9"]],
Literal["1", "2", "3", "4", "5", "6", "7", "8", "9"],
]
] = None,
mb: Optional[
Union[
Var[Literal["1", "2", "3", "4", "5", "6", "7", "8", "9"]],
Literal["1", "2", "3", "4", "5", "6", "7", "8", "9"],
]
] = None,
ml: Optional[
Union[
Var[Literal["1", "2", "3", "4", "5", "6", "7", "8", "9"]],
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_checked_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_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
) -> "HighLevelCheckbox":
"""Create a checkbox with a label.
Args:
text: The text of the label.
gap: The gap between the checkbox and the label.
size: The size of the checkbox.
as_child: Change the default rendered element for the one passed as a child, merging their props and behavior.
size: Button size "1" - "3"
variant: Variant of button: "solid" | "soft" | "outline" | "ghost"
color: Override theme color for button
high_contrast: Whether to render the button with higher contrast color against background
default_checked: Whether the checkbox is checked by default
checked: Whether the checkbox is checked
disabled: Whether the checkbox is disabled
required: Whether the checkbox is required
name: The name of the checkbox control when submitting the form.
value: The value of the checkbox control when submitting the form.
m: Margin: "0" - "9"
mx: Margin horizontal: "0" - "9"
my: Margin vertical: "0" - "9"
mt: Margin top: "0" - "9"
mr: Margin right: "0" - "9"
mb: Margin bottom: "0" - "9"
ml: Margin left: "0" - "9"
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: Additional properties to apply to the checkbox item.
Returns:
The checkbox component with a label.
"""
...