Stacks beta signup 🍔

Hey All,

Last Dev Day, we talked about Stacks, which are flexbox-like containers that can provide more layout granularity than Retool’s 12-column grid. We’re ready to launch Stacks in a private beta for Cloud users. If you’d like to test Stacks, please fill out this form. Stacks are live on cloud and self-hosted v3.75+.

If you have any feedback, please feel free to share it in this thread or by emailing kent@retool.com. Stacks are not yet fully featured, but they’re stable enough to start to use in apps and experiment with. Here’s a non-exhaustive list of the next things we’ll be working on:

  • A flex-wrap equivalent
  • Adding stacks as a layout option on all frames (sidebar, header, main)
  • Directly specifying component height/width with pixel values
  • Reordering Stack components in the component tree instead of by dragging on the canvas

There are a few known bugs & ergonomic issues:

  • Copying and pasting within a Stack does not add the pasted component to the end of the Stack
  • Copying and pasting within a Stack does not preserve component height/width settings

How do I turn stacks on?
Stacks are an option on Container and Group components – they can be toggled by setting a container’s “Display” property to “Stack”.Thanks!

9 Likes

Hello!
I noticed that when I try to use a stack in the header of a sidebar the stack throws some errors and then remains hidden.

Is this not supported or not intended?

Thank you

Hey @Gabriele_Filaferro - that is unexpected, stacks should work fine in the header of the sidebar. I just tested it on my side and and it seems to work. Are you able to consistently reproduce?

Hi, sorry the issue I found yesterday is not strictly related to the sidebar but to stacks in general:

  • after adding a stack, the Retool UI shows a few error notifications and an error in the stack;
  • even if the UI lets me add widgets to the stack when I enter preview mode the stack is not showing;
  • only once I reload the page I see the stack I created before, but it is empty (I can still add components to it)

This is not an actual blocker because in the end as I'm still able to add and use stacks, but it is quite cumbersome.

Here is a video of the behavior.

Please le me now if I'm doing something wrong or you need additional info.

Thanks

1 Like