Fullscreen widget

[batpad]

Fixes #16

This is what the widget looks like inline with the full-screen icon:

And full-screened to a dashboard view:

There will be a bunch of things to figure out. 2 things in particular I can think of:

• Allow for better and more flexible layout control - once we are allowing users to design "full-screen" views, we will need more flexibility in our grid layouting, etc. Have some ideas from speaking with Claude, I can make a separate ticket for this.
• Some of the lonboard icons seem to be losing their positioning a bit - may need to figure that out.

In general, this could definitely use some finesse, but I think I like the idea of it, and is something I'd really like to demo as something that's possible. @dzole0311 how do you feel about this?

cc @wrynearson - how useful / exciting do you think this would be? In theory, we could have pretty compelling full-screen widgets - have also made it so that one can share a URL to open up the full-screen widget directly.

[batpad]

+cc @choldgraf - I thought this might be cool to demo - does it seem worthwhile putting together a bit of a snazzier example utilizing a "full-screen" mode?

[choldgraf]

I think you should trust your intuition! It does help to bring forward the "myst as a portal to web app" point

[wrynearson]

Thanks for opening this @batpad!

how useful / exciting do you think this would be?

I'd say very useful and very exciting. PowerBI dashboards are (still) so popular in so many sectors...

one can share a URL to open up the full-screen widget directly

Yay! I could see many good use cases for this. Some very early feedback on the Montandon project that uses manywidgets was to make the summary statistics front-and-center, and further hide the code used to generate them.

[dzole0311]

Allow for better and more flexible layout control - once we are allowing users to design "full-screen" views, we will need more flexibility in our grid layouting, etc. Have some ideas from speaking with Claude, I can make a separate ticket for this.

Probably the most standard way I can think of coming from CSS frameworks generally is a new GridItem widget we would wrap children in eg. GridItem(chart, col_span=2, row_span=2). If the widget is not withing a GridItem, we could default the renderer to show 1x1 col/row.

Noting that I've never been a huge fan of CSS grid and usually use flexbox to avoid doing grid-math stuff. Flexbox also can fake single-axis spans (using flex-basis percentages) but I think it can't do true 2D placement eg. there's no such thing as "spans 2 columns and 2 rows" w/o knowing about a second axis. So maybe for the grid, we could use CSS grid and then Flexbox could stay for Row/Column sizing (per-child grow and basis).

[dzole0311]

Also this might be relevant: https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/grid-template-areas for composing the layout, one of the examples show:

grid-template-areas:
  "a a a"
  "b c c"
  "b c c";

We could also add a templated_areas prop to the Grid as another way to compose layouts, to get something like this:

template_areas:
  "header header"
  "sidebar mainContent"
  "footer footer";