hooks.py 2.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889
  1. """Add standard Hooks wrapper for React."""
  2. from __future__ import annotations
  3. from reflex.utils.imports import ImportVar
  4. from reflex.vars import Var, VarData
  5. def _compose_react_imports(tags: list[str]) -> dict[str, list[ImportVar]]:
  6. return {"react": [ImportVar(tag=tag, install=False) for tag in tags]}
  7. def const(name, value) -> Var:
  8. """Create a constant Var.
  9. Args:
  10. name: The name of the constant.
  11. value: The value of the constant.
  12. Returns:
  13. The constant Var.
  14. """
  15. if isinstance(name, list):
  16. return Var.create_safe(f"const [{', '.join(name)}] = {value}")
  17. return Var.create_safe(f"const {name} = {value}")
  18. def useCallback(func, deps) -> Var:
  19. """Create a useCallback hook with a function and dependencies.
  20. Args:
  21. func: The function to wrap.
  22. deps: The dependencies of the function.
  23. Returns:
  24. The useCallback hook.
  25. """
  26. return Var.create_safe(
  27. f"useCallback({func}, {deps})" if deps else f"useCallback({func})",
  28. _var_data=VarData(imports=_compose_react_imports(["useCallback"])),
  29. )
  30. def useContext(context) -> Var:
  31. """Create a useContext hook with a context.
  32. Args:
  33. context: The context to use.
  34. Returns:
  35. The useContext hook.
  36. """
  37. return Var.create_safe(
  38. f"useContext({context})",
  39. _var_data=VarData(imports=_compose_react_imports(["useContext"])),
  40. )
  41. def useRef(default) -> Var:
  42. """Create a useRef hook with a default value.
  43. Args:
  44. default: The default value of the ref.
  45. Returns:
  46. The useRef hook.
  47. """
  48. return Var.create_safe(
  49. f"useRef({default})",
  50. _var_data=VarData(imports=_compose_react_imports(["useRef"])),
  51. )
  52. def useState(var_name, default=None) -> Var:
  53. """Create a useState hook with a variable name and setter name.
  54. Args:
  55. var_name: The name of the variable.
  56. default: The default value of the variable.
  57. Returns:
  58. A useState hook.
  59. """
  60. return const(
  61. [var_name, f"set{var_name.capitalize()}"],
  62. Var.create_safe(
  63. f"useState({default})",
  64. _var_data=VarData(imports=_compose_react_imports(["useState"])),
  65. ),
  66. )