shineout/es/Modal/Modal.js

Shein 前端组件库

import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import _objectSpread from "@babel/runtime/helpers/objectSpread";
import { Component } from 'react';
import { defaultProps } from '../utils/defaultProps';
import shallowEqual from '../utils/shallowEqual';
import { getUidStr } from '../utils/uid';
import { open, close, destroy } from './events';

var DefaultValue = _objectSpread({}, defaultProps, {
  usePortal: true,
  visible: false,
  hideMask: false,
  esc: true
});

var Modal =
/*#__PURE__*/
function (_Component) {
  _inheritsLoose(Modal, _Component);

  function Modal(props) {
    var _this;

    _this = _Component.call(this, props) || this;

    _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "id", void 0);

    _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "visible", void 0);

    _this.id = getUidStr();
    _this.visible = props.visible;
    _this.handleUpdate = _this.handleUpdate.bind(_assertThisInitialized(_assertThisInitialized(_this)));
    return _this;
  }

  var _proto = Modal.prototype;

  _proto.componentDidMount = function componentDidMount() {
    if (this.props.visible && !this.props.usePortal) {
      open(this.getOption(), false);
    }
  };

  _proto.shouldComponentUpdate = function shouldComponentUpdate(nextProps) {
    if (shallowEqual(this.props, nextProps)) return false;
    if (nextProps.visible) return true;
    close(_objectSpread({}, this.props, {
      id: this.id
    }), this.handleUpdate);
    return !shallowEqual(this.props, nextProps) && nextProps.visible;
  };

  _proto.componentDidUpdate = function componentDidUpdate() {
    if (this.props.visible && !this.props.usePortal) {
      open(this.getOption(), false);
    }
  };

  _proto.componentWillUnmount = function componentWillUnmount() {
    var usePortal = this.props.usePortal;
    close({
      id: this.id
    });
    destroy(this.id, !usePortal);
  };

  _proto.getOption = function getOption() {
    var _this$props = this.props,
        children = _this$props.children,
        usePortal = _this$props.usePortal,
        visible = _this$props.visible,
        props = _objectWithoutPropertiesLoose(_this$props, ["children", "usePortal", "visible"]);

    return _objectSpread({}, props, {
      content: children,
      id: this.id,
      from: 'modal' // overwrite props from

    });
  };

  _proto.handleUpdate = function handleUpdate() {
    var destroyProps = this.props.destroy;
    if (destroyProps) this.forceUpdate();
  };

  _proto.render = function render() {
    var _this$props2 = this.props,
        usePortal = _this$props2.usePortal,
        visible = _this$props2.visible;
    var option = this.getOption();
    if (visible && usePortal) return open(option, true);
    return null;
  };

  return Modal;
}(Component);

_defineProperty(Modal, "defaultProps", DefaultValue);

_defineProperty(Modal, "displayName", void 0);

_defineProperty(Modal, "info", void 0);

_defineProperty(Modal, "warn", void 0);

_defineProperty(Modal, "error", void 0);

_defineProperty(Modal, "confirm", void 0);

_defineProperty(Modal, "show", void 0);

_defineProperty(Modal, "success", void 0);

_defineProperty(Modal, "closeAll", void 0);

_defineProperty(Modal, "Submit", void 0);

Modal.displayName = 'ShineoutModal';
export default Modal;