[Discover][Flyout] Update overview fields table with new prop headerVisibility set to false#260692
Merged
tfcmarques merged 2 commits intoelastic:mainfrom Apr 2, 2026
Conversation
tfcmarques
added
Feature:Discover
Contributor
|
Pinging @elastic/obs-exploration-team (Team:obs-exploration) |
… actions popover to overflow
tfcmarques
commented
Apr 1, 2026
Comment on lines
+327
to
+341
| '&.euiDataGrid--noHeader': { | ||
| overflow: 'visible', | ||
| }, | ||
|
|
||
| '&.euiDataGrid--noHeader .euiDataGrid__content': { | ||
| overflow: 'visible', | ||
| }, | ||
|
|
||
| '&.euiDataGrid--noHeader .euiDataGrid__virtualized': { | ||
| overflow: 'visible !important', | ||
| }, | ||
|
|
||
| '&.euiDataGrid--noHeader .euiDataGridRow:first-of-type .euiDataGridRowCell': { | ||
| borderBlockStart: 'none', | ||
| }, |
Contributor
Author
There was a problem hiding this comment.
This was added due to an odd interaction when no header is visible in the table. The actions popover toolbar doesn't overflow, so it would be clipped. Also, the first row has a top border, which is unnecessary in our use case.
I'm wondering if we should open an enhancement/bug issue on EUI regarding this, at least for the action toolbar being clipped 🤔
Contributor
There was a problem hiding this comment.
you could show it to them and ask their input on this.
Contributor
There was a problem hiding this comment.
Agreed, I'd rather not keep these overrides around permanently if it can be fixed in EUI.
justinkambic
approved these changes
Apr 1, 2026
Contributor
justinkambic
left a comment
justinkambic
left a comment
There was a problem hiding this comment.
Tested this out locally LGTM!
davismcphee
approved these changes
Apr 2, 2026
Contributor
davismcphee
left a comment
davismcphee
left a comment
There was a problem hiding this comment.
Data Discovery changes LGTM 👍
Comment on lines
+327
to
+341
| '&.euiDataGrid--noHeader': { | ||
| overflow: 'visible', | ||
| }, | ||
|
|
||
| '&.euiDataGrid--noHeader .euiDataGrid__content': { | ||
| overflow: 'visible', | ||
| }, | ||
|
|
||
| '&.euiDataGrid--noHeader .euiDataGrid__virtualized': { | ||
| overflow: 'visible !important', | ||
| }, | ||
|
|
||
| '&.euiDataGrid--noHeader .euiDataGridRow:first-of-type .euiDataGridRowCell': { | ||
| borderBlockStart: 'none', | ||
| }, |
Contributor
There was a problem hiding this comment.
Agreed, I'd rather not keep these overrides around permanently if it can be fixed in EUI.
mbondyra
added a commit
to mbondyra/kibana
that referenced
this pull request
Apr 2, 2026
…heck * commit 'af66aadafa7470ca8ba3e3edd3793bde81fa4596': (31 commits) [Scout] Update test config manifests (elastic#260850) [SLO]: register alerts schema embeddable (elastic#256570) [Discover][Flyout] Update overview fields table with new prop headerVisibility set to false (elastic#260692) [AiButton/Security] Migrate ai-related buttons to use custom styles (elastic#259847) [One Workflow] Fix connector step icons falling back to generic plugs in YAML editor (elastic#260785) [Agent Builder] Dashboard skill: Guard against editing non-ESQL based panels (elastic#260714) Security quality gate Cypress cleanup - Periodic Pipeline (elastic#260820) [Search] Deprecate search indices in favour of index management (elastic#260210) Upgrade dependency @elastic/charts to v71.4.0 (elastic#260593) [Security Solution] [HDQ]: integration-based targeting and descriptor versioning (elastic#258418) docs(saved-objects): consolidate docs and document scoped vs system client (elastic#260743) Fix observability UIAM config and add CPS observability variant (elastic#260485) [Security Solution] Add "matched_indices_count" rule execution metric (elastic#259938) [SigEvents] Add callout with working promote action. (elastic#260433) [Alerting V2] Episode table actions (elastic#260195) [Automatic Migration] Add ability to skip Reference Set step in QRadar upload workflow (elastic#259959) [Rules] KQL-to-DSL conversion without data view produces incorrect queries for keyword fields for Metric threshold rule (elastic#260046) Update dependency lightningcss to v1.32.0 (main) (elastic#259017) Update postcss (main) (elastic#255420) Migrate server-side apm.addLabels to OTel dual-write helpers (elastic#259619) ...
paulinashakirova
pushed a commit
to paulinashakirova/kibana
that referenced
this pull request
Apr 2, 2026
…isibility set to false (elastic#260692) ## Summary Closes elastic#248314 Removes the header row from the `EuiDataGrid` used in the Discover flyout Overview tab for both Traces and Logs documents. ### Context The original design for the Overview tab key fields table didn't include a column header, but we shipped with it visible because `EuiDataGrid` didn't support hiding it at the time. Now that EUI supports the `headerVisibility` prop ([EuiDataGrid: Support rendering the header optionally](elastic/eui#8386)), we can set it to `false` to match the original intended design. ### Changes - Added an optional `headerVisibility` prop to `TableGrid`, passing it through to `EuiDataGrid` - Set `headerVisibility={false}` in `ContentFrameworkTable`, which is the shared component used by both the Traces and Logs overview - Added CSS overrides scoped to `.euiDataGrid--noHeader` in `TableGrid` to handle visual adjustments when the header is hidden: - Removed the top border on the first data row (previously adjacent to the header) - Set `overflow: visible` on the grid root, content wrapper, and virtualized container so that the first row's cell actions popover toolbar (positioned above each cell) is not clipped - Simplified the Traces table panel by removing the custom `padding-bottom` override (matching Logs overview table panel) ### Demo https://github.com/user-attachments/assets/b111051e-0e53-4d23-82fa-f71b5dba26ce
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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
6 participants
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 #248314
Removes the header row from the
EuiDataGridused in the Discover flyout Overview tab for both Traces and Logs documents.Context
The original design for the Overview tab key fields table didn't include a column header, but we shipped with it visible because
EuiDataGriddidn't support hiding it at the time. Now that EUI supports theheaderVisibilityprop (EuiDataGrid: Support rendering the header optionally), we can set it tofalseto match the original intended design.Changes
headerVisibilityprop toTableGrid, passing it through toEuiDataGridheaderVisibility={false}inContentFrameworkTable, which is the shared component used by both the Traces and Logs overview.euiDataGrid--noHeaderinTableGridto handle visual adjustments when the header is hidden:overflow: visibleon the grid root, content wrapper, and virtualized container so that the first row's cell actions popover toolbar (positioned above each cell) is not clippedpadding-bottomoverride (matching Logs overview table panel)Demo
Screen.Recording.2026-04-01.at.13.56.26.mov