Add context or further explanation to any input field

[apolinario]

Is your feature request related to a problem? Please describe. Sometimes the users may not know what a field or parameter does to the model or to the demo. There can be case that the name or label can't fully capture what it does and further explanation is needed

Describe the solution you'd like A suggestion would be to take inspiration from Streamlit add a 'help' option to all inputs, the help would then show on the front-end as a question mark icon on the top right of the input. Here's a Streamlit example with the tooltip hovered

[pngwn]

I think a mechanism to provide additional context for certain input would be great. We would need to be careful about how we do that, tooltips are problematic, especially on mobile:

• https://www.nngroup.com/articles/tooltip-guidelines/
• https://adamsilver.io/blog/the-problem-with-tooltips-and-what-to-do-instead/

cc @gary149

[abidlabs]

I wonder if we can just use grayed out or slightly smaller text, something like this:

[pngwn]

This is preferable, as it is always on the page. A toggle (like the details html element) would work well for descriptions that are too long.

[brunoschirmer]

very interested in having a way to write an explanation/description of the fields, both inputs and outputs. also, being able to do side by side boxes like in the blocks class would be pretty cool too

[gary149]

I wonder if we can just use grayed out or slightly smaller text, something like this:

I agree that this is the right way of doing it 👍

[vzakharov]

Hey @abidlabs, any update on this? Please note that e.g. Stable Diffusion Web UI uses tooltips that open on hovering on a [?] symbol next to a field. To me this would be the preferable way because it wouldn’t clutter the interface for people who already know what input fields do.

[abidlabs]

That’s a good suggestion @vzakharov, what do you think about that @pngwn @gary149 to avoid cluttering the UI?

[pngwn]

Strongly against tooltips for the reasons stated above: https://github.com/gradio-app/gradio/issues/959#issuecomment-1092765007

They are an accessibility nightmare and almost unusable on mobile which accounts for lots of our usage. We should opt for collapsible text similar to accordions. I'll take a look at this an come up with a proposal soon.