[Lens][Query annotations] Discuss annotation query input

[mbondyra]

So far we had two versions of the annotation query input and both come with their set of good and bad sides cc @MichaelMarcialis

1. Query popover

• the whole query is visible both when the popover is closed and open, it's easy to see what's going on

• it's an extra 'popup' in a already open flyout and it may take a while for the user to see what's going on, especially because it opens when switching from manual annotation.

Sep-20-2022.10-47-48.mp4

2. Query inline input

• query is not fully visible when long and when closed
• is very narrow so difficult to read when typing a query

• it's not an extra element (just like the popup from 1) so it's just nicer to figure out what it does.

Maybe we could come up with a compromise here?

[elasticmachine]

Pinging @elastic/kibana-vis-editors @elastic/kibana-vis-editors-external (Team:VisEditors)

[flash1293]

I think we can find a different solution than the additional popover, but it's very important to have more screen space for this input. It's manageable for small examples but in a lot of common use cases these field names get much longer and the filter expressions are more complex especially for something like annotations. 300 pixels of width doesn't seems sufficient IMHO.

[MichaelMarcialis]

I think there's a number of possible directions we can take to improve over both of the previous versions that @mbondyra mentions above. Some exploration possibilities that immediately come to mind include:

• Switching from a single-line text input to a multi-line textarea (even when unfocused).
• Adding an "expanded" mode, similar to what we do with the formula editor.
• Allowing the user to horizontally resize the right-hand layer/configuration section (this is something we've avoided with good reason in the past, but bringing it up again here in case folks think it's worth discussing again).

There are likely other possibilities that I'm not thinking of at the moment, but one or more of these may be good to explore from the design side to see which would provide the most benefit. If we can plan to prioritize it against our other design to-dos, that would help me schedule time for that exploration.