[Visual Refresh] Implement shadow token and shadow util updates #9088
Conversation
This file contains hidden or 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
- renames existing changelogs to the merge PRs number; adds breaking changes for minor visual updates
mgadewoll
force-pushed
the
eui-theme/borealis-v2-poc
branch
from
e59c6bf to
c4f9f2e
Compare
mgadewoll
changed the title
Collaborator
💚 Build SucceededHistory
cc @mgadewoll |
Collaborator
💚 Build Succeeded
History
cc @mgadewoll |
mgadewoll
added
the
breaking change
|
This PR contains breaking changes. The opener of this pull request is asked to perform the following due diligence steps below, to assist EUI in our next Kibana upgrade:
|
16 tasks
tsullivan
pushed a commit
that referenced
this pull request
Oct 15, 2025
tkajtoch
added a commit
to elastic/kibana
that referenced
this pull request
Oct 20, 2025
- `@elastic/eui`: `v106.7.0` ⏩ `v107.0.0` - `@elastic/eui-theme-borealis`: `v3.5.0` ⏩ `v3.6.0` [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) --- ## Changes - Updated scrollable popovers `ResizableSuggestionsListDiv` of the unified search and `ESQLMenuPopover` to prevent broken "floating border" in dark mode (change to separate scrollable container into a standalone element) | before | after | |---|---| | <img width="634" height="854" alt="Screenshot 2025-10-06 at 19 50 01" src="https://github.com/user-attachments/assets/da141bb5-e478-4218-b5bb-5aff95f089ff" /> | <img width="634" height="854" alt="Screenshot 2025-10-06 at 19 50 15" src="https://github.com/user-attachments/assets/f098ce70-9690-46f3-a988-1ee9b8d78f5e" /> | | <img width="279" height="439" alt="Screenshot 2025-10-06 at 18 54 36" src="https://github.com/user-attachments/assets/7496fd91-542d-44d7-acc0-e6cb2ea23531" /> | <img width="274" height="423" alt="Screenshot 2025-10-06 at 18 57 53" src="https://github.com/user-attachments/assets/4d4aa039-f4c2-4266-ab1f-2f42125f1f84" /> | - Update usages of EUI shadow utils (e.g. `euiShadow()`) that are combined with `border` style to adjust the new automatic "floating border" to prevent duplicate borders - Update map button styles (aligning background color and borders) | before | after | |---|---| | <img width="66" height="254" alt="Screenshot 2025-10-14 at 08 21 06" src="https://github.com/user-attachments/assets/02f4fc3d-593d-4d30-bf67-3dd70960e074" /> | <img width="66" height="254" alt="Screenshot 2025-10-14 at 08 15 50" src="https://github.com/user-attachments/assets/0072d2c1-d47b-4014-944a-682f036937b5" /> | | <img width="66" height="254" alt="Screenshot 2025-10-14 at 08 21 27" src="https://github.com/user-attachments/assets/4e639428-43e6-4f39-8f9b-d873549508e8" /> | <img width="66" height="254" alt="Screenshot 2025-10-14 at 08 16 06" src="https://github.com/user-attachments/assets/a35760ec-1939-459e-b463-6b533a354352" /> | ## Package updates ## [`v107.0.0`](https://github.com/elastic/eui/releases/v107.0.0) - Added new shadow tokens ([#9088](elastic/eui#9088)) - `shadows.colors.base` - `shadows.xs` - `shadows.s` - `shadows.m` - `shadows.l` - `shadows.xl` - `shadows.flat` - `shadows.hover.base` - `shadows.hover.xl` - Updated shadow utility functions to return new tokens ([#9088](elastic/eui#9088)) - `euiShadow` - `euiShadowXSmall` - `euiShadowSmall` - `euiShadowMedium` - `euiShadowLarge` - `euiShadowXLarge` - `euiShadowFlat` - `euiSlightShadowHover` - Added shadow hover utility `euiShadowHover` ([#9088](elastic/eui#9088)) **Deprecations** - Deprecated `euiShadowFlat` and `useEuiShadowFlat` - use `euiShadow`/ `useEuiShadow` (size `xs`) or `euiShadowXSmall` instead ([#9088](elastic/eui#9088)) - Deprecated `euiSlightShadowHover` and `useEuiSlightShadowHover` - use `euiShadowHover` / `useEuiShadowHover` instead ([#9088](elastic/eui#9088)) **Breaking changes** - Updated shadow utility functions (e.g. `euiShadow`) to apply a floating border style in dark mode. This may lead to visual issues with double borders in dark mode when a regular `border` styling is applied. - Use the `options.border` argument on the utils to adjust or remove the floating border as needed. ([#9088](elastic/eui#9088)) ### `@elastic/eui-theme-borealis` ## [`v3.6.0`](https://github.com/elastic/eui/blob/main/packages/eui-theme-borealis/changelogs/CHANGELOG_2025.md#v360) - Added new shadow tokens ([#9088](elastic/eui#9088)) - `shadows.colors.base` - `shadows.xs` - `shadows.s` - `shadows.m` - `shadows.l` - `shadows.xl` - `shadows.flat` - `shadows.hover.base` - `shadows.hover.xl` --------- Co-authored-by: Lene Gadewoll <lene.gadewoll@elastic.co>
dmlemeshko
added a commit
to elastic/kibana
that referenced
this pull request
Oct 22, 2025
## Summary Fixing discover flaky test, caused by filter value input field not being properly populated. I believe it is also related to the recent EUI update and probably shadow changes in elastic/eui#9088 require us to wait before typing in input field.
kibanamachine
pushed a commit
to kibanamachine/kibana
that referenced
this pull request
Oct 22, 2025
## Summary Fixing discover flaky test, caused by filter value input field not being properly populated. I believe it is also related to the recent EUI update and probably shadow changes in elastic/eui#9088 require us to wait before typing in input field. (cherry picked from commit 68841a2)
kibanamachine
pushed a commit
to kibanamachine/kibana
that referenced
this pull request
Oct 22, 2025
## Summary Fixing discover flaky test, caused by filter value input field not being properly populated. I believe it is also related to the recent EUI update and probably shadow changes in elastic/eui#9088 require us to wait before typing in input field. (cherry picked from commit 68841a2)
nickpeihl
pushed a commit
to nickpeihl/kibana
that referenced
this pull request
Oct 23, 2025
- `@elastic/eui`: `v106.7.0` ⏩ `v107.0.0` - `@elastic/eui-theme-borealis`: `v3.5.0` ⏩ `v3.6.0` [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) --- ## Changes - Updated scrollable popovers `ResizableSuggestionsListDiv` of the unified search and `ESQLMenuPopover` to prevent broken "floating border" in dark mode (change to separate scrollable container into a standalone element) | before | after | |---|---| | <img width="634" height="854" alt="Screenshot 2025-10-06 at 19 50 01" src="https://github.com/user-attachments/assets/da141bb5-e478-4218-b5bb-5aff95f089ff" /> | <img width="634" height="854" alt="Screenshot 2025-10-06 at 19 50 15" src="https://github.com/user-attachments/assets/f098ce70-9690-46f3-a988-1ee9b8d78f5e" /> | | <img width="279" height="439" alt="Screenshot 2025-10-06 at 18 54 36" src="https://github.com/user-attachments/assets/7496fd91-542d-44d7-acc0-e6cb2ea23531" /> | <img width="274" height="423" alt="Screenshot 2025-10-06 at 18 57 53" src="https://github.com/user-attachments/assets/4d4aa039-f4c2-4266-ab1f-2f42125f1f84" /> | - Update usages of EUI shadow utils (e.g. `euiShadow()`) that are combined with `border` style to adjust the new automatic "floating border" to prevent duplicate borders - Update map button styles (aligning background color and borders) | before | after | |---|---| | <img width="66" height="254" alt="Screenshot 2025-10-14 at 08 21 06" src="https://github.com/user-attachments/assets/02f4fc3d-593d-4d30-bf67-3dd70960e074" /> | <img width="66" height="254" alt="Screenshot 2025-10-14 at 08 15 50" src="https://github.com/user-attachments/assets/0072d2c1-d47b-4014-944a-682f036937b5" /> | | <img width="66" height="254" alt="Screenshot 2025-10-14 at 08 21 27" src="https://github.com/user-attachments/assets/4e639428-43e6-4f39-8f9b-d873549508e8" /> | <img width="66" height="254" alt="Screenshot 2025-10-14 at 08 16 06" src="https://github.com/user-attachments/assets/a35760ec-1939-459e-b463-6b533a354352" /> | ## Package updates ## [`v107.0.0`](https://github.com/elastic/eui/releases/v107.0.0) - Added new shadow tokens ([elastic#9088](elastic/eui#9088)) - `shadows.colors.base` - `shadows.xs` - `shadows.s` - `shadows.m` - `shadows.l` - `shadows.xl` - `shadows.flat` - `shadows.hover.base` - `shadows.hover.xl` - Updated shadow utility functions to return new tokens ([elastic#9088](elastic/eui#9088)) - `euiShadow` - `euiShadowXSmall` - `euiShadowSmall` - `euiShadowMedium` - `euiShadowLarge` - `euiShadowXLarge` - `euiShadowFlat` - `euiSlightShadowHover` - Added shadow hover utility `euiShadowHover` ([elastic#9088](elastic/eui#9088)) **Deprecations** - Deprecated `euiShadowFlat` and `useEuiShadowFlat` - use `euiShadow`/ `useEuiShadow` (size `xs`) or `euiShadowXSmall` instead ([elastic#9088](elastic/eui#9088)) - Deprecated `euiSlightShadowHover` and `useEuiSlightShadowHover` - use `euiShadowHover` / `useEuiShadowHover` instead ([elastic#9088](elastic/eui#9088)) **Breaking changes** - Updated shadow utility functions (e.g. `euiShadow`) to apply a floating border style in dark mode. This may lead to visual issues with double borders in dark mode when a regular `border` styling is applied. - Use the `options.border` argument on the utils to adjust or remove the floating border as needed. ([elastic#9088](elastic/eui#9088)) ### `@elastic/eui-theme-borealis` ## [`v3.6.0`](https://github.com/elastic/eui/blob/main/packages/eui-theme-borealis/changelogs/CHANGELOG_2025.md#v360) - Added new shadow tokens ([elastic#9088](elastic/eui#9088)) - `shadows.colors.base` - `shadows.xs` - `shadows.s` - `shadows.m` - `shadows.l` - `shadows.xl` - `shadows.flat` - `shadows.hover.base` - `shadows.hover.xl` --------- Co-authored-by: Lene Gadewoll <lene.gadewoll@elastic.co>
NicholasPeretti
pushed a commit
to NicholasPeretti/kibana
that referenced
this pull request
Oct 27, 2025
- `@elastic/eui`: `v106.7.0` ⏩ `v107.0.0` - `@elastic/eui-theme-borealis`: `v3.5.0` ⏩ `v3.6.0` [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) --- ## Changes - Updated scrollable popovers `ResizableSuggestionsListDiv` of the unified search and `ESQLMenuPopover` to prevent broken "floating border" in dark mode (change to separate scrollable container into a standalone element) | before | after | |---|---| | <img width="634" height="854" alt="Screenshot 2025-10-06 at 19 50 01" src="https://github.com/user-attachments/assets/da141bb5-e478-4218-b5bb-5aff95f089ff" /> | <img width="634" height="854" alt="Screenshot 2025-10-06 at 19 50 15" src="https://github.com/user-attachments/assets/f098ce70-9690-46f3-a988-1ee9b8d78f5e" /> | | <img width="279" height="439" alt="Screenshot 2025-10-06 at 18 54 36" src="https://github.com/user-attachments/assets/7496fd91-542d-44d7-acc0-e6cb2ea23531" /> | <img width="274" height="423" alt="Screenshot 2025-10-06 at 18 57 53" src="https://github.com/user-attachments/assets/4d4aa039-f4c2-4266-ab1f-2f42125f1f84" /> | - Update usages of EUI shadow utils (e.g. `euiShadow()`) that are combined with `border` style to adjust the new automatic "floating border" to prevent duplicate borders - Update map button styles (aligning background color and borders) | before | after | |---|---| | <img width="66" height="254" alt="Screenshot 2025-10-14 at 08 21 06" src="https://github.com/user-attachments/assets/02f4fc3d-593d-4d30-bf67-3dd70960e074" /> | <img width="66" height="254" alt="Screenshot 2025-10-14 at 08 15 50" src="https://github.com/user-attachments/assets/0072d2c1-d47b-4014-944a-682f036937b5" /> | | <img width="66" height="254" alt="Screenshot 2025-10-14 at 08 21 27" src="https://github.com/user-attachments/assets/4e639428-43e6-4f39-8f9b-d873549508e8" /> | <img width="66" height="254" alt="Screenshot 2025-10-14 at 08 16 06" src="https://github.com/user-attachments/assets/a35760ec-1939-459e-b463-6b533a354352" /> | ## Package updates ## [`v107.0.0`](https://github.com/elastic/eui/releases/v107.0.0) - Added new shadow tokens ([elastic#9088](elastic/eui#9088)) - `shadows.colors.base` - `shadows.xs` - `shadows.s` - `shadows.m` - `shadows.l` - `shadows.xl` - `shadows.flat` - `shadows.hover.base` - `shadows.hover.xl` - Updated shadow utility functions to return new tokens ([elastic#9088](elastic/eui#9088)) - `euiShadow` - `euiShadowXSmall` - `euiShadowSmall` - `euiShadowMedium` - `euiShadowLarge` - `euiShadowXLarge` - `euiShadowFlat` - `euiSlightShadowHover` - Added shadow hover utility `euiShadowHover` ([elastic#9088](elastic/eui#9088)) **Deprecations** - Deprecated `euiShadowFlat` and `useEuiShadowFlat` - use `euiShadow`/ `useEuiShadow` (size `xs`) or `euiShadowXSmall` instead ([elastic#9088](elastic/eui#9088)) - Deprecated `euiSlightShadowHover` and `useEuiSlightShadowHover` - use `euiShadowHover` / `useEuiShadowHover` instead ([elastic#9088](elastic/eui#9088)) **Breaking changes** - Updated shadow utility functions (e.g. `euiShadow`) to apply a floating border style in dark mode. This may lead to visual issues with double borders in dark mode when a regular `border` styling is applied. - Use the `options.border` argument on the utils to adjust or remove the floating border as needed. ([elastic#9088](elastic/eui#9088)) ### `@elastic/eui-theme-borealis` ## [`v3.6.0`](https://github.com/elastic/eui/blob/main/packages/eui-theme-borealis/changelogs/CHANGELOG_2025.md#v360) - Added new shadow tokens ([elastic#9088](elastic/eui#9088)) - `shadows.colors.base` - `shadows.xs` - `shadows.s` - `shadows.m` - `shadows.l` - `shadows.xl` - `shadows.flat` - `shadows.hover.base` - `shadows.hover.xl` --------- Co-authored-by: Lene Gadewoll <lene.gadewoll@elastic.co>
kibanamachine
added a commit
to elastic/kibana
that referenced
this pull request
Nov 4, 2025
# Backport This will backport the following commits from `main` to `9.1`: - [[scout] fix discover flaky test (#240068)](#240068) <!--- Backport version: 9.6.6 --> ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sorenlouv/backport) <!--BACKPORT [{"author":{"name":"Dzmitry Lemechko","email":"dzmitry.lemechko@elastic.co"},"sourceCommit":{"committedDate":"2025-10-22T17:52:31Z","message":"[scout] fix discover flaky test (#240068)\n\n## Summary\n\nFixing discover flaky test, caused by filter value input field not being\nproperly populated. I believe it is also related to the recent EUI\nupdate and probably shadow changes in\nhttps://github.com/elastic/eui/pull/9088 require us to wait before\ntyping in input field.","sha":"68841a2793084c7a4a5bf36741e1572d09ccb1b1","branchLabelMapping":{"^v9.3.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:skip","backport:version","v9.2.0","v9.3.0","v9.1.6"],"title":"[scout] fix discover flaky test","number":240068,"url":"https://github.com/elastic/kibana/pull/240068","mergeCommit":{"message":"[scout] fix discover flaky test (#240068)\n\n## Summary\n\nFixing discover flaky test, caused by filter value input field not being\nproperly populated. I believe it is also related to the recent EUI\nupdate and probably shadow changes in\nhttps://github.com/elastic/eui/pull/9088 require us to wait before\ntyping in input field.","sha":"68841a2793084c7a4a5bf36741e1572d09ccb1b1"}},"sourceBranch":"main","suggestedTargetBranches":["9.2","9.1"],"targetPullRequestStates":[{"branch":"9.2","label":"v9.2.0","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"main","label":"v9.3.0","branchLabelMappingKey":"^v9.3.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/240068","number":240068,"mergeCommit":{"message":"[scout] fix discover flaky test (#240068)\n\n## Summary\n\nFixing discover flaky test, caused by filter value input field not being\nproperly populated. I believe it is also related to the recent EUI\nupdate and probably shadow changes in\nhttps://github.com/elastic/eui/pull/9088 require us to wait before\ntyping in input field.","sha":"68841a2793084c7a4a5bf36741e1572d09ccb1b1"}},{"branch":"9.1","label":"v9.1.6","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"}]}] BACKPORT--> Co-authored-by: Dzmitry Lemechko <dzmitry.lemechko@elastic.co>
kibanamachine
added a commit
to elastic/kibana
that referenced
this pull request
Nov 4, 2025
# Backport This will backport the following commits from `main` to `9.2`: - [[scout] fix discover flaky test (#240068)](#240068) <!--- Backport version: 9.6.6 --> ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sorenlouv/backport) <!--BACKPORT [{"author":{"name":"Dzmitry Lemechko","email":"dzmitry.lemechko@elastic.co"},"sourceCommit":{"committedDate":"2025-10-22T17:52:31Z","message":"[scout] fix discover flaky test (#240068)\n\n## Summary\n\nFixing discover flaky test, caused by filter value input field not being\nproperly populated. I believe it is also related to the recent EUI\nupdate and probably shadow changes in\nhttps://github.com/elastic/eui/pull/9088 require us to wait before\ntyping in input field.","sha":"68841a2793084c7a4a5bf36741e1572d09ccb1b1","branchLabelMapping":{"^v9.3.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:skip","backport:version","v9.2.0","v9.3.0","v9.1.6"],"title":"[scout] fix discover flaky test","number":240068,"url":"https://github.com/elastic/kibana/pull/240068","mergeCommit":{"message":"[scout] fix discover flaky test (#240068)\n\n## Summary\n\nFixing discover flaky test, caused by filter value input field not being\nproperly populated. I believe it is also related to the recent EUI\nupdate and probably shadow changes in\nhttps://github.com/elastic/eui/pull/9088 require us to wait before\ntyping in input field.","sha":"68841a2793084c7a4a5bf36741e1572d09ccb1b1"}},"sourceBranch":"main","suggestedTargetBranches":["9.2","9.1"],"targetPullRequestStates":[{"branch":"9.2","label":"v9.2.0","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"main","label":"v9.3.0","branchLabelMappingKey":"^v9.3.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/240068","number":240068,"mergeCommit":{"message":"[scout] fix discover flaky test (#240068)\n\n## Summary\n\nFixing discover flaky test, caused by filter value input field not being\nproperly populated. I believe it is also related to the recent EUI\nupdate and probably shadow changes in\nhttps://github.com/elastic/eui/pull/9088 require us to wait before\ntyping in input field.","sha":"68841a2793084c7a4a5bf36741e1572d09ccb1b1"}},{"branch":"9.1","label":"v9.1.6","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"}]}] BACKPORT--> Co-authored-by: Dzmitry Lemechko <dzmitry.lemechko@elastic.co>
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
closes https://github.com/elastic/eui-private/issues/280
Important
This PR only merged a feature branch into
main. All changes were previously reviewed and QA'd separately.This PR contains the changes of the following PRs:
Note
As there are no new changes to this PR, this PR does however update the changelog number to combine both included PRs into a single changelog.
Why are we making this change?
💅 UI updates: The changes on shadows are part of the Visual Refresh project.
Screenshots #
euiShadow)Impact to users
🟡 🔴 There are no breaking code changes, but some usages of EUI shadow utils like
euiShadowthat were combined with customborderstyles might require updates to prevent visual issues due to duplicate borders in dark mode when the automatic "floating border" is applied.The "floating border" on EUI shadow utils can be adjusted or removed via
options.border(docs).Required Kibana changes have been prepared here.
Updates for Kibana scrollable popovers
QA
🟢 All changes have been QA'ed previously on the separate PRs.
General checklist
@defaultif default values are missing) and playground toggles