@jdcfe/yep-react/lib/indexed-list/ListView.js

一套移动端的React组件库

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

var _typeof = require("@babel/runtime/helpers/typeof");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));

var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));

var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));

var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));

var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));

var React = _interopRequireWildcard(require("react"));

function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }

function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }

function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }

var StaticRenderer = /*#__PURE__*/function (_React$Component) {
  (0, _inherits2.default)(StaticRenderer, _React$Component);

  var _super = _createSuper(StaticRenderer);

  function StaticRenderer() {
    (0, _classCallCheck2.default)(this, StaticRenderer);
    return _super.apply(this, arguments);
  }

  (0, _createClass2.default)(StaticRenderer, [{
    key: "render",
    value: function render() {
      return this.props.render();
    }
  }]);
  return StaticRenderer;
}(React.Component);

var ListView = /*#__PURE__*/function (_React$PureComponent) {
  (0, _inherits2.default)(ListView, _React$PureComponent);

  var _super2 = _createSuper(ListView);

  function ListView() {
    (0, _classCallCheck2.default)(this, ListView);
    return _super2.apply(this, arguments);
  }

  (0, _createClass2.default)(ListView, [{
    key: "render",
    value: function render() {
      var _this = this;

      var _this$props = this.props,
          className = _this$props.className,
          renderHeader = _this$props.renderHeader,
          renderFooter = _this$props.renderFooter,
          renderSectionWrapper = _this$props.renderSectionWrapper,
          renderSectionHeader = _this$props.renderSectionHeader,
          renderSectionBodyWrapper = _this$props.renderSectionBodyWrapper,
          sectionBodyClassName = _this$props.sectionBodyClassName,
          renderBodyComponent = _this$props.renderBodyComponent,
          data = _this$props.data,
          renderRow = _this$props.renderRow,
          keyLabel = _this$props.keyLabel,
          children = _this$props.children,
          useBodyScroll = _this$props.useBodyScroll,
          _this$props$style = _this$props.style,
          style = _this$props$style === void 0 ? {} : _this$props$style;
      var rowIdentities = [];
      var sectionIdentities = Object.keys(data);
      Object.keys(data).forEach(function (item, index) {
        rowIdentities[index] = [];
        data[item].forEach(function (ss) {
          rowIdentities[index].push(ss[keyLabel]);
        });
      });
      var contentComponents = [];

      for (var sectionIdx = 0; sectionIdx < rowIdentities.length; sectionIdx++) {
        var sectionId = sectionIdentities[sectionIdx];
        var rowIds = rowIdentities[sectionIdx];

        if (rowIds.length === 0) {
          continue;
        }

        var renderSectionHeaderComponent = void 0;

        if (renderSectionHeader) {
          renderSectionHeaderComponent = /*#__PURE__*/React.createElement(StaticRenderer, {
            key: "s_".concat(sectionId),
            render: renderSectionHeader.bind(null, sectionId, sectionId)
          });
        }

        var sectionBody = [];

        for (var rowIdx = 0; rowIdx < rowIds.length; rowIdx++) {
          var rowID = rowIds[rowIdx];
          var comboID = "".concat(sectionId, "_").concat(rowID);
          var row = /*#__PURE__*/React.createElement(StaticRenderer, {
            key: "r_".concat(comboID),
            render: renderRow.bind(null, data[sectionIdentities[sectionIdx]][rowIdx], rowIdx, sectionId)
          }); //@ts-ignore

          sectionBody.push(row);
        }

        var rowsAndSeparators = /*#__PURE__*/React.cloneElement(renderSectionBodyWrapper(sectionId), {
          className: sectionBodyClassName
        }, sectionBody);

        if (renderSectionWrapper) {
          //@ts-ignore
          contentComponents.push(
          /*#__PURE__*/
          //@ts-ignore
          React.cloneElement(renderSectionWrapper(sectionId), {}, renderSectionHeaderComponent, rowsAndSeparators));
        } else {
          //@ts-ignore
          contentComponents.push(renderSectionHeaderComponent); //@ts-ignore

          contentComponents.push(rowsAndSeparators);
        }
      }

      var baseStyle = {
        position: 'relative',
        overflow: 'auto',
        WebkitOverflowScrolling: 'touch'
      };
      var containerStyle = Object.assign(Object.assign({}, useBodyScroll ? {} : baseStyle), style);
      return /*#__PURE__*/React.createElement("div", {
        ref: function ref(el) {
          return _this.listViewRef = el;
        },
        className: className,
        style: containerStyle
      }, renderHeader && renderHeader(), /*#__PURE__*/React.cloneElement(renderBodyComponent(), {}, contentComponents), renderFooter && renderFooter(), children);
    }
  }]);
  return ListView;
}(React.PureComponent);

exports.default = ListView;
ListView.defaultProps = {
  renderSectionBodyWrapper: function renderSectionBodyWrapper(sectionId) {
    return /*#__PURE__*/React.createElement("div", {
      key: sectionId
    });
  },
  renderBodyComponent: function renderBodyComponent() {
    return /*#__PURE__*/React.createElement("div", null);
  }
};