diff --git a/packages/eui/changelogs/upcoming/8864.md b/packages/eui/changelogs/upcoming/8864.md new file mode 100644 index 00000000000..147f2003b1f --- /dev/null +++ b/packages/eui/changelogs/upcoming/8864.md @@ -0,0 +1,3 @@ +**Bug fixes** + +- Fixed support for `css` key in items object passed to `EuiTreeView` diff --git a/packages/eui/src/components/tree_view/tree_view.stories.tsx b/packages/eui/src/components/tree_view/tree_view.stories.tsx index 9d36e21acc8..dd796be49af 100644 --- a/packages/eui/src/components/tree_view/tree_view.stories.tsx +++ b/packages/eui/src/components/tree_view/tree_view.stories.tsx @@ -73,6 +73,7 @@ export const Playground: Story = { label: "I'm a Bug", id: 'item_bug', icon: , + css: ({ euiTheme }) => `color: ${euiTheme.colors.textDanger}`, }, ], }, diff --git a/packages/eui/src/components/tree_view/tree_view.tsx b/packages/eui/src/components/tree_view/tree_view.tsx index 1a148e12df4..4bf91957ec1 100644 --- a/packages/eui/src/components/tree_view/tree_view.tsx +++ b/packages/eui/src/components/tree_view/tree_view.tsx @@ -64,6 +64,9 @@ export interface Node { /** Optional class to throw on the node */ className?: string; + /** Optional styles + */ + css?: CommonProps['css']; /** Function to call when the item is clicked. The open state of the item will always be toggled. */ @@ -327,6 +330,7 @@ export class EuiTreeViewClass extends Component< key={buttonId + index} id={buttonId} className={node.className} + css={node.css} buttonRef={(ref) => this.setButtonRef(ref, index)} aria-controls={node.children ? wrappingId : undefined} label={node.label}