UNPKG

3.92 kBJavaScriptView Raw
1"use strict";
2Object.defineProperty(exports, "__esModule", { value: true });
3exports.Tab = void 0;
4const tslib_1 = require("tslib");
5const React = tslib_1.__importStar(require("react"));
6const tabs_1 = tslib_1.__importDefault(require("@patternfly/react-styles/css/components/Tabs/tabs"));
7const TabButton_1 = require("./TabButton");
8const TabsContext_1 = require("./TabsContext");
9const react_styles_1 = require("@patternfly/react-styles");
10const Tooltip_1 = require("../Tooltip");
11const Button_1 = require("../Button");
12const times_icon_1 = tslib_1.__importDefault(require('@patternfly/react-icons/dist/js/icons/times-icon'));
13const TabBase = (_a) => {
14 var { title, eventKey, tabContentRef, id: childId, tabContentId, className: childClassName = '', ouiaId: childOuiaId, isDisabled, isAriaDisabled, inoperableEvents = ['onClick', 'onKeyPress'], href, innerRef, tooltip, closeButtonAriaLabel, isCloseDisabled = false } = _a, props = tslib_1.__rest(_a, ["title", "eventKey", "tabContentRef", "id", "tabContentId", "className", "ouiaId", "isDisabled", "isAriaDisabled", "inoperableEvents", "href", "innerRef", "tooltip", "closeButtonAriaLabel", "isCloseDisabled"]);
15 const preventedEvents = inoperableEvents.reduce((handlers, eventToPrevent) => (Object.assign(Object.assign({}, handlers), { [eventToPrevent]: (event) => {
16 event.preventDefault();
17 } })), {});
18 const { mountOnEnter, localActiveKey, unmountOnExit, uniqueId, handleTabClick, handleTabClose } = React.useContext(TabsContext_1.TabsContext);
19 let ariaControls = tabContentId ? `${tabContentId}` : `pf-tab-section-${eventKey}-${childId || uniqueId}`;
20 if ((mountOnEnter || unmountOnExit) && eventKey !== localActiveKey) {
21 ariaControls = undefined;
22 }
23 const isButtonElement = Boolean(!href);
24 const getDefaultTabIdx = () => {
25 if (isDisabled) {
26 return isButtonElement ? null : -1;
27 }
28 else if (isAriaDisabled) {
29 return null;
30 }
31 };
32 const tabButton = (React.createElement(TabButton_1.TabButton, Object.assign({ parentInnerRef: innerRef, className: react_styles_1.css(tabs_1.default.tabsLink, isDisabled && href && tabs_1.default.modifiers.disabled, isAriaDisabled && tabs_1.default.modifiers.ariaDisabled), disabled: isButtonElement ? isDisabled : null, "aria-disabled": isDisabled || isAriaDisabled, tabIndex: getDefaultTabIdx(), onClick: (event) => handleTabClick(event, eventKey, tabContentRef) }, (isAriaDisabled ? preventedEvents : null), { id: `pf-tab-${eventKey}-${childId || uniqueId}`, "aria-controls": ariaControls, tabContentRef: tabContentRef, ouiaId: childOuiaId, href: href, role: "tab", "aria-selected": eventKey === localActiveKey }, props), title));
33 return (React.createElement("li", { className: react_styles_1.css(tabs_1.default.tabsItem, eventKey === localActiveKey && tabs_1.default.modifiers.current, handleTabClose && tabs_1.default.modifiers.action, handleTabClose && (isDisabled || isAriaDisabled) && tabs_1.default.modifiers.disabled, childClassName), role: "presentation" },
34 tooltip ? React.createElement(Tooltip_1.Tooltip, Object.assign({}, tooltip.props), tabButton) : tabButton,
35 handleTabClose !== undefined && (React.createElement("span", { className: react_styles_1.css(tabs_1.default.tabsItemClose) },
36 React.createElement(Button_1.Button, { variant: "plain", "aria-label": closeButtonAriaLabel || 'Close tab', onClick: (event) => handleTabClose(event, eventKey, tabContentRef), isDisabled: isCloseDisabled },
37 React.createElement("span", { className: react_styles_1.css(tabs_1.default.tabsItemCloseIcon) },
38 React.createElement(times_icon_1.default, null)))))));
39};
40exports.Tab = React.forwardRef((props, ref) => React.createElement(TabBase, Object.assign({ innerRef: ref }, props)));
41exports.Tab.displayName = 'Tab';
42//# sourceMappingURL=Tab.js.map
\No newline at end of file