@yandex/ui
Version:
Yandex UI components
33 lines (32 loc) • 1.89 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.TabsPanes = exports.cnTabsPanes = void 0;
var tslib_1 = require("tslib");
var react_1 = tslib_1.__importDefault(require("react"));
var classname_1 = require("@bem-react/classname");
var TabsPanes_Pane_1 = require("./Pane/TabsPanes-Pane");
exports.cnTabsPanes = classname_1.cn('TabsPanes');
/**
* Компонент для создания вкладок с разным содержимым.
* Переключение между вкладками можно реализовать, например, с помощью `TabsMenu`, `Radiobox`, `Select`.
*
* @param {ITabsPanesProps} props
*/
var TabsPanes = function (_a) {
var activePane = _a.activePane, className = _a.className, innerRef = _a.innerRef, panes = _a.panes, props = tslib_1.__rest(_a, ["activePane", "className", "innerRef", "panes"]);
var currentPane = panes.reduce(function (acc, pane) {
if (acc !== null) {
return acc;
}
return pane.id === activePane ? pane : null;
}, null);
if (currentPane === null) {
if (process.env.NODE_ENV !== 'production') {
console.warn("\u041F\u0430\u043D\u0435\u043B\u044C \u0441 id \"" + activePane + "\" \u043D\u0435 \u043D\u0430\u0439\u0434\u0435\u043D\u0430 \u0432 \u0441\u043F\u0438\u0441\u043A\u0435 \u044D\u043B\u0435\u043C\u0435\u043D\u0442\u043E\u0432.");
}
}
var _b = currentPane || {}, id = _b.id, paneProps = tslib_1.__rest(_b, ["id"]);
return (react_1.default.createElement("div", tslib_1.__assign({}, props, { ref: innerRef, role: "tabpanel", className: exports.cnTabsPanes(null, [className]) }), currentPane && react_1.default.createElement(TabsPanes_Pane_1.TabsPanesPane, tslib_1.__assign({}, paneProps))));
};
exports.TabsPanes = TabsPanes;
exports.TabsPanes.displayName = exports.cnTabsPanes();