shineout/es/Spin/index.js

Shein 前端组件库

import _extends from "@babel/runtime/helpers/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
import React from 'react';
import classnames from 'classnames';
import config from '../config';
import configable from '../hoc/config';
import { spinClass } from './styles';
import { ChasingDots, DoubleBounce, ThreeBounce, ScaleCircle, FadingCircle, CubeGrid, ChasingRing, Wave, FourDots, Default } from './Multiple';
import { Ring, Plane, Pulse } from './Simple';
var spins = {
  plane: Plane,
  pulse: Pulse,
  ring: Ring,
  wave: Wave,
  default: Default,
  'chasing-ring': ChasingRing,
  'chasing-dots': ChasingDots,
  'cube-grid': CubeGrid,
  'double-bounce': DoubleBounce,
  'fading-circle': FadingCircle,
  'four-dots': FourDots,
  'scale-circle': ScaleCircle,
  'three-bounce': ThreeBounce
};

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

function getName(name) {
  if (name !== undefined) return name;
  if (config.spin !== undefined) return config.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 = _objectWithoutPropertiesLoose(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.createElement(Component, _extends({
      size: size,
      color: color
    }, rest, {
      wrapperStyle: wrapperStyle,
      wrapperClass: className
    }));
  } else {
    Content = React.createElement("div", {
      style: wrapperStyle,
      className: classnames(spinClass('_'), className)
    }, React.createElement(Component, _extends({
      size: size,
      color: color
    }, rest)), tip && React.createElement("div", {
      className: spinClass('tip'),
      style: {
        color: color
      }
    }, typeof tip === 'string' ? React.createElement("span", null, tip) : tip));
  }

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

Spin.displayName = 'ShineoutSpin';
export default configable(Spin, 'spin');