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
@@ -8,13 +8,13 @@ from typing import Any, Callable, Union
8
8
 
9
9
  from reflex import constants
10
10
  from reflex.event import EventChain, EventHandler, EventSpec, call_script
11
- from reflex.ivars.base import ImmutableVar, LiteralVar
12
- from reflex.ivars.function import FunctionVar
13
11
  from reflex.utils.imports import ImportVar
14
12
  from reflex.vars import (
15
13
  VarData,
16
14
  get_unique_variable_name,
17
15
  )
16
+ from reflex.vars.base import LiteralVar, Var
17
+ from reflex.vars.function import FunctionVar
18
18
 
19
19
  NoValue = object()
20
20
 
@@ -41,7 +41,7 @@ def _client_state_ref(var_name: str) -> str:
41
41
  frozen=True,
42
42
  **{"slots": True} if sys.version_info >= (3, 10) else {},
43
43
  )
44
- class ClientStateVar(ImmutableVar):
44
+ class ClientStateVar(Var):
45
45
  """A Var that exists on the client via useState."""
46
46
 
47
47
  # Track the names of the getters and setters
@@ -58,7 +58,7 @@ class ClientStateVar(ImmutableVar):
58
58
  The hash of the var.
59
59
  """
60
60
  return hash(
61
- (self._var_name, str(self._var_type), self._getter_name, self._setter_name)
61
+ (self._js_expr, str(self._var_type), self._getter_name, self._setter_name)
62
62
  )
63
63
 
64
64
  @classmethod
@@ -97,10 +97,8 @@ class ClientStateVar(ImmutableVar):
97
97
  var_name = get_unique_variable_name()
98
98
  assert isinstance(var_name, str), "var_name must be a string."
99
99
  if default is NoValue:
100
- default_var = ImmutableVar.create_safe(
101
- "", _var_is_local=False, _var_is_string=False
102
- )
103
- elif not isinstance(default, ImmutableVar):
100
+ default_var = Var(_js_expr="")
101
+ elif not isinstance(default, Var):
104
102
  default_var = LiteralVar.create(default)
105
103
  else:
106
104
  default_var = default
@@ -116,7 +114,7 @@ class ClientStateVar(ImmutableVar):
116
114
  hooks[f"{_client_state_ref(setter_name)} = {setter_name}"] = None
117
115
  imports.update(_refs_import)
118
116
  return cls(
119
- _var_name="",
117
+ _js_expr="",
120
118
  _setter_name=setter_name,
121
119
  _getter_name=var_name,
122
120
  _global_ref=global_ref,
@@ -131,7 +129,7 @@ class ClientStateVar(ImmutableVar):
131
129
  )
132
130
 
133
131
  @property
134
- def value(self) -> ImmutableVar:
132
+ def value(self) -> Var:
135
133
  """Get a placeholder for the Var.
136
134
 
137
135
  This property can only be rendered on the frontend.
@@ -142,10 +140,12 @@ class ClientStateVar(ImmutableVar):
142
140
  an accessor for the client state variable.
143
141
  """
144
142
  return (
145
- ImmutableVar.create_safe(
146
- _client_state_ref(self._getter_name)
147
- if self._global_ref
148
- else self._getter_name
143
+ Var(
144
+ _js_expr=(
145
+ _client_state_ref(self._getter_name)
146
+ if self._global_ref
147
+ else self._getter_name
148
+ )
149
149
  )
150
150
  .to(self._var_type)
151
151
  ._replace(
@@ -155,7 +155,7 @@ class ClientStateVar(ImmutableVar):
155
155
  )
156
156
  )
157
157
 
158
- def set_value(self, value: Any = NoValue) -> ImmutableVar:
158
+ def set_value(self, value: Any = NoValue) -> Var:
159
159
  """Set the value of the client state variable.
160
160
 
161
161
  This property can only be attached to a frontend event trigger.
@@ -183,13 +183,13 @@ class ClientStateVar(ImmutableVar):
183
183
  arg = re.sub(r"\[\".*\"\]", "", value_str)
184
184
 
185
185
  setter = f"({arg}) => {setter}({str(value)})"
186
- return ImmutableVar(
187
- _var_name=setter,
186
+ return Var(
187
+ _js_expr=setter,
188
188
  _var_data=VarData(imports=_refs_import if self._global_ref else {}),
189
189
  ).to(FunctionVar, EventChain)
190
190
 
191
191
  @property
192
- def set(self) -> ImmutableVar:
192
+ def set(self) -> Var:
193
193
  """Set the value of the client state variable.
194
194
 
195
195
  This property can only be attached to a frontend event trigger.
@@ -2,16 +2,16 @@
2
2
 
3
3
  from __future__ import annotations
4
4
 
5
- from reflex.ivars.base import ImmutableVar
6
5
  from reflex.utils.imports import ImportVar
7
6
  from reflex.vars import VarData
7
+ from reflex.vars.base import Var
8
8
 
9
9
 
10
10
  def _compose_react_imports(tags: list[str]) -> dict[str, list[ImportVar]]:
11
11
  return {"react": [ImportVar(tag=tag) for tag in tags]}
12
12
 
13
13
 
14
- def const(name, value) -> ImmutableVar:
14
+ def const(name, value) -> Var:
15
15
  """Create a constant Var.
16
16
 
17
17
  Args:
@@ -22,11 +22,11 @@ def const(name, value) -> ImmutableVar:
22
22
  The constant Var.
23
23
  """
24
24
  if isinstance(name, list):
25
- return ImmutableVar.create_safe(f"const [{', '.join(name)}] = {value}")
26
- return ImmutableVar.create_safe(f"const {name} = {value}")
25
+ return Var(_js_expr=f"const [{', '.join(name)}] = {value}")
26
+ return Var(_js_expr=f"const {name} = {value}")
27
27
 
28
28
 
29
- def useCallback(func, deps) -> ImmutableVar:
29
+ def useCallback(func, deps) -> Var:
30
30
  """Create a useCallback hook with a function and dependencies.
31
31
 
32
32
  Args:
@@ -36,13 +36,13 @@ def useCallback(func, deps) -> ImmutableVar:
36
36
  Returns:
37
37
  The useCallback hook.
38
38
  """
39
- return ImmutableVar.create_safe(
40
- f"useCallback({func}, {deps})" if deps else f"useCallback({func})",
39
+ return Var(
40
+ _js_expr=f"useCallback({func}, {deps})" if deps else f"useCallback({func})",
41
41
  _var_data=VarData(imports=_compose_react_imports(["useCallback"])),
42
42
  )
43
43
 
44
44
 
45
- def useContext(context) -> ImmutableVar:
45
+ def useContext(context) -> Var:
46
46
  """Create a useContext hook with a context.
47
47
 
48
48
  Args:
@@ -51,13 +51,13 @@ def useContext(context) -> ImmutableVar:
51
51
  Returns:
52
52
  The useContext hook.
53
53
  """
54
- return ImmutableVar.create_safe(
55
- f"useContext({context})",
54
+ return Var(
55
+ _js_expr=f"useContext({context})",
56
56
  _var_data=VarData(imports=_compose_react_imports(["useContext"])),
57
57
  )
58
58
 
59
59
 
60
- def useRef(default) -> ImmutableVar:
60
+ def useRef(default) -> Var:
61
61
  """Create a useRef hook with a default value.
62
62
 
63
63
  Args:
@@ -66,13 +66,13 @@ def useRef(default) -> ImmutableVar:
66
66
  Returns:
67
67
  The useRef hook.
68
68
  """
69
- return ImmutableVar.create_safe(
70
- f"useRef({default})",
69
+ return Var(
70
+ _js_expr=f"useRef({default})",
71
71
  _var_data=VarData(imports=_compose_react_imports(["useRef"])),
72
72
  )
73
73
 
74
74
 
75
- def useState(var_name, default=None) -> ImmutableVar:
75
+ def useState(var_name, default=None) -> Var:
76
76
  """Create a useState hook with a variable name and setter name.
77
77
 
78
78
  Args:
@@ -84,8 +84,8 @@ def useState(var_name, default=None) -> ImmutableVar:
84
84
  """
85
85
  return const(
86
86
  [var_name, f"set{var_name.capitalize()}"],
87
- ImmutableVar.create_safe(
88
- f"useState({default})",
87
+ Var(
88
+ _js_expr=f"useState({default})",
89
89
  _var_data=VarData(imports=_compose_react_imports(["useState"])),
90
90
  ),
91
91
  )
@@ -14,9 +14,9 @@ from reflex.components.radix.themes.layout.container import Container
14
14
  from reflex.components.radix.themes.layout.stack import HStack
15
15
  from reflex.event import call_script
16
16
  from reflex.experimental import hooks
17
- from reflex.ivars.base import ImmutableVar
18
17
  from reflex.state import ComponentState
19
18
  from reflex.style import Style
19
+ from reflex.vars.base import Var
20
20
 
21
21
 
22
22
  class Sidebar(Box, MemoizationLeaf):
@@ -55,7 +55,7 @@ class Sidebar(Box, MemoizationLeaf):
55
55
  open = (
56
56
  self.State.open # type: ignore
57
57
  if self.State
58
- else ImmutableVar.create_safe("open")
58
+ else Var(_js_expr="open")
59
59
  )
60
60
  sidebar.style["display"] = spacer.style["display"] = cond(open, "block", "none")
61
61
 
@@ -69,7 +69,7 @@ class Sidebar(Box, MemoizationLeaf):
69
69
  }
70
70
  )
71
71
 
72
- def add_hooks(self) -> List[ImmutableVar]:
72
+ def add_hooks(self) -> List[Var]:
73
73
  """Get the hooks to render.
74
74
 
75
75
  Returns:
@@ -172,8 +172,8 @@ class SidebarTrigger(Fragment):
172
172
  open, toggle = sidebar.State.open, sidebar.State.toggle # type: ignore
173
173
  else:
174
174
  open, toggle = (
175
- ImmutableVar.create_safe("open"),
176
- call_script(ImmutableVar.create_safe("setOpen(!open)")),
175
+ Var(_js_expr="open"),
176
+ call_script(Var(_js_expr="setOpen(!open)")),
177
177
  )
178
178
 
179
179
  trigger_props["left"] = cond(open, f"calc({sidebar_width} - 32px)", "0")