From what I understand, UXP dialogs cannot be responsive, so I would like to know how to change the size based on the amount of items displayed. I was thinking media queries of some kind, but is there another way?
My dialog height/widths are currently hard-coded, and it works fine until I add more elements, then they end up overlapping.
To be a pedant; responsive means content adapting to fit a changing frame, whereas you’re asking for the opposite - a frame that fits its content.
You could in theory calculate the width of your content and then use that to change the hard coded width of your dialogue - that would essentially still be a static width dialogue, just one that’s width is dynamically determined before it is rendered. In a similar vein you could calculate the total content width and then change the width of individual elements in your dialogue html to fit.
Both seem rather inelegant solutions to me that probably involve some “magic numbers” which is never great.
Personally I’d reapproach your design from the perspective of having your layout change instead.