checkbox.py 2.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182
  1. """A checkbox component."""
  2. from typing import Set
  3. from pynecone.components.component import EVENT_ARG
  4. from pynecone.components.libs.chakra import ChakraComponent
  5. from pynecone.var import Var
  6. class Checkbox(ChakraComponent):
  7. """The Checkbox component is used in forms when a user needs to select multiple values from several options."""
  8. tag = "Checkbox"
  9. # Color scheme for checkbox.
  10. color_scheme: Var[str]
  11. # "sm" | "md" | "lg"
  12. size: Var[str]
  13. # If true, the checkbox will be checked.
  14. is_checked: Var[bool]
  15. # If true, the checkbox will be disabled
  16. is_disabled: Var[bool]
  17. # If true and is_disabled is passed, the checkbox will remain tabbable but not interactive
  18. is_focusable: Var[bool]
  19. # If true, the checkbox will be indeterminate. This only affects the icon shown inside checkbox and does not modify the is_checked var.
  20. is_indeterminate: Var[bool]
  21. # If true, the checkbox is marked as invalid. Changes style of unchecked state.
  22. is_invalid: Var[bool]
  23. # If true, the checkbox will be readonly
  24. is_read_only: Var[bool]
  25. # If true, the checkbox input is marked as required, and required attribute will be added
  26. is_required: Var[bool]
  27. # The name of the input field in a checkbox (Useful for form submission).
  28. name: Var[str]
  29. # The spacing between the checkbox and its label text (0.5rem)
  30. spacing: Var[str]
  31. @classmethod
  32. def get_controlled_triggers(cls) -> Set[str]:
  33. """Get the event triggers that pass the component's value to the handler.
  34. Returns:
  35. The controlled event triggers.
  36. """
  37. return {"on_change"}
  38. @classmethod
  39. def get_controlled_value(cls) -> Var:
  40. """Get the var that is passed to the event handler for controlled triggers.
  41. Returns:
  42. The controlled value.
  43. """
  44. return EVENT_ARG.target.checked
  45. class CheckboxGroup(ChakraComponent):
  46. """A group of checkboxes."""
  47. tag = "CheckboxGroup"
  48. # The value of the checkbox group
  49. value: Var[str]
  50. # The initial value of the checkbox group
  51. default_value: Var[str]
  52. # If true, all wrapped checkbox inputs will be disabled
  53. is_disabled: Var[bool]
  54. # If true, input elements will receive checked attribute instead of isChecked. This assumes, you're using native radio inputs
  55. is_native: Var[bool]