fix: migrate to Reflex 0.9 and pin suneditor 2.x

pyproject.toml

@@ -5,7 +5,9 @@ description = "Reflex suneditor"
 authors = [{ name = "Akshay Awate", email = "akshayawate2012@gmail.com" }]
 readme = "README.md"
 requires-python = ">=3.10"
-dependencies = ["reflex >=0.7.14"]
+dependencies = [
+    "reflex>=0.9.0,<1.0",
+]
 
 [dependency-groups]
 dev = ["ruff", "pyright"]

reflex_suneditor/__init__.py

@@ -4,4 +4,4 @@
 from .editor import EditorButtonList as EditorButtonList
 from .editor import EditorOptions as EditorOptions
 
-editor = Editor.create
+editor = Editor.create

reflex_suneditor/editor.py

@@ -5,13 +5,16 @@
 import enum
 from typing import Literal
 
-from reflex.base import Base
+from reflex import PropsBase
 from reflex.components.component import Component, NoSSRComponent
 from reflex.event import EventHandler, no_args_event_spec, passthrough_event_spec
-from reflex.utils.format import to_camel_case
 from reflex.utils.imports import ImportDict, ImportVar
 from reflex.vars.base import Var
 
+# suneditor-react@3.6.1 peer-dep is suneditor@^2.44. Without pinning, npm may
+# resolve suneditor@3.x and break module loading at runtime.
+_SUNEDITOR_NPM = "suneditor@2.47.10"
+
 
 class EditorButtonList(list, enum.Enum):
     """List enum that provides three predefined button lists."""
@@ -46,7 +49,7 @@ class EditorButtonList(list, enum.Enum):
     ]
 
 
-class EditorOptions(Base):
+class EditorOptions(PropsBase):
     """Some of the additional options to configure the Editor.
 
     Complete list of options found here:
@@ -66,7 +69,7 @@ class EditorOptions(Base):
     rtl: bool | None = None
 
     # List of buttons to use in the toolbar.
-    button_list: list[list[str] | str] | None
+    button_list: list[list[str] | str] | None = None
 
 
 def on_blur_spec(_e: Var, content: Var[str]) -> tuple[Var[str]]:
@@ -111,7 +114,7 @@ class Editor(NoSSRComponent):
 
     is_default = True
 
-    lib_dependencies: list[str] = ["suneditor"]
+    lib_dependencies: list[str] = [_SUNEDITOR_NPM]
 
     # Language of the editor.
     # Alternatively to a string, a dict of your language can be passed to this prop.
@@ -234,13 +237,18 @@ class Editor(NoSSRComponent):
     toggle_full_screen: EventHandler[passthrough_event_spec(bool)]
 
     def add_imports(self) -> ImportDict:
-        """Add imports for the Editor component.
+        """Add CSS for suneditor 2.x (matches lib_dependencies version).
 
         Returns:
             The import dict.
         """
         return {
-            "": ImportVar(tag="suneditor/dist/css/suneditor.min.css", install=False)
+            "": [
+                ImportVar(
+                    tag="suneditor/dist/css/suneditor.min.css",
+                    install=False,
+                ),
+            ],
         }
 
     @classmethod
@@ -263,9 +271,8 @@ def create(
             if isinstance(set_options, Var):
                 msg = "EditorOptions cannot be a state Var"
                 raise ValueError(msg)
-            props["set_options"] = {
-                to_camel_case(k): v
-                for k, v in set_options.dict().items()
-                if v is not None
-            }
+            props["set_options"] = set_options.dict()
         return super().create(*[], **props)
+
+
+editor = Editor.create