12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758 |
- """A button component."""
- from reflex.components.libs.chakra import ChakraComponent
- from reflex.vars import Var
- class Button(ChakraComponent):
- """The Button component is used to trigger an event or event, such as submitting a form, opening a dialog, canceling an event, or performing a delete operation."""
- tag = "Button"
- # The space between the button icon and label.
- icon_spacing: Var[int]
- # If true, the button will be styled in its active state.
- is_active: Var[bool]
- # If true, the button will be styled in its disabled state.
- is_disabled: Var[bool]
- # If true, the button will take up the full width of its container.
- is_full_width: Var[bool]
- # If true, the button will show a spinner.
- is_loading: Var[bool]
- # The label to show in the button when isLoading is true If no text is passed, it only shows the spinner.
- loading_text: Var[str]
- # "lg" | "md" | "sm" | "xs"
- size: Var[str]
- # "ghost" | "outline" | "solid" | "link" | "unstyled"
- variant: Var[str]
- # Built in color scheme for ease of use.
- # Options:
- # "whiteAlpha" | "blackAlpha" | "gray" | "red" | "orange" | "yellow" | "green" | "teal" | "blue" | "cyan"
- # | "purple" | "pink" | "linkedin" | "facebook" | "messenger" | "whatsapp" | "twitter" | "telegram"
- color_scheme: Var[str]
- # The type of button.
- type_: Var[str]
- class ButtonGroup(ChakraComponent):
- """A group of buttons."""
- tag = "ButtonGroup"
- # If true, the borderRadius of button that are direct children will be altered to look flushed together.
- is_attached: Var[bool]
- # If true, all wrapped button will be disabled.
- is_disabled: Var[bool]
- # The spacing between the buttons.
- spacing: Var[int]
|