@yandex/ui/esm/TabsPanes/TabsPanes.js

Yandex UI components

import { __assign, __rest } from "tslib";
import React from 'react';
import { cn } from '@bem-react/classname';
import { TabsPanesPane } from './Pane/TabsPanes-Pane';
export var cnTabsPanes = cn('TabsPanes');
/**
 * Компонент для создания вкладок с разным содержимым.
 * Переключение между вкладками можно реализовать, например, с помощью `TabsMenu`, `Radiobox`, `Select`.
 *
 * @param {ITabsPanesProps} props
 */
export var TabsPanes = function (_a) {
    var activePane = _a.activePane, className = _a.className, innerRef = _a.innerRef, panes = _a.panes, props = __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 = __rest(_b, ["id"]);
    return (React.createElement("div", __assign({}, props, { ref: innerRef, role: "tabpanel", className: cnTabsPanes(null, [className]) }), currentPane && React.createElement(TabsPanesPane, __assign({}, paneProps))));
};
TabsPanes.displayName = cnTabsPanes();