Skip to content

[EuiTreeView] Fix support for css key in Node #8864

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Jul 21, 2025

Conversation

acstll
Copy link
Contributor

@acstll acstll commented Jul 15, 2025

Summary

This PR makes it possible to add a css key to any node in the items object passed to EuiTreeView.

The EuiTreeViewItem component that renders each node, supports the css prop (and this is in fact documented) but the prop was not being passed down.

Why are we making this change?

This is a bug fix.

Impact to users

No action required, it will just work as expected.

acstll added 2 commits July 15, 2025 12:34
this is documented and part of the EuiTreeViewItem props already
@acstll acstll self-assigned this Jul 15, 2025
@acstll acstll added the support-duty-flywheel Label for PRs, see eui-private #310 label Jul 15, 2025
@elasticmachine
Copy link
Collaborator

💚 Build Succeeded

History

cc @acstll

@elasticmachine
Copy link
Collaborator

💚 Build Succeeded

cc @acstll

@acstll acstll marked this pull request as ready for review July 15, 2025 11:39
@acstll acstll requested a review from a team as a code owner July 15, 2025 11:39
@weronikaolejniczak weronikaolejniczak self-requested a review July 15, 2025 11:47
Copy link
Contributor

@weronikaolejniczak weronikaolejniczak left a comment

Choose a reason for hiding this comment

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

This looks good to me! 🟢 Thank you, Arturo.

Testing notes

Website

Live (eui.elastic.co) PR env (eui.elastic.co/pr_8864)
Screenshot 2025-07-15 at 13 58 51 Screenshot 2025-07-15 at 13 58 18

Storybook

Playground
Screenshot 2025-07-15 at 13 57 39

@acstll acstll merged commit bcf4a13 into elastic:main Jul 21, 2025
6 checks passed
weronikaolejniczak added a commit to elastic/kibana that referenced this pull request Jul 23, 2025
`@elastic/eui`: `106.0.0` ⏩ `106.1.0`
`@elastic/eslint-plugin-eui`: `2.1.0` ⏩ `2.2.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)

New props and defaults have been added to `EuiFlyout`, including
`includeSelectorInFocusTrap`, plus new global CSS variables for push
mode offset control. Additionally, we introduced a small spacing fix for
invalid `EuiDualRange` append component and added support for custom
styles on `EuiTreeView` nodes via the css key.

:warning: **React 16 is now deprecated:** EUI no longer tests against it
or fixes issues specific to it.

## Changes

- I removed forced click in:
`x-pack/test/security_solution_cypress/cypress/tasks/rule_details.ts`
- I removed `{enter}` in:
`x-pack/test/security_solution_cypress/cypress/tasks/common/rule_actions.ts`
(see #228517)

## Package updates

### `@elastic/eui`

#### [`v106.1.0`](https://github.com/elastic/eui/releases/v106.1.0)

- Added `--euiPushFlyoutOffsetInlineStart` and
`--euiPushFlyoutOffsetInlineEnd` global CSS variables set by the
`EuiFlyout` in `push` mode.
([#8872](elastic/eui#8872))
- Reduced the `min-width` for inputs in `EuiRange` and `EuiDualRange`
([#8866](elastic/eui#8866))
- Added `includeSelectorInFocusTrap` prop for `EuiFlyout`
([#8849](elastic/eui#8849))
- Added component defaults for `EuiFlyout` that include
`includeSelectorInFocusTrap` and `includeFixedHeadersInFocusTrap`
([#8849](elastic/eui#8849))

**Bug fixes**

- Fixed flaky manual return focus behavior on `EuiFlyout` by relying on
`FocusTrap` returning focus instead
([#8878](elastic/eui#8878))
- Fixed `EuiFlyoutChild` closing its parent `EuiFlyout` on `Escape`
keypress ([#8878](elastic/eui#8878))
- Fixed support for `css` key in items object passed to `EuiTreeView`
([#8864](elastic/eui#8864))

**Deprecations**

- Deprecated support for React 16. Please update to a modern version of
React or stay on EUI version 106.0.0 if you can't switch right now.
([#8868](elastic/eui#8868))
  
### `@elastic/eslint-plugin-eui`

####
[`v2.2.1`](https://www.npmjs.com/package/@elastic/eslint-plugin-eui/v/2.2.1)

**Bug fixes**

- Removed `no-css_color` entry which mapped to a duplicate
`no-css-color` rule ([#8888](elastic/eui#8888))

####
[`v2.2.0`](https://www.npmjs.com/package/@elastic/eslint-plugin-eui/v/2.2.0)

- Added new `prefer-eui-icon-tip` rule.
([#8877](elastic/eui#8877))
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
support-duty-flywheel Label for PRs, see eui-private #310
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants