shineout/css/Spin/index.js

Shein 前端组件库

"use strict";

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

exports.__esModule = true;
exports.default = void 0;

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

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

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

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

var _config = _interopRequireDefault(require("../config"));

var _config2 = _interopRequireDefault(require("../hoc/config"));

var _styles = require("./styles");

var _Multiple = require("./Multiple");

var _Simple = require("./Simple");

var spins = {
  plane: _Simple.Plane,
  pulse: _Simple.Pulse,
  ring: _Simple.Ring,
  wave: _Multiple.Wave,
  default: _Multiple.Default,
  'chasing-ring': _Multiple.ChasingRing,
  'chasing-dots': _Multiple.ChasingDots,
  'cube-grid': _Multiple.CubeGrid,
  'double-bounce': _Multiple.DoubleBounce,
  'fading-circle': _Multiple.FadingCircle,
  'four-dots': _Multiple.FourDots,
  'scale-circle': _Multiple.ScaleCircle,
  'three-bounce': _Multiple.ThreeBounce
};

function renderContainer(Loading, props) {
  var loading = props.loading,
      children = props.children;
  return _react.default.createElement("div", {
    className: (0, _styles.spinClass)('container', loading && 'show')
  }, _react.default.createElement("div", {
    className: (0, _styles.spinClass)('content')
  }, children), loading && _react.default.createElement("div", {
    className: (0, _styles.spinClass)('loading')
  }, Loading));
}

function getName(name) {
  if (name !== undefined) return name;
  if (_config.default.spin !== undefined) return _config.default.spin;
  return 'default';
}

var Spin = function Spin(props) {
  var children = props.children,
      style = props.style,
      className = props.className,
      _props$size = props.size,
      size = _props$size === void 0 ? 40 : _props$size,
      _props$color = props.color,
      color = _props$color === void 0 ? '#6c757d' : _props$color,
      tip = props.tip,
      rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["children", "style", "className", "size", "color", "tip"]);
  var name = getName(props.name);
  var Component = spins[name];

  if (!Component) {
    console.warn("Spin type '" + name + "' not existed.");
    return null;
  }

  var wrapperStyle = Object.assign({
    color: color
  }, style);
  var Content;

  if (!('tip' in props)) {
    Content = _react.default.createElement(Component, (0, _extends2.default)({
      size: size,
      color: color
    }, rest, {
      wrapperStyle: wrapperStyle,
      wrapperClass: className
    }));
  } else {
    Content = _react.default.createElement("div", {
      style: wrapperStyle,
      className: (0, _classnames.default)((0, _styles.spinClass)('_'), className)
    }, _react.default.createElement(Component, (0, _extends2.default)({
      size: size,
      color: color
    }, rest)), tip && _react.default.createElement("div", {
      className: (0, _styles.spinClass)('tip'),
      style: {
        color: color
      }
    }, typeof tip === 'string' ? _react.default.createElement("span", null, tip) : tip));
  }

  if (children) return renderContainer(Content, props);
  return Content;
};

Spin.displayName = 'ShineoutSpin';

var _default = (0, _config2.default)(Spin, 'spin');

exports.default = _default;