choerodon-ui/lib/spin/index.js

An enterprise-class UI design language and React-based implementation

"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

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

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

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

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

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

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"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _classnames = _interopRequireDefault(require("classnames"));

var _omit = _interopRequireDefault(require("lodash/omit"));

var _isCssAnimationSupported = _interopRequireDefault(require("../_util/isCssAnimationSupported"));

var _animate = _interopRequireDefault(require("../animate"));

var _progress = _interopRequireDefault(require("../progress/progress"));

var _enum = require("../_util/enum");

var _enum2 = require("../progress/enum");

var _configure = require("../configure");

function _createSuper(Derived) {
  function isNativeReflectConstruct() {
    if (typeof Reflect === "undefined" || !Reflect.construct) return false;
    if (Reflect.construct.sham) return false;
    if (typeof Proxy === "function") return true;

    try {
      Date.prototype.toString.call(Reflect.construct(Date, [], function () {}));
      return true;
    } catch (e) {
      return false;
    }
  }

  return function () {
    var Super = (0, _getPrototypeOf2["default"])(Derived),
        result;

    if (isNativeReflectConstruct()) {
      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);
  };
}

var Spin =
/*#__PURE__*/
function (_Component) {
  (0, _inherits2["default"])(Spin, _Component);

  var _super = _createSuper(Spin);

  function Spin(props) {
    var _this;

    (0, _classCallCheck2["default"])(this, Spin);
    _this = _super.call(this, props);
    var spinning = props.spinning;
    _this.state = {
      spinning: spinning
    };
    return _this;
  }

  (0, _createClass2["default"])(Spin, [{
    key: "componentDidMount",
    value: function componentDidMount() {
      if (!(0, _isCssAnimationSupported["default"])()) {
        // Show text in IE9
        this.setState({
          notCssAnimationSupported: true
        });
      }
    }
  }, {
    key: "componentWillUnmount",
    value: function componentWillUnmount() {
      if (this.debounceTimeout) {
        clearTimeout(this.debounceTimeout);
      }

      if (this.delayTimeout) {
        clearTimeout(this.delayTimeout);
      }
    }
  }, {
    key: "componentWillReceiveProps",
    value: function componentWillReceiveProps(nextProps) {
      var _this2 = this;

      var currentSpinning = this.props.spinning;
      var spinning = nextProps.spinning;
      var delay = this.props.delay;

      if (this.debounceTimeout) {
        clearTimeout(this.debounceTimeout);
      }

      if (currentSpinning && !spinning) {
        this.debounceTimeout = window.setTimeout(function () {
          return _this2.setState({
            spinning: spinning
          });
        }, 200);

        if (this.delayTimeout) {
          clearTimeout(this.delayTimeout);
        }
      } else if (spinning && delay && !isNaN(Number(delay))) {
        if (this.delayTimeout) {
          clearTimeout(this.delayTimeout);
        }

        this.delayTimeout = window.setTimeout(function () {
          return _this2.setState({
            spinning: spinning
          });
        }, delay);
      } else {
        this.setState({
          spinning: spinning
        });
      }
    }
  }, {
    key: "renderIndicator",
    value: function renderIndicator(prefixCls) {
      var _this$props = this.props,
          indicator = _this$props.indicator,
          size = _this$props.size;
      var dotClassName = "".concat(prefixCls, "-dot");

      if ((0, _react.isValidElement)(indicator)) {
        return (0, _react.cloneElement)(indicator, {
          className: (0, _classnames["default"])(indicator.props.className, dotClassName)
        });
      }

      return _react["default"].createElement(_progress["default"], {
        size: size,
        className: dotClassName,
        type: _enum2.ProgressType.loading
      });
    }
  }, {
    key: "render",
    value: function render() {
      var _classNames;

      var _this$props2 = this.props,
          className = _this$props2.className,
          size = _this$props2.size,
          customizePrefixCls = _this$props2.prefixCls,
          tip = _this$props2.tip,
          wrapperClassName = _this$props2.wrapperClassName,
          children = _this$props2.children,
          style = _this$props2.style,
          restProps = (0, _objectWithoutProperties2["default"])(_this$props2, ["className", "size", "prefixCls", "tip", "wrapperClassName", "children", "style"]);
      var _this$state = this.state,
          spinning = _this$state.spinning,
          notCssAnimationSupported = _this$state.notCssAnimationSupported;
      var prefixCls = (0, _configure.getPrefixCls)('spin', customizePrefixCls);
      var spinClassName = (0, _classnames["default"])(prefixCls, (_classNames = {}, (0, _defineProperty2["default"])(_classNames, "".concat(prefixCls, "-sm"), size === _enum.Size.small), (0, _defineProperty2["default"])(_classNames, "".concat(prefixCls, "-lg"), size === _enum.Size.large), (0, _defineProperty2["default"])(_classNames, "".concat(prefixCls, "-spinning"), spinning), (0, _defineProperty2["default"])(_classNames, "".concat(prefixCls, "-show-text"), !!tip || notCssAnimationSupported), _classNames), className); // fix https://fb.me/react-unknown-prop

      var divProps = (0, _omit["default"])(restProps, ['spinning', 'delay', 'indicator']);

      var spinElement = _react["default"].createElement("div", (0, _extends2["default"])({}, divProps, {
        className: spinClassName,
        style: style,
        key: "loading"
      }), this.renderIndicator(prefixCls), tip ? _react["default"].createElement("div", {
        className: "".concat(prefixCls, "-text")
      }, tip) : null);

      if (children) {
        var _classNames2;

        var animateClassName = "".concat(prefixCls, "-nested-loading");

        if (wrapperClassName) {
          animateClassName += " ".concat(wrapperClassName);
        }

        var containerClassName = (0, _classnames["default"])((_classNames2 = {}, (0, _defineProperty2["default"])(_classNames2, "".concat(prefixCls, "-container"), true), (0, _defineProperty2["default"])(_classNames2, "".concat(prefixCls, "-blur"), spinning), _classNames2));
        return _react["default"].createElement(_animate["default"], (0, _extends2["default"])({}, divProps, {
          component: "div",
          className: animateClassName,
          transitionName: "fade"
        }), spinning && spinElement, _react["default"].createElement("div", {
          className: containerClassName,
          key: "container"
        }, children));
      }

      return spinElement;
    }
  }]);
  return Spin;
}(_react.Component);

exports["default"] = Spin;
Spin.displayName = 'Spin';
Spin.defaultProps = {
  spinning: true,
  size: _enum.Size["default"],
  wrapperClassName: ''
};
Spin.propTypes = {
  prefixCls: _propTypes["default"].string,
  className: _propTypes["default"].string,
  spinning: _propTypes["default"].bool,
  size: _propTypes["default"].oneOf([_enum.Size.small, _enum.Size["default"], _enum.Size.large]),
  wrapperClassName: _propTypes["default"].string,
  indicator: _propTypes["default"].node
};
//# sourceMappingURL=index.js.map