Goal: I'd like to expand a module frame's content to fit.
Steps: I have a module, containing a single component—a list view. I'd like the list view to expand to fit the size of the module. It seems like width already expands to fit the module out of the box, but not height. I'm looking for an 'Expand content to fit' option for the module frame, but there isn't one.
The consequence of this limitation is that when the module is imported into an app, and the module's parent container enables 'Expand content to fit' the module's internal components are stuck with their fixed size. This looks awful.
You should be able to click on the corner or bottom border line of the list view and drag the component size to fill up (close to) the entire space of the module.
Are you wanting the list view to have a scroll or no scrolling?
Hello @Jack_T — unfortunately that does not get at the issue I am trying to solve here.
I would like for the list view to resize according to the module's height. In other words, why doesn't the top-level module frame have a "Expand content to fit" option, the way other containers and frames do?
In the current state of things, adjusting the module's height when it is being used in an app does not influence/adjust the module content's height.
Check out this loom I made where I take a list view component, which I had manually stretched out to take up all the pixels in the modules frame. And how it sizes out when the module is used in an app.
This this what you are looking to accomplish or are you looking to have this but dynamic for any size of the module in the app?
The modules were built very early on in Retool's development. We are currently working on a major overhaul to update them to have styling and functionality upgrades to match the other components in Retool. This will likely be when they will get an "expand content to fit" option and why they currently do not have this.
Hey @Jack_T - When do you think the overhaul of modules will be release?
I have a similar, perhaps related issue.
I am trying to place a module (which is just a table) inside a container in a parent app with the Stack display type on the container. When I add the module to the parent app container, Stack options for height are available in the module settings (e.g., Auto, Fixed, Fill), and when Fill is selected it correctly fixes the bounding box of the module to the height of the container (i.e., you can see the purple module bounding box line looks correct).
However, when I load data into the table where a scroll is required, the table acts as though the "Auto" height is set which results in double scroll bars, one for the table and one for the container it is contained within. switching between "Fill" and "Auto" on the module properties in the parent app change nothing except the purple bounding box line of the module, which seems like it wants to enforce Fill and Auto, but in both cases only applies the Auto setting.
When I do not use a module, the table displays as expected with the Fill setting, and stops at the bottom of the page, with just single scroll bar on the table (so the summary row and footer are always visible) and not a secondary scroll bar on the container to get to the bottom of the table, like you get with the auto height setting.
Apologies for this issue, the height settings should definitely not be changing and adding a double scroll bar. Does the same behavior occur if you use the same components but not with the components in a module?
