1
0

slider.py 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103
  1. """A slider component."""
  2. from typing import Dict
  3. from pynecone.components.component import Component
  4. from pynecone.components.libs.chakra import ChakraComponent
  5. from pynecone.event import EVENT_ARG
  6. from pynecone.var import Var
  7. class Slider(ChakraComponent):
  8. """The wrapper that provides context and functionality for all children."""
  9. tag = "Slider"
  10. # State var to bind the the input.
  11. value: Var[int]
  12. # The placeholder text.
  13. default_value: Var[int]
  14. # The writing mode ("ltr" | "rtl")
  15. direction: Var[str]
  16. # If false, the slider handle will not capture focus when value changes.
  17. focus_thumb_on_change: Var[bool]
  18. # If true, the slider will be disabled
  19. is_disabled: Var[bool]
  20. # If true, the slider will be in `read-only` state.
  21. is_read_only: Var[bool]
  22. # If true, the value will be incremented or decremented in reverse.
  23. is_reversed: Var[bool]
  24. # The minimum value of the slider.
  25. min_: Var[int]
  26. # The maximum value of the slider.
  27. max_: Var[int]
  28. # The minimum distance between slider thumbs. Useful for preventing the thumbs from being too close together.
  29. min_steps_between_thumbs: Var[int]
  30. @classmethod
  31. def get_controlled_triggers(cls) -> Dict[str, Var]:
  32. """Get the event triggers that pass the component's value to the handler.
  33. Returns:
  34. A dict mapping the event trigger to the var that is passed to the handler.
  35. """
  36. return {
  37. "on_change": EVENT_ARG,
  38. "on_change_end": EVENT_ARG,
  39. "on_change_start": EVENT_ARG,
  40. }
  41. @classmethod
  42. def create(cls, *children, **props) -> Component:
  43. """Create a slider component.
  44. If no children are provided, a default slider will be created.
  45. Args:
  46. children: The children of the component.
  47. props: The properties of the component.
  48. Returns:
  49. The slider component.
  50. """
  51. if len(children) == 0:
  52. children = [
  53. SliderTrack.create(
  54. SliderFilledTrack.create(),
  55. ),
  56. SliderThumb.create(),
  57. ]
  58. return super().create(*children, **props)
  59. class SliderTrack(ChakraComponent):
  60. """The empty part of the slider that shows the track."""
  61. tag = "SliderTrack"
  62. class SliderFilledTrack(ChakraComponent):
  63. """The filled part of the slider."""
  64. tag = "SliderFilledTrack"
  65. class SliderThumb(ChakraComponent):
  66. """The handle that's used to change the slider value."""
  67. tag = "SliderThumb"
  68. class SliderMark(ChakraComponent):
  69. """The label or mark that shows names for specific slider values."""
  70. tag = "SliderMark"