You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
* New static method to reset the id counter for isomorphic apps. Call this before rendering your application on the server. ([#129](https://github.com/reactjs/react-tabs/pull/129)) (Neehar Venugopal)
* Allow random order of `<TabList />`, `<TabPanel />` and other arbitrary components. The `<TabPanel />` components are matched to the `<Tab />` components in order from top to bottom.
44
+
45
+
```js
46
+
<Tabs>
47
+
<TabPanel />
48
+
<div />
49
+
<TabList>
50
+
<Tab />
51
+
<Tab />
52
+
</TabList>
53
+
<span />
54
+
<TabPanel />
55
+
</Tabs>
56
+
```
57
+
58
+
* Introduce controlled and uncontrolled mode. This two modes allow either to control the tabs from your component from the outside or leave the control to the tabs within react-tabs components. (see [README.md](https://github.com/reactjs/react-tabs#controlled-vs-uncontrolled-mode) for more information)
59
+
* New prop `selectedTabPanelClassName` on `<Tabs />` to change the class name of the current selected tab panel.
60
+
* New prop `defaultIndex` on `<Tabs />` to allow setting the initial displayed tab.
61
+
* New prop `forceRender` on `<TabPanel />` to allow force rendering of individual tab panels.
62
+
* New prop `selectedClassName` on `<TabPanel />` to allow changing selected class name of individual tab panels.
63
+
* New prop `selectedClassName` on `<Tab />` to allow changing selected class name of individual tabs.
64
+
* New prop `disabledClassName` on `<Tab />` to allow changing disabled class name of individual tabs.
65
+
* Property `className` on all components can now officially take an array as argument.
66
+
* PropTypes are now wrapped in `if(process.env.NODE_ENV === 'production') Component.propTypes = { ... }` in order to allow removing of proptypes in production builds.
27
67
28
-
#### Breaking Changes
68
+
###BREAKING CHANGES
29
69
30
-
- Peer dependency for react requires now `^0.14.9` or `^15.3.0`
31
-
-`activeTabClassName` moved from `<TabList />` to `<Tabs />` and renamed to `selectedTabClassName`
32
-
-`disabledTabClassName` moved from `<TabList />` to `<Tabs />`
33
-
-`className` property on all components now overwrites the default classes instead of adding a second class name
70
+
71
+
* Peer dependency for react requires now `^0.14.9` or `^15.3.0`
72
+
*`activeTabClassName` moved from `<TabList />` to `<Tabs />` and renamed to `selectedTabClassName`
73
+
*`disabledTabClassName` moved from `<TabList />` to `<Tabs />`
74
+
*`className` property on all components now overwrites the default classes instead of adding a second class name
34
75
35
76
```js
36
77
// 0.8
@@ -50,10 +91,10 @@ This allows random elements as children for the `<Tabs />` component, for exampl
50
91
</Tabs>
51
92
```
52
93
53
-
-`selectedIndex` now enables controlled mode, which disables internal management of the active tab. If you were using `selectedIndex` before to set the initial displayed tab use `defaultIndex` now.
54
-
- The value `-1` for `selectedIndex` and `defaultIndex` do not activate the first tab anymore, but instead display no tab panel at all. Use `-1` if you want to display only the tabs but have non of them being selected. If you want to have the first tab selected us `0`.
55
-
- Support for bower package manager was removed.
56
-
- Removed deprecated default export of tabs:
94
+
*`selectedIndex` now enables controlled mode, which disables internal management of the active tab. If you were using `selectedIndex` before to set the initial displayed tab use `defaultIndex` now.
95
+
* The value `-1` for `selectedIndex` and `defaultIndex` do not activate the first tab anymore, but instead display no tab panel at all. Use `-1` if you want to display only the tabs but have non of them being selected. If you want to have the first tab selected us `0`.
96
+
* Support for bower package manager was removed.
97
+
* Removed deprecated default export of tabs:
57
98
58
99
```js
59
100
// 0.8
@@ -67,9 +108,9 @@ import { Tabs } from 'react-tabs';
67
108
<Tabs></Tabs>
68
109
```
69
110
70
-
- Removed jsstylesheet dependency and removed default style from javascript. If you want to use the default styles you can use one of the supported methods (see [README.md](https://github.com/reactjs/react-tabs#styling))
71
-
- The default class names were all lowercased and separated by hyphen, but still follow BEM methodology. E.g. `ReactTabs` -> `react-tabs`, `ReactTabs__TabPanel--selected` -> `react-tabs__tab-panel--selected`
72
-
-`<TabPanel />` components do not set the inline style `display: none` anymore. Hidding and showing a tab panel is now completely done via css and classnames. If you have your own style for the tabs make sure to add the following rules:
111
+
* Removed jsstylesheet dependency and removed default style from javascript. If you want to use the default styles you can use one of the supported methods (see [README.md](https://github.com/reactjs/react-tabs#styling))
112
+
* The default class names were all lowercased and separated by hyphen, but still follow BEM methodology. E.g. `ReactTabs` -> `react-tabs`, `ReactTabs__TabPanel--selected` -> `react-tabs__tab-panel--selected`
113
+
*`<TabPanel />` components do not set the inline style `display: none` anymore. Hidding and showing a tab panel is now completely done via css and classnames. If you have your own style for the tabs make sure to add the following rules:
73
114
74
115
```css
75
116
.react-tabs__tab-panel {
@@ -82,156 +123,180 @@ import { Tabs } from 'react-tabs';
82
123
/* If you use custom class names obviously use the class names you set for the tab panels and selected tab panels */
- Allow random order of `<TabList />`, `<TabPanel />` and other arbitrary components. The `<TabPanel />` components are matched to the `<Tab />` components in order from top to bottom.
* Add a cancel option to tab change event handler ([#73](https://github.com/reactjs/react-tabs/pull/73))
179
+
* Allow passing through custom attributes ([#93](https://github.com/reactjs/react-tabs/pull/93))
180
+
181
+
### Bug Fixes
110
182
111
-
- Introduce controlled and uncontrolled mode. This two modes allow either to control the tabs from your component from the outside or leave the control to the tabs within react-tabs components. (see [README.md](https://github.com/reactjs/react-tabs#controlled-vs-uncontrolled-mode) for more information)
112
-
- New prop `selectedTabPanelClassName` on `<Tabs />` to change the class name of the current selected tab panel.
113
-
- New prop `defaultIndex` on `<Tabs />` to allow setting the initial displayed tab.
114
-
- New prop `forceRender` on `<TabPanel />` to allow force rendering of individual tab panels.
115
-
- New prop `selectedClassName` on `<TabPanel />` to allow changing selected class name of individual tab panels.
116
-
- New prop `selectedClassName` on `<Tab />` to allow changing selected class name of individual tabs.
117
-
- New prop `disabledClassName` on `<Tab />` to allow changing disabled class name of individual tabs.
118
-
- Property `className` on all components can now officially take an array as argument.
119
-
- PropTypes are now wrapped in `if(process.env.NODE_ENV === 'production') Component.propTypes = { ... }` in order to allow removing of proptypes in production builds.
183
+
* DOMNode.setAttribute() expects the second param to be string ([#75](https://github.com/reactjs/react-tabs/pull/75), [#76](https://github.com/reactjs/react-tabs/pull/76))
184
+
* Fix nesting of multiple instances of react-tabs ([#103](https://github.com/reactjs/react-tabs/pull/103))
0 commit comments