Displaying ipywidget in a sidecar or collapsible pager style view

The notebook pager view displays things like ?... help messages in a pop-up text view area at the bottom of the notebook window.

The pager can be called to display text output using:

from IPython.core import page
page.page('hello world`)

The notebook variable inspector official unofficial extension displays its output in a floating pop-up window.

The JupyterLab sidecar widget allows a widget to be programmatically/directly displayed in a separate output view within a JupyterLab environment.

So I’m wondering, in general, is there an easy way of displaying an ipywidget in something like a parallel sidebar or pager area (perhaps collapsible and then revealable), or floating panel of its own, so that code cell launched ipywidget apps can be viewed and managed in their own space, rather than directly as a code cell output?

This would allow the widget to be accessed from anywhere in the notebook rather than just from the output area of a specific cell.

I’m not wanting full JupyterLab style interactions here, just some sort of easy way of displaying a widget in it’s own display context rather than having to access it from the output area of the code cell from which it was originally displayed.

Maybe something like ipylab? But that’s only for JupyterLab.

For the classic notebook we could imagine a similar extension. But each time it will most likely be specific to the notebook frontend.

Note that you can display a widget in an output widget, then display that output widget in another cell. That’s essentially what the jlab sidecar widget does.

@jtp Yeah, it’s specifically a vanilla notebook extension I need. JupyterLab is way too much overhead for me (package dependency clashes across different extensions tend to clobber me whenever I try to use it and everything breaks).

@jasongrout Thanks… I wondered about the the output widget approach… will explore that. (Specific use case I have in mind relates to a widget created using jp_proxy_widget (still unresolved) but then I started wondered about whether there were already any more general approaches demonstrated anywhere.

To answer my own question, for the jp_proxy_widget case at least, where the widget is assigned to a variable and exposes a .element reference to the HTML element that contains the widget, the element can be opened in a floating panel using the jquery .dialog() function.

Via AaronWatters

1 Like