Skip to content

[9.0] Upgrade EUI to v101.0.1 (#215698)#216378

Merged
mgadewoll merged 2 commits intoelastic:9.0from
mgadewoll:backport/9.0/pr-215698
Mar 31, 2025
Merged

[9.0] Upgrade EUI to v101.0.1 (#215698)#216378
mgadewoll merged 2 commits intoelastic:9.0from
mgadewoll:backport/9.0/pr-215698

Conversation

@mgadewoll
Copy link
Contributor

Backport

This will backport the following commits from main to 9.0:

Questions ?

Please refer to the Backport tool documentation

`100.0.0` ⏩ `101.0.1`

[Questions? Please see our Kibana upgrade
FAQ.](https://github.com/elastic/eui/blob/main/wiki/eui-team-processes/upgrading-kibana.md#faq-for-kibana-teams)

## Package updates

### `@elastic/eui`
[`v101.0.1`](https://github.com/elastic/eui/releases/v101.0.1)

- Updated `EuiProvider` and `EuiThemeProvider` with a new
`highContrastMode` ([elastic#8444](elastic/eui#8444))
- This prop allows toggling a higher contrast visual style that
primarily affects borders and shadows
- On `EuiProvider`, if the `highContrastMode` prop is not passed, this
setting will inherit from the user's OS/system settings
- If the user is using a forced colors mode (e.g. Windows' high contrast
themes), this system setting will take precedence over any
`highContrastMode` or `colorMode` props passed
- Added `highContrastModeStyles` and `preventForcedColors` styling utils
([elastic#8444](elastic/eui#8444))
- Updated `EuiRangeTooltip` to be easier to see in dark mode
([elastic#8444](elastic/eui#8444))
- Updated some deprecated color token usages that have direct
substitutes ([elastic#8444](elastic/eui#8444))
  - `text` -> `textParagraph`
  - `title` -> `textHeading`
  - `subduedText` -> `textSubdued`
  - `disabledText` -> `textDisabled`
  - `accentText` -> `textAccent`
  - `dangerText` -> `textDanger`
  - `warningText` -> `textWarning`
- `useEuiShadow()` now accepts a second `options` argument
([elastic#8234](elastic/eui#8234))
- `useEuiShadowFlat()` now accepts an `options` object instead of only a
color ([elastic#8234](elastic/eui#8234))
- Updated `EuiPopover` and `EuiToolTip` to be easier to see in dark
mode. ([elastic#8174](elastic/eui#8174))

**Bug fixes**

- Fixed a visual bug where a transparent border would create visible
empty space (`LIGHT` mode only) for the components:
([elastic#8427](elastic/eui#8427))
  - `EuiPanel`
  - `EuiPopover`
  - `EuiToolTip`
  - `EuiToast`
  - `EuiTour`

  ---

### `@elastic/eui-theme-common`
[`v0.1.0`](https://github.com/elastic/eui/releases/v0.1.0)

- Removed type `EuiShadowCustomColor`
([elastic#8444](elastic/eui#8444))
- Added types:  ([elastic#8444](elastic/eui#8444))
  - `EuiShadowOptions`
  - `EuiThemeHighContrastModeProp`
  - `EuiThemeHighContrastMode`
- Updated shadow utils to accepts a second `options` argument and return
borders in high contrast mode:
([elastic#8444](elastic/eui#8444))
  - `euiShadow`
  - `euiShadowXSmall`
  - `euiShadowSmall`
  - `euiShadowMedium`
  - `euiShadowLarge`
  - `euiSlightShadowHover`
  - `euiShadowFlat`

  ---

### `@elastic/eui-theme-borealis`
[`v0.1.0`](https://github.com/elastic/eui/releases/v0.1.0)

- Added new component level tokens:
([elastic#8444](elastic/eui#8444))
  - `buttonGroupBackgroundDisabledSelected`
  - `overlayMaskBackground`
  - `overlayMaskBackgroundHighContrast`
  - `skeletonBackgroundSkeletonMiddleHighContrast`

## Additional changes

The latest `@elastic/eui` package introduces high contrast mode support.
This PR sets all usages of `EuiProvider` to use
`highContrastMode={false}` to introduce it in disabled state (this
reflects the current functionality in Kibana). This is because the UI
for the high contrast mode functionality (and style adjustments) need to
first be implemented on Kibana side (by shared-ux).

## QA

Adding high contrast mode in disabled state should result in no visual
changes in Kibana. Please ensure your product view remain unchanged.

---------

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
(cherry picked from commit 2cd777d)

# Conflicts:
#	src/platform/plugins/shared/discover/public/application/main/components/layout/discover_layout.test.tsx
@mgadewoll mgadewoll added the backport This PR is a backport of another PR label Mar 28, 2025
@mgadewoll mgadewoll enabled auto-merge (squash) March 28, 2025 19:37
@botelastic botelastic bot added Team:obs-ux-infra_services - DEPRECATED DEPRECATED - Use Team:obs-presentation. Team:actionable-obs Formerly "obs-ux-management", responsible for SLO, o11y alerting, significant events, & synthetics. labels Mar 28, 2025
@elasticmachine
Copy link
Contributor

Pinging @elastic/obs-ux-infra_services-team (Team:obs-ux-infra_services)

@elasticmachine
Copy link
Contributor

Pinging @elastic/obs-ux-management-team (Team:obs-ux-management)

@mgadewoll mgadewoll added the EUI label Mar 28, 2025
@elasticmachine
Copy link
Contributor

Pinging @elastic/eui-team (EUI)

@mgadewoll
Copy link
Contributor Author

@elasticmachine merge upstream

@mgadewoll mgadewoll disabled auto-merge March 31, 2025 07:25
@mgadewoll mgadewoll self-assigned this Mar 31, 2025
@elasticmachine
Copy link
Contributor

💚 Build Succeeded

Metrics [docs]

Module Count

Fewer modules leads to a faster build time

id before after diff
controls 427 429 +2
dashboard 716 718 +2
maps 1318 1320 +2
ml 2144 2147 +3
visTypeVega 500 503 +3
total +12

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id before after diff
aiops 452.0KB 452.0KB -5.0B
apm 2.3MB 2.3MB -5.0B
controls 414.7KB 420.8KB +6.2KB
dashboard 529.9KB 535.5KB +5.6KB
datasetQuality 240.3KB 240.3KB -13.0B
infra 1.1MB 1.1MB -8.0B
maps 2.9MB 2.9MB +5.6KB
ml 4.4MB 4.4MB +7.6KB
profiling 401.2KB 401.2KB -22.0B
securitySolution 8.8MB 8.8MB -8.0B
slo 760.0KB 760.0KB -40.0B
synthetics 836.5KB 836.4KB -8.0B
ux 170.0KB 169.9KB -16.0B
visTypeTimeseries 484.5KB 484.5KB -16.0B
visTypeVega 1.9MB 1.9MB +7.7KB
visualizations 340.8KB 340.8KB -16.0B
total +32.5KB

Page load bundle

Size of the bundles that are downloaded on every page load. Target size is below 100kb

id before after diff
expressions 92.4KB 92.4KB -8.0B
kbnUiSharedDeps-npmDll 6.0MB 6.0MB +32.1KB
kbnUiSharedDeps-srcJs 3.5MB 3.5MB +20.0B
presentationPanel 11.0KB 11.0KB -8.0B
visDefaultEditor 29.4KB 29.4KB -8.0B
visualizations 35.3KB 35.3KB -8.0B
total +32.1KB

History

cc @mgadewoll

@tkajtoch tkajtoch self-requested a review March 31, 2025 09:29
Copy link
Member

@tkajtoch tkajtoch left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@mgadewoll mgadewoll merged commit a2e929b into elastic:9.0 Mar 31, 2025
9 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

backport This PR is a backport of another PR EUI Team:actionable-obs Formerly "obs-ux-management", responsible for SLO, o11y alerting, significant events, & synthetics. Team:obs-ux-infra_services - DEPRECATED DEPRECATED - Use Team:obs-presentation.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants

Comments