Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
literaljs - npm Package Compare versions
Comparing version 2.3.1 to 2.3.2
@@ -1,2 +0,2 @@ | ||
| var e={},t=[],n=[],r=function(e,n){window.addEventListener("__LITERAL_UPDATE__",function(){var r=t.pop();o(e,n,{oldState:r.oldState,newState:r.newState})})},i=function(){var e=function(){for(var e;e=n.pop();)e()};e(),window.addEventListener("__LITERAL_LIFECYCLE__",e)},o=function(e,t,n){var r=d(t(),n.oldState),i=d(t(),n.newState);return f(e,i,r)},d=function(e,t){if((e="function"==typeof e?e(t):e).children)for(var n=0;n<e.children.length;n++)e.children[n]=d(e.children[n],t);return e},a=function(e,t){void 0===t&&(t={});var n=t.mount;void 0===n&&(n=!0);var r=t.initial;void 0===r&&(r=!1);var i=typeof e;if("object"!==i&&"boolean"!==i)return document.createTextNode(e);for(var o=document.createElement(e.element),d=0,c=Object.entries(e);d<c.length;d+=1){var v=c[d],l=v[0],f=v[1];if("text"===l&&o.appendChild(document.createTextNode(f)),"events"===l&&u(f,o,n,r),["children","element","text","events"].includes(l)||o.setAttribute(l,f),"children"===l)for(var s=0;s<f.length;s++)o.appendChild(a(f[s],{mount:n,initial:r}))}return o},u=function(e,t,n,r){var i=["mounted","unmounted","updated"];if(Array.isArray(e))for(var o=0;o<e.length;o++)i.includes(e[o].type)||t.addEventListener(e[o].type,e[o].action),c(e[o],n,r);else i.includes(e.type)||t.addEventListener(e.type,e.action),c(e,n,r)},c=function(e,t,r){if(r){var i=function(e){return n.push(e)};t&&"mounted"===e.type&&i(e.action),t||"updated"!==e.type||i(e.action),l()}},v=function(e,t){if(e.events){if(Array.isArray(e.events))for(var r=0;r<e.events.length;r++)e.events[r].type===t&&n.push(e.events[r].action);else e.events.type===t&&n.push(e.events.action);l()}},l=function(){var e=new Event("__LITERAL_LIFECYCLE__");return window.dispatchEvent(e)},f=function(e,t,n,r){if(void 0===r&&(r=0),e){var i=e.childNodes[r];if(!n&&t)!1===n?(v(t,"mounted"),e.insertBefore(a(t),i)):void 0===n?(v(t,"mounted"),e.appendChild(a(t))):0===n&&y(e,i,t);else if(!t&&n)v(n,"unmounted"),e.removeChild(i);else if(t&&(m(i,t,n),p(e,i,t,n),t.children||n.children))for(var o=s(t.children,n.children),d=o.newChildren,u=o.oldChildren,c=0;c<h(d,u);c++)f(i,d[c],u[c],c)}},s=function(e,t){for(var n=[],r=[],i=0;i<h(e,t);i++)!1===e[i]&&!1===t[i]||(n.push(e[i]),r.push(t[i]));return{newChildren:n,oldChildren:r}},h=function(e,t){var n=e.length,r=t.length;return n>=r?n:r},p=function(e,t,n,r){"object"==typeof n&&"object"==typeof r||n!==r&&y(e,t,n);for(var i=0,o=Object.entries(n);i<o.length;i+=1){var d=o[i],a=d[0],u=d[1],c=r[a];if("element"===a||"text"===a)u!==c&&y(e,t,n);else if(!(["children","events","element","text"].includes(a)||c&&u===c))return v(n,"updated"),t.setAttribute(name,value)}},m=function(e,t,n){for(var r=0,i=Object.entries(n);r<i.length;r+=1){var o=i[r],d=o[1];t[o[0]]||(v(t,"updated"),e.removeAttribute(d))}},y=function(e,t,n){v(n,"mounted"),e.replaceChild(a(n,{mount:!1}),t)};module.exports={component:function(n){void 0===n&&(n={});var r=n.methods;void 0===r&&(r=function(){});var i=n.render;return void 0===i&&(i=function(){}),function(n){return void 0===n&&(n={}),function(o){var d=function(t){return void 0===t&&(t=e),Object.assign({},t)},a=function(n){var r=d(),i={oldState:r,nextState:Object.assign({},r,n)};e=i.nextState,t.push(i);var o=new Event("__LITERAL_UPDATE__");return window.dispatchEvent(o)};return i({state:d(o),getState:d,setState:a,props:n,methods:r({getState:d,setState:a})})}}},render:function(t,n,o){void 0===o&&(o={});var u=document.getElementById(n);!function(t){e=Object.assign({},e,t)}(o),r(u,t);var c=d(t(),e),v=a(c,{initial:!0});u.appendChild(v),i()},h:function(e,t){for(var n=[],r=arguments.length-2;r-- >0;)n[r]=arguments[r+2];var i=function(e,t){t=void 0===t?[]:t;for(var n=0;n<e.length;n++)Array.isArray(e[n])?i(e[n],t):t.push(e[n]);return t};return"function"==typeof e?e:Object.assign({},{element:e},t,{children:i(n,[])})}}; | ||
| var e={},t=[],n=[],r=function(e,t){t=void 0===t?[]:t;for(var n=0;n<e.length;n++)Array.isArray(e[n])?r(e[n],t):t.push(e[n]);return t},i=function(e,n){return window.addEventListener("__LITERAL_UPDATE__",function(){return setTimeout(function(){var r=t.pop();return d(e,n,{oldState:r.oldState,newState:r.newState})})})},o=function(){var e=function(){return setTimeout(function(){for(var e;e=n.pop();)e()})};e(),window.addEventListener("__LITERAL_LIFECYCLE__",e)},d=function(e,t,n){var r=u(t(),n.oldState),i=u(t(),n.newState);return p(e,i,r)},u=function(e,t){if((e="function"==typeof e?e(t):e).children)for(var n=0;n<e.children.length;n++)e.children[n]=u(e.children[n],t);return e},a=function(e,t){void 0===t&&(t={});var n=t.mount;void 0===n&&(n=!0);var r=t.initial;void 0===r&&(r=!1);var i=typeof e;if("object"!==i&&"boolean"!==i)return document.createTextNode(e);for(var o=document.createElement(e.element),d=0,u=Object.entries(e);d<u.length;d+=1){var v=u[d],f=v[0],l=v[1];if("text"===f&&o.appendChild(document.createTextNode(l)),"events"===f&&c(l,o,n,r),["children","element","text","events"].includes(f)||o.setAttribute(f,l),"children"===f)for(var s=0;s<l.length;s++)o.appendChild(a(l[s],{mount:n,initial:r}))}return o},c=function(e,t,n,r){var i=["mounted","unmounted","updated"];if(Array.isArray(e))for(var o=0;o<e.length;o++)i.includes(e[o].type)||t.addEventListener(e[o].type,e[o].action),v(e[o],n,r);else i.includes(e.type)||t.addEventListener(e.type,e.action),v(e,n,r)},v=function(e,t,r){if(r){var i=function(e){return n.push(e)};t&&"mounted"===e.type&&i(e.action),t||"updated"!==e.type||i(e.action),l()}},f=function(e,t){if(e.events){if(Array.isArray(e.events))for(var r=0;r<e.events.length;r++)e.events[r].type===t&&n.push(e.events[r].action);else e.events.type===t&&n.push(e.events.action);l()}},l=function(){var e=new Event("__LITERAL_LIFECYCLE__");return window.dispatchEvent(e)},s=function(t){return void 0===t&&(t=e),Object.assign({},t)},h=function(n){var r=s(),i={oldState:r,nextState:Object.assign({},r,n)};e=i.nextState,t.push(i);var o=new Event("__LITERAL_UPDATE__");return window.dispatchEvent(o)},p=function(e,t,n,r){if(void 0===r&&(r=0),e){var i=e.childNodes[r];if(!n&&t)!1===n?(f(t,"mounted"),e.insertBefore(a(t),i)):void 0===n?(f(t,"mounted"),e.appendChild(a(t))):0===n&&g(e,i,t);else if(!t&&n)f(n,"unmounted"),e.removeChild(i);else if(t&&(_(i,t,n),E(e,i,t,n),t.children||n.children))for(var o=m(t.children,n.children),d=o.newChildren,u=o.oldChildren,c=0;c<y(d,u);c++)p(i,d[c],u[c],c)}},m=function(e,t){for(var n=[],r=[],i=0;i<y(e,t);i++)!1===e[i]&&!1===t[i]||(n.push(e[i]),r.push(t[i]));return{newChildren:n,oldChildren:r}},y=function(e,t){var n=e.length,r=t.length;return n>=r?n:r},E=function(e,t,n,r){"object"==typeof n&&"object"==typeof r||n!==r&&g(e,t,n);for(var i=0,o=Object.entries(n);i<o.length;i+=1){var d=o[i],u=d[0],a=d[1],c=r[u];if("element"===u||"text"===u)a!==c&&g(e,t,n);else if(!(["children","events","element","text"].includes(u)||c&&a===c))return f(n,"updated"),t.setAttribute(name,value)}},_=function(e,t,n){for(var r=0,i=Object.entries(n);r<i.length;r+=1){var o=i[r],d=o[1];t[o[0]]||(f(t,"updated"),e.removeAttribute(d))}},g=function(e,t,n){f(n,"mounted"),e.replaceChild(a(n,{mount:!1}),t)};module.exports={component:function(e){void 0===e&&(e={});var t=e.methods;void 0===t&&(t=function(){});var n=e.render;return void 0===n&&(n=function(){}),function(e){return void 0===e&&(e={}),function(r){return n({state:s(r),getState:s,setState:h,props:e,methods:t({getState:s,setState:h})})}}},render:function(t,n,r){void 0===r&&(r={});var d=document.getElementById(n);e=Object.assign({},e,r),i(d,t);var c=u(t(),e),v=a(c,{initial:!0});d.appendChild(v),o()},h:function(e,t){for(var n=[],i=arguments.length-2;i-- >0;)n[i]=arguments[i+2];return"function"==typeof e?e:Object.assign({},{element:e},t,{children:r(n,[])})}}; | ||
| //# sourceMappingURL=index.js.map |
@@ -1,2 +0,2 @@ | ||
| var e={},t=[],n=[],r=function(e,t){for(var n=[],r=arguments.length-2;r-- >0;)n[r]=arguments[r+2];var i=function(e,t){t=void 0===t?[]:t;for(var n=0;n<e.length;n++)Array.isArray(e[n])?i(e[n],t):t.push(e[n]);return t};return"function"==typeof e?e:Object.assign({},{element:e},t,{children:i(n,[])})},i=function(t,n,r){void 0===r&&(r={});var i=document.getElementById(n);!function(t){e=Object.assign({},e,t)}(r),o(i,t);var a=u(t(),e),v=c(a,{initial:!0});i.appendChild(v),d()},o=function(e,n){window.addEventListener("__LITERAL_UPDATE__",function(){var r=t.pop();a(e,n,{oldState:r.oldState,newState:r.newState})})},d=function(){var e=function(){for(var e;e=n.pop();)e()};e(),window.addEventListener("__LITERAL_LIFECYCLE__",e)},a=function(e,t,n){var r=u(t(),n.oldState),i=u(t(),n.newState);return p(e,i,r)},u=function(e,t){if((e="function"==typeof e?e(t):e).children)for(var n=0;n<e.children.length;n++)e.children[n]=u(e.children[n],t);return e},c=function(e,t){void 0===t&&(t={});var n=t.mount;void 0===n&&(n=!0);var r=t.initial;void 0===r&&(r=!1);var i=typeof e;if("object"!==i&&"boolean"!==i)return document.createTextNode(e);for(var o=document.createElement(e.element),d=0,a=Object.entries(e);d<a.length;d+=1){var u=a[d],f=u[0],l=u[1];if("text"===f&&o.appendChild(document.createTextNode(l)),"events"===f&&v(l,o,n,r),["children","element","text","events"].includes(f)||o.setAttribute(f,l),"children"===f)for(var s=0;s<l.length;s++)o.appendChild(c(l[s],{mount:n,initial:r}))}return o},v=function(e,t,n,r){var i=["mounted","unmounted","updated"];if(Array.isArray(e))for(var o=0;o<e.length;o++)i.includes(e[o].type)||t.addEventListener(e[o].type,e[o].action),f(e[o],n,r);else i.includes(e.type)||t.addEventListener(e.type,e.action),f(e,n,r)},f=function(e,t,r){if(r){var i=function(e){return n.push(e)};t&&"mounted"===e.type&&i(e.action),t||"updated"!==e.type||i(e.action),s()}},l=function(e,t){if(e.events){if(Array.isArray(e.events))for(var r=0;r<e.events.length;r++)e.events[r].type===t&&n.push(e.events[r].action);else e.events.type===t&&n.push(e.events.action);s()}},s=function(){var e=new Event("__LITERAL_LIFECYCLE__");return window.dispatchEvent(e)},h=function(n){void 0===n&&(n={});var r=n.methods;void 0===r&&(r=function(){});var i=n.render;return void 0===i&&(i=function(){}),function(n){return void 0===n&&(n={}),function(o){var d=function(t){return void 0===t&&(t=e),Object.assign({},t)},a=function(n){var r=d(),i={oldState:r,nextState:Object.assign({},r,n)};e=i.nextState,t.push(i);var o=new Event("__LITERAL_UPDATE__");return window.dispatchEvent(o)};return i({state:d(o),getState:d,setState:a,props:n,methods:r({getState:d,setState:a})})}}},p=function(e,t,n,r){if(void 0===r&&(r=0),e){var i=e.childNodes[r];if(!n&&t)!1===n?(l(t,"mounted"),e.insertBefore(c(t),i)):void 0===n?(l(t,"mounted"),e.appendChild(c(t))):0===n&&g(e,i,t);else if(!t&&n)l(n,"unmounted"),e.removeChild(i);else if(t&&(_(i,t,n),E(e,i,t,n),t.children||n.children))for(var o=m(t.children,n.children),d=o.newChildren,a=o.oldChildren,u=0;u<y(d,a);u++)p(i,d[u],a[u],u)}},m=function(e,t){for(var n=[],r=[],i=0;i<y(e,t);i++)!1===e[i]&&!1===t[i]||(n.push(e[i]),r.push(t[i]));return{newChildren:n,oldChildren:r}},y=function(e,t){var n=e.length,r=t.length;return n>=r?n:r},E=function(e,t,n,r){"object"==typeof n&&"object"==typeof r||n!==r&&g(e,t,n);for(var i=0,o=Object.entries(n);i<o.length;i+=1){var d=o[i],a=d[0],u=d[1],c=r[a];if("element"===a||"text"===a)u!==c&&g(e,t,n);else if(!(["children","events","element","text"].includes(a)||c&&u===c))return l(n,"updated"),t.setAttribute(name,value)}},_=function(e,t,n){for(var r=0,i=Object.entries(n);r<i.length;r+=1){var o=i[r],d=o[1];t[o[0]]||(l(t,"updated"),e.removeAttribute(d))}},g=function(e,t,n){l(n,"mounted"),e.replaceChild(c(n,{mount:!1}),t)};export default{component:h,render:i,h:r};export{r as h,i as render,h as component}; | ||
| var e={},t=[],n=[],r=function(e,t){for(var n=[],r=arguments.length-2;r-- >0;)n[r]=arguments[r+2];return"function"==typeof e?e:Object.assign({},{element:e},t,{children:i(n,[])})},i=function(e,t){t=void 0===t?[]:t;for(var n=0;n<e.length;n++)Array.isArray(e[n])?i(e[n],t):t.push(e[n]);return t},o=function(t,n,r){void 0===r&&(r={});var i=document.getElementById(n);e=Object.assign({},e,r),d(i,t);var o=c(t(),e),a=v(o,{initial:!0});i.appendChild(a),u()},d=function(e,n){return window.addEventListener("__LITERAL_UPDATE__",function(){return setTimeout(function(){var r=t.pop();return a(e,n,{oldState:r.oldState,newState:r.newState})})})},u=function(){var e=function(){return setTimeout(function(){for(var e;e=n.pop();)e()})};e(),window.addEventListener("__LITERAL_LIFECYCLE__",e)},a=function(e,t,n){var r=c(t(),n.oldState),i=c(t(),n.newState);return E(e,i,r)},c=function(e,t){if((e="function"==typeof e?e(t):e).children)for(var n=0;n<e.children.length;n++)e.children[n]=c(e.children[n],t);return e},v=function(e,t){void 0===t&&(t={});var n=t.mount;void 0===n&&(n=!0);var r=t.initial;void 0===r&&(r=!1);var i=typeof e;if("object"!==i&&"boolean"!==i)return document.createTextNode(e);for(var o=document.createElement(e.element),d=0,u=Object.entries(e);d<u.length;d+=1){var a=u[d],c=a[0],l=a[1];if("text"===c&&o.appendChild(document.createTextNode(l)),"events"===c&&f(l,o,n,r),["children","element","text","events"].includes(c)||o.setAttribute(c,l),"children"===c)for(var s=0;s<l.length;s++)o.appendChild(v(l[s],{mount:n,initial:r}))}return o},f=function(e,t,n,r){var i=["mounted","unmounted","updated"];if(Array.isArray(e))for(var o=0;o<e.length;o++)i.includes(e[o].type)||t.addEventListener(e[o].type,e[o].action),l(e[o],n,r);else i.includes(e.type)||t.addEventListener(e.type,e.action),l(e,n,r)},l=function(e,t,r){if(r){var i=function(e){return n.push(e)};t&&"mounted"===e.type&&i(e.action),t||"updated"!==e.type||i(e.action),h()}},s=function(e,t){if(e.events){if(Array.isArray(e.events))for(var r=0;r<e.events.length;r++)e.events[r].type===t&&n.push(e.events[r].action);else e.events.type===t&&n.push(e.events.action);h()}},h=function(){var e=new Event("__LITERAL_LIFECYCLE__");return window.dispatchEvent(e)},p=function(t){return void 0===t&&(t=e),Object.assign({},t)},m=function(n){var r=p(),i={oldState:r,nextState:Object.assign({},r,n)};e=i.nextState,t.push(i);var o=new Event("__LITERAL_UPDATE__");return window.dispatchEvent(o)},y=function(e){void 0===e&&(e={});var t=e.methods;void 0===t&&(t=function(){});var n=e.render;return void 0===n&&(n=function(){}),function(e){return void 0===e&&(e={}),function(r){return n({state:p(r),getState:p,setState:m,props:e,methods:t({getState:p,setState:m})})}}},E=function(e,t,n,r){if(void 0===r&&(r=0),e){var i=e.childNodes[r];if(!n&&t)!1===n?(s(t,"mounted"),e.insertBefore(v(t),i)):void 0===n?(s(t,"mounted"),e.appendChild(v(t))):0===n&&A(e,i,t);else if(!t&&n)s(n,"unmounted"),e.removeChild(i);else if(t&&(w(i,t,n),L(e,i,t,n),t.children||n.children))for(var o=_(t.children,n.children),d=o.newChildren,u=o.oldChildren,a=0;a<g(d,u);a++)E(i,d[a],u[a],a)}},_=function(e,t){for(var n=[],r=[],i=0;i<g(e,t);i++)!1===e[i]&&!1===t[i]||(n.push(e[i]),r.push(t[i]));return{newChildren:n,oldChildren:r}},g=function(e,t){var n=e.length,r=t.length;return n>=r?n:r},L=function(e,t,n,r){"object"==typeof n&&"object"==typeof r||n!==r&&A(e,t,n);for(var i=0,o=Object.entries(n);i<o.length;i+=1){var d=o[i],u=d[0],a=d[1],c=r[u];if("element"===u||"text"===u)a!==c&&A(e,t,n);else if(!(["children","events","element","text"].includes(u)||c&&a===c))return s(n,"updated"),t.setAttribute(name,value)}},w=function(e,t,n){for(var r=0,i=Object.entries(n);r<i.length;r+=1){var o=i[r],d=o[1];t[o[0]]||(s(t,"updated"),e.removeAttribute(d))}},A=function(e,t,n){s(n,"mounted"),e.replaceChild(v(n,{mount:!1}),t)};export default{component:y,render:o,h:r};export{r as h,o as render,y as component}; | ||
| //# sourceMappingURL=index.m.js.map |
@@ -1,2 +0,2 @@ | ||
| !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):e.literaljs=t()}(this,function(){var e={},t=[],n=[],r=function(e,n){window.addEventListener("__LITERAL_UPDATE__",function(){var r=t.pop();o(e,n,{oldState:r.oldState,newState:r.newState})})},i=function(){var e=function(){for(var e;e=n.pop();)e()};e(),window.addEventListener("__LITERAL_LIFECYCLE__",e)},o=function(e,t,n){var r=d(t(),n.oldState),i=d(t(),n.newState);return l(e,i,r)},d=function(e,t){if((e="function"==typeof e?e(t):e).children)for(var n=0;n<e.children.length;n++)e.children[n]=d(e.children[n],t);return e},a=function(e,t){void 0===t&&(t={});var n=t.mount;void 0===n&&(n=!0);var r=t.initial;void 0===r&&(r=!1);var i=typeof e;if("object"!==i&&"boolean"!==i)return document.createTextNode(e);for(var o=document.createElement(e.element),d=0,c=Object.entries(e);d<c.length;d+=1){var f=c[d],v=f[0],l=f[1];if("text"===v&&o.appendChild(document.createTextNode(l)),"events"===v&&u(l,o,n,r),["children","element","text","events"].includes(v)||o.setAttribute(v,l),"children"===v)for(var s=0;s<l.length;s++)o.appendChild(a(l[s],{mount:n,initial:r}))}return o},u=function(e,t,n,r){var i=["mounted","unmounted","updated"];if(Array.isArray(e))for(var o=0;o<e.length;o++)i.includes(e[o].type)||t.addEventListener(e[o].type,e[o].action),c(e[o],n,r);else i.includes(e.type)||t.addEventListener(e.type,e.action),c(e,n,r)},c=function(e,t,r){if(r){var i=function(e){return n.push(e)};t&&"mounted"===e.type&&i(e.action),t||"updated"!==e.type||i(e.action),v()}},f=function(e,t){if(e.events){if(Array.isArray(e.events))for(var r=0;r<e.events.length;r++)e.events[r].type===t&&n.push(e.events[r].action);else e.events.type===t&&n.push(e.events.action);v()}},v=function(){var e=new Event("__LITERAL_LIFECYCLE__");return window.dispatchEvent(e)},l=function(e,t,n,r){if(void 0===r&&(r=0),e){var i=e.childNodes[r];if(!n&&t)!1===n?(f(t,"mounted"),e.insertBefore(a(t),i)):void 0===n?(f(t,"mounted"),e.appendChild(a(t))):0===n&&y(e,i,t);else if(!t&&n)f(n,"unmounted"),e.removeChild(i);else if(t&&(m(i,t,n),p(e,i,t,n),t.children||n.children))for(var o=s(t.children,n.children),d=o.newChildren,u=o.oldChildren,c=0;c<h(d,u);c++)l(i,d[c],u[c],c)}},s=function(e,t){for(var n=[],r=[],i=0;i<h(e,t);i++)!1===e[i]&&!1===t[i]||(n.push(e[i]),r.push(t[i]));return{newChildren:n,oldChildren:r}},h=function(e,t){var n=e.length,r=t.length;return n>=r?n:r},p=function(e,t,n,r){"object"==typeof n&&"object"==typeof r||n!==r&&y(e,t,n);for(var i=0,o=Object.entries(n);i<o.length;i+=1){var d=o[i],a=d[0],u=d[1],c=r[a];if("element"===a||"text"===a)u!==c&&y(e,t,n);else if(!(["children","events","element","text"].includes(a)||c&&u===c))return f(n,"updated"),t.setAttribute(name,value)}},m=function(e,t,n){for(var r=0,i=Object.entries(n);r<i.length;r+=1){var o=i[r],d=o[1];t[o[0]]||(f(t,"updated"),e.removeAttribute(d))}},y=function(e,t,n){f(n,"mounted"),e.replaceChild(a(n,{mount:!1}),t)};return{component:function(n){void 0===n&&(n={});var r=n.methods;void 0===r&&(r=function(){});var i=n.render;return void 0===i&&(i=function(){}),function(n){return void 0===n&&(n={}),function(o){var d=function(t){return void 0===t&&(t=e),Object.assign({},t)},a=function(n){var r=d(),i={oldState:r,nextState:Object.assign({},r,n)};e=i.nextState,t.push(i);var o=new Event("__LITERAL_UPDATE__");return window.dispatchEvent(o)};return i({state:d(o),getState:d,setState:a,props:n,methods:r({getState:d,setState:a})})}}},render:function(t,n,o){void 0===o&&(o={});var u=document.getElementById(n);!function(t){e=Object.assign({},e,t)}(o),r(u,t);var c=d(t(),e),f=a(c,{initial:!0});u.appendChild(f),i()},h:function(e,t){for(var n=[],r=arguments.length-2;r-- >0;)n[r]=arguments[r+2];var i=function(e,t){t=void 0===t?[]:t;for(var n=0;n<e.length;n++)Array.isArray(e[n])?i(e[n],t):t.push(e[n]);return t};return"function"==typeof e?e:Object.assign({},{element:e},t,{children:i(n,[])})}}}); | ||
| !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):e.literaljs=t()}(this,function(){var e={},t=[],n=[],r=function(e,t){t=void 0===t?[]:t;for(var n=0;n<e.length;n++)Array.isArray(e[n])?r(e[n],t):t.push(e[n]);return t},i=function(e,n){return window.addEventListener("__LITERAL_UPDATE__",function(){return setTimeout(function(){var r=t.pop();return d(e,n,{oldState:r.oldState,newState:r.newState})})})},o=function(){var e=function(){return setTimeout(function(){for(var e;e=n.pop();)e()})};e(),window.addEventListener("__LITERAL_LIFECYCLE__",e)},d=function(e,t,n){var r=u(t(),n.oldState),i=u(t(),n.newState);return p(e,i,r)},u=function(e,t){if((e="function"==typeof e?e(t):e).children)for(var n=0;n<e.children.length;n++)e.children[n]=u(e.children[n],t);return e},a=function(e,t){void 0===t&&(t={});var n=t.mount;void 0===n&&(n=!0);var r=t.initial;void 0===r&&(r=!1);var i=typeof e;if("object"!==i&&"boolean"!==i)return document.createTextNode(e);for(var o=document.createElement(e.element),d=0,u=Object.entries(e);d<u.length;d+=1){var f=u[d],l=f[0],v=f[1];if("text"===l&&o.appendChild(document.createTextNode(v)),"events"===l&&c(v,o,n,r),["children","element","text","events"].includes(l)||o.setAttribute(l,v),"children"===l)for(var s=0;s<v.length;s++)o.appendChild(a(v[s],{mount:n,initial:r}))}return o},c=function(e,t,n,r){var i=["mounted","unmounted","updated"];if(Array.isArray(e))for(var o=0;o<e.length;o++)i.includes(e[o].type)||t.addEventListener(e[o].type,e[o].action),f(e[o],n,r);else i.includes(e.type)||t.addEventListener(e.type,e.action),f(e,n,r)},f=function(e,t,r){if(r){var i=function(e){return n.push(e)};t&&"mounted"===e.type&&i(e.action),t||"updated"!==e.type||i(e.action),v()}},l=function(e,t){if(e.events){if(Array.isArray(e.events))for(var r=0;r<e.events.length;r++)e.events[r].type===t&&n.push(e.events[r].action);else e.events.type===t&&n.push(e.events.action);v()}},v=function(){var e=new Event("__LITERAL_LIFECYCLE__");return window.dispatchEvent(e)},s=function(t){return void 0===t&&(t=e),Object.assign({},t)},h=function(n){var r=s(),i={oldState:r,nextState:Object.assign({},r,n)};e=i.nextState,t.push(i);var o=new Event("__LITERAL_UPDATE__");return window.dispatchEvent(o)},p=function(e,t,n,r){if(void 0===r&&(r=0),e){var i=e.childNodes[r];if(!n&&t)!1===n?(l(t,"mounted"),e.insertBefore(a(t),i)):void 0===n?(l(t,"mounted"),e.appendChild(a(t))):0===n&&g(e,i,t);else if(!t&&n)l(n,"unmounted"),e.removeChild(i);else if(t&&(_(i,t,n),E(e,i,t,n),t.children||n.children))for(var o=m(t.children,n.children),d=o.newChildren,u=o.oldChildren,c=0;c<y(d,u);c++)p(i,d[c],u[c],c)}},m=function(e,t){for(var n=[],r=[],i=0;i<y(e,t);i++)!1===e[i]&&!1===t[i]||(n.push(e[i]),r.push(t[i]));return{newChildren:n,oldChildren:r}},y=function(e,t){var n=e.length,r=t.length;return n>=r?n:r},E=function(e,t,n,r){"object"==typeof n&&"object"==typeof r||n!==r&&g(e,t,n);for(var i=0,o=Object.entries(n);i<o.length;i+=1){var d=o[i],u=d[0],a=d[1],c=r[u];if("element"===u||"text"===u)a!==c&&g(e,t,n);else if(!(["children","events","element","text"].includes(u)||c&&a===c))return l(n,"updated"),t.setAttribute(name,value)}},_=function(e,t,n){for(var r=0,i=Object.entries(n);r<i.length;r+=1){var o=i[r],d=o[1];t[o[0]]||(l(t,"updated"),e.removeAttribute(d))}},g=function(e,t,n){l(n,"mounted"),e.replaceChild(a(n,{mount:!1}),t)};return{component:function(e){void 0===e&&(e={});var t=e.methods;void 0===t&&(t=function(){});var n=e.render;return void 0===n&&(n=function(){}),function(e){return void 0===e&&(e={}),function(r){return n({state:s(r),getState:s,setState:h,props:e,methods:t({getState:s,setState:h})})}}},render:function(t,n,r){void 0===r&&(r={});var d=document.getElementById(n);e=Object.assign({},e,r),i(d,t);var c=u(t(),e),f=a(c,{initial:!0});d.appendChild(f),o()},h:function(e,t){for(var n=[],i=arguments.length-2;i-- >0;)n[i]=arguments[i+2];return"function"==typeof e?e:Object.assign({},{element:e},t,{children:r(n,[])})}}}); | ||
| //# sourceMappingURL=index.umd.js.map |
| { | ||
| "name": "literaljs", | ||
| "version": "2.3.1", | ||
| "version": "2.3.2", | ||
| "description": "~1kb JavaScript library for building user interfaces.", | ||
@@ -12,3 +12,3 @@ "main": "build/index.js", | ||
| "prepublishOnly": "npm run build", | ||
| "test": "jest --coverage --no-cache" | ||
| "test": "jest --coverage" | ||
| }, | ||
@@ -15,0 +15,0 @@ "author": "Michael Farrell", |
| import { component, h } from '../src'; | ||
| test('Component Object Syntax Works', () => { | ||
| expect( | ||
| component({ | ||
| render: () => ({ | ||
| element: 'div', | ||
| children: [ | ||
| { | ||
| element: 'span', | ||
| text: 'Hello World' | ||
| } | ||
| ] | ||
| }) | ||
| })()() | ||
| ).toEqual({ | ||
| element: 'div', | ||
| children: [ | ||
| { | ||
| element: 'span', | ||
| text: 'Hello World' | ||
| } | ||
| ] | ||
| describe('Component Tests', () => { | ||
| test('Component Object Syntax Works', () => { | ||
| expect( | ||
| component({ | ||
| render: () => ({ | ||
| element: 'div', | ||
| children: [ | ||
| { | ||
| element: 'span', | ||
| text: 'Hello World' | ||
| } | ||
| ] | ||
| }) | ||
| })()() | ||
| ).toEqual({ | ||
| element: 'div', | ||
| children: [ | ||
| { | ||
| element: 'span', | ||
| text: 'Hello World' | ||
| } | ||
| ] | ||
| }); | ||
| }); | ||
| }); | ||
| test('Component H Syntax Works', () => { | ||
| expect( | ||
| component({ | ||
| render: () => h('div', {}, h('span', { text: 'Hello World' })) | ||
| })()() | ||
| ).toEqual({ | ||
| element: 'div', | ||
| children: [ | ||
| { | ||
| element: 'span', | ||
| text: 'Hello World', | ||
| children: [] | ||
| } | ||
| ] | ||
| test('Component H Syntax Works', () => { | ||
| expect( | ||
| component({ | ||
| render: () => h('div', {}, h('span', { text: 'Hello World' })) | ||
| })()() | ||
| ).toEqual({ | ||
| element: 'div', | ||
| children: [ | ||
| { | ||
| element: 'span', | ||
| text: 'Hello World', | ||
| children: [] | ||
| } | ||
| ] | ||
| }); | ||
| }); | ||
| }); | ||
| test('Component Props Injection Works', () => { | ||
| const count = 1; | ||
| expect( | ||
| component({ | ||
| render: ({ props: { count } }) => | ||
| h('div', {}, h('span', { text: `${count}` })) | ||
| })({ count: count })() | ||
| ).toEqual({ | ||
| element: 'div', | ||
| children: [ | ||
| { | ||
| element: 'span', | ||
| text: `${count}`, | ||
| children: [] | ||
| } | ||
| ] | ||
| test('Component Props Injection Works', () => { | ||
| const count = 1; | ||
| expect( | ||
| component({ | ||
| render: ({ props: { count } }) => | ||
| h('div', {}, h('span', { text: `${count}` })) | ||
| })({ count: count })() | ||
| ).toEqual({ | ||
| element: 'div', | ||
| children: [ | ||
| { | ||
| element: 'span', | ||
| text: `${count}`, | ||
| children: [] | ||
| } | ||
| ] | ||
| }); | ||
| }); | ||
| }); | ||
| test('Component State Injection Works', () => { | ||
| const count = 1; | ||
| expect( | ||
| component({ | ||
| render: ({ state }) => h('div', {}, h('span', { text: `${state.count}` })) | ||
| })()({ count: count }) | ||
| ).toEqual({ | ||
| element: 'div', | ||
| children: [ | ||
| { | ||
| element: 'span', | ||
| text: `${count}`, | ||
| children: [] | ||
| } | ||
| ] | ||
| test('Component State Injection Works', () => { | ||
| const count = 1; | ||
| expect( | ||
| component({ | ||
| render: ({ state }) => | ||
| h('div', {}, h('span', { text: `${state.count}` })) | ||
| })()({ count: count }) | ||
| ).toEqual({ | ||
| element: 'div', | ||
| children: [ | ||
| { | ||
| element: 'span', | ||
| text: `${count}`, | ||
| children: [] | ||
| } | ||
| ] | ||
| }); | ||
| }); | ||
| }); | ||
| test('Component Method Injection Works', () => { | ||
| const count = 1; | ||
| expect( | ||
| component({ | ||
| methods: () => ({ | ||
| count: () => count | ||
| }), | ||
| render: ({ methods: { count } }) => | ||
| h('div', {}, h('span', { text: `${count()}` })) | ||
| })()() | ||
| ).toEqual({ | ||
| element: 'div', | ||
| children: [ | ||
| { | ||
| element: 'span', | ||
| text: `${count}`, | ||
| children: [] | ||
| } | ||
| ] | ||
| test('Component Method Injection Works', () => { | ||
| const count = 1; | ||
| expect( | ||
| component({ | ||
| methods: () => ({ | ||
| count: () => count | ||
| }), | ||
| render: ({ methods: { count } }) => | ||
| h('div', {}, h('span', { text: `${count()}` })) | ||
| })()() | ||
| ).toEqual({ | ||
| element: 'div', | ||
| children: [ | ||
| { | ||
| element: 'span', | ||
| text: `${count}`, | ||
| children: [] | ||
| } | ||
| ] | ||
| }); | ||
| }); | ||
| }); |
| import { h } from '../src'; | ||
| test('H Node Created', () => { | ||
| expect(h('div')).toEqual({ | ||
| element: 'div', | ||
| children: [] | ||
| describe('H Tests', () => { | ||
| test('H Node Created', () => { | ||
| expect(h('div')).toEqual({ | ||
| element: 'div', | ||
| children: [] | ||
| }); | ||
| }); | ||
| }); | ||
| test('H Node Created With Single Child', () => { | ||
| expect(h('div', {}, ['hello'])).toEqual({ | ||
| element: 'div', | ||
| children: ['hello'] | ||
| }); | ||
| test('H Node Created With Single Child', () => { | ||
| expect(h('div', {}, ['hello'])).toEqual({ | ||
| element: 'div', | ||
| children: ['hello'] | ||
| }); | ||
| expect(h('div', {}, 'world')).toEqual({ | ||
| element: 'div', | ||
| children: ['world'] | ||
| expect(h('div', {}, 'world')).toEqual({ | ||
| element: 'div', | ||
| children: ['world'] | ||
| }); | ||
| }); | ||
| }); | ||
| test('H Node Create With Multiple Children Of VNodes, Different Types, And Same Types', () => { | ||
| expect(h('div', {}, ['foo', 'bar', 'baz'])).toEqual({ | ||
| element: 'div', | ||
| children: ['foo', 'bar', 'baz'] | ||
| }); | ||
| test('H Node Create With Multiple Children Of VNodes, Different Types, And Same Types', () => { | ||
| expect(h('div', {}, ['foo', 'bar', 'baz'])).toEqual({ | ||
| element: 'div', | ||
| children: ['foo', 'bar', 'baz'] | ||
| }); | ||
| expect(h('div', {}, 'foo', 'bar', 'baz')).toEqual({ | ||
| element: 'div', | ||
| children: ['foo', 'bar', 'baz'] | ||
| }); | ||
| expect(h('div', {}, 'foo', 'bar', 'baz')).toEqual({ | ||
| element: 'div', | ||
| children: ['foo', 'bar', 'baz'] | ||
| }); | ||
| expect(h('div', {}, [0, 1, 2, 3, 4])).toEqual({ | ||
| element: 'div', | ||
| children: [0, 1, 2, 3, 4] | ||
| }); | ||
| expect(h('div', {}, [0, 1, 2, 3, 4])).toEqual({ | ||
| element: 'div', | ||
| children: [0, 1, 2, 3, 4] | ||
| }); | ||
| expect(h('div', {}, 0, 1, 2, 3, 4)).toEqual({ | ||
| element: 'div', | ||
| children: [0, 1, 2, 3, 4] | ||
| }); | ||
| expect(h('div', {}, 0, 1, 2, 3, 4)).toEqual({ | ||
| element: 'div', | ||
| children: [0, 1, 2, 3, 4] | ||
| }); | ||
| expect(h('div', {}, ['foo', 1, 'baz'])).toEqual({ | ||
| element: 'div', | ||
| children: ['foo', 1, 'baz'] | ||
| }); | ||
| expect(h('div', {}, ['foo', 1, 'baz'])).toEqual({ | ||
| element: 'div', | ||
| children: ['foo', 1, 'baz'] | ||
| }); | ||
| expect(h('div', {}, 'foo', 1, 'baz')).toEqual({ | ||
| element: 'div', | ||
| children: ['foo', 1, 'baz'] | ||
| }); | ||
| expect(h('div', {}, 'foo', 1, 'baz')).toEqual({ | ||
| element: 'div', | ||
| children: ['foo', 1, 'baz'] | ||
| }); | ||
| expect(h('div', {}, [h('div', {}, 'hello'), h('div', {}, 'world')])).toEqual({ | ||
| element: 'div', | ||
| children: [ | ||
| { | ||
| element: 'div', | ||
| children: ['hello'] | ||
| }, | ||
| { | ||
| element: 'div', | ||
| children: ['world'] | ||
| } | ||
| ] | ||
| }); | ||
| expect( | ||
| h('div', {}, [h('div', {}, 'hello'), h('div', {}, 'world')]) | ||
| ).toEqual({ | ||
| element: 'div', | ||
| children: [ | ||
| { | ||
| element: 'div', | ||
| children: ['hello'] | ||
| }, | ||
| { | ||
| element: 'div', | ||
| children: ['world'] | ||
| } | ||
| ] | ||
| }); | ||
| expect(h('div', {}, h('div', {}, 'hello'), h('div', {}, 'world'))).toEqual({ | ||
| element: 'div', | ||
| children: [ | ||
| { | ||
| element: 'div', | ||
| children: ['hello'] | ||
| }, | ||
| { | ||
| element: 'div', | ||
| children: ['world'] | ||
| } | ||
| ] | ||
| }); | ||
| expect(h('div', {}, h('div', {}, 'hello'), h('div', {}, 'world'))).toEqual({ | ||
| element: 'div', | ||
| children: [ | ||
| { | ||
| element: 'div', | ||
| children: ['hello'] | ||
| }, | ||
| { | ||
| element: 'div', | ||
| children: ['world'] | ||
| } | ||
| ] | ||
| }); | ||
| expect( | ||
| h('div', {}, [ | ||
| 'foo', | ||
| 'bar', | ||
| h('div', {}, 'hello'), | ||
| 1, | ||
| 2, | ||
| h('div', {}, 'world') | ||
| ]) | ||
| ).toEqual({ | ||
| element: 'div', | ||
| children: [ | ||
| 'foo', | ||
| 'bar', | ||
| { | ||
| element: 'div', | ||
| children: ['hello'] | ||
| }, | ||
| 1, | ||
| 2, | ||
| { | ||
| element: 'div', | ||
| children: ['world'] | ||
| } | ||
| ] | ||
| }); | ||
| expect( | ||
| h('div', {}, [ | ||
| 'foo', | ||
| 'bar', | ||
| h('div', {}, 'hello'), | ||
| 1, | ||
| 2, | ||
| h('div', {}, 'world') | ||
| ]) | ||
| ).toEqual({ | ||
| element: 'div', | ||
| children: [ | ||
| 'foo', | ||
| 'bar', | ||
| { | ||
| element: 'div', | ||
| children: ['hello'] | ||
| }, | ||
| 1, | ||
| 2, | ||
| { | ||
| element: 'div', | ||
| children: ['world'] | ||
| } | ||
| ] | ||
| }); | ||
| expect( | ||
| h( | ||
| 'div', | ||
| {}, | ||
| 'foo', | ||
| 'bar', | ||
| h('div', {}, 'hello'), | ||
| 1, | ||
| 2, | ||
| h('div', {}, 'world') | ||
| ) | ||
| ).toEqual({ | ||
| element: 'div', | ||
| children: [ | ||
| 'foo', | ||
| 'bar', | ||
| { | ||
| element: 'div', | ||
| children: ['hello'] | ||
| }, | ||
| 1, | ||
| 2, | ||
| { | ||
| element: 'div', | ||
| children: ['world'] | ||
| } | ||
| ] | ||
| expect( | ||
| h( | ||
| 'div', | ||
| {}, | ||
| 'foo', | ||
| 'bar', | ||
| h('div', {}, 'hello'), | ||
| 1, | ||
| 2, | ||
| h('div', {}, 'world') | ||
| ) | ||
| ).toEqual({ | ||
| element: 'div', | ||
| children: [ | ||
| 'foo', | ||
| 'bar', | ||
| { | ||
| element: 'div', | ||
| children: ['hello'] | ||
| }, | ||
| 1, | ||
| 2, | ||
| { | ||
| element: 'div', | ||
| children: ['world'] | ||
| } | ||
| ] | ||
| }); | ||
| }); | ||
| }); | ||
| test('H Node With Attributes', () => { | ||
| expect( | ||
| h( | ||
| 'div', | ||
| { | ||
| class: 'container' | ||
| }, | ||
| '!' | ||
| ) | ||
| ).toEqual({ | ||
| element: 'div', | ||
| class: 'container', | ||
| children: ['!'] | ||
| }); | ||
| test('H Node With Attributes', () => { | ||
| expect( | ||
| h( | ||
| 'div', | ||
| { | ||
| class: 'container' | ||
| }, | ||
| '!' | ||
| ) | ||
| ).toEqual({ | ||
| element: 'div', | ||
| class: 'container', | ||
| children: ['!'] | ||
| }); | ||
| expect( | ||
| h( | ||
| 'div', | ||
| { | ||
| class: 'container', | ||
| id: 'foo' | ||
| }, | ||
| 1, | ||
| 2, | ||
| 3 | ||
| ) | ||
| ).toEqual({ | ||
| element: 'div', | ||
| class: 'container', | ||
| id: 'foo', | ||
| children: [1, 2, 3] | ||
| expect( | ||
| h( | ||
| 'div', | ||
| { | ||
| class: 'container', | ||
| id: 'foo' | ||
| }, | ||
| 1, | ||
| 2, | ||
| 3 | ||
| ) | ||
| ).toEqual({ | ||
| element: 'div', | ||
| class: 'container', | ||
| id: 'foo', | ||
| children: [1, 2, 3] | ||
| }); | ||
| }); | ||
| }); | ||
| test('H Node Flattens Children', () => { | ||
| expect(h('div', {}, [['foo'], ['bar'], ['baz']])).toEqual({ | ||
| element: 'div', | ||
| children: ['foo', 'bar', 'baz'] | ||
| test('H Node Flattens Children', () => { | ||
| expect(h('div', {}, [['foo'], ['bar'], ['baz']])).toEqual({ | ||
| element: 'div', | ||
| children: ['foo', 'bar', 'baz'] | ||
| }); | ||
| }); | ||
| }); |
| import { render, component, h } from '../src'; | ||
| beforeEach(() => { | ||
| document.body.innerHTML = '<div id="root"></div>'; | ||
| }); | ||
| test('Render Mounts Properly', () => { | ||
| const Comp = component({ | ||
| render: () => h('span', { class: 'container', text: 'Hello World' }) | ||
| describe('Render Tests', () => { | ||
| beforeEach(() => { | ||
| document.body.innerHTML = '<div id="root"></div>'; | ||
| }); | ||
| render(Comp, 'root', {}); | ||
| test('Render Mounts Properly', () => { | ||
| const Comp = component({ | ||
| render: () => h('span', { class: 'container', text: 'Hello World' }) | ||
| }); | ||
| expect(document.body.innerHTML).toBe( | ||
| '<div id="root"><span class="container">Hello World</span></div>' | ||
| ); | ||
| }); | ||
| render(Comp, 'root', {}); | ||
| test('Render Renders Global State Properly', () => { | ||
| const Comp = component({ | ||
| render: ({ state }) => | ||
| h('span', { class: 'container', text: `${state.count}` }) | ||
| expect(document.body.innerHTML).toBe( | ||
| '<div id="root"><span class="container">Hello World</span></div>' | ||
| ); | ||
| }); | ||
| render(Comp, 'root', { count: 1 }); | ||
| test('Render Renders Global State Properly', () => { | ||
| const Comp = component({ | ||
| render: ({ state }) => | ||
| h('span', { class: 'container', text: state.count }) | ||
| }); | ||
| expect(document.body.innerHTML).toBe( | ||
| '<div id="root"><span class="container">1</span></div>' | ||
| ); | ||
| }); | ||
| render(Comp, 'root', { count: 1 }); | ||
| test('Render Multiple Components With Global State Properly', () => { | ||
| const Comp2 = component({ | ||
| render: ({ state }) => h('span', {}, state.count) | ||
| expect(document.body.innerHTML).toBe( | ||
| '<div id="root"><span class="container">1</span></div>' | ||
| ); | ||
| }); | ||
| const Comp = component({ | ||
| render: () => h('div', { class: 'container' }, Comp2()) | ||
| }); | ||
| render(Comp, 'root', { count: 1 }); | ||
| test('Render Multiple Components With Global State Properly', () => { | ||
| const Comp2 = component({ | ||
| render: ({ state }) => h('span', {}, state.count) | ||
| }); | ||
| const Comp = component({ | ||
| render: () => h('div', { class: 'container' }, Comp2()) | ||
| }); | ||
| expect(document.body.innerHTML).toBe( | ||
| '<div id="root"><div class="container"><span>1</span></div></div>' | ||
| ); | ||
| }); | ||
| render(Comp, 'root', { count: 1 }); | ||
| test('Renders True Markup Booleans Properly', () => { | ||
| const Comp = component({ | ||
| render: ({ state }) => | ||
| h('div', { class: 'container' }, [ | ||
| state.show && h('span', {}, 'Hello World') | ||
| ]) | ||
| expect(document.body.innerHTML).toBe( | ||
| '<div id="root"><div class="container"><span>1</span></div></div>' | ||
| ); | ||
| }); | ||
| render(Comp, 'root', { show: true }); | ||
| test('Renders True Markup Booleans Properly', () => { | ||
| const Comp = component({ | ||
| render: ({ state }) => | ||
| h('div', { class: 'container' }, [ | ||
| state.show && h('span', {}, 'Hello World') | ||
| ]) | ||
| }); | ||
| expect(document.body.innerHTML).toBe( | ||
| '<div id="root"><div class="container"><span>Hello World</span></div></div>' | ||
| ); | ||
| }); | ||
| render(Comp, 'root', { show: true }); | ||
| test('Renders False Markup Booleans Properly', () => { | ||
| const Comp = component({ | ||
| render: ({ state }) => | ||
| h('div', { class: 'container' }, [ | ||
| state.show && h('span', { id: 'hello' }, 'Hello World') | ||
| ]) | ||
| expect(document.body.innerHTML).toBe( | ||
| '<div id="root"><div class="container"><span>Hello World</span></div></div>' | ||
| ); | ||
| }); | ||
| render(Comp, 'root', { show: false }); | ||
| test('Renders False Markup Booleans Properly', () => { | ||
| const Comp = component({ | ||
| render: ({ state }) => | ||
| h('div', { class: 'container' }, [ | ||
| state.show && h('span', { id: 'hello' }, 'Hello World') | ||
| ]) | ||
| }); | ||
| setTimeout(() => | ||
| expect(document.body.innerHTML).toBe( | ||
| '<div id="root"><div class="container"></div></div>' | ||
| ) | ||
| ); | ||
| }); | ||
| render(Comp, 'root', { show: false }); | ||
| test('getState and setState Works With Method', () => { | ||
| const Comp2 = component({ | ||
| methods: ({ getState, setState }) => ({ | ||
| increment: () => { | ||
| setState({ count: getState().count + 1 }); | ||
| expect(getState().count).toBe(2); | ||
| } | ||
| }), | ||
| render: ({ state, methods: { increment } }) => | ||
| h( | ||
| 'button', | ||
| { id: 'button', events: { type: 'click', action: () => increment() } }, | ||
| 'Click Me' | ||
| ) | ||
| expect(document.getElementById('hello')).toBe(null); | ||
| }); | ||
| const Comp = component({ | ||
| render: ({ state }) => | ||
| h('div', { class: 'container' }, Comp2(), h('span', {}, state.count)) | ||
| }); | ||
| test('getState and setState Works With Methods', done => { | ||
| const Comp2 = component({ | ||
| methods: ({ getState, setState }) => ({ | ||
| increment: () => setState({ count: getState().count + 1 }) | ||
| }), | ||
| render: ({ state, getState, methods: { increment } }) => | ||
| h( | ||
| 'button', | ||
| { | ||
| id: 'button', | ||
| events: { | ||
| type: 'click', | ||
| action: () => { | ||
| increment(); | ||
| expect(getState().count).toBe(2); | ||
| done(); | ||
| } | ||
| } | ||
| }, | ||
| 'Click Me' | ||
| ) | ||
| }); | ||
| render(Comp, 'root', { count: 1 }); | ||
| const Comp = component({ | ||
| render: ({ state }) => h('div', { class: 'container' }, Comp2()) | ||
| }); | ||
| setTimeout(() => { | ||
| render(Comp, 'root', { count: 1 }); | ||
| document.getElementById('button').click(); | ||
| expect(document.body.innerHTML).toBe( | ||
| '<div id="root"><div class="container"><button id="button">Click Me</button><span>2</span></div></div>' | ||
| ); | ||
| }); | ||
| }); | ||
| test('getState and setState Works In Render Event', () => { | ||
| const Comp2 = component({ | ||
| render: ({ state }) => | ||
| h( | ||
| 'button', | ||
| { | ||
| id: 'button', | ||
| events: { | ||
| type: 'click', | ||
| action: () => { | ||
| setState({ count: getState().count + 1 }); | ||
| expect(getState().count).toBe(2); | ||
| test('getState and setState Works In Render Event', done => { | ||
| const Comp2 = component({ | ||
| render: ({ state, setState, getState }) => | ||
| h( | ||
| 'button', | ||
| { | ||
| id: 'button', | ||
| events: { | ||
| type: 'click', | ||
| action: () => { | ||
| setState({ count: getState().count + 1 }); | ||
| expect(getState().count).toBe(2); | ||
| done(); | ||
| } | ||
| } | ||
| } | ||
| }, | ||
| 'Click Me' | ||
| ) | ||
| }); | ||
| }, | ||
| 'Click Me' | ||
| ) | ||
| }); | ||
| const Comp = component({ | ||
| render: ({ state }) => | ||
| h('div', { class: 'container' }, Comp2(), h('span', {}, state.count)) | ||
| }); | ||
| const Comp = component({ | ||
| render: ({ state }) => h('div', { class: 'container' }, Comp2()) | ||
| }); | ||
| render(Comp, 'root', { count: 1 }); | ||
| render(Comp, 'root', { count: 1 }); | ||
| setTimeout(() => { | ||
| document.getElementById('button').click(); | ||
| expect(document.body.innerHTML).toBe( | ||
| '<div id="root"><div class="container"><button id="button">Click Me</button><span>2</span></div></div>' | ||
| ); | ||
| }); | ||
| }); | ||
| // test('Lifecycle mounted works with getState and setState', () => { | ||
| // const Comp2 = component({ | ||
| // render: ({ state, getState, setState }) => | ||
| // h( | ||
| // 'div', | ||
| // { | ||
| // events: { | ||
| // type: 'mounted', | ||
| // action: () => { | ||
| // console.log('SHOW STATE: ', getState().show); | ||
| // setState({ show: true }); | ||
| // setTimeout( | ||
| // () => | ||
| // expect(document.getElementById('hello').innerHTML).toBe( | ||
| // 'Hello World' | ||
| // ), | ||
| // 1000 | ||
| // ); | ||
| // } | ||
| // } | ||
| // }, | ||
| // state.show && h('span', { id: 'hello' }, 'Hello World!') | ||
| // ) | ||
| // }); | ||
| // const Comp = component({ | ||
| // render: ({ state }) => h('div', { class: 'container' }, Comp2()) | ||
| // }); | ||
| // render(Comp, 'root', { show: false }); | ||
| // }); |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
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 by0.77%
227617
- Number of package files
- increased by8.33%
13
- Lines of code
- increased by10.6%
501
No dependency changes