Comparing version 0.3.4 to 0.3.5
@@ -68,2 +68,7 @@ 'use strict'; | ||
var LUCIA_COMPILE_REQUEST = '%LUCIA_COMPILE_REQUEST%'; | ||
var DIRECTIVE_SHORTHANDS; | ||
(function (DIRECTIVE_SHORTHANDS) { | ||
DIRECTIVE_SHORTHANDS["@"] = "ON"; | ||
DIRECTIVE_SHORTHANDS[":"] = "BIND"; | ||
})(DIRECTIVE_SHORTHANDS || (DIRECTIVE_SHORTHANDS = {})); | ||
@@ -77,5 +82,12 @@ var VNodeTypes; | ||
var rawDirectiveSplitPattern = /:|\./; | ||
var selectorSplitPattern = /(?=\.)|(?=#)|(?=\[)/; | ||
var keyPattern = function (key, hasThis) { | ||
if (hasThis === void 0) { hasThis = true; } | ||
return new RegExp("" + (hasThis ? 'this\\.' : '') + key + "\\b"); | ||
}; | ||
var h = function (selector, children, props) { | ||
var e_1, _a; | ||
var tokens = selector.split(/(?=\.)|(?=#)|(?=\[)/); | ||
var tokens = selector.split(selectorSplitPattern); | ||
var tag = tokens[0]; | ||
@@ -143,2 +155,5 @@ var attributes = __assign({}, props === null || props === void 0 ? void 0 : props.attributes); | ||
} | ||
else if (Object.keys(DIRECTIVE_SHORTHANDS).includes(name_1[0])) { | ||
directives[DIRECTIVE_SHORTHANDS[name_1[0]] + ":" + name_1.slice(1)] = value; | ||
} | ||
else { | ||
@@ -160,7 +175,2 @@ attributes[name_1] = value; | ||
var keyPattern = function (key, hasThis) { | ||
if (hasThis === void 0) { hasThis = true; } | ||
return new RegExp("" + (hasThis ? 'this\\.' : '') + key + "\\b"); | ||
}; | ||
var createVNode = function (el, state, children) { | ||
@@ -225,3 +235,3 @@ var _a = props(el), attributes = _a.attributes, directives = _a.directives; | ||
} | ||
if (!strip || child.outerHTML.includes(" " + DIRECTIVE_PREFIX)) { | ||
if (!strip || container.outerHTML.includes(" " + DIRECTIVE_PREFIX)) { | ||
var compiledChildren = compile(container, state, components, strip, true); | ||
@@ -466,3 +476,3 @@ try { | ||
var el = _a.el, name = _a.name, value = _a.value, state = _a.state; | ||
var rootName = name.split(/:|\./)[0]; | ||
var rootName = name.split(rawDirectiveSplitPattern)[0]; | ||
directives[rootName.toUpperCase()]({ el: el, name: name, value: value, state: state }); | ||
@@ -469,0 +479,0 @@ }; |
@@ -1,1 +0,1 @@ | ||
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=function(){return(t=Object.assign||function(t){for(var e,r=1,n=arguments.length;r<n;r++)for(var i in e=arguments[r])Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i]);return t}).apply(this,arguments)};function e(t){var e="function"==typeof Symbol&&Symbol.iterator,r=e&&t[e],n=0;if(r)return r.call(t);if(t&&"number"==typeof t.length)return{next:function(){return t&&n>=t.length&&(t=void 0),{value:t&&t[n++],done:!t}}};throw new TypeError(e?"Object is not iterable.":"Symbol.iterator is not defined.")}function r(t,e){var r="function"==typeof Symbol&&t[Symbol.iterator];if(!r)return t;var n,i,o=r.call(t),a=[];try{for(;(void 0===e||e-- >0)&&!(n=o.next()).done;)a.push(n.value)}catch(t){i={error:t}}finally{try{n&&!n.done&&(r=o.return)&&r.call(o)}finally{if(i)throw i.error}}return a}function n(){for(var t=[],e=0;e<arguments.length;e++)t=t.concat(r(arguments[e]));return t}var i;!function(t){t[t.STATIC=0]="STATIC",t[t.NEEDS_PATCH=1]="NEEDS_PATCH",t[t.DYNAMIC=2]="DYNAMIC"}(i||(i={}));var o=function(n,i,o){var a,l,s=n.split(/(?=\.)|(?=#)|(?=\[)/),u=s[0],c=t({},null==o?void 0:o.attributes),v=t({},null==o?void 0:o.directives);if(s.length>1){s.shift();try{for(var f=e(s),p=f.next();!p.done;p=f.next()){var d=p.value;switch(d[0]){case"#":c.id=d.slice(1);break;case".":c.className||(c.className=""),c.className+=d.slice(1)+" ";break;case"[":var y=r(d.slice(1,-1).split("="),2),h=y[0],m=y[1];h.startsWith("l-")?v[h.slice("l-".length)]=m:c[h]=m}}}catch(t){a={error:t}}finally{try{p&&!p.done&&(l=f.return)&&l.call(f)}finally{if(a)throw a.error}}}return c.className&&(c.className=c.className.trim()),{tag:u,children:"string"==typeof i?[i]:i||[],props:{attributes:c,directives:v,ref:(null==o?void 0:o.ref)||void 0,type:(null==o?void 0:o.type)||0}}},a=function(t){var r,i,o={},a={};if(t.attributes)try{for(var l=e(n(t.attributes)),s=l.next();!s.done;s=l.next()){var u=s.value,c=u.name,v=u.value;c.startsWith("l-")?a[c.slice("l-".length)]=v:o[c]=v}}catch(t){r={error:t}}finally{try{s&&!s.done&&(i=l.return)&&i.call(l)}finally{if(r)throw r.error}}return{attributes:o,directives:a}},l=function(t,e){return void 0===e&&(e=!0),new RegExp((e?"this\\.":"")+t+"\\b")},s=function(t,e,r){var n=a(t),s=n.attributes,u=n.directives,c=i.STATIC,v=Object.keys(u).length>0,f=Object.values(u).some((function(t){return Object.keys(e).some((function(e){return l(e,!1).test(t)}))}));return v&&(c=i.NEEDS_PATCH),f&&(c=i.DYNAMIC),o(t.tagName.toLowerCase(),r,{attributes:s,directives:u,ref:c===i.STATIC||s.id?void 0:t,type:c})},u=function(t,n,i,o,l){var v,f,p,d,y,h,m;if(void 0===n&&(n={}),void 0===i&&(i={}),void 0===o&&(o=!1),void 0===l&&(l=!1),!t)throw new Error("Please provide a Element");var b=[],T=Array.prototype.slice.call(t.childNodes);try{for(var g=e(T),A=g.next();!A.done;A=g.next()){var N=A.value;switch(N.nodeType){case Node.TEXT_NODE:!o&&N.nodeValue&&b.push(N.nodeValue);break;case Node.ELEMENT_NODE:if(Object.keys(i).includes(N.tagName)){var x=document.createElement("div"),E=i[N.tagName]({children:N.innerHTML,state:n});x.innerHTML=E;try{for(var w=(p=void 0,e(Object.entries(a(N).directives))),C=w.next();!C.done;C=w.next()){var O=r(C.value,2),$=O[0],S=O[1];null===(m=x.firstElementChild)||void 0===m||m.setAttribute("l-"+$,S)}}catch(t){p={error:t}}finally{try{C&&!C.done&&(d=w.return)&&d.call(w)}finally{if(p)throw p.error}}if(!o||N.outerHTML.includes(" l-")){var j=u(x,n,i,o,!0);try{for(var M=(y=void 0,e(j)),I=M.next();!I.done;I=M.next()){var L=I.value;b.push(L)}}catch(t){y={error:t}}finally{try{I&&!I.done&&(h=M.return)&&h.call(M)}finally{if(y)throw y.error}}}t.replaceChild(x.firstElementChild,N)}else if(!o||N.outerHTML.includes(" l-")){j=u(N,n,i,o,!0);var P=s(N,n,j);b.push(P)}}}}catch(t){v={error:t}}finally{try{A&&!A.done&&(f=g.return)&&f.call(g)}finally{if(v)throw v.error}}if(l)return b;var H=s(t,n,b);return o?c(H):H},c=function(r){var n,i,o,a,l=t({},r);l.children.filter((function(t){return"object"==typeof t&&t.props.type>0}));try{for(var s=e(r.children),u=s.next();!u.done;u=s.next()){var v=u.value;if("string"!=typeof v&&v.children.length>0)try{for(var f=(o=void 0,e(c(v).children)),p=f.next();!p.done;p=f.next()){var d=p.value;"string"!=typeof d&&(0!==d.props.type&&l.children.push(d))}}catch(t){o={error:t}}finally{try{p&&!p.done&&(a=f.return)&&a.call(f)}finally{if(o)throw o.error}}}}catch(t){n={error:t}}finally{try{u&&!u.done&&(i=s.return)&&i.call(s)}finally{if(n)throw n.error}}return l},v=function(t,e,r,i){return void 0===e&&(e={}),void 0===r&&(r={}),void 0===i&&(i=!0),(new(Function.bind.apply(Function,n([void 0],Object.keys(e),[i?"return "+t:t])))).bind(r).apply(void 0,n(Object.values(e)))},f=function(t,e,r){return void 0===r&&(r=!0),v(t,{$el:e.$el},e.$state,r)},p={BIND:function(t){var e=t.el,r=t.name,n=t.value,i=t.state;switch(r.split(":")[1]){case"class":var o=f(n,{$state:i,$el:e});if("string"==typeof o)return e.setAttribute("class",(e.className+" "+o).trim());if(o instanceof Array)return e.setAttribute("class",(e.className+" "+o.join(" ")).trim());var a=[];for(var l in o)o[l]&&a.push(l);return a.length>0?e.setAttribute("class",(e.className+" "+a.join(" ").trim()).trim()):e.className.trim().length>0?e.setAttribute("class",e.className):e.removeAttribute("class");case"style":var s=f(n,{$state:i,$el:e});for(var l in e.removeAttribute("style"),s)e.style[l]=s[l];break;default:var u=f(n,{$state:i,$el:e});u?e.setAttribute(r.split(":")[1],u):e.removeAttribute(r.split(":")[1])}},JOIN:function(e){var n=e.el,i=e.value,o=e.state,a=r(i.split(/ as | by /),3),l=a[0],s=a[1],u=a[2],c=f(l,{$state:o,$el:n});n["text"===s?"innerText":"innerHTML"]=c.join(u||""),T(t({},o)).mount(n,!0)},HTML:function(e){var r=e.el,n=e.value,i=e.state;T(t({},i)).mount(r,!0);try{r.innerHTML=f(n,{$state:i,$el:r})}catch(t){r.innerHTML=n}},IF:function(t){var e=t.el,r=t.value,n=t.state;f(r,{$state:n,$el:e})?e.style.removeProperty("display"):e.style.display="none"},MODEL:function(t){var e=t.el,r=t.value,n=t.state,i=e,o=f(r,{$state:n,$el:i});i.value!==o&&(i.value=o),i.oninput=function(){var t,e="number"==typeof o&&!isNaN(i.value),a="boolean"==typeof o&&("true"===i.value||"false"===i.value),l=null==o&&("null"===i.value||"undefined"===i.value);t=e?"Number('"+i.value+"').toPrecision()":a?"Boolean('"+i.value+"')":l?"null"===i.value?null:void 0:"'"+i.value+"'",f(r+" = "+t,{$state:n,$el:i},!1)}},ON:function(t){var e=t.el,n=t.name,i=t.value,o=t.state,a=r(n.split("."),2),l=a[0],s=a[1],u=l.split(":")[1],c=s||null;e["on"+u]=function(t){"prevent"===c&&t.preventDefault(),"stop"===c&&t.stopPropagation(),f(i,{$state:o,$el:e},!1)}},TEXT:function(t){var e=t.el,r=t.value,n=t.state;try{e.innerHTML=f(r,{$state:n,$el:e})}catch(t){e.innerHTML=r}}},d=function(t,e){var r=t.el,n=t.name,i=t.value,o=t.state;e[n.split(/:|\./)[0].toUpperCase()]({el:r,name:n,value:i,state:o})},y=function(t,e,r,n){if("length"===e){var i=Object.keys(r).filter((function(e){return r[e]instanceof Array&&(n=t,i=r[e],n instanceof Array&&i instanceof Array&&n.length===i.length&&n.every((function(t,e){return t===i[e]})));var n,i}));return 0!==i.length&&n(i),!0}return n([e]),!1},h=function(t,e){var r={get:function(t,e){return"object"==typeof t[e]&&null!==t[e]?new Proxy(t[e],r):t[e]},set:function(r,n,i){return r[n]=i,y(r,n,t,e),!0},deleteProperty:function(r,n){return delete r[n],y(r,n,t,e),!0}};return new Proxy(t,r)},m=function(r,n,o,a){var s,u;void 0===n&&(n={}),void 0===o&&(o={});var c=!1;if(r){a||(a=Object.keys(n)),"%LUCIA_COMPILE_REQUEST%"===a[0]&&(c=!0);var v=function(e){if("string"==typeof e)return"continue";if(e.props.type>i.STATIC){var r=e.props,s=r.attributes,u=r.directives,v=r.ref,f=r.type,p=[];if(!c){var y=function(t){var e=u[t],r=1===f,i=a.some((function(t){return l(t).test(e.toString())})),o=Object.keys(n).some((function(t){var e=a.some((function(e){return l(e).test(n[t].toString())}));return"function"==typeof n[t]&&e}));(r||i||o)&&p.push(t)};for(var h in u)y(h)}e.props.type=f===i.NEEDS_PATCH?i.STATIC:f,(c?Object.keys(u):p).map((function(e){var r=u[e],i=s.id?document.getElementById(s.id):v;d({el:i,name:e,value:r,state:n},t({},o))}))}e.children.length>0&&m(e,n,o,a)};try{for(var f=e(r.children),p=f.next();!p.done;p=f.next()){v(p.value)}}catch(t){s={error:t}}finally{try{p&&!p.done&&(u=f.return)&&u.call(f)}finally{if(s)throw s.error}}}},b=function(){function t(t){void 0===t&&(t={}),this.vdom=null,this.state=t,this.directives={},this.components={},this.mounted=!1}return t.prototype.mount=function(t,e){return void 0===e&&(e=!1),this.vdom=this.compile("string"==typeof t?document.querySelector(t):t),e||(this.state=h(this.state,this.patch.bind(this)),this.directives=p),this.mounted=!0,this.patch(["%LUCIA_COMPILE_REQUEST%"]),this.state},t.prototype.component=function(t,e){this.components[t.toUpperCase()]=e},t.prototype.directive=function(t,e){this.directives[t.toUpperCase()]=e},t.prototype.patch=function(t){if(!this.mounted)throw new Error("App is not mounted.");m(this.vdom,this.state,this.directives,t)},t.prototype.compile=function(t){return u(t,this.state,this.components,!0)},t}(),T=function(t){return new b(t)};exports.compile=u,exports.createApp=T,exports.directives=p,exports.h=o,exports.init=function(t,e){void 0===t&&(t=document),void 0===e&&(e="use");var r=n(t.querySelectorAll("[l-"+e+"]")),i=[];return r.map((function(t){var r=t.getAttribute("l-"+e);if(null!==r)try{var n=T(v(r));n.mount(t),i.push(n)}catch(t){}})),i},exports.patch=m,exports.reactive=h,exports.renderDirective=d; | ||
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=function(){return(e=Object.assign||function(e){for(var t,r=1,n=arguments.length;r<n;r++)for(var i in t=arguments[r])Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i]);return e}).apply(this,arguments)};function t(e){var t="function"==typeof Symbol&&Symbol.iterator,r=t&&e[t],n=0;if(r)return r.call(e);if(e&&"number"==typeof e.length)return{next:function(){return e&&n>=e.length&&(e=void 0),{value:e&&e[n++],done:!e}}};throw new TypeError(t?"Object is not iterable.":"Symbol.iterator is not defined.")}function r(e,t){var r="function"==typeof Symbol&&e[Symbol.iterator];if(!r)return e;var n,i,o=r.call(e),a=[];try{for(;(void 0===t||t-- >0)&&!(n=o.next()).done;)a.push(n.value)}catch(e){i={error:e}}finally{try{n&&!n.done&&(r=o.return)&&r.call(o)}finally{if(i)throw i.error}}return a}function n(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(r(arguments[t]));return e}var i,o;!function(e){e["@"]="ON",e[":"]="BIND"}(i||(i={})),function(e){e[e.STATIC=0]="STATIC",e[e.NEEDS_PATCH=1]="NEEDS_PATCH",e[e.DYNAMIC=2]="DYNAMIC"}(o||(o={}));var a=/:|\./,l=/(?=\.)|(?=#)|(?=\[)/,s=function(e,t){return void 0===t&&(t=!0),new RegExp((t?"this\\.":"")+e+"\\b")},u=function(n,i,o){var a,s,u=n.split(l),c=u[0],v=e({},null==o?void 0:o.attributes),f=e({},null==o?void 0:o.directives);if(u.length>1){u.shift();try{for(var p=t(u),d=p.next();!d.done;d=p.next()){var y=d.value;switch(y[0]){case"#":v.id=y.slice(1);break;case".":v.className||(v.className=""),v.className+=y.slice(1)+" ";break;case"[":var h=r(y.slice(1,-1).split("="),2),m=h[0],b=h[1];m.startsWith("l-")?f[m.slice("l-".length)]=b:v[m]=b}}}catch(e){a={error:e}}finally{try{d&&!d.done&&(s=p.return)&&s.call(p)}finally{if(a)throw a.error}}}return v.className&&(v.className=v.className.trim()),{tag:c,children:"string"==typeof i?[i]:i||[],props:{attributes:v,directives:f,ref:(null==o?void 0:o.ref)||void 0,type:(null==o?void 0:o.type)||0}}},c=function(e){var r,o,a={},l={};if(e.attributes)try{for(var s=t(n(e.attributes)),u=s.next();!u.done;u=s.next()){var c=u.value,v=c.name,f=c.value;v.startsWith("l-")?l[v.slice("l-".length)]=f:Object.keys(i).includes(v[0])?l[i[v[0]]+":"+v.slice(1)]=f:a[v]=f}}catch(e){r={error:e}}finally{try{u&&!u.done&&(o=s.return)&&o.call(s)}finally{if(r)throw r.error}}return{attributes:a,directives:l}},v=function(e,t,r){var n=c(e),i=n.attributes,a=n.directives,l=o.STATIC,v=Object.keys(a).length>0,f=Object.values(a).some((function(e){return Object.keys(t).some((function(t){return s(t,!1).test(e)}))}));return v&&(l=o.NEEDS_PATCH),f&&(l=o.DYNAMIC),u(e.tagName.toLowerCase(),r,{attributes:i,directives:a,ref:l===o.STATIC||i.id?void 0:e,type:l})},f=function(e,n,i,o,a){var l,s,u,d,y,h,m;if(void 0===n&&(n={}),void 0===i&&(i={}),void 0===o&&(o=!1),void 0===a&&(a=!1),!e)throw new Error("Please provide a Element");var b=[],T=Array.prototype.slice.call(e.childNodes);try{for(var N=t(T),g=N.next();!g.done;g=N.next()){var A=g.value;switch(A.nodeType){case Node.TEXT_NODE:!o&&A.nodeValue&&b.push(A.nodeValue);break;case Node.ELEMENT_NODE:if(Object.keys(i).includes(A.tagName)){var x=document.createElement("div"),E=i[A.tagName]({children:A.innerHTML,state:n});x.innerHTML=E;try{for(var w=(u=void 0,t(Object.entries(c(A).directives))),O=w.next();!O.done;O=w.next()){var C=r(O.value,2),$=C[0],j=C[1];null===(m=x.firstElementChild)||void 0===m||m.setAttribute("l-"+$,j)}}catch(e){u={error:e}}finally{try{O&&!O.done&&(d=w.return)&&d.call(w)}finally{if(u)throw u.error}}if(!o||x.outerHTML.includes(" l-")){var S=f(x,n,i,o,!0);try{for(var I=(y=void 0,t(S)),M=I.next();!M.done;M=I.next()){var L=M.value;b.push(L)}}catch(e){y={error:e}}finally{try{M&&!M.done&&(h=I.return)&&h.call(I)}finally{if(y)throw y.error}}}e.replaceChild(x.firstElementChild,A)}else if(!o||A.outerHTML.includes(" l-")){S=f(A,n,i,o,!0);var P=v(A,n,S);b.push(P)}}}}catch(e){l={error:e}}finally{try{g&&!g.done&&(s=N.return)&&s.call(N)}finally{if(l)throw l.error}}if(a)return b;var D=v(e,n,b);return o?p(D):D},p=function(r){var n,i,o,a,l=e({},r);l.children.filter((function(e){return"object"==typeof e&&e.props.type>0}));try{for(var s=t(r.children),u=s.next();!u.done;u=s.next()){var c=u.value;if("string"!=typeof c&&c.children.length>0)try{for(var v=(o=void 0,t(p(c).children)),f=v.next();!f.done;f=v.next()){var d=f.value;"string"!=typeof d&&(0!==d.props.type&&l.children.push(d))}}catch(e){o={error:e}}finally{try{f&&!f.done&&(a=v.return)&&a.call(v)}finally{if(o)throw o.error}}}}catch(e){n={error:e}}finally{try{u&&!u.done&&(i=s.return)&&i.call(s)}finally{if(n)throw n.error}}return l},d=function(e,t,r,i){return void 0===t&&(t={}),void 0===r&&(r={}),void 0===i&&(i=!0),(new(Function.bind.apply(Function,n([void 0],Object.keys(t),[i?"return "+e:e])))).bind(r).apply(void 0,n(Object.values(t)))},y=function(e,t,r){return void 0===r&&(r=!0),d(e,{$el:t.$el},t.$state,r)},h={BIND:function(e){var t=e.el,r=e.name,n=e.value,i=e.state;switch(r.split(":")[1]){case"class":var o=y(n,{$state:i,$el:t});if("string"==typeof o)return t.setAttribute("class",(t.className+" "+o).trim());if(o instanceof Array)return t.setAttribute("class",(t.className+" "+o.join(" ")).trim());var a=[];for(var l in o)o[l]&&a.push(l);return a.length>0?t.setAttribute("class",(t.className+" "+a.join(" ").trim()).trim()):t.className.trim().length>0?t.setAttribute("class",t.className):t.removeAttribute("class");case"style":var s=y(n,{$state:i,$el:t});for(var l in t.removeAttribute("style"),s)t.style[l]=s[l];break;default:var u=y(n,{$state:i,$el:t});u?t.setAttribute(r.split(":")[1],u):t.removeAttribute(r.split(":")[1])}},JOIN:function(t){var n=t.el,i=t.value,o=t.state,a=r(i.split(/ as | by /),3),l=a[0],s=a[1],u=a[2],c=y(l,{$state:o,$el:n});n["text"===s?"innerText":"innerHTML"]=c.join(u||""),A(e({},o)).mount(n,!0)},HTML:function(t){var r=t.el,n=t.value,i=t.state;A(e({},i)).mount(r,!0);try{r.innerHTML=y(n,{$state:i,$el:r})}catch(e){r.innerHTML=n}},IF:function(e){var t=e.el,r=e.value,n=e.state;y(r,{$state:n,$el:t})?t.style.removeProperty("display"):t.style.display="none"},MODEL:function(e){var t=e.el,r=e.value,n=e.state,i=t,o=y(r,{$state:n,$el:i});i.value!==o&&(i.value=o),i.oninput=function(){var e,t="number"==typeof o&&!isNaN(i.value),a="boolean"==typeof o&&("true"===i.value||"false"===i.value),l=null==o&&("null"===i.value||"undefined"===i.value);e=t?"Number('"+i.value+"').toPrecision()":a?"Boolean('"+i.value+"')":l?"null"===i.value?null:void 0:"'"+i.value+"'",y(r+" = "+e,{$state:n,$el:i},!1)}},ON:function(e){var t=e.el,n=e.name,i=e.value,o=e.state,a=r(n.split("."),2),l=a[0],s=a[1],u=l.split(":")[1],c=s||null;t["on"+u]=function(e){"prevent"===c&&e.preventDefault(),"stop"===c&&e.stopPropagation(),y(i,{$state:o,$el:t},!1)}},TEXT:function(e){var t=e.el,r=e.value,n=e.state;try{t.innerHTML=y(r,{$state:n,$el:t})}catch(e){t.innerHTML=r}}},m=function(e,t){var r=e.el,n=e.name,i=e.value,o=e.state;t[n.split(a)[0].toUpperCase()]({el:r,name:n,value:i,state:o})},b=function(e,t,r,n){if("length"===t){var i=Object.keys(r).filter((function(t){return r[t]instanceof Array&&(n=e,i=r[t],n instanceof Array&&i instanceof Array&&n.length===i.length&&n.every((function(e,t){return e===i[t]})));var n,i}));return 0!==i.length&&n(i),!0}return n([t]),!1},T=function(e,t){var r={get:function(e,t){return"object"==typeof e[t]&&null!==e[t]?new Proxy(e[t],r):e[t]},set:function(r,n,i){return r[n]=i,b(r,n,e,t),!0},deleteProperty:function(r,n){return delete r[n],b(r,n,e,t),!0}};return new Proxy(e,r)},N=function(r,n,i,a){var l,u;void 0===n&&(n={}),void 0===i&&(i={});var c=!1;if(r){a||(a=Object.keys(n)),"%LUCIA_COMPILE_REQUEST%"===a[0]&&(c=!0);var v=function(t){if("string"==typeof t)return"continue";if(t.props.type>o.STATIC){var r=t.props,l=r.attributes,u=r.directives,v=r.ref,f=r.type,p=[];if(!c){var d=function(e){var t=u[e],r=1===f,i=a.some((function(e){return s(e).test(t.toString())})),o=Object.keys(n).some((function(e){var t=a.some((function(t){return s(t).test(n[e].toString())}));return"function"==typeof n[e]&&t}));(r||i||o)&&p.push(e)};for(var y in u)d(y)}t.props.type=f===o.NEEDS_PATCH?o.STATIC:f,(c?Object.keys(u):p).map((function(t){var r=u[t],o=l.id?document.getElementById(l.id):v;m({el:o,name:t,value:r,state:n},e({},i))}))}t.children.length>0&&N(t,n,i,a)};try{for(var f=t(r.children),p=f.next();!p.done;p=f.next()){v(p.value)}}catch(e){l={error:e}}finally{try{p&&!p.done&&(u=f.return)&&u.call(f)}finally{if(l)throw l.error}}}},g=function(){function e(e){void 0===e&&(e={}),this.vdom=null,this.state=e,this.directives={},this.components={},this.mounted=!1}return e.prototype.mount=function(e,t){return void 0===t&&(t=!1),this.vdom=this.compile("string"==typeof e?document.querySelector(e):e),t||(this.state=T(this.state,this.patch.bind(this)),this.directives=h),this.mounted=!0,this.patch(["%LUCIA_COMPILE_REQUEST%"]),this.state},e.prototype.component=function(e,t){this.components[e.toUpperCase()]=t},e.prototype.directive=function(e,t){this.directives[e.toUpperCase()]=t},e.prototype.patch=function(e){if(!this.mounted)throw new Error("App is not mounted.");N(this.vdom,this.state,this.directives,e)},e.prototype.compile=function(e){return f(e,this.state,this.components,!0)},e}(),A=function(e){return new g(e)};exports.compile=f,exports.createApp=A,exports.directives=h,exports.h=u,exports.init=function(e,t){void 0===e&&(e=document),void 0===t&&(t="use");var r=n(e.querySelectorAll("[l-"+t+"]")),i=[];return r.map((function(e){var r=e.getAttribute("l-"+t);if(null!==r)try{var n=A(d(r));n.mount(e),i.push(n)}catch(e){}})),i},exports.patch=N,exports.reactive=T,exports.renderDirective=m; |
@@ -64,2 +64,7 @@ /*! ***************************************************************************** | ||
var LUCIA_COMPILE_REQUEST = '%LUCIA_COMPILE_REQUEST%'; | ||
var DIRECTIVE_SHORTHANDS; | ||
(function (DIRECTIVE_SHORTHANDS) { | ||
DIRECTIVE_SHORTHANDS["@"] = "ON"; | ||
DIRECTIVE_SHORTHANDS[":"] = "BIND"; | ||
})(DIRECTIVE_SHORTHANDS || (DIRECTIVE_SHORTHANDS = {})); | ||
@@ -73,5 +78,12 @@ var VNodeTypes; | ||
var rawDirectiveSplitPattern = /:|\./; | ||
var selectorSplitPattern = /(?=\.)|(?=#)|(?=\[)/; | ||
var keyPattern = function (key, hasThis) { | ||
if (hasThis === void 0) { hasThis = true; } | ||
return new RegExp("" + (hasThis ? 'this\\.' : '') + key + "\\b"); | ||
}; | ||
var h = function (selector, children, props) { | ||
var e_1, _a; | ||
var tokens = selector.split(/(?=\.)|(?=#)|(?=\[)/); | ||
var tokens = selector.split(selectorSplitPattern); | ||
var tag = tokens[0]; | ||
@@ -139,2 +151,5 @@ var attributes = __assign({}, props === null || props === void 0 ? void 0 : props.attributes); | ||
} | ||
else if (Object.keys(DIRECTIVE_SHORTHANDS).includes(name_1[0])) { | ||
directives[DIRECTIVE_SHORTHANDS[name_1[0]] + ":" + name_1.slice(1)] = value; | ||
} | ||
else { | ||
@@ -156,7 +171,2 @@ attributes[name_1] = value; | ||
var keyPattern = function (key, hasThis) { | ||
if (hasThis === void 0) { hasThis = true; } | ||
return new RegExp("" + (hasThis ? 'this\\.' : '') + key + "\\b"); | ||
}; | ||
var createVNode = function (el, state, children) { | ||
@@ -221,3 +231,3 @@ var _a = props(el), attributes = _a.attributes, directives = _a.directives; | ||
} | ||
if (!strip || child.outerHTML.includes(" " + DIRECTIVE_PREFIX)) { | ||
if (!strip || container.outerHTML.includes(" " + DIRECTIVE_PREFIX)) { | ||
var compiledChildren = compile(container, state, components, strip, true); | ||
@@ -462,3 +472,3 @@ try { | ||
var el = _a.el, name = _a.name, value = _a.value, state = _a.state; | ||
var rootName = name.split(/:|\./)[0]; | ||
var rootName = name.split(rawDirectiveSplitPattern)[0]; | ||
directives[rootName.toUpperCase()]({ el: el, name: name, value: value, state: state }); | ||
@@ -465,0 +475,0 @@ }; |
@@ -1,1 +0,1 @@ | ||
var t=function(){return(t=Object.assign||function(t){for(var e,r=1,n=arguments.length;r<n;r++)for(var i in e=arguments[r])Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i]);return t}).apply(this,arguments)};function e(t){var e="function"==typeof Symbol&&Symbol.iterator,r=e&&t[e],n=0;if(r)return r.call(t);if(t&&"number"==typeof t.length)return{next:function(){return t&&n>=t.length&&(t=void 0),{value:t&&t[n++],done:!t}}};throw new TypeError(e?"Object is not iterable.":"Symbol.iterator is not defined.")}function r(t,e){var r="function"==typeof Symbol&&t[Symbol.iterator];if(!r)return t;var n,i,o=r.call(t),a=[];try{for(;(void 0===e||e-- >0)&&!(n=o.next()).done;)a.push(n.value)}catch(t){i={error:t}}finally{try{n&&!n.done&&(r=o.return)&&r.call(o)}finally{if(i)throw i.error}}return a}function n(){for(var t=[],e=0;e<arguments.length;e++)t=t.concat(r(arguments[e]));return t}var i;!function(t){t[t.STATIC=0]="STATIC",t[t.NEEDS_PATCH=1]="NEEDS_PATCH",t[t.DYNAMIC=2]="DYNAMIC"}(i||(i={}));var o=function(n,i,o){var a,l,s=n.split(/(?=\.)|(?=#)|(?=\[)/),u=s[0],c=t({},null==o?void 0:o.attributes),v=t({},null==o?void 0:o.directives);if(s.length>1){s.shift();try{for(var f=e(s),d=f.next();!d.done;d=f.next()){var y=d.value;switch(y[0]){case"#":c.id=y.slice(1);break;case".":c.className||(c.className=""),c.className+=y.slice(1)+" ";break;case"[":var p=r(y.slice(1,-1).split("="),2),h=p[0],m=p[1];h.startsWith("l-")?v[h.slice("l-".length)]=m:c[h]=m}}}catch(t){a={error:t}}finally{try{d&&!d.done&&(l=f.return)&&l.call(f)}finally{if(a)throw a.error}}}return c.className&&(c.className=c.className.trim()),{tag:u,children:"string"==typeof i?[i]:i||[],props:{attributes:c,directives:v,ref:(null==o?void 0:o.ref)||void 0,type:(null==o?void 0:o.type)||0}}},a=function(t){var r,i,o={},a={};if(t.attributes)try{for(var l=e(n(t.attributes)),s=l.next();!s.done;s=l.next()){var u=s.value,c=u.name,v=u.value;c.startsWith("l-")?a[c.slice("l-".length)]=v:o[c]=v}}catch(t){r={error:t}}finally{try{s&&!s.done&&(i=l.return)&&i.call(l)}finally{if(r)throw r.error}}return{attributes:o,directives:a}},l=function(t,e){return void 0===e&&(e=!0),new RegExp((e?"this\\.":"")+t+"\\b")},s=function(t,e,r){var n=a(t),s=n.attributes,u=n.directives,c=i.STATIC,v=Object.keys(u).length>0,f=Object.values(u).some((function(t){return Object.keys(e).some((function(e){return l(e,!1).test(t)}))}));return v&&(c=i.NEEDS_PATCH),f&&(c=i.DYNAMIC),o(t.tagName.toLowerCase(),r,{attributes:s,directives:u,ref:c===i.STATIC||s.id?void 0:t,type:c})},u=function(t,n,i,o,l){var v,f,d,y,p,h,m;if(void 0===n&&(n={}),void 0===i&&(i={}),void 0===o&&(o=!1),void 0===l&&(l=!1),!t)throw new Error("Please provide a Element");var b=[],T=Array.prototype.slice.call(t.childNodes);try{for(var g=e(T),N=g.next();!N.done;N=g.next()){var A=N.value;switch(A.nodeType){case Node.TEXT_NODE:!o&&A.nodeValue&&b.push(A.nodeValue);break;case Node.ELEMENT_NODE:if(Object.keys(i).includes(A.tagName)){var E=document.createElement("div"),w=i[A.tagName]({children:A.innerHTML,state:n});E.innerHTML=w;try{for(var x=(d=void 0,e(Object.entries(a(A).directives))),C=x.next();!C.done;C=x.next()){var $=r(C.value,2),O=$[0],S=$[1];null===(m=E.firstElementChild)||void 0===m||m.setAttribute("l-"+O,S)}}catch(t){d={error:t}}finally{try{C&&!C.done&&(y=x.return)&&y.call(x)}finally{if(d)throw d.error}}if(!o||A.outerHTML.includes(" l-")){var j=u(E,n,i,o,!0);try{for(var I=(p=void 0,e(j)),L=I.next();!L.done;L=I.next()){var M=L.value;b.push(M)}}catch(t){p={error:t}}finally{try{L&&!L.done&&(h=I.return)&&h.call(I)}finally{if(p)throw p.error}}}t.replaceChild(E.firstElementChild,A)}else if(!o||A.outerHTML.includes(" l-")){j=u(A,n,i,o,!0);var H=s(A,n,j);b.push(H)}}}}catch(t){v={error:t}}finally{try{N&&!N.done&&(f=g.return)&&f.call(g)}finally{if(v)throw v.error}}if(l)return b;var P=s(t,n,b);return o?c(P):P},c=function(r){var n,i,o,a,l=t({},r);l.children.filter((function(t){return"object"==typeof t&&t.props.type>0}));try{for(var s=e(r.children),u=s.next();!u.done;u=s.next()){var v=u.value;if("string"!=typeof v&&v.children.length>0)try{for(var f=(o=void 0,e(c(v).children)),d=f.next();!d.done;d=f.next()){var y=d.value;"string"!=typeof y&&(0!==y.props.type&&l.children.push(y))}}catch(t){o={error:t}}finally{try{d&&!d.done&&(a=f.return)&&a.call(f)}finally{if(o)throw o.error}}}}catch(t){n={error:t}}finally{try{u&&!u.done&&(i=s.return)&&i.call(s)}finally{if(n)throw n.error}}return l},v=function(t,e,r,i){return void 0===e&&(e={}),void 0===r&&(r={}),void 0===i&&(i=!0),(new(Function.bind.apply(Function,n([void 0],Object.keys(e),[i?"return "+t:t])))).bind(r).apply(void 0,n(Object.values(e)))},f=function(t,e,r){return void 0===r&&(r=!0),v(t,{$el:e.$el},e.$state,r)},d={BIND:function(t){var e=t.el,r=t.name,n=t.value,i=t.state;switch(r.split(":")[1]){case"class":var o=f(n,{$state:i,$el:e});if("string"==typeof o)return e.setAttribute("class",(e.className+" "+o).trim());if(o instanceof Array)return e.setAttribute("class",(e.className+" "+o.join(" ")).trim());var a=[];for(var l in o)o[l]&&a.push(l);return a.length>0?e.setAttribute("class",(e.className+" "+a.join(" ").trim()).trim()):e.className.trim().length>0?e.setAttribute("class",e.className):e.removeAttribute("class");case"style":var s=f(n,{$state:i,$el:e});for(var l in e.removeAttribute("style"),s)e.style[l]=s[l];break;default:var u=f(n,{$state:i,$el:e});u?e.setAttribute(r.split(":")[1],u):e.removeAttribute(r.split(":")[1])}},JOIN:function(e){var n=e.el,i=e.value,o=e.state,a=r(i.split(/ as | by /),3),l=a[0],s=a[1],u=a[2],c=f(l,{$state:o,$el:n});n["text"===s?"innerText":"innerHTML"]=c.join(u||""),T(t({},o)).mount(n,!0)},HTML:function(e){var r=e.el,n=e.value,i=e.state;T(t({},i)).mount(r,!0);try{r.innerHTML=f(n,{$state:i,$el:r})}catch(t){r.innerHTML=n}},IF:function(t){var e=t.el,r=t.value,n=t.state;f(r,{$state:n,$el:e})?e.style.removeProperty("display"):e.style.display="none"},MODEL:function(t){var e=t.el,r=t.value,n=t.state,i=e,o=f(r,{$state:n,$el:i});i.value!==o&&(i.value=o),i.oninput=function(){var t,e="number"==typeof o&&!isNaN(i.value),a="boolean"==typeof o&&("true"===i.value||"false"===i.value),l=null==o&&("null"===i.value||"undefined"===i.value);t=e?"Number('"+i.value+"').toPrecision()":a?"Boolean('"+i.value+"')":l?"null"===i.value?null:void 0:"'"+i.value+"'",f(r+" = "+t,{$state:n,$el:i},!1)}},ON:function(t){var e=t.el,n=t.name,i=t.value,o=t.state,a=r(n.split("."),2),l=a[0],s=a[1],u=l.split(":")[1],c=s||null;e["on"+u]=function(t){"prevent"===c&&t.preventDefault(),"stop"===c&&t.stopPropagation(),f(i,{$state:o,$el:e},!1)}},TEXT:function(t){var e=t.el,r=t.value,n=t.state;try{e.innerHTML=f(r,{$state:n,$el:e})}catch(t){e.innerHTML=r}}},y=function(t,e){var r=t.el,n=t.name,i=t.value,o=t.state;e[n.split(/:|\./)[0].toUpperCase()]({el:r,name:n,value:i,state:o})},p=function(t,e,r,n){if("length"===e){var i=Object.keys(r).filter((function(e){return r[e]instanceof Array&&(n=t,i=r[e],n instanceof Array&&i instanceof Array&&n.length===i.length&&n.every((function(t,e){return t===i[e]})));var n,i}));return 0!==i.length&&n(i),!0}return n([e]),!1},h=function(t,e){var r={get:function(t,e){return"object"==typeof t[e]&&null!==t[e]?new Proxy(t[e],r):t[e]},set:function(r,n,i){return r[n]=i,p(r,n,t,e),!0},deleteProperty:function(r,n){return delete r[n],p(r,n,t,e),!0}};return new Proxy(t,r)},m=function(r,n,o,a){var s,u;void 0===n&&(n={}),void 0===o&&(o={});var c=!1;if(r){a||(a=Object.keys(n)),"%LUCIA_COMPILE_REQUEST%"===a[0]&&(c=!0);var v=function(e){if("string"==typeof e)return"continue";if(e.props.type>i.STATIC){var r=e.props,s=r.attributes,u=r.directives,v=r.ref,f=r.type,d=[];if(!c){var p=function(t){var e=u[t],r=1===f,i=a.some((function(t){return l(t).test(e.toString())})),o=Object.keys(n).some((function(t){var e=a.some((function(e){return l(e).test(n[t].toString())}));return"function"==typeof n[t]&&e}));(r||i||o)&&d.push(t)};for(var h in u)p(h)}e.props.type=f===i.NEEDS_PATCH?i.STATIC:f,(c?Object.keys(u):d).map((function(e){var r=u[e],i=s.id?document.getElementById(s.id):v;y({el:i,name:e,value:r,state:n},t({},o))}))}e.children.length>0&&m(e,n,o,a)};try{for(var f=e(r.children),d=f.next();!d.done;d=f.next()){v(d.value)}}catch(t){s={error:t}}finally{try{d&&!d.done&&(u=f.return)&&u.call(f)}finally{if(s)throw s.error}}}},b=function(){function t(t){void 0===t&&(t={}),this.vdom=null,this.state=t,this.directives={},this.components={},this.mounted=!1}return t.prototype.mount=function(t,e){return void 0===e&&(e=!1),this.vdom=this.compile("string"==typeof t?document.querySelector(t):t),e||(this.state=h(this.state,this.patch.bind(this)),this.directives=d),this.mounted=!0,this.patch(["%LUCIA_COMPILE_REQUEST%"]),this.state},t.prototype.component=function(t,e){this.components[t.toUpperCase()]=e},t.prototype.directive=function(t,e){this.directives[t.toUpperCase()]=e},t.prototype.patch=function(t){if(!this.mounted)throw new Error("App is not mounted.");m(this.vdom,this.state,this.directives,t)},t.prototype.compile=function(t){return u(t,this.state,this.components,!0)},t}(),T=function(t){return new b(t)},g=function(t,e){void 0===t&&(t=document),void 0===e&&(e="use");var r=n(t.querySelectorAll("[l-"+e+"]")),i=[];return r.map((function(t){var r=t.getAttribute("l-"+e);if(null!==r)try{var n=T(v(r));n.mount(t),i.push(n)}catch(t){}})),i};export{u as compile,T as createApp,d as directives,o as h,g as init,m as patch,h as reactive,y as renderDirective}; | ||
var t=function(){return(t=Object.assign||function(t){for(var e,r=1,n=arguments.length;r<n;r++)for(var i in e=arguments[r])Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i]);return t}).apply(this,arguments)};function e(t){var e="function"==typeof Symbol&&Symbol.iterator,r=e&&t[e],n=0;if(r)return r.call(t);if(t&&"number"==typeof t.length)return{next:function(){return t&&n>=t.length&&(t=void 0),{value:t&&t[n++],done:!t}}};throw new TypeError(e?"Object is not iterable.":"Symbol.iterator is not defined.")}function r(t,e){var r="function"==typeof Symbol&&t[Symbol.iterator];if(!r)return t;var n,i,o=r.call(t),a=[];try{for(;(void 0===e||e-- >0)&&!(n=o.next()).done;)a.push(n.value)}catch(t){i={error:t}}finally{try{n&&!n.done&&(r=o.return)&&r.call(o)}finally{if(i)throw i.error}}return a}function n(){for(var t=[],e=0;e<arguments.length;e++)t=t.concat(r(arguments[e]));return t}var i,o;!function(t){t["@"]="ON",t[":"]="BIND"}(i||(i={})),function(t){t[t.STATIC=0]="STATIC",t[t.NEEDS_PATCH=1]="NEEDS_PATCH",t[t.DYNAMIC=2]="DYNAMIC"}(o||(o={}));var a=/:|\./,l=/(?=\.)|(?=#)|(?=\[)/,s=function(t,e){return void 0===e&&(e=!0),new RegExp((e?"this\\.":"")+t+"\\b")},u=function(n,i,o){var a,s,u=n.split(l),c=u[0],v=t({},null==o?void 0:o.attributes),f=t({},null==o?void 0:o.directives);if(u.length>1){u.shift();try{for(var d=e(u),y=d.next();!y.done;y=d.next()){var p=y.value;switch(p[0]){case"#":v.id=p.slice(1);break;case".":v.className||(v.className=""),v.className+=p.slice(1)+" ";break;case"[":var h=r(p.slice(1,-1).split("="),2),m=h[0],b=h[1];m.startsWith("l-")?f[m.slice("l-".length)]=b:v[m]=b}}}catch(t){a={error:t}}finally{try{y&&!y.done&&(s=d.return)&&s.call(d)}finally{if(a)throw a.error}}}return v.className&&(v.className=v.className.trim()),{tag:c,children:"string"==typeof i?[i]:i||[],props:{attributes:v,directives:f,ref:(null==o?void 0:o.ref)||void 0,type:(null==o?void 0:o.type)||0}}},c=function(t){var r,o,a={},l={};if(t.attributes)try{for(var s=e(n(t.attributes)),u=s.next();!u.done;u=s.next()){var c=u.value,v=c.name,f=c.value;v.startsWith("l-")?l[v.slice("l-".length)]=f:Object.keys(i).includes(v[0])?l[i[v[0]]+":"+v.slice(1)]=f:a[v]=f}}catch(t){r={error:t}}finally{try{u&&!u.done&&(o=s.return)&&o.call(s)}finally{if(r)throw r.error}}return{attributes:a,directives:l}},v=function(t,e,r){var n=c(t),i=n.attributes,a=n.directives,l=o.STATIC,v=Object.keys(a).length>0,f=Object.values(a).some((function(t){return Object.keys(e).some((function(e){return s(e,!1).test(t)}))}));return v&&(l=o.NEEDS_PATCH),f&&(l=o.DYNAMIC),u(t.tagName.toLowerCase(),r,{attributes:i,directives:a,ref:l===o.STATIC||i.id?void 0:t,type:l})},f=function(t,n,i,o,a){var l,s,u,y,p,h,m;if(void 0===n&&(n={}),void 0===i&&(i={}),void 0===o&&(o=!1),void 0===a&&(a=!1),!t)throw new Error("Please provide a Element");var b=[],T=Array.prototype.slice.call(t.childNodes);try{for(var N=e(T),g=N.next();!g.done;g=N.next()){var A=g.value;switch(A.nodeType){case Node.TEXT_NODE:!o&&A.nodeValue&&b.push(A.nodeValue);break;case Node.ELEMENT_NODE:if(Object.keys(i).includes(A.tagName)){var E=document.createElement("div"),w=i[A.tagName]({children:A.innerHTML,state:n});E.innerHTML=w;try{for(var x=(u=void 0,e(Object.entries(c(A).directives))),C=x.next();!C.done;C=x.next()){var O=r(C.value,2),$=O[0],S=O[1];null===(m=E.firstElementChild)||void 0===m||m.setAttribute("l-"+$,S)}}catch(t){u={error:t}}finally{try{C&&!C.done&&(y=x.return)&&y.call(x)}finally{if(u)throw u.error}}if(!o||E.outerHTML.includes(" l-")){var j=f(E,n,i,o,!0);try{for(var I=(p=void 0,e(j)),L=I.next();!L.done;L=I.next()){var M=L.value;b.push(M)}}catch(t){p={error:t}}finally{try{L&&!L.done&&(h=I.return)&&h.call(I)}finally{if(p)throw p.error}}}t.replaceChild(E.firstElementChild,A)}else if(!o||A.outerHTML.includes(" l-")){j=f(A,n,i,o,!0);var H=v(A,n,j);b.push(H)}}}}catch(t){l={error:t}}finally{try{g&&!g.done&&(s=N.return)&&s.call(N)}finally{if(l)throw l.error}}if(a)return b;var P=v(t,n,b);return o?d(P):P},d=function(r){var n,i,o,a,l=t({},r);l.children.filter((function(t){return"object"==typeof t&&t.props.type>0}));try{for(var s=e(r.children),u=s.next();!u.done;u=s.next()){var c=u.value;if("string"!=typeof c&&c.children.length>0)try{for(var v=(o=void 0,e(d(c).children)),f=v.next();!f.done;f=v.next()){var y=f.value;"string"!=typeof y&&(0!==y.props.type&&l.children.push(y))}}catch(t){o={error:t}}finally{try{f&&!f.done&&(a=v.return)&&a.call(v)}finally{if(o)throw o.error}}}}catch(t){n={error:t}}finally{try{u&&!u.done&&(i=s.return)&&i.call(s)}finally{if(n)throw n.error}}return l},y=function(t,e,r,i){return void 0===e&&(e={}),void 0===r&&(r={}),void 0===i&&(i=!0),(new(Function.bind.apply(Function,n([void 0],Object.keys(e),[i?"return "+t:t])))).bind(r).apply(void 0,n(Object.values(e)))},p=function(t,e,r){return void 0===r&&(r=!0),y(t,{$el:e.$el},e.$state,r)},h={BIND:function(t){var e=t.el,r=t.name,n=t.value,i=t.state;switch(r.split(":")[1]){case"class":var o=p(n,{$state:i,$el:e});if("string"==typeof o)return e.setAttribute("class",(e.className+" "+o).trim());if(o instanceof Array)return e.setAttribute("class",(e.className+" "+o.join(" ")).trim());var a=[];for(var l in o)o[l]&&a.push(l);return a.length>0?e.setAttribute("class",(e.className+" "+a.join(" ").trim()).trim()):e.className.trim().length>0?e.setAttribute("class",e.className):e.removeAttribute("class");case"style":var s=p(n,{$state:i,$el:e});for(var l in e.removeAttribute("style"),s)e.style[l]=s[l];break;default:var u=p(n,{$state:i,$el:e});u?e.setAttribute(r.split(":")[1],u):e.removeAttribute(r.split(":")[1])}},JOIN:function(e){var n=e.el,i=e.value,o=e.state,a=r(i.split(/ as | by /),3),l=a[0],s=a[1],u=a[2],c=p(l,{$state:o,$el:n});n["text"===s?"innerText":"innerHTML"]=c.join(u||""),A(t({},o)).mount(n,!0)},HTML:function(e){var r=e.el,n=e.value,i=e.state;A(t({},i)).mount(r,!0);try{r.innerHTML=p(n,{$state:i,$el:r})}catch(t){r.innerHTML=n}},IF:function(t){var e=t.el,r=t.value,n=t.state;p(r,{$state:n,$el:e})?e.style.removeProperty("display"):e.style.display="none"},MODEL:function(t){var e=t.el,r=t.value,n=t.state,i=e,o=p(r,{$state:n,$el:i});i.value!==o&&(i.value=o),i.oninput=function(){var t,e="number"==typeof o&&!isNaN(i.value),a="boolean"==typeof o&&("true"===i.value||"false"===i.value),l=null==o&&("null"===i.value||"undefined"===i.value);t=e?"Number('"+i.value+"').toPrecision()":a?"Boolean('"+i.value+"')":l?"null"===i.value?null:void 0:"'"+i.value+"'",p(r+" = "+t,{$state:n,$el:i},!1)}},ON:function(t){var e=t.el,n=t.name,i=t.value,o=t.state,a=r(n.split("."),2),l=a[0],s=a[1],u=l.split(":")[1],c=s||null;e["on"+u]=function(t){"prevent"===c&&t.preventDefault(),"stop"===c&&t.stopPropagation(),p(i,{$state:o,$el:e},!1)}},TEXT:function(t){var e=t.el,r=t.value,n=t.state;try{e.innerHTML=p(r,{$state:n,$el:e})}catch(t){e.innerHTML=r}}},m=function(t,e){var r=t.el,n=t.name,i=t.value,o=t.state;e[n.split(a)[0].toUpperCase()]({el:r,name:n,value:i,state:o})},b=function(t,e,r,n){if("length"===e){var i=Object.keys(r).filter((function(e){return r[e]instanceof Array&&(n=t,i=r[e],n instanceof Array&&i instanceof Array&&n.length===i.length&&n.every((function(t,e){return t===i[e]})));var n,i}));return 0!==i.length&&n(i),!0}return n([e]),!1},T=function(t,e){var r={get:function(t,e){return"object"==typeof t[e]&&null!==t[e]?new Proxy(t[e],r):t[e]},set:function(r,n,i){return r[n]=i,b(r,n,t,e),!0},deleteProperty:function(r,n){return delete r[n],b(r,n,t,e),!0}};return new Proxy(t,r)},N=function(r,n,i,a){var l,u;void 0===n&&(n={}),void 0===i&&(i={});var c=!1;if(r){a||(a=Object.keys(n)),"%LUCIA_COMPILE_REQUEST%"===a[0]&&(c=!0);var v=function(e){if("string"==typeof e)return"continue";if(e.props.type>o.STATIC){var r=e.props,l=r.attributes,u=r.directives,v=r.ref,f=r.type,d=[];if(!c){var y=function(t){var e=u[t],r=1===f,i=a.some((function(t){return s(t).test(e.toString())})),o=Object.keys(n).some((function(t){var e=a.some((function(e){return s(e).test(n[t].toString())}));return"function"==typeof n[t]&&e}));(r||i||o)&&d.push(t)};for(var p in u)y(p)}e.props.type=f===o.NEEDS_PATCH?o.STATIC:f,(c?Object.keys(u):d).map((function(e){var r=u[e],o=l.id?document.getElementById(l.id):v;m({el:o,name:e,value:r,state:n},t({},i))}))}e.children.length>0&&N(e,n,i,a)};try{for(var f=e(r.children),d=f.next();!d.done;d=f.next()){v(d.value)}}catch(t){l={error:t}}finally{try{d&&!d.done&&(u=f.return)&&u.call(f)}finally{if(l)throw l.error}}}},g=function(){function t(t){void 0===t&&(t={}),this.vdom=null,this.state=t,this.directives={},this.components={},this.mounted=!1}return t.prototype.mount=function(t,e){return void 0===e&&(e=!1),this.vdom=this.compile("string"==typeof t?document.querySelector(t):t),e||(this.state=T(this.state,this.patch.bind(this)),this.directives=h),this.mounted=!0,this.patch(["%LUCIA_COMPILE_REQUEST%"]),this.state},t.prototype.component=function(t,e){this.components[t.toUpperCase()]=e},t.prototype.directive=function(t,e){this.directives[t.toUpperCase()]=e},t.prototype.patch=function(t){if(!this.mounted)throw new Error("App is not mounted.");N(this.vdom,this.state,this.directives,t)},t.prototype.compile=function(t){return f(t,this.state,this.components,!0)},t}(),A=function(t){return new g(t)},E=function(t,e){void 0===t&&(t=document),void 0===e&&(e="use");var r=n(t.querySelectorAll("[l-"+e+"]")),i=[];return r.map((function(t){var r=t.getAttribute("l-"+e);if(null!==r)try{var n=A(y(r));n.mount(t),i.push(n)}catch(t){}})),i};export{f as compile,A as createApp,h as directives,u as h,E as init,N as patch,T as reactive,m as renderDirective}; |
@@ -70,2 +70,7 @@ (function (global, factory) { | ||
var LUCIA_COMPILE_REQUEST = '%LUCIA_COMPILE_REQUEST%'; | ||
var DIRECTIVE_SHORTHANDS; | ||
(function (DIRECTIVE_SHORTHANDS) { | ||
DIRECTIVE_SHORTHANDS["@"] = "ON"; | ||
DIRECTIVE_SHORTHANDS[":"] = "BIND"; | ||
})(DIRECTIVE_SHORTHANDS || (DIRECTIVE_SHORTHANDS = {})); | ||
@@ -79,5 +84,12 @@ var VNodeTypes; | ||
var rawDirectiveSplitPattern = /:|\./; | ||
var selectorSplitPattern = /(?=\.)|(?=#)|(?=\[)/; | ||
var keyPattern = function (key, hasThis) { | ||
if (hasThis === void 0) { hasThis = true; } | ||
return new RegExp("" + (hasThis ? 'this\\.' : '') + key + "\\b"); | ||
}; | ||
var h = function (selector, children, props) { | ||
var e_1, _a; | ||
var tokens = selector.split(/(?=\.)|(?=#)|(?=\[)/); | ||
var tokens = selector.split(selectorSplitPattern); | ||
var tag = tokens[0]; | ||
@@ -145,2 +157,5 @@ var attributes = __assign({}, props === null || props === void 0 ? void 0 : props.attributes); | ||
} | ||
else if (Object.keys(DIRECTIVE_SHORTHANDS).includes(name_1[0])) { | ||
directives[DIRECTIVE_SHORTHANDS[name_1[0]] + ":" + name_1.slice(1)] = value; | ||
} | ||
else { | ||
@@ -162,7 +177,2 @@ attributes[name_1] = value; | ||
var keyPattern = function (key, hasThis) { | ||
if (hasThis === void 0) { hasThis = true; } | ||
return new RegExp("" + (hasThis ? 'this\\.' : '') + key + "\\b"); | ||
}; | ||
var createVNode = function (el, state, children) { | ||
@@ -227,3 +237,3 @@ var _a = props(el), attributes = _a.attributes, directives = _a.directives; | ||
} | ||
if (!strip || child.outerHTML.includes(" " + DIRECTIVE_PREFIX)) { | ||
if (!strip || container.outerHTML.includes(" " + DIRECTIVE_PREFIX)) { | ||
var compiledChildren = compile(container, state, components, strip, true); | ||
@@ -468,3 +478,3 @@ try { | ||
var el = _a.el, name = _a.name, value = _a.value, state = _a.state; | ||
var rootName = name.split(/:|\./)[0]; | ||
var rootName = name.split(rawDirectiveSplitPattern)[0]; | ||
directives[rootName.toUpperCase()]({ el: el, name: name, value: value, state: state }); | ||
@@ -471,0 +481,0 @@ }; |
@@ -1,1 +0,1 @@ | ||
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e="undefined"!=typeof globalThis?globalThis:e||self).Lucia=t()}(this,(function(){"use strict";var e=function(){return(e=Object.assign||function(e){for(var t,r=1,n=arguments.length;r<n;r++)for(var i in t=arguments[r])Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i]);return e}).apply(this,arguments)};function t(e){var t="function"==typeof Symbol&&Symbol.iterator,r=t&&e[t],n=0;if(r)return r.call(e);if(e&&"number"==typeof e.length)return{next:function(){return e&&n>=e.length&&(e=void 0),{value:e&&e[n++],done:!e}}};throw new TypeError(t?"Object is not iterable.":"Symbol.iterator is not defined.")}function r(e,t){var r="function"==typeof Symbol&&e[Symbol.iterator];if(!r)return e;var n,i,o=r.call(e),a=[];try{for(;(void 0===t||t-- >0)&&!(n=o.next()).done;)a.push(n.value)}catch(e){i={error:e}}finally{try{n&&!n.done&&(r=o.return)&&r.call(o)}finally{if(i)throw i.error}}return a}function n(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(r(arguments[t]));return e}var i,o="l-",a="%LUCIA_COMPILE_REQUEST%";!function(e){e[e.STATIC=0]="STATIC",e[e.NEEDS_PATCH=1]="NEEDS_PATCH",e[e.DYNAMIC=2]="DYNAMIC"}(i||(i={}));var l=function(n,i,a){var l,s,u=n.split(/(?=\.)|(?=#)|(?=\[)/),c=u[0],f=e({},null==a?void 0:a.attributes),v=e({},null==a?void 0:a.directives);if(u.length>1){u.shift();try{for(var d=t(u),p=d.next();!p.done;p=d.next()){var y=p.value;switch(y[0]){case"#":f.id=y.slice(1);break;case".":f.className||(f.className=""),f.className+=y.slice(1)+" ";break;case"[":var h=r(y.slice(1,-1).split("="),2),m=h[0],b=h[1];m.startsWith(o)?v[m.slice(o.length)]=b:f[m]=b}}}catch(e){l={error:e}}finally{try{p&&!p.done&&(s=d.return)&&s.call(d)}finally{if(l)throw l.error}}}return f.className&&(f.className=f.className.trim()),{tag:c,children:"string"==typeof i?[i]:i||[],props:{attributes:f,directives:v,ref:(null==a?void 0:a.ref)||void 0,type:(null==a?void 0:a.type)||0}}},s=function(e){var r,i,a={},l={};if(e.attributes)try{for(var s=t(n(e.attributes)),u=s.next();!u.done;u=s.next()){var c=u.value,f=c.name,v=c.value;f.startsWith(o)?l[f.slice(o.length)]=v:a[f]=v}}catch(e){r={error:e}}finally{try{u&&!u.done&&(i=s.return)&&i.call(s)}finally{if(r)throw r.error}}return{attributes:a,directives:l}},u=function(e,t){return void 0===t&&(t=!0),new RegExp((t?"this\\.":"")+e+"\\b")},c=function(e,t,r){var n=s(e),o=n.attributes,a=n.directives,c=i.STATIC,f=Object.keys(a).length>0,v=Object.values(a).some((function(e){return Object.keys(t).some((function(t){return u(t,!1).test(e)}))}));return f&&(c=i.NEEDS_PATCH),v&&(c=i.DYNAMIC),l(e.tagName.toLowerCase(),r,{attributes:o,directives:a,ref:c===i.STATIC||o.id?void 0:e,type:c})},f=function(e,n,i,o,a){var l,u,d,p,y,h,m;if(void 0===n&&(n={}),void 0===i&&(i={}),void 0===o&&(o=!1),void 0===a&&(a=!1),!e)throw new Error("Please provide a Element");var b=[],T=Array.prototype.slice.call(e.childNodes);try{for(var g=t(T),N=g.next();!N.done;N=g.next()){var A=N.value;switch(A.nodeType){case Node.TEXT_NODE:!o&&A.nodeValue&&b.push(A.nodeValue);break;case Node.ELEMENT_NODE:if(Object.keys(i).includes(A.tagName)){var E=document.createElement("div"),w=i[A.tagName]({children:A.innerHTML,state:n});E.innerHTML=w;try{for(var x=(d=void 0,t(Object.entries(s(A).directives))),C=x.next();!C.done;C=x.next()){var O=r(C.value,2),$=O[0],j=O[1];null===(m=E.firstElementChild)||void 0===m||m.setAttribute("l-"+$,j)}}catch(e){d={error:e}}finally{try{C&&!C.done&&(p=x.return)&&p.call(x)}finally{if(d)throw d.error}}if(!o||A.outerHTML.includes(" l-")){var S=f(E,n,i,o,!0);try{for(var L=(y=void 0,t(S)),M=L.next();!M.done;M=L.next()){var I=M.value;b.push(I)}}catch(e){y={error:e}}finally{try{M&&!M.done&&(h=L.return)&&h.call(L)}finally{if(y)throw y.error}}}e.replaceChild(E.firstElementChild,A)}else if(!o||A.outerHTML.includes(" l-")){S=f(A,n,i,o,!0);var D=c(A,n,S);b.push(D)}}}}catch(e){l={error:e}}finally{try{N&&!N.done&&(u=g.return)&&u.call(g)}finally{if(l)throw l.error}}if(a)return b;var H=c(e,n,b);return o?v(H):H},v=function(r){var n,i,o,a,l=e({},r);l.children.filter((function(e){return"object"==typeof e&&e.props.type>0}));try{for(var s=t(r.children),u=s.next();!u.done;u=s.next()){var c=u.value;if("string"!=typeof c&&c.children.length>0)try{for(var f=(o=void 0,t(v(c).children)),d=f.next();!d.done;d=f.next()){var p=d.value;"string"!=typeof p&&(0!==p.props.type&&l.children.push(p))}}catch(e){o={error:e}}finally{try{d&&!d.done&&(a=f.return)&&a.call(f)}finally{if(o)throw o.error}}}}catch(e){n={error:e}}finally{try{u&&!u.done&&(i=s.return)&&i.call(s)}finally{if(n)throw n.error}}return l},d=function(e,t,r,i){return void 0===t&&(t={}),void 0===r&&(r={}),void 0===i&&(i=!0),(new(Function.bind.apply(Function,n([void 0],Object.keys(t),[i?"return "+e:e])))).bind(r).apply(void 0,n(Object.values(t)))},p=function(e,t,r){return void 0===r&&(r=!0),d(e,{$el:t.$el},t.$state,r)},y={BIND:function(e){var t=e.el,r=e.name,n=e.value,i=e.state;switch(r.split(":")[1]){case"class":var o=p(n,{$state:i,$el:t});if("string"==typeof o)return t.setAttribute("class",(t.className+" "+o).trim());if(o instanceof Array)return t.setAttribute("class",(t.className+" "+o.join(" ")).trim());var a=[];for(var l in o)o[l]&&a.push(l);return a.length>0?t.setAttribute("class",(t.className+" "+a.join(" ").trim()).trim()):t.className.trim().length>0?t.setAttribute("class",t.className):t.removeAttribute("class");case"style":var s=p(n,{$state:i,$el:t});for(var l in t.removeAttribute("style"),s)t.style[l]=s[l];break;default:var u=p(n,{$state:i,$el:t});u?t.setAttribute(r.split(":")[1],u):t.removeAttribute(r.split(":")[1])}},JOIN:function(t){var n=t.el,i=t.value,o=t.state,a=r(i.split(/ as | by /),3),l=a[0],s=a[1],u=a[2],c=p(l,{$state:o,$el:n});n["text"===s?"innerText":"innerHTML"]=c.join(u||""),N(e({},o)).mount(n,!0)},HTML:function(t){var r=t.el,n=t.value,i=t.state;N(e({},i)).mount(r,!0);try{r.innerHTML=p(n,{$state:i,$el:r})}catch(e){r.innerHTML=n}},IF:function(e){var t=e.el,r=e.value,n=e.state;p(r,{$state:n,$el:t})?t.style.removeProperty("display"):t.style.display="none"},MODEL:function(e){var t=e.el,r=e.value,n=e.state,i=t,o=p(r,{$state:n,$el:i});i.value!==o&&(i.value=o),i.oninput=function(){var e,t="number"==typeof o&&!isNaN(i.value),a="boolean"==typeof o&&("true"===i.value||"false"===i.value),l=null==o&&("null"===i.value||"undefined"===i.value);e=t?"Number('"+i.value+"').toPrecision()":a?"Boolean('"+i.value+"')":l?"null"===i.value?null:void 0:"'"+i.value+"'",p(r+" = "+e,{$state:n,$el:i},!1)}},ON:function(e){var t=e.el,n=e.name,i=e.value,o=e.state,a=r(n.split("."),2),l=a[0],s=a[1],u=l.split(":")[1],c=s||null;t["on"+u]=function(e){"prevent"===c&&e.preventDefault(),"stop"===c&&e.stopPropagation(),p(i,{$state:o,$el:t},!1)}},TEXT:function(e){var t=e.el,r=e.value,n=e.state;try{t.innerHTML=p(r,{$state:n,$el:t})}catch(e){t.innerHTML=r}}},h=function(e,t){var r=e.el,n=e.name,i=e.value,o=e.state;t[n.split(/:|\./)[0].toUpperCase()]({el:r,name:n,value:i,state:o})},m=function(e,t,r,n){if("length"===t){var i=Object.keys(r).filter((function(t){return r[t]instanceof Array&&(n=e,i=r[t],n instanceof Array&&i instanceof Array&&n.length===i.length&&n.every((function(e,t){return e===i[t]})));var n,i}));return 0!==i.length&&n(i),!0}return n([t]),!1},b=function(e,t){var r={get:function(e,t){return"object"==typeof e[t]&&null!==e[t]?new Proxy(e[t],r):e[t]},set:function(r,n,i){return r[n]=i,m(r,n,e,t),!0},deleteProperty:function(r,n){return delete r[n],m(r,n,e,t),!0}};return new Proxy(e,r)},T=function(r,n,o,l){var s,c;void 0===n&&(n={}),void 0===o&&(o={});var f=!1;if(r){l||(l=Object.keys(n)),l[0]===a&&(f=!0);var v=function(t){if("string"==typeof t)return"continue";if(t.props.type>i.STATIC){var r=t.props,a=r.attributes,s=r.directives,c=r.ref,v=r.type,d=[];if(!f){var p=function(e){var t=s[e],r=1===v,i=l.some((function(e){return u(e).test(t.toString())})),o=Object.keys(n).some((function(e){var t=l.some((function(t){return u(t).test(n[e].toString())}));return"function"==typeof n[e]&&t}));(r||i||o)&&d.push(e)};for(var y in s)p(y)}t.props.type=v===i.NEEDS_PATCH?i.STATIC:v,(f?Object.keys(s):d).map((function(t){var r=s[t],i=a.id?document.getElementById(a.id):c;h({el:i,name:t,value:r,state:n},e({},o))}))}t.children.length>0&&T(t,n,o,l)};try{for(var d=t(r.children),p=d.next();!p.done;p=d.next()){v(p.value)}}catch(e){s={error:e}}finally{try{p&&!p.done&&(c=d.return)&&c.call(d)}finally{if(s)throw s.error}}}},g=function(){function e(e){void 0===e&&(e={}),this.vdom=null,this.state=e,this.directives={},this.components={},this.mounted=!1}return e.prototype.mount=function(e,t){return void 0===t&&(t=!1),this.vdom=this.compile("string"==typeof e?document.querySelector(e):e),t||(this.state=b(this.state,this.patch.bind(this)),this.directives=y),this.mounted=!0,this.patch([a]),this.state},e.prototype.component=function(e,t){this.components[e.toUpperCase()]=t},e.prototype.directive=function(e,t){this.directives[e.toUpperCase()]=t},e.prototype.patch=function(e){if(!this.mounted)throw new Error("App is not mounted.");T(this.vdom,this.state,this.directives,e)},e.prototype.compile=function(e){return f(e,this.state,this.components,!0)},e}(),N=function(e){return new g(e)},A=function(e,t){void 0===e&&(e=document),void 0===t&&(t="use");var r=n(e.querySelectorAll("["+(o+t)+"]")),i=[];return r.map((function(e){var r=e.getAttribute(o+t);if(null!==r)try{var n=N(d(r));n.mount(e),i.push(n)}catch(e){}})),i},E=Object.freeze({__proto__:null,createApp:N,h:l,compile:f,patch:T,reactive:b,directives:y,renderDirective:h,init:A});return document.addEventListener("DOMContentLoaded",(function(){return A(document,"init")})),E})); | ||
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e="undefined"!=typeof globalThis?globalThis:e||self).Lucia=t()}(this,(function(){"use strict";var e=function(){return(e=Object.assign||function(e){for(var t,r=1,n=arguments.length;r<n;r++)for(var i in t=arguments[r])Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i]);return e}).apply(this,arguments)};function t(e){var t="function"==typeof Symbol&&Symbol.iterator,r=t&&e[t],n=0;if(r)return r.call(e);if(e&&"number"==typeof e.length)return{next:function(){return e&&n>=e.length&&(e=void 0),{value:e&&e[n++],done:!e}}};throw new TypeError(t?"Object is not iterable.":"Symbol.iterator is not defined.")}function r(e,t){var r="function"==typeof Symbol&&e[Symbol.iterator];if(!r)return e;var n,i,o=r.call(e),a=[];try{for(;(void 0===t||t-- >0)&&!(n=o.next()).done;)a.push(n.value)}catch(e){i={error:e}}finally{try{n&&!n.done&&(r=o.return)&&r.call(o)}finally{if(i)throw i.error}}return a}function n(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(r(arguments[t]));return e}var i,o,a="l-",l="%LUCIA_COMPILE_REQUEST%";!function(e){e["@"]="ON",e[":"]="BIND"}(i||(i={})),function(e){e[e.STATIC=0]="STATIC",e[e.NEEDS_PATCH=1]="NEEDS_PATCH",e[e.DYNAMIC=2]="DYNAMIC"}(o||(o={}));var s=/:|\./,u=/(?=\.)|(?=#)|(?=\[)/,c=function(e,t){return void 0===t&&(t=!0),new RegExp((t?"this\\.":"")+e+"\\b")},f=function(n,i,o){var l,s,c=n.split(u),f=c[0],v=e({},null==o?void 0:o.attributes),d=e({},null==o?void 0:o.directives);if(c.length>1){c.shift();try{for(var p=t(c),y=p.next();!y.done;y=p.next()){var h=y.value;switch(h[0]){case"#":v.id=h.slice(1);break;case".":v.className||(v.className=""),v.className+=h.slice(1)+" ";break;case"[":var m=r(h.slice(1,-1).split("="),2),b=m[0],T=m[1];b.startsWith(a)?d[b.slice(a.length)]=T:v[b]=T}}}catch(e){l={error:e}}finally{try{y&&!y.done&&(s=p.return)&&s.call(p)}finally{if(l)throw l.error}}}return v.className&&(v.className=v.className.trim()),{tag:f,children:"string"==typeof i?[i]:i||[],props:{attributes:v,directives:d,ref:(null==o?void 0:o.ref)||void 0,type:(null==o?void 0:o.type)||0}}},v=function(e){var r,o,l={},s={};if(e.attributes)try{for(var u=t(n(e.attributes)),c=u.next();!c.done;c=u.next()){var f=c.value,v=f.name,d=f.value;v.startsWith(a)?s[v.slice(a.length)]=d:Object.keys(i).includes(v[0])?s[i[v[0]]+":"+v.slice(1)]=d:l[v]=d}}catch(e){r={error:e}}finally{try{c&&!c.done&&(o=u.return)&&o.call(u)}finally{if(r)throw r.error}}return{attributes:l,directives:s}},d=function(e,t,r){var n=v(e),i=n.attributes,a=n.directives,l=o.STATIC,s=Object.keys(a).length>0,u=Object.values(a).some((function(e){return Object.keys(t).some((function(t){return c(t,!1).test(e)}))}));return s&&(l=o.NEEDS_PATCH),u&&(l=o.DYNAMIC),f(e.tagName.toLowerCase(),r,{attributes:i,directives:a,ref:l===o.STATIC||i.id?void 0:e,type:l})},p=function(e,n,i,o,a){var l,s,u,c,f,h,m;if(void 0===n&&(n={}),void 0===i&&(i={}),void 0===o&&(o=!1),void 0===a&&(a=!1),!e)throw new Error("Please provide a Element");var b=[],T=Array.prototype.slice.call(e.childNodes);try{for(var g=t(T),N=g.next();!N.done;N=g.next()){var A=N.value;switch(A.nodeType){case Node.TEXT_NODE:!o&&A.nodeValue&&b.push(A.nodeValue);break;case Node.ELEMENT_NODE:if(Object.keys(i).includes(A.tagName)){var E=document.createElement("div"),w=i[A.tagName]({children:A.innerHTML,state:n});E.innerHTML=w;try{for(var x=(u=void 0,t(Object.entries(v(A).directives))),O=x.next();!O.done;O=x.next()){var C=r(O.value,2),$=C[0],j=C[1];null===(m=E.firstElementChild)||void 0===m||m.setAttribute("l-"+$,j)}}catch(e){u={error:e}}finally{try{O&&!O.done&&(c=x.return)&&c.call(x)}finally{if(u)throw u.error}}if(!o||E.outerHTML.includes(" l-")){var S=p(E,n,i,o,!0);try{for(var L=(f=void 0,t(S)),M=L.next();!M.done;M=L.next()){var I=M.value;b.push(I)}}catch(e){f={error:e}}finally{try{M&&!M.done&&(h=L.return)&&h.call(L)}finally{if(f)throw f.error}}}e.replaceChild(E.firstElementChild,A)}else if(!o||A.outerHTML.includes(" l-")){S=p(A,n,i,o,!0);var D=d(A,n,S);b.push(D)}}}}catch(e){l={error:e}}finally{try{N&&!N.done&&(s=g.return)&&s.call(g)}finally{if(l)throw l.error}}if(a)return b;var H=d(e,n,b);return o?y(H):H},y=function(r){var n,i,o,a,l=e({},r);l.children.filter((function(e){return"object"==typeof e&&e.props.type>0}));try{for(var s=t(r.children),u=s.next();!u.done;u=s.next()){var c=u.value;if("string"!=typeof c&&c.children.length>0)try{for(var f=(o=void 0,t(y(c).children)),v=f.next();!v.done;v=f.next()){var d=v.value;"string"!=typeof d&&(0!==d.props.type&&l.children.push(d))}}catch(e){o={error:e}}finally{try{v&&!v.done&&(a=f.return)&&a.call(f)}finally{if(o)throw o.error}}}}catch(e){n={error:e}}finally{try{u&&!u.done&&(i=s.return)&&i.call(s)}finally{if(n)throw n.error}}return l},h=function(e,t,r,i){return void 0===t&&(t={}),void 0===r&&(r={}),void 0===i&&(i=!0),(new(Function.bind.apply(Function,n([void 0],Object.keys(t),[i?"return "+e:e])))).bind(r).apply(void 0,n(Object.values(t)))},m=function(e,t,r){return void 0===r&&(r=!0),h(e,{$el:t.$el},t.$state,r)},b={BIND:function(e){var t=e.el,r=e.name,n=e.value,i=e.state;switch(r.split(":")[1]){case"class":var o=m(n,{$state:i,$el:t});if("string"==typeof o)return t.setAttribute("class",(t.className+" "+o).trim());if(o instanceof Array)return t.setAttribute("class",(t.className+" "+o.join(" ")).trim());var a=[];for(var l in o)o[l]&&a.push(l);return a.length>0?t.setAttribute("class",(t.className+" "+a.join(" ").trim()).trim()):t.className.trim().length>0?t.setAttribute("class",t.className):t.removeAttribute("class");case"style":var s=m(n,{$state:i,$el:t});for(var l in t.removeAttribute("style"),s)t.style[l]=s[l];break;default:var u=m(n,{$state:i,$el:t});u?t.setAttribute(r.split(":")[1],u):t.removeAttribute(r.split(":")[1])}},JOIN:function(t){var n=t.el,i=t.value,o=t.state,a=r(i.split(/ as | by /),3),l=a[0],s=a[1],u=a[2],c=m(l,{$state:o,$el:n});n["text"===s?"innerText":"innerHTML"]=c.join(u||""),w(e({},o)).mount(n,!0)},HTML:function(t){var r=t.el,n=t.value,i=t.state;w(e({},i)).mount(r,!0);try{r.innerHTML=m(n,{$state:i,$el:r})}catch(e){r.innerHTML=n}},IF:function(e){var t=e.el,r=e.value,n=e.state;m(r,{$state:n,$el:t})?t.style.removeProperty("display"):t.style.display="none"},MODEL:function(e){var t=e.el,r=e.value,n=e.state,i=t,o=m(r,{$state:n,$el:i});i.value!==o&&(i.value=o),i.oninput=function(){var e,t="number"==typeof o&&!isNaN(i.value),a="boolean"==typeof o&&("true"===i.value||"false"===i.value),l=null==o&&("null"===i.value||"undefined"===i.value);e=t?"Number('"+i.value+"').toPrecision()":a?"Boolean('"+i.value+"')":l?"null"===i.value?null:void 0:"'"+i.value+"'",m(r+" = "+e,{$state:n,$el:i},!1)}},ON:function(e){var t=e.el,n=e.name,i=e.value,o=e.state,a=r(n.split("."),2),l=a[0],s=a[1],u=l.split(":")[1],c=s||null;t["on"+u]=function(e){"prevent"===c&&e.preventDefault(),"stop"===c&&e.stopPropagation(),m(i,{$state:o,$el:t},!1)}},TEXT:function(e){var t=e.el,r=e.value,n=e.state;try{t.innerHTML=m(r,{$state:n,$el:t})}catch(e){t.innerHTML=r}}},T=function(e,t){var r=e.el,n=e.name,i=e.value,o=e.state;t[n.split(s)[0].toUpperCase()]({el:r,name:n,value:i,state:o})},g=function(e,t,r,n){if("length"===t){var i=Object.keys(r).filter((function(t){return r[t]instanceof Array&&(n=e,i=r[t],n instanceof Array&&i instanceof Array&&n.length===i.length&&n.every((function(e,t){return e===i[t]})));var n,i}));return 0!==i.length&&n(i),!0}return n([t]),!1},N=function(e,t){var r={get:function(e,t){return"object"==typeof e[t]&&null!==e[t]?new Proxy(e[t],r):e[t]},set:function(r,n,i){return r[n]=i,g(r,n,e,t),!0},deleteProperty:function(r,n){return delete r[n],g(r,n,e,t),!0}};return new Proxy(e,r)},A=function(r,n,i,a){var s,u;void 0===n&&(n={}),void 0===i&&(i={});var f=!1;if(r){a||(a=Object.keys(n)),a[0]===l&&(f=!0);var v=function(t){if("string"==typeof t)return"continue";if(t.props.type>o.STATIC){var r=t.props,l=r.attributes,s=r.directives,u=r.ref,v=r.type,d=[];if(!f){var p=function(e){var t=s[e],r=1===v,i=a.some((function(e){return c(e).test(t.toString())})),o=Object.keys(n).some((function(e){var t=a.some((function(t){return c(t).test(n[e].toString())}));return"function"==typeof n[e]&&t}));(r||i||o)&&d.push(e)};for(var y in s)p(y)}t.props.type=v===o.NEEDS_PATCH?o.STATIC:v,(f?Object.keys(s):d).map((function(t){var r=s[t],o=l.id?document.getElementById(l.id):u;T({el:o,name:t,value:r,state:n},e({},i))}))}t.children.length>0&&A(t,n,i,a)};try{for(var d=t(r.children),p=d.next();!p.done;p=d.next()){v(p.value)}}catch(e){s={error:e}}finally{try{p&&!p.done&&(u=d.return)&&u.call(d)}finally{if(s)throw s.error}}}},E=function(){function e(e){void 0===e&&(e={}),this.vdom=null,this.state=e,this.directives={},this.components={},this.mounted=!1}return e.prototype.mount=function(e,t){return void 0===t&&(t=!1),this.vdom=this.compile("string"==typeof e?document.querySelector(e):e),t||(this.state=N(this.state,this.patch.bind(this)),this.directives=b),this.mounted=!0,this.patch([l]),this.state},e.prototype.component=function(e,t){this.components[e.toUpperCase()]=t},e.prototype.directive=function(e,t){this.directives[e.toUpperCase()]=t},e.prototype.patch=function(e){if(!this.mounted)throw new Error("App is not mounted.");A(this.vdom,this.state,this.directives,e)},e.prototype.compile=function(e){return p(e,this.state,this.components,!0)},e}(),w=function(e){return new E(e)},x=function(e,t){void 0===e&&(e=document),void 0===t&&(t="use");var r=n(e.querySelectorAll("["+(a+t)+"]")),i=[];return r.map((function(e){var r=e.getAttribute(a+t);if(null!==r)try{var n=w(h(r));n.mount(e),i.push(n)}catch(e){}})),i},O=Object.freeze({__proto__:null,createApp:w,h:f,compile:p,patch:A,reactive:N,directives:b,renderDirective:T,init:x});return document.addEventListener("DOMContentLoaded",(function(){return x(document,"init")})),O})); |
@@ -7,2 +7,7 @@ 'use strict'; | ||
const LUCIA_COMPILE_REQUEST = '%LUCIA_COMPILE_REQUEST%'; | ||
var DIRECTIVE_SHORTHANDS; | ||
(function (DIRECTIVE_SHORTHANDS) { | ||
DIRECTIVE_SHORTHANDS["@"] = "ON"; | ||
DIRECTIVE_SHORTHANDS[":"] = "BIND"; | ||
})(DIRECTIVE_SHORTHANDS || (DIRECTIVE_SHORTHANDS = {})); | ||
@@ -16,4 +21,10 @@ var VNodeTypes; | ||
const rawDirectiveSplitPattern = /:|\./; | ||
const selectorSplitPattern = /(?=\.)|(?=#)|(?=\[)/; | ||
const keyPattern = (key, hasThis = true) => { | ||
return new RegExp(`${hasThis ? 'this\\.' : ''}${key}\\b`); | ||
}; | ||
const h = (selector, children, props) => { | ||
const tokens = selector.split(/(?=\.)|(?=#)|(?=\[)/); | ||
const tokens = selector.split(selectorSplitPattern); | ||
const tag = tokens[0]; | ||
@@ -68,2 +79,5 @@ const attributes = Object.assign({}, props === null || props === void 0 ? void 0 : props.attributes); | ||
} | ||
else if (Object.keys(DIRECTIVE_SHORTHANDS).includes(name[0])) { | ||
directives[`${DIRECTIVE_SHORTHANDS[name[0]]}:${name.slice(1)}`] = value; | ||
} | ||
else { | ||
@@ -77,6 +91,2 @@ attributes[name] = value; | ||
const keyPattern = (key, hasThis = true) => { | ||
return new RegExp(`${hasThis ? 'this\\.' : ''}${key}\\b`); | ||
}; | ||
const createVNode = (el, state, children) => { | ||
@@ -122,3 +132,3 @@ const { attributes, directives } = props(el); | ||
} | ||
if (!strip || child.outerHTML.includes(` ${DIRECTIVE_PREFIX}`)) { | ||
if (!strip || container.outerHTML.includes(` ${DIRECTIVE_PREFIX}`)) { | ||
const compiledChildren = compile(container, state, components, strip, true); | ||
@@ -312,3 +322,3 @@ for (const componentChild of compiledChildren) { | ||
const renderDirective = ({ el, name, value, state }, directives) => { | ||
const rootName = name.split(/:|\./)[0]; | ||
const rootName = name.split(rawDirectiveSplitPattern)[0]; | ||
directives[rootName.toUpperCase()]({ el, name, value, state }); | ||
@@ -315,0 +325,0 @@ }; |
@@ -1,1 +0,1 @@ | ||
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e;!function(e){e[e.STATIC=0]="STATIC",e[e.NEEDS_PATCH=1]="NEEDS_PATCH",e[e.DYNAMIC=2]="DYNAMIC"}(e||(e={}));const t=(e,t,s)=>{const n=e.split(/(?=\.)|(?=#)|(?=\[)/),r=n[0],i=Object.assign({},null==s?void 0:s.attributes),l=Object.assign({},null==s?void 0:s.directives);if(n.length>1){n.shift();for(const e of n)switch(e[0]){case"#":i.id=e.slice(1);break;case".":i.className||(i.className=""),i.className+=`${e.slice(1)} `;break;case"[":const[t,s]=e.slice(1,-1).split("=");t.startsWith("l-")?l[t.slice("l-".length)]=s:i[t]=s}}return i.className&&(i.className=i.className.trim()),{tag:r,children:"string"==typeof t?[t]:t||[],props:{attributes:i,directives:l,ref:(null==s?void 0:s.ref)||void 0,type:(null==s?void 0:s.type)||0}}},s=e=>{const t={},s={};if(e.attributes)for(const{name:n,value:r}of[...e.attributes])n.startsWith("l-")?s[n.slice("l-".length)]=r:t[n]=r;return{attributes:t,directives:s}},n=(e,t=!0)=>new RegExp(`${t?"this\\.":""}${e}\\b`),r=(r,i,l)=>{const{attributes:o,directives:a}=s(r);let c=e.STATIC;const u=Object.keys(a).length>0,p=Object.values(a).some((e=>Object.keys(i).some((t=>n(t,!1).test(e)))));return u&&(c=e.NEEDS_PATCH),p&&(c=e.DYNAMIC),t(r.tagName.toLowerCase(),l,{attributes:o,directives:a,ref:c===e.STATIC||o.id?void 0:r,type:c})},i=(e,t={},n={},o=!1,a=!1)=>{var c;if(!e)throw new Error("Please provide a Element");const u=[],p=Array.prototype.slice.call(e.childNodes);for(const l of p)switch(l.nodeType){case Node.TEXT_NODE:!o&&l.nodeValue&&u.push(l.nodeValue);break;case Node.ELEMENT_NODE:if(Object.keys(n).includes(l.tagName)){const r=document.createElement("div"),a=n[l.tagName]({children:l.innerHTML,state:t});r.innerHTML=a;for(const[e,t]of Object.entries(s(l).directives))null===(c=r.firstElementChild)||void 0===c||c.setAttribute(`l-${e}`,t);if(!o||l.outerHTML.includes(" l-")){const e=i(r,t,n,o,!0);for(const t of e)u.push(t)}e.replaceChild(r.firstElementChild,l)}else if(!o||l.outerHTML.includes(" l-")){const e=i(l,t,n,o,!0),s=r(l,t,e);u.push(s)}}if(a)return u;{let s=r(e,t,u);return o?l(s):s}},l=e=>{const t=Object.assign({},e);t.children.filter((e=>"object"==typeof e&&e.props.type>0));for(const s of e.children)if("string"!=typeof s&&s.children.length>0)for(const e of l(s).children)"string"!=typeof e&&0!==e.props.type&&t.children.push(e);return t},o=(e,t={},s={},n=!0)=>new Function(...Object.keys(t),n?`return ${e}`:e).bind(s)(...Object.values(t)),a=(e,t,s=!0)=>o(e,{$el:t.$el},t.$state,s),c={BIND:({el:e,name:t,value:s,state:n})=>{switch(t.split(":")[1]){case"class":const r=a(s,{$state:n,$el:e});if("string"==typeof r)return e.setAttribute("class",`${e.className} ${r}`.trim());if(r instanceof Array)return e.setAttribute("class",`${e.className} ${r.join(" ")}`.trim());{const t=[];for(const e in r)r[e]&&t.push(e);return t.length>0?e.setAttribute("class",`${e.className} ${t.join(" ").trim()}`.trim()):e.className.trim().length>0?e.setAttribute("class",e.className):e.removeAttribute("class")}case"style":const i=a(s,{$state:n,$el:e});e.removeAttribute("style");for(const t in i)e.style[t]=i[t];break;default:const l=a(s,{$state:n,$el:e});l?e.setAttribute(t.split(":")[1],l):e.removeAttribute(t.split(":")[1])}},JOIN:({el:e,value:t,state:s})=>{const[n,r,i]=t.split(/ as | by /),l=a(n,{$state:s,$el:e});e["text"===r?"innerText":"innerHTML"]=l.join(i||"");m(Object.assign({},s)).mount(e,!0)},HTML:({el:e,value:t,state:s})=>{m(Object.assign({},s)).mount(e,!0);try{e.innerHTML=a(t,{$state:s,$el:e})}catch(s){e.innerHTML=t}},IF:({el:e,value:t,state:s})=>{a(t,{$state:s,$el:e})?e.style.removeProperty("display"):e.style.display="none"},MODEL:({el:e,value:t,state:s})=>{const n=e,r=a(t,{$state:s,$el:n});n.value!==r&&(n.value=r),n.oninput=()=>{const e="number"==typeof r&&!isNaN(n.value),i="boolean"==typeof r&&("true"===n.value||"false"===n.value),l=null==r&&("null"===n.value||"undefined"===n.value);let o;o=e?`Number('${n.value}').toPrecision()`:i?`Boolean('${n.value}')`:l?"null"===n.value?null:void 0:`'${n.value}'`,a(`${t} = ${o}`,{$state:s,$el:n},!1)}},ON:({el:e,name:t,value:s,state:n})=>{const[r,i]=t.split("."),l=r.split(":")[1],o=i||null;e[`on${l}`]=t=>{"prevent"===o&&t.preventDefault(),"stop"===o&&t.stopPropagation(),a(s,{$state:n,$el:e},!1)}},TEXT:({el:e,value:t,state:s})=>{try{e.innerHTML=a(t,{$state:s,$el:e})}catch(s){e.innerHTML=t}}},u=({el:e,name:t,value:s,state:n},r)=>{r[t.split(/:|\./)[0].toUpperCase()]({el:e,name:t,value:s,state:n})},p=(e,t,s,n)=>{if("length"===t){const t=Object.keys(s).filter((t=>{return s[t]instanceof Array&&(n=e,r=s[t],n instanceof Array&&r instanceof Array&&n.length===r.length&&n.every(((e,t)=>e===r[t])));var n,r}));return 0!==t.length&&n(t),!0}return n([t]),!1},d=(e,t)=>{const s={get:(e,t)=>"object"==typeof e[t]&&null!==e[t]?new Proxy(e[t],s):e[t],set:(s,n,r)=>(s[n]=r,p(s,n,e,t),!0),deleteProperty:(s,n)=>(delete s[n],p(s,n,e,t),!0)};return new Proxy(e,s)},h=(t,s={},r={},i)=>{let l=!1;if(t){i||(i=Object.keys(s)),"%LUCIA_COMPILE_REQUEST%"===i[0]&&(l=!0);for(let o of t.children)if("string"!=typeof o){if(o.props.type>e.STATIC){const{attributes:t,directives:a,ref:c,type:p}=o.props;let d=[];if(!l)for(const e in a){const t=a[e],r=1===p,l=i.some((e=>n(e).test(t.toString()))),o=Object.keys(s).some((e=>{const t=i.some((t=>n(t).test(s[e].toString())));return"function"==typeof s[e]&&t}));(r||l||o)&&d.push(e)}o.props.type=p===e.NEEDS_PATCH?e.STATIC:p;(l?Object.keys(a):d).map((e=>{const n=a[e],i=t.id?document.getElementById(t.id):c;u({el:i,name:e,value:n,state:s},Object.assign({},r))}))}o.children.length>0&&h(o,s,r,i)}}};class f{constructor(e={}){this.vdom=null,this.state=e,this.directives={},this.components={},this.mounted=!1}mount(e,t=!1){return this.vdom=this.compile("string"==typeof e?document.querySelector(e):e),t||(this.state=d(this.state,this.patch.bind(this)),this.directives=c),this.mounted=!0,this.patch(["%LUCIA_COMPILE_REQUEST%"]),this.state}component(e,t){this.components[e.toUpperCase()]=t}directive(e,t){this.directives[e.toUpperCase()]=t}patch(e){if(!this.mounted)throw new Error("App is not mounted.");h(this.vdom,this.state,this.directives,e)}compile(e){return i(e,this.state,this.components,!0)}}const m=e=>new f(e);exports.compile=i,exports.createApp=m,exports.directives=c,exports.h=t,exports.init=(e=document,t="use")=>{const s=[...e.querySelectorAll(`[${"l-"+t}]`)],n=[];return s.map((e=>{const s=e.getAttribute("l-"+t);if(null!==s)try{const t=m(o(s));t.mount(e),n.push(t)}catch(e){}})),n},exports.patch=h,exports.reactive=d,exports.renderDirective=u; | ||
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t;!function(e){e["@"]="ON",e[":"]="BIND"}(e||(e={})),function(e){e[e.STATIC=0]="STATIC",e[e.NEEDS_PATCH=1]="NEEDS_PATCH",e[e.DYNAMIC=2]="DYNAMIC"}(t||(t={}));const s=/:|\./,n=/(?=\.)|(?=#)|(?=\[)/,i=(e,t=!0)=>new RegExp(`${t?"this\\.":""}${e}\\b`),r=(e,t,s)=>{const i=e.split(n),r=i[0],l=Object.assign({},null==s?void 0:s.attributes),o=Object.assign({},null==s?void 0:s.directives);if(i.length>1){i.shift();for(const e of i)switch(e[0]){case"#":l.id=e.slice(1);break;case".":l.className||(l.className=""),l.className+=`${e.slice(1)} `;break;case"[":const[t,s]=e.slice(1,-1).split("=");t.startsWith("l-")?o[t.slice("l-".length)]=s:l[t]=s}}return l.className&&(l.className=l.className.trim()),{tag:r,children:"string"==typeof t?[t]:t||[],props:{attributes:l,directives:o,ref:(null==s?void 0:s.ref)||void 0,type:(null==s?void 0:s.type)||0}}},l=t=>{const s={},n={};if(t.attributes)for(const{name:i,value:r}of[...t.attributes])i.startsWith("l-")?n[i.slice("l-".length)]=r:Object.keys(e).includes(i[0])?n[`${e[i[0]]}:${i.slice(1)}`]=r:s[i]=r;return{attributes:s,directives:n}},o=(e,s,n)=>{const{attributes:o,directives:a}=l(e);let c=t.STATIC;const u=Object.keys(a).length>0,p=Object.values(a).some((e=>Object.keys(s).some((t=>i(t,!1).test(e)))));return u&&(c=t.NEEDS_PATCH),p&&(c=t.DYNAMIC),r(e.tagName.toLowerCase(),n,{attributes:o,directives:a,ref:c===t.STATIC||o.id?void 0:e,type:c})},a=(e,t={},s={},n=!1,i=!1)=>{var r;if(!e)throw new Error("Please provide a Element");const u=[],p=Array.prototype.slice.call(e.childNodes);for(const i of p)switch(i.nodeType){case Node.TEXT_NODE:!n&&i.nodeValue&&u.push(i.nodeValue);break;case Node.ELEMENT_NODE:if(Object.keys(s).includes(i.tagName)){const o=document.createElement("div"),c=s[i.tagName]({children:i.innerHTML,state:t});o.innerHTML=c;for(const[e,t]of Object.entries(l(i).directives))null===(r=o.firstElementChild)||void 0===r||r.setAttribute(`l-${e}`,t);if(!n||o.outerHTML.includes(" l-")){const e=a(o,t,s,n,!0);for(const t of e)u.push(t)}e.replaceChild(o.firstElementChild,i)}else if(!n||i.outerHTML.includes(" l-")){const e=a(i,t,s,n,!0),r=o(i,t,e);u.push(r)}}if(i)return u;{let s=o(e,t,u);return n?c(s):s}},c=e=>{const t=Object.assign({},e);t.children.filter((e=>"object"==typeof e&&e.props.type>0));for(const s of e.children)if("string"!=typeof s&&s.children.length>0)for(const e of c(s).children)"string"!=typeof e&&0!==e.props.type&&t.children.push(e);return t},u=(e,t={},s={},n=!0)=>new Function(...Object.keys(t),n?`return ${e}`:e).bind(s)(...Object.values(t)),p=(e,t,s=!0)=>u(e,{$el:t.$el},t.$state,s),d={BIND:({el:e,name:t,value:s,state:n})=>{switch(t.split(":")[1]){case"class":const i=p(s,{$state:n,$el:e});if("string"==typeof i)return e.setAttribute("class",`${e.className} ${i}`.trim());if(i instanceof Array)return e.setAttribute("class",`${e.className} ${i.join(" ")}`.trim());{const t=[];for(const e in i)i[e]&&t.push(e);return t.length>0?e.setAttribute("class",`${e.className} ${t.join(" ").trim()}`.trim()):e.className.trim().length>0?e.setAttribute("class",e.className):e.removeAttribute("class")}case"style":const r=p(s,{$state:n,$el:e});e.removeAttribute("style");for(const t in r)e.style[t]=r[t];break;default:const l=p(s,{$state:n,$el:e});l?e.setAttribute(t.split(":")[1],l):e.removeAttribute(t.split(":")[1])}},JOIN:({el:e,value:t,state:s})=>{const[n,i,r]=t.split(/ as | by /),l=p(n,{$state:s,$el:e});e["text"===i?"innerText":"innerHTML"]=l.join(r||"");b(Object.assign({},s)).mount(e,!0)},HTML:({el:e,value:t,state:s})=>{b(Object.assign({},s)).mount(e,!0);try{e.innerHTML=p(t,{$state:s,$el:e})}catch(s){e.innerHTML=t}},IF:({el:e,value:t,state:s})=>{p(t,{$state:s,$el:e})?e.style.removeProperty("display"):e.style.display="none"},MODEL:({el:e,value:t,state:s})=>{const n=e,i=p(t,{$state:s,$el:n});n.value!==i&&(n.value=i),n.oninput=()=>{const e="number"==typeof i&&!isNaN(n.value),r="boolean"==typeof i&&("true"===n.value||"false"===n.value),l=null==i&&("null"===n.value||"undefined"===n.value);let o;o=e?`Number('${n.value}').toPrecision()`:r?`Boolean('${n.value}')`:l?"null"===n.value?null:void 0:`'${n.value}'`,p(`${t} = ${o}`,{$state:s,$el:n},!1)}},ON:({el:e,name:t,value:s,state:n})=>{const[i,r]=t.split("."),l=i.split(":")[1],o=r||null;e[`on${l}`]=t=>{"prevent"===o&&t.preventDefault(),"stop"===o&&t.stopPropagation(),p(s,{$state:n,$el:e},!1)}},TEXT:({el:e,value:t,state:s})=>{try{e.innerHTML=p(t,{$state:s,$el:e})}catch(s){e.innerHTML=t}}},h=({el:e,name:t,value:n,state:i},r)=>{r[t.split(s)[0].toUpperCase()]({el:e,name:t,value:n,state:i})},f=(e,t,s,n)=>{if("length"===t){const t=Object.keys(s).filter((t=>{return s[t]instanceof Array&&(n=e,i=s[t],n instanceof Array&&i instanceof Array&&n.length===i.length&&n.every(((e,t)=>e===i[t])));var n,i}));return 0!==t.length&&n(t),!0}return n([t]),!1},m=(e,t)=>{const s={get:(e,t)=>"object"==typeof e[t]&&null!==e[t]?new Proxy(e[t],s):e[t],set:(s,n,i)=>(s[n]=i,f(s,n,e,t),!0),deleteProperty:(s,n)=>(delete s[n],f(s,n,e,t),!0)};return new Proxy(e,s)},v=(e,s={},n={},r)=>{let l=!1;if(e){r||(r=Object.keys(s)),"%LUCIA_COMPILE_REQUEST%"===r[0]&&(l=!0);for(let o of e.children)if("string"!=typeof o){if(o.props.type>t.STATIC){const{attributes:e,directives:a,ref:c,type:u}=o.props;let p=[];if(!l)for(const e in a){const t=a[e],n=1===u,l=r.some((e=>i(e).test(t.toString()))),o=Object.keys(s).some((e=>{const t=r.some((t=>i(t).test(s[e].toString())));return"function"==typeof s[e]&&t}));(n||l||o)&&p.push(e)}o.props.type=u===t.NEEDS_PATCH?t.STATIC:u;(l?Object.keys(a):p).map((t=>{const i=a[t],r=e.id?document.getElementById(e.id):c;h({el:r,name:t,value:i,state:s},Object.assign({},n))}))}o.children.length>0&&v(o,s,n,r)}}};class y{constructor(e={}){this.vdom=null,this.state=e,this.directives={},this.components={},this.mounted=!1}mount(e,t=!1){return this.vdom=this.compile("string"==typeof e?document.querySelector(e):e),t||(this.state=m(this.state,this.patch.bind(this)),this.directives=d),this.mounted=!0,this.patch(["%LUCIA_COMPILE_REQUEST%"]),this.state}component(e,t){this.components[e.toUpperCase()]=t}directive(e,t){this.directives[e.toUpperCase()]=t}patch(e){if(!this.mounted)throw new Error("App is not mounted.");v(this.vdom,this.state,this.directives,e)}compile(e){return a(e,this.state,this.components,!0)}}const b=e=>new y(e);exports.compile=a,exports.createApp=b,exports.directives=d,exports.h=r,exports.init=(e=document,t="use")=>{const s=[...e.querySelectorAll(`[${"l-"+t}]`)],n=[];return s.map((e=>{const s=e.getAttribute("l-"+t);if(null!==s)try{const t=b(u(s));t.mount(e),n.push(t)}catch(e){}})),n},exports.patch=v,exports.reactive=m,exports.renderDirective=h; |
const DIRECTIVE_PREFIX = 'l-'; | ||
const LUCIA_COMPILE_REQUEST = '%LUCIA_COMPILE_REQUEST%'; | ||
var DIRECTIVE_SHORTHANDS; | ||
(function (DIRECTIVE_SHORTHANDS) { | ||
DIRECTIVE_SHORTHANDS["@"] = "ON"; | ||
DIRECTIVE_SHORTHANDS[":"] = "BIND"; | ||
})(DIRECTIVE_SHORTHANDS || (DIRECTIVE_SHORTHANDS = {})); | ||
@@ -11,4 +16,10 @@ var VNodeTypes; | ||
const rawDirectiveSplitPattern = /:|\./; | ||
const selectorSplitPattern = /(?=\.)|(?=#)|(?=\[)/; | ||
const keyPattern = (key, hasThis = true) => { | ||
return new RegExp(`${hasThis ? 'this\\.' : ''}${key}\\b`); | ||
}; | ||
const h = (selector, children, props) => { | ||
const tokens = selector.split(/(?=\.)|(?=#)|(?=\[)/); | ||
const tokens = selector.split(selectorSplitPattern); | ||
const tag = tokens[0]; | ||
@@ -63,2 +74,5 @@ const attributes = Object.assign({}, props === null || props === void 0 ? void 0 : props.attributes); | ||
} | ||
else if (Object.keys(DIRECTIVE_SHORTHANDS).includes(name[0])) { | ||
directives[`${DIRECTIVE_SHORTHANDS[name[0]]}:${name.slice(1)}`] = value; | ||
} | ||
else { | ||
@@ -72,6 +86,2 @@ attributes[name] = value; | ||
const keyPattern = (key, hasThis = true) => { | ||
return new RegExp(`${hasThis ? 'this\\.' : ''}${key}\\b`); | ||
}; | ||
const createVNode = (el, state, children) => { | ||
@@ -117,3 +127,3 @@ const { attributes, directives } = props(el); | ||
} | ||
if (!strip || child.outerHTML.includes(` ${DIRECTIVE_PREFIX}`)) { | ||
if (!strip || container.outerHTML.includes(` ${DIRECTIVE_PREFIX}`)) { | ||
const compiledChildren = compile(container, state, components, strip, true); | ||
@@ -307,3 +317,3 @@ for (const componentChild of compiledChildren) { | ||
const renderDirective = ({ el, name, value, state }, directives) => { | ||
const rootName = name.split(/:|\./)[0]; | ||
const rootName = name.split(rawDirectiveSplitPattern)[0]; | ||
directives[rootName.toUpperCase()]({ el, name, value, state }); | ||
@@ -310,0 +320,0 @@ }; |
@@ -1,1 +0,1 @@ | ||
var e;!function(e){e[e.STATIC=0]="STATIC",e[e.NEEDS_PATCH=1]="NEEDS_PATCH",e[e.DYNAMIC=2]="DYNAMIC"}(e||(e={}));const t=(e,t,s)=>{const n=e.split(/(?=\.)|(?=#)|(?=\[)/),i=n[0],r=Object.assign({},null==s?void 0:s.attributes),l=Object.assign({},null==s?void 0:s.directives);if(n.length>1){n.shift();for(const e of n)switch(e[0]){case"#":r.id=e.slice(1);break;case".":r.className||(r.className=""),r.className+=`${e.slice(1)} `;break;case"[":const[t,s]=e.slice(1,-1).split("=");t.startsWith("l-")?l[t.slice("l-".length)]=s:r[t]=s}}return r.className&&(r.className=r.className.trim()),{tag:i,children:"string"==typeof t?[t]:t||[],props:{attributes:r,directives:l,ref:(null==s?void 0:s.ref)||void 0,type:(null==s?void 0:s.type)||0}}},s=e=>{const t={},s={};if(e.attributes)for(const{name:n,value:i}of[...e.attributes])n.startsWith("l-")?s[n.slice("l-".length)]=i:t[n]=i;return{attributes:t,directives:s}},n=(e,t=!0)=>new RegExp(`${t?"this\\.":""}${e}\\b`),i=(i,r,l)=>{const{attributes:o,directives:a}=s(i);let c=e.STATIC;const u=Object.keys(a).length>0,p=Object.values(a).some((e=>Object.keys(r).some((t=>n(t,!1).test(e)))));return u&&(c=e.NEEDS_PATCH),p&&(c=e.DYNAMIC),t(i.tagName.toLowerCase(),l,{attributes:o,directives:a,ref:c===e.STATIC||o.id?void 0:i,type:c})},r=(e,t={},n={},o=!1,a=!1)=>{var c;if(!e)throw new Error("Please provide a Element");const u=[],p=Array.prototype.slice.call(e.childNodes);for(const l of p)switch(l.nodeType){case Node.TEXT_NODE:!o&&l.nodeValue&&u.push(l.nodeValue);break;case Node.ELEMENT_NODE:if(Object.keys(n).includes(l.tagName)){const i=document.createElement("div"),a=n[l.tagName]({children:l.innerHTML,state:t});i.innerHTML=a;for(const[e,t]of Object.entries(s(l).directives))null===(c=i.firstElementChild)||void 0===c||c.setAttribute(`l-${e}`,t);if(!o||l.outerHTML.includes(" l-")){const e=r(i,t,n,o,!0);for(const t of e)u.push(t)}e.replaceChild(i.firstElementChild,l)}else if(!o||l.outerHTML.includes(" l-")){const e=r(l,t,n,o,!0),s=i(l,t,e);u.push(s)}}if(a)return u;{let s=i(e,t,u);return o?l(s):s}},l=e=>{const t=Object.assign({},e);t.children.filter((e=>"object"==typeof e&&e.props.type>0));for(const s of e.children)if("string"!=typeof s&&s.children.length>0)for(const e of l(s).children)"string"!=typeof e&&0!==e.props.type&&t.children.push(e);return t},o=(e,t={},s={},n=!0)=>new Function(...Object.keys(t),n?`return ${e}`:e).bind(s)(...Object.values(t)),a=(e,t,s=!0)=>o(e,{$el:t.$el},t.$state,s),c={BIND:({el:e,name:t,value:s,state:n})=>{switch(t.split(":")[1]){case"class":const i=a(s,{$state:n,$el:e});if("string"==typeof i)return e.setAttribute("class",`${e.className} ${i}`.trim());if(i instanceof Array)return e.setAttribute("class",`${e.className} ${i.join(" ")}`.trim());{const t=[];for(const e in i)i[e]&&t.push(e);return t.length>0?e.setAttribute("class",`${e.className} ${t.join(" ").trim()}`.trim()):e.className.trim().length>0?e.setAttribute("class",e.className):e.removeAttribute("class")}case"style":const r=a(s,{$state:n,$el:e});e.removeAttribute("style");for(const t in r)e.style[t]=r[t];break;default:const l=a(s,{$state:n,$el:e});l?e.setAttribute(t.split(":")[1],l):e.removeAttribute(t.split(":")[1])}},JOIN:({el:e,value:t,state:s})=>{const[n,i,r]=t.split(/ as | by /),l=a(n,{$state:s,$el:e});e["text"===i?"innerText":"innerHTML"]=l.join(r||"");m(Object.assign({},s)).mount(e,!0)},HTML:({el:e,value:t,state:s})=>{m(Object.assign({},s)).mount(e,!0);try{e.innerHTML=a(t,{$state:s,$el:e})}catch(s){e.innerHTML=t}},IF:({el:e,value:t,state:s})=>{a(t,{$state:s,$el:e})?e.style.removeProperty("display"):e.style.display="none"},MODEL:({el:e,value:t,state:s})=>{const n=e,i=a(t,{$state:s,$el:n});n.value!==i&&(n.value=i),n.oninput=()=>{const e="number"==typeof i&&!isNaN(n.value),r="boolean"==typeof i&&("true"===n.value||"false"===n.value),l=null==i&&("null"===n.value||"undefined"===n.value);let o;o=e?`Number('${n.value}').toPrecision()`:r?`Boolean('${n.value}')`:l?"null"===n.value?null:void 0:`'${n.value}'`,a(`${t} = ${o}`,{$state:s,$el:n},!1)}},ON:({el:e,name:t,value:s,state:n})=>{const[i,r]=t.split("."),l=i.split(":")[1],o=r||null;e[`on${l}`]=t=>{"prevent"===o&&t.preventDefault(),"stop"===o&&t.stopPropagation(),a(s,{$state:n,$el:e},!1)}},TEXT:({el:e,value:t,state:s})=>{try{e.innerHTML=a(t,{$state:s,$el:e})}catch(s){e.innerHTML=t}}},u=({el:e,name:t,value:s,state:n},i)=>{i[t.split(/:|\./)[0].toUpperCase()]({el:e,name:t,value:s,state:n})},p=(e,t,s,n)=>{if("length"===t){const t=Object.keys(s).filter((t=>{return s[t]instanceof Array&&(n=e,i=s[t],n instanceof Array&&i instanceof Array&&n.length===i.length&&n.every(((e,t)=>e===i[t])));var n,i}));return 0!==t.length&&n(t),!0}return n([t]),!1},h=(e,t)=>{const s={get:(e,t)=>"object"==typeof e[t]&&null!==e[t]?new Proxy(e[t],s):e[t],set:(s,n,i)=>(s[n]=i,p(s,n,e,t),!0),deleteProperty:(s,n)=>(delete s[n],p(s,n,e,t),!0)};return new Proxy(e,s)},d=(t,s={},i={},r)=>{let l=!1;if(t){r||(r=Object.keys(s)),"%LUCIA_COMPILE_REQUEST%"===r[0]&&(l=!0);for(let o of t.children)if("string"!=typeof o){if(o.props.type>e.STATIC){const{attributes:t,directives:a,ref:c,type:p}=o.props;let h=[];if(!l)for(const e in a){const t=a[e],i=1===p,l=r.some((e=>n(e).test(t.toString()))),o=Object.keys(s).some((e=>{const t=r.some((t=>n(t).test(s[e].toString())));return"function"==typeof s[e]&&t}));(i||l||o)&&h.push(e)}o.props.type=p===e.NEEDS_PATCH?e.STATIC:p;(l?Object.keys(a):h).map((e=>{const n=a[e],r=t.id?document.getElementById(t.id):c;u({el:r,name:e,value:n,state:s},Object.assign({},i))}))}o.children.length>0&&d(o,s,i,r)}}};class f{constructor(e={}){this.vdom=null,this.state=e,this.directives={},this.components={},this.mounted=!1}mount(e,t=!1){return this.vdom=this.compile("string"==typeof e?document.querySelector(e):e),t||(this.state=h(this.state,this.patch.bind(this)),this.directives=c),this.mounted=!0,this.patch(["%LUCIA_COMPILE_REQUEST%"]),this.state}component(e,t){this.components[e.toUpperCase()]=t}directive(e,t){this.directives[e.toUpperCase()]=t}patch(e){if(!this.mounted)throw new Error("App is not mounted.");d(this.vdom,this.state,this.directives,e)}compile(e){return r(e,this.state,this.components,!0)}}const m=e=>new f(e),v=(e=document,t="use")=>{const s=[...e.querySelectorAll(`[${"l-"+t}]`)],n=[];return s.map((e=>{const s=e.getAttribute("l-"+t);if(null!==s)try{const t=m(o(s));t.mount(e),n.push(t)}catch(e){}})),n};export{r as compile,m as createApp,c as directives,t as h,v as init,d as patch,h as reactive,u as renderDirective}; | ||
var e,t;!function(e){e["@"]="ON",e[":"]="BIND"}(e||(e={})),function(e){e[e.STATIC=0]="STATIC",e[e.NEEDS_PATCH=1]="NEEDS_PATCH",e[e.DYNAMIC=2]="DYNAMIC"}(t||(t={}));const s=/:|\./,n=/(?=\.)|(?=#)|(?=\[)/,i=(e,t=!0)=>new RegExp(`${t?"this\\.":""}${e}\\b`),r=(e,t,s)=>{const i=e.split(n),r=i[0],l=Object.assign({},null==s?void 0:s.attributes),o=Object.assign({},null==s?void 0:s.directives);if(i.length>1){i.shift();for(const e of i)switch(e[0]){case"#":l.id=e.slice(1);break;case".":l.className||(l.className=""),l.className+=`${e.slice(1)} `;break;case"[":const[t,s]=e.slice(1,-1).split("=");t.startsWith("l-")?o[t.slice("l-".length)]=s:l[t]=s}}return l.className&&(l.className=l.className.trim()),{tag:r,children:"string"==typeof t?[t]:t||[],props:{attributes:l,directives:o,ref:(null==s?void 0:s.ref)||void 0,type:(null==s?void 0:s.type)||0}}},l=t=>{const s={},n={};if(t.attributes)for(const{name:i,value:r}of[...t.attributes])i.startsWith("l-")?n[i.slice("l-".length)]=r:Object.keys(e).includes(i[0])?n[`${e[i[0]]}:${i.slice(1)}`]=r:s[i]=r;return{attributes:s,directives:n}},o=(e,s,n)=>{const{attributes:o,directives:a}=l(e);let c=t.STATIC;const u=Object.keys(a).length>0,p=Object.values(a).some((e=>Object.keys(s).some((t=>i(t,!1).test(e)))));return u&&(c=t.NEEDS_PATCH),p&&(c=t.DYNAMIC),r(e.tagName.toLowerCase(),n,{attributes:o,directives:a,ref:c===t.STATIC||o.id?void 0:e,type:c})},a=(e,t={},s={},n=!1,i=!1)=>{var r;if(!e)throw new Error("Please provide a Element");const u=[],p=Array.prototype.slice.call(e.childNodes);for(const i of p)switch(i.nodeType){case Node.TEXT_NODE:!n&&i.nodeValue&&u.push(i.nodeValue);break;case Node.ELEMENT_NODE:if(Object.keys(s).includes(i.tagName)){const o=document.createElement("div"),c=s[i.tagName]({children:i.innerHTML,state:t});o.innerHTML=c;for(const[e,t]of Object.entries(l(i).directives))null===(r=o.firstElementChild)||void 0===r||r.setAttribute(`l-${e}`,t);if(!n||o.outerHTML.includes(" l-")){const e=a(o,t,s,n,!0);for(const t of e)u.push(t)}e.replaceChild(o.firstElementChild,i)}else if(!n||i.outerHTML.includes(" l-")){const e=a(i,t,s,n,!0),r=o(i,t,e);u.push(r)}}if(i)return u;{let s=o(e,t,u);return n?c(s):s}},c=e=>{const t=Object.assign({},e);t.children.filter((e=>"object"==typeof e&&e.props.type>0));for(const s of e.children)if("string"!=typeof s&&s.children.length>0)for(const e of c(s).children)"string"!=typeof e&&0!==e.props.type&&t.children.push(e);return t},u=(e,t={},s={},n=!0)=>new Function(...Object.keys(t),n?`return ${e}`:e).bind(s)(...Object.values(t)),p=(e,t,s=!0)=>u(e,{$el:t.$el},t.$state,s),d={BIND:({el:e,name:t,value:s,state:n})=>{switch(t.split(":")[1]){case"class":const i=p(s,{$state:n,$el:e});if("string"==typeof i)return e.setAttribute("class",`${e.className} ${i}`.trim());if(i instanceof Array)return e.setAttribute("class",`${e.className} ${i.join(" ")}`.trim());{const t=[];for(const e in i)i[e]&&t.push(e);return t.length>0?e.setAttribute("class",`${e.className} ${t.join(" ").trim()}`.trim()):e.className.trim().length>0?e.setAttribute("class",e.className):e.removeAttribute("class")}case"style":const r=p(s,{$state:n,$el:e});e.removeAttribute("style");for(const t in r)e.style[t]=r[t];break;default:const l=p(s,{$state:n,$el:e});l?e.setAttribute(t.split(":")[1],l):e.removeAttribute(t.split(":")[1])}},JOIN:({el:e,value:t,state:s})=>{const[n,i,r]=t.split(/ as | by /),l=p(n,{$state:s,$el:e});e["text"===i?"innerText":"innerHTML"]=l.join(r||"");b(Object.assign({},s)).mount(e,!0)},HTML:({el:e,value:t,state:s})=>{b(Object.assign({},s)).mount(e,!0);try{e.innerHTML=p(t,{$state:s,$el:e})}catch(s){e.innerHTML=t}},IF:({el:e,value:t,state:s})=>{p(t,{$state:s,$el:e})?e.style.removeProperty("display"):e.style.display="none"},MODEL:({el:e,value:t,state:s})=>{const n=e,i=p(t,{$state:s,$el:n});n.value!==i&&(n.value=i),n.oninput=()=>{const e="number"==typeof i&&!isNaN(n.value),r="boolean"==typeof i&&("true"===n.value||"false"===n.value),l=null==i&&("null"===n.value||"undefined"===n.value);let o;o=e?`Number('${n.value}').toPrecision()`:r?`Boolean('${n.value}')`:l?"null"===n.value?null:void 0:`'${n.value}'`,p(`${t} = ${o}`,{$state:s,$el:n},!1)}},ON:({el:e,name:t,value:s,state:n})=>{const[i,r]=t.split("."),l=i.split(":")[1],o=r||null;e[`on${l}`]=t=>{"prevent"===o&&t.preventDefault(),"stop"===o&&t.stopPropagation(),p(s,{$state:n,$el:e},!1)}},TEXT:({el:e,value:t,state:s})=>{try{e.innerHTML=p(t,{$state:s,$el:e})}catch(s){e.innerHTML=t}}},h=({el:e,name:t,value:n,state:i},r)=>{r[t.split(s)[0].toUpperCase()]({el:e,name:t,value:n,state:i})},f=(e,t,s,n)=>{if("length"===t){const t=Object.keys(s).filter((t=>{return s[t]instanceof Array&&(n=e,i=s[t],n instanceof Array&&i instanceof Array&&n.length===i.length&&n.every(((e,t)=>e===i[t])));var n,i}));return 0!==t.length&&n(t),!0}return n([t]),!1},m=(e,t)=>{const s={get:(e,t)=>"object"==typeof e[t]&&null!==e[t]?new Proxy(e[t],s):e[t],set:(s,n,i)=>(s[n]=i,f(s,n,e,t),!0),deleteProperty:(s,n)=>(delete s[n],f(s,n,e,t),!0)};return new Proxy(e,s)},v=(e,s={},n={},r)=>{let l=!1;if(e){r||(r=Object.keys(s)),"%LUCIA_COMPILE_REQUEST%"===r[0]&&(l=!0);for(let o of e.children)if("string"!=typeof o){if(o.props.type>t.STATIC){const{attributes:e,directives:a,ref:c,type:u}=o.props;let p=[];if(!l)for(const e in a){const t=a[e],n=1===u,l=r.some((e=>i(e).test(t.toString()))),o=Object.keys(s).some((e=>{const t=r.some((t=>i(t).test(s[e].toString())));return"function"==typeof s[e]&&t}));(n||l||o)&&p.push(e)}o.props.type=u===t.NEEDS_PATCH?t.STATIC:u;(l?Object.keys(a):p).map((t=>{const i=a[t],r=e.id?document.getElementById(e.id):c;h({el:r,name:t,value:i,state:s},Object.assign({},n))}))}o.children.length>0&&v(o,s,n,r)}}};class y{constructor(e={}){this.vdom=null,this.state=e,this.directives={},this.components={},this.mounted=!1}mount(e,t=!1){return this.vdom=this.compile("string"==typeof e?document.querySelector(e):e),t||(this.state=m(this.state,this.patch.bind(this)),this.directives=d),this.mounted=!0,this.patch(["%LUCIA_COMPILE_REQUEST%"]),this.state}component(e,t){this.components[e.toUpperCase()]=t}directive(e,t){this.directives[e.toUpperCase()]=t}patch(e){if(!this.mounted)throw new Error("App is not mounted.");v(this.vdom,this.state,this.directives,e)}compile(e){return a(e,this.state,this.components,!0)}}const b=e=>new y(e),$=(e=document,t="use")=>{const s=[...e.querySelectorAll(`[${"l-"+t}]`)],n=[];return s.map((e=>{const s=e.getAttribute("l-"+t);if(null!==s)try{const t=b(u(s));t.mount(e),n.push(t)}catch(e){}})),n};export{a as compile,b as createApp,d as directives,r as h,$ as init,v as patch,m as reactive,h as renderDirective}; |
@@ -9,2 +9,7 @@ (function (global, factory) { | ||
const LUCIA_COMPILE_REQUEST = '%LUCIA_COMPILE_REQUEST%'; | ||
var DIRECTIVE_SHORTHANDS; | ||
(function (DIRECTIVE_SHORTHANDS) { | ||
DIRECTIVE_SHORTHANDS["@"] = "ON"; | ||
DIRECTIVE_SHORTHANDS[":"] = "BIND"; | ||
})(DIRECTIVE_SHORTHANDS || (DIRECTIVE_SHORTHANDS = {})); | ||
@@ -18,4 +23,10 @@ var VNodeTypes; | ||
const rawDirectiveSplitPattern = /:|\./; | ||
const selectorSplitPattern = /(?=\.)|(?=#)|(?=\[)/; | ||
const keyPattern = (key, hasThis = true) => { | ||
return new RegExp(`${hasThis ? 'this\\.' : ''}${key}\\b`); | ||
}; | ||
const h = (selector, children, props) => { | ||
const tokens = selector.split(/(?=\.)|(?=#)|(?=\[)/); | ||
const tokens = selector.split(selectorSplitPattern); | ||
const tag = tokens[0]; | ||
@@ -70,2 +81,5 @@ const attributes = Object.assign({}, props === null || props === void 0 ? void 0 : props.attributes); | ||
} | ||
else if (Object.keys(DIRECTIVE_SHORTHANDS).includes(name[0])) { | ||
directives[`${DIRECTIVE_SHORTHANDS[name[0]]}:${name.slice(1)}`] = value; | ||
} | ||
else { | ||
@@ -79,6 +93,2 @@ attributes[name] = value; | ||
const keyPattern = (key, hasThis = true) => { | ||
return new RegExp(`${hasThis ? 'this\\.' : ''}${key}\\b`); | ||
}; | ||
const createVNode = (el, state, children) => { | ||
@@ -124,3 +134,3 @@ const { attributes, directives } = props(el); | ||
} | ||
if (!strip || child.outerHTML.includes(` ${DIRECTIVE_PREFIX}`)) { | ||
if (!strip || container.outerHTML.includes(` ${DIRECTIVE_PREFIX}`)) { | ||
const compiledChildren = compile(container, state, components, strip, true); | ||
@@ -314,3 +324,3 @@ for (const componentChild of compiledChildren) { | ||
const renderDirective = ({ el, name, value, state }, directives) => { | ||
const rootName = name.split(/:|\./)[0]; | ||
const rootName = name.split(rawDirectiveSplitPattern)[0]; | ||
directives[rootName.toUpperCase()]({ el, name, value, state }); | ||
@@ -317,0 +327,0 @@ }; |
@@ -1,1 +0,1 @@ | ||
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e="undefined"!=typeof globalThis?globalThis:e||self).Lucia=t()}(this,(function(){"use strict";const e="l-",t="%LUCIA_COMPILE_REQUEST%";var s;!function(e){e[e.STATIC=0]="STATIC",e[e.NEEDS_PATCH=1]="NEEDS_PATCH",e[e.DYNAMIC=2]="DYNAMIC"}(s||(s={}));const n=(t,s,n)=>{const i=t.split(/(?=\.)|(?=#)|(?=\[)/),r=i[0],o=Object.assign({},null==n?void 0:n.attributes),l=Object.assign({},null==n?void 0:n.directives);if(i.length>1){i.shift();for(const t of i)switch(t[0]){case"#":o.id=t.slice(1);break;case".":o.className||(o.className=""),o.className+=`${t.slice(1)} `;break;case"[":const[s,n]=t.slice(1,-1).split("=");s.startsWith(e)?l[s.slice(e.length)]=n:o[s]=n}}return o.className&&(o.className=o.className.trim()),{tag:r,children:"string"==typeof s?[s]:s||[],props:{attributes:o,directives:l,ref:(null==n?void 0:n.ref)||void 0,type:(null==n?void 0:n.type)||0}}},i=t=>{const s={},n={};if(t.attributes)for(const{name:i,value:r}of[...t.attributes])i.startsWith(e)?n[i.slice(e.length)]=r:s[i]=r;return{attributes:s,directives:n}},r=(e,t=!0)=>new RegExp(`${t?"this\\.":""}${e}\\b`),o=(e,t,o)=>{const{attributes:l,directives:a}=i(e);let c=s.STATIC;const u=Object.keys(a).length>0,p=Object.values(a).some((e=>Object.keys(t).some((t=>r(t,!1).test(e)))));return u&&(c=s.NEEDS_PATCH),p&&(c=s.DYNAMIC),n(e.tagName.toLowerCase(),o,{attributes:l,directives:a,ref:c===s.STATIC||l.id?void 0:e,type:c})},l=(e,t={},s={},n=!1,r=!1)=>{var c;if(!e)throw new Error("Please provide a Element");const u=[],p=Array.prototype.slice.call(e.childNodes);for(const r of p)switch(r.nodeType){case Node.TEXT_NODE:!n&&r.nodeValue&&u.push(r.nodeValue);break;case Node.ELEMENT_NODE:if(Object.keys(s).includes(r.tagName)){const o=document.createElement("div"),a=s[r.tagName]({children:r.innerHTML,state:t});o.innerHTML=a;for(const[e,t]of Object.entries(i(r).directives))null===(c=o.firstElementChild)||void 0===c||c.setAttribute(`l-${e}`,t);if(!n||r.outerHTML.includes(" l-")){const e=l(o,t,s,n,!0);for(const t of e)u.push(t)}e.replaceChild(o.firstElementChild,r)}else if(!n||r.outerHTML.includes(" l-")){const e=l(r,t,s,n,!0),i=o(r,t,e);u.push(i)}}if(r)return u;{let s=o(e,t,u);return n?a(s):s}},a=e=>{const t=Object.assign({},e);t.children.filter((e=>"object"==typeof e&&e.props.type>0));for(const s of e.children)if("string"!=typeof s&&s.children.length>0)for(const e of a(s).children)"string"!=typeof e&&0!==e.props.type&&t.children.push(e);return t},c=(e,t={},s={},n=!0)=>new Function(...Object.keys(t),n?`return ${e}`:e).bind(s)(...Object.values(t)),u=(e,t,s=!0)=>c(e,{$el:t.$el},t.$state,s),p={BIND:({el:e,name:t,value:s,state:n})=>{switch(t.split(":")[1]){case"class":const i=u(s,{$state:n,$el:e});if("string"==typeof i)return e.setAttribute("class",`${e.className} ${i}`.trim());if(i instanceof Array)return e.setAttribute("class",`${e.className} ${i.join(" ")}`.trim());{const t=[];for(const e in i)i[e]&&t.push(e);return t.length>0?e.setAttribute("class",`${e.className} ${t.join(" ").trim()}`.trim()):e.className.trim().length>0?e.setAttribute("class",e.className):e.removeAttribute("class")}case"style":const r=u(s,{$state:n,$el:e});e.removeAttribute("style");for(const t in r)e.style[t]=r[t];break;default:const o=u(s,{$state:n,$el:e});o?e.setAttribute(t.split(":")[1],o):e.removeAttribute(t.split(":")[1])}},JOIN:({el:e,value:t,state:s})=>{const[n,i,r]=t.split(/ as | by /),o=u(n,{$state:s,$el:e});e["text"===i?"innerText":"innerHTML"]=o.join(r||"");y(Object.assign({},s)).mount(e,!0)},HTML:({el:e,value:t,state:s})=>{y(Object.assign({},s)).mount(e,!0);try{e.innerHTML=u(t,{$state:s,$el:e})}catch(s){e.innerHTML=t}},IF:({el:e,value:t,state:s})=>{u(t,{$state:s,$el:e})?e.style.removeProperty("display"):e.style.display="none"},MODEL:({el:e,value:t,state:s})=>{const n=e,i=u(t,{$state:s,$el:n});n.value!==i&&(n.value=i),n.oninput=()=>{const e="number"==typeof i&&!isNaN(n.value),r="boolean"==typeof i&&("true"===n.value||"false"===n.value),o=null==i&&("null"===n.value||"undefined"===n.value);let l;l=e?`Number('${n.value}').toPrecision()`:r?`Boolean('${n.value}')`:o?"null"===n.value?null:void 0:`'${n.value}'`,u(`${t} = ${l}`,{$state:s,$el:n},!1)}},ON:({el:e,name:t,value:s,state:n})=>{const[i,r]=t.split("."),o=i.split(":")[1],l=r||null;e[`on${o}`]=t=>{"prevent"===l&&t.preventDefault(),"stop"===l&&t.stopPropagation(),u(s,{$state:n,$el:e},!1)}},TEXT:({el:e,value:t,state:s})=>{try{e.innerHTML=u(t,{$state:s,$el:e})}catch(s){e.innerHTML=t}}},d=({el:e,name:t,value:s,state:n},i)=>{i[t.split(/:|\./)[0].toUpperCase()]({el:e,name:t,value:s,state:n})},f=(e,t,s,n)=>{if("length"===t){const t=Object.keys(s).filter((t=>{return s[t]instanceof Array&&(n=e,i=s[t],n instanceof Array&&i instanceof Array&&n.length===i.length&&n.every(((e,t)=>e===i[t])));var n,i}));return 0!==t.length&&n(t),!0}return n([t]),!1},h=(e,t)=>{const s={get:(e,t)=>"object"==typeof e[t]&&null!==e[t]?new Proxy(e[t],s):e[t],set:(s,n,i)=>(s[n]=i,f(s,n,e,t),!0),deleteProperty:(s,n)=>(delete s[n],f(s,n,e,t),!0)};return new Proxy(e,s)},m=(e,n={},i={},o)=>{let l=!1;if(e){o||(o=Object.keys(n)),o[0]===t&&(l=!0);for(let t of e.children)if("string"!=typeof t){if(t.props.type>s.STATIC){const{attributes:e,directives:a,ref:c,type:u}=t.props;let p=[];if(!l)for(const e in a){const t=a[e],s=1===u,i=o.some((e=>r(e).test(t.toString()))),l=Object.keys(n).some((e=>{const t=o.some((t=>r(t).test(n[e].toString())));return"function"==typeof n[e]&&t}));(s||i||l)&&p.push(e)}t.props.type=u===s.NEEDS_PATCH?s.STATIC:u;(l?Object.keys(a):p).map((t=>{const s=a[t],r=e.id?document.getElementById(e.id):c;d({el:r,name:t,value:s,state:n},Object.assign({},i))}))}t.children.length>0&&m(t,n,i,o)}}};class v{constructor(e={}){this.vdom=null,this.state=e,this.directives={},this.components={},this.mounted=!1}mount(e,s=!1){return this.vdom=this.compile("string"==typeof e?document.querySelector(e):e),s||(this.state=h(this.state,this.patch.bind(this)),this.directives=p),this.mounted=!0,this.patch([t]),this.state}component(e,t){this.components[e.toUpperCase()]=t}directive(e,t){this.directives[e.toUpperCase()]=t}patch(e){if(!this.mounted)throw new Error("App is not mounted.");m(this.vdom,this.state,this.directives,e)}compile(e){return l(e,this.state,this.components,!0)}}const y=e=>new v(e),b=(t=document,s="use")=>{const n=[...t.querySelectorAll(`[${e+s}]`)],i=[];return n.map((t=>{const n=t.getAttribute(e+s);if(null!==n)try{const e=y(c(n));e.mount(t),i.push(e)}catch(e){}})),i};var $=Object.freeze({__proto__:null,createApp:y,h:n,compile:l,patch:m,reactive:h,directives:p,renderDirective:d,init:b});return document.addEventListener("DOMContentLoaded",(()=>b(document,"init"))),$})); | ||
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e="undefined"!=typeof globalThis?globalThis:e||self).Lucia=t()}(this,(function(){"use strict";const e="l-",t="%LUCIA_COMPILE_REQUEST%";var s,n;!function(e){e["@"]="ON",e[":"]="BIND"}(s||(s={})),function(e){e[e.STATIC=0]="STATIC",e[e.NEEDS_PATCH=1]="NEEDS_PATCH",e[e.DYNAMIC=2]="DYNAMIC"}(n||(n={}));const i=/:|\./,r=/(?=\.)|(?=#)|(?=\[)/,o=(e,t=!0)=>new RegExp(`${t?"this\\.":""}${e}\\b`),l=(t,s,n)=>{const i=t.split(r),o=i[0],l=Object.assign({},null==n?void 0:n.attributes),a=Object.assign({},null==n?void 0:n.directives);if(i.length>1){i.shift();for(const t of i)switch(t[0]){case"#":l.id=t.slice(1);break;case".":l.className||(l.className=""),l.className+=`${t.slice(1)} `;break;case"[":const[s,n]=t.slice(1,-1).split("=");s.startsWith(e)?a[s.slice(e.length)]=n:l[s]=n}}return l.className&&(l.className=l.className.trim()),{tag:o,children:"string"==typeof s?[s]:s||[],props:{attributes:l,directives:a,ref:(null==n?void 0:n.ref)||void 0,type:(null==n?void 0:n.type)||0}}},a=t=>{const n={},i={};if(t.attributes)for(const{name:r,value:o}of[...t.attributes])r.startsWith(e)?i[r.slice(e.length)]=o:Object.keys(s).includes(r[0])?i[`${s[r[0]]}:${r.slice(1)}`]=o:n[r]=o;return{attributes:n,directives:i}},c=(e,t,s)=>{const{attributes:i,directives:r}=a(e);let c=n.STATIC;const u=Object.keys(r).length>0,p=Object.values(r).some((e=>Object.keys(t).some((t=>o(t,!1).test(e)))));return u&&(c=n.NEEDS_PATCH),p&&(c=n.DYNAMIC),l(e.tagName.toLowerCase(),s,{attributes:i,directives:r,ref:c===n.STATIC||i.id?void 0:e,type:c})},u=(e,t={},s={},n=!1,i=!1)=>{var r;if(!e)throw new Error("Please provide a Element");const o=[],l=Array.prototype.slice.call(e.childNodes);for(const i of l)switch(i.nodeType){case Node.TEXT_NODE:!n&&i.nodeValue&&o.push(i.nodeValue);break;case Node.ELEMENT_NODE:if(Object.keys(s).includes(i.tagName)){const l=document.createElement("div"),c=s[i.tagName]({children:i.innerHTML,state:t});l.innerHTML=c;for(const[e,t]of Object.entries(a(i).directives))null===(r=l.firstElementChild)||void 0===r||r.setAttribute(`l-${e}`,t);if(!n||l.outerHTML.includes(" l-")){const e=u(l,t,s,n,!0);for(const t of e)o.push(t)}e.replaceChild(l.firstElementChild,i)}else if(!n||i.outerHTML.includes(" l-")){const e=u(i,t,s,n,!0),r=c(i,t,e);o.push(r)}}if(i)return o;{let s=c(e,t,o);return n?p(s):s}},p=e=>{const t=Object.assign({},e);t.children.filter((e=>"object"==typeof e&&e.props.type>0));for(const s of e.children)if("string"!=typeof s&&s.children.length>0)for(const e of p(s).children)"string"!=typeof e&&0!==e.props.type&&t.children.push(e);return t},d=(e,t={},s={},n=!0)=>new Function(...Object.keys(t),n?`return ${e}`:e).bind(s)(...Object.values(t)),f=(e,t,s=!0)=>d(e,{$el:t.$el},t.$state,s),h={BIND:({el:e,name:t,value:s,state:n})=>{switch(t.split(":")[1]){case"class":const i=f(s,{$state:n,$el:e});if("string"==typeof i)return e.setAttribute("class",`${e.className} ${i}`.trim());if(i instanceof Array)return e.setAttribute("class",`${e.className} ${i.join(" ")}`.trim());{const t=[];for(const e in i)i[e]&&t.push(e);return t.length>0?e.setAttribute("class",`${e.className} ${t.join(" ").trim()}`.trim()):e.className.trim().length>0?e.setAttribute("class",e.className):e.removeAttribute("class")}case"style":const r=f(s,{$state:n,$el:e});e.removeAttribute("style");for(const t in r)e.style[t]=r[t];break;default:const o=f(s,{$state:n,$el:e});o?e.setAttribute(t.split(":")[1],o):e.removeAttribute(t.split(":")[1])}},JOIN:({el:e,value:t,state:s})=>{const[n,i,r]=t.split(/ as | by /),o=f(n,{$state:s,$el:e});e["text"===i?"innerText":"innerHTML"]=o.join(r||"");g(Object.assign({},s)).mount(e,!0)},HTML:({el:e,value:t,state:s})=>{g(Object.assign({},s)).mount(e,!0);try{e.innerHTML=f(t,{$state:s,$el:e})}catch(s){e.innerHTML=t}},IF:({el:e,value:t,state:s})=>{f(t,{$state:s,$el:e})?e.style.removeProperty("display"):e.style.display="none"},MODEL:({el:e,value:t,state:s})=>{const n=e,i=f(t,{$state:s,$el:n});n.value!==i&&(n.value=i),n.oninput=()=>{const e="number"==typeof i&&!isNaN(n.value),r="boolean"==typeof i&&("true"===n.value||"false"===n.value),o=null==i&&("null"===n.value||"undefined"===n.value);let l;l=e?`Number('${n.value}').toPrecision()`:r?`Boolean('${n.value}')`:o?"null"===n.value?null:void 0:`'${n.value}'`,f(`${t} = ${l}`,{$state:s,$el:n},!1)}},ON:({el:e,name:t,value:s,state:n})=>{const[i,r]=t.split("."),o=i.split(":")[1],l=r||null;e[`on${o}`]=t=>{"prevent"===l&&t.preventDefault(),"stop"===l&&t.stopPropagation(),f(s,{$state:n,$el:e},!1)}},TEXT:({el:e,value:t,state:s})=>{try{e.innerHTML=f(t,{$state:s,$el:e})}catch(s){e.innerHTML=t}}},m=({el:e,name:t,value:s,state:n},r)=>{r[t.split(i)[0].toUpperCase()]({el:e,name:t,value:s,state:n})},v=(e,t,s,n)=>{if("length"===t){const t=Object.keys(s).filter((t=>{return s[t]instanceof Array&&(n=e,i=s[t],n instanceof Array&&i instanceof Array&&n.length===i.length&&n.every(((e,t)=>e===i[t])));var n,i}));return 0!==t.length&&n(t),!0}return n([t]),!1},y=(e,t)=>{const s={get:(e,t)=>"object"==typeof e[t]&&null!==e[t]?new Proxy(e[t],s):e[t],set:(s,n,i)=>(s[n]=i,v(s,n,e,t),!0),deleteProperty:(s,n)=>(delete s[n],v(s,n,e,t),!0)};return new Proxy(e,s)},b=(e,s={},i={},r)=>{let l=!1;if(e){r||(r=Object.keys(s)),r[0]===t&&(l=!0);for(let t of e.children)if("string"!=typeof t){if(t.props.type>n.STATIC){const{attributes:e,directives:a,ref:c,type:u}=t.props;let p=[];if(!l)for(const e in a){const t=a[e],n=1===u,i=r.some((e=>o(e).test(t.toString()))),l=Object.keys(s).some((e=>{const t=r.some((t=>o(t).test(s[e].toString())));return"function"==typeof s[e]&&t}));(n||i||l)&&p.push(e)}t.props.type=u===n.NEEDS_PATCH?n.STATIC:u;(l?Object.keys(a):p).map((t=>{const n=a[t],r=e.id?document.getElementById(e.id):c;m({el:r,name:t,value:n,state:s},Object.assign({},i))}))}t.children.length>0&&b(t,s,i,r)}}};class ${constructor(e={}){this.vdom=null,this.state=e,this.directives={},this.components={},this.mounted=!1}mount(e,s=!1){return this.vdom=this.compile("string"==typeof e?document.querySelector(e):e),s||(this.state=y(this.state,this.patch.bind(this)),this.directives=h),this.mounted=!0,this.patch([t]),this.state}component(e,t){this.components[e.toUpperCase()]=t}directive(e,t){this.directives[e.toUpperCase()]=t}patch(e){if(!this.mounted)throw new Error("App is not mounted.");b(this.vdom,this.state,this.directives,e)}compile(e){return u(e,this.state,this.components,!0)}}const g=e=>new $(e),T=(t=document,s="use")=>{const n=[...t.querySelectorAll(`[${e+s}]`)],i=[];return n.map((t=>{const n=t.getAttribute(e+s);if(null!==n)try{const e=g(d(n));e.mount(t),i.push(e)}catch(e){}})),i};var N=Object.freeze({__proto__:null,createApp:g,h:l,compile:u,patch:b,reactive:y,directives:h,renderDirective:m,init:T});return document.addEventListener("DOMContentLoaded",(()=>T(document,"init"))),N})); |
export declare const DIRECTIVE_PREFIX = "l-"; | ||
export declare const LUCIA_COMPILE_REQUEST = "%LUCIA_COMPILE_REQUEST%"; | ||
export declare enum DIRECTIVE_SHORTHANDS { | ||
'@' = "ON", | ||
':' = "BIND" | ||
} | ||
export declare type UnknownKV = Record<string, unknown>; | ||
export declare type StringKV = Record<string, string>; |
{ | ||
"name": "lucia", | ||
"version": "0.3.4", | ||
"version": "0.3.5", | ||
"description": "A tiny 3kb JavaScript library for prototyping web applications.", | ||
@@ -54,3 +54,3 @@ "main": "dist/lucia.cjs.js", | ||
"@rollup/plugin-commonjs": "17.0.0", | ||
"@rollup/plugin-node-resolve": "11.0.0", | ||
"@rollup/plugin-node-resolve": "11.0.1", | ||
"@size-limit/preset-app": "^4.9.1", | ||
@@ -62,3 +62,3 @@ "@testing-library/dom": "^7.28.1", | ||
"prettier": "^2.1.2", | ||
"rollup": "2.34.2", | ||
"rollup": "2.35.1", | ||
"rollup-plugin-terser": "^7.0.2", | ||
@@ -65,0 +65,0 @@ "rollup-plugin-typescript2": "^0.29.0", |
192928
3515