In the case of using existing widgets in FlexLayout dashboard, users can create multiple views of a widget, so all tabs are linked.

If users want to have the independent widget in each tab, FlexLayout allows users to define the factories to create widgets from the interface.

def slider_factory(label: 'Label of slider', value: 'Initial value'):
    return ipywidgets.FloatSlider(value=float(value), description=label )

factories = {"Slider factory": slider_factory}

dashboard = FlexLayout(factories=factories)

• If the factory function needs parameters, FlexLayout will build an input form to get parameters from the interface. Users can define annotations to have the label of the input form.

• FlexLayout will pass all parameters as string, users need to convert the inputs to their appropriate type in the factory function.

Close #17

In voila v0.4, I get the following Javascript error:

Model class 'FlexLayoutModel' from module 'ipyflex' is loaded but can not be instantiated
TypeError: this.widget_manager.display_model is not a function
    at d.initialize (https://cdn.jsdelivr.net/npm/ipyflex@%5E0.2.2/dist/index.js:75:782852)
    at new t.Model (http://localhost:8888/voila/templates/lab/static/voila.js?v=8db1cadbfba43a6dfc2d64128318e696bcb26b1783db1b991faf7404d438cd53200b6c434c4897064c090b68aa1151cd96c6dab50c3e138553365e6b30889172:61:579272)
    at new T (http://localhost:8888/voila/templates/lab/static/voila.js?v=8db1cadbfba43a6dfc2d64128318e696bcb26b1783db1b991faf7404d438cd53200b6c434c4897064c090b68aa1151cd96c6dab50c3e138553365e6b30889172:23:17621)
    at new S (http://localhost:8888/voila/templates/lab/static/voila.js?v=8db1cadbfba43a6dfc2d64128318e696bcb26b1783db1b991faf7404d438cd53200b6c434c4897064c090b68aa1151cd96c6dab50c3e138553365e6b30889172:23:23418)
    at new d (https://cdn.jsdelivr.net/npm/ipyflex@%5E0.2.2/dist/index.js:75:782350)
    at tn._make_model (http://localhost:8888/voila/templates/lab/static/voila.js?v=8db1cadbfba43a6dfc2d64128318e696bcb26b1783db1b991faf7404d438cd53200b6c434c4897064c090b68aa1151cd96c6dab50c3e138553365e6b30889172:458:112234)

In Jupyterlab, the FlexLayout widget renders fine, however.

hi there,

excited to use this!

I'm considering a use case for ipyflex as a UI for creating an A4 format output pdf report.

To do so i'd like to use the widget factory, allowing users to add items to the report, and specify that items must be vertically stacked, i.e.:

ideally the user would be able to drag the boxes up and down to change order but wouldn't be able to do anything else...

is this possible?

many thanks

Hi, Ipyflex is a great library. Thanks for sharing!

I couldn't get Ipyflex to display in Jupyterlite. If possible, please could you show an example of Ipyflex working in Jupyterlite.

Here is the sample code I used that didn't work.

import micropip
await micropip.install("ipyflex")
import ipyflex

ipyflex.FlexLayout(
    header={"title": "Test", "style": {"backgroundColor": "rgb(53 53 53)"}}, # , "buttons":["export","import"]
)

The widget doesn't display. I just get the "Loading widget..." text under the cell.

This notebook uses upyvuetify objects inside the flex components. It shows that ipyflex is also compatible with the super powerful library ipyvuetify.

Thanks for this great package! I noticed that FlexLayout() can be rendered statically, but in that case, the template saving doesn't work (it'd be awesome if it did)

from ipyflex import FlexLayout
import ipywidgets as ipw

widgets = {
    "Widget 1": ipw.HTML("<h1>Widget 1</h1>"),
    "Widget 2": ipw.HTML("<h1>Widget 2</h1>"),
    "Widget 3": ipw.HTML("<h1>Widget 3</h1>"),
    "Widget 4": ipw.HTML("<h1>Widget 4</h1>"),
}
w = FlexLayout(widgets, style={"height": "400px"})

from ipywidgets.embed import embed_minimal_html
embed_minimal_html("index.html", views=[w])

Automated Changelog Entry for 0.2.6 on master

After merging this PR run the "Full Release" Workflow on your fork of jupyter_releaser with the following inputs | Input | Value | | ------------- | ------------- | | Target | trungleduc/ipyflex | | Branch | master | | Version Spec | 0.2.6 | | Since | v0.2.5 |

Automated Changelog Entry for 0.2.5 on master

Python version: 0.2.5
npm version: ipyflex: 0.2.4

After merging this PR run the "Full Release" Workflow on your fork of jupyter_releaser with the following inputs | Input | Value | | ------------- | ------------- | | Target | trungleduc/ipyflex | | Branch | master | | Version Spec | 0.2.5 | | Since | v0.2.4 |

Automated Changelog Entry for 0.3.0 on master

Python version: 0.3.0
npm version: ipyflex: 0.2.4

After merging this PR run the "Full Release" Workflow on your fork of jupyter_releaser with the following inputs | Input | Value | | ------------- | ------------- | | Target | trungleduc/ipyflex | | Branch | master | | Version Spec | 0.3.0 | | Since | v0.2.4 |

Automated Changelog Entry for 0.2.4 on master

After merging this PR run the "Full Release" Workflow on your fork of jupyter_releaser with the following inputs | Input | Value | | ------------- | ------------- | | Target | trungleduc/ipyflex | | Branch | master | | Version Spec | 0.2.4 | | Since | v0.2.3 |

Automated Changelog Entry for 0.2.3 on master

Python version: 0.2.3
npm version: ipyflex: 0.2.2

After merging this PR run the "Full Release" Workflow on your fork of jupyter_releaser with the following inputs | Input | Value | | ------------- | ------------- | | Target | trungleduc/ipyflex | | Branch | master | | Version Spec | 0.2.3 | | Since | v0.2.2 |

We use ipyflex to let our users build their own dashboard. This works great, but at some moments the tab bar, with the '+' button, becomes hidden without any user interaction requesting this behavior. One of such moment is upon FlexLayout.load_template.

Unfortunately, I cannot share the full code we are using. But if needed I can try to create a MWE. Note that just disabling the whole 'hide tab bar' feature would already be a big help.