"use strict";

require("./demo11.css");

var _react = _interopRequireDefault(require("react"));

var _reactDom = _interopRequireDefault(require("react-dom"));

var _ = _interopRequireDefault(require(".."));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

function CustomTabItem(_ref) {
  var title = _ref.title,
      desc = _ref.desc,
      img = _ref.img;
  return /*#__PURE__*/_react["default"].createElement("div", {
    className: "custom-tab-item"
  }, /*#__PURE__*/_react["default"].createElement("div", {
    className: "tab-title"
  }, /*#__PURE__*/_react["default"].createElement("img", {
    className: "tab-img",
    src: img
  }), title), /*#__PURE__*/_react["default"].createElement("div", {
    className: "tab-desc"
  }, desc));
}

var panes = [{
  key: 'e-checking',
  title: 'Alipay',
  desc: 'The fee to be paid is $15',
  img: 'https://img.alicdn.com/tfs/TB1wra0otTfau8jSZFwXXX1mVXa-80-80.png'
}, {
  key: 'brand-card',
  title: 'Bank Card',
  desc: 'The fee to be paid is $17',
  img: 'https://img.alicdn.com/tfs/TB1nKE5s79l0K4jSZFKXXXFjpXa-67-65.png'
}];

_reactDom["default"].render( /*#__PURE__*/_react["default"].createElement(_["default"], {
  shape: "wrapped",
  tabRender: function tabRender(key, props) {
    return /*#__PURE__*/_react["default"].createElement(CustomTabItem, props);
  }
}, panes.map(function (pane) {
  return /*#__PURE__*/_react["default"].createElement(_["default"].Item, _extends({
    key: pane.key
  }, pane, {
    // @ts-ignore
    tabStyle: {
      height: '60px'
    }
  }), pane.desc);
})), document.getElementById('tab-demo-11'));