Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
preact - npm Package Compare versions
Comparing version 1.3.2 to 1.4.0
| { | ||
| "name": "preact", | ||
| "version": "1.3.2", | ||
| "version": "1.4.0", | ||
| "description": "Tiny & fast Component-based virtual DOM framework.", | ||
@@ -5,0 +5,0 @@ "main": "preact.js", |
@@ -1,2 +0,2 @@ | ||
| !function(e,t){if("function"==typeof define&&define.amd)define(["exports"],t);else if("undefined"!=typeof exports)t(exports);else{var n={exports:{}};t(n.exports),e.preact=n.exports}}(this,function(e){"use strict";function t(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function n(e,t){var n=d(null,e),r=n._component;return r&&o(r,"componentWillMount"),t.appendChild(n),r&&o(r,"componentDidMount"),d}function r(e,t){for(var n=arguments.length,r=Array(n>2?n-2:0),a=2;n>a;a++)r[a-2]=arguments[a];var c=void 0,l=[],u=r.length,d=void 0,p=void 0;if(u){c=[];for(var f=0;u>f;f++){var h=r[f];if(null!==h&&void 0!==h){h.join?d=h:(d=l,d[0]=h);for(var v=0;v<d.length;v++){var m=d[v],g=s(m)&&!i(m);g&&(m=String(m)),g&&p?c[c.length-1]+=m:s(m)&&c.push(m),p=g}}}}t&&t.children&&delete t.children;var y=new z(e,t||void 0,c||void 0);return o(D,"vnode",y),y}function o(e,t){for(var n=e[t],r=arguments.length,o=Array(r>2?r-2:0),i=2;r>i;i++)o[i-2]=arguments[i];return n&&"function"==typeof n?n.apply(e,o):void 0}function i(e){return e&&e.__isVNode===!0}function s(e){return null!==e&&void 0!==e}function a(e,t){if(3===e.nodeType)return"string"==typeof t;var n=t.nodeName;return"function"==typeof n?e._componentConstructor===n:e.nodeName.toLowerCase()===n}function c(e,t){var n=e&&e._component;if(n&&e._componentConstructor===t.nodeName){var r=b(t);return n.setProps(r,P),e}return n&&u(e,n),l(t)}function l(e){var t=M.create(e.nodeName),n=b(e);t.setProps(n,w),t._render(O);var r=t.base;return r._component=t,r._componentConstructor=e.nodeName,r}function u(e,t){delete e._component,o(t,"componentWillUnmount");var n=t.base;n&&n.parentNode&&n.parentNode.removeChild(n),o(t,"componentDidUnmount"),M.collect(t)}function d(e,t,n){var r=e,i=t.nodeName;if("function"==typeof i)return c(e,t);if("string"==typeof t){if(e){if(3===e.nodeType)return e.textContent=t,e;1===e.nodeType&&E.collect(e)}return document.createTextNode(t)}(null===i||void 0===i)&&(i="x-undefined-element"),e?e.nodeName.toLowerCase()!==i?(r=E.create(i),p(r,R.call(e.childNodes)),1===e.nodeType&&E.collect(e)):e._component&&e._component!==n&&u(e,e._component):r=E.create(i);var s=g(r)||C,l=t.attributes||C;if(s!==C)for(var v in s)if(s.hasOwnProperty(v)){var m=l[v];(void 0===m||null===m||m===!1)&&h(r,v,null,s[v])}if(l!==C)for(var y in l)if(l.hasOwnProperty(y)){var b=l[y];if(void 0!==b&&null!==b&&b!==!1){var _=f(r,y,s[y]);b!==_&&h(r,y,b,_)}}for(var N=R.call(r.childNodes),x={},w=N.length;w--;){var P=N[w].nodeType,O=void 0;if(3===P)O=P.key;else{if(1!==P)continue;O=N[w].getAttribute("key")}O&&(x[O]=N.splice(w,1)[0])}var T=[];if(t.children)for(var w=0,U=t.children.length;U>w;w++){var k=t.children[w],A=k.attributes,O=void 0,D=void 0;if(A&&(O=A.key,D=O&&x[O]),!D){var W=N.length;if(N.length)for(var z=0;W>z;z++)if(a(N[z],k)){D=N.splice(z,1)[0];break}}T.push(d(D,k))}for(var w=0,W=T.length;W>w;w++)if(r.childNodes[w]!==T[w]){var D=T[w],L=D._component,S=r.childNodes[w+1];L&&o(L,"componentWillMount"),S?r.insertBefore(D,S):r.appendChild(D),L&&o(L,"componentDidMount")}for(var w=0,W=N.length;W>w;w++){var D=N[w],L=D._component;L&&o(L,"componentWillUnmount"),D.parentNode.removeChild(D),L?(o(L,"componentDidUnmount"),M.collect(L)):1===D.nodeType&&E.collect(D)}return r}function p(e,t){var n=t.length;if(2>=n)return e.appendChild(t[0]),void(2===n&&e.appendChild(t[1]));for(var r=document.createDocumentFragment(),o=0;n>o;o++)r.appendChild(t[o]);e.appendChild(r)}function f(e,t,n){return"class"===t?e.className:"style"===t?e.style.cssText:n}function h(e,t,n,r){"class"===t?e.className=n:"style"===t?e.style.cssText=n:v(e,t,n,r)}function v(e,t,n,r){if("on"===t.substring(0,2)){var o=t.substring(2).toLowerCase(),i=e._listeners||(e._listeners={});return i[o]||e.addEventListener(o,m),void(i[o]=n)}var s=typeof n;null===n?e.removeAttribute(t):"function"!==s&&"object"!==s&&e.setAttribute(t,n)}function m(e){var t=this._listeners,n=t[F(e.type)];return n?n.call(this,o(D,"event",e)||e):void 0}function g(e){var t=e.attributes;return t&&t.getNamedItem?t.length?y(t):void 0:t}function y(e){for(var t={},n=e.length;n--;){var r=e[n];t[r.name]=r.value}return t}function b(e){var t=x({},e.attributes);return e.children&&(t.children=e.children),e.text&&(t._content=e.text),t}function _(e){var t="",n=": ",r="; ";for(var o in e)if(e.hasOwnProperty(o)){var i=e[o];t+=I(o),t+=n,t+=i,"number"!=typeof i||U.hasOwnProperty(o)||(t+="px"),t+=r}return t}function N(e){var t="";for(var n in e)e[n]&&(t&&(t+=" "),t+=n);return t}function x(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n]);return e}e.render=n,e.h=r;var C={},w={render:!1},P={renderSync:!0},O={build:!0},T="",U={};"boxFlex boxFlexGroup columnCount fillOpacity flex flexGrow flexPositive flexShrink flexNegative fontWeight lineClamp lineHeight opacity order orphans strokeOpacity widows zIndex zoom".split(" ").forEach(function(e){return U[e]=!0});var R=Array.prototype.slice,k=function(e){var t=arguments.length<=1||void 0===arguments[1]?{}:arguments[1];return function(n){return t.hasOwnProperty(n)?t[n]:t[n]=e(n)}},A={syncComponentUpdates:!0},D={};D.vnode=function(e){var t=e.attributes;if(t){var n=t.style;n&&!n.substring&&(t.style=_(n));var r=t["class"];t.hasOwnProperty("className")&&(r=t["class"]=t.className,delete t.className),r&&!r.substring&&(t["class"]=N(r))}};var W=function(){function e(){t(this,e),this._dirty=this._disableRendering=!1,this.nextProps=this.base=null,this.props=o(this,"getDefaultProps")||{},this.state=o(this,"getInitialState")||{},o(this,"initialize")}return e.prototype.shouldComponentUpdate=function(e,t){return!0},e.prototype.setState=function(e){x(this.state,e),this.triggerRender()},e.prototype.setProps=function(e){var t=arguments.length<=1||void 0===arguments[1]?C:arguments[1],n=this._disableRendering===!0;this._disableRendering=!0,o(this,"componentWillReceiveProps",e,this.props),this.nextProps=e,this._disableRendering=n,t.renderSync===!0&&A.syncComponentUpdates===!0?this._render():t.render!==!1&&this.triggerRender()},e.prototype.triggerRender=function(){this._dirty!==!0&&(this._dirty=!0,L.add(this))},e.prototype.render=function(e,t){return r("div",{component:this.constructor.name},e.children)},e.prototype._render=function(){var e=arguments.length<=0||void 0===arguments[0]?C:arguments[0];if(this._disableRendering!==!0){if(this._dirty=!1,this.base&&o(this,"shouldComponentUpdate",this.props,this.state)===!1)return void(this.props=this.nextProps);this.props=this.nextProps,o(this,"componentWillUpdate");var t=o(this,"render",this.props,this.state);if(this.base||e.build===!0){var n=d(this.base,t||T,this);if(this.base&&n!==this.base){var r=this.base.parentNode;r&&r.replaceChild(n,this.base)}this.base=n}o(this,"componentDidUpdate")}},e}();e.Component=W;var z=function V(e,n,r){t(this,V),this.nodeName=e,this.attributes=n,this.children=r};e.VNode=z,z.prototype.__isVNode=!0;var L={items:[],itemsOffline:[],pending:!1,add:function(e){if(1===L.items.push(e)){var t=D.debounceRendering;t?t(L.process):setTimeout(L.process,0)}},process:function(){var e=L.items,t=e.length;if(t)for(L.items=L.itemsOffline,L.items.length=0,L.itemsOffline=e;t--;)e[t]._dirty&&e[t]._render()}},S=L.process,E={nodes:{},collect:function(e){E.clean(e);var t=E.normalizeName(e.nodeName),n=E.nodes[t];n?n.push(e):E.nodes[t]=[e]},create:function(e){var t=E.normalizeName(e),n=E.nodes[t];return n&&n.pop()||document.createElement(e)},clean:function(e){e.remove();var t=e.attributes&&e.attributes.length;if(t)for(var n=t;n--;)e.removeAttribute(e.attributes[n].name)},normalizeName:k(function(e){return e.toUpperCase()})},M={components:{},collect:function(e){var t=e.constructor.name,n=M.components[t]||(M.components[t]=[]);n.push(e)},create:function(e){var t=e.name,n=M.components[t];return n&&n.length?n.splice(0,1)[0]:new e}},F=k(function(e){return e.toLowerCase()}),I=k(function(e){return e.replace(/([A-Z])/,"-$1").toLowerCase()});e.options=A,e.hooks=D,e.rerender=S,e["default"]={options:A,hooks:D,render:n,rerender:S,h:r,Component:W}}); | ||
| !function(e,t){if("function"==typeof define&&define.amd)define(["exports"],t);else if("undefined"!=typeof exports)t(exports);else{var n={exports:{}};t(n.exports),e.preact=n.exports}}(this,function(e){"use strict";function t(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function n(e,t){var n=d(null,e),r=n._component;return r&&o(r,"componentWillMount"),t.appendChild(n),r&&o(r,"componentDidMount"),d}function r(e,t){for(var n=arguments.length,r=Array(n>2?n-2:0),a=2;n>a;a++)r[a-2]=arguments[a];var c=void 0,l=[],u=r.length,d=void 0,p=void 0;if(u){c=[];for(var f=0;u>f;f++){var h=r[f];if(!s(h)){h.join?d=h:(d=l,d[0]=h);for(var v=0;v<d.length;v++){var m=d[v],g=!s(m)&&!i(m);g&&(m=String(m)),g&&p?c[c.length-1]+=m:s(m)||c.push(m),p=g}}}}t&&t.children&&delete t.children;var y=new M(e,t||void 0,c||void 0);return o(z,"vnode",y),y}function o(e,t){for(var n=e[t],r=arguments.length,o=Array(r>2?r-2:0),i=2;r>i;i++)o[i-2]=arguments[i];return n&&"function"==typeof n?n.apply(e,o):void 0}function i(e){return e&&e.__isVNode===!0}function s(e){return null===e||void 0===e}function a(e,t){if(3===e.nodeType)return"string"==typeof t;var n=t.nodeName;return"function"==typeof n?e._componentConstructor===n:e.nodeName.toLowerCase()===n}function c(e,t){var n=e&&e._component;if(n&&e._componentConstructor===t.nodeName){var r=_(t);return n.setProps(r,T),e}return n&&u(e,n),l(t)}function l(e){var t=I.create(e.nodeName),n=_(e);t.setProps(n,w),t._render(U);var r=t.base;return r._component=t,r._componentConstructor=e.nodeName,r}function u(e,t){delete e._component,o(t,"componentWillUnmount");var n=t.base;n&&n.parentNode&&n.parentNode.removeChild(n),o(t,"componentDidUnmount"),I.collect(t)}function d(e,t,n){var r=e,i=t.nodeName;if("function"==typeof i)return c(e,t);if("string"==typeof t){if(e){if(3===e.nodeType)return e.textContent=t,e;1===e.nodeType&&F.collect(e)}return document.createTextNode(t)}(null===i||void 0===i)&&(i="x-undefined-element"),e?e.nodeName.toLowerCase()!==i?(r=F.create(i),f(r,S.call(e.childNodes)),1===e.nodeType&&F.collect(e)):e._component&&e._component!==n&&u(e,e._component):r=F.create(i);var s=y(r)||k,l=t.attributes||k;if(s!==k)for(var p in s)if(A.call(s,p)){var m=l[p];(void 0===m||null===m||m===!1)&&v(r,p,null,s[p])}if(l!==k)for(var g in l)if(A.call(l,g)){var b=l[g];if(void 0!==b&&null!==b&&b!==!1){var _=h(r,g,s[g]);b!==_&&v(r,g,b,_)}}for(var N=S.call(r.childNodes),x={},C=N.length;C--;){var w=N[C].nodeType,T=void 0;if(3===w)T=w.key;else{if(1!==w)continue;T=N[C].getAttribute("key")}T&&(x[T]=N.splice(C,1)[0])}var U=[];if(t.children)for(var C=0,P=t.children.length;P>C;C++){var R=t.children[C],D=R.attributes,T=void 0,O=void 0;if(D&&(T=D.key,O=T&&x[T]),!O){var W=N.length;if(N.length)for(var z=0;W>z;z++)if(a(N[z],R)){O=N.splice(z,1)[0];break}}U.push(d(O,R))}for(var C=0,W=U.length;W>C;C++)if(r.childNodes[C]!==U[C]){var O=U[C],L=O._component,M=r.childNodes[C+1];L&&o(L,"componentWillMount"),M?r.insertBefore(O,M):r.appendChild(O),L&&o(L,"componentDidMount")}for(var C=0,W=N.length;W>C;C++){var O=N[C],L=O._component;L&&o(L,"componentWillUnmount"),O.parentNode.removeChild(O),L?(o(L,"componentDidUnmount"),I.collect(L)):1===O.nodeType&&F.collect(O)}return r}function p(e,t,n){var r=t.split("."),o=r[0];return function(t){var i,a=this,c=e.state,l=void 0,u=void 0;for("string"==typeof n?(l=O(t,n),s(l)&&(a=a._component)&&(l=O(a,n))):l=(a.nodeName+a.type).match(/^input(checkbox|radio)$/i)?a.checked:a.value,"function"==typeof l&&(l=l.call(a)),u=0;u<r.length-1;u++)c=c[r[u]]||{};c[r[u]]=l,e.setState((i={},i[o]=e.state[o],i))}}function f(e,t){var n=t.length;if(2>=n)return e.appendChild(t[0]),void(2===n&&e.appendChild(t[1]));for(var r=document.createDocumentFragment(),o=0;n>o;o++)r.appendChild(t[o]);e.appendChild(r)}function h(e,t,n){return"class"===t?e.className:"style"===t?e.style.cssText:n}function v(e,t,n,r){"class"===t?e.className=n:"style"===t?e.style.cssText=n:m(e,t,n,r)}function m(e,t,n,r){if("on"===t.substring(0,2)){var o=V(t),i=e._listeners||(e._listeners={});return i[o]||e.addEventListener(o,g),void(i[o]=n)}var s=typeof n;null===n?e.removeAttribute(t):"function"!==s&&"object"!==s&&e.setAttribute(t,n)}function g(e){var t=this._listeners,n=t[V(e.type)];return n?n.call(this,o(z,"event",e)||e):void 0}function y(e){var t=e.attributes;return t&&t.getNamedItem?t.length?b(t):void 0:t}function b(e){for(var t={},n=e.length;n--;){var r=e[n];t[r.name]=r.value}return t}function _(e){var t=C({},e.attributes);return e.children&&(t.children=e.children),e.text&&(t._content=e.text),t}function N(e){var t="",n=": ",r="; ";for(var o in e)if(A.call(e,o)){var i=e[o];t+=G(o),t+=n,t+=i,"number"!=typeof i||A.call(R,o)||(t+="px"),t+=r}return t}function x(e){var t="";for(var n in e)e[n]&&(t&&(t+=" "),t+=n);return t}function C(e,t){for(var n in t)A.call(t,n)&&(e[n]=t[n]);return e}e.render=n,e.h=r;var k={},w={render:!1},T={renderSync:!0},U={build:!0},P="",R="boxFlex boxFlexGroup columnCount fillOpacity flex flexGrow flexPositive flexShrink flexNegative fontWeight lineClamp lineHeight opacity order orphans strokeOpacity widows zIndex zoom".split(" ").reduce(function(e,t){return e[t]=!0,e},{}),S=Array.prototype.slice,A=Object.prototype.hasOwnProperty,D=function(e){var t=arguments.length<=1||void 0===arguments[1]?{}:arguments[1];return function(n){return A.call(t,n)?t[n]:t[n]=e(n)}},O=function(e,t){return t.split(".").reduce(function(e,t){return e&&e[t]},e)},W={syncComponentUpdates:!0},z={};z.vnode=function(e){var t=e.attributes;if(t){var n=t.style;n&&!n.substring&&(t.style=N(n));var r=t["class"];A.call(t,"className")&&(r=t["class"]=t.className,delete t.className),r&&!r.substring&&(t["class"]=x(r))}};var L=function(){function e(){t(this,e),this._dirty=this._disableRendering=!1,this._linkedStates={},this.nextProps=this.base=null,this.props=o(this,"getDefaultProps")||{},this.state=o(this,"getInitialState")||{},o(this,"initialize")}return e.prototype.shouldComponentUpdate=function(e,t){return!0},e.prototype.linkState=function(e,t){var n=this._linkedStates,r=e+"|"+(t||"");return n[r]||(n[r]=p(this,e,t))},e.prototype.setState=function(e){C(this.state,e),this.triggerRender()},e.prototype.setProps=function(e){var t=arguments.length<=1||void 0===arguments[1]?k:arguments[1],n=this._disableRendering;this._disableRendering=!0,o(this,"componentWillReceiveProps",e,this.props),this.nextProps=e,this._disableRendering=n,t.renderSync&&W.syncComponentUpdates?this._render():t.render!==!1&&this.triggerRender()},e.prototype.triggerRender=function(){this._dirty||(this._dirty=!0,j.add(this))},e.prototype.render=function(e){return r("div",null,e.children)},e.prototype._render=function(e){if(!this._disableRendering){this._dirty=!1;var t=this.nextProps,n=this.state;if(this.base){if(o(this,"shouldComponentUpdate",t,n)===!1)return void(this.props=t);o(this,"componentWillUpdate",t,n)}this.props=t;var r=o(this,"render",t,n);if(this.base||e&&e.build){var i=d(this.base,r||P,this);if(this.base&&i!==this.base){var s=this.base.parentNode;s&&s.replaceChild(i,this.base)}this.base=i,o(this,"componentDidUpdate",t,n)}return r}},e}();e.Component=L;var M=function $(e,n,r){t(this,$),this.nodeName=e,this.attributes=n,this.children=r};e.VNode=M,M.prototype.__isVNode=!0;var j={items:[],itemsOffline:[],add:function(e){if(1===j.items.push(e)){var t=z.debounceRendering;t?t(j.process):setTimeout(j.process,0)}},process:function(){var e=j.items,t=e.length;if(t)for(j.items=j.itemsOffline,j.items.length=0,j.itemsOffline=e;t--;)e[t]._dirty&&e[t]._render()}},E=j.process,F={nodes:{},collect:function(e){F.clean(e);var t=F.normalizeName(e.nodeName),n=F.nodes[t];n?n.push(e):F.nodes[t]=[e]},create:function(e){var t=F.normalizeName(e),n=F.nodes[t];return n&&n.pop()||document.createElement(e)},clean:function(e){e.remove();var t=e.attributes&&e.attributes.length;if(t)for(var n=t;n--;)e.removeAttribute(e.attributes[n].name)},normalizeName:D(function(e){return e.toUpperCase()})},I={components:{},collect:function(e){var t=e.constructor.name,n=I.components[t];n?n.push(e):I.components[t]=[e]},create:function(e){var t=I.components[e.name];if(t&&t.length)for(var n=t.length;n--;)if(t[n].constructor===e)return t.splice(n,1)[0];return new e}},V=D(function(e){return e.replace(/^on/i,"").toLowerCase()}),G=D(function(e){return e.replace(/([A-Z])/,"-$1").toLowerCase()});e.options=W,e.hooks=z,e.rerender=E,e["default"]={options:W,hooks:z,render:n,rerender:E,h:r,Component:L}}); | ||
| //# sourceMappingURL=preact.js.map |
@@ -16,2 +16,11 @@ # Preact | ||
| ## Demos | ||
| - [Flickr Browser](http://codepen.io/developit/full/vNKJZq/) (@ CodePen) | ||
| - [Animating Text](http://codepen.io/developit/full/LpNOdm/) (@ CodePen) | ||
| - [60FPS Rainbow Spiral](http://codepen.io/developit/full/xGoagz/) (@ CodePen) | ||
| - [Simple Clock](http://jsfiddle.net/developit/u9m5x0L7/embedded/result,js/) (@ JSFiddle) | ||
| - [Create your Own!](https://jsfiddle.net/developit/rs6zrh5f/embedded/result/) (@ JSFiddle) | ||
| ## Getting Started | ||
@@ -155,3 +164,3 @@ | ||
| Now we have a ticking clock! | ||
| Now we have [a ticking clock](http://jsfiddle.net/developit/u9m5x0L7/embedded/result,js/)! | ||
@@ -158,0 +167,0 @@ |
@@ -6,12 +6,14 @@ const EMPTY = {}; | ||
| const EMPTY_BASE = ''; | ||
| const NON_DIMENSION_PROPS = {}; | ||
| const NON_DIMENSION_PROPS = 'boxFlex boxFlexGroup columnCount fillOpacity flex flexGrow flexPositive flexShrink flexNegative fontWeight lineClamp lineHeight opacity order orphans strokeOpacity widows zIndex zoom'.split(' ').reduce( (a,k) => (a[k]=true, a), {}); | ||
| 'boxFlex boxFlexGroup columnCount fillOpacity flex flexGrow flexPositive flexShrink flexNegative fontWeight lineClamp lineHeight opacity order orphans strokeOpacity widows zIndex zoom'.split(' ').forEach(k => NON_DIMENSION_PROPS[k] = true); | ||
| /** @private */ | ||
| let slice = Array.prototype.slice; | ||
| let hop = Object.prototype.hasOwnProperty; | ||
| /** @private */ | ||
| let memoize = (fn, mem={}) => k => mem.hasOwnProperty(k) ? mem[k] : (mem[k] = fn(k)); | ||
| let memoize = (fn, mem={}) => k => hop.call(mem, k) ? mem[k] : (mem[k] = fn(k)); | ||
| let delve = (obj, key) => key.split('.').reduce( (r,k) => (r && r[k]), obj); | ||
| /** @public @object Global options */ | ||
@@ -48,3 +50,3 @@ let options = { | ||
| let c = attributes['class']; | ||
| if (attributes.hasOwnProperty('className')) { | ||
| if (hop.call(attributes, 'className')) { | ||
| c = attributes['class'] = attributes.className; | ||
@@ -64,2 +66,4 @@ delete attributes.className; | ||
| this._dirty = this._disableRendering = false; | ||
| /** @private */ | ||
| this._linkedStates = {}; | ||
| /** @public */ | ||
@@ -71,2 +75,3 @@ this.nextProps = this.base = null; | ||
| this.state = hook(this, 'getInitialState') || {}; | ||
| // @TODO remove me? | ||
| hook(this, 'initialize'); | ||
@@ -83,2 +88,27 @@ } | ||
| /** Returns a function that sets a state property when called. | ||
| * Calling linkState() repeatedly with the same arguments returns a cached link function. | ||
| * | ||
| * Provides some built-in special cases: | ||
| * - Checkboxes and radio buttons link their boolean `checked` value | ||
| * - Inputs automatically link their `value` property | ||
| * - Event paths fall back to any associated Component if not found on an element | ||
| * - If linked value is a function, will invoke it and use the result | ||
| * | ||
| * @param {string} key The path to set - can be a dot-notated deep key | ||
| * @param {string} [eventPath] If set, attempts to find the new state value at a given dot-notated path within the object passed to the linkedState setter. | ||
| * @returns {function} linkStateSetter(e) | ||
| * | ||
| * @example Update a "text" state value when an input changes: | ||
| * <input onChange={ this.linkState('text') } /> | ||
| * | ||
| * @example Set a deep state value on click | ||
| * <button onClick={ this.linkState('touch.coords', 'touches.0') }>Tap</button | ||
| */ | ||
| linkState(key, eventPath) { | ||
| let c = this._linkedStates, | ||
| cacheKey = key + '|' + (eventPath || ''); | ||
| return c[cacheKey] || (c[cacheKey] = createLinkedState(this, key, eventPath)); | ||
| } | ||
| /** Update component state by copying values from `state` to `this.state`. | ||
@@ -99,3 +129,3 @@ * @param {object} state | ||
| setProps(props, opts=EMPTY) { | ||
| let d = this._disableRendering===true; | ||
| let d = this._disableRendering; | ||
| this._disableRendering = true; | ||
@@ -105,3 +135,3 @@ hook(this, 'componentWillReceiveProps', props, this.props); | ||
| this._disableRendering = d; | ||
| if (opts.renderSync===true && options.syncComponentUpdates===true) { | ||
| if (opts.renderSync && options.syncComponentUpdates) { | ||
| this._render(); | ||
@@ -116,3 +146,3 @@ } | ||
| triggerRender() { | ||
| if (this._dirty!==true) { | ||
| if (!this._dirty) { | ||
| this._dirty = true; | ||
@@ -125,27 +155,35 @@ renderQueue.add(this); | ||
| * Virtual DOM is generally constructed via [JSX](http://jasonformat.com/wtf-is-jsx). | ||
| * @param {object} props Props (eg: JSX attributes) received from parent element/component | ||
| * @param {object} state The component's current state | ||
| * @returns VNode | ||
| */ | ||
| render(props, state) { | ||
| return h('div', { component:this.constructor.name }, props.children); | ||
| render(props) { | ||
| return h('div', null, props.children); | ||
| } | ||
| /** @private */ | ||
| _render(opts=EMPTY) { | ||
| if (this._disableRendering===true) return; | ||
| _render(opts) { | ||
| if (this._disableRendering) return; | ||
| this._dirty = false; | ||
| if (this.base && hook(this, 'shouldComponentUpdate', this.props, this.state)===false) { | ||
| this.props = this.nextProps; | ||
| return; | ||
| let p = this.nextProps, | ||
| s = this.state; | ||
| if (this.base) { | ||
| if (hook(this, 'shouldComponentUpdate', p, s)===false) { | ||
| this.props = p; | ||
| return; | ||
| } | ||
| hook(this, 'componentWillUpdate', p, s); | ||
| } | ||
| this.props = this.nextProps; | ||
| this.props = p; | ||
| hook(this, 'componentWillUpdate'); | ||
| let rendered = hook(this, 'render', p, s); | ||
| let rendered = hook(this, 'render', this.props, this.state); | ||
| if (this.base || (opts && opts.build)) { | ||
| let base = build(this.base, rendered || EMPTY_BASE, this); | ||
| if (this.base || opts.build===true) { | ||
| let base = build(this.base, rendered || EMPTY_BASE, this); | ||
| if (this.base && base!==this.base) { | ||
@@ -156,5 +194,7 @@ let p = this.base.parentNode; | ||
| this.base = base; | ||
| hook(this, 'componentDidUpdate', p, s); | ||
| } | ||
| hook(this, 'componentDidUpdate'); | ||
| return rendered; | ||
| } | ||
@@ -181,4 +221,4 @@ } | ||
| let p = args[i]; | ||
| if (p===null || p===undefined) continue; | ||
| if (p.join) { // Array.isArray(args[i]) | ||
| if (empty(p)) continue; | ||
| if (p.join) { | ||
| arr = p; | ||
@@ -192,3 +232,3 @@ } | ||
| let child = arr[j], | ||
| simple = notEmpty(child) && !isVNode(child); | ||
| simple = !empty(child) && !isVNode(child); | ||
| if (simple) child = String(child); | ||
@@ -198,3 +238,3 @@ if (simple && lastSimple) { | ||
| } | ||
| else if (notEmpty(child)) { | ||
| else if (!empty(child)) { | ||
| children.push(child); | ||
@@ -247,4 +287,4 @@ } | ||
| /** @private Check if a value is `null` or `undefined`. */ | ||
| function notEmpty(x) { | ||
| return x!==null && x!==undefined; | ||
| function empty(x) { | ||
| return x===null || x===undefined; | ||
| } | ||
@@ -357,3 +397,3 @@ | ||
| for (let name in old) { | ||
| if (old.hasOwnProperty(name)) { | ||
| if (hop.call(old, name)) { | ||
| let o = attrs[name]; | ||
@@ -370,3 +410,3 @@ if (o===undefined || o===null || o===false) { | ||
| for (let name in attrs) { | ||
| if (attrs.hasOwnProperty(name)) { | ||
| if (hop.call(attrs, name)) { | ||
| let value = attrs[name]; | ||
@@ -467,2 +507,30 @@ if (value!==undefined && value!==null && value!==false) { | ||
| /** @private */ | ||
| function createLinkedState(component, key, eventPath) { | ||
| let path = key.split('.'), | ||
| p0 = path[0]; | ||
| return function(e) { | ||
| let t = this, | ||
| obj = component.state, | ||
| v, i; | ||
| if (typeof eventPath==='string') { | ||
| v = delve(e, eventPath); | ||
| if (empty(v) && (t=t._component)) { | ||
| v = delve(t, eventPath); | ||
| } | ||
| } | ||
| else { | ||
| v = (t.nodeName+t.type).match(/^input(checkbox|radio)$/i) ? t.checked : t.value; | ||
| } | ||
| if (typeof v==='function') v = v.call(t); | ||
| for (i=0; i<path.length-1; i++) { | ||
| obj = obj[path[i]] || {}; | ||
| } | ||
| obj[path[i]] = v; | ||
| component.setState({ [p0]: component.state[p0] }); | ||
| }; | ||
| } | ||
| /** @private Managed re-rendering queue for dirty components. */ | ||
@@ -472,3 +540,2 @@ let renderQueue = { | ||
| itemsOffline: [], | ||
| pending: false, | ||
| add(component) { | ||
@@ -535,11 +602,15 @@ if (renderQueue.items.push(component)!==1) return; | ||
| collect(component) { | ||
| let name = component.constructor.name; | ||
| let list = componentRecycler.components[name] || (componentRecycler.components[name] = []); | ||
| list.push(component); | ||
| let name = component.constructor.name, | ||
| list = componentRecycler.components[name]; | ||
| if (list) list.push(component); | ||
| else componentRecycler.components[name] = [component]; | ||
| }, | ||
| create(ctor) { | ||
| let name = ctor.name, | ||
| list = componentRecycler.components[name]; | ||
| let list = componentRecycler.components[ctor.name]; | ||
| if (list && list.length) { | ||
| return list.splice(0, 1)[0]; | ||
| for (let i=list.length; i--; ) { | ||
| if (list[i].constructor===ctor) { | ||
| return list.splice(i, 1)[0]; | ||
| } | ||
| } | ||
| } | ||
@@ -595,3 +666,3 @@ return new ctor(); | ||
| if (name.substring(0,2)==='on') { | ||
| let type = name.substring(2).toLowerCase(), | ||
| let type = normalizeEventName(name), | ||
| l = node._listeners || (node._listeners = {}); | ||
@@ -617,8 +688,7 @@ if (!l[type]) node.addEventListener(type, eventProxy); | ||
| let l = this._listeners, | ||
| fn = l[normalizeEventType(e.type)]; | ||
| fn = l[normalizeEventName(e.type)]; | ||
| if (fn) return fn.call(this, hook(hooks, 'event', e) || e); | ||
| } | ||
| /** @private @function Normalize an event type/name to lowercase */ | ||
| let normalizeEventType = memoize(type => type.toLowerCase()); | ||
| let normalizeEventName = memoize(t => t.replace(/^on/i,'').toLowerCase()); | ||
@@ -665,3 +735,3 @@ | ||
| for (let prop in s) { | ||
| if (s.hasOwnProperty(prop)) { | ||
| if (hop.call(s, prop)) { | ||
| let val = s[prop]; | ||
@@ -671,3 +741,3 @@ str += jsToCss(prop); | ||
| str += val; | ||
| if (typeof val==='number' && !NON_DIMENSION_PROPS.hasOwnProperty(prop)) { | ||
| if (typeof val==='number' && !hop.call(NON_DIMENSION_PROPS, prop)) { | ||
| str += 'px'; | ||
@@ -701,3 +771,3 @@ } | ||
| function extend(obj, props) { | ||
| for (let i in props) if (props.hasOwnProperty(i)) { | ||
| for (let i in props) if (hop.call(props, i)) { | ||
| obj[i] = props[i]; | ||
@@ -704,0 +774,0 @@ } |
@@ -8,3 +8,3 @@ import { expect } from 'chai'; | ||
| describe('h()', () => { | ||
| describe('h(jsx)', () => { | ||
| it('should return a VNode', () => { | ||
@@ -11,0 +11,0 @@ var r; |
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis 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
LicenseThis 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
- increased by8.59%
103851
- Lines of code
- increased by7.22%
951
- Number of lines in readme file
- increased by3.64%
256
No dependency changes