weex-nuke/lib/Tabbar/view/item.js

基于 Rax 、Weex 的高性能组件体系 ~~

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

var _rax = require('rax');

var _nukeView = require('../../View/index.js');

var _nukeView2 = _interopRequireDefault(_nukeView);

var _nukeText = require('../../Text/index.js');

var _nukeText2 = _interopRequireDefault(_nukeText);

var _nukeEnv = require('../../Env/index.js');

var _nukeTouchable = require('../../Touchable/index.js');

var _nukeTouchable2 = _interopRequireDefault(_nukeTouchable);

var _nukeThemeProvider = require('../../ThemeProvider/index.js');

var _nukeIcon = require('../../Icon/index.js');

var _nukeIcon2 = _interopRequireDefault(_nukeIcon);

var _styles = require('../styles/index.js');

var _styles2 = _interopRequireDefault(_styles);

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

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /** @jsx createElement */

var Item = function (_Component) {
  _inherits(Item, _Component);

  function Item(props) {
    _classCallCheck(this, Item);

    var _this = _possibleConstructorReturn(this, (Item.__proto__ || Object.getPrototypeOf(Item)).call(this, props));

    _this.onPress = _this.onPress.bind(_this);
    _this.selectedIcon = _this.selectedIcon.bind(_this);
    return _this;
  }

  _createClass(Item, [{
    key: 'onPress',
    value: function onPress() {
      this.props._control.switch = false;
      this.props.handleTouchTap(this.props.tabKey, !this.props.preventDefaultEvent);
      if (this.props.onPress) {
        this.props.onPress();
      }
      this.props._control.switch = true;
    }
  }, {
    key: 'selectedIcon',
    value: function selectedIcon() {
      if (this.props.selected && this.props.selectedIcon) {
        return this.props.selectedIcon;
      }
      return this.props.icon;
    }
  }, {
    key: 'render',
    value: function render() {
      var _props = this.props,
          index = _props.index,
          num = _props.num,
          icon = _props.icon,
          title = _props.title,
          _props$capsule = _props.capsule,
          capsule = _props$capsule === undefined ? false : _props$capsule,
          render = _props.render,
          _props$navStyle = _props.navStyle,
          navStyle = _props$navStyle === undefined ? {} : _props$navStyle,
          selected = _props.selected,
          navScrollable = _props.navScrollable,
          navTop = _props.navTop,
          style = _props.style,
          iconBar = _props.iconBar,
          themeStyle = _props.themeStyle;

      var navPosition = capsule ? 'capsule' : navTop ? 'top' : 'bottom';
      var navWrapStyle = Object.assign({}, themeStyle['nav-item'], themeStyle['nav-item-' + navPosition], !navScrollable && !capsule ? { flex: 1 } : {}, selected ? themeStyle['nav-item-' + navPosition + '-selected'] : {}, selected ? navStyle.active : navStyle.inactive, iconBar ? themeStyle['nav-item-has-icon'] : {}, capsule && index > 0 ? themeStyle['nav-item-capsule-not-first'] : {}, style);
      if (render) {
        delete navWrapStyle.height;
      }
      if (!navWrapStyle.flex && _nukeEnv.isWeb) {}
      var iconURL = void 0;

      var iconSize = 'large';

      var iconStyle = void 0;
      if (icon) {
        iconStyle = icon.style;
        iconSize = icon.size ? icon.size : iconSize;
        if (selected) {
          iconURL = icon.selected;
        } else {
          iconURL = icon.src;
        }
      }

      var navTextStyle = Object.assign({}, themeStyle['nav-item-text'], themeStyle['nav-item-' + navPosition + '-text'], selected ? themeStyle['nav-item-' + navPosition + '-selected-text'] : {});
      var itemContent = function itemContent() {
        if (!render) {
          return (0, _rax.createElement)(
            _nukeView2.default,
            { style: { alignItems: 'space-between' } },
            icon ? (0, _rax.createElement)(_nukeIcon2.default, { size: iconSize, src: iconURL, style: [themeStyle.navItemIcon, iconStyle || {}] }) : null,
            (0, _rax.createElement)(
              _nukeText2.default,
              { style: navTextStyle },
              title
            )
          );
        }
      };

      return (0, _rax.createElement)(
        _nukeTouchable2.default,
        { style: navWrapStyle, onPress: this.onPress, t: 'tab-item' },
        render ? render(selected, this.props.tabKey) : null,
        itemContent()
      );
    }
  }]);

  return Item;
}(_rax.Component);

Item.displayName = 'Item';

exports.default = (0, _nukeThemeProvider.connectStyle)(_styles2.default)(Item);
module.exports = exports['default'];