@egjs/react-children-differ/dist/children-differ.esm.js

A React module that checks diff when child elements are added, removed, or changed

/*
Copyright (c) 2019-present NAVER Corp.
name: @egjs/react-children-differ
license: MIT
author: NAVER Corp.
repository: https://github.com/naver/egjs-children-differ
version: 1.0.1
*/
import { Component, Children, createElement, PureComponent } from 'react';
import NativeChildrenDiffer from '@egjs/children-differ';
import { findDOMNode } from 'react-dom';

/*! *****************************************************************************
Copyright (c) Microsoft Corporation. All rights reserved.
Licensed under the Apache License, Version 2.0 (the "License"); you may not use
this file except in compliance with the License. You may obtain a copy of the
License at http://www.apache.org/licenses/LICENSE-2.0

THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
MERCHANTABLITY OR NON-INFRINGEMENT.

See the Apache Version 2.0 License for specific language governing permissions
and limitations under the License.
***************************************************************************** */

/* global Reflect, Promise */
var extendStatics = function (d, b) {
  extendStatics = Object.setPrototypeOf || {
    __proto__: []
  } instanceof Array && function (d, b) {
    d.__proto__ = b;
  } || function (d, b) {
    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
  };

  return extendStatics(d, b);
};

function __extends(d, b) {
  extendStatics(d, b);

  function __() {
    this.constructor = d;
  }

  d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
}

var ElementDetector =
/*#__PURE__*/
function (_super) {
  __extends(ElementDetector, _super);

  function ElementDetector() {
    var _this = _super !== null && _super.apply(this, arguments) || this;

    _this.element = null;
    return _this;
  }

  var __proto = ElementDetector.prototype;

  __proto.componentDidUpdate = function () {
    this.element = findDOMNode(this);
  };

  __proto.componentDidMount = function () {
    this.element = findDOMNode(this);
  };

  __proto.render = function () {
    return this.props.children;
  };

  return ElementDetector;
}(Component);

var ChildrenDiffer =
/*#__PURE__*/
function (_super) {
  __extends(ChildrenDiffer, _super);

  function ChildrenDiffer() {
    var _this = _super !== null && _super.apply(this, arguments) || this;

    _this.elements = [];
    return _this;
  }

  var __proto = ChildrenDiffer.prototype;

  __proto.render = function () {
    this.elements = [];
    var elements = this.elements;
    var children = Children.toArray(this.props.children);
    return children.map(function (child, i) {
      return createElement(ElementDetector, {
        key: child.key,
        ref: function (e) {
          if (e) {
            elements[i] = e.element;
          }
        }
      }, child);
    });
  };

  __proto.getElements = function () {
    return this.elements.filter(function (el) {
      return el;
    });
  };

  __proto.componentDidUpdate = function () {
    var result = this.childrenDiffer.update(this.getElements());
    this.props.onUpdate(result);
  };

  __proto.componentDidMount = function () {
    this.childrenDiffer = new NativeChildrenDiffer(this.getElements());
  };

  ChildrenDiffer.defaultProps = {
    onUpdate: function (result) {}
  };
  return ChildrenDiffer;
}(PureComponent);

/*
egjs-children-differ
Copyright (c) 2019-present NAVER Corp.
MIT license
*/

export default ChildrenDiffer;
//# sourceMappingURL=children-differ.esm.js.map