Fix non-default imports for NoSSRComponent (#1548)

reflex/components/component.py

@@ -799,4 +799,10 @@ class NoSSRComponent(Component):
     def _get_custom_code(self) -> str:
         opts_fragment = ", { ssr: false });"
         library_import = f"const {self.tag} = dynamic(() => import('{self.library}')"
-        return "".join((library_import, opts_fragment))
+        mod_import = (
+            # https://nextjs.org/docs/pages/building-your-application/optimizing/lazy-loading#with-named-exports
+            f".then((mod) => mod.{self.tag})"
+            if not self.is_default
+            else ""
+        )
+        return "".join((library_import, mod_import, opts_fragment))

reflex/components/graphing/plotly.py

@@ -20,6 +20,8 @@ class Plotly(PlotlyLib):
 
     tag = "Plot"
 
+    is_default = True
+
     # The figure to display. This can be a plotly figure or a plotly data json.
     data: Var[Figure]
 

reflex/components/libs/react_player.py

@@ -15,6 +15,8 @@ class ReactPlayerComponent(NoSSRComponent):
 
     tag = "ReactPlayer"
 
+    is_default = True
+
     # The url of a video or song to play
     url: Var[str]