Growing Dialog with a Lazy Grid

How should I style a vaadin-grid to grow up to some point also growing the vaadin-dialog it’s in?

So you want the dialog and the grid to be as tall as the browser window? Or what is it that you are trying to achieve?

I want the dialog to be as short as possible. The dialog contains some text and a grid. If the grid has more rows, it should grow and the dialog should grow also. The dialog should grow to max 90% of the browser window. If there is no more space to grow, the grid should have a scrollbar.

My first instinct of setting min-height: 50px; height: auto; flex-grow: 1; on the grid did not work, it collapes to the 50px.

Hm. I’m not sure how to do that, since I think the way the grid handles the rows will get in the way of that working. I’ll ping some folks who know the internals of Grid better than I do

Here’s what @useful-whale said:
that’s been worked on recently, and there’s a workaround while waiting for the fix: [grid] When using `all-rows-visible` grid doesn't respect `max-height` · Issue #2150 · vaadin/web-components · GitHub

Is it achievable without using all-rows-visible? I’d like to use lazy loading with a scrollbar

But thanks, I can use this workaround in one case. :slightly_smiling_face:

@determined-zonkey could comment better, but my understanding is that all-rows-visible + max-height will, in fact, lazy load

Ah, missed the notification. But yes, with max-height applied, grid will lazy-load items even if it has all-rows-visible