@power-js/core - npm Package Compare versions

Comparing version 0.0.3 to 0.0.4

dist/power.dev.js

@@ -48,3 +48,3 @@ (function (global, factory) {
   /**
-   * stack // TODO better description
+   * Array used to sanitize child nodes
    * @type {Array}
@@ -72,3 +72,3 @@ */
 
-      if (child.pop) {
+      if (child && child.pop) {
         for (var _i = child.length; _i--;) {
@@ -87,3 +87,3 @@ stack[stack.length] = child[_i];
         if (typeof child !== 'function') {
-          if (child === null) {
+          if (child === null || child === undefined) {
             child = '';
@@ -101,14 +101,2 @@ }
   /**
-   * Determines whether a string begins with the characters of a specified string, returning true or false.
-   * @private
-   * @param  {String} text     The text string that will be searched
-   * @param  {String} search   The characters to be searched for at the start of this string
-   * @param  {Number} position The position in the text to begin searching - defaults to 0 (optional)
-   * @return {Boolean}         True if the given characters are found at the beginning of the string; otherwise, false
-   */
-  var startsWith = function startsWith(text, search, position) {
-    return text.substr(!position || position < 0 ? 0 : +position, search.length) === search;
-  };
-
-  /**
    * Determines whether the passed object is a valid element attribute
@@ -120,5 +108,4 @@ * @private
    */
-
   var isElementAttribute = function isElementAttribute(element, attribute) {
-    return attribute in element || attribute === 'class' || startsWith(attribute, 'data-') || startsWith(attribute, 'power-');
+    return attribute in element || attribute === 'class' || attribute.startsWith('data-') || attribute.startsWith('power-');
   };
@@ -143,5 +130,4 @@
    */
-
   var isEvent = function isEvent(event) {
-    return (startsWith(event, 'on') ? event.toLowerCase() : "on".concat(event)) in window;
+    return (event.startsWith('on') ? event.toLowerCase() : "on".concat(event)) in window;
   };
@@ -310,2 +296,10 @@
   /**
+   * Helpers proxy to handle binding/unbinding listeners
+   * @param  {Object} e Event object
+   * @return {Function} Event listener function
+   */
+  var proxyFn = function proxyFn(e) {
+    return this.$events[e.type](e);
+  };
+  /**
    * Assigns a callback function to the event type on the specificed element that
@@ -318,8 +312,13 @@ * will be called whenever the event is triggered
    */
+
   var addEventListener = function addEventListener(element, event, handler) {
     var eventType = event.startsWith('on') ? event.substring(2, event.length).toLowerCase() : event; // invoke the callback function in the context of the DOM element
 
-    element.addEventListener(eventType, function (e) {
-      return handler.call(element, e, element);
-    });
+    element.addEventListener(eventType, proxyFn);
+
+    if (!element.$events) {
+      element.$events = {};
+    }
+
+    element.$events[eventType] = handler;
   };
@@ -372,23 +371,33 @@
    * @param {HTMLElement} element
-   * @param {Object}      elementProps
+   * @param {Object}      nextProps
+   * @param {object}      prevProps
    */
 
-  var decorateElement = function decorateElement(element, props) {
-    for (var prop in props) {
-      if (prop === 'style') {
-        if (!isEqual(element.style, props.style)) {
-          updateElementStyles(element, props[prop]);
+  var decorateElement = function decorateElement(element, nextProps, prevProps) {
+    if (prevProps) {
+      for (var prop in prevProps) {
+        if (!nextProps[prop]) {
+          if (isEvent(prop) && element.$events[prop]) {
+            element.removeEventListener(prop, element.$events[prop]);
+          } else {
+            element.removeAttribute(jsxProps[prop] || prop);
+          }
         }
+      }
+    }
 
+    for (var _prop in nextProps) {
+      if (_prop === 'style' && !isEqual(element.style, nextProps.style)) {
+        updateElementStyles(element, nextProps[_prop]);
         continue;
       }
 
-      if (isEvent(prop)) {
-        addEventListener(element, prop, props[prop]);
+      if (isEvent(_prop)) {
+        addEventListener(element, _prop, nextProps[_prop]);
         continue;
       }
 
-      if (isElementAttribute(element, prop) || prop === 'key') {
-        if (!element[prop] || props[prop] !== element[prop]) {
-          element.setAttribute(jsxProps[prop] || prop, props[prop]);
+      if (isElementAttribute(element, _prop) || _prop === 'key') {
+        if (!element[_prop] || nextProps[_prop] !== element[_prop]) {
+          element.setAttribute(jsxProps[_prop] || _prop, nextProps[_prop]);
         }
@@ -476,21 +485,14 @@ }
    * @private
-   * @param {Object}      oldObj
-   * @param {Object}      newObj
+   * @param {Object}      prevProps
+   * @param {Object}      nextProps
    * @param {HTMLElement} element
    */
 
-  var propsDiff = function propsDiff(oldObj, newObj, element) {
+  var propsDiff = function propsDiff(prevProps, nextProps, element) {
     // prevent unneeded iterations
-    if (isEqual(oldObj, newObj)) {
+    if (isEqual(prevProps, nextProps)) {
       return;
     }
 
-    for (var key in oldObj) {
-      if (!newObj[key]) {
-        // removing attribute from element
-        element.removeAttribute(jsxProps[key] || key);
-      }
-    }
-
-    decorateElement(element, newObj);
+    decorateElement(element, nextProps, prevProps);
   };
@@ -510,9 +512,2 @@
   /**
-   * Replaces one child node of the specified node with another
-   * @private
-   * @param {HTMLElement} oldChild
-   * @param {HTMLElement} newChild
-   */
-
-  /**
    * checks out the difference between 2 Arrays
@@ -519,0 +514,0 @@ * and merges it into the component element

dist/power.js

@@ -1,1 +0,1 @@
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e(t.power={})}(this,function(t){"use strict";var f="power-id",o=0;function a(t,e,n){return this.tagName=t||"div",this.children=n||[],this.props=e||{},o+=1,this.props[f]=o,this}var s=[];var i=function(t,e,n){return t.substr(!n||n<0?0:+n,e.length)===e},d=function(t,e){return JSON.stringify(t)===JSON.stringify(e)},m=function(t){return t&&t.constructor===a},r={},e={};["Array","Boolean","Date","Error","Function","Null","Number","Object","RegExp","String","Undefined"].forEach(function(t){var n=t.toLowerCase();r["[object ".concat(t,"]")]=n,e["is".concat(t)]=function(t){return(null===(e=t)?String(e):r[{}.toString.call(e)])===n;var e}});var p=e.isArray,c=e.isFunction,l=e.isObject,v=e.isString,n=function t(e,n){var o=n||document.body;if(c(e.tagName))return t(new e.tagName(e.props),o);if(!m(e)&&!e._power)return t(new e,o);e._power&&e.componentWillMount&&e.componentWillMount(e);var r=e.create();return r instanceof Element&&o.appendChild(r),e._power&&e.componentDidMount&&e.componentDidMount(e),e};function u(t,e){for(var n=0;n<e.length;n++){var o=e[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}var h=function(t){for(var e=[].slice.call(arguments,1),n=0,o=e.length;n<o;n++){var r=e[n];for(var i in r)t[i]=r[i]}return t},y=function(e,t,n){var o=t.startsWith("on")?t.substring(2,t.length).toLowerCase():t;e.addEventListener(o,function(t){return n.call(e,t,e)})},g=function(t,e,n){if(!d(e,n)&&(v(e)&&(t.style.cssText=e),l(e))){if(l(n))for(var o in n)o in e||(t.style[o]="");for(var r in e)t.style[r]=e[r]}},b={htmlFor:"for",className:"class"},w=function(t,e){for(var n in e)"style"!==n?(i(r=n,"on")?r.toLowerCase():"on".concat(r))in window?y(t,n,e[n]):((o=n)in t||"class"===o||i(o,"data-")||i(o,"power-")||"key"===n)&&(t[n]&&e[n]===t[n]||t.setAttribute(b[n]||n,e[n])):d(t.style,e.style)||g(t,e[n]);var o,r},C=function(t){var e=document.createElement(t.tagName.name||t.tagName),n=document.createDocumentFragment();return t.children&&t.children.length&&function t(e,n){for(var o=0,r=n.length;o<r;o++){var i=n[o];m(i)?(s=i,e.appendChild(C(s))):p(i)?t(e,i):(a=i,e.appendChild(document.createTextNode(a)))}var a,s}(n,t.children),e.appendChild(n),t.props&&Object.keys(t.props).length&&w(e,t.props),e},k=function(t,e,n){var o=t.props[f];null===e.props&&(e.props={}),e.props[f]=o;var r,i,a,s,p,c,l=n.node.querySelector("[".concat(f,'="').concat(o,'"]')),u=e.children,h=t.children;!function(t,e,n){if(!d(t,e)){for(var o in t)e[o]||n.removeAttribute(b[o]||o);w(n,e)}}(t.props,e.props,l),p=h,(c=u).length&&c[0].props&&c[0].props.key||p.length&&p[0].props&&p[0].props.key?(r=u,i=l,a=h.map(function(t){return t.props.key}),s=r.map(function(t){return t.props.key}),a.length>s.length?a.filter(function(t){return s.indexOf(t)<0}).forEach(function(t){var e=i.querySelector('[key="'.concat(t,'"]'));i&&i.removeChild(e)}):a.length<s.length&&s.filter(function(t){return a.indexOf(t)<0}).forEach(function(e){r.forEach(function(t){t.props.key===e&&i.appendChild(C(t))})})):function t(e,n,o,r){for(var i=0,a=n.length;i<a;i++){var s=n[i];if(void 0===e[i]&&m(s)){s.props||(s.props={});var p=C(s,r);o.appendChild(p)}else if(v(s)&&s!==e[i]){var c=document.createTextNode(s);o.replaceChild(c,o.childNodes[i])}else m(s)?k(e[i],s,r):s.pop&&e[i]&&e[i].pop&&t(e[i],s,o,r)}for(var l,u=e.length-n.length,h=e.length-1;0<u;)(l=r.node.querySelector("[".concat(f,'="').concat(e[h].props[f],'"]')))&&l.parentNode&&l.parentNode.removeChild(l),h-=1,u-=1}(h,u,l,n)},D=["push","pop","shift","unshift","splice"],N=function(){function n(t){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,n);var e=this.constructor;this.componentWillInitialize&&this.componentWillInitialize(this),this._power=!0,this.name=e.name,this.state=c(this.getInitialState)?this.getInitialState():l(e.initialState)?e.initialState:{},this.props=c(this.getDefaultProps)?this.getDefaultProps():l(e.defaultProps)?e.defaultProps:{},t&&(this.props=h({},this.props,t)),this.componentDidInitialize&&this.componentDidInitialize(this)}var t,e,o;return t=n,(e=[{key:"create",value:function(){var r,t;return this.node=document.createElement(this.name),this.node.setAttribute("power-component",!0),this.componentVDom=this.render(),this.props=(t=(r=this).props,new Proxy(t,{get:function(t,e){var n=t[e],o={get:function(e,n){var t=e[n];return c(t)&&p(e)?function(){var t=Array.prototype[n].apply(e,arguments);return D.includes(n)&&r.shouldComponentUpdate(r.props,r.state)&&r.update(),t}:t}};return p(n)?new Proxy(n,o):n},set:function(t,e,n){var o=t[e];return r.shouldComponentUpdate(t,r.state)&&o!==n&&(t[e]=n,r.update()),!0}})),this.template=C(this.componentVDom,this),this.node.appendChild(this.template),this.node}},{key:"shouldComponentUpdate",value:function(){return!0}},{key:"setState",value:function(t,e){if(!d(t,this.state)){var n=t;if(c(n)&&(n=n.call(this,this.state,this.props)),n=h({},this.state,n),!this.shouldComponentUpdate(this.props,n))return!1;this.state=n,this.update(),c(e)&&e.call(this)}}},{key:"forceUpdate",value:function(t){this.update(),c(t)&&t.call(this)}},{key:"update",value:function(){this.componentWillUpdate&&this.componentWillUpdate(this);var t=this.render();this.patch(this.componentVDom,t),this.componentVDom=t,this.componentDidUpdate&&this.componentDidUpdate(this)}},{key:"patch",value:function(t,e){k(t,e,this)}},{key:"destroy",value:function(){this.componentWillUnmount&&this.componentWillUnmount(this),this.node.parentElement.removeChild(this.node),this.componentDidUnmount&&this.componentDidUnmount(this)}}])&&u(t.prototype,e),o&&u(t,o),n}(),S="1.0.0-beta",U={h:function(t,e){for(var n=[],o=arguments.length;2<o--;)s[s.length]=arguments[o];for(;s.length;){var r=s.pop();if(r.pop)for(var i=r.length;i--;)s[s.length]=r[i];else"boolean"==typeof r&&(r=null),"number"==typeof r&&(r=String(r)),"function"!=typeof r&&null===r&&(r=""),n[n.length]=r}return new a(t,e,n)},render:n,Component:N,version:S};t.default=U,t.render=n,t.Component=N,t.version=S,Object.defineProperty(t,"__esModule",{value:!0})});
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e(t.power={})}(this,function(t){"use strict";var v="power-id",o=0;function s(t,e,n){return this.tagName=t||"div",this.children=n||[],this.props=e||{},o+=1,this.props[v]=o,this}var a=[];var y=function(t,e){return JSON.stringify(t)===JSON.stringify(e)},l=function(t){return(t.startsWith("on")?t.toLowerCase():"on".concat(t))in window},g=function(t){return t&&t.constructor===s},r={},e={};["Array","Boolean","Date","Error","Function","Null","Number","Object","RegExp","String","Undefined"].forEach(function(t){var n=t.toLowerCase();r["[object ".concat(t,"]")]=n,e["is".concat(t)]=function(t){return(null===(e=t)?String(e):r[{}.toString.call(e)])===n;var e}});var p=e.isArray,i=e.isFunction,c=e.isObject,w=e.isString,n=function t(e,n){var o=n||document.body;if(i(e.tagName))return t(new e.tagName(e.props),o);if(!g(e)&&!e._power)return t(new e,o);e._power&&e.componentWillMount&&e.componentWillMount(e);var r=e.create();return r instanceof Element&&o.appendChild(r),e._power&&e.componentDidMount&&e.componentDidMount(e),e};function u(t,e){for(var n=0;n<e.length;n++){var o=e[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}var h=function(t){for(var e=[].slice.call(arguments,1),n=0,o=e.length;n<o;n++){var r=e[n];for(var i in r)t[i]=r[i]}return t},d=function(t){return this.$events[t.type](t)},f=function(t,e,n){if(!y(e,n)&&(w(e)&&(t.style.cssText=e),c(e))){if(c(n))for(var o in n)o in e||(t.style[o]="");for(var r in e)t.style[r]=e[r]}},m={htmlFor:"for",className:"class"},C=function(t,e,n){if(n)for(var o in n)e[o]||(l(o)&&t.$events[o]?t.removeEventListener(o,t.$events[o]):t.removeAttribute(m[o]||o));for(var r in e)"style"!==r||y(t.style,e.style)?l(r)?(s=t,p=e[a=r],void 0,c=a.startsWith("on")?a.substring(2,a.length).toLowerCase():a,s.addEventListener(c,d),s.$events||(s.$events={}),s.$events[c]=p):((i=r)in t||"class"===i||i.startsWith("data-")||i.startsWith("power-")||"key"===r)&&(t[r]&&e[r]===t[r]||t.setAttribute(m[r]||r,e[r])):f(t,e[r]);var i,s,a,p,c},b=function(t){var e=document.createElement(t.tagName.name||t.tagName),n=document.createDocumentFragment();return t.children&&t.children.length&&function t(e,n){for(var o=0,r=n.length;o<r;o++){var i=n[o];g(i)?(a=i,e.appendChild(b(a))):p(i)?t(e,i):(s=i,e.appendChild(document.createTextNode(s)))}var s,a}(n,t.children),e.appendChild(n),t.props&&Object.keys(t.props).length&&C(e,t.props),e},k=function(t,e,n){var o=t.props[v];null===e.props&&(e.props={}),e.props[v]=o;var r,i,s,a,p,c,l,u,h,d=n.node.querySelector("[".concat(v,'="').concat(o,'"]')),f=e.children,m=t.children;r=t.props,i=e.props,s=d,y(r,i)||C(s,i,r),u=m,(h=f).length&&h[0].props&&h[0].props.key||u.length&&u[0].props&&u[0].props.key?(a=f,p=d,c=m.map(function(t){return t.props.key}),l=a.map(function(t){return t.props.key}),c.length>l.length?c.filter(function(t){return l.indexOf(t)<0}).forEach(function(t){var e=p.querySelector('[key="'.concat(t,'"]'));p&&p.removeChild(e)}):c.length<l.length&&l.filter(function(t){return c.indexOf(t)<0}).forEach(function(e){a.forEach(function(t){t.props.key===e&&p.appendChild(b(t))})})):function t(e,n,o,r){for(var i=0,s=n.length;i<s;i++){var a=n[i];if(void 0===e[i]&&g(a)){a.props||(a.props={});var p=b(a,r);o.appendChild(p)}else if(w(a)&&a!==e[i]){var c=document.createTextNode(a);o.replaceChild(c,o.childNodes[i])}else g(a)?k(e[i],a,r):a.pop&&e[i]&&e[i].pop&&t(e[i],a,o,r)}for(var l,u=e.length-n.length,h=e.length-1;0<u;)(l=r.node.querySelector("[".concat(v,'="').concat(e[h].props[v],'"]')))&&l.parentNode&&l.parentNode.removeChild(l),h-=1,u-=1}(m,f,d,n)},D=["push","pop","shift","unshift","splice"],N=function(){function n(t){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,n);var e=this.constructor;this.componentWillInitialize&&this.componentWillInitialize(this),this._power=!0,this.name=e.name,this.state=i(this.getInitialState)?this.getInitialState():c(e.initialState)?e.initialState:{},this.props=i(this.getDefaultProps)?this.getDefaultProps():c(e.defaultProps)?e.defaultProps:{},t&&(this.props=h({},this.props,t)),this.componentDidInitialize&&this.componentDidInitialize(this)}var t,e,o;return t=n,(e=[{key:"create",value:function(){var r,t;return this.node=document.createElement(this.name),this.node.setAttribute("power-component",!0),this.componentVDom=this.render(),this.props=(t=(r=this).props,new Proxy(t,{get:function(t,e){var n=t[e],o={get:function(e,n){var t=e[n];return i(t)&&p(e)?function(){var t=Array.prototype[n].apply(e,arguments);return D.includes(n)&&r.shouldComponentUpdate(r.props,r.state)&&r.update(),t}:t}};return p(n)?new Proxy(n,o):n},set:function(t,e,n){var o=t[e];return r.shouldComponentUpdate(t,r.state)&&o!==n&&(t[e]=n,r.update()),!0}})),this.template=b(this.componentVDom,this),this.node.appendChild(this.template),this.node}},{key:"shouldComponentUpdate",value:function(){return!0}},{key:"setState",value:function(t,e){if(!y(t,this.state)){var n=t;if(i(n)&&(n=n.call(this,this.state,this.props)),n=h({},this.state,n),!this.shouldComponentUpdate(this.props,n))return!1;this.state=n,this.update(),i(e)&&e.call(this)}}},{key:"forceUpdate",value:function(t){this.update(),i(t)&&t.call(this)}},{key:"update",value:function(){this.componentWillUpdate&&this.componentWillUpdate(this);var t=this.render();this.patch(this.componentVDom,t),this.componentVDom=t,this.componentDidUpdate&&this.componentDidUpdate(this)}},{key:"patch",value:function(t,e){k(t,e,this)}},{key:"destroy",value:function(){this.componentWillUnmount&&this.componentWillUnmount(this),this.node.parentElement.removeChild(this.node),this.componentDidUnmount&&this.componentDidUnmount(this)}}])&&u(t.prototype,e),o&&u(t,o),n}(),S="1.0.0-beta",U={h:function(t,e){for(var n=[],o=arguments.length;2<o--;)a[a.length]=arguments[o];for(;a.length;){var r=a.pop();if(r&&r.pop)for(var i=r.length;i--;)a[a.length]=r[i];else"boolean"==typeof r&&(r=null),"number"==typeof r&&(r=String(r)),"function"!=typeof r&&null==r&&(r=""),n[n.length]=r}return new s(t,e,n)},render:n,Component:N,version:S};t.default=U,t.render=n,t.Component=N,t.version=S,Object.defineProperty(t,"__esModule",{value:!0})});

package.json

 {
   "name": "@power-js/core",
-  "version": "0.0.3",
+  "version": "0.0.4",
   "description": "A powerful JavaScript library for building web components.",
@@ -91,3 +91,6 @@ "main": "dist/power.js",
     "components",
-    "components",
+    "web-components",
+    "virtual-dom",
+    "power",
+    "power-js",
     "react-like",
@@ -94,0 +97,0 @@ "react",

src/component/component.js

@@ -1,2 +0,2 @@
-import { extend } from '../utils/objects';
+import { extend } from '../utils/objects/extend';
 import { isEqual, isFunction, isObject } from '../utils/is';
@@ -3,0 +3,0 @@ import { POWER_COMPONENT_ATTRIBUTE } from '../constants';

src/diff/childrenDiff.js

 import { isString, isVNode } from '../utils/is';
 import { createElement } from '../dom/createElement';
-import { removeNode } from '../utils/dom';
+import { removeNode } from '../utils/dom/removeNode';
 import { POWER_NODE_ATTRIBUTE } from '../constants';
@@ -5,0 +5,0 @@ import { diff } from './diff';

src/diff/propsDiff.js

 import { isEqual } from '../utils/is';
 import { decorateElement } from '../dom/decorateElement';
-import { jsxProps } from '../vdom/jsxProps';
 
@@ -9,20 +8,13 @@ /**
  * @private
- * @param {Object}      oldObj
- * @param {Object}      newObj
+ * @param {Object}      prevProps
+ * @param {Object}      nextProps
  * @param {HTMLElement} element
  */
-export const propsDiff = (oldObj, newObj, element) => {
+export const propsDiff = (prevProps, nextProps, element) => {
   // prevent unneeded iterations
-  if (isEqual(oldObj, newObj)) {
+  if (isEqual(prevProps, nextProps)) {
     return;
   }
 
-  for (const key in oldObj) {
-    if (!newObj[key]) {
-      // removing attribute from element
-      element.removeAttribute(jsxProps[key] || key);
-    }
-  }
-
-  decorateElement(element, newObj);
+  decorateElement(element, nextProps, prevProps);
 };

src/dom/addEventListener.js

 /**
+ * Helpers proxy to handle binding/unbinding listeners
+ * @param  {Object} e Event object
+ * @return {Function} Event listener function
+ */
+export const proxyFn = function(e){
+  return this.$events[e.type](e);
+};
+
+/**
  * Assigns a callback function to the event type on the specificed element that
@@ -12,3 +21,9 @@ * will be called whenever the event is triggered
   // invoke the callback function in the context of the DOM element
-  element.addEventListener(eventType, (e) => handler.call(element, e, element));
+  element.addEventListener(eventType, proxyFn);
+
+  if(!element.$events){
+    element.$events = {};
+  }
+
+  element.$events[eventType] = handler;
 };

src/dom/decorateElement.js

@@ -11,11 +11,21 @@ import { addEventListener } from './addEventListener';
  * @param {HTMLElement} element
- * @param {Object}      elementProps
+ * @param {Object}      nextProps
+ * @param {object}      prevProps
  */
-export const decorateElement = (element, props) => {
-  for (const prop in props) {
-    if (prop === 'style') {
-      if (!isEqual(element.style, props.style)) {
-        updateElementStyles(element, props[prop]);
+export const decorateElement = (element, nextProps, prevProps) => {
+  if (prevProps) {
+    for (const prop in prevProps) {
+      if (!nextProps[prop]) {
+        if (isEvent(prop) && element.$events[prop]) {
+          element.removeEventListener(prop, element.$events[prop]);
+        } else {
+          element.removeAttribute(jsxProps[prop] || prop);
+        }
       }
+    }
+  }
 
+  for (const prop in nextProps) {
+    if (prop === 'style' && !isEqual(element.style, nextProps.style)) {
+      updateElementStyles(element, nextProps[prop]);
       continue;
@@ -25,3 +35,3 @@ }
     if (isEvent(prop)) {
-      addEventListener(element, prop, props[prop]);
+      addEventListener(element, prop, nextProps[prop]);
       continue;
@@ -31,4 +41,4 @@ }
     if (isElementAttribute(element, prop) || prop === 'key') {
-      if (!element[prop] || props[prop] !== element[prop]) {
-        element.setAttribute(jsxProps[prop] || prop, props[prop]);
+      if (!element[prop] || nextProps[prop] !== element[prop]) {
+        element.setAttribute(jsxProps[prop] || prop, nextProps[prop]);
       }
@@ -35,0 +45,0 @@ }

src/utils/is/isElementAttribute.js

@@ -1,3 +0,1 @@
-import { startsWith } from '../strings';
-
 /**
@@ -10,2 +8,2 @@ * Determines whether the passed object is a valid element attribute
  */
-export const isElementAttribute = (element, attribute) => attribute in element || attribute === 'class' || startsWith(attribute, 'data-') || startsWith(attribute, 'power-');
+export const isElementAttribute = (element, attribute) => attribute in element || attribute === 'class' || attribute.startsWith('data-') || attribute.startsWith('power-');

src/utils/is/isEvent.js

@@ -1,3 +0,1 @@
-import { startsWith } from '../strings';
-
 /**
@@ -9,2 +7,2 @@ * Determines whether the passed string is a valid event
  */
-export const isEvent = (event) => (startsWith(event, 'on') ? event.toLowerCase() : `on${event}`) in window;
+export const isEvent = (event) => (event.startsWith('on') ? event.toLowerCase() : `on${event}`) in window;

src/vdom/h.js

 import { VNode } from './vnode';
 
 /**
- * stack // TODO better description
+ * Array used to sanitize child nodes
  * @type {Array}
@@ -26,3 +26,3 @@ */
 
-    if (child.pop) {
+    if (child && child.pop) {
       for (let i = child.length; i--; ) {
@@ -41,3 +41,3 @@ stack[stack.length] = child[i];
       if (typeof child !== 'function') {
-        if (child === null) {
+        if (child === null || child === undefined) {
           child = '';
@@ -44,0 +44,0 @@ }

tests/utils/dom/removeNode.js

@@ -1,2 +0,2 @@
-import { removeNode } from '../../../src/utils/dom';
+import { removeNode } from '../../../src/utils/dom/removeNode';
 
@@ -3,0 +3,0 @@ describe('utils/dom', () => {

tests/utils/dom/replaceNode.js

@@ -1,2 +0,2 @@
-import { replaceNode } from '../../../src/utils/dom';
+import { replaceNode } from '../../../src/utils/dom/replaceNode';
 
@@ -3,0 +3,0 @@ describe('utils/dom', () => {

tests/utils/objects/extend.js

@@ -1,2 +0,2 @@
-import { extend } from '../../../src/utils/objects';
+import { extend } from '../../../src/utils/objects/extend';
 
@@ -3,0 +3,0 @@ describe('utils/objects', () => {

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

Worsened metrics

Total package byte prevSize

94574

decreased by-1.29%

Number of package files

68

decreased by-6.85%

Lines of code

2157

decreased by-1.15%

No dependency changes