import React from 'react';
import "./Tab.less";
var Tab = function Tab(_ref) {
  var _ref$className = _ref.className,
    className = _ref$className === void 0 ? '' : _ref$className,
    _ref$style = _ref.style,
    style = _ref$style === void 0 ? {} : _ref$style,
    _ref$activeKey = _ref.activeKey,
    activeKey = _ref$activeKey === void 0 ? '' : _ref$activeKey,
    _ref$items = _ref.items,
    items = _ref$items === void 0 ? [] : _ref$items,
    onChange = _ref.onChange;
  var handleTabClick = function handleTabClick(item) {
    if (item.disabled) {
      return;
    }

    // Tab切换
    if (item.key !== activeKey) {
      onChange === null || onChange === void 0 || onChange(item.key);
    }
  };

  // 渲染单个tab项
  var renderTabItem = function renderTabItem(item) {
    return /*#__PURE__*/React.createElement("div", {
      key: item.key,
      className: "pisell-tab-item ".concat(activeKey === item.key ? 'pisell-tab-item-active' : 'pisell-tab-item-inactive', " ").concat(item.disabled ? 'pisell-tab-item-disabled' : ''),
      onClick: function onClick() {
        return handleTabClick(item);
      }
    }, /*#__PURE__*/React.createElement("div", {
      className: "pisell-tab-item-label"
    }, item.label));
  };
  return /*#__PURE__*/React.createElement("div", {
    className: "pisell-tab ".concat(className),
    style: style
  }, items.map(function (item) {
    return renderTabItem(item);
  }));
};
export default Tab;