diff --git a/src/components/Label/Label.tsx b/src/components/Label/Label.tsx index 36599e08f7..7aa664787f 100644 --- a/src/components/Label/Label.tsx +++ b/src/components/Label/Label.tsx @@ -38,7 +38,7 @@ interface LabelOwnProps extends QAProps { /** Disabled state */ disabled?: boolean; /** Handler for click on close button */ - onClose?(event: React.MouseEvent): void; + onCloseClick?(event: React.MouseEvent): void; /** Text to copy */ copyText?: string; /** `aria-label` of close button */ @@ -77,7 +77,7 @@ export const Label = React.forwardRef(function Label size = 'xs', icon, children, - onClose, + onCloseClick, className, disabled, copyText, @@ -123,8 +123,8 @@ export const Label = React.forwardRef(function Label event.stopPropagation(); } - if (onClose) { - onClose(event); + if (onCloseClick) { + onCloseClick(event); } }; @@ -160,7 +160,7 @@ export const Label = React.forwardRef(function Label actionButton = ( diff --git a/src/components/UserLabel/__stories__/UserLabel.stories.tsx b/src/components/UserLabel/__stories__/UserLabel.stories.tsx index 936075878b..1a7bc953d2 100644 --- a/src/components/UserLabel/__stories__/UserLabel.stories.tsx +++ b/src/components/UserLabel/__stories__/UserLabel.stories.tsx @@ -61,6 +61,6 @@ export const Clickable: Story = { export const Closable: Story = { args: { children: person, - onClose: (value) => console.log('closed', value), + onCloseClick: (value) => console.log('closed', value), }, }; diff --git a/src/components/UserLabel/__tests__/UserLabel.test.tsx b/src/components/UserLabel/__tests__/UserLabel.test.tsx index e945c95f25..bf0aaf4e86 100644 --- a/src/components/UserLabel/__tests__/UserLabel.test.tsx +++ b/src/components/UserLabel/__tests__/UserLabel.test.tsx @@ -27,8 +27,10 @@ describe('UserLabel', () => { test.each([MOCKED_TEXT])( 'should return text value as onClose argument', async (text) => { - const onClose = jest.fn(); - const {container} = render({text}); + const onCloseClick = jest.fn(); + const {container} = render( + {text}, + ); const user = userEvent.setup(); const ariaLabelValue = i18n('label_remove-button'); const closeButtonNode = queryByAttribute('aria-label', container, ariaLabelValue); @@ -38,7 +40,7 @@ describe('UserLabel', () => { } await user.click(closeButtonNode); - expect(onClose).toHaveBeenCalled(); + expect(onCloseClick).toHaveBeenCalled(); }, ); test('should render text as string', () => { diff --git a/src/components/UserLabel/types.ts b/src/components/UserLabel/types.ts index 020b5cd981..fc79942654 100644 --- a/src/components/UserLabel/types.ts +++ b/src/components/UserLabel/types.ts @@ -16,5 +16,5 @@ export interface UserLabelProps extends DOMProps, QAProps { children: React.ReactNode; view?: UserLabelView; onClick?: React.MouseEventHandler; - onClose?: React.MouseEventHandler; + onCloseClick?: React.MouseEventHandler; }