Layout group + content size fitter together

I have a Panel containing a TextMeshPro (TMP) object and a few other (buttons for example) aligned vertically. I want the following behavior:

1) Panel size expands vertically as more text is added to the TMP or more elements are added (e.g. buttons and sub-images).

2) As more text is added to the TMP, we stop expanding the size of the Panel and instead use overflow (ellipses or whatever).

So it should look like this when the text is long:
https://photos.app.goo.gl/PvG56GYnLAGcyB2F6

And this when the text is short
https://photos.app.goo.gl/wXndPj1aKYoYYs1u6

My current setup has Vertical Layout Group and Content Size Fitter components in the Panel.

The Vertical Layout Group has "Control Child Size" ticked but not "Use Child Scale" or "Force Child Expand".

The Content Size Fitter has "Preferred Size" for vertical fit.

The TMP object has a Layout Element component. If I set this component to a specific preferred size it gets fixed at that size and so handles overflow well but when the text content is short there is tons of extra space:
https://photos.app.goo.gl/M9TjWJef9Vo2X9Km7

If I uncheck preferred size from the TMP, the TMP object shrinks to fit small amounts of text snugly (as I want). However, when I add lots of text it keeps growing without a cap, eventually taking over the entire screen and more.
https://photos.app.goo.gl/8aAK8N6BXYvFisrWA

Is there any way to achieve my desired behavior by tweaking the settings of the Layout Element/Content Size Fitter/Vertical Layout Group? Or do I have to write a new component that turns on preferred size to cap the height when text reaches a certain length?

Thanks!

Edit: I found this which did the trick https://forum.unity.com/threads/rect-transform-size-limiter.620860/