-
Notifications
You must be signed in to change notification settings - Fork 8.5k
Upgrade @elastic/eui to 85.0.1 #162209
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
Upgrade @elastic/eui to 85.0.1 #162209
Conversation
9fa8a55 to
b2022cd
Compare
- `.presFilterByType__panel` already has its own width Sass, so move the width CSS there instead
…overPanel` - After Emotion conversion, no longer has any styles attached to it - use Emotion CSS instead
…ue to emotion conversion
|
Pinging @elastic/eui-team (EUI) |
Heenawter
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Presentation changes LGTM 👍
| <EuiPopover | ||
| id="unifiedFieldTypeFilter" | ||
| panelClassName="euiFilterGroup__popoverPanel" | ||
| panelProps={{ css: { width: euiTheme.base * 18 } }} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks @jughosta I'll look into that!
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The filter button width should be fixed as with 14e7469 - I hadn't realized folks in Kibana were using EuiFilterButton outside of EuiFilterGroup, so that's my bad :)
Regarding the filter item height - this looks like it was affected by #161592 (Sass styling order). I pushed up a specificity override for now (f5a55e0) which we can remove once more of EUI is on Emotion 🤞
Thanks for your eagle eye on these things @jughosta, you're amazing!!
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks for the fixes, @cee-chen! You are amazing! 😉
- `min-width` is now set on `EuiFilterButtons` even outside of `EuiFilterGroup`s, so CSS needs to update to take that into account
| panelPaddingSize="none" | ||
| anchorPosition="downCenter" | ||
| panelClassName="euiFilterGroup__popoverPanel" | ||
| panelProps={{ css: { width: euiTheme.base * 18 } }} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
nit: would prefer 18 to be a constant. Not sure what that number is supposed to correspond to.
@ryankeairns, you like to call this out often, what do you think?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Y'all are super welcome to set your own constant! The number is what .euiFilterGroup__popoverPanel was setting as a width in CSS/Sass (link), it's just not hidden behind an EUI CSS class anymore, as we are no longer providing component-specific CSS utilities to consumers.
In any case, width is fairly content-specific so we would prefer consumers figure out what width they want to display based on their content and not on a generic.
|
@elasticmachine merge upstream |
spong
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Security Detection Rule Mgmt changes (just two test updates) LGTM! Thanks @tkajtoch! 🙂
jughosta
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Data Discovery changes LGTM 👍
|
@elasticmachine merge upstream |
ryankeairns
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
👍 based upon this reply: https://github.com/elastic/kibana/pull/162209/files#r1273854410
|
@elasticmachine merge upstream |
💛 Build succeeded, but was flaky
Failed CI StepsTest Failures
Metrics [docs]Module Count
Async chunks
Page load bundle
History
To update your PR or re-run it, just comment with: cc @tkajtoch |
|
@elastic/response-ops As a heads up, we'll be asking @elastic/kibana-operations for an admin merge today as this PR has been open for over a week. If you encounter an issues that you think may be related to the upgrade after the fact (knock on wood), please feel free to ping us. |
## Summary `[email protected]` ⏩ `[email protected]` ## [`85.0.1`](https://github.com/elastic/eui/tree/v85.0.1) **Bug fixes** - Fixed `EuiFilterGroup`'s responsive styles ([elastic#6983](elastic/eui#6983)) ## [`85.0.0`](https://github.com/elastic/eui/tree/v85.0.0) - Updated `EuiThemeProvider` to set an Emotion theme context that returns the values of `useEuiTheme()` ([elastic#6913](elastic/eui#6913)) - Added `size` prop to `EuiStepsHorizontal`, defaulting to the previous size of `m` ([elastic#6928](elastic/eui#6928)) - Added new `s` sizing to `EuiStepsHorizontal` ([elastic#6928](elastic/eui#6928)) - Added `at` and `key` icon glyphs. ([elastic#6934](elastic/eui#6934)) - Added a new `cloneElementWithCss` Emotion utility ([elastic#6939](elastic/eui#6939)) - Updated `EuiPopover` to allow consumer control of all `focusTrapProps` ([elastic#6955](elastic/eui#6955)) **Bug fixes** - Fixed `EuiDataGrid` height calculation bug when browser zoom levels are not 100% ([elastic#6895](elastic/eui#6895)) - Fixed `EuiTab` not correctly passing selection color state to `prepend` and `append` children ([elastic#6938](elastic/eui#6938)) - Fixed `EuiInputPopover` to allow consumer control of its focus trap via `focusTrapProps` ([elastic#6955](elastic/eui#6955)) **Breaking changes** - `EuiProvider` will no longer render multiple or duplicate nested instances of itself. If a nested `EuiProvider` is detected, that instance will return early without further processing, and will warn if configured to do so via `setEuiDevProviderWarning`. For nested theming, use `EuiThemeProvider` instead. ([elastic#6949](elastic/eui#6949)) - Removed `onTrapDeactivation` prop from `EuiPopover`. Use `focusTrapProps.onDeactivation` instead ([elastic#6955](elastic/eui#6955)) **CSS-in-JS conversions** - Converted `EuiFilterGroup` and `EuiFilterButton` to Emotion; Removed styles attached to `.euiFilterGroup__popoverPanel` ([elastic#6957](elastic/eui#6957)) --------- Co-authored-by: Cee Chen <[email protected]> Co-authored-by: Kibana Machine <[email protected]>


Summary
[email protected]⏩[email protected]85.0.1Bug fixes
EuiFilterGroup's responsive styles (#6983)85.0.0EuiThemeProviderto set an Emotion theme context that returns the values ofuseEuiTheme()(#6913)sizeprop toEuiStepsHorizontal, defaulting to the previous size ofm(#6928)ssizing toEuiStepsHorizontal(#6928)atandkeyicon glyphs. (#6934)cloneElementWithCssEmotion utility (#6939)EuiPopoverto allow consumer control of allfocusTrapProps(#6955)Bug fixes
EuiDataGridheight calculation bug when browser zoom levels are not 100% (#6895)EuiTabnot correctly passing selection color state toprependandappendchildren (#6938)EuiInputPopoverto allow consumer control of its focus trap viafocusTrapProps(#6955)Breaking changes
EuiProviderwill no longer render multiple or duplicate nested instances of itself. If a nestedEuiProvideris detected, that instance will return early without further processing, and will warn if configured to do so viasetEuiDevProviderWarning. For nested theming, useEuiThemeProviderinstead. (#6949)onTrapDeactivationprop fromEuiPopover. UsefocusTrapProps.onDeactivationinstead (#6955)CSS-in-JS conversions
EuiFilterGroupandEuiFilterButtonto Emotion; Removed styles attached to.euiFilterGroup__popoverPanel(#6957)