react-jsonschema-form icon indicating copy to clipboard operation
react-jsonschema-form copied to clipboard

MUI `anyOf` select title gets cropped if longer than options

Open TheOneTheOnlyJJ opened this issue 9 months ago • 2 comments

Prerequisites

What theme are you using?

mui

Version

5.22.4

Current Behavior

This:

Image

Notice how for the options Option A, Option B, and Option C, the Choose Option text gets cropped and has ... added to it. This is because the select widget length is calculated based on the options' lengths and does not account for the length of the title.

Expected Behavior

Ideally, the width of the select widget should be calculated like this: max(titleWidth, max(optionsWidths)). Could such a small fix be made? Maybe a CSS property exists for this? If Material UI does not allow such title length calculation, I will also open an issue there.

Steps To Reproduce

A simple anyOf schema with subschemas having titles shorter than the select title.

TheOneTheOnlyJJ avatar Feb 05 '25 14:02 TheOneTheOnlyJJ