@seafile/seafile-editor 0.3.76

package/dist/components/toast/alert.js

@@ -0,0 +1,150 @@
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _inherits from "@babel/runtime/helpers/esm/inherits";
+import _createSuper from "@babel/runtime/helpers/esm/createSuper";
+import React from 'react';
+import { css } from 'glamor';
+
+var Alert = /*#__PURE__*/function (_React$PureComponent) {
+  _inherits(Alert, _React$PureComponent);
+
+  var _super = _createSuper(Alert);
+
+  function Alert(props) {
+    var _this;
+
+    _classCallCheck(this, Alert);
+
+    _this = _super.call(this, props);
+    _this.containerStyle = css({
+      borderRadius: '3px',
+      backgroundColor: '#fff',
+      padding: '10px 16px',
+      display: 'flex',
+      boxSizing: 'border-box',
+      boxShadow: 'rgba(67, 90, 111, 0.3) 0px 0px 1px, rgba(67, 90, 111, 0.47) 0px 8px 10px -4px',
+      justifyContent: 'space-between',
+      flexDirection: 'row'
+    });
+    _this.containerBorderSuccess = css({
+      borderLeft: '3px solid rgb(71, 184, 129)'
+    });
+    _this.containerBorderWarn = css({
+      borderLeft: '3px solid rgb(217, 130, 43)'
+    });
+    _this.containerBorderDanger = css({
+      borderLeft: '3px solid rgb(236, 76, 71)'
+    });
+    _this.containerBorderNotify = css({
+      borderLeft: '3px solid rgb(16, 112, 202)'
+    });
+    _this.toastTextTitle = css({
+      fontWeight: '600',
+      fontSize: '14px',
+      color: '#435a6f',
+      margin: '0'
+    });
+    _this.toastTextChild = css({
+      fontSize: '14px',
+      color: '#999',
+      margin: '0'
+    });
+    _this.toastClose = css({
+      marginLeft: '15px',
+      height: '24px',
+      width: '24px',
+      lineHeight: '22px',
+      fontWeight: '700',
+      textAlign: 'center',
+      fontSize: '20px',
+      color: '#000',
+      cursor: 'pointer',
+      opacity: '0.5',
+      ':hover': {
+        opacity: 1
+      }
+    });
+    _this.toastIcon = css({
+      marginRight: '10px',
+      width: '14px',
+      height: '20px',
+      lineHeight: '20px'
+    });
+    return _this;
+  }
+
+  _createClass(Alert, [{
+    key: "getContainerStyle",
+    value: function getContainerStyle(intent) {
+      switch (intent) {
+        case 'success':
+          return {
+            borderStyle: this.containerBorderSuccess,
+            iconColor: css({
+              color: 'rgb(71, 184, 129)'
+            }),
+            iconClass: 'iconfont icon-check-circle'
+          };
+
+        case 'warning':
+          return {
+            borderStyle: this.containerBorderWarn,
+            iconColor: css({
+              color: 'rgb(217, 130, 43)'
+            }),
+            iconClass: 'iconfont icon-exclamation-triangle'
+          };
+
+        case 'none':
+          return {
+            borderStyle: this.containerBorderNotify,
+            iconColor: css({
+              color: 'rgb(16, 112, 202)'
+            }),
+            iconClass: 'iconfont icon-exclamation-circle'
+          };
+
+        case 'danger':
+          return {
+            borderStyle: this.containerBorderDanger,
+            iconColor: css({
+              color: 'rgb(236, 76, 71)'
+            }),
+            iconClass: 'iconfont icon-exclamation-circle'
+          };
+
+        default:
+          return {
+            borderStyle: this.containerBorderNotify,
+            iconColor: css({
+              color: 'rgb(16, 112, 202)'
+            }),
+            iconClass: 'iconfont icon-exclamation-circle'
+          };
+      }
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var toastStyle = this.getContainerStyle(this.props.intent);
+      return /*#__PURE__*/React.createElement("div", css(toastStyle.borderStyle, this.containerStyle), /*#__PURE__*/React.createElement("div", {
+        className: this.toastIcon
+      }, /*#__PURE__*/React.createElement("i", Object.assign({
+        className: toastStyle.iconClass
+      }, toastStyle.iconColor))), /*#__PURE__*/React.createElement("div", {
+        className: this.toastTextContainer
+      }, /*#__PURE__*/React.createElement("p", {
+        className: this.toastTextTitle
+      }, this.props.title), this.props.children ? /*#__PURE__*/React.createElement("p", {
+        className: this.toastTextChild
+      }, this.props.children) : null), /*#__PURE__*/React.createElement("div", {
+        onClick: this.props.onRemove,
+        className: this.toastClose
+      }, /*#__PURE__*/React.createElement("span", null, "\xD7")));
+    }
+  }]);
+
+  return Alert;
+}(React.PureComponent);
+
+export default Alert;

package/dist/components/toast/index.js

@@ -0,0 +1,3 @@
+import Toaster from './toaster';
+var toaster = new Toaster();
+export default toaster;

package/dist/components/toast/toast.js

@@ -0,0 +1,179 @@
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _inherits from "@babel/runtime/helpers/esm/inherits";
+import _createSuper from "@babel/runtime/helpers/esm/createSuper";
+import React from 'react';
+import { css } from 'glamor';
+import Transition from 'react-transition-group/Transition';
+import Alert from './alert';
+var animationEasing = {
+  deceleration: 'cubic-bezier(0.0, 0.0, 0.2, 1)',
+  acceleration: 'cubic-bezier(0.4, 0.0, 1, 1)',
+  spring: 'cubic-bezier(0.175, 0.885, 0.320, 1.175)'
+};
+var ANIMATION_DURATION = 240;
+var openAnimation = css.keyframes('openAnimation', {
+  from: {
+    opacity: 0,
+    transform: 'translateY(-120%)'
+  },
+  to: {
+    transform: 'translateY(0)'
+  }
+});
+var closeAnimation = css.keyframes('closeAnimation', {
+  from: {
+    transform: 'scale(1)',
+    opacity: 1
+  },
+  to: {
+    transform: 'scale(0.9)',
+    opacity: 0
+  }
+});
+var animationStyles = css({
+  display: 'flex',
+  flexDirection: 'column',
+  alignItems: 'center',
+  height: 0,
+  transition: "all ".concat(ANIMATION_DURATION, "ms ").concat(animationEasing.deceleration),
+  '&[data-state="entering"], &[data-state="entered"]': {
+    animation: "".concat(openAnimation, " ").concat(ANIMATION_DURATION, "ms ").concat(animationEasing.spring, " both")
+  },
+  '&[data-state="exiting"]': {
+    animation: "".concat(closeAnimation, " 120ms ").concat(animationEasing.acceleration, " both")
+  }
+});
+
+var Toast = /*#__PURE__*/function (_React$PureComponent) {
+  _inherits(Toast, _React$PureComponent);
+
+  var _super = _createSuper(Toast);
+
+  function Toast() {
+    var _this;
+
+    _classCallCheck(this, Toast);
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = _super.call.apply(_super, [this].concat(args));
+    _this.state = {
+      isShown: true,
+      height: 0
+    };
+
+    _this.close = function () {
+      _this.clearCloseTimer();
+
+      _this.setState({
+        isShown: false
+      });
+    };
+
+    _this.startCloseTimer = function () {
+      if (_this.props.duration) {
+        _this.closeTimer = setTimeout(function () {
+          _this.close();
+        }, _this.props.duration * 1000);
+      }
+    };
+
+    _this.clearCloseTimer = function () {
+      if (_this.closeTimer) {
+        clearTimeout(_this.closeTimer);
+        _this.closeTimer = null;
+      }
+    };
+
+    _this.handleMouseEnter = function () {
+      _this.clearCloseTimer();
+    };
+
+    _this.handleMouseLeave = function () {
+      _this.startCloseTimer();
+    };
+
+    _this.onRef = function (ref) {
+      if (ref === null) return;
+
+      var _ref$getBoundingClien = ref.getBoundingClientRect(),
+          height = _ref$getBoundingClien.height;
+
+      _this.setState({
+        height: height
+      });
+    };
+
+    return _this;
+  }
+
+  _createClass(Toast, [{
+    key: "componentDidUpdate",
+    value: function componentDidUpdate(prevProps) {
+      if (prevProps.isShown !== this.props.isShown) {
+        // eslint-disable-next-line react/no-did-update-set-state
+        this.setState({
+          isShown: this.props.isShown
+        });
+      }
+    }
+  }, {
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      this.startCloseTimer();
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      this.clearCloseTimer();
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this2 = this;
+
+      return /*#__PURE__*/React.createElement(Transition, {
+        appear: true,
+        unmountOnExit: true,
+        timeout: ANIMATION_DURATION,
+        in: this.state.isShown,
+        onExited: this.props.onRemove
+      }, function (state) {
+        return /*#__PURE__*/React.createElement("div", {
+          "data-state": state,
+          className: animationStyles,
+          onMouseEnter: _this2.handleMouseEnter,
+          onMouseLeave: _this2.handleMouseLeave,
+          style: {
+            height: _this2.state.height,
+            zIndex: _this2.props.zIndex,
+            marginBottom: _this2.state.isShown ? 0 : -_this2.state.height
+          }
+        }, /*#__PURE__*/React.createElement("div", {
+          ref: _this2.onRef,
+          style: {
+            padding: 8
+          }
+        }, /*#__PURE__*/React.createElement(Alert, {
+          intent: _this2.props.intent,
+          title: _this2.props.title,
+          children: _this2.props.children,
+          isRemoveable: _this2.props.hasCloseButton,
+          onRemove: function onRemove() {
+            return _this2.close();
+          }
+        })));
+      });
+    }
+  }]);
+
+  return Toast;
+}(React.PureComponent);
+
+Toast.defaultProps = {
+  intent: 'none'
+};
+export { Toast as default };

package/dist/components/toast/toastManager.js

@@ -0,0 +1,158 @@
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import _createForOfIteratorHelper from "@babel/runtime/helpers/esm/createForOfIteratorHelper";
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _inherits from "@babel/runtime/helpers/esm/inherits";
+import _createSuper from "@babel/runtime/helpers/esm/createSuper";
+import React from 'react';
+import { css } from 'glamor';
+import Toast from './toast';
+var wrapperClass = css({
+  maxWidth: 560,
+  margin: '0 auto',
+  top: 0,
+  left: 0,
+  right: 0,
+  position: 'fixed',
+  zIndex: 30
+});
+
+var hasCustomId = function hasCustomId(settings) {
+  return Object.hasOwnProperty.call(settings, 'id');
+};
+
+var ToastManager = /*#__PURE__*/function (_React$PureComponent) {
+  _inherits(ToastManager, _React$PureComponent);
+
+  var _super = _createSuper(ToastManager);
+
+  function ToastManager(props, context) {
+    var _this;
+
+    _classCallCheck(this, ToastManager);
+
+    _this = _super.call(this, props, context);
+
+    _this.getToasts = function () {
+      return _this.state.toasts;
+    };
+
+    _this.closeAll = function () {
+      _this.getToasts().forEach(function (toast) {
+        return toast.close();
+      });
+    };
+
+    _this.notify = function (title, settings) {
+      // If there's a custom toast ID passed, close existing toasts with the same custom ID
+      if (hasCustomId(settings)) {
+        var _iterator = _createForOfIteratorHelper(_this.state.toasts),
+            _step;
+
+        try {
+          for (_iterator.s(); !(_step = _iterator.n()).done;) {
+            var toast = _step.value;
+
+            // Since unique ID is still appended to a custom ID, skip the unique ID and check only prefix
+            if (String(toast.id).startsWith(settings.id)) {
+              _this.closeToast(toast.id);
+            }
+          }
+        } catch (err) {
+          _iterator.e(err);
+        } finally {
+          _iterator.f();
+        }
+      }
+
+      var instance = _this.createToastInstance(title, settings);
+
+      _this.setState(function (previousState) {
+        return {
+          toasts: [instance].concat(_toConsumableArray(previousState.toasts))
+        };
+      });
+
+      return instance;
+    };
+
+    _this.createToastInstance = function (title, settings) {
+      var uniqueId = ++ToastManager.idCounter;
+      var id = hasCustomId(settings) ? "".concat(settings.id, "-").concat(uniqueId) : uniqueId;
+      return {
+        id: id,
+        title: title,
+        description: settings.description,
+        hasCloseButton: settings.hasCloseButton || true,
+        duration: settings.duration || 2,
+        close: function close() {
+          return _this.closeToast(id);
+        },
+        intent: settings.intent
+      };
+    };
+
+    _this.closeToast = function (id) {
+      _this.setState(function (previousState) {
+        return {
+          toasts: previousState.toasts.map(function (toast) {
+            if (toast.id === id) {
+              return _objectSpread(_objectSpread({}, toast), {}, {
+                isShown: false
+              });
+            }
+
+            return toast;
+          })
+        };
+      });
+    };
+
+    _this.removeToast = function (id) {
+      _this.setState(function (previousState) {
+        return {
+          toasts: previousState.toasts.filter(function (toast) {
+            return toast.id !== id;
+          })
+        };
+      });
+    };
+
+    props.bindNotify(_this.notify);
+    props.bindGetToasts(_this.getToasts);
+    props.bindCloseAll(_this.closeAll);
+    _this.state = {
+      toasts: []
+    };
+    return _this;
+  }
+
+  _createClass(ToastManager, [{
+    key: "render",
+    value: function render() {
+      var _this2 = this;
+
+      return /*#__PURE__*/React.createElement("span", {
+        className: wrapperClass
+      }, this.state.toasts.map(function (_ref) {
+        var id = _ref.id,
+            description = _ref.description,
+            props = _objectWithoutProperties(_ref, ["id", "description"]);
+
+        return /*#__PURE__*/React.createElement(Toast, Object.assign({
+          key: id,
+          onRemove: function onRemove() {
+            return _this2.removeToast(id);
+          }
+        }, props), description);
+      }));
+    }
+  }]);
+
+  return ToastManager;
+}(React.PureComponent);
+
+ToastManager.idCounter = 0;
+export { ToastManager as default };

package/dist/components/toast/toaster.js

@@ -0,0 +1,76 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import React from 'react';
+import ReactDOM from 'react-dom';
+import ToastManager from './toastManager';
+var isBrowser = typeof window !== 'undefined' && typeof window.document !== 'undefined';
+/**
+ * The Toaster manages the interactionsb between
+ * the ToasterManger and the toast API.
+ */
+
+var Toaster = function Toaster() {
+  var _this = this;
+
+  _classCallCheck(this, Toaster);
+
+  this._bindNotify = function (handler) {
+    _this.notifyHandler = handler;
+  };
+
+  this._bindGetToasts = function (handler) {
+    _this.getToastsHandler = handler;
+  };
+
+  this._bindCloseAll = function (handler) {
+    _this.closeAllHandler = handler;
+  };
+
+  this.getToasts = function () {
+    return _this.getToastsHandler();
+  };
+
+  this.closeAll = function () {
+    return _this.closeAllHandler();
+  };
+
+  this.notify = function (title) {
+    var settings = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    return _this.notifyHandler(title, _objectSpread(_objectSpread({}, settings), {}, {
+      intent: 'none'
+    }));
+  };
+
+  this.success = function (title) {
+    var settings = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    return _this.notifyHandler(title, _objectSpread(_objectSpread({}, settings), {}, {
+      intent: 'success'
+    }));
+  };
+
+  this.warning = function (title) {
+    var settings = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    return _this.notifyHandler(title, _objectSpread(_objectSpread({}, settings), {}, {
+      intent: 'warning'
+    }));
+  };
+
+  this.danger = function (title) {
+    var settings = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    return _this.notifyHandler(title, _objectSpread(_objectSpread({}, settings), {}, {
+      intent: 'danger'
+    }));
+  };
+
+  if (!isBrowser) return;
+  var container = document.createElement('div');
+  container.setAttribute('data-evergreen-toaster-container', '');
+  document.body.appendChild(container);
+  ReactDOM.render( /*#__PURE__*/React.createElement(ToastManager, {
+    bindNotify: this._bindNotify,
+    bindGetToasts: this._bindGetToasts,
+    bindCloseAll: this._bindCloseAll
+  }), container);
+};
+
+export { Toaster as default };