remount - npm Package Compare versions

Comparing version 0.9.3 to 0.9.5

CHANGELOG.md

 ## Pre-v1.0.0 changes
 
+[v0.9.5]
+
+- Fix issue when multiple components exist when Remount is booted after DOM is initialized. ([@paulovitin])
+
+[@paulovitin]: https://github.com/paulovitin
+[v0.9.5]: https://github.com/rstacruz/remount/compare/v0.9.4...v0.9.5
+
+[v0.9.4]
+
+- Add `module` entry point in package.json
+
+[v0.9.4]: https://github.com/rstacruz/remount/compare/v0.9.3...v0.9.4
+
 [v0.9.3]
@@ -4,0 +17,0 @@

dist/remount.es5.js

 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('react-dom')) :
   typeof define === 'function' && define.amd ? define(['exports', 'react', 'react-dom'], factory) :
-  (factory((global.Remount = {}),global.React,global.ReactDOM));
-}(this, (function (exports,React,ReactDOM) { 'use strict';
+  (global = global || self, factory(global.Remount = {}, global.React, global.ReactDOM));
+}(this, function (exports, React, ReactDOM) { 'use strict';
 
   ReactDOM = ReactDOM && ReactDOM.hasOwnProperty('default') ? ReactDOM['default'] : ReactDOM;
 
+  function _typeof(obj) {
+    if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
+      _typeof = function (obj) {
+        return typeof obj;
+      };
+    } else {
+      _typeof = function (obj) {
+        return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
+      };
+    }
+
+    return _typeof(obj);
+  }
+
+  function _classCallCheck(instance, Constructor) {
+    if (!(instance instanceof Constructor)) {
+      throw new TypeError("Cannot call a class as a 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);
+    }
+  }
+
+  function _createClass(Constructor, protoProps, staticProps) {
+    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) _defineProperties(Constructor, staticProps);
+    return Constructor;
+  }
+
+  function _inherits(subClass, superClass) {
+    if (typeof superClass !== "function" && superClass !== null) {
+      throw new TypeError("Super expression must either be null or a function");
+    }
+
+    subClass.prototype = Object.create(superClass && superClass.prototype, {
+      constructor: {
+        value: subClass,
+        writable: true,
+        configurable: true
+      }
+    });
+    if (superClass) _setPrototypeOf(subClass, superClass);
+  }
+
+  function _getPrototypeOf(o) {
+    _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
+      return o.__proto__ || Object.getPrototypeOf(o);
+    };
+    return _getPrototypeOf(o);
+  }
+
+  function _setPrototypeOf(o, p) {
+    _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
+      o.__proto__ = p;
+      return o;
+    };
+
+    return _setPrototypeOf(o, p);
+  }
+
+  function _assertThisInitialized(self) {
+    if (self === void 0) {
+      throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
+    }
+
+    return self;
+  }
+
+  function _possibleConstructorReturn(self, call) {
+    if (call && (typeof call === "object" || typeof call === "function")) {
+      return call;
+    }
+
+    return _assertThisInitialized(self);
+  }
+
+  function _toConsumableArray(arr) {
+    return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread();
+  }
+
+  function _arrayWithoutHoles(arr) {
+    if (Array.isArray(arr)) {
+      for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) arr2[i] = arr[i];
+
+      return arr2;
+    }
+  }
+
+  function _iterableToArray(iter) {
+    if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter);
+  }
+
+  function _nonIterableSpread() {
+    throw new TypeError("Invalid attempt to spread non-iterable instance");
+  }
+
   /* global HTMLElement */
@@ -15,3 +118,2 @@
    */
-
   function inject() {
@@ -21,2 +123,3 @@ if (window.HTMLElement && window.HTMLElement._babelES5Adapter || void 0 === window.Reflect || void 0 === window.customElements || window.customElements.hasOwnProperty('polyfillWrapFlushCallback')) {
     }
+
     var a = HTMLElement;
@@ -34,12 +137,2 @@
 
-  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; }; }();
-
-  function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
-
-  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; }
-
   /*::
@@ -58,3 +151,2 @@ import type {
   var name = 'CustomElements';
-
   /**
@@ -78,5 +170,8 @@ * Registers a custom element.
 
-  function defineElement(elSpec /*: ElementSpec */
-  , name /*: string */
-  , _ref /*: ElementEvents */
+  function defineElement(elSpec
+  /*: ElementSpec */
+  , name
+  /*: string */
+  , _ref
+  /*: ElementEvents */
   ) {
@@ -86,7 +181,8 @@ var onUpdate = _ref.onUpdate,
         onMount = _ref.onMount;
-
     inject();
     var attributes = elSpec.attributes || [];
 
-    var ComponentElement = function (_window$HTMLElement) {
+    var ComponentElement =
+    /*#__PURE__*/
+    function (_window$HTMLElement) {
       _inherits(ComponentElement, _window$HTMLElement);
@@ -97,7 +193,7 @@
 
-        return _possibleConstructorReturn(this, (ComponentElement.__proto__ || Object.getPrototypeOf(ComponentElement)).apply(this, arguments));
+        return _possibleConstructorReturn(this, _getPrototypeOf(ComponentElement).apply(this, arguments));
       }
 
       _createClass(ComponentElement, [{
-        key: 'connectedCallback',
+        key: "connectedCallback",
         value: function connectedCallback() {
@@ -108,3 +204,3 @@ this._mountPoint = createMountPoint(this, elSpec);
       }, {
-        key: 'disconnectedCallback',
+        key: "disconnectedCallback",
         value: function disconnectedCallback() {
@@ -115,3 +211,3 @@ if (!this._mountPoint) return;
       }, {
-        key: 'attributeChangedCallback',
+        key: "attributeChangedCallback",
         value: function attributeChangedCallback() {
@@ -122,3 +218,3 @@ if (!this._mountPoint) return;
       }], [{
-        key: 'observedAttributes',
+        key: "observedAttributes",
         get: function get() {
@@ -130,7 +226,5 @@ return ['props-json'].concat(_toConsumableArray(attributes));
       return ComponentElement;
-    }(window.HTMLElement);
+    }(window.HTMLElement); // Supress warning when quiet mode is on
 
-    // Supress warning when quiet mode is on
 
-
     if (elSpec.quiet && window.customElements.get(name)) {
@@ -142,7 +236,5 @@ return;
   }
-
   function isSupported() {
     return window.customElements && window.customElements.define;
   }
-
   /**
@@ -154,4 +246,6 @@ * Creates a `<span>` element that serves as the mounting point for React
 
-  function createMountPoint(element /*: Element */
-  , _ref2 /*: ElementSpec */
+  function createMountPoint(element
+  /*: Element */
+  , _ref2
+  /*: ElementSpec */
   ) {
@@ -162,3 +256,5 @@ var shadow = _ref2.shadow;
       var mountPoint = document.createElement('span');
-      element.attachShadow({ mode: 'open' }).appendChild(mountPoint);
+      element.attachShadow({
+        mode: 'open'
+      }).appendChild(mountPoint);
       return mountPoint;
@@ -169,3 +265,2 @@ } else {
   }
-
   /**
@@ -175,2 +270,3 @@ * Check if Shadow DOM is supported.
 
+
   function supportsShadow() {
@@ -187,2 +283,4 @@ return !!(document && document.body && document.body.attachShadow);
 
+  // @flow
+
   /*::
@@ -194,12 +292,8 @@ import type {
   */
+  var name$1 = 'MutationObserver'; // List of observers tags
 
-  var name$1 = 'MutationObserver';
-
-  // List of observers tags
   var observers = {};
-
   function isSupported$1() {
     return !!window.MutationObserver;
   }
-
   /**
@@ -222,12 +316,14 @@ * Defines a custom element.
 
-  function defineElement$1(elSpec /*: ElementSpec */
-  , name /*: string */
-  , events /*: ElementEvents */
+  function defineElement$1(elSpec
+  /*: ElementSpec */
+  , name
+  /*: string */
+  , events
+  /*: ElementEvents */
   ) {
-    name = name.toLowerCase();
+    name = name.toLowerCase(); // Maintain parity with what would happen in Custom Elements mode
 
-    // Maintain parity with what would happen in Custom Elements mode
     if (!isValidName(name)) {
       if (elSpec.quiet) return;
-      throw new Error('Remount: "' + name + '" is not a valid custom element name');
+      throw new Error("Remount: \"".concat(name, "\" is not a valid custom element name"));
     }
@@ -237,8 +333,12 @@
       if (elSpec.quiet) return;
-      throw new Error('Remount: "' + name + '" is already registered');
+      throw new Error("Remount: \"".concat(name, "\" is already registered"));
     }
 
     var observer = new window.MutationObserver(function (mutations) {
-      each(mutations, function (mutation /*: { addedNodes: HTMLCollection<*> } */) {
-        each(mutation.addedNodes, function (node /*: Element */) {
+      each(mutations, function (mutation
+      /*: { addedNodes: HTMLCollection<*> } */
+      ) {
+        each(mutation.addedNodes, function (node
+        /*: Element */
+        ) {
           checkForMount(node, name, events);
@@ -248,3 +348,2 @@ });
     });
-
     observer.observe(document.body, {
@@ -254,6 +353,11 @@ childList: true,
     });
+    observers[name] = true;
+    window.addEventListener('DOMContentLoaded', function () {
+      var nodes = document.getElementsByTagName(name);
 
-    observers[name] = true;
+      _toConsumableArray(nodes).forEach(function (node) {
+        return checkForMount(node, name, events);
+      });
+    });
   }
-
   /**
@@ -264,5 +368,8 @@ * Checks if this new element should fire an `onUpdate` hook.
 
-  function checkForMount(node /*: Element */
-  , name /*: string */
-  , events /*: ElementEvents */
+  function checkForMount(node
+  /*: Element */
+  , name
+  /*: string */
+  , events
+  /*: ElementEvents */
   ) {
@@ -276,3 +383,5 @@ if (node.nodeName.toLowerCase() === name) {
       // Recurse down into the other additions
-      each(node.children, function (subnode /*: Element */) {
+      each(node.children, function (subnode
+      /*: Element */
+      ) {
         checkForMount(subnode, name, events);
@@ -282,3 +391,2 @@ });
   }
-
   /**
@@ -288,9 +396,13 @@ * Observes for any changes in attributes
 
-  function observeForUpdates(node /*: Element */
-  , _ref /*: ElementEvents */
+
+  function observeForUpdates(node
+  /*: Element */
+  , _ref
+  /*: ElementEvents */
   ) {
     var onUpdate = _ref.onUpdate;
-
     var observer = new window.MutationObserver(function (mutations) {
-      each(mutations, function (mutation /*: { target: Element } */) {
+      each(mutations, function (mutation
+      /*: { target: Element } */
+      ) {
         var node = mutation.target;
@@ -300,6 +412,6 @@ onUpdate(node, node);
     });
-
-    observer.observe(node, { attributes: true });
+    observer.observe(node, {
+      attributes: true
+    });
   }
-
   /**
@@ -309,12 +421,17 @@ * Observes a node's parent to wait until the node is removed
 
-  function observeForRemoval(node /*: Element */
-  , _ref2 /*: ElementEvents */
+
+  function observeForRemoval(node
+  /*: Element */
+  , _ref2
+  /*: ElementEvents */
   ) {
     var onUnmount = _ref2.onUnmount;
-
     var parent = node.parentNode;
-
     var observer = new window.MutationObserver(function (mutations) {
-      each(mutations, function (mutation /*: { removedNodes: HTMLCollection<*> } */) {
-        each(mutation.removedNodes, function (subnode /*: Element */) {
+      each(mutations, function (mutation
+      /*: { removedNodes: HTMLCollection<*> } */
+      ) {
+        each(mutation.removedNodes, function (subnode
+        /*: Element */
+        ) {
           if (node !== subnode) return;
@@ -326,6 +443,7 @@ observer.disconnect(parent);
     });
-
-    observer.observe(parent, { childList: true, subtree: true });
+    observer.observe(parent, {
+      childList: true,
+      subtree: true
+    });
   }
-
   /**
@@ -339,4 +457,9 @@ * Some implementations of MutationObserver don't have .forEach,
 
-  function each /*:: <Item> */(list /*: Array<Item> | HTMLCollection<*> */
-  , fn /*: Item => any */
+
+  function each
+  /*:: <Item> */
+  (list
+  /*: Array<Item> | HTMLCollection<*> */
+  , fn
+  /*: Item => any */
   ) {
@@ -347,3 +470,2 @@ for (var i = 0, len = list.length; i < len; i++) {
   }
-
   /**
@@ -365,6 +487,10 @@ * Validate a custom tag.
 
-  function isValidName(name /*: string */) /*: boolean */{
+
+  function isValidName(name
+  /*: string */
+  )
+  /*: boolean */
+  {
     return !!(name.indexOf('-') !== -1 && name.match(/^[a-z][a-z0-9-]*$/));
   }
-
   /**
@@ -374,2 +500,3 @@ * Shadow DOM is not supported with the Mutation Observer strategy.
 
+
   function supportsShadow$1() {
@@ -387,2 +514,3 @@ return false;
 
+  // @flow
   /*::
@@ -392,9 +520,11 @@ import type { ElementSpec } from './types'
 
-  function mount(elSpec /*: ElementSpec */
-  , mountPoint /*: Element */
-  , props /*: {} */
+  function mount(elSpec
+  /*: ElementSpec */
+  , mountPoint
+  /*: Element */
+  , props
+  /*: {} */
   ) {
     return update(elSpec, mountPoint, props);
   }
-
   /**
@@ -405,13 +535,13 @@ * Updates a custom element by calling `ReactDOM.render()`.
 
-  function update(_ref /*: ElementSpec */
-  , mountPoint /*: Element */
-  , props /*: {} */
+  function update(_ref
+  /*: ElementSpec */
+  , mountPoint
+  /*: Element */
+  , props
+  /*: {} */
   ) {
-    var component = _ref.component,
-        attributes = _ref.attributes;
-
+    var component = _ref.component;
     var reactElement = React.createElement(component, props);
     ReactDOM.render(reactElement, mountPoint);
   }
-
   /**
@@ -422,3 +552,7 @@ * Unmounts a component.
 
-  function unmount(_ /*: ElementSpec */, mountPoint /*: Element */) {
+  function unmount(_
+  /*: ElementSpec */
+  , mountPoint
+  /*: Element */
+  ) {
     ReactDOM.unmountComponentAtNode(mountPoint);
@@ -433,4 +567,2 @@ }
 
-  var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
-
   /*::
@@ -465,2 +597,3 @@ import type {
     if (!Strategy) {
+      /* eslint-disable no-console */
       console.warn("Remount: This browser doesn't support the " + 'MutationObserver API or the Custom Elements API. Including ' + 'polyfills might fix this. Remount elements will not work. ' + 'https://github.com/rstacruz/remount');
@@ -472,3 +605,2 @@ }
   }
-
   /**
@@ -487,26 +619,43 @@ * Registers custom elements and links them to React components.
 
-  function define(components /*: ElementMap */
-  , defaults /*: ?Defaults */
+  function define(components
+  /*: ElementMap */
+  , defaults
+  /*: ?Defaults */
   ) {
     var Strategy = getStrategy();
     if (!Strategy) return;
-
-    Object.keys(components).forEach(function (name$$1 /*: string */) {
+    Object.keys(components).forEach(function (name$$1
+    /*: string */
+    ) {
       // Construct the specs for the element.
       // (eg, { component: Tooltip, attributes: ['title'] })
-      var elSpec /*: ElementSpec */ = Object.assign({}, defaults, toElementSpec(components[name$$1]));
+      var elSpec
+      /*: ElementSpec */
+      = Object.assign({}, defaults, toElementSpec(components[name$$1]));
+      var adapter
+      /*: Adapter */
+      = elSpec.adapter || ReactAdapter; // Define a custom element.
 
-      var adapter /*: Adapter */ = elSpec.adapter || ReactAdapter;
-
-      // Define a custom element.
       Strategy.defineElement(elSpec, name$$1, {
-        onMount: function onMount(element /*: Element */, mountPoint /*: Element */) {
+        onMount: function onMount(element
+        /*: Element */
+        , mountPoint
+        /*: Element */
+        ) {
           var props = getProps(element, elSpec.attributes);
           adapter.mount(elSpec, mountPoint, props);
         },
-        onUpdate: function onUpdate(element /*: Element */, mountPoint /*: Element */) {
+        onUpdate: function onUpdate(element
+        /*: Element */
+        , mountPoint
+        /*: Element */
+        ) {
           var props = getProps(element, elSpec.attributes);
           adapter.update(elSpec, mountPoint, props);
         },
-        onUnmount: function onUnmount(element /*: Element */, mountPoint /*: Element */) {
+        onUnmount: function onUnmount(element
+        /*: Element */
+        , mountPoint
+        /*: Element */
+        ) {
           adapter.unmount(elSpec, mountPoint);
@@ -517,3 +666,2 @@ }
   }
-
   /**
@@ -531,9 +679,14 @@ * Coerces something into an `ElementSpec` type.
 
-  function toElementSpec(thing /*: ElementSpec | Component */
-  ) /*: ElementSpec */{
-    // $FlowFixMe$
-    if ((typeof thing === 'undefined' ? 'undefined' : _typeof(thing)) === 'object' && thing.component) return thing;
-    return { component: thing };
+  function toElementSpec(thing
+  /*: ElementSpec | Component */
+  )
+  /*: ElementSpec */
+  {
+    if (_typeof(thing) === 'object' && thing.component) return thing;
+    /* $FlowFixMe$ */
+
+    return {
+      component: thing
+    };
   }
-
   /**
@@ -548,8 +701,16 @@ * Returns properties for a given HTML element.
 
-  function getProps(element /*: Element */, attributes /*: ?Array<string> */) {
+
+  function getProps(element
+  /*: Element */
+  , attributes
+  /*: ?Array<string> */
+  ) {
     var rawJson = element.getAttribute('props-json');
     if (rawJson) return JSON.parse(rawJson);
-
     var names = attributes || [];
-    return names.reduce(function (result /*: PropertyMap */, attribute /*: string */) {
+    return names.reduce(function (result
+    /*: PropertyMap */
+    , attribute
+    /*: string */
+    ) {
       result[attribute] = element.getAttribute(attribute);
@@ -565,2 +726,2 @@ return result;
 
-})));
+}));

dist/remount.es5.min.js

@@ -1,1 +0,1 @@
-(function(a,b){'object'==typeof exports&&'undefined'!=typeof module?b(exports,require('react'),require('react-dom')):'function'==typeof define&&define.amd?define(['exports','react','react-dom'],b):b(a.Remount={},a.React,a.ReactDOM)})(this,function(a,b,c){'use strict';function d(){if(!(window.HTMLElement&&window.HTMLElement._babelES5Adapter||void 0===window.Reflect||void 0===window.customElements||window.customElements.hasOwnProperty('polyfillWrapFlushCallback'))){var b=HTMLElement;window.HTMLElement=function(){return Reflect.construct(b,[],this.constructor)},HTMLElement.prototype=b.prototype,HTMLElement.prototype.constructor=HTMLElement,Object.setPrototypeOf(HTMLElement,b),HTMLElement._babelES5Adapter=!0}}function e(a){if(Array.isArray(a)){for(var b=0,c=Array(a.length);b<a.length;b++)c[b]=a[b];return c}return Array.from(a)}function f(a,b){if(!(a instanceof b))throw new TypeError('Cannot call a class as a function')}function g(a,b){if(!a)throw new ReferenceError('this hasn\'t been initialised - super() hasn\'t been called');return b&&('object'==typeof b||'function'==typeof b)?b:a}function h(a,b){if('function'!=typeof b&&null!==b)throw new TypeError('Super expression must either be null or a function, not '+typeof b);a.prototype=Object.create(b&&b.prototype,{constructor:{value:a,enumerable:!1,writable:!0,configurable:!0}}),b&&(Object.setPrototypeOf?Object.setPrototypeOf(a,b):a.__proto__=b)}function i(a,b){var c=b.shadow;if(c&&a.attachShadow){var d=document.createElement('span');return a.attachShadow({mode:'open'}).appendChild(d),d}return a}function j(a,b,c){a.nodeName.toLowerCase()===b?(c.onMount(a,a),k(a,c),l(a,c)):a.children&&a.children.length&&m(a.children,function(a){j(a,b,c)})}function k(a,b){var c=b.onUpdate,d=new window.MutationObserver(function(a){m(a,function(a){var b=a.target;c(b,b)})});d.observe(a,{attributes:!0})}function l(a,b){var c=b.onUnmount,d=a.parentNode,e=new window.MutationObserver(function(b){m(b,function(b){m(b.removedNodes,function(b){a!==b||(e.disconnect(d),c(a,a))})})});e.observe(d,{childList:!0,subtree:!0})}function m(a,b){for(var c=0,d=a.length;c<d;c++)b(a[c])}function n(a){return!!(-1!==a.indexOf('-')&&a.match(/^[a-z][a-z0-9-]*$/))}function o(a,d,e){var f=a.component,g=a.attributes,h=b.createElement(f,e);c.render(h,d)}function p(a,b){c.unmountComponentAtNode(b)}function q(){if(void 0!==q._result)return q._result;var a=[u,w].reduce(function(a,b){return a||b.isSupported()&&b},null);return a||console.warn('Remount: This browser doesn\'t support the MutationObserver API or the Custom Elements API. Including polyfills might fix this. Remount elements will not work. https://github.com/rstacruz/remount'),q._result=a,a}function r(a){return'object'===('undefined'==typeof a?'undefined':y(a))&&a.component?a:{component:a}}function s(a,b){var c=a.getAttribute('props-json');if(c)return JSON.parse(c);return(b||[]).reduce(function(b,c){return b[c]=a.getAttribute(c),b},{})}c=c&&c.hasOwnProperty('default')?c['default']:c;var t=function(){function a(a,b){for(var c,d=0;d<b.length;d++)c=b[d],c.enumerable=c.enumerable||!1,c.configurable=!0,'value'in c&&(c.writable=!0),Object.defineProperty(a,c.key,c)}return function(b,c,d){return c&&a(b.prototype,c),d&&a(b,d),b}}(),u=Object.freeze({name:'CustomElements',defineElement:function(a,b,c){var j=c.onUpdate,k=c.onUnmount,l=c.onMount;d();var m=a.attributes||[],n=function(b){function c(){return f(this,c),g(this,(c.__proto__||Object.getPrototypeOf(c)).apply(this,arguments))}return h(c,b),t(c,[{key:'connectedCallback',value:function(){this._mountPoint=i(this,a),l(this,this._mountPoint)}},{key:'disconnectedCallback',value:function(){this._mountPoint&&k(this,this._mountPoint)}},{key:'attributeChangedCallback',value:function(){this._mountPoint&&j(this,this._mountPoint)}}],[{key:'observedAttributes',get:function(){return['props-json'].concat(e(m))}}]),c}(window.HTMLElement);a.quiet&&window.customElements.get(b)||window.customElements.define(b,n)},isSupported:function(){return window.customElements&&window.customElements.define},supportsShadow:function(){return!!(document&&document.body&&document.body.attachShadow)}}),v={},w=Object.freeze({name:'MutationObserver',observers:v,isSupported:function(){return!!window.MutationObserver},defineElement:function(a,b,c){if(b=b.toLowerCase(),!n(b)){if(a.quiet)return;throw new Error('Remount: "'+b+'" is not a valid custom element name')}if(v[b]){if(a.quiet)return;throw new Error('Remount: "'+b+'" is already registered')}var d=new window.MutationObserver(function(a){m(a,function(a){m(a.addedNodes,function(a){j(a,b,c)})})});d.observe(document.body,{childList:!0,subtree:!0}),v[b]=!0},supportsShadow:function(){return!1}}),x=Object.freeze({mount:function(a,b,c){return o(a,b,c)},update:o,unmount:p}),y='function'==typeof Symbol&&'symbol'==typeof Symbol.iterator?function(a){return typeof a}:function(a){return a&&'function'==typeof Symbol&&a.constructor===Symbol&&a!==Symbol.prototype?'symbol':typeof a};a.getStrategy=q,a.define=function(a,b){var c=q();c&&Object.keys(a).forEach(function(d){var e=Object.assign({},b,r(a[d])),f=e.adapter||x;c.defineElement(e,d,{onMount:function(a,b){var c=s(a,e.attributes);f.mount(e,b,c)},onUpdate:function(a,b){var c=s(a,e.attributes);f.update(e,b,c)},onUnmount:function(a,b){f.unmount(e,b)}})})},Object.defineProperty(a,'__esModule',{value:!0})});
+(function(a,b){"object"==typeof exports&&"undefined"!=typeof module?b(exports,require("react"),require("react-dom")):"function"==typeof define&&define.amd?define(["exports","react","react-dom"],b):(a=a||self,b(a.Remount={},a.React,a.ReactDOM))})(this,function(a,b,c){"use strict";function d(a){return d="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(a){return typeof a}:function(a){return a&&"function"==typeof Symbol&&a.constructor===Symbol&&a!==Symbol.prototype?"symbol":typeof a},d(a)}function e(a,b){if(!(a instanceof b))throw new TypeError("Cannot call a class as a function")}function f(a,b){for(var c,d=0;d<b.length;d++)c=b[d],c.enumerable=c.enumerable||!1,c.configurable=!0,"value"in c&&(c.writable=!0),Object.defineProperty(a,c.key,c)}function g(a,b,c){return b&&f(a.prototype,b),c&&f(a,c),a}function h(a,b){if("function"!=typeof b&&null!==b)throw new TypeError("Super expression must either be null or a function");a.prototype=Object.create(b&&b.prototype,{constructor:{value:a,writable:!0,configurable:!0}}),b&&j(a,b)}function i(a){return i=Object.setPrototypeOf?Object.getPrototypeOf:function(a){return a.__proto__||Object.getPrototypeOf(a)},i(a)}function j(a,b){return j=Object.setPrototypeOf||function(a,b){return a.__proto__=b,a},j(a,b)}function k(a){if(void 0===a)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return a}function l(a,b){return b&&("object"==typeof b||"function"==typeof b)?b:k(a)}function m(a){return n(a)||o(a)||p()}function n(a){if(Array.isArray(a)){for(var b=0,c=Array(a.length);b<a.length;b++)c[b]=a[b];return c}}function o(a){if(Symbol.iterator in Object(a)||"[object Arguments]"===Object.prototype.toString.call(a))return Array.from(a)}function p(){throw new TypeError("Invalid attempt to spread non-iterable instance")}function q(){if(!(window.HTMLElement&&window.HTMLElement._babelES5Adapter||void 0===window.Reflect||void 0===window.customElements||window.customElements.hasOwnProperty("polyfillWrapFlushCallback"))){var b=HTMLElement;window.HTMLElement=function(){return Reflect.construct(b,[],this.constructor)},HTMLElement.prototype=b.prototype,HTMLElement.prototype.constructor=HTMLElement,Object.setPrototypeOf(HTMLElement,b),HTMLElement._babelES5Adapter=!0}}function r(a,b){var c=b.shadow;if(c&&a.attachShadow){var d=document.createElement("span");return a.attachShadow({mode:"open"}).appendChild(d),d}return a}function s(a,b,c){a.nodeName.toLowerCase()===b?(c.onMount(a,a),t(a,c),u(a,c)):a.children&&a.children.length&&v(a.children,function(a){s(a,b,c)})}function t(a,b){var c=b.onUpdate,d=new window.MutationObserver(function(a){v(a,function(a){var b=a.target;c(b,b)})});d.observe(a,{attributes:!0})}function u(a,b){var c=b.onUnmount,d=a.parentNode,e=new window.MutationObserver(function(b){v(b,function(b){v(b.removedNodes,function(b){a!==b||(e.disconnect(d),c(a,a))})})});e.observe(d,{childList:!0,subtree:!0})}function v(a,b){for(var c=0,d=a.length;c<d;c++)b(a[c])}function w(a){return!!(-1!==a.indexOf("-")&&a.match(/^[a-z][a-z0-9-]*$/))}function x(a,d,e){var f=a.component,g=b.createElement(f,e);c.render(g,d)}function y(a,b){c.unmountComponentAtNode(b)}function z(){if(void 0!==z._result)return z._result;var a=[C,E].reduce(function(a,b){return a||b.isSupported()&&b},null);return a||console.warn("Remount: This browser doesn't support the MutationObserver API or the Custom Elements API. Including polyfills might fix this. Remount elements will not work. https://github.com/rstacruz/remount"),z._result=a,a}function A(a){return"object"===d(a)&&a.component?a:{component:a}}function B(a,b){var c=a.getAttribute("props-json");if(c)return JSON.parse(c);return(b||[]).reduce(function(b,c){return b[c]=a.getAttribute(c),b},{})}c=c&&c.hasOwnProperty("default")?c["default"]:c;var C=Object.freeze({name:"CustomElements",defineElement:function(a,b,c){var d=c.onUpdate,f=c.onUnmount,j=c.onMount;q();var k=a.attributes||[],n=function(b){function c(){return e(this,c),l(this,i(c).apply(this,arguments))}return h(c,b),g(c,[{key:"connectedCallback",value:function(){this._mountPoint=r(this,a),j(this,this._mountPoint)}},{key:"disconnectedCallback",value:function(){this._mountPoint&&f(this,this._mountPoint)}},{key:"attributeChangedCallback",value:function(){this._mountPoint&&d(this,this._mountPoint)}}],[{key:"observedAttributes",get:function(){return["props-json"].concat(m(k))}}]),c}(window.HTMLElement);a.quiet&&window.customElements.get(b)||window.customElements.define(b,n)},isSupported:function(){return window.customElements&&window.customElements.define},supportsShadow:function(){return!!(document&&document.body&&document.body.attachShadow)}}),D={},E=Object.freeze({name:"MutationObserver",observers:D,isSupported:function(){return!!window.MutationObserver},defineElement:function(a,b,c){if(b=b.toLowerCase(),!w(b)){if(a.quiet)return;throw new Error("Remount: \"".concat(b,"\" is not a valid custom element name"))}if(D[b]){if(a.quiet)return;throw new Error("Remount: \"".concat(b,"\" is already registered"))}var d=new window.MutationObserver(function(a){v(a,function(a){v(a.addedNodes,function(a){s(a,b,c)})})});d.observe(document.body,{childList:!0,subtree:!0}),D[b]=!0,window.addEventListener("DOMContentLoaded",function(){var a=document.getElementsByTagName(b);m(a).forEach(function(a){return s(a,b,c)})})},supportsShadow:function(){return!1}}),F=Object.freeze({mount:function(a,b,c){return x(a,b,c)},update:x,unmount:y});a.getStrategy=z,a.define=function(a,b){var c=z();c&&Object.keys(a).forEach(function(d){var e=Object.assign({},b,A(a[d])),f=e.adapter||F;c.defineElement(e,d,{onMount:function(a,b){var c=B(a,e.attributes);f.mount(e,b,c)},onUpdate:function(a,b){var c=B(a,e.attributes);f.update(e,b,c)},onUnmount:function(a,b){f.unmount(e,b)}})})},Object.defineProperty(a,"__esModule",{value:!0})});

dist/remount.es6.js

 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('react-dom')) :
   typeof define === 'function' && define.amd ? define(['exports', 'react', 'react-dom'], factory) :
-  (factory((global.Remount = {}),global.React,global.ReactDOM));
-}(this, (function (exports,React,ReactDOM) { 'use strict';
+  (global = global || self, factory(global.Remount = {}, global.React, global.ReactDOM));
+}(this, function (exports, React, ReactDOM) { 'use strict';
 
@@ -16,3 +16,3 @@ ReactDOM = ReactDOM && ReactDOM.hasOwnProperty('default') ? ReactDOM['default'] : ReactDOM;
 
-  function inject () {
+  function inject() {
     if (
@@ -28,3 +28,3 @@ (window.HTMLElement && window.HTMLElement._babelES5Adapter) ||
 
-    window.HTMLElement = function () {
+    window.HTMLElement = function() {
       return Reflect.construct(a, [], this.constructor)
@@ -73,3 +73,3 @@ };
 
-  function defineElement (
+  function defineElement(
     elSpec /*: ElementSpec */,
@@ -83,7 +83,7 @@ name /*: string */,
     class ComponentElement extends window.HTMLElement {
-      static get observedAttributes () {
+      static get observedAttributes() {
         return ['props-json', ...attributes]
       }
 
-      connectedCallback () {
+      connectedCallback() {
         this._mountPoint = createMountPoint(this, elSpec);
@@ -93,3 +93,3 @@ onMount(this, this._mountPoint);
 
-      disconnectedCallback () {
+      disconnectedCallback() {
         if (!this._mountPoint) return
@@ -99,3 +99,3 @@ onUnmount(this, this._mountPoint);
 
-      attributeChangedCallback () {
+      attributeChangedCallback() {
         if (!this._mountPoint) return
@@ -114,3 +114,3 @@ onUpdate(this, this._mountPoint);
 
-  function isSupported () {
+  function isSupported() {
     return window.customElements && window.customElements.define
@@ -125,3 +125,3 @@ }
 
-  function createMountPoint (
+  function createMountPoint(
     element /*: Element */,
@@ -143,3 +143,3 @@ { shadow } /*: ElementSpec */
 
-  function supportsShadow () {
+  function supportsShadow() {
     return !!(document && document.body && document.body.attachShadow)
@@ -168,3 +168,3 @@ }
 
-  function isSupported$1 () {
+  function isSupported$1() {
     return !!window.MutationObserver
@@ -190,3 +190,3 @@ }
 
-  function defineElement$1 (
+  function defineElement$1(
     elSpec /*: ElementSpec */,
@@ -223,2 +223,7 @@ name /*: string */,
     observers[name] = true;
+
+    window.addEventListener('DOMContentLoaded', () => {
+      const nodes = document.getElementsByTagName(name);
+      [...nodes].forEach(node => checkForMount(node, name, events));
+    });
   }
@@ -231,3 +236,3 @@
 
-  function checkForMount (
+  function checkForMount(
     node /*: Element */,
@@ -254,3 +259,3 @@ name /*: string */,
 
-  function observeForUpdates (
+  function observeForUpdates(
     node /*: Element */,
@@ -273,3 +278,3 @@ { onUpdate } /*: ElementEvents */
 
-  function observeForRemoval (
+  function observeForRemoval(
     node /*: Element */,
@@ -326,3 +331,3 @@ { onUnmount } /*: ElementEvents */
 
-  function isValidName (name /*: string */) /*: boolean */ {
+  function isValidName(name /*: string */) /*: boolean */ {
     return !!(name.indexOf('-') !== -1 && name.match(/^[a-z][a-z0-9-]*$/))
@@ -335,3 +340,3 @@ }
 
-  function supportsShadow$1 () {
+  function supportsShadow$1() {
     return false
@@ -354,3 +359,3 @@ }
 
-  function mount (
+  function mount(
     elSpec /*: ElementSpec */,
@@ -368,4 +373,4 @@ mountPoint /*: Element */,
 
-  function update (
-    { component, attributes } /*: ElementSpec */,
+  function update(
+    { component } /*: ElementSpec */,
     mountPoint /*: Element */,
@@ -383,3 +388,3 @@ props /*: {} */
 
-  function unmount (_ /*: ElementSpec */, mountPoint /*: Element */) {
+  function unmount(_ /*: ElementSpec */, mountPoint /*: Element */) {
     ReactDOM.unmountComponentAtNode(mountPoint);
@@ -414,3 +419,3 @@ }
 
-  function getStrategy () {
+  function getStrategy() {
     // $FlowFixMe$ obviously
@@ -429,2 +434,3 @@ if (getStrategy._result !== undefined) {
     if (!Strategy) {
+      /* eslint-disable no-console */
       console.warn(
@@ -455,3 +461,3 @@ "Remount: This browser doesn't support the " +
 
-  function define (
+  function define(
     components /*: ElementMap */,
@@ -476,3 +482,3 @@ defaults /*: ?Defaults */
       Strategy.defineElement(elSpec, name$$1, {
-        onMount (element /*: Element */, mountPoint /*: Element */) {
+        onMount(element /*: Element */, mountPoint /*: Element */) {
           const props = getProps(element, elSpec.attributes);
@@ -482,3 +488,3 @@ adapter.mount(elSpec, mountPoint, props);
 
-        onUpdate (element /*: Element */, mountPoint /*: Element */) {
+        onUpdate(element /*: Element */, mountPoint /*: Element */) {
           const props = getProps(element, elSpec.attributes);
@@ -488,3 +494,3 @@ adapter.update(elSpec, mountPoint, props);
 
-        onUnmount (element /*: Element */, mountPoint /*: Element */) {
+        onUnmount(element /*: Element */, mountPoint /*: Element */) {
           adapter.unmount(elSpec, mountPoint);
@@ -508,7 +514,7 @@ }
 
-  function toElementSpec (
+  function toElementSpec(
     thing /*: ElementSpec | Component */
   ) /*: ElementSpec */ {
-    // $FlowFixMe$
     if (typeof thing === 'object' && thing.component) return thing
+    /* $FlowFixMe$ */
     return { component: thing }
@@ -526,3 +532,3 @@ }
 
-  function getProps (element /*: Element */, attributes /*: ?Array<string> */) {
+  function getProps(element /*: Element */, attributes /*: ?Array<string> */) {
     const rawJson = element.getAttribute('props-json');
@@ -543,2 +549,2 @@ if (rawJson) return JSON.parse(rawJson)
 
-})));
+}));

dist/remount.es6.min.js

@@ -1,1 +0,1 @@
-(function(a,b){'object'==typeof exports&&'undefined'!=typeof module?b(exports,require('react'),require('react-dom')):'function'==typeof define&&define.amd?define(['exports','react','react-dom'],b):b(a.Remount={},a.React,a.ReactDOM)})(this,function(a,b,c){'use strict';function d(){if(window.HTMLElement&&window.HTMLElement._babelES5Adapter||void 0===window.Reflect||void 0===window.customElements||window.customElements.hasOwnProperty('polyfillWrapFlushCallback'))return;const b=HTMLElement;window.HTMLElement=function(){return Reflect.construct(b,[],this.constructor)},HTMLElement.prototype=b.prototype,HTMLElement.prototype.constructor=HTMLElement,Object.setPrototypeOf(HTMLElement,b),HTMLElement._babelES5Adapter=!0}function e(a,{shadow:b}){if(b&&a.attachShadow){const b=document.createElement('span');return a.attachShadow({mode:'open'}).appendChild(b),b}return a}function f(a,b,c){a.nodeName.toLowerCase()===b?(c.onMount(a,a),g(a,c),h(a,c)):a.children&&a.children.length&&i(a.children,(a)=>{f(a,b,c)})}function g(a,{onUpdate:b}){const c=new window.MutationObserver(a=>{i(a,(a)=>{const c=a.target;b(c,c)})});c.observe(a,{attributes:!0})}function h(a,{onUnmount:b}){const c=a.parentNode,d=new window.MutationObserver(e=>{i(e,(e)=>{i(e.removedNodes,(e)=>{a!==e||(d.disconnect(c),b(a,a))})})});d.observe(c,{childList:!0,subtree:!0})}function i(a,b){for(let c=0,d=a.length;c<d;c++)b(a[c])}function j(a){return!!(-1!==a.indexOf('-')&&a.match(/^[a-z][a-z0-9-]*$/))}function k({component:a,attributes:d},e,f){const g=b.createElement(a,f);c.render(g,e)}function l(a,b){c.unmountComponentAtNode(b)}function m(){if(void 0!==m._result)return m._result;const a=[p,r].reduce((a,b)=>a||b.isSupported()&&b,null);return a||console.warn('Remount: This browser doesn\'t support the MutationObserver API or the Custom Elements API. Including polyfills might fix this. Remount elements will not work. https://github.com/rstacruz/remount'),m._result=a,a}function n(a){return'object'==typeof a&&a.component?a:{component:a}}function o(a,b){const c=a.getAttribute('props-json');if(c)return JSON.parse(c);return(b||[]).reduce((b,c)=>(b[c]=a.getAttribute(c),b),{})}c=c&&c.hasOwnProperty('default')?c['default']:c;var p=Object.freeze({name:'CustomElements',defineElement:function(a,b,{onUpdate:c,onUnmount:f,onMount:g}){d();const h=a.attributes||[];class i extends window.HTMLElement{static get observedAttributes(){return['props-json',...h]}connectedCallback(){this._mountPoint=e(this,a),g(this,this._mountPoint)}disconnectedCallback(){this._mountPoint&&f(this,this._mountPoint)}attributeChangedCallback(){this._mountPoint&&c(this,this._mountPoint)}}a.quiet&&window.customElements.get(b)||window.customElements.define(b,i)},isSupported:function(){return window.customElements&&window.customElements.define},supportsShadow:function(){return!!(document&&document.body&&document.body.attachShadow)}});const q={};var r=Object.freeze({name:'MutationObserver',observers:q,isSupported:function(){return!!window.MutationObserver},defineElement:function(a,b,c){if(b=b.toLowerCase(),!j(b)){if(a.quiet)return;throw new Error(`Remount: "${b}" is not a valid custom element name`)}if(q[b]){if(a.quiet)return;throw new Error(`Remount: "${b}" is already registered`)}const d=new window.MutationObserver(a=>{i(a,(a)=>{i(a.addedNodes,(a)=>{f(a,b,c)})})});d.observe(document.body,{childList:!0,subtree:!0}),q[b]=!0},supportsShadow:function(){return!1}}),s=Object.freeze({mount:function(a,b,c){return k(a,b,c)},update:k,unmount:l});a.getStrategy=m,a.define=function(a,b){const c=m();c&&Object.keys(a).forEach((d)=>{const e=Object.assign({},b,n(a[d])),f=e.adapter||s;c.defineElement(e,d,{onMount(a,b){const c=o(a,e.attributes);f.mount(e,b,c)},onUpdate(a,b){const c=o(a,e.attributes);f.update(e,b,c)},onUnmount(a,b){f.unmount(e,b)}})})},Object.defineProperty(a,'__esModule',{value:!0})});
+(function(a,b){"object"==typeof exports&&"undefined"!=typeof module?b(exports,require("react"),require("react-dom")):"function"==typeof define&&define.amd?define(["exports","react","react-dom"],b):(a=a||self,b(a.Remount={},a.React,a.ReactDOM))})(this,function(a,b,c){"use strict";function d(){if(window.HTMLElement&&window.HTMLElement._babelES5Adapter||void 0===window.Reflect||void 0===window.customElements||window.customElements.hasOwnProperty("polyfillWrapFlushCallback"))return;const b=HTMLElement;window.HTMLElement=function(){return Reflect.construct(b,[],this.constructor)},HTMLElement.prototype=b.prototype,HTMLElement.prototype.constructor=HTMLElement,Object.setPrototypeOf(HTMLElement,b),HTMLElement._babelES5Adapter=!0}function e(a,{shadow:b}){if(b&&a.attachShadow){const b=document.createElement("span");return a.attachShadow({mode:"open"}).appendChild(b),b}return a}function f(a,b,c){a.nodeName.toLowerCase()===b?(c.onMount(a,a),g(a,c),h(a,c)):a.children&&a.children.length&&i(a.children,(a)=>{f(a,b,c)})}function g(a,{onUpdate:b}){const c=new window.MutationObserver(a=>{i(a,(a)=>{const c=a.target;b(c,c)})});c.observe(a,{attributes:!0})}function h(a,{onUnmount:b}){const c=a.parentNode,d=new window.MutationObserver(e=>{i(e,(e)=>{i(e.removedNodes,(e)=>{a!==e||(d.disconnect(c),b(a,a))})})});d.observe(c,{childList:!0,subtree:!0})}function i(a,b){for(let c=0,d=a.length;c<d;c++)b(a[c])}function j(a){return!!(-1!==a.indexOf("-")&&a.match(/^[a-z][a-z0-9-]*$/))}function k({component:a},d,e){const f=b.createElement(a,e);c.render(f,d)}function l(a,b){c.unmountComponentAtNode(b)}function m(){if(void 0!==m._result)return m._result;const a=[p,r].reduce((a,b)=>a||b.isSupported()&&b,null);return a||console.warn("Remount: This browser doesn't support the MutationObserver API or the Custom Elements API. Including polyfills might fix this. Remount elements will not work. https://github.com/rstacruz/remount"),m._result=a,a}function n(a){return"object"==typeof a&&a.component?a:{component:a}}function o(a,b){const c=a.getAttribute("props-json");if(c)return JSON.parse(c);return(b||[]).reduce((b,c)=>(b[c]=a.getAttribute(c),b),{})}c=c&&c.hasOwnProperty("default")?c["default"]:c;var p=Object.freeze({name:"CustomElements",defineElement:function(a,b,{onUpdate:c,onUnmount:f,onMount:g}){d();const h=a.attributes||[];class i extends window.HTMLElement{static get observedAttributes(){return["props-json",...h]}connectedCallback(){this._mountPoint=e(this,a),g(this,this._mountPoint)}disconnectedCallback(){this._mountPoint&&f(this,this._mountPoint)}attributeChangedCallback(){this._mountPoint&&c(this,this._mountPoint)}}a.quiet&&window.customElements.get(b)||window.customElements.define(b,i)},isSupported:function(){return window.customElements&&window.customElements.define},supportsShadow:function(){return!!(document&&document.body&&document.body.attachShadow)}});const q={};var r=Object.freeze({name:"MutationObserver",observers:q,isSupported:function(){return!!window.MutationObserver},defineElement:function(a,b,c){if(b=b.toLowerCase(),!j(b)){if(a.quiet)return;throw new Error(`Remount: "${b}" is not a valid custom element name`)}if(q[b]){if(a.quiet)return;throw new Error(`Remount: "${b}" is already registered`)}const d=new window.MutationObserver(a=>{i(a,(a)=>{i(a.addedNodes,(a)=>{f(a,b,c)})})});d.observe(document.body,{childList:!0,subtree:!0}),q[b]=!0,window.addEventListener("DOMContentLoaded",()=>{const a=document.getElementsByTagName(b);[...a].forEach(a=>f(a,b,c))})},supportsShadow:function(){return!1}}),s=Object.freeze({mount:function(a,b,c){return k(a,b,c)},update:k,unmount:l});a.getStrategy=m,a.define=function(a,b){const c=m();c&&Object.keys(a).forEach((d)=>{const e=Object.assign({},b,n(a[d])),f=e.adapter||s;c.defineElement(e,d,{onMount(a,b){const c=o(a,e.attributes);f.mount(e,b,c)},onUpdate(a,b){const c=o(a,e.attributes);f.update(e,b,c)},onUnmount(a,b){f.unmount(e,b)}})})},Object.defineProperty(a,"__esModule",{value:!0})});

index.js

@@ -24,3 +24,3 @@ // @flow
 
-export function getStrategy () {
+export function getStrategy() {
   // $FlowFixMe$ obviously
@@ -39,2 +39,3 @@ if (getStrategy._result !== undefined) {
   if (!Strategy) {
+    /* eslint-disable no-console */
     console.warn(
@@ -65,3 +66,3 @@ "Remount: This browser doesn't support the " +
 
-export function define (
+export function define(
   components /*: ElementMap */,
@@ -86,3 +87,3 @@ defaults /*: ?Defaults */
     Strategy.defineElement(elSpec, name, {
-      onMount (element /*: Element */, mountPoint /*: Element */) {
+      onMount(element /*: Element */, mountPoint /*: Element */) {
         const props = getProps(element, elSpec.attributes)
@@ -92,3 +93,3 @@ adapter.mount(elSpec, mountPoint, props)
 
-      onUpdate (element /*: Element */, mountPoint /*: Element */) {
+      onUpdate(element /*: Element */, mountPoint /*: Element */) {
         const props = getProps(element, elSpec.attributes)
@@ -98,3 +99,3 @@ adapter.update(elSpec, mountPoint, props)
 
-      onUnmount (element /*: Element */, mountPoint /*: Element */) {
+      onUnmount(element /*: Element */, mountPoint /*: Element */) {
         adapter.unmount(elSpec, mountPoint)
@@ -118,7 +119,7 @@ }
 
-function toElementSpec (
+function toElementSpec(
   thing /*: ElementSpec | Component */
 ) /*: ElementSpec */ {
-  // $FlowFixMe$
   if (typeof thing === 'object' && thing.component) return thing
+  /* $FlowFixMe$ */
   return { component: thing }
@@ -136,3 +137,3 @@ }
 
-function getProps (element /*: Element */, attributes /*: ?Array<string> */) {
+function getProps(element /*: Element */, attributes /*: ?Array<string> */) {
   const rawJson = element.getAttribute('props-json')
@@ -139,0 +140,0 @@ if (rawJson) return JSON.parse(rawJson)

package.json

 {
   "name": "remount",
   "description": "Mount React components to the DOM using custom elements",
-  "version": "0.9.3",
+  "version": "0.9.5",
   "author": "Rico Sta. Cruz <[e-mail]>",
@@ -10,21 +10,24 @@ "bugs": {
   "devDependencies": {
-    "babel-core": "^6.26.3",
-    "babel-jest": "^23.4.2",
-    "babel-preset-env": "^1.7.0",
-    "babel-preset-react": "^6.24.1",
-    "expect-puppeteer": "3.3.0",
-    "flow-bin": "^0.79.1",
-    "gh-pages": "^1.2.0",
-    "jest": "^23.5.0",
-    "npm-run-all": "^4.1.3",
-    "prettier-eslint-cli": "^4.7.1",
-    "puppeteer": "^1.7.0",
-    "react": "^16.4.2",
-    "react-dom": "^16.4.2",
-    "rollup": "^0.64.1",
-    "rollup-plugin-babel": "^3.0.7",
-    "rollup-plugin-babel-minify": "^5.0.0",
+    "@babel/core": "^7.2.2",
+    "@babel/preset-env": "^7.2.3",
+    "@babel/preset-react": "^7.0.0",
+    "babel-core": "^7.0.0-bridge.0",
+    "babel-eslint": "^10.0.1",
+    "babel-jest": "^23.6.0",
+    "eslint": "^5.12.0",
+    "expect-puppeteer": "3.5.1",
+    "flow-bin": "^0.90.0",
+    "gh-pages": "^2.0.1",
+    "jest": "^23.6.0",
+    "npm-run-all": "^4.1.5",
+    "prettier": "^1.15.3",
+    "puppeteer": "^1.12.2",
+    "react": "^16.7.0",
+    "react-dom": "^16.7.0",
+    "rollup": "^1.1.2",
+    "rollup-plugin-babel": "^4.3.2",
+    "rollup-plugin-babel-minify": "^7.0.0",
     "rollup-plugin-copy": "^0.2.3",
     "rollup-plugin-server": "^0.7.0",
-    "standard": "^11.0.1"
+    "start-server-and-test": "^1.7.11"
   },
@@ -59,2 +62,3 @@ "directories": {
   "main": "dist/remount.es5.js",
+  "module": "dist/remount.esm.mjs",
   "peerDependencies": {
@@ -70,4 +74,4 @@ "react": ">= 15.0.0",
     "build": "rollup --config",
-    "prettier": "prettier-eslint '*.js'",
-    "eslint": "eslint '*.js'",
+    "prettier": "prettier '*.js' 'lib/**/*.js'",
+    "eslint": "eslint '*.js' 'lib/**/*.js'",
     "deploy": "gh-pages -d . -s 'dist/**/*'",
@@ -77,5 +81,5 @@ "flow": "flow",
     "prepare": "run-s build",
-    "test": "run-p -l --race watch jest",
+    "test": "start-server-and-test watch http://127.0.0.1:10049/ jest",
     "watch": "env NODE_ENV=test-rollup rollup --config --watch"
   }
 }

README.md

@@ -10,7 +10,7 @@ <br>
 <p align='center'>
-<a href='https://travis-ci.org/rstacruz/remount'><img src='https://api.travis-ci.org/rstacruz/remount.svg?branch=master' alt='Travis CI' /></a>
+<a href='https://travis-ci.org/rstacruz/remount'><img src='https://img.shields.io/travis/rstacruz/remount/master.svg?colorA=234' alt='Travis CI' /></a>
 &nbsp;
-<a href='https://npmjs.com/package/remount'><img src='https://img.shields.io/npm/v/remount.svg' alt='version'></a>
+<a href='https://npmjs.com/package/remount'><img src='https://img.shields.io/npm/v/remount.svg?colorA=234&colorB=83e' alt='version'></a>
 &nbsp;
-<a href='./LICENSE.md'><img src='https://img.shields.io/badge/license-MIT-brightgreen.svg' alt='MIT license'></a>
+<a href='https://bundlephobia.com/result?p=remount'><img src='https://img.shields.io/bundlephobia/minzip/remount.svg?colorA=345&colorB=89a&label=size' alt='Bundle size'></a>
 </p>
@@ -17,0 +17,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

69968

increased by5.23%

Lines of code

1654

increased by12.29%

Worsened metrics

Dev dependency count

22

increased by15.79%

No dependency changes