@sparrowengg/integrations-templates-frontend 8.0.2 → 8.0.3

package/dist/cjs/node_modules/@sparrowengg/twigs-react/dist/es/node_modules/react-transition-group/esm/Transition.js

@@ -12,116 +12,20 @@ var PropTypes = require('./utils/PropTypes.js');
 var TransitionGroupContext = require('./TransitionGroupContext.js');
 var reflow = require('./utils/reflow.js');
 
-var UNMOUNTED = 'unmounted';
-var EXITED = 'exited';
-var ENTERING = 'entering';
-var ENTERED = 'entered';
-var EXITING = 'exiting';
-/**
- * The Transition component lets you describe a transition from one component
- * state to another _over time_ with a simple declarative API. Most commonly
- * it's used to animate the mounting and unmounting of a component, but can also
- * be used to describe in-place transition states as well.
- *
- * ---
- *
- * **Note**: `Transition` is a platform-agnostic base component. If you're using
- * transitions in CSS, you'll probably want to use
- * [`CSSTransition`](https://reactcommunity.org/react-transition-group/css-transition)
- * instead. It inherits all the features of `Transition`, but contains
- * additional features necessary to play nice with CSS transitions (hence the
- * name of the component).
- *
- * ---
- *
- * By default the `Transition` component does not alter the behavior of the
- * component it renders, it only tracks "enter" and "exit" states for the
- * components. It's up to you to give meaning and effect to those states. For
- * example we can add styles to a component when it enters or exits:
- *
- * ```jsx
- * import { Transition } from 'react-transition-group';
- *
- * const duration = 300;
- *
- * const defaultStyle = {
- *   transition: `opacity ${duration}ms ease-in-out`,
- *   opacity: 0,
- * }
- *
- * const transitionStyles = {
- *   entering: { opacity: 1 },
- *   entered:  { opacity: 1 },
- *   exiting:  { opacity: 0 },
- *   exited:  { opacity: 0 },
- * };
- *
- * const Fade = ({ in: inProp }) => (
- *   <Transition in={inProp} timeout={duration}>
- *     {state => (
- *       <div style={{
- *         ...defaultStyle,
- *         ...transitionStyles[state]
- *       }}>
- *         I'm a fade Transition!
- *       </div>
- *     )}
- *   </Transition>
- * );
- * ```
- *
- * There are 4 main states a Transition can be in:
- *  - `'entering'`
- *  - `'entered'`
- *  - `'exiting'`
- *  - `'exited'`
- *
- * Transition state is toggled via the `in` prop. When `true` the component
- * begins the "Enter" stage. During this stage, the component will shift from
- * its current transition state, to `'entering'` for the duration of the
- * transition and then to the `'entered'` stage once it's complete. Let's take
- * the following example (we'll use the
- * [useState](https://reactjs.org/docs/hooks-reference.html#usestate) hook):
- *
- * ```jsx
- * function App() {
- *   const [inProp, setInProp] = useState(false);
- *   return (
- *     <div>
- *       <Transition in={inProp} timeout={500}>
- *         {state => (
- *           // ...
- *         )}
- *       </Transition>
- *       <button onClick={() => setInProp(true)}>
- *         Click to Enter
- *       </button>
- *     </div>
- *   );
- * }
- * ```
- *
- * When the button is clicked the component will shift to the `'entering'` state
- * and stay there for 500ms (the value of `timeout`) before it finally switches
- * to `'entered'`.
- *
- * When `in` is `false` the same thing happens except the state moves from
- * `'exiting'` to `'exited'`.
- */
-
-var Transition = /*#__PURE__*/function (_React$Component) {
-  inheritsLoose.default(Transition, _React$Component);
-
-  function Transition(props, context) {
+var UNMOUNTED = "unmounted";
+var EXITED = "exited";
+var ENTERING = "entering";
+var ENTERED = "entered";
+var EXITING = "exiting";
+var Transition = /* @__PURE__ */ function(_React$Component) {
+  inheritsLoose.default(Transition2, _React$Component);
+  function Transition2(props, context) {
     var _this;
-
     _this = _React$Component.call(this, props, context) || this;
-    var parentGroup = context; // In the context of a TransitionGroup all enters are really appears
-
+    var parentGroup = context;
     var appear = parentGroup && !parentGroup.isMounting ? props.enter : props.appear;
     var initialStatus;
     _this.appearStatus = null;
-
     if (props.in) {
       if (appear) {
         initialStatus = EXITED;
@@ -136,54 +40,29 @@ var Transition = /*#__PURE__*/function (_React$Component) {
         initialStatus = EXITED;
       }
     }
-
     _this.state = {
       status: initialStatus
     };
     _this.nextCallback = null;
     return _this;
   }
-
-  Transition.getDerivedStateFromProps = function getDerivedStateFromProps(_ref, prevState) {
+  Transition2.getDerivedStateFromProps = function getDerivedStateFromProps(_ref, prevState) {
     var nextIn = _ref.in;
-
     if (nextIn && prevState.status === UNMOUNTED) {
       return {
         status: EXITED
       };
     }
-
     return null;
-  } // getSnapshotBeforeUpdate(prevProps) {
-  //   let nextStatus = null
-  //   if (prevProps !== this.props) {
-  //     const { status } = this.state
-  //     if (this.props.in) {
-  //       if (status !== ENTERING && status !== ENTERED) {
-  //         nextStatus = ENTERING
-  //       }
-  //     } else {
-  //       if (status === ENTERING || status === ENTERED) {
-  //         nextStatus = EXITING
-  //       }
-  //     }
-  //   }
-  //   return { nextStatus }
-  // }
-  ;
-
-  var _proto = Transition.prototype;
-
+  };
+  var _proto = Transition2.prototype;
   _proto.componentDidMount = function componentDidMount() {
     this.updateStatus(true, this.appearStatus);
   };
-
   _proto.componentDidUpdate = function componentDidUpdate(prevProps) {
     var nextStatus = null;
-
     if (prevProps !== this.props) {
       var status = this.state.status;
-
       if (this.props.in) {
         if (status !== ENTERING && status !== ENTERED) {
           nextStatus = ENTERING;
@@ -194,51 +73,38 @@ var Transition = /*#__PURE__*/function (_React$Component) {
         }
       }
     }
-
     this.updateStatus(false, nextStatus);
   };
-
   _proto.componentWillUnmount = function componentWillUnmount() {
     this.cancelNextCallback();
   };
-
   _proto.getTimeouts = function getTimeouts() {
-    var timeout = this.props.timeout;
+    var timeout2 = this.props.timeout;
     var exit, enter, appear;
-    exit = enter = appear = timeout;
-
-    if (timeout != null && typeof timeout !== 'number') {
-      exit = timeout.exit;
-      enter = timeout.enter; // TODO: remove fallback for next major
-
-      appear = timeout.appear !== undefined ? timeout.appear : enter;
+    exit = enter = appear = timeout2;
+    if (timeout2 != null && typeof timeout2 !== "number") {
+      exit = timeout2.exit;
+      enter = timeout2.enter;
+      appear = timeout2.appear !== void 0 ? timeout2.appear : enter;
     }
-
     return {
-      exit: exit,
-      enter: enter,
-      appear: appear
+      exit,
+      enter,
+      appear
     };
   };
-
   _proto.updateStatus = function updateStatus(mounting, nextStatus) {
     if (mounting === void 0) {
       mounting = false;
     }
-
     if (nextStatus !== null) {
-      // nextStatus will always be ENTERING or EXITING.
       this.cancelNextCallback();
-
       if (nextStatus === ENTERING) {
         if (this.props.unmountOnExit || this.props.mountOnEnter) {
-          var node = this.props.nodeRef ? this.props.nodeRef.current : ReactDOM.findDOMNode(this); // https://github.com/reactjs/react-transition-group/pull/749
-          // With unmountOnExit or mountOnEnter, the enter animation should happen at the transition between `exited` and `entering`.
-          // To make the animation happen,  we have to separate each rendering and avoid being processed as batched.
-
-          if (node) reflow.forceReflow(node);
+          var node = this.props.nodeRef ? this.props.nodeRef.current : ReactDOM.findDOMNode(this);
+          if (node)
+            reflow.forceReflow(node);
         }
-
         this.performEnter(mounting);
       } else {
         this.performExit();
@@ -249,174 +115,134 @@ var Transition = /*#__PURE__*/function (_React$Component) {
       });
     }
   };
-
   _proto.performEnter = function performEnter(mounting) {
     var _this2 = this;
-
     var enter = this.props.enter;
     var appearing = this.context ? this.context.isMounting : mounting;
-
-    var _ref2 = this.props.nodeRef ? [appearing] : [ReactDOM.findDOMNode(this), appearing],
-        maybeNode = _ref2[0],
-        maybeAppearing = _ref2[1];
-
+    var _ref2 = this.props.nodeRef ? [appearing] : [ReactDOM.findDOMNode(this), appearing], maybeNode = _ref2[0], maybeAppearing = _ref2[1];
     var timeouts = this.getTimeouts();
-    var enterTimeout = appearing ? timeouts.appear : timeouts.enter; // no enter animation skip right to ENTERED
-    // if we are mounting and running this it means appear _must_ be set
-
+    var enterTimeout = appearing ? timeouts.appear : timeouts.enter;
     if (!mounting && !enter || config.default.disabled) {
       this.safeSetState({
         status: ENTERED
-      }, function () {
+      }, function() {
         _this2.props.onEntered(maybeNode);
       });
       return;
     }
-
     this.props.onEnter(maybeNode, maybeAppearing);
     this.safeSetState({
       status: ENTERING
-    }, function () {
+    }, function() {
       _this2.props.onEntering(maybeNode, maybeAppearing);
-
-      _this2.onTransitionEnd(enterTimeout, function () {
+      _this2.onTransitionEnd(enterTimeout, function() {
         _this2.safeSetState({
           status: ENTERED
-        }, function () {
+        }, function() {
           _this2.props.onEntered(maybeNode, maybeAppearing);
         });
       });
     });
   };
-
   _proto.performExit = function performExit() {
     var _this3 = this;
-
     var exit = this.props.exit;
     var timeouts = this.getTimeouts();
-    var maybeNode = this.props.nodeRef ? undefined : ReactDOM.findDOMNode(this); // no exit animation skip right to EXITED
-
+    var maybeNode = this.props.nodeRef ? void 0 : ReactDOM.findDOMNode(this);
     if (!exit || config.default.disabled) {
       this.safeSetState({
         status: EXITED
-      }, function () {
+      }, function() {
         _this3.props.onExited(maybeNode);
       });
       return;
     }
-
     this.props.onExit(maybeNode);
     this.safeSetState({
       status: EXITING
-    }, function () {
+    }, function() {
       _this3.props.onExiting(maybeNode);
-
-      _this3.onTransitionEnd(timeouts.exit, function () {
+      _this3.onTransitionEnd(timeouts.exit, function() {
         _this3.safeSetState({
           status: EXITED
-        }, function () {
+        }, function() {
           _this3.props.onExited(maybeNode);
         });
       });
     });
   };
-
   _proto.cancelNextCallback = function cancelNextCallback() {
     if (this.nextCallback !== null) {
       this.nextCallback.cancel();
       this.nextCallback = null;
     }
   };
-
   _proto.safeSetState = function safeSetState(nextState, callback) {
-    // This shouldn't be necessary, but there are weird race conditions with
-    // setState callbacks and unmounting in testing, so always make sure that
-    // we can cancel any pending setState callbacks after we unmount.
     callback = this.setNextCallback(callback);
     this.setState(nextState, callback);
   };
-
   _proto.setNextCallback = function setNextCallback(callback) {
     var _this4 = this;
-
     var active = true;
-
-    this.nextCallback = function (event) {
+    this.nextCallback = function(event) {
       if (active) {
         active = false;
         _this4.nextCallback = null;
         callback(event);
       }
     };
-
-    this.nextCallback.cancel = function () {
+    this.nextCallback.cancel = function() {
       active = false;
     };
-
     return this.nextCallback;
   };
-
-  _proto.onTransitionEnd = function onTransitionEnd(timeout, handler) {
+  _proto.onTransitionEnd = function onTransitionEnd(timeout2, handler) {
     this.setNextCallback(handler);
     var node = this.props.nodeRef ? this.props.nodeRef.current : ReactDOM.findDOMNode(this);
-    var doesNotHaveTimeoutOrListener = timeout == null && !this.props.addEndListener;
-
+    var doesNotHaveTimeoutOrListener = timeout2 == null && !this.props.addEndListener;
     if (!node || doesNotHaveTimeoutOrListener) {
       setTimeout(this.nextCallback, 0);
       return;
     }
-
     if (this.props.addEndListener) {
-      var _ref3 = this.props.nodeRef ? [this.nextCallback] : [node, this.nextCallback],
-          maybeNode = _ref3[0],
-          maybeNextCallback = _ref3[1];
-
+      var _ref3 = this.props.nodeRef ? [this.nextCallback] : [node, this.nextCallback], maybeNode = _ref3[0], maybeNextCallback = _ref3[1];
       this.props.addEndListener(maybeNode, maybeNextCallback);
     }
-
-    if (timeout != null) {
-      setTimeout(this.nextCallback, timeout);
+    if (timeout2 != null) {
+      setTimeout(this.nextCallback, timeout2);
     }
   };
-
   _proto.render = function render() {
     var status = this.state.status;
-
     if (status === UNMOUNTED) {
       return null;
     }
-
-    var _this$props = this.props,
-        children = _this$props.children;
-        _this$props.in;
-        _this$props.mountOnEnter;
-        _this$props.unmountOnExit;
-        _this$props.appear;
-        _this$props.enter;
-        _this$props.exit;
-        _this$props.timeout;
-        _this$props.addEndListener;
-        _this$props.onEnter;
-        _this$props.onEntering;
-        _this$props.onEntered;
-        _this$props.onExit;
-        _this$props.onExiting;
-        _this$props.onExited;
-        _this$props.nodeRef;
-        var childProps = objectWithoutPropertiesLoose.default(_this$props, ["children", "in", "mountOnEnter", "unmountOnExit", "appear", "enter", "exit", "timeout", "addEndListener", "onEnter", "onEntering", "onEntered", "onExit", "onExiting", "onExited", "nodeRef"]);
-
+    var _this$props = this.props, children = _this$props.children;
+    _this$props.in;
+    _this$props.mountOnEnter;
+    _this$props.unmountOnExit;
+    _this$props.appear;
+    _this$props.enter;
+    _this$props.exit;
+    _this$props.timeout;
+    _this$props.addEndListener;
+    _this$props.onEnter;
+    _this$props.onEntering;
+    _this$props.onEntered;
+    _this$props.onExit;
+    _this$props.onExiting;
+    _this$props.onExited;
+    _this$props.nodeRef;
+    var childProps = objectWithoutPropertiesLoose.default(_this$props, ["children", "in", "mountOnEnter", "unmountOnExit", "appear", "enter", "exit", "timeout", "addEndListener", "onEnter", "onEntering", "onEntered", "onExit", "onExiting", "onExited", "nodeRef"]);
     return (
-      /*#__PURE__*/
       // allows for nested Transitions
-      React.createElement(TransitionGroupContext.default.Provider, {
+      /* @__PURE__ */ React.createElement(TransitionGroupContext.default.Provider, {
         value: null
-      }, typeof children === 'function' ? children(status, childProps) : React.cloneElement(React.Children.only(children), childProps))
+      }, typeof children === "function" ? children(status, childProps) : React.cloneElement(React.Children.only(children), childProps))
     );
   };
-
-  return Transition;
+  return Transition2;
 }(React.Component);
-
 Transition.contextType = TransitionGroupContext.default;
 Transition.propTypes = process.env.NODE_ENV !== "production" ? {
   /**
@@ -431,12 +257,11 @@ Transition.propTypes = process.env.NODE_ENV !== "production" ? {
    *     [test/CSSTransition-test.js](https://github.com/reactjs/react-transition-group/blob/13435f897b3ab71f6e19d724f145596f5910581c/test/CSSTransition-test.js#L362-L437)).
    */
   nodeRef: index.default.shape({
-    current: typeof Element === 'undefined' ? index.default.any : function (propValue, key, componentName, location, propFullName, secret) {
+    current: typeof Element === "undefined" ? index.default.any : function(propValue, key, componentName, location, propFullName, secret) {
       var value = propValue[key];
-      return index.default.instanceOf(value && 'ownerDocument' in value ? value.ownerDocument.defaultView.Element : Element)(propValue, key, componentName, location, propFullName, secret);
+      return index.default.instanceOf(value && "ownerDocument" in value ? value.ownerDocument.defaultView.Element : Element)(propValue, key, componentName, location, propFullName, secret);
     }
   }),
-
   /**
    * A `function` child can be used instead of a React element. This function is
    * called with the current transition status (`'entering'`, `'entered'`,
@@ -452,12 +277,10 @@ Transition.propTypes = process.env.NODE_ENV !== "production" ? {
    * ```
    */
   children: index.default.oneOfType([index.default.func.isRequired, index.default.element.isRequired]).isRequired,
-
   /**
    * Show the component; triggers the enter or exit states
    */
   in: index.default.bool,
-
   /**
    * By default the child component is mounted immediately along with
    * the parent `Transition` component. If you want to "lazy mount" the component on the
@@ -465,13 +288,11 @@ Transition.propTypes = process.env.NODE_ENV !== "production" ? {
    * mounted, even on "exited", unless you also specify `unmountOnExit`.
    */
   mountOnEnter: index.default.bool,
-
   /**
    * By default the child component stays mounted after it reaches the `'exited'` state.
    * Set `unmountOnExit` if you'd prefer to unmount the component after it finishes exiting.
    */
   unmountOnExit: index.default.bool,
-
   /**
    * By default the child component does not perform the enter transition when
    * it first mounts, regardless of the value of `in`. If you want this
@@ -484,17 +305,14 @@ Transition.propTypes = process.env.NODE_ENV !== "production" ? {
    * > differently.
    */
   appear: index.default.bool,
-
   /**
    * Enable or disable enter transitions.
    */
   enter: index.default.bool,
-
   /**
    * Enable or disable exit transitions.
    */
   exit: index.default.bool,
-
   /**
    * The duration of the transition, in milliseconds.
    * Required unless `addEndListener` is provided.
@@ -523,15 +341,13 @@ Transition.propTypes = process.env.NODE_ENV !== "production" ? {
    */
   timeout: function timeout(props) {
     var pt = PropTypes.timeoutsShape;
-    if (!props.addEndListener) pt = pt.isRequired;
-
+    if (!props.addEndListener)
+      pt = pt.isRequired;
     for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
       args[_key - 1] = arguments[_key];
     }
-
     return pt.apply(void 0, [props].concat(args));
   },
-
   /**
    * Add a custom transition end trigger. Called with the transitioning
    * DOM node and a `done` callback. Allows for more fine grained transition end
@@ -547,7 +363,6 @@ Transition.propTypes = process.env.NODE_ENV !== "production" ? {
    * ```
    */
   addEndListener: index.default.func,
-
   /**
    * Callback fired before the "entering" status is applied. An extra parameter
    * `isAppearing` is supplied to indicate if the enter stage is occurring on the initial mount
@@ -557,7 +372,6 @@ Transition.propTypes = process.env.NODE_ENV !== "production" ? {
    * @type Function(node: HtmlElement, isAppearing: bool) -> void
    */
   onEnter: index.default.func,
-
   /**
    * Callback fired after the "entering" status is applied. An extra parameter
    * `isAppearing` is supplied to indicate if the enter stage is occurring on the initial mount
@@ -567,7 +381,6 @@ Transition.propTypes = process.env.NODE_ENV !== "production" ? {
    * @type Function(node: HtmlElement, isAppearing: bool)
    */
   onEntering: index.default.func,
-
   /**
    * Callback fired after the "entered" status is applied. An extra parameter
    * `isAppearing` is supplied to indicate if the enter stage is occurring on the initial mount
@@ -577,7 +390,6 @@ Transition.propTypes = process.env.NODE_ENV !== "production" ? {
    * @type Function(node: HtmlElement, isAppearing: bool) -> void
    */
   onEntered: index.default.func,
-
   /**
    * Callback fired before the "exiting" status is applied.
    *
@@ -586,7 +398,6 @@ Transition.propTypes = process.env.NODE_ENV !== "production" ? {
    * @type Function(node: HtmlElement) -> void
    */
   onExit: index.default.func,
-
   /**
    * Callback fired after the "exiting" status is applied.
    *
@@ -595,7 +406,6 @@ Transition.propTypes = process.env.NODE_ENV !== "production" ? {
    * @type Function(node: HtmlElement) -> void
    */
   onExiting: index.default.func,
-
   /**
    * Callback fired after the "exited" status is applied.
    *
@@ -604,10 +414,9 @@ Transition.propTypes = process.env.NODE_ENV !== "production" ? {
    * @type Function(node: HtmlElement) -> void
    */
   onExited: index.default.func
-} : {}; // Name the function so it is clearer in the documentation
-
-function noop() {}
-
+} : {};
+function noop() {
+}
 Transition.defaultProps = {
   in: false,
   mountOnEnter: false,