diff --git a/.changeset/yellow-shoes-glow.md b/.changeset/yellow-shoes-glow.md new file mode 100644 index 00000000000..3a39d531690 --- /dev/null +++ b/.changeset/yellow-shoes-glow.md @@ -0,0 +1,5 @@ +--- +'@primer/react': patch +--- + +Trigger onSelect when TreeView items are middle clicked diff --git a/src/TreeView/TreeView.test.tsx b/src/TreeView/TreeView.test.tsx index 03c77138768..5e443db9edc 100644 --- a/src/TreeView/TreeView.test.tsx +++ b/src/TreeView/TreeView.test.tsx @@ -778,6 +778,13 @@ describe('Keyboard interactions', () => { // onSelect should have been called expect(onSelect).toHaveBeenCalledTimes(1) + + onSelect.mockClear() + // Press middle click + fireEvent.click(document.activeElement?.firstChild || document.body, {button: 1}) + + // onSelect should have been called + expect(onSelect).toHaveBeenCalledTimes(1) }) it('toggles expanded state if no onSelect function is provided', () => { diff --git a/src/TreeView/TreeView.tsx b/src/TreeView/TreeView.tsx index 21f2660f3b2..d623bab37d9 100644 --- a/src/TreeView/TreeView.tsx +++ b/src/TreeView/TreeView.tsx @@ -429,6 +429,11 @@ const Item = React.forwardRef( toggle(event) } }} + onAuxClick={event => { + if (onSelect && event.button === 1) { + onSelect(event) + } + }} >