@wix/design-system/dist/cjs/ToastContainer/hooks/useExitTransition.js

@wix/design-system

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.useExitTransition = void 0;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _react = require("react");
var useExitTransition = _ref => {
  var elements = _ref.elements,
    getNode = _ref.getNode;
  var previous = (0, _react.useRef)(new Map());
  var exiting = (0, _react.useRef)(new Map());
  var watched = (0, _react.useRef)(new Set());
  var getNodeRef = (0, _react.useRef)(getNode);
  var _useReducer = (0, _react.useReducer)(count => count + 1, 0),
    _useReducer2 = (0, _slicedToArray2.default)(_useReducer, 2),
    rerender = _useReducer2[1];
  getNodeRef.current = getNode;
  var current = new Map();
  elements.forEach(element => current.set(String(element.key), element));
  current.forEach((_, key) => exiting.current.delete(key));
  previous.current.forEach((element, key) => {
    if (!current.has(key) && !exiting.current.has(key)) {
      exiting.current.set(key, element);
    }
  });
  var insertions = new Map();
  var displaced = [];
  previous.current.forEach((_, key) => {
    if (current.has(key)) {
      if (displaced.length) {
        insertions.set(key, displaced);
        displaced = [];
      }
    } else if (exiting.current.has(key)) {
      displaced.push(key);
    }
  });
  var orderedKeys = [];
  current.forEach((_, key) => {
    var _insertions$get;
    orderedKeys.push(...((_insertions$get = insertions.get(key)) !== null && _insertions$get !== void 0 ? _insertions$get : []), key);
  });
  orderedKeys.push(...displaced);
  var entries = orderedKeys.map(key => {
    var _current$get;
    return {
      key,
      element: (_current$get = current.get(key)) !== null && _current$get !== void 0 ? _current$get : exiting.current.get(key),
      exiting: !current.has(key)
    };
  });
  previous.current = new Map(entries.map(entry => [entry.key, entry.element]));
  var exitingKeys = entries.filter(entry => entry.exiting).map(entry => entry.key).join('|');
  (0, _react.useLayoutEffect)(() => {
    var finish = key => {
      watched.current.delete(key);
      previous.current.delete(key);
      if (exiting.current.delete(key)) {
        rerender();
      }
    };
    exiting.current.forEach((_, key) => {
      if (watched.current.has(key)) {
        return;
      }
      watched.current.add(key);
      var node = getNodeRef.current(key);
      var animations = typeof (node == null ? void 0 : node.getAnimations) === 'function' ? node.getAnimations() : [];
      if (!animations.length) {
        finish(key);
        return;
      }
      Promise.allSettled(animations.map(animation => animation.finished)).then(() => finish(key));
    });
  }, [exitingKeys]);
  return entries;
};
exports.useExitTransition = useExitTransition;
//# sourceMappingURL=useExitTransition.js.map