Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improve Timelion multiline expression input UX #12098

Closed
cjcenizal opened this issue May 31, 2017 · 2 comments
Closed

Improve Timelion multiline expression input UX #12098

cjcenizal opened this issue May 31, 2017 · 2 comments
Assignees
Labels
Feature:Timelion Timelion app and visualization release_note:enhancement Team:Visualizations Visualization editors, elastic-charts and infrastructure

Comments

@cjcenizal
Copy link
Contributor

cjcenizal commented May 31, 2017

As noted in #11972 (comment), the UX we want is:

  1. Initially the input is a single-line in height.
  2. When the user focuses on the input, it expands slightly to indicate that it can accept multiple lines.
  3. As the user adds newlines, the input expands, up to a max height.
  4. When the input loses focus, it contracts back to a single line.
  5. If the user resizes the input, the above behavior is circumvented.

See 6ba00d2 for a prior implementation and #11972 (comment) for an explanation. See https://codepen.io/vsync/pen/frudD for a prototype of complementary behavior.

This is blocked by a Chrome bug: https://bugs.chromium.org/p/chromium/issues/detail?id=94583. Here's a demo of a JS-based workaround: http://jsfiddle.net/nz8ut/2/.

@cjcenizal cjcenizal added Feature:Timelion Timelion app and visualization Feature:Visualizations Generic visualization features (in case no more specific feature label is available) release_note:enhancement labels May 31, 2017
@cjcenizal
Copy link
Contributor Author

CC @alexfrancoeur

@cjcenizal cjcenizal self-assigned this May 31, 2017
@timroes timroes added Team:Visualizations Visualization editors, elastic-charts and infrastructure and removed Feature:Visualizations Generic visualization features (in case no more specific feature label is available) labels Sep 16, 2018
@timroes
Copy link
Contributor

timroes commented Mar 5, 2021

This is addressed in newer versions of Kibana, since we're using the monaco editor for the timelion input clearly showing the multi line behavior.

@timroes timroes closed this as completed Mar 5, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Feature:Timelion Timelion app and visualization release_note:enhancement Team:Visualizations Visualization editors, elastic-charts and infrastructure
Projects
None yet
Development

No branches or pull requests

2 participants