b2d2719f90
* add type hinting to events * fix pyi * make it a list * add on change * dang it darglintz * add future annotations * add try except becuse i hate this * add check for class * aaaa * sometimes you need to make hard decisions * ono * i hate unions * add rx event * move stuff around * maybe * special case osmething * i don't need no test * remove stray print Co-authored-by: Masen Furer <m_github@0x26.net> * remove another stray print Co-authored-by: Masen Furer <m_github@0x26.net> * add rx event --------- Co-authored-by: Masen Furer <m_github@0x26.net>
156 lines
4.2 KiB
Python
156 lines
4.2 KiB
Python
"""Interactive components provided by @radix-ui/themes."""
|
|
|
|
from typing import Literal
|
|
|
|
from reflex.components.component import Component, ComponentNamespace
|
|
from reflex.components.core.breakpoints import Responsive
|
|
from reflex.components.radix.themes.layout.flex import Flex
|
|
from reflex.components.radix.themes.typography.text import Text
|
|
from reflex.event import EventHandler, identity_event
|
|
from reflex.vars.base import LiteralVar, Var
|
|
|
|
from ..base import (
|
|
LiteralAccentColor,
|
|
LiteralSpacing,
|
|
RadixThemesComponent,
|
|
)
|
|
|
|
LiteralCheckboxSize = Literal["1", "2", "3"]
|
|
LiteralCheckboxVariant = Literal["classic", "surface", "soft"]
|
|
|
|
|
|
class Checkbox(RadixThemesComponent):
|
|
"""Selects a single value, typically for submission in a form."""
|
|
|
|
tag = "Checkbox"
|
|
|
|
# Change the default rendered element for the one passed as a child, merging their props and behavior.
|
|
as_child: Var[bool]
|
|
|
|
# Checkbox size "1" - "3"
|
|
size: Var[Responsive[LiteralCheckboxSize]]
|
|
|
|
# Variant of checkbox: "classic" | "surface" | "soft"
|
|
variant: Var[LiteralCheckboxVariant]
|
|
|
|
# Override theme color for checkbox
|
|
color_scheme: Var[LiteralAccentColor]
|
|
|
|
# Whether to render the checkbox with higher contrast color against background
|
|
high_contrast: Var[bool]
|
|
|
|
# Whether the checkbox is checked by default
|
|
default_checked: Var[bool]
|
|
|
|
# Whether the checkbox is checked
|
|
checked: Var[bool]
|
|
|
|
# Whether the checkbox is disabled
|
|
disabled: Var[bool]
|
|
|
|
# Whether the checkbox is required
|
|
required: Var[bool]
|
|
|
|
# The name of the checkbox control when submitting the form.
|
|
name: Var[str]
|
|
|
|
# The value of the checkbox control when submitting the form.
|
|
value: Var[str]
|
|
|
|
# Props to rename
|
|
_rename_props = {"onChange": "onCheckedChange"}
|
|
|
|
# Fired when the checkbox is checked or unchecked.
|
|
on_change: EventHandler[identity_event(bool)]
|
|
|
|
|
|
class HighLevelCheckbox(RadixThemesComponent):
|
|
"""A checkbox component with a label."""
|
|
|
|
tag = "Checkbox"
|
|
|
|
# The text label for the checkbox.
|
|
text: Var[str]
|
|
|
|
# The gap between the checkbox and the label.
|
|
spacing: Var[LiteralSpacing]
|
|
|
|
# The size of the checkbox "1" - "3".
|
|
size: Var[LiteralCheckboxSize]
|
|
|
|
# Change the default rendered element for the one passed as a child, merging their props and behavior.
|
|
as_child: Var[bool]
|
|
|
|
# Variant of checkbox: "classic" | "surface" | "soft"
|
|
variant: Var[LiteralCheckboxVariant]
|
|
|
|
# Override theme color for checkbox
|
|
color_scheme: Var[LiteralAccentColor]
|
|
|
|
# Whether to render the checkbox with higher contrast color against background
|
|
high_contrast: Var[bool]
|
|
|
|
# Whether the checkbox is checked by default
|
|
default_checked: Var[bool]
|
|
|
|
# Whether the checkbox is checked
|
|
checked: Var[bool]
|
|
|
|
# Whether the checkbox is disabled
|
|
disabled: Var[bool]
|
|
|
|
# Whether the checkbox is required
|
|
required: Var[bool]
|
|
|
|
# The name of the checkbox control when submitting the form.
|
|
name: Var[str]
|
|
|
|
# The value of the checkbox control when submitting the form.
|
|
value: Var[str]
|
|
|
|
# Props to rename
|
|
_rename_props = {"onChange": "onCheckedChange"}
|
|
|
|
# Fired when the checkbox is checked or unchecked.
|
|
on_change: EventHandler[identity_event(bool)]
|
|
|
|
@classmethod
|
|
def create(cls, text: Var[str] = LiteralVar.create(""), **props) -> Component:
|
|
"""Create a checkbox with a label.
|
|
|
|
Args:
|
|
text: The text of the label.
|
|
**props: Additional properties to apply to the checkbox item.
|
|
|
|
Returns:
|
|
The checkbox component with a label.
|
|
"""
|
|
spacing = props.pop("spacing", "2")
|
|
size = props.pop("size", "2")
|
|
flex_props = {}
|
|
if "gap" in props:
|
|
flex_props["gap"] = props.pop("gap", None)
|
|
|
|
return Text.create(
|
|
Flex.create(
|
|
Checkbox.create(
|
|
size=size,
|
|
**props,
|
|
),
|
|
text,
|
|
spacing=spacing,
|
|
**flex_props,
|
|
),
|
|
as_="label",
|
|
size=size,
|
|
)
|
|
|
|
|
|
class CheckboxNamespace(ComponentNamespace):
|
|
"""Checkbox components namespace."""
|
|
|
|
__call__ = staticmethod(HighLevelCheckbox.create)
|
|
|
|
|
|
checkbox = CheckboxNamespace()
|