feat: use solara instead of voila for rendering the popout widget

Should be used in combination with:
 widgetti/solara#805

README.md

@@ -12,6 +12,27 @@ Works with:
  * Voila (`version<0.5`)
  * [Solara](https://github.com/widgetti/solara/) (`version>=1.22`)
 
+In the Jupyter notebook and Jupyter lab environments, ipypopout will use either Solara or Voila to create the popout window. The exist
+
+## Installation
+
+### To use the Solara backend
+
+```
+$ pip install "ipypopout[solara]"
+```
+
+If you need to install Voila>=0.5 in the same Python environment, this is the only way to install ipypopout.
+
+
+### To use the Voila backend
+
+If you are ok with using Voila < 0.5, you can install ipypopout with the Voila backend only:
+```
+$ pip install "ipypopout[voila]"
+```
+
+
 ## Usage
 
 ### With ipywidgets
@@ -82,11 +103,6 @@ Because Solara creates elements instead of widgets, we have to use the `use_effe
 https://github.com/widgetti/ipypopout/assets/1765949/430cae12-2527-404b-9861-610565ac1471
 
 
-## Installation
-
-```
-$ pip install ipypopout
-```
 
 ## API
 
@@ -97,3 +113,7 @@ $ pip install ipypopout
  * `window_name - str`: If a window with the same name is available it will be reused, otherwise a new window is created (defaults to `target_model_id`).
  See [https://developer.mozilla.org/en-US/docs/Web/API/Window/open](https://developer.mozilla.org/en-US/docs/Web/API/Window/open) for more details.
  * `window_features - str`: See: [https://developer.mozilla.org/en-US/docs/Web/API/Window/open#window_features](https://developer.mozilla.org/en-US/docs/Web/API/Window/open#window_features)
+
+### Which backend to use
+
+Note that ipypopout will automatically detect if it can use Solara, and use it if available, otherwise it will use Voila. If you want to force the use of Voila, you can set the environment variable `IPYPOPOUT_USE_BACKEND=voila`, the other options are `auto` (the default) and `solara` (in case our auto detect fails).

ipypopout/popout_button.py

@@ -7,6 +7,9 @@
 import sys
 
 
+DEFAULT_USE_BACKEND = os.environ.get("IPYPOPOUT_USE_BACKEND", "auto")
+
+
 def get_kernel_id():
  if "solara" in sys.modules:
  import solara
@@ -38,6 +41,8 @@ class PopoutButton(v.VuetifyTemplate):
  target = traitlets.Instance(ipywidgets.Widget, allow_none=True)
  echo_available = traitlets.Bool(False).tag(sync=True)
 
+ use_backend = traitlets.Enum(values=["auto", "voila", "solara"], default_value=DEFAULT_USE_BACKEND).tag(sync=True)
+
  is_displayed = traitlets.Bool(False).tag(sync=True)
  open_window_on_display = traitlets.Bool(False).tag(sync=True)
  open_tab_on_display = traitlets.Bool(False).tag(sync=True)

ipypopout/popout_button.vue

@@ -13,9 +13,22 @@
 </template>
 <script>
 module.exports = {
+ data() {
+ return {solaraFound: false}
+ },
  created() {
- if (!this.getBaseUrl()) {
+ const baseUrl = this.getBaseUrl();
+ if (!baseUrl) {
  console.info('BaseUrl not found, hiding popout button.');
+ } else {
+ const solaraReadyZUrl = `${baseUrl}solara/readyz`;
+ fetch(solaraReadyZUrl)
+ .then(response => {
+ if (response.ok) {
+ console.error('Solara found, using Solara popout page.');
+ this.solaraFound = true;
+ }
+ })
  }
  },
  mounted() {
@@ -68,7 +81,11 @@ module.exports = {
  if (window.solara && (solara.rootPath !== undefined)) {
  return solara.rootPath;
  }
- return 'voila/templates/ipypopout/static/popout.html'
+ if(this.use_backend == "solara" || (this.use_backend == "auto" && this.solaraFound)) {
+ return 'solara';
+ } else {
+ return 'voila/templates/ipypopout/static/popout.html'
+ }
  }
  }
 }

setup.py

@@ -57,12 +57,17 @@ def get_data_files(target, src):
  install_requires=[
  'ipywidgets>=7.7',
  'ipyvuetify>=1.7.0,<2',
- 'voila>=0.2.10'
  ],
  extras_require={
  "test": [
  "solara[pytest]",
  ]
+ "voila": [
+ 'voila>=0.2.10,<0.5',
+ ],
+ "solara": [
+ 'solara>=1.40.0'
+ ]
  },
  data_files=get_data_files(os.path.join(*share_voila_target), os.path.join(template[0])),
  cmdclass={