"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.TabsDataTids = exports.Tabs = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
var _react = _interopRequireDefault(require("react"));
var _globalObject = require("@skbkontur/global-object");


var _ThemeContext = require("../../lib/theming/ThemeContext");


var _CommonWrapper = require("../../internal/CommonWrapper");
var _Emotion = require("../../lib/theming/Emotion");
var _getRootNode = require("../../lib/rootNode/getRootNode");

var _rootNode = require("../../lib/rootNode");
var _createPropsGetter = require("../../lib/createPropsGetter");

var _isInstanceOf = require("../../lib/isInstanceOf");

var _Indicator = require("./Indicator");
var _Tabs2 = require("./Tabs.styles");

var _TabsContext = require("./TabsContext");
var _Tab = require("./Tab");var _class, _Tabs;































var TabsDataTids = exports.TabsDataTids = {
  root: 'Tabs__root',
  indicatorRoot: 'Indicator__root'
};



/**
 * Родитель компонента Tab. Связывает `Tab`'ы в группу и позволяет управлять их состоянием, помогают в навигации.
 *
 * Используйте `Tabs` для второстепенной навигации, для группировки или фильтрации контента.
 *
 * Не используйте `Tabs` для основной навигации. Для этого лучше подходит главное меню на цветной плашке — оно более заметно на странице.
 * Не используйте `Tabs` для переключения состояний — для этого есть RadioGroup, Toggle и Switcher.
 */var

Tabs = exports.Tabs = (0, _rootNode.rootNode)(_class = (_Tabs = /*#__PURE__*/function (_React$Component) {function Tabs() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.








    getProps = (0, _createPropsGetter.createPropsGetter)(Tabs.defaultProps);_this.





    tabs = [];_this.

    tabUpdates = {
      on: function on(cb) {
        var index = _this.listeners.push(cb);
        return function () {
          _this.listeners.splice(index, 1);
        };
      }
    };_this.

    listeners = [];_this.



















































    shiftFocus = function (fromTab, delta) {
      var _this2 = _this,tabs = _this2.tabs;
      var index = tabs.findIndex(function (x) {return x.id === fromTab;});
      var newIndex = Math.max(0, Math.min(index + delta, tabs.length - 1));
      var tab = tabs[newIndex];

      var tabNode = tab.getNode();
      var htmlNode = (0, _getRootNode.getRootNode)(tabNode);

      if ((0, _isInstanceOf.isInstanceOf)(htmlNode, _globalObject.globalObject.HTMLElement) && typeof htmlNode.focus === 'function') {
        htmlNode.focus();
      }
    };_this.

    notifyUpdate = function () {
      _this.listeners.forEach(function (cb) {return cb();});
    };_this.

    switchTab = function (id) {
      var _this$props = _this.props,onValueChange = _this$props.onValueChange,value = _this$props.value;
      if (id !== value && onValueChange) {
        onValueChange(id);
      }
    };_this.

    getTab = function (id) {
      var _ref = _this.tabs.find(function (x) {return x.id === id;}) || {},_ref$getNode = _ref.getNode,getNode = _ref$getNode === void 0 ? null : _ref$getNode;
      return getNode && getNode();
    };_this.

    addTab = function (id, getNode) {
      _this.tabs = _this.tabs.concat({ id: id, getNode: getNode });
    };_this.

    removeTab = function (id) {
      _this.tabs = _this.tabs.filter(function (tab) {return tab.id !== id;});
    };return _this;}(0, _inheritsLoose2.default)(Tabs, _React$Component);var _proto = Tabs.prototype;_proto.render = function render() {var _this3 = this;var _this$props2 = this.props,value = _this$props2.value,width = _this$props2.width,children = _this$props2.children,indicatorClassName = _this$props2.indicatorClassName,ariaDescribedby = _this$props2['aria-describedby'];var _this$getProps = this.getProps(),vertical = _this$getProps.vertical,size = _this$getProps.size;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {var _cx;_this3.theme = theme;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: _this3.setRootNode }, _this3.props), /*#__PURE__*/_react.default.createElement("div", { "data-tid": TabsDataTids.root, className: (0, _Emotion.cx)((_cx = {}, _cx[_Tabs2.styles.rootSmall(_this3.theme)] = size === 'small', _cx[_Tabs2.styles.rootMedium(_this3.theme)] = size === 'medium', _cx[_Tabs2.styles.rootLarge(_this3.theme)] = size === 'large', _cx[_Tabs2.styles.vertical()] = vertical, _cx)), style: { width: width }, "aria-describedby": ariaDescribedby }, /*#__PURE__*/_react.default.createElement(_TabsContext.TabsContext.Provider, { value: { vertical: vertical, activeTab: value, size: size, getTab: _this3.getTab, addTab: _this3.addTab, removeTab: _this3.removeTab, notifyUpdate: _this3.notifyUpdate, shiftFocus: _this3.shiftFocus, switchTab: _this3.switchTab } }, children, /*#__PURE__*/_react.default.createElement(_Indicator.Indicator, { className: indicatorClassName, tabUpdates: _this3.tabUpdates, vertical: _this3.getProps().vertical }))));});};return Tabs;}(_react.default.Component), _Tabs.__KONTUR_REACT_UI__ = 'Tabs', _Tabs.displayName = 'Tabs', _Tabs.defaultProps = { vertical: false, size: 'large' }, _Tabs.Tab = _Tab.Tab, _Tabs)) || _class;