diff --git a/.changeset/forty-crabs-march.md b/.changeset/forty-crabs-march.md new file mode 100644 index 00000000000..78193059a0e --- /dev/null +++ b/.changeset/forty-crabs-march.md @@ -0,0 +1,5 @@ +--- +'@shopify/polaris': minor +--- + +Add onMouseEnter prop to the each item on the ActionList component diff --git a/polaris-react/src/components/ActionList/components/Item/Item.tsx b/polaris-react/src/components/ActionList/components/Item/Item.tsx index f117c44577d..de4698b5370 100644 --- a/polaris-react/src/components/ActionList/components/Item/Item.tsx +++ b/polaris-react/src/components/ActionList/components/Item/Item.tsx @@ -22,6 +22,7 @@ export function Item({ helpText, url, onAction, + onMouseEnter, icon, image, prefix, @@ -120,6 +121,7 @@ export function Item({ onClick={onAction} onMouseUp={handleMouseUpByBlurring} role={role} + onMouseEnter={onMouseEnter} > {contentElement} diff --git a/polaris-react/src/components/ActionList/components/Item/tests/Item.test.tsx b/polaris-react/src/components/ActionList/components/Item/tests/Item.test.tsx index bae451b9eb0..5494718b75d 100644 --- a/polaris-react/src/components/ActionList/components/Item/tests/Item.test.tsx +++ b/polaris-react/src/components/ActionList/components/Item/tests/Item.test.tsx @@ -22,6 +22,13 @@ describe('', () => { expect(mockOnAction).toHaveBeenCalledTimes(1); }); + it('calls onMouseEnter when the mouse enters button', () => { + const onMouseEnterSpy = jest.fn(); + const button = mountWithApp(); + button.find('button')!.trigger('onMouseEnter'); + expect(onMouseEnterSpy).toHaveBeenCalledTimes(1); + }); + it('passes the external prop down to the link', () => { const item = mountWithApp(); expect(item).toContainReactComponent(UnstyledLink, {