reflex 0.6.0a1__py3-none-any.whl → 0.6.0a3__py3-none-any.whl

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Potentially problematic release.


This version of reflex might be problematic. Click here for more details.

Files changed (252) hide show
  1. reflex/.templates/jinja/custom_components/pyproject.toml.jinja2 +2 -2
  2. reflex/.templates/jinja/web/pages/_app.js.jinja2 +1 -1
  3. reflex/.templates/jinja/web/pages/utils.js.jinja2 +2 -2
  4. reflex/__init__.py +8 -2
  5. reflex/__init__.pyi +2 -1
  6. reflex/app.py +10 -4
  7. reflex/base.py +1 -1
  8. reflex/compiler/compiler.py +2 -2
  9. reflex/compiler/utils.py +3 -3
  10. reflex/components/base/app_wrap.py +2 -2
  11. reflex/components/base/app_wrap.pyi +17 -27
  12. reflex/components/base/bare.py +4 -5
  13. reflex/components/base/body.pyi +17 -27
  14. reflex/components/base/document.pyi +81 -131
  15. reflex/components/base/error_boundary.py +6 -7
  16. reflex/components/base/error_boundary.pyi +20 -33
  17. reflex/components/base/fragment.pyi +17 -27
  18. reflex/components/base/head.pyi +33 -53
  19. reflex/components/base/link.py +1 -1
  20. reflex/components/base/link.pyi +33 -54
  21. reflex/components/base/meta.pyi +65 -105
  22. reflex/components/base/script.py +1 -2
  23. reflex/components/base/script.pyi +21 -38
  24. reflex/components/component.py +45 -47
  25. reflex/components/core/banner.py +23 -27
  26. reflex/components/core/banner.pyi +134 -171
  27. reflex/components/core/breakpoints.py +3 -1
  28. reflex/components/core/client_side_routing.py +2 -3
  29. reflex/components/core/client_side_routing.pyi +33 -54
  30. reflex/components/core/clipboard.py +2 -1
  31. reflex/components/core/clipboard.pyi +20 -33
  32. reflex/components/core/cond.py +5 -5
  33. reflex/components/core/debounce.py +5 -5
  34. reflex/components/core/debounce.pyi +20 -33
  35. reflex/components/core/foreach.py +3 -4
  36. reflex/components/core/html.py +1 -1
  37. reflex/components/core/html.pyi +35 -46
  38. reflex/components/core/match.py +17 -17
  39. reflex/components/core/upload.py +17 -23
  40. reflex/components/core/upload.pyi +78 -124
  41. reflex/components/datadisplay/code.py +9 -10
  42. reflex/components/datadisplay/code.pyi +302 -412
  43. reflex/components/datadisplay/dataeditor.py +8 -10
  44. reflex/components/datadisplay/dataeditor.pyi +40 -53
  45. reflex/components/el/element.pyi +17 -27
  46. reflex/components/el/elements/base.py +1 -1
  47. reflex/components/el/elements/base.pyi +34 -45
  48. reflex/components/el/elements/forms.py +16 -16
  49. reflex/components/el/elements/forms.pyi +554 -707
  50. reflex/components/el/elements/inline.py +1 -1
  51. reflex/components/el/elements/inline.pyi +937 -1218
  52. reflex/components/el/elements/media.py +1 -1
  53. reflex/components/el/elements/media.pyi +786 -997
  54. reflex/components/el/elements/metadata.py +3 -6
  55. reflex/components/el/elements/metadata.pyi +181 -242
  56. reflex/components/el/elements/other.py +1 -1
  57. reflex/components/el/elements/other.pyi +235 -306
  58. reflex/components/el/elements/scripts.py +1 -1
  59. reflex/components/el/elements/scripts.pyi +109 -140
  60. reflex/components/el/elements/sectioning.py +0 -2
  61. reflex/components/el/elements/sectioning.pyi +496 -647
  62. reflex/components/el/elements/tables.py +1 -1
  63. reflex/components/el/elements/tables.pyi +351 -452
  64. reflex/components/el/elements/typography.py +1 -1
  65. reflex/components/el/elements/typography.pyi +506 -657
  66. reflex/components/gridjs/datatable.py +6 -9
  67. reflex/components/gridjs/datatable.pyi +35 -56
  68. reflex/components/lucide/icon.py +1 -1
  69. reflex/components/lucide/icon.pyi +33 -54
  70. reflex/components/markdown/markdown.py +26 -31
  71. reflex/components/markdown/markdown.pyi +27 -37
  72. reflex/components/moment/moment.py +13 -12
  73. reflex/components/moment/moment.pyi +23 -35
  74. reflex/components/next/base.pyi +17 -27
  75. reflex/components/next/image.py +1 -1
  76. reflex/components/next/image.pyi +22 -37
  77. reflex/components/next/link.py +1 -1
  78. reflex/components/next/link.pyi +17 -28
  79. reflex/components/next/video.py +1 -1
  80. reflex/components/next/video.pyi +17 -28
  81. reflex/components/plotly/plotly.py +12 -13
  82. reflex/components/plotly/plotly.pyi +39 -54
  83. reflex/components/props.py +1 -1
  84. reflex/components/radix/__init__.pyi +1 -0
  85. reflex/components/radix/primitives/__init__.pyi +1 -0
  86. reflex/components/radix/primitives/accordion.py +4 -4
  87. reflex/components/radix/primitives/accordion.pyi +424 -495
  88. reflex/components/radix/primitives/base.py +1 -1
  89. reflex/components/radix/primitives/base.pyi +33 -54
  90. reflex/components/radix/primitives/drawer.py +1 -1
  91. reflex/components/radix/primitives/drawer.pyi +172 -273
  92. reflex/components/radix/primitives/form.py +1 -1
  93. reflex/components/radix/primitives/form.pyi +257 -364
  94. reflex/components/radix/primitives/progress.py +1 -1
  95. reflex/components/radix/primitives/progress.pyi +231 -282
  96. reflex/components/radix/primitives/slider.py +1 -1
  97. reflex/components/radix/primitives/slider.pyi +87 -138
  98. reflex/components/radix/themes/base.py +3 -24
  99. reflex/components/radix/themes/base.pyi +178 -250
  100. reflex/components/radix/themes/color_mode.py +5 -5
  101. reflex/components/radix/themes/color_mode.pyi +187 -220
  102. reflex/components/radix/themes/components/alert_dialog.py +1 -1
  103. reflex/components/radix/themes/components/alert_dialog.pyi +136 -207
  104. reflex/components/radix/themes/components/aspect_ratio.py +1 -1
  105. reflex/components/radix/themes/components/aspect_ratio.pyi +17 -28
  106. reflex/components/radix/themes/components/avatar.py +1 -1
  107. reflex/components/radix/themes/components/avatar.pyi +70 -81
  108. reflex/components/radix/themes/components/badge.py +1 -1
  109. reflex/components/radix/themes/components/badge.pyi +88 -99
  110. reflex/components/radix/themes/components/button.py +1 -1
  111. reflex/components/radix/themes/components/button.pyi +98 -109
  112. reflex/components/radix/themes/components/callout.py +1 -1
  113. reflex/components/radix/themes/components/callout.pyi +322 -373
  114. reflex/components/radix/themes/components/card.py +1 -1
  115. reflex/components/radix/themes/components/card.pyi +38 -49
  116. reflex/components/radix/themes/components/checkbox.py +1 -2
  117. reflex/components/radix/themes/components/checkbox.pyi +208 -245
  118. reflex/components/radix/themes/components/checkbox_cards.py +1 -1
  119. reflex/components/radix/themes/components/checkbox_cards.pyi +94 -115
  120. reflex/components/radix/themes/components/checkbox_group.py +1 -1
  121. reflex/components/radix/themes/components/checkbox_group.pyi +86 -107
  122. reflex/components/radix/themes/components/context_menu.py +1 -1
  123. reflex/components/radix/themes/components/context_menu.pyi +238 -319
  124. reflex/components/radix/themes/components/data_list.py +1 -1
  125. reflex/components/radix/themes/components/data_list.pyi +130 -171
  126. reflex/components/radix/themes/components/dialog.py +1 -1
  127. reflex/components/radix/themes/components/dialog.pyi +139 -210
  128. reflex/components/radix/themes/components/dropdown_menu.py +1 -1
  129. reflex/components/radix/themes/components/dropdown_menu.pyi +249 -332
  130. reflex/components/radix/themes/components/hover_card.py +1 -1
  131. reflex/components/radix/themes/components/hover_card.pyi +90 -131
  132. reflex/components/radix/themes/components/icon_button.py +2 -3
  133. reflex/components/radix/themes/components/icon_button.pyi +98 -109
  134. reflex/components/radix/themes/components/inset.py +1 -1
  135. reflex/components/radix/themes/components/inset.pyi +47 -58
  136. reflex/components/radix/themes/components/popover.py +1 -1
  137. reflex/components/radix/themes/components/popover.pyi +95 -136
  138. reflex/components/radix/themes/components/progress.py +1 -1
  139. reflex/components/radix/themes/components/progress.pyi +71 -82
  140. reflex/components/radix/themes/components/radio.py +1 -1
  141. reflex/components/radix/themes/components/radio.pyi +69 -80
  142. reflex/components/radix/themes/components/radio_cards.py +1 -1
  143. reflex/components/radix/themes/components/radio_cards.pyi +98 -119
  144. reflex/components/radix/themes/components/radio_group.py +8 -11
  145. reflex/components/radix/themes/components/radio_group.pyi +228 -271
  146. reflex/components/radix/themes/components/scroll_area.py +1 -1
  147. reflex/components/radix/themes/components/scroll_area.pyi +21 -32
  148. reflex/components/radix/themes/components/segmented_control.py +1 -1
  149. reflex/components/radix/themes/components/segmented_control.pyi +90 -113
  150. reflex/components/radix/themes/components/select.py +2 -3
  151. reflex/components/radix/themes/components/select.pyi +374 -471
  152. reflex/components/radix/themes/components/separator.py +1 -2
  153. reflex/components/radix/themes/components/separator.pyi +69 -80
  154. reflex/components/radix/themes/components/skeleton.py +1 -1
  155. reflex/components/radix/themes/components/skeleton.pyi +23 -34
  156. reflex/components/radix/themes/components/slider.py +2 -3
  157. reflex/components/radix/themes/components/slider.pyi +75 -88
  158. reflex/components/radix/themes/components/spinner.py +1 -1
  159. reflex/components/radix/themes/components/spinner.pyi +19 -30
  160. reflex/components/radix/themes/components/switch.py +1 -1
  161. reflex/components/radix/themes/components/switch.pyi +71 -84
  162. reflex/components/radix/themes/components/table.py +1 -1
  163. reflex/components/radix/themes/components/table.pyi +261 -332
  164. reflex/components/radix/themes/components/tabs.py +1 -1
  165. reflex/components/radix/themes/components/tabs.pyi +139 -194
  166. reflex/components/radix/themes/components/text_area.py +1 -1
  167. reflex/components/radix/themes/components/text_area.pyi +96 -111
  168. reflex/components/radix/themes/components/text_field.py +1 -1
  169. reflex/components/radix/themes/components/text_field.pyi +247 -286
  170. reflex/components/radix/themes/components/tooltip.py +1 -1
  171. reflex/components/radix/themes/components/tooltip.pyi +26 -37
  172. reflex/components/radix/themes/layout/__init__.pyi +1 -0
  173. reflex/components/radix/themes/layout/base.py +1 -1
  174. reflex/components/radix/themes/layout/base.pyi +56 -67
  175. reflex/components/radix/themes/layout/box.pyi +34 -45
  176. reflex/components/radix/themes/layout/center.pyi +56 -67
  177. reflex/components/radix/themes/layout/container.py +1 -2
  178. reflex/components/radix/themes/layout/container.pyi +36 -47
  179. reflex/components/radix/themes/layout/flex.py +1 -1
  180. reflex/components/radix/themes/layout/flex.pyi +56 -67
  181. reflex/components/radix/themes/layout/grid.py +1 -1
  182. reflex/components/radix/themes/layout/grid.pyi +64 -75
  183. reflex/components/radix/themes/layout/list.py +5 -6
  184. reflex/components/radix/themes/layout/list.pyi +193 -244
  185. reflex/components/radix/themes/layout/section.py +1 -2
  186. reflex/components/radix/themes/layout/section.pyi +36 -47
  187. reflex/components/radix/themes/layout/spacer.pyi +56 -67
  188. reflex/components/radix/themes/layout/stack.py +1 -1
  189. reflex/components/radix/themes/layout/stack.pyi +128 -159
  190. reflex/components/radix/themes/typography/blockquote.py +1 -1
  191. reflex/components/radix/themes/typography/blockquote.pyi +89 -100
  192. reflex/components/radix/themes/typography/code.py +1 -1
  193. reflex/components/radix/themes/typography/code.pyi +90 -101
  194. reflex/components/radix/themes/typography/heading.py +1 -1
  195. reflex/components/radix/themes/typography/heading.pyi +96 -107
  196. reflex/components/radix/themes/typography/link.py +1 -1
  197. reflex/components/radix/themes/typography/link.pyi +102 -113
  198. reflex/components/radix/themes/typography/text.py +1 -1
  199. reflex/components/radix/themes/typography/text.pyi +501 -572
  200. reflex/components/react_player/audio.pyi +33 -60
  201. reflex/components/react_player/react_player.py +1 -1
  202. reflex/components/react_player/react_player.pyi +33 -60
  203. reflex/components/react_player/video.pyi +33 -60
  204. reflex/components/recharts/cartesian.py +2 -3
  205. reflex/components/recharts/cartesian.pyi +678 -861
  206. reflex/components/recharts/charts.py +4 -5
  207. reflex/components/recharts/charts.pyi +252 -357
  208. reflex/components/recharts/general.py +1 -2
  209. reflex/components/recharts/general.pyi +180 -231
  210. reflex/components/recharts/polar.py +4 -5
  211. reflex/components/recharts/polar.pyi +144 -181
  212. reflex/components/recharts/recharts.pyi +33 -53
  213. reflex/components/sonner/toast.py +16 -17
  214. reflex/components/sonner/toast.pyi +36 -47
  215. reflex/components/suneditor/editor.py +2 -3
  216. reflex/components/suneditor/editor.pyi +55 -78
  217. reflex/components/tags/cond_tag.py +6 -4
  218. reflex/components/tags/iter_tag.py +28 -16
  219. reflex/components/tags/match_tag.py +6 -4
  220. reflex/components/tags/tag.py +40 -23
  221. reflex/custom_components/custom_components.py +3 -1
  222. reflex/event.py +115 -67
  223. reflex/experimental/client_state.py +18 -18
  224. reflex/experimental/hooks.py +16 -16
  225. reflex/experimental/layout.py +5 -5
  226. reflex/experimental/layout.pyi +136 -187
  227. reflex/middleware/hydrate_middleware.py +2 -0
  228. reflex/middleware/middleware.py +3 -3
  229. reflex/state.py +149 -82
  230. reflex/style.py +21 -22
  231. reflex/utils/exceptions.py +20 -0
  232. reflex/utils/format.py +54 -34
  233. reflex/utils/imports.py +16 -73
  234. reflex/utils/prerequisites.py +15 -8
  235. reflex/utils/pyi_generator.py +13 -8
  236. reflex/utils/serializers.py +12 -22
  237. reflex/utils/telemetry.py +3 -2
  238. reflex/utils/types.py +11 -6
  239. reflex/{ivars → vars}/__init__.py +6 -2
  240. reflex/{ivars → vars}/base.py +599 -216
  241. reflex/{ivars → vars}/function.py +15 -19
  242. reflex/{ivars → vars}/number.py +41 -20
  243. reflex/{ivars → vars}/object.py +28 -30
  244. reflex/{ivars → vars}/sequence.py +53 -42
  245. {reflex-0.6.0a1.dist-info → reflex-0.6.0a3.dist-info}/METADATA +4 -6
  246. reflex-0.6.0a3.dist-info/RECORD +382 -0
  247. reflex/.templates/web/components/reflex/chakra_color_mode_provider.js +0 -36
  248. reflex/vars.py +0 -501
  249. reflex-0.6.0a1.dist-info/RECORD +0 -384
  250. {reflex-0.6.0a1.dist-info → reflex-0.6.0a3.dist-info}/LICENSE +0 -0
  251. {reflex-0.6.0a1.dist-info → reflex-0.6.0a3.dist-info}/WHEEL +0 -0
  252. {reflex-0.6.0a1.dist-info → reflex-0.6.0a3.dist-info}/entry_points.txt +0 -0
@@ -7,9 +7,8 @@ from typing import Any, Callable, Dict, Literal, Optional, Union, overload
7
7
 
8
8
  from reflex.components.component import Component
9
9
  from reflex.event import EventHandler, EventSpec
10
- from reflex.ivars.base import ImmutableVar
11
10
  from reflex.style import Style
12
- from reflex.vars import Var
11
+ from reflex.vars.base import Var
13
12
 
14
13
  class Script(Component):
15
14
  @overload
@@ -20,8 +19,8 @@ class Script(Component):
20
19
  src: Optional[Union[Var[str], str]] = None,
21
20
  strategy: Optional[
22
21
  Union[
23
- Var[Literal["afterInteractive", "beforeInteractive", "lazyOnload"]],
24
22
  Literal["afterInteractive", "beforeInteractive", "lazyOnload"],
23
+ Var[Literal["afterInteractive", "beforeInteractive", "lazyOnload"]],
25
24
  ]
26
25
  ] = None,
27
26
  style: Optional[Style] = None,
@@ -29,60 +28,44 @@ class Script(Component):
29
28
  id: Optional[Any] = None,
30
29
  class_name: Optional[Any] = None,
31
30
  autofocus: Optional[bool] = None,
32
- custom_attrs: Optional[Dict[str, Union[ImmutableVar, str]]] = None,
33
- on_blur: Optional[
34
- Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
35
- ] = None,
36
- on_click: Optional[
37
- Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
38
- ] = None,
31
+ custom_attrs: Optional[Dict[str, Union[Var, str]]] = None,
32
+ on_blur: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
33
+ on_click: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
39
34
  on_context_menu: Optional[
40
- Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
35
+ Union[EventHandler, EventSpec, list, Callable, Var]
41
36
  ] = None,
42
37
  on_double_click: Optional[
43
- Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
44
- ] = None,
45
- on_error: Optional[
46
- Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
47
- ] = None,
48
- on_focus: Optional[
49
- Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
50
- ] = None,
51
- on_load: Optional[
52
- Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
53
- ] = None,
54
- on_mount: Optional[
55
- Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
38
+ Union[EventHandler, EventSpec, list, Callable, Var]
56
39
  ] = None,
40
+ on_error: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
41
+ on_focus: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
42
+ on_load: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
43
+ on_mount: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
57
44
  on_mouse_down: Optional[
58
- Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
45
+ Union[EventHandler, EventSpec, list, Callable, Var]
59
46
  ] = None,
60
47
  on_mouse_enter: Optional[
61
- Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
48
+ Union[EventHandler, EventSpec, list, Callable, Var]
62
49
  ] = None,
63
50
  on_mouse_leave: Optional[
64
- Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
51
+ Union[EventHandler, EventSpec, list, Callable, Var]
65
52
  ] = None,
66
53
  on_mouse_move: Optional[
67
- Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
54
+ Union[EventHandler, EventSpec, list, Callable, Var]
68
55
  ] = None,
69
56
  on_mouse_out: Optional[
70
- Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
57
+ Union[EventHandler, EventSpec, list, Callable, Var]
71
58
  ] = None,
72
59
  on_mouse_over: Optional[
73
- Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
60
+ Union[EventHandler, EventSpec, list, Callable, Var]
74
61
  ] = None,
75
62
  on_mouse_up: Optional[
76
- Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
77
- ] = None,
78
- on_ready: Optional[
79
- Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
80
- ] = None,
81
- on_scroll: Optional[
82
- Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
63
+ Union[EventHandler, EventSpec, list, Callable, Var]
83
64
  ] = None,
65
+ on_ready: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
66
+ on_scroll: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
84
67
  on_unmount: Optional[
85
- Union[EventHandler, EventSpec, list, Callable, ImmutableVar]
68
+ Union[EventHandler, EventSpec, list, Callable, Var]
86
69
  ] = None,
87
70
  **props,
88
71
  ) -> "Script":
@@ -43,7 +43,6 @@ from reflex.event import (
43
43
  call_event_handler,
44
44
  get_handler_args,
45
45
  )
46
- from reflex.ivars.base import ImmutableVar, LiteralVar
47
46
  from reflex.style import Style, format_as_emotion
48
47
  from reflex.utils import format, imports, types
49
48
  from reflex.utils.imports import (
@@ -54,7 +53,8 @@ from reflex.utils.imports import (
54
53
  parse_imports,
55
54
  )
56
55
  from reflex.utils.serializers import serializer
57
- from reflex.vars import Var, VarData
56
+ from reflex.vars import VarData
57
+ from reflex.vars.base import LiteralVar, Var
58
58
 
59
59
 
60
60
  class BaseComponent(Base, ABC):
@@ -177,7 +177,7 @@ class Component(BaseComponent, ABC):
177
177
  style: Style = Style()
178
178
 
179
179
  # A mapping from event triggers to event chains.
180
- event_triggers: Dict[str, Union[EventChain, ImmutableVar]] = {}
180
+ event_triggers: Dict[str, Union[EventChain, Var]] = {}
181
181
 
182
182
  # The alias for the tag.
183
183
  alias: Optional[str] = None
@@ -195,7 +195,7 @@ class Component(BaseComponent, ABC):
195
195
  class_name: Any = None
196
196
 
197
197
  # Special component props.
198
- special_props: Set[ImmutableVar] = set()
198
+ special_props: List[Var] = []
199
199
 
200
200
  # Whether the component should take the focus once the page is loaded
201
201
  autofocus: bool = False
@@ -213,7 +213,7 @@ class Component(BaseComponent, ABC):
213
213
  _rename_props: Dict[str, str] = {}
214
214
 
215
215
  # custom attribute
216
- custom_attrs: Dict[str, Union[ImmutableVar, str]] = {}
216
+ custom_attrs: Dict[str, Union[Var, str]] = {}
217
217
 
218
218
  # When to memoize this component and its children.
219
219
  _memoization_mode: MemoizationMode = MemoizationMode()
@@ -249,7 +249,7 @@ class Component(BaseComponent, ABC):
249
249
  """
250
250
  return {}
251
251
 
252
- def add_hooks(self) -> list[str | ImmutableVar]:
252
+ def add_hooks(self) -> list[str | Var]:
253
253
  """Add hooks inside the component function.
254
254
 
255
255
  Hooks are pieces of literal Javascript code that is inserted inside the
@@ -404,7 +404,7 @@ class Component(BaseComponent, ABC):
404
404
  passed_types = None
405
405
  try:
406
406
  # Try to create a var from the value.
407
- if isinstance(value, ImmutableVar):
407
+ if isinstance(value, Var):
408
408
  kwargs[key] = value
409
409
  else:
410
410
  kwargs[key] = LiteralVar.create(value)
@@ -447,9 +447,7 @@ class Component(BaseComponent, ABC):
447
447
  not passed_types
448
448
  and not types._issubclass(passed_type, expected_type, value)
449
449
  ):
450
- value_name = (
451
- value._var_name if isinstance(value, ImmutableVar) else value
452
- )
450
+ value_name = value._js_expr if isinstance(value, Var) else value
453
451
  raise TypeError(
454
452
  f"Invalid var passed for prop {type(self).__name__}.{key}, expected type {expected_type}, got value {value_name} of type {passed_types or passed_type}."
455
453
  )
@@ -499,9 +497,13 @@ class Component(BaseComponent, ABC):
499
497
  self,
500
498
  args_spec: Any,
501
499
  value: Union[
502
- Var, EventHandler, EventSpec, List[Union[EventHandler, EventSpec]], Callable
500
+ Var,
501
+ EventHandler,
502
+ EventSpec,
503
+ List[Union[EventHandler, EventSpec]],
504
+ Callable,
503
505
  ],
504
- ) -> Union[EventChain, ImmutableVar]:
506
+ ) -> Union[EventChain, Var]:
505
507
  """Create an event chain from a variety of input types.
506
508
 
507
509
  Args:
@@ -515,7 +517,7 @@ class Component(BaseComponent, ABC):
515
517
  ValueError: If the value is not a valid event chain.
516
518
  """
517
519
  # If it's an event chain var, return it.
518
- if isinstance(value, ImmutableVar):
520
+ if isinstance(value, Var):
519
521
  if value._var_type is not EventChain:
520
522
  raise ValueError(
521
523
  f"Invalid event chain: {repr(value)} of type {type(value)}"
@@ -539,7 +541,7 @@ class Component(BaseComponent, ABC):
539
541
  elif isinstance(v, Callable):
540
542
  # Call the lambda to get the event chain.
541
543
  result = call_event_fn(v, args_spec)
542
- if isinstance(result, ImmutableVar):
544
+ if isinstance(result, Var):
543
545
  raise ValueError(
544
546
  f"Invalid event chain: {v}. Cannot use a Var-returning "
545
547
  "lambda inside an EventChain list."
@@ -551,7 +553,7 @@ class Component(BaseComponent, ABC):
551
553
  # If the input is a callable, create an event chain.
552
554
  elif isinstance(value, Callable):
553
555
  result = call_event_fn(value, args_spec)
554
- if isinstance(result, ImmutableVar):
556
+ if isinstance(result, Var):
555
557
  # Recursively call this function if the lambda returned an EventChain Var.
556
558
  return self._create_event_chain(args_spec, result)
557
559
  events = result
@@ -569,7 +571,7 @@ class Component(BaseComponent, ABC):
569
571
  event_actions.update(e.event_actions)
570
572
 
571
573
  # Return the event chain.
572
- if isinstance(args_spec, ImmutableVar):
574
+ if isinstance(args_spec, Var):
573
575
  return EventChain(
574
576
  events=events,
575
577
  args_spec=None,
@@ -655,7 +657,7 @@ class Component(BaseComponent, ABC):
655
657
  """
656
658
  # Create the base tag.
657
659
  tag = Tag(
658
- name=self.tag if not self.alias else self.alias,
660
+ name=(self.tag if not self.alias else self.alias) or "",
659
661
  special_props=self.special_props,
660
662
  )
661
663
 
@@ -669,7 +671,7 @@ class Component(BaseComponent, ABC):
669
671
  # Add ref to element if `id` is not None.
670
672
  ref = self.get_ref()
671
673
  if ref is not None:
672
- props["ref"] = ImmutableVar.create(ref)
674
+ props["ref"] = Var(_js_expr=ref)
673
675
  else:
674
676
  props = props.copy()
675
677
 
@@ -882,7 +884,7 @@ class Component(BaseComponent, ABC):
882
884
  Returns:
883
885
  The dictionary of the component style as value and the style notation as key.
884
886
  """
885
- if isinstance(self.style, ImmutableVar):
887
+ if isinstance(self.style, Var):
886
888
  return {"css": self.style}
887
889
  emotion_style = format_as_emotion(self.style)
888
890
  return (
@@ -998,8 +1000,8 @@ class Component(BaseComponent, ABC):
998
1000
 
999
1001
  @staticmethod
1000
1002
  def _get_vars_from_event_triggers(
1001
- event_triggers: dict[str, EventChain | ImmutableVar],
1002
- ) -> Iterator[tuple[str, list[ImmutableVar]]]:
1003
+ event_triggers: dict[str, EventChain | Var],
1004
+ ) -> Iterator[tuple[str, list[Var]]]:
1003
1005
  """Get the Vars associated with each event trigger.
1004
1006
 
1005
1007
  Args:
@@ -1009,7 +1011,7 @@ class Component(BaseComponent, ABC):
1009
1011
  tuple of (event_name, event_vars)
1010
1012
  """
1011
1013
  for event_trigger, event in event_triggers.items():
1012
- if isinstance(event, ImmutableVar):
1014
+ if isinstance(event, Var):
1013
1015
  yield event_trigger, [event]
1014
1016
  elif isinstance(event, EventChain):
1015
1017
  event_args = []
@@ -1018,7 +1020,7 @@ class Component(BaseComponent, ABC):
1018
1020
  event_args.extend(args)
1019
1021
  yield event_trigger, event_args
1020
1022
 
1021
- def _get_vars(self, include_children: bool = False) -> list[ImmutableVar]:
1023
+ def _get_vars(self, include_children: bool = False) -> list[Var]:
1022
1024
  """Walk all Vars used in this component.
1023
1025
 
1024
1026
  Args:
@@ -1038,18 +1040,14 @@ class Component(BaseComponent, ABC):
1038
1040
  # Get Vars associated with component props.
1039
1041
  for prop in self.get_props():
1040
1042
  prop_var = getattr(self, prop)
1041
- if isinstance(prop_var, ImmutableVar):
1043
+ if isinstance(prop_var, Var):
1042
1044
  vars.append(prop_var)
1043
1045
 
1044
1046
  # Style keeps track of its own VarData instance, so embed in a temp Var that is yielded.
1045
- if (
1046
- isinstance(self.style, dict)
1047
- and self.style
1048
- or isinstance(self.style, ImmutableVar)
1049
- ):
1047
+ if isinstance(self.style, dict) and self.style or isinstance(self.style, Var):
1050
1048
  vars.append(
1051
- ImmutableVar(
1052
- _var_name="style",
1049
+ Var(
1050
+ _js_expr="style",
1053
1051
  _var_type=str,
1054
1052
  _var_data=VarData.merge(self.style._var_data),
1055
1053
  )
@@ -1066,7 +1064,7 @@ class Component(BaseComponent, ABC):
1066
1064
  self.autofocus,
1067
1065
  *self.custom_attrs.values(),
1068
1066
  ):
1069
- if isinstance(comp_prop, ImmutableVar):
1067
+ if isinstance(comp_prop, Var):
1070
1068
  vars.append(comp_prop)
1071
1069
  elif isinstance(comp_prop, str):
1072
1070
  # Collapse VarData encoded in f-strings.
@@ -1095,7 +1093,7 @@ class Component(BaseComponent, ABC):
1095
1093
  for event in trigger.events:
1096
1094
  if event.handler.state_full_name:
1097
1095
  return True
1098
- elif isinstance(trigger, ImmutableVar) and trigger._var_state:
1096
+ elif isinstance(trigger, Var) and trigger._var_state:
1099
1097
  return True
1100
1098
  return False
1101
1099
 
@@ -1287,7 +1285,7 @@ class Component(BaseComponent, ABC):
1287
1285
  user_hooks = self._get_hooks()
1288
1286
  user_hooks_data = (
1289
1287
  VarData.merge(user_hooks._get_all_var_data())
1290
- if user_hooks is not None and isinstance(user_hooks, ImmutableVar)
1288
+ if user_hooks is not None and isinstance(user_hooks, Var)
1291
1289
  else None
1292
1290
  )
1293
1291
  if user_hooks_data is not None:
@@ -1390,7 +1388,7 @@ class Component(BaseComponent, ABC):
1390
1388
  """
1391
1389
  ref = self.get_ref()
1392
1390
  if ref is not None:
1393
- return f"const {ref} = useRef(null); {str(ImmutableVar.create_safe(ref).as_ref())} = {ref};"
1391
+ return f"const {ref} = useRef(null); {str(Var(_js_expr=ref).as_ref())} = {ref};"
1394
1392
 
1395
1393
  def _get_vars_hooks(self) -> dict[str, None]:
1396
1394
  """Get the hooks required by vars referenced in this component.
@@ -1453,7 +1451,7 @@ class Component(BaseComponent, ABC):
1453
1451
  """
1454
1452
  code = {}
1455
1453
 
1456
- def extract_var_hooks(hook: ImmutableVar):
1454
+ def extract_var_hooks(hook: Var):
1457
1455
  _imports = {}
1458
1456
  var_data = VarData.merge(hook._get_all_var_data())
1459
1457
  if var_data is not None:
@@ -1470,7 +1468,7 @@ class Component(BaseComponent, ABC):
1470
1468
  # the order of the hooks in the final output)
1471
1469
  for clz in reversed(tuple(self._iter_parent_classes_with_method("add_hooks"))):
1472
1470
  for hook in clz.add_hooks(self):
1473
- if isinstance(hook, ImmutableVar):
1471
+ if isinstance(hook, Var):
1474
1472
  extract_var_hooks(hook)
1475
1473
  else:
1476
1474
  code[hook] = {}
@@ -1531,7 +1529,7 @@ class Component(BaseComponent, ABC):
1531
1529
  The ref name.
1532
1530
  """
1533
1531
  # do not create a ref if the id is dynamic or unspecified
1534
- if self.id is None or isinstance(self.id, ImmutableVar):
1532
+ if self.id is None or isinstance(self.id, Var):
1535
1533
  return None
1536
1534
  return format.format_ref(self.id)
1537
1535
 
@@ -1770,15 +1768,15 @@ class CustomComponent(Component):
1770
1768
  """
1771
1769
  return super()._render(props=self.props)
1772
1770
 
1773
- def get_prop_vars(self) -> List[ImmutableVar]:
1771
+ def get_prop_vars(self) -> List[Var]:
1774
1772
  """Get the prop vars.
1775
1773
 
1776
1774
  Returns:
1777
1775
  The prop vars.
1778
1776
  """
1779
1777
  return [
1780
- ImmutableVar(
1781
- _var_name=name,
1778
+ Var(
1779
+ _js_expr=name,
1782
1780
  _var_type=(
1783
1781
  prop._var_type if types._isinstance(prop, Var) else type(prop)
1784
1782
  ),
@@ -1786,7 +1784,7 @@ class CustomComponent(Component):
1786
1784
  for name, prop in self.props.items()
1787
1785
  ]
1788
1786
 
1789
- def _get_vars(self, include_children: bool = False) -> list[ImmutableVar]:
1787
+ def _get_vars(self, include_children: bool = False) -> list[Var]:
1790
1788
  """Walk all Vars used in this component.
1791
1789
 
1792
1790
  Args:
@@ -1797,7 +1795,7 @@ class CustomComponent(Component):
1797
1795
  """
1798
1796
  return (
1799
1797
  super()._get_vars(include_children=include_children)
1800
- + [prop for prop in self.props.values() if isinstance(prop, ImmutableVar)]
1798
+ + [prop for prop in self.props.values() if isinstance(prop, Var)]
1801
1799
  + self.get_component(self)._get_vars(include_children=include_children)
1802
1800
  )
1803
1801
 
@@ -1968,7 +1966,7 @@ class StatefulComponent(BaseComponent):
1968
1966
  should_memoize = True
1969
1967
  break
1970
1968
  child = cls._child_var(child)
1971
- if isinstance(child, ImmutableVar) and child._get_all_var_data():
1969
+ if isinstance(child, Var) and child._get_all_var_data():
1972
1970
  should_memoize = True
1973
1971
  break
1974
1972
 
@@ -2124,7 +2122,7 @@ class StatefulComponent(BaseComponent):
2124
2122
  def _get_memoized_event_triggers(
2125
2123
  cls,
2126
2124
  component: Component,
2127
- ) -> dict[str, tuple[ImmutableVar, str]]:
2125
+ ) -> dict[str, tuple[Var, str]]:
2128
2126
  """Memoize event handler functions with useCallback to avoid unnecessary re-renders.
2129
2127
 
2130
2128
  Args:
@@ -2171,7 +2169,7 @@ class StatefulComponent(BaseComponent):
2171
2169
 
2172
2170
  # Store the memoized function name and hook code for this event trigger.
2173
2171
  trigger_memo[event_trigger] = (
2174
- ImmutableVar.create_safe(memo_name)._replace(
2172
+ Var(_js_expr=memo_name)._replace(
2175
2173
  _var_type=EventChain, merge_var_data=memo_var_data
2176
2174
  ),
2177
2175
  f"const {memo_name} = useCallback({rendered_chain}, [{', '.join(var_deps)}])",
@@ -2244,7 +2242,7 @@ class StatefulComponent(BaseComponent):
2244
2242
  Returns:
2245
2243
  The tag to render.
2246
2244
  """
2247
- return dict(Tag(name=self.tag))
2245
+ return dict(Tag(name=self.tag or ""))
2248
2246
 
2249
2247
  def __str__(self) -> str:
2250
2248
  """Represent the component in React.
@@ -18,56 +18,52 @@ from reflex.components.radix.themes.typography.text import Text
18
18
  from reflex.components.sonner.toast import Toaster, ToastProps
19
19
  from reflex.constants import Dirs, Hooks, Imports
20
20
  from reflex.constants.compiler import CompileVars
21
- from reflex.ivars.base import ImmutableVar, LiteralVar
22
- from reflex.ivars.function import FunctionStringVar
23
- from reflex.ivars.number import BooleanVar
24
- from reflex.ivars.sequence import LiteralArrayVar
25
21
  from reflex.utils.imports import ImportVar
26
- from reflex.vars import Var, VarData
22
+ from reflex.vars import VarData
23
+ from reflex.vars.base import LiteralVar, Var
24
+ from reflex.vars.function import FunctionStringVar
25
+ from reflex.vars.number import BooleanVar
26
+ from reflex.vars.sequence import LiteralArrayVar
27
27
 
28
28
  connect_error_var_data: VarData = VarData( # type: ignore
29
29
  imports=Imports.EVENTS,
30
30
  hooks={Hooks.EVENTS: None},
31
31
  )
32
32
 
33
- connect_errors: Var = ImmutableVar.create_safe(
34
- value=CompileVars.CONNECT_ERROR,
35
- _var_data=connect_error_var_data,
33
+ connect_errors = Var(
34
+ _js_expr=CompileVars.CONNECT_ERROR, _var_data=connect_error_var_data
36
35
  )
37
36
 
38
- connection_error: Var = ImmutableVar.create_safe(
39
- value="((connectErrors.length > 0) ? connectErrors[connectErrors.length - 1].message : '')",
37
+ connection_error = Var(
38
+ _js_expr="((connectErrors.length > 0) ? connectErrors[connectErrors.length - 1].message : '')",
40
39
  _var_data=connect_error_var_data,
41
40
  )
42
41
 
43
- connection_errors_count: Var = ImmutableVar.create_safe(
44
- value="connectErrors.length",
45
- _var_data=connect_error_var_data,
42
+ connection_errors_count = Var(
43
+ _js_expr="connectErrors.length", _var_data=connect_error_var_data
46
44
  )
47
45
 
48
- has_connection_errors: Var = ImmutableVar.create_safe(
49
- value="(connectErrors.length > 0)",
50
- _var_data=connect_error_var_data,
46
+ has_connection_errors = Var(
47
+ _js_expr="(connectErrors.length > 0)", _var_data=connect_error_var_data
51
48
  ).to(BooleanVar)
52
49
 
53
- has_too_many_connection_errors: Var = ImmutableVar.create_safe(
54
- value="(connectErrors.length >= 2)",
55
- _var_data=connect_error_var_data,
50
+ has_too_many_connection_errors = Var(
51
+ _js_expr="(connectErrors.length >= 2)", _var_data=connect_error_var_data
56
52
  ).to(BooleanVar)
57
53
 
58
54
 
59
- class WebsocketTargetURL(ImmutableVar):
55
+ class WebsocketTargetURL(Var):
60
56
  """A component that renders the websocket target URL."""
61
57
 
62
58
  @classmethod
63
- def create(cls) -> ImmutableVar:
59
+ def create(cls) -> Var:
64
60
  """Create a websocket target URL component.
65
61
 
66
62
  Returns:
67
63
  The websocket target URL component.
68
64
  """
69
- return ImmutableVar(
70
- _var_name="getBackendURL(env.EVENT).href",
65
+ return Var(
66
+ _js_expr="getBackendURL(env.EVENT).href",
71
67
  _var_data=VarData(
72
68
  imports={
73
69
  "/env.json": [ImportVar(tag="env", is_default=True)],
@@ -95,7 +91,7 @@ def default_connection_error() -> list[str | Var | Component]:
95
91
  class ConnectionToaster(Toaster):
96
92
  """A connection toaster component."""
97
93
 
98
- def add_hooks(self) -> list[str | ImmutableVar]:
94
+ def add_hooks(self) -> list[str | Var]:
99
95
  """Add the hooks for the connection toaster.
100
96
 
101
97
  Returns:
@@ -125,8 +121,8 @@ class ConnectionToaster(Toaster):
125
121
  ),
126
122
  ).call(
127
123
  # TODO: This breaks the assumption that Vars are JS expressions
128
- ImmutableVar.create_safe(
129
- f"""
124
+ Var(
125
+ _js_expr=f"""
130
126
  () => {{
131
127
  if ({str(has_too_many_connection_errors)}) {{
132
128
  if (!userDismissed) {{
@@ -238,7 +234,7 @@ class WifiOffPulse(Icon):
238
234
  Returns:
239
235
  The icon component with default props applied.
240
236
  """
241
- pulse_var = ImmutableVar.create("pulse")
237
+ pulse_var = Var(_js_expr="pulse")
242
238
  return super().create(
243
239
  "wifi_off",
244
240
  color=props.pop("color", "crimson"),