UNPKG

1.21 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
7const propTypes = {
8 tag: tagPropType,
9 activeTab: PropTypes.any,
10 className: PropTypes.string,
11 cssModule: PropTypes.object,
12};
13
14class TabContent extends Component {
15 static getDerivedStateFromProps(nextProps, prevState) {
16 if (prevState.activeTab !== nextProps.activeTab) {
17 return {
18 activeTab: nextProps.activeTab,
19 };
20 }
21 return null;
22 }
23
24 constructor(props) {
25 super(props);
26 this.state = {
27 activeTab: this.props.activeTab,
28 };
29 }
30
31 render() {
32 const { className, cssModule, tag: Tag = 'div' } = this.props;
33
34 const attributes = omit(this.props, Object.keys(propTypes));
35
36 const classes = mapToCssModules(
37 classNames('tab-content', className),
38 cssModule,
39 );
40
41 return (
42 <TabContext.Provider value={{ activeTabId: this.state.activeTab }}>
43 <Tag {...attributes} className={classes} />
44 </TabContext.Provider>
45 );
46 }
47}
48
49export default TabContent;
50
51TabContent.propTypes = propTypes;