added build folder

arnthor3 · Aug 2, 2016 · b4a0437 · b4a0437
1 parent 3130203
commit b4a0437
Show file tree

Hide file tree

Showing 5 changed files with 283 additions and 2 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,4 +1,4 @@
 node_modules/
 coverage/
 .nyc_output/
-lib
+
diff --git a/lib/DelayChild.js b/lib/DelayChild.js
@@ -0,0 +1,95 @@
+'use strict';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DelayChild = undefined;
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+var _react = require('react');
+
+var _react2 = _interopRequireDefault(_react);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+var DelayChild = exports.DelayChild = function (_Component) {
+  _inherits(DelayChild, _Component);
+
+  function DelayChild() {
+    _classCallCheck(this, DelayChild);
+
+    var _this = _possibleConstructorReturn(this, Object.getPrototypeOf(DelayChild).call(this));
+
+    _this.state = { ready: false };
+    return _this;
+  }
+
+  _createClass(DelayChild, [{
+    key: 'componentWillMount',
+    value: function componentWillMount() {
+      var _this2 = this;
+
+      if (this.props.delay) {
+        this.timeout = setTimeout(function () {
+          _this2.setState({ ready: true });
+        }, this.props.delay);
+      } else {
+        this.setState({ ready: true });
+      }
+    }
+    // if a component did not have a delay prop then it will not trigger
+    // componentDidUpdate
+
+  }, {
+    key: 'componentDidMount',
+    value: function componentDidMount() {
+      if (!this.props.delay && this.props.onDone) {
+        this.props.onDone();
+      }
+    }
+  }, {
+    key: 'componentDidUpdate',
+    value: function componentDidUpdate() {
+      if (this.props.onDone) {
+        this.props.onDone();
+      }
+    }
+  }, {
+    key: 'componentWillUnmount',
+    value: function componentWillUnmount() {
+      clearTimeout(this.timeout);
+    }
+  }, {
+    key: 'render',
+    value: function render() {
+      if (this.state.ready) {
+        if (this.props.delay) {
+          // fix: Remove unknown prop from the element
+          var props = Object.assign({}, this.props);
+          delete props.delay;
+          delete props.onDone;
+          return _react2.default.createElement(this.props.children.type, props, this.props.children.props.children);
+        }
+        return this.props.children;
+      }
+      return null;
+    }
+  }]);
+
+  return DelayChild;
+}(_react.Component);
+
+DelayChild.propTypes = {
+  delay: _react2.default.PropTypes.oneOfType([_react2.default.PropTypes.string, _react2.default.PropTypes.number]),
+  children: _react2.default.PropTypes.node,
+  onDone: _react2.default.PropTypes.func
+};
+
+exports.default = DelayChild;
diff --git a/lib/DelayRender.js b/lib/DelayRender.js
@@ -0,0 +1,106 @@
+'use strict';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DelayChild = exports.ReactDelayRender = undefined;
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+var _react = require('react');
+
+var _react2 = _interopRequireDefault(_react);
+
+var _DelayChild = require('./DelayChild');
+
+var _DelayChild2 = _interopRequireDefault(_DelayChild);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+var ReactDelayRender = exports.ReactDelayRender = function (_Component) {
+  _inherits(ReactDelayRender, _Component);
+
+  function ReactDelayRender() {
+    _classCallCheck(this, ReactDelayRender);
+
+    var _this = _possibleConstructorReturn(this, Object.getPrototypeOf(ReactDelayRender).call(this));
+
+    _this.state = { ready: false };
+    _this.done = 0;
+    _this.onDoneFn = _this.onDone.bind(_this);
+    return _this;
+  }
+
+  _createClass(ReactDelayRender, [{
+    key: 'componentWillMount',
+    value: function componentWillMount() {
+      var _this2 = this;
+
+      if (this.props.delay) {
+        this.timeout = setTimeout(function () {
+          _this2.setState({ ready: true });
+        }, this.props.delay);
+      } else {
+        this.setState({ ready: true });
+      }
+    }
+  }, {
+    key: 'componentWillUnmount',
+    value: function componentWillUnmount() {
+      clearTimeout(this.timeout);
+    }
+  }, {
+    key: 'onDone',
+    value: function onDone() {
+      this.done += 1;
+      var childLen = this.props.children.length || 1;
+      if (this.done === childLen) {
+        if (this.props.onFinishRender) {
+          this.props.onFinishRender();
+        }
+      }
+    }
+  }, {
+    key: 'render',
+    value: function render() {
+      var _this3 = this;
+
+      if (this.state.ready) {
+        var children = this.props.children.length ? this.props.children : [this.props.children];
+        return _react2.default.createElement(
+          'span',
+          null,
+          children.map(function (d, i) {
+            if (d.type.displayName === 'ReactDelayRender') {
+              var props = Object.assign({}, d.props, { key: i });
+              return _react2.default.createElement(d.type, props, d.props.children);
+            }
+            return _react2.default.createElement(
+              _DelayChild2.default,
+              { key: i, delay: d.props.delay, onDone: _this3.onDoneFn },
+              d
+            );
+          })
+        );
+      }
+      return _react2.default.createElement('span', null);
+    }
+  }]);
+
+  return ReactDelayRender;
+}(_react.Component);
+
+ReactDelayRender.propTypes = {
+  children: _react2.default.PropTypes.oneOfType([_react2.default.PropTypes.arrayOf(_react2.default.PropTypes.node), _react2.default.PropTypes.node]).isRequired,
+  delay: _react2.default.PropTypes.oneOfType([_react2.default.PropTypes.string, _react2.default.PropTypes.number]),
+  onFinishRender: _react2.default.PropTypes.func
+};
+
+exports.DelayChild = _DelayChild2.default;
+exports.default = ReactDelayRender;
diff --git a/lib/index.js b/lib/index.js
@@ -0,0 +1,80 @@
+'use strict';
+
+var _react = require('react');
+
+var _react2 = _interopRequireDefault(_react);
+
+var _reactDom = require('react-dom');
+
+var _DelayRender = require('./DelayRender');
+
+var _DelayRender2 = _interopRequireDefault(_DelayRender);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var app = _react2.default.createElement(
+  'span',
+  null,
+  _react2.default.createElement(
+    _DelayRender2.default,
+    { delay: '250', onFinishRender: function onFinishRender() {
+        console.log('Single parent');
+      } },
+    _react2.default.createElement(
+      'h1',
+      { delay: '1250' },
+      'I am rendered after 1.25 s'
+    ),
+    _react2.default.createElement(
+      'h2',
+      { delay: '350' },
+      'I am rendered after 0.35 s'
+    )
+  ),
+  _react2.default.createElement(
+    _DelayRender2.default,
+    { delay: '2000', onFinishRender: function onFinishRender() {
+        console.log('Parent');
+      } },
+    _react2.default.createElement(
+      'p',
+      { delay: '500' },
+      ' I am rendered after 2.5 s'
+    ),
+    _react2.default.createElement(
+      _DelayRender2.default,
+      { delay: '250', onFinishRender: function onFinishRender() {
+          console.log('Child');
+        } },
+      _react2.default.createElement(
+        'p',
+        { delay: '1250' },
+        'Child'
+      ),
+      _react2.default.createElement(
+        'p',
+        { delay: '100' },
+        'Children'
+      )
+    )
+  )
+);
+
+var app2 = _react2.default.createElement(
+  _DelayRender2.default,
+  { delay: '500', onFinishRender: function onFinishRender() {
+      console.log('done');
+    } },
+  _react2.default.createElement(
+    'h2',
+    { delay: '250' },
+    'Hello'
+  ),
+  _react2.default.createElement(
+    'h1',
+    null,
+    'Hello'
+  )
+);
+
+(0, _reactDom.render)(app, document.getElementById('app'));
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-delay-render",
-  "version": "0.0.4",
+  "version": "0.0.42",
   "description": "a component that delays the rendering of child components",
   "main": "./lib/DelayRender.js",
   "scripts": {