UNPKG

2.39 kBJavaScriptView Raw
1import * as React from 'react';
2import { useUncontrolled } from 'uncontrollable';
3import BaseTabs from '@restart/ui/Tabs';
4import Nav from './Nav';
5import NavLink from './NavLink';
6import NavItem from './NavItem';
7import TabContent from './TabContent';
8import TabPane from './TabPane';
9import { forEach, map } from './ElementChildren';
10import getTabTransitionComponent from './getTabTransitionComponent';
11import { jsx as _jsx } from "react/jsx-runtime";
12import { jsxs as _jsxs } from "react/jsx-runtime";
13const defaultProps = {
14 variant: 'tabs',
15 mountOnEnter: false,
16 unmountOnExit: false
17};
18
19function getDefaultActiveKey(children) {
20 let defaultActiveKey;
21 forEach(children, child => {
22 if (defaultActiveKey == null) {
23 defaultActiveKey = child.props.eventKey;
24 }
25 });
26 return defaultActiveKey;
27}
28
29function renderTab(child) {
30 const {
31 title,
32 eventKey,
33 disabled,
34 tabClassName,
35 tabAttrs,
36 id
37 } = child.props;
38
39 if (title == null) {
40 return null;
41 }
42
43 return /*#__PURE__*/_jsx(NavItem, {
44 as: "li",
45 role: "presentation",
46 children: /*#__PURE__*/_jsx(NavLink, {
47 as: "button",
48 type: "button",
49 eventKey: eventKey,
50 disabled: disabled,
51 id: id,
52 className: tabClassName,
53 ...tabAttrs,
54 children: title
55 })
56 });
57}
58
59const Tabs = props => {
60 const {
61 id,
62 onSelect,
63 transition,
64 mountOnEnter,
65 unmountOnExit,
66 children,
67 activeKey = getDefaultActiveKey(children),
68 ...controlledProps
69 } = useUncontrolled(props, {
70 activeKey: 'onSelect'
71 });
72 return /*#__PURE__*/_jsxs(BaseTabs, {
73 id: id,
74 activeKey: activeKey,
75 onSelect: onSelect,
76 transition: getTabTransitionComponent(transition),
77 mountOnEnter: mountOnEnter,
78 unmountOnExit: unmountOnExit,
79 children: [/*#__PURE__*/_jsx(Nav, { ...controlledProps,
80 role: "tablist",
81 as: "ul",
82 children: map(children, renderTab)
83 }), /*#__PURE__*/_jsx(TabContent, {
84 children: map(children, child => {
85 const childProps = { ...child.props
86 };
87 delete childProps.title;
88 delete childProps.disabled;
89 delete childProps.tabClassName;
90 delete childProps.tabAttrs;
91 return /*#__PURE__*/_jsx(TabPane, { ...childProps
92 });
93 })
94 })]
95 });
96};
97
98Tabs.defaultProps = defaultProps;
99Tabs.displayName = 'Tabs';
100export default Tabs;
\No newline at end of file