[EuiContextMenu] Support data attributes in context menu panels by weronikaolejniczak · Pull Request #9323 · elastic/eui

weronikaolejniczak · 2026-01-16T10:14:42Z

Summary

Extended the EuiContextMenuPanelDescriptor interface with CommonProps. Those properties that would result in invalid DOM attribute were destructured and the rest are spread to EuiContextMenuPanel.
Added a Jest test case for data-test-subj specifically.

Why are we making this change?

Resolves #9321

We want to allow consumer to pass data attributes to the underlying EuiContextMenuPanel.

Impact to users

🟢

QA

Specific checklist

Verify TS allows passing data-* attributes with panel data like so:

<EuiContextMenu
  panels={[
    {
      id: 0,
      title: 'Panel 0',
      'data-test-subj': 'panel0',
      items: [
        {
          name: 'Item 1',
          key: 'item1',
        },
      ],
    },
  ]}
/>

Verify data-test-subj ends up in DOM when passed

General checklist

Browser QA
- Checked in both light and dark modes
- Checked in both MacOS and Windows high contrast modes
  - (emulate forced colors if you do not have access to a Windows machine.)
- Checked in mobile
- Checked in Chrome, Safari, Edge, and Firefox
- Checked for accessibility including keyboard-only and screenreader modes
Docs site QA
- Added documentation
- Props have proper autodocs (using @default if default values are missing) and playground toggles
- Checked Code Sandbox works for any docs examples
Code quality checklist
- Added or updated jest and cypress tests
- Updated visual regression tests
Release checklist
- A changelog entry exists and is marked appropriately
- If applicable, added the breaking change issue label (and filled out the breaking change checklist)
- If the changes unblock an issue in a different repo, smoke tested carefully (see Testing EUI features in Kibana ahead of time)
Designer checklist
- If applicable, file an issue to update EUI's Figma library with any corresponding UI changes. (This is an internal repo, if you are external to Elastic, ask a maintainer to submit this request)

kowalczyk-krzysztof

Awesome, thanks for working on this!

packages/eui/src/components/context_menu/context_menu.tsx

elasticmachine · 2026-01-21T14:12:47Z

💚 Build Succeeded

History

💚 Build #2455 succeeded 9f57045

cc @weronikaolejniczak

elasticmachine · 2026-01-21T14:29:39Z

💚 Build Succeeded

Buildkite Build
Commit: b7598d9

History

💚 Build #5618 succeeded 9f57045

cc @weronikaolejniczak

mgadewoll

🟢 Code change are LGTM. Passing supported CommonProps like data-test-subj works as expected. Thanks for the update!

…tic#9323)

`112.0.0` ⏩ `112.1.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 - Update `span_links_badge.tsx` conditional `onClick` props on `EuiBadge` to satisfy TypeScript 93d7fae - Update snapshots 24c2f9a ## Package updates ### `@elastic/eui` [`v112.1.0`](https://github.com/elastic/eui/releases/tag/v112.1.0) - Updated `timeline` icon glyph ([#9331](elastic/eui#9331)) - Updated `EuiContextMenu` panels to allow passing `data-test-subj`, `aria-label`, `className` and `css` props ([#9323](elastic/eui#9323)) - Added "zoom in" functionality to time window buttons in `EuiSuperDatePicker` ([#9325](elastic/eui#9325)) - Added `displayName` to `EuiButton`, `EuiButtonEmpty`, `EuiDescriptionList` and its sub-components, `EuiEmptyPrompt`, `EuiFlexGrid`, `EuiFlexItem`, `EuiIcon`, `EuiImage`, `EuiLoadingLogo`, `EuiPageSection`, `EuiPageSidebar`, `EuiPageTemplate` and its sub-components and `EuiPanel` ([#9324](elastic/eui#9324)) - Added `fill` prop (defaults to `false`) to `EuiBadge` component that controls whether the badge should use filled or non-filled (less intense) colors. By default, badges will now render as the non-filled variant. ([#9306](elastic/eui#9306)) - Updated EuiBadge design to have rounded corners and improved paddings ([#9302](elastic/eui#9302)) **Bug fixes** - Fixed non-virtualized `EuiSelectable` throwing SyntaxError when selecting an option ([#9326](elastic/eui#9326)) - Fixed an issue where `push` flyouts in a stacked layout calculated the content offset based on the hidden main flyout's width instead of the visible child flyout's width ([#9322](elastic/eui#9322)) ### @elastic/eui-theme-borealis [`v5.4.0`](https://github.com/elastic/eui/blob/16f9b31d753d963d7738049e7a176fcaf6e81e73/packages/eui-theme-borealis/changelogs/CHANGELOG_2026.md#v540) - Updated `badgeBackground` color token value to equal `backgroundFilledText` ([#9306](elastic/eui#9306)) ### @elastic/eui-docusaurus-theme [`v2.2.0`](https://github.com/elastic/eui/blob/16f9b31d753d963d7738049e7a176fcaf6e81e73/packages/docusaurus-theme/changelogs/CHANGELOG_2026.md#v220) - Added `extraFiles` prop to the `Demo` component. It allows to pass extra files that will be added to the Codesandbox instance. ([#9317](elastic/eui#9317)) - Updated the `IMPORT_REGEX` to include relative imports so that all imports are removed from the snippet. All imported references have to be passed to `Demo` in the `scope` prop. ([#9317](elastic/eui#9317)) --------- Co-authored-by: Tomasz Kajtoch <tomasz.kajtoch@elastic.co>

`112.0.0` ⏩ `112.1.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 - Update `span_links_badge.tsx` conditional `onClick` props on `EuiBadge` to satisfy TypeScript 93d7fae - Update snapshots 24c2f9a ## Package updates ### `@elastic/eui` [`v112.1.0`](https://github.com/elastic/eui/releases/tag/v112.1.0) - Updated `timeline` icon glyph ([elastic#9331](elastic/eui#9331)) - Updated `EuiContextMenu` panels to allow passing `data-test-subj`, `aria-label`, `className` and `css` props ([elastic#9323](elastic/eui#9323)) - Added "zoom in" functionality to time window buttons in `EuiSuperDatePicker` ([elastic#9325](elastic/eui#9325)) - Added `displayName` to `EuiButton`, `EuiButtonEmpty`, `EuiDescriptionList` and its sub-components, `EuiEmptyPrompt`, `EuiFlexGrid`, `EuiFlexItem`, `EuiIcon`, `EuiImage`, `EuiLoadingLogo`, `EuiPageSection`, `EuiPageSidebar`, `EuiPageTemplate` and its sub-components and `EuiPanel` ([elastic#9324](elastic/eui#9324)) - Added `fill` prop (defaults to `false`) to `EuiBadge` component that controls whether the badge should use filled or non-filled (less intense) colors. By default, badges will now render as the non-filled variant. ([elastic#9306](elastic/eui#9306)) - Updated EuiBadge design to have rounded corners and improved paddings ([elastic#9302](elastic/eui#9302)) **Bug fixes** - Fixed non-virtualized `EuiSelectable` throwing SyntaxError when selecting an option ([elastic#9326](elastic/eui#9326)) - Fixed an issue where `push` flyouts in a stacked layout calculated the content offset based on the hidden main flyout's width instead of the visible child flyout's width ([elastic#9322](elastic/eui#9322)) ### @elastic/eui-theme-borealis [`v5.4.0`](https://github.com/elastic/eui/blob/16f9b31d753d963d7738049e7a176fcaf6e81e73/packages/eui-theme-borealis/changelogs/CHANGELOG_2026.md#v540) - Updated `badgeBackground` color token value to equal `backgroundFilledText` ([elastic#9306](elastic/eui#9306)) ### @elastic/eui-docusaurus-theme [`v2.2.0`](https://github.com/elastic/eui/blob/16f9b31d753d963d7738049e7a176fcaf6e81e73/packages/docusaurus-theme/changelogs/CHANGELOG_2026.md#v220) - Added `extraFiles` prop to the `Demo` component. It allows to pass extra files that will be added to the Codesandbox instance. ([elastic#9317](elastic/eui#9317)) - Updated the `IMPORT_REGEX` to include relative imports so that all imports are removed from the snippet. All imported references have to be passed to `Demo` in the `scope` prop. ([elastic#9317](elastic/eui#9317)) --------- Co-authored-by: Tomasz Kajtoch <tomasz.kajtoch@elastic.co>

weronikaolejniczak self-assigned this Jan 16, 2026

weronikaolejniczak requested a review from kowalczyk-krzysztof January 16, 2026 10:26

weronikaolejniczak added 2 commits January 16, 2026 11:31

feat(eui): spread panel data to context menu panel

4a8660c

chore(eui): add changelog

9f57045

weronikaolejniczak force-pushed the feat/context-menu-data-attributes branch from ce49ed0 to 9f57045 Compare January 16, 2026 10:32

weronikaolejniczak marked this pull request as ready for review January 16, 2026 10:32

weronikaolejniczak requested a review from a team as a code owner January 16, 2026 10:32

kowalczyk-krzysztof approved these changes Jan 16, 2026

View reviewed changes

mgadewoll reviewed Jan 21, 2026

View reviewed changes

packages/eui/src/components/context_menu/context_menu.tsx Outdated Show resolved Hide resolved

weronikaolejniczak and others added 3 commits January 21, 2026 14:40

feat(eui): use common props instead

dbd5c6c

chore(eui): update changelog

1151625

Merge branch 'main' into feat/context-menu-data-attributes

b7598d9

mgadewoll approved these changes Jan 21, 2026

View reviewed changes

weronikaolejniczak merged commit f9edc79 into elastic:main Jan 21, 2026
5 checks passed

weronikaolejniczak added a commit to weronikaolejniczak/eui that referenced this pull request Jan 23, 2026

[EuiContextMenu] Support data attributes in context menu panels (elas…

8b11283

…tic#9323)

acstll mentioned this pull request Jan 26, 2026

Upgrade EUI to v112.1.0 elastic/kibana#250407

Merged

weronikaolejniczak deleted the feat/context-menu-data-attributes branch February 10, 2026 10:00

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[EuiContextMenu] Support data attributes in context menu panels#9323

[EuiContextMenu] Support data attributes in context menu panels#9323
weronikaolejniczak merged 5 commits intoelastic:mainfrom
weronikaolejniczak:feat/context-menu-data-attributes

weronikaolejniczak commented Jan 16, 2026 •

edited by mgadewoll

Loading

Uh oh!

kowalczyk-krzysztof left a comment

Uh oh!

Uh oh!

elasticmachine commented Jan 21, 2026

Uh oh!

elasticmachine commented Jan 21, 2026

Uh oh!

mgadewoll left a comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

Conversation

weronikaolejniczak commented Jan 16, 2026 • edited by mgadewoll Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Why are we making this change?

Impact to users

QA

Specific checklist

General checklist

Uh oh!

kowalczyk-krzysztof left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

elasticmachine commented Jan 21, 2026

💚 Build Succeeded

History

Uh oh!

elasticmachine commented Jan 21, 2026

💚 Build Succeeded

History

Uh oh!

mgadewoll left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

weronikaolejniczak commented Jan 16, 2026 •

edited by mgadewoll

Loading