Allotment.Pane to fit content

[tnaum-ms]

Hi everyone,

I'm new here and trying to build something that seems straightforward, but I’m struggling to get it configured correctly.

I’m using the Allotment component in React to create a layout like this:

<Allotment vertical={true}>
  <Allotment.Pane snap={true}>
    CONTROLS
  </Allotment.Pane>
  <Allotment.Pane>
    CONTENT
  </Allotment.Pane>
</Allotment>

In this setup, my CONTROLS area has a variable height depending on the width of the window due to responsive design, including some line breaks. I don’t know the height in px as it changes (and I don't want to measure it with js).

What I’m trying to achieve is for the CONTROLS Allotment.Pane to adapt its height to the content inside it, similar to how flex works with auto-sizing. In my previous prototype, I used flex and it worked fine, but I’d like to migrate to Allotment for future flexibility.

Does anyone know how to configure the CONTROLS Allotment.Pane to dynamically fit the height of its content? Any help or pointers would be greatly appreciated!

Thanks!