diff --git a/CHANGELOG.md b/CHANGELOG.md index 14d32a772..54201aa0c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,6 +2,10 @@ Reactist follows [semantic versioning](https://semver.org/) and doesn't introduce breaking changes (API-wise) in minor or patch releases. However, the appearance of a component might change in a minor or patch release so keep an eye on redesigns and make sure your app still looks and feels like you expect it. +# v25.0.0-beta.2 + +- [Fix] Pass `onClick` to the `Tab` component. + # v25.0.0-beta.1 - [BREAKING] Use an explicit `render` prop for composition, instead of the `as` prop (in the menu, modal, tabs, toasts and tooltip components). diff --git a/package-lock.json b/package-lock.json index 8a68baea3..430b2f30f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "@doist/reactist", - "version": "25.0.0-beta.1", + "version": "25.0.0-beta.2", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "@doist/reactist", - "version": "25.0.0-beta.1", + "version": "25.0.0-beta.2", "hasInstallScript": true, "license": "MIT", "dependencies": { diff --git a/package.json b/package.json index d69f6c1b1..2ed0a2f78 100644 --- a/package.json +++ b/package.json @@ -6,7 +6,7 @@ "email": "henning@doist.com", "url": "http://doist.com" }, - "version": "25.0.0-beta.1", + "version": "25.0.0-beta.2", "license": "MIT", "homepage": "https://github.com/Doist/reactist#readme", "repository": { diff --git a/src/tabs/tabs.test.tsx b/src/tabs/tabs.test.tsx index d2865e63c..d043ead19 100644 --- a/src/tabs/tabs.test.tsx +++ b/src/tabs/tabs.test.tsx @@ -251,6 +251,25 @@ describe('Tabs', () => { expect(screen.getByText('Content of tab 2')).toBeVisible() }) + it('allows to subscribe to the tab click event', () => { + const onClick = jest.fn() + render( + + + + Tab 1 + + Tab 2 + + Content of tab 1 + Content of tab 2 + , + ) + expect(onClick).not.toHaveBeenCalled() + userEvent.click(screen.getByRole('tab', { name: 'Tab 1' })) + expect(onClick).toHaveBeenCalledTimes(1) + }) + describe('a11y', () => { it('renders with no a11y violations', async () => { const { container } = render( diff --git a/src/tabs/tabs.tsx b/src/tabs/tabs.tsx index 8ab2dc8e2..617977fb5 100644 --- a/src/tabs/tabs.tsx +++ b/src/tabs/tabs.tsx @@ -92,7 +92,7 @@ interface TabProps extends ObfuscatedClassName, Pick { * Represents the individual tab elements within the group. Each `` must have a corresponding `` component. */ const Tab = React.forwardRef(function Tab( - { children, id, exceptionallySetClassName, render }, + { children, id, exceptionallySetClassName, render, onClick }, ref, ): React.ReactElement | null { const tabContextValue = React.useContext(TabsContext) @@ -102,7 +102,14 @@ const Tab = React.forwardRef(function Tab( const className = classNames(exceptionallySetClassName, styles.tab, styles[`tab-${variant}`]) return ( - + {children} )