eui

eui copied to clipboard

Summary

I strongly recommend following along by commit!

• Removes the exported BREAKPOINTS, BREAKPOINT_KEYS, getBreakpoint, isWithinBreakpoints, isWithinMaxBreakpoint, and isWithinMinBreakpoint breakpoint services
• Adds new useIsWithinMaxBreakpoint and useIsWithinMinBreakpoint hooks. These hooks correctly respect EUI theme breakpoint overrides instead of using static Amsterdam defaults.
  • Note that these new hooks now only take a breakpoint size instead of also accepting a numerical width (a change I decided on for simplicity - open to thoughts!)
• DRYs out the remaining components that were using isWithinMinBreakpoint / repeating their own window resize listeners (EuiFlyout and EuiCollapsibleNav) to use useIsWithinMinBreakpoint
  • Note that the change to remove numerical widths affects these components - from what I checked in Kibana however there are no usages

Screenshots

Checklist

• [x] Checked in mobile
• [x] Added documentation
• [x] Added or updated jest and cypress tests
• [x] Checked for breaking changes and labeled appropriately
• [x] A changelog entry exists and is marked appropriately

~- [ ] Checked in both light and dark modes~ ~- [ ] Checked in Chrome, Safari, Edge, and Firefox~ ~- [ ] Props have proper autodocs and playground toggles~ ~- [ ] Checked Code Sandbox works for any docs examples~ ~- [ ] Checked for accessibility including keyboard-only and screenreader modes~ ~- [ ] Updated the Figma library counterpart~

Preview documentation changes for this PR: https://eui.elastic.co/pr_6119/