fix(legend): action sizing ui and focus states #1102
Merged
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
nickofthyme
added
bug
nickofthyme
force-pushed
the
fix-legend-action-ui
branch
from
1259f80 to
b75b753
Compare
markov00
approved these changes
Apr 2, 2021
nickofthyme
commented
Apr 2, 2021
Comment on lines
+83
to
86
| if (items.length === 0 || items.every(({ isItemHidden }) => isItemHidden)) { | ||
| return null; | ||
| } | ||
|
|
There was a problem hiding this comment.
This does not free-up space for the chart when there is no legend rendered. We need to find a better way to set the size to zero in the get_legend_size selector without creating an infinite loop.
Codecov Report
@@ Coverage Diff @@
## master #1102 +/- ##
==========================================
+ Coverage 71.72% 72.14% +0.42%
==========================================
Files 381 397 +16
Lines 11917 12230 +313
Branches 2600 2629 +29
==========================================
+ Hits 8547 8823 +276
- Misses 3339 3368 +29
- Partials 31 39 +8
Flags with carried forward coverage won't be shown. Click here to find out more.
Continue to review full report at Codecov.
|
nickofthyme
pushed a commit
that referenced
this pull request
Apr 2, 2021
# [28.0.0](v27.0.0...v28.0.0) (2021-04-02) ### Bug Fixes * **annotations:** provide fallback for line annotation markers ([#1091](#1091)) ([0bd61f1](0bd61f1)) * **legend:** action sizing ui and focus states ([#1102](#1102)) ([3a76a2c](3a76a2c)) * **legend:** stop legend color picker dot twitching ([#1101](#1101)) ([c89b767](c89b767)) ### Code Refactoring * rename enum types to singular ([#1064](#1064)) ([396b3d1](396b3d1)), closes [#767](#767) ### BREAKING CHANGES * `AnnotationDomainTypes`, `AnnotationTypes`, `SeriesTypes`, `ChartTypes`, and `SpecTypes` are renamed to `AnnotationDomainType`, `AnnotationType`, `SeriesType`, `ChartType`, and `SpecType`
|
🎉 This PR is included in version 28.0.0 🎉 The release is available on: Your semantic-release bot 📦🚀 |
AMoo-Miki
pushed a commit
to AMoo-Miki/OpenSearch-Dashboards
that referenced
this pull request
Feb 10, 2022
# [28.0.0](elastic/elastic-charts@v27.0.0...v28.0.0) (2021-04-02) ### Bug Fixes * **annotations:** provide fallback for line annotation markers ([opensearch-project#1091](elastic/elastic-charts#1091)) ([d907c81](elastic/elastic-charts@d907c81)) * **legend:** action sizing ui and focus states ([opensearch-project#1102](elastic/elastic-charts#1102)) ([a58cc0a](elastic/elastic-charts@a58cc0a)) * **legend:** stop legend color picker dot twitching ([opensearch-project#1101](elastic/elastic-charts#1101)) ([f63bb3b](elastic/elastic-charts@f63bb3b)) ### Code Refactoring * rename enum types to singular ([opensearch-project#1064](elastic/elastic-charts#1064)) ([6e900e2](elastic/elastic-charts@6e900e2)), closes [opensearch-project#767](elastic/elastic-charts#767) ### BREAKING CHANGES * `AnnotationDomainTypes`, `AnnotationTypes`, `SeriesTypes`, `ChartTypes`, and `SpecTypes` are renamed to `AnnotationDomainType`, `AnnotationType`, `SeriesType`, `ChartType`, and `SpecType`
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
Overall fixes for action UI to match rest of legend
Screen.Recording.2021-03-31.at.12.58.46.PM.mp4
Notible changes/fixes include:
shared margins to create a more narrow footprint
Forced size of action popovers. This assumes that user will use the
EuiPopoverfor the actions and forces the size to be full height and width to have uniform focus state across the color dot (w/ or w/o a color picker), the series name (w/ or w/o extra value) and the actions.Before
After
Checklist
:focusis problematic in safari https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#clicking_and_focus