UNPKG

1.28 kBJavaScriptView Raw
1import React, { Component } from 'react';
2import PropTypes from 'prop-types';
3import classNames from 'classnames';
4import { TabContext } from './TabContext';
5import { mapToCssModules, omit, tagPropType } from './utils';
6
7
8const propTypes = {
9 tag: tagPropType,
10 activeTab: PropTypes.any,
11 className: PropTypes.string,
12 cssModule: PropTypes.object,
13};
14
15const defaultProps = {
16 tag: 'div',
17};
18
19
20class TabContent extends Component {
21 static getDerivedStateFromProps(nextProps, prevState) {
22 if (prevState.activeTab !== nextProps.activeTab) {
23 return {
24 activeTab: nextProps.activeTab
25 };
26 }
27 return null;
28 }
29 constructor(props) {
30 super(props);
31 this.state = {
32 activeTab: this.props.activeTab
33 };
34 }
35
36 render() {
37 const {
38 className,
39 cssModule,
40 tag: Tag,
41 } = this.props;
42
43 const attributes = omit(this.props, Object.keys(propTypes));
44
45 const classes = mapToCssModules(classNames('tab-content', className), cssModule);
46
47 return (
48 <TabContext.Provider value={{activeTabId: this.state.activeTab}}>
49 <Tag {...attributes} className={classes} />
50 </TabContext.Provider>
51 );
52 }
53}
54
55export default TabContent;
56
57TabContent.propTypes = propTypes;
58TabContent.defaultProps = defaultProps;
59