UNPKG

2.82 kBJavaScriptView Raw
1import _extends from "@babel/runtime/helpers/esm/extends";
2import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
3import React from 'react';
4import requiredForA11y from 'prop-types-extra/lib/isRequiredForA11y';
5import { useUncontrolled } from 'uncontrollable';
6import Nav from './Nav';
7import NavLink from './NavLink';
8import NavItem from './NavItem';
9import TabContainer from './TabContainer';
10import TabContent from './TabContent';
11import TabPane from './TabPane';
12import { forEach, map } from './ElementChildren';
13var defaultProps = {
14 variant: 'tabs',
15 mountOnEnter: false,
16 unmountOnExit: false
17};
18
19function getDefaultActiveKey(children) {
20 var defaultActiveKey;
21 forEach(children, function (child) {
22 if (defaultActiveKey == null) {
23 defaultActiveKey = child.props.eventKey;
24 }
25 });
26 return defaultActiveKey;
27}
28
29function renderTab(child) {
30 var _child$props = child.props,
31 title = _child$props.title,
32 eventKey = _child$props.eventKey,
33 disabled = _child$props.disabled,
34 tabClassName = _child$props.tabClassName,
35 id = _child$props.id;
36
37 if (title == null) {
38 return null;
39 }
40
41 return /*#__PURE__*/React.createElement(NavItem, {
42 as: NavLink,
43 eventKey: eventKey,
44 disabled: disabled,
45 id: id,
46 className: tabClassName
47 }, title);
48}
49
50var Tabs = function Tabs(props) {
51 var _useUncontrolled = useUncontrolled(props, {
52 activeKey: 'onSelect'
53 }),
54 id = _useUncontrolled.id,
55 onSelect = _useUncontrolled.onSelect,
56 transition = _useUncontrolled.transition,
57 mountOnEnter = _useUncontrolled.mountOnEnter,
58 unmountOnExit = _useUncontrolled.unmountOnExit,
59 children = _useUncontrolled.children,
60 _useUncontrolled$acti = _useUncontrolled.activeKey,
61 activeKey = _useUncontrolled$acti === void 0 ? getDefaultActiveKey(children) : _useUncontrolled$acti,
62 controlledProps = _objectWithoutPropertiesLoose(_useUncontrolled, ["id", "onSelect", "transition", "mountOnEnter", "unmountOnExit", "children", "activeKey"]);
63
64 return /*#__PURE__*/React.createElement(TabContainer, {
65 id: id,
66 activeKey: activeKey,
67 onSelect: onSelect,
68 transition: transition,
69 mountOnEnter: mountOnEnter,
70 unmountOnExit: unmountOnExit
71 }, /*#__PURE__*/React.createElement(Nav, _extends({}, controlledProps, {
72 role: "tablist",
73 as: "nav"
74 }), map(children, renderTab)), /*#__PURE__*/React.createElement(TabContent, null, map(children, function (child) {
75 var childProps = _extends({}, child.props);
76
77 delete childProps.title;
78 delete childProps.disabled;
79 delete childProps.tabClassName;
80 return /*#__PURE__*/React.createElement(TabPane, childProps);
81 })));
82};
83
84Tabs.defaultProps = defaultProps;
85Tabs.displayName = 'Tabs';
86export default Tabs;
\No newline at end of file