feat: increase tooltip width to 500px and truncate items to 2 lines #2261
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
mbondyra
force-pushed
the
tooltip/long_names
branch
2 times, most recently
from
821cc38 to
4a140b7
Compare
mbondyra
changed the title
mbondyra
force-pushed
the
tooltip/long_names
branch
from
4a140b7 to
3249115
Compare
markov00
reviewed
Nov 28, 2023
packages/charts/src/components/tooltip/components/_tooltip.scss
Outdated
Show resolved
Hide resolved
mbondyra
force-pushed
the
tooltip/long_names
branch
from
3249115 to
87e8975
Compare
mbondyra
commented
Nov 28, 2023
markov00
requested changes
Nov 28, 2023
...hots/tooltip/chart-types/cartesian/selecting-series-on-pinned-tooltip-async-chrome-linux.png
Outdated
Show resolved
Hide resolved
...ooltip.test.ts-snapshots/tooltip/chart-types/heatmap/pinning-with-selection-chrome-linux.png
Outdated
Show resolved
Hide resolved
|
Thank you @markov00 great tips! I addressed all your comments! 🙇🏼♀️ |
mbondyra
force-pushed
the
tooltip/long_names
branch
from
33396f6 to
09ded45
Compare
markov00
added
enhancement
markov00
approved these changes
Nov 29, 2023
|
buildkite update vrt |
markov00
pushed a commit
to markov00/elastic-charts
that referenced
this pull request
Dec 6, 2023
…lastic#2261) feat: truncate to 2 + width 500 # Conflicts: # e2e/screenshots/legend_stories.test.ts-snapshots/legend-stories/should-break-multiline-legends-with-long-url-characters-chrome-linux.png
markov00
added a commit
to markov00/elastic-charts
that referenced
this pull request
Dec 7, 2023
markov00
added a commit
to markov00/elastic-charts
that referenced
this pull request
Dec 7, 2023
markov00
added a commit
that referenced
this pull request
Dec 7, 2023
nickofthyme
pushed a commit
that referenced
this pull request
Dec 19, 2023
# [61.2.0](v61.1.0...v61.2.0) (2023-12-19) ### Bug Fixes * **deps:** update dependency @elastic/eui to ^91.1.0 ([#2267](#2267)) ([308e974](308e974)) * **deps:** update dependency @elastic/eui to ^91.2.0 ([#2268](#2268)) ([29cdcb3](29cdcb3)) * **metric:** background colors and sparkline rendering ([#2255](#2255)) ([5abddfc](5abddfc)) * **partition:** rendering with small radius ([#2273](#2273)) ([95a8537](95a8537)) * **partition:** zero value sectors cause max stack call ([#2260](#2260)) ([4b30db7](4b30db7)) * **theme:** legacy margins ([#2262](#2262)) ([299c869](299c869)) ### Features * increase tooltip width to 500px and truncate items to 2 lines ([#2261](#2261)) ([afdef1c](afdef1c))
1 task
markov00
added a commit
to elastic/kibana
that referenced
this pull request
Dec 21, 2023
[](https://renovatebot.com) This PR contains the following updates: | Package | Change | Age | Adoption | Passing | Confidence | |---|---|---|---|---|---| | [@elastic/charts](https://togithub.com/elastic/elastic-charts) | [`61.0.3` -> `61.2.0`](https://renovatebot.com/diffs/npm/@elastic%2fcharts/61.0.3/61.2.0) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | [](https://docs.renovatebot.com/merge-confidence/) | --- ### Release Notes <details> <summary>elastic/elastic-charts (@​elastic/charts)</summary> ### [61.2.0](elastic/elastic-charts@v61.1.0...v61.2.0) (2023-12-19) ##### Bug Fixes * **deps:** update dependency @elastic/eui to ^91.1.0 ([#2267](elastic/elastic-charts#2267)) ([308e974](elastic/elastic-charts@308e974)) * **deps:** update dependency @elastic/eui to ^91.2.0 ([#2268](elastic/elastic-charts#2268)) ([29cdcb3](elastic/elastic-charts@29cdcb3)) * **metric:** background colors and sparkline rendering ([#2255](elastic/elastic-charts#2255)) ([5abddfc](elastic/elastic-charts@5abddfc)) * **partition:** rendering with small radius ([#2273](elastic/elastic-charts#2273)) ([95a8537](elastic/elastic-charts@95a8537)) * **partition:** zero value sectors cause max stack call ([#2260](elastic/elastic-charts#2260)) ([4b30db7](elastic/elastic-charts@4b30db7)) * **theme:** legacy margins ([#2262](elastic/elastic-charts#2262)) ([299c869](elastic/elastic-charts@299c869)) ##### Features * increase tooltip width to 500px and truncate items to 2 lines ([#2261](elastic/elastic-charts#2261)) ([afdef1c](elastic/elastic-charts@afdef1c)) ### [`v61.1.0`](https://togithub.com/elastic/elastic-charts/blob/HEAD/CHANGELOG.md#6110-2023-11-20) [Compare Source](https://togithub.com/elastic/elastic-charts/compare/v61.0.3...v61.1.0) ##### Bug Fixes - **deps:** update dependency [@​elastic/eui](https://togithub.com/elastic/eui) to v91 ([#​2233](https://togithub.com/elastic/elastic-charts/issues/2233)) ([e89f623](https://togithub.com/elastic/elastic-charts/commit/e89f623792312c4f6b609ebb975de0800f3c297e)) - **metric:** add option to set empty cell background color ([#​2247](https://togithub.com/elastic/elastic-charts/issues/2247)) ([6a9fb86](https://togithub.com/elastic/elastic-charts/commit/6a9fb86bee5212a47060c5070f260961097014b4)) - **metric:** background color for bar with interactions ([#​2248](https://togithub.com/elastic/elastic-charts/issues/2248)) ([dcb56fa](https://togithub.com/elastic/elastic-charts/commit/dcb56fa08540631a9b3b0e588352ee6daf3d54a0)) ##### Features - **bullet:** improve header layout and positioning ([#​2243](https://togithub.com/elastic/elastic-charts/issues/2243)) ([b3a95d2](https://togithub.com/elastic/elastic-charts/commit/b3a95d24fb02690ca6599622352c743c04624690)) - **bullet:** new design style and implementation ([#​2156](https://togithub.com/elastic/elastic-charts/issues/2156)) ([fca6cdd](https://togithub.com/elastic/elastic-charts/commit/fca6cdd5bc34a65c0792dbab7d756404bf43501b)) </details> --- ### Configuration 📅 **Schedule**: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined). 🚦 **Automerge**: Disabled by config. Please merge this manually once you are satisfied. ♻ **Rebasing**: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox. 🔕 **Ignore**: Close this PR and you won't be reminded about this update again. --- - [ ] <!-- rebase-check -->If you want to rebase/retry this PR, check this box --- This PR has been generated by [Mend Renovate](https://www.mend.io/free-developer-tools/renovate/). View repository job log [here](https://developer.mend.io/github/elastic/kibana). <!--renovate-debug:eyJjcmVhdGVkSW5WZXIiOiIzNy44Ny4yIiwidXBkYXRlZEluVmVyIjoiMzcuMTAzLjEiLCJ0YXJnZXRCcmFuY2giOiJtYWluIn0=--> --------- Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> Co-authored-by: Marco Vettorello <marco.vettorello@elastic.co>
](https://renovatebot.com){kind=link}
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary
Fixes #2048 (I am not sure if we consider this issue fixed after merging this one)
Auto-expands the tooltip containter to 500px for wider content. The data items in the tooltip now truncate to 2 lines instead of just one.